Jeg skrev forøvrigt denne bookmarklet editor for nogle år siden. Den er quick'n'dirty - og mange ting kunne være løst mere elegant - men den virker fint som et hurtigt værktøj =)
Den giver mulighed for at skrive komplekse bookmarklets på en overskuelig måde uden at skulle folde linjer ind og ud hele tiden - eller sidde og skrive i én uoverskuelig lang linje.
Du skriver koden i editoren, som du vil skrive JS-kode i enhver anden editor. Du kan indrykke linjer 4 mellemrum med
- både enkeltlinjer og blokke af linjer. Og du kan rykke linjer 4 mellemrum ud igen med
- også både som enkeltlinjer og blokke.
. Så foldes koden sammen på én linje - får sat 'java script:' foran og 'void(0)' efter - og bliver automatisk kopieret til din udklipsholder, så du kan sætte den direkte ind i en browsers adresselinje. Du får endvidere vist, hvormange tegn linjen i alt består af.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "
http://www.w3.org/TR/html4/strict.dtd"><html>
<!-- ************************************************************************************************
BookMarkletEditor 1.0.0
(C) Copyrigt Ole Clausen 2009
************************************************************************************************* -->
<head>
<HTA:APPLICATION ID="BookMarkletEditor" APPLICATIONNAME="BookMarkletEdit" VERSION="BookMarkletEditor 1.0.0"
CAPTION="yes" BORDER="medium" INNERBORDER="yes" SHOWINTASKBAR="yes" SINGLEINSTANCE="yes"
SYSMENU="yes" NAVIGABLE="no" WINDOWSTATE="normal"></hta:application>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>BookMarklet</title>
<style type="text/css">
html, body {
height: 100%;
margin: 0;
padding: 0;
font: 11px tahoma, sans-serif;
background: buttonface;
overflow: auto;
}
p, h3 {
text-align: center;
}
h3 {
margin-top: 12px;
}
input {
width: 45px;
font: 11px tahoma, sans-serif;
}
button {
width: 85px;
}
input, button {
vertical-align: middle;
}
textarea {
font: 12px 'courier new';
width: 90%;
height: 350px;
margin: 0 auto;
display: block;
overflow: auto;
}
</style>
<script type="text/javascript">
String.prototype.trim=function(){return this.replace(/(^\s+)|\s+$/g,"")};
var sTab = " ";
var sBreak = "\r\n";
var sWhiteSpace = "";
function checkKeyUp(oTxt, oEvnt) {
var bKillEvnt = false;
if (oEvnt.keyCode==13 || oEvnt.keyCode==9) {
var oRng = document.selection.createRange(),
oRng2 = oRng.duplicate();
oRng2.moveToElementText(oTxt);
if (oEvnt.keyCode==13) {
while (oRng.compareEndPoints("StartToStart", oRng2)>-1 && oRng.text.indexOf(sBreak)<0) {
oRng.moveStart("character", -1);
}
if (oRng.text.indexOf(sBreak)>-1) oRng.moveStart("character", sBreak.length-1);
(/^([ ]*)/).test(oRng.text);
sWhiteSpace = RegExp.$1;
oRng.collapse(false);
oRng.text += sBreak + sWhiteSpace;
oRng.select();
bKillEvnt = true;
}
else if (oEvnt.keyCode==9) {
oRng2.setEndPoint("endToStart", oRng);
if (oEvnt.shiftKey) {
var bDoSelect = oRng.text.length>0;
while (oRng.compareEndPoints("StartToStart", oRng2)>0 && oRng.text.substr(0, sBreak.length)!=sBreak) {
oRng.moveStart("character", -1);
}
if (oRng.text.substr(0, sBreak.length)==sBreak) oRng.moveStart("character", sBreak.length-1);
if (oRng.text.length>0) {
var oRX = new RegExp("(^|"+sBreak+")[ ]{0,4}", "g");
oRng.text = oRng.text.replace(oRX, "$1");
oRng.setEndPoint("startToEnd", oRng2);
} else {
var oRX = new RegExp("(^|"+sBreak+")[ ]{0,4}", "g");
oRng.text = oRng.text.replace(oRX, "$1");
}
if (bDoSelect) oRng.select();
} else {
if (oRng.text.length>0) {
var oRX = new RegExp("(^|"+sBreak+")", "g");
oRng.text = oRng.text.replace(oRX, "$1"+sTab);
oRng.setEndPoint("startToEnd", oRng2);
oRng.select();
}
else oRng.text = sTab;
}
bKillEvnt = true;
}
}
if (bKillEvnt) {
oEvnt.cancelBubble = true;
oEvnt.returnValue = false;
}
}
function cleanTabs() {
clipboardData.setData("Text", clipboardData.getData("Text").replace(/\t/g, sTab));
}
function createBookMarklet() {
document.getElementById("bml").firstChild.nodeValue = "0";
var sCode = document.getElementById("code").value.trim();
if (/^\s*$/.test(sCode)) return;
sCode = sCode.replace(/[ ]+/g, " ");
sCode = sCode.replace(/\}\r\n/g, "};");
sCode = sCode.replace(/\r\n|\r|\n|\t/g, "");
sCode = sCode.replace(/ ?(=|\(|\)|\{|\}|\[|\]|\+|\-|\*|\?|,|;|<|>|&|\|) ?/g, "$1");
sCode = sCode.replace(/;\}/g, "}");
sCode = sCode.replace(/;catch/g, "catch");
sCode = "java script:"+sCode+";void(0)";
sCode = sCode.replace(/;;/g, ";");
if (window.clipboardData) window.clipboardData.setData("Text", sCode);
document.getElementById("bml").firstChild.nodeValue = sCode.length;
}
function doSize() {
var o = document.getElementById("code");
o.style.height = (document.documentElement.clientHeight-(o.offsetTop+100)) + "px";
o.style.width = (document.documentElement.clientWidth-40) + "px";
}
window.onload = function() {
document.getElementById("code").focus();
doSize();
}
window.onresize = doSize;
</script>
</head>
<body oncontextmenu="return false">
<h3>Create BookMarklet</h3>
<p style="text-align:left"><textarea id="code" onkeydown="checkKeyUp(this, event)" onbeforepaste="cleanTabs()" oncontextmenu="event.cancelBubble=true;return true"></textarea></p>
<p><button onclick="createBookMarklet()">Create</button></p>
<p>Number of characters: <span id="bml">0</span></p>
</body>
</html>
