SITEINFO を書くブックマークレット。出来は微妙。ソース汚い┐(´ー｀)┌

SITEINFO_writer_bml.js

javascript:/*SITEINFO_Writer*/(function(){
	if ($("sw-exit")) $("sw-exit").click();

	var htmlsrc = 
	['<div id="sw-container" style="bottom: 0px;">'
	,'	<div id="sw-toolbar">'
	,'		<input id="sw-json" type="button" value="JSON"/>'
	,'		<input id="sw-updown" type="button" value="Up/Down"/>'
	,'		<input id="sw-exit" type="button" value="Exit"/>'
	,'	</div>'
	,'	<table id="sw-table" border="1">'
	,'		<tr>'
	,'			<td width="10">url</td>'
	,'			<td><input id="sw-url-input" type="text" /></td>'
	,'			<td width="10"><span id="sw-url-ok"></td>'
	,'			<td width="10"></td>'
	,'		</tr>'
	,'		<tr>'
	,'			<td>nextLink</td>'
	,'			<td><input id="sw-nextLink-input" type="text" /></td>'
	,'			<td><input id="sw-nextLink-check" type="button" value="Check"/></td>'
	,'			<td><input id="sw-nextLink-xpath" type="button" value="\u8ABF\u67FB"/></td>'
	,'		</tr>'
	,'		<tr>'
	,'			<td>pageElement</td>'
	,'			<td><input id="sw-pageElement-input" type="text" /></td>'
	,'			<td><input id="sw-pageElement-check" type="button" value="Check"/></td>'
	,'			<td><input id="sw-pageElement-xpath" type="button" value="\u8ABF\u67FB"/></td>'
	,'		</tr>'
	,'		<tr>'
	,'			<td>insertBefore</td>'
	,'			<td><input id="sw-insertBefore-input" type="text" /></td>'
	,'			<td><input id="sw-insertBefore-check" type="button" value="Check"/></td>'
	,'			<td><input id="sw-insertBefore-xpath" type="button" value="\u8ABF\u67FB"/></td>'
	,'		</tr>'
	,'	</table>'
	,'	<style type="text/css">'
	,'		#sw-container {'
	,'			position: fixed !important; z-index: 20000 !important; right: 0px; width: 100%;'
	,'		}'
	,'		#sw-container, #sw-container td {'
	,'			font-size: 12px !important;'
	,'			text-align: left !important;'
	,'			background: azure !important;'
	,'			color: black !important;'
	,'		}'
	,'		#sw-table { width: 100%; height: 100%;}'
	,'		#sw-container input[type="text"] { width: 100%; font-family: monospace; }'
	,'		#sw-container input[type="button"] { padding: 0px; margin: 0px 2px; }'
	,'	</style>'
	,'</div>'
	].join('');

	document.body.appendChild(str2dom(htmlsrc));

	var swContainer = $("sw-container");

	$("sw-json").onclick = function(event) {
		if (event.button != 0) return;
		var json = "{\n";
		json += "\turl          : '" + $('sw-url-input').value + "'\n";
		json += "\t,nextLink    : '" + $('sw-nextLink-input').value + "'\n";
		json += "\t,pageElement : '" + $('sw-pageElement-input').value + "'\n";
		if ($('sw-insertBefore-input').value)
			json += "\t,insertBefore: '" + $('sw-insertBefore-input').value + "'\n";
		json += "\t,exampleUrl  : '" + location.href + "'\n";
		json += "}";
		alert(json);
	};

	$("sw-updown").onclick = function(event) {
		if (event.button != 0) return;
		var s = swContainer.style;
		if (s.bottom) {
			s.bottom = "";
			s.top = "0px";
		} else {
			s.bottom = "0px";
			s.top = "";
		}
	};

	$("sw-exit").onclick = function(event) {
		if (event.button != 0) return;
		swContainer.parentNode.removeChild(swContainer)
	};

	var urltimer = null;
	var urlok = $('sw-url-ok');
	var urlinput = $('sw-url-input');
	urlinput.value = "^" + location.href.replace(/[()\[\]{}|+.,^$?\\]/g, '\\\\$&');
	urlinput.addEventListener("input", function(event) {
		clearTimeout(urltimer);
		urltimer = setTimeout(function(){
			try {
				urlok.textContent = new RegExp(urlinput.value.replace(/\\\\/g, "\\")).test(location.href)? "OK" : "NG";
			} catch(e) {
				urlok.textContent = "Error";
			}
		}, 100);
	}, false);

	$("sw-nextLink-xpath").onclick = 
	$("sw-pageElement-xpath").onclick = 
	$("sw-insertBefore-xpath").onclick = function(event) {
		new Inspector($("sw-" + event.currentTarget.id.split("-")[1] + "-input"));
	};

	$("sw-nextLink-check").onclick = 
	$("sw-pageElement-check").onclick = 
	$("sw-insertBefore-check").onclick = function(event) {
		var input = $("sw-" + event.currentTarget.id.split("-")[1] + "-input");
		if (!input || !input.value) return;
		new XPathChecker(input, event.currentTarget);
	};


function XPathChecker(inputElement, buttonElement) {
	this.xpath = inputElement.value;
	this.type = inputElement.id.split("-")[1];
	this.button = buttonElement;
	this.init();
};
XPathChecker.prototype = {
	colors: {
		nextLink: "blue",
		pageElement: "red",
		insertBefore: "gold"
	},
	timer: null,
	init: function() {
		try {
			var elements = $X(this.xpath);
		} catch(e) {
			return this.button.setAttribute("value", "Error");
		};

		this.button.setAttribute("value", elements.length + " length");
		if (elements.length == 0) return;

		for (var i = 0, len = elements.length; i < len; i++) {
			var node = elements[i];
			if (node.nodeType !== 1) continue;
			if (!("orgcss" in node))
				node.orgcss = node.style.cssText;
			node.style.outline = this.colors[this.type] + " 2px solid";
			node.style.outlineOffset = "-1px";
		};
		clearTimeout(this.timer);
		this.timer = setTimeout(function() {
			for (var i = 0, len = elements.length; i < len; i++) {
				var node = elements[i];
				if (node.nodeType !== 1) continue;
				if ("orgcss" in node) {
					node.orgcss?
						node.style.cssText = node.orgcss:
						node.removeAttribute("style");
					delete node.orgcss;
				}
			};
		}, 5000);
	},
};

function Inspector(inputElement) {
	this.inputElement = inputElement;
	this.init();
}
Inspector.prototype = {
	init : function(){
		document.addEventListener('mousedown', this, true);
		document.addEventListener('click', this, true);
		document.addEventListener('mouseover', this, true);
	},
	uninit : function(){
		var self = this;
		document.removeEventListener('mouseover', this, true);
		setTimeout(function(){
			document.removeEventListener('mousedown', self, true);
			document.removeEventListener('click', self, true);
		}, 500);
	},
	handleEvent : function(event){
		switch(event.type){
			case 'mousedown':
				if (event.button != 0) return;
				event.preventDefault();
				event.stopPropagation();
				this.lowlight();
				this.inputElement.value = this.getXPath(this.target);
				this.uninit();
				break;
			case 'mouseover':
				if (this.target){
					this.lowlight();
				}
				this.target = event.target;
				this.highlight();
				break;
			case "click":
				if (event.button != 0) return;
				event.preventDefault();
				event.stopPropagation();
				break;
		}
	},
	highlight : function(){
		if (!("orgcss" in this.target))
			this.target.orgcss = this.target.style.cssText;
		this.target.style.outline = "magenta 2px solid";
		this.target.style.outlineOffset = "-1px";
	},
	lowlight : function(){
		if ("orgcss" in this.target) {
			this.target.orgcss?
				this.target.style.cssText = this.target.orgcss:
				this.target.removeAttribute("style");
			delete this.target.orgcss;
		}
	},
	getXPath: function(elem) {
		var doc = elem.ownerDocument;
		var arr = [];
		do {
			if (elem == doc) break;
			var xpath = this.getElementXPath(elem);
			arr.unshift(xpath);
			if (xpath.indexOf('id("') === 0) break;
		} while (elem = elem.parentNode);
		return arr[0].indexOf('id("') === 0 ? arr.join("/") : "//" + arr.join("/");
	},
	getElementXPath: function(elem) {
		if (elem.getAttribute("id")) {
			return 'id("'+ elem.getAttribute('id') +'")';
/*		} else if (elem.getAttribute("class")) {
			var cls = elem.getAttribute("class").replace(/\s+/g, " ").replace(/^\s+|\s+$/g, "").split(" ");
			for (var i = 0, l = cls.length; i < l; i++) {
				cls[i] = 'contains(concat(" ",normalize-space(@class)," "), " '+ cls[i] +' ")';
			}
			return elem.nodeName.toLowerCase() + '[' + cls.join(" and ") + ']';
*/		}
		var attrs = elem.attributes;
		var arr = [];
		for (var i = 0, len = attrs.length; i < len; i++) {
			var name = attrs[i].nodeName;
			var value = attrs[i].nodeValue;
			arr[i] = '@' + name + '="' + value + '"';
		};
		var xpath = arr.length > 0?
			elem.nodeName.toLowerCase() + '[' + arr.join(" and ") + ']':
			elem.nodeName.toLowerCase();
		return xpath;
	},
};

function str2dom(str) {
	var range = document.createRange();
	range.selectNodeContents(document.body);
	var df = range.createContextualFragment(str);
	range.detach();
	return df;
}
function $(id) { return document.getElementById(id); }
/*
 simple version of $X
 $X(exp);
 $X(exp, context);
 @source http://gist.github.com/3242.txt
*/
function $X (exp, context) {
	context || (context = document);
	var expr = (context.ownerDocument || context).createExpression(exp, function (prefix) {
		return document.createNSResolver(context.documentElement || context).lookupNamespaceURI(prefix) ||
			context.namespaceURI || document.documentElement.namespaceURI || "";
	});

	var result = expr.evaluate(context, XPathResult.ANY_TYPE, null);
		switch (result.resultType) {
			case XPathResult.STRING_TYPE : return result.stringValue;
			case XPathResult.NUMBER_TYPE : return result.numberValue;
			case XPathResult.BOOLEAN_TYPE: return result.booleanValue;
			case XPathResult.UNORDERED_NODE_ITERATOR_TYPE:
				/* not ensure the order. */
				var ret = [], i = null;
				while (i = result.iterateNext()) ret.push(i);
				return ret;
		}
	return null;
}
function $XF (exp, context) {
	context || (context = document);
	var expr = (context.ownerDocument || context).createExpression(exp, function (prefix) {
		return document.createNSResolver(context.documentElement || context).lookupNamespaceURI(prefix) ||
			context.namespaceURI || document.documentElement.namespaceURI || "";
	});

	var result = expr.evaluate(context, XPathResult.FIRST_ORDERED_NODE_TYPE, null);
	return result.singleNodeValue;
}

})();