// ==UserScript==
// @name           JavaScript Trace Dialog
// @namespace      http://www.digitalmediaminute.com/myscripts
// @description    A template for creating new user scripts from
// @include        file:///*
// @include        http://localhost/*
// ==/UserScript==

var script = document.createElement("script");
script.setAttribute("type", "text/javascript");
script.setAttribute("src", "data:application/x-javascript,window.watch(%22t%22%2C%20function%20(id%2C%20oldValue%2C%20newValue)%0A%7B%0A%09if%20(!%24(%22jsTrace%22))%20%7B%0A%09%09drawOutputArea()%3B%0A%09%7D%0A%20%0A%09item%20%3D%20document.createElement(%22div%22)%3B%0A%09item.setAttribute(%22style%22%2C%20%22padding%3A5px%3B%20font-family%3A%20arial%2C%20helvetica%2C%20sans-serif%3B%20font-size%3A%2010px%3B%20border-bottom%3A%201px%20dotted%20%23999%3B%22)%3B%0A%09item.appendChild(document.createTextNode(newValue))%3B%0A%09%24(%22traceContent%22).appendChild(item)%3B%0A%7D%0A)%3B%0A%0Afunction%20%24(s)%20%7B%0A%09return%20document.getElementById(s)%3B%0A%7D%0A%0Afunction%20drawOutputArea()%20%7B%0A%09div%20%3D%20document.createElement(%22div%22)%3B%0A%09div.setAttribute(%22id%22%2C%20%22jsTrace%22)%3B%0A%09div.setAttribute(%22style%22%2C%20%22position%3Afixed%3B%20top%3A%2010px%3B%20left%3A%20%22%20%2B%20(window.innerWidth%20-%20260)%20%2B%20%22px%3B%20height%3A332px%3B%20width%3A250px%3B%22)%3B%0A%09div.ondblclick%20%3D%20function%20()%20%7Bdocument.getElementsByTagName(%22body%22)%5B0%5D.removeChild(this)%3B%7D%0A%09%0A%09banner%20%3D%20document.createElement(%22div%22)%3B%0A%09banner.onmousedown%20%3D%20dragStart%3B%0A%09img%20%3D%20document.createElement(%22img%22)%3B%0A%09img.src%20%3D%20%22data%3Aimage%2Fgif%3Bbase64%2CR0lGODlh%252BgAUANUAAAAAAHJzdS9fjuDo7yMnKlN%252Bqbi43JmzzP%252F%252F%252F87a5y1Zhoimw2Zms0FxoHaYu6vA1e3t7SA5UmZmZkVITGWLsrnK3BMWGMzMzCgvNtvb231%252BgBswQzNmmSM%252BWPH1%252BDU4OlFVWR41TIaIidfX1%252Bfn5xwfIi5ciyMuOGZmZiFDZEpNUDMzM3V2eB48WzNmmTA4QCQqMSlajBUYGSExQv%252F%252F%252FwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAUUADQALAAAAAD6ABQAAAb%252FQJpwOJLIAMikcslsOp%252FQqHRKrVqv2KxWuzlZApmheAgJwCICjnrNbrvf8Lh8Tq%252Fb7%252Fi8fs%252FvcwQdGBoQY0IjKiFpfouMjY6PkJGSHAobICRjJAQpk52en6ChiwYGa6SmpWstJYRCJB%252BcorKztLWQqQwcuLpquaoTrQERcQ8OtcV4DQPLzAPGttDReLvUvW0bIjQjL4pvAwe1DgVxBQhuBegIC%252BjS7e5yDL4c8Wv0bQovIwGxcN9r7HMAsinQoM04g28OqikXB4HCgQsf%252FkP4rqK0CCxWmJDjjwOCAR4QUODwIMGaBA84JFiGABwHBx87VvjoYRwCmAM4%252BDuQ4COC%252FwocDiAYas6NQzY3P6pk6ZLDTJDjcP60SLXPKTVXdaXSqsYEkjkd1wjl0KCox4L%252FEBQUyeaAhzZT1ew0e5MDQzhH18QdqDboW6Ro%252B1YdbKfaPF6Hd3H4yrEpursejDn4S9amTaB6n%252BlVuDOnmpJ2zRp9mFdNA8seNb90iM5DU8Kw4RjONVsN4zgdPXgYMFSNA5MJnj0dOk7Z0LUSS3cWm%252FPum9IeFQ4%252FCl1oM9Wxs7OxN08ed%252B63%252B4Fb8Ne5uaJlN7NJYLIuUs7gDnh2atL56Pem6dpUTV67%252F0jhPbcABwsUVeAaFQyAWXpkQVeBSQ9QpoZy8aFXl31wkXYQg2WNE4YhXNj9919WJG6VVYDMIUDZUB48YBYFbKnR0zI1lQOSB2jNWFN0a8zlU0pq6DYAWvipJ2NMO6pEU1QqQiWif7XVthgA5BC5UB0NWGmXlnbNIV%252BXBklkR5YJhfnkiNZEac2U2X155pu1fOfdnGugSJWbcOYZm50WFRCinoC%252Bw2eghBYqCQBBAAA7%22%0A%09banner.appendChild(img)%3B%0A%0A%09footer%20%3D%20document.createElement(%22div%22)%3B%0A%09img%20%3D%20document.createElement(%22img%22)%3B%0A%09img.src%20%3D%20%22data%3Aimage%2Fgif%3Bbase64%2CR0lGODlh%252BgAMANUAAAAAADMzM9fX1x0gIzNmmXJzdCQ%252FWi5cixswQyxYhIGChFZaXkNGSufn5xgnNRs2UhkqPXh5eoqMjjI4Pe3t7SUrMdzc3CA4UB41TI6QkSlajB06WC41PSEpMSAiJn5%252FgRkxSkhLThosQDM8Rf%252F%252F%252FwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAUUACQALAAAAAD6AAwAAAaiQABhSCwaj8ikcslsOp%252FQqHRKrVqlAOF1y%252B16v%252BCw2Jkdm8%252FotHq9BEwO7Lh8Tq8TE4CIwc7v%252B%252F9RFx8CHHCAh4iJcwkjFiQFGIqSk5ReIhkkJBQBG5Wen6BJDwyZpQF7oamqihsVpaUWIQiGq7W2cQkQCw2vrx8eCAm3w8RgCRcVEr3LDQUeWdDR0tPU1dbX2Nna29zd3t%252Fg4eIOHQMKvL1BADs%253D%22%0A%09footer.appendChild(img)%3B%0A%0A%09content%20%3D%20document.createElement(%22div%22)%3B%0A%09content.setAttribute(%22style%22%2C%20%22overflow%3Aauto%3B%20border%3A1px%20solid%20%23000%3B%20border-top%3A%201px%20solid%20%23999%3B%20border-bottom%3A%201px%20solid%20%23999%3B%20background-color%3A%20%23ffffcc%3B%20height%3A%20300px%3B%20%22)%3B%0A%09content.setAttribute(%22id%22%2C%20%22traceContent%22)%3B%0A%09%0A%09div.appendChild(banner)%3B%0A%09div.appendChild(content)%3B%0A%09div.appendChild(footer)%3B%0A%09document.getElementsByTagName(%22body%22)%5B0%5D.appendChild(div)%3B%0A%7D%0A%0A%2F%2F%20Global%20object%20to%20hold%20drag%20information.%0Avar%20dragObj%20%3D%20new%20Object()%3B%0AdragObj.zIndex%20%3D%200%3B%0A%0Afunction%20dragStart(e)%20%7B%0A%09var%20el%3B%0A%09var%20x%2C%20y%3B%0A%0A%09dragObj.elNode%20%3D%20%24(%22jsTrace%22)%3B%0A%0A%20%20%2F%2F%20Get%20cursor%20position%20with%20respect%20to%20the%20page.%0A%20%20%20%20x%20%3D%20e.clientX%20%2B%20window.scrollX%3B%0A%20%20%20%20y%20%3D%20e.clientY%20%2B%20window.scrollY%3B%0A%0A%20%20%2F%2F%20Save%20starting%20positions%20of%20cursor%20and%20element.%0A%09dragObj.cursorStartX%20%3D%20x%3B%0A%09dragObj.cursorStartY%20%3D%20y%3B%0A%09dragObj.elStartLeft%20%20%3D%20parseInt(dragObj.elNode.style.left%2C%2010)%3B%0A%09dragObj.elStartTop%20%20%20%3D%20parseInt(dragObj.elNode.style.top%2C%20%2010)%3B%0A%09%0A%09if%20(isNaN(dragObj.elStartLeft))%20dragObj.elStartLeft%20%3D%200%3B%0A%09if%20(isNaN(dragObj.elStartTop))%20%20dragObj.elStartTop%20%20%3D%200%3B%0A%0A%20%20%2F%2F%20Update%20element's%20z-index.%0A%09dragObj.elNode.style.zIndex%20%3D%20%2B%2BdragObj.zIndex%3B%0A%0A%20%20%2F%2F%20Capture%20mousemove%20and%20mouseup%20events%20on%20the%20page.%0A%20%20%20%20document.addEventListener(%22mousemove%22%2C%20dragGo%2C%20%20%20true)%3B%0A%20%20%20%20document.addEventListener(%22mouseup%22%2C%20%20%20dragStop%2C%20true)%3B%0A%20%20%20%20e.preventDefault()%3B%0A%7D%0A%0Afunction%20dragGo(e)%20%7B%0A%20%20var%20x%2C%20y%3B%0A%20%20%2F%2F%20Get%20cursor%20position%20with%20respect%20to%20the%20page.%0A%20%20%20%20x%20%3D%20e.clientX%20%2B%20window.scrollX%3B%0A%20%20%20%20y%20%3D%20e.clientY%20%2B%20window.scrollY%3B%0A%20%20%0A%20%20%2F%2F%20Move%20drag%20element%20by%20the%20same%20amount%20the%20cursor%20has%20moved.%0A%09dragObj.elNode.style.left%20%3D%20(dragObj.elStartLeft%20%2B%20x%20-%20dragObj.cursorStartX)%20%2B%20%22px%22%3B%0A%09dragObj.elNode.style.top%20%20%3D%20(dragObj.elStartTop%20%20%2B%20y%20-%20dragObj.cursorStartY)%20%2B%20%22px%22%3B%0A%09e.preventDefault()%3B%0A%7D%0A%0Afunction%20dragStop(e)%20%7B%0A%20%20%2F%2F%20Stop%20capturing%20mousemove%20and%20mouseup%20events.%0A%20%20%20%20document.removeEventListener(%22mousemove%22%2C%20dragGo%2C%20%20%20true)%3B%0A%20%20%20%20document.removeEventListener(%22mouseup%22%2C%20%20%20dragStop%2C%20true)%3B%0A%7D");

document.getElementsByTagName("head")[0].appendChild(script);