X-Git-Url: https://adrianiainlam.tk/git/?a=blobdiff_plain;f=experimental%2Fpalette%2Fpalette.js;h=e69b086f3f61cf9112f6993da91aab9007044082;hb=dd371798a58578e470de0a7e292ca5ca550aa3f3;hp=a91c6ef7fca6b924eca0a86af7d9b7dd711e6e76;hpb=44885208a48a23f1e1a9e3bb867efdc94f1e5933;p=dygraphs.git diff --git a/experimental/palette/palette.js b/experimental/palette/palette.js index a91c6ef..e69b086 100644 --- a/experimental/palette/palette.js +++ b/experimental/palette/palette.js @@ -31,39 +31,48 @@ function Palette() { this.filterBar = null; } -Palette.createChild = function(type, parentElement) { +Palette.createChild = function(type, parentElement, className) { var element = document.createElement(type); parentElement.appendChild(element); + if (className) { + element.className = className; + } return element; }; Palette.prototype.create = function(document, parentElement) { var palette = this; - var table = Palette.createChild("div", parentElement); - table.className = "palette"; + var table = Palette.createChild("div", parentElement, "palette"); table.width="300px"; this.tooltip = new Tooltip(); - var row = Palette.createChild("div", table); + var row = Palette.createChild("div", table, "header"); row.style.visibility = "visible"; - row.className = "header"; - Palette.createChild("span", row).innerText = "Filter:"; + Palette.createChild("span", row).textContent = "Filter:"; this.filterBar = Palette.createChild("input", Palette.createChild("span", row)); this.filterBar.type = "search"; this.filterBar.onkeyup = function() { palette.filter(palette.filterBar.value) }; this.filterBar.onclick = this.filterBar.onkeyup; - var go = document.createElement("button"); - Palette.createChild("span", row).appendChild(go); - go.innerText = "Redraw" + var go = Palette.createChild("button", Palette.createChild("span", row)); + go.textContent = "Redraw" go.onclick = function() { palette.onchange(); }; + // CURRENTLY HIDDEN. + var tmp = Palette.createChild("button", Palette.createChild("span", row)); + tmp.textContent = "Copy" + tmp.onclick = function() { + var textarea = new TextArea(); + textarea.show("header", "Now is the time for all good men\nto come to the aid of their country"); + }; + tmp.style.display = "none"; + for (var opt in opts) { try { if (opts.hasOwnProperty(opt)) { @@ -77,12 +86,10 @@ Palette.prototype.create = function(document, parentElement) { } (row, opt, type, Dygraph.OPTIONS_REFERENCE[opt].description); row.onmouseout = function() { palette.tooltip.hide(); }; - var div = Palette.createChild("span", row); - div.innerText = opt; - div.className = "name"; + var div = Palette.createChild("span", row, "name"); + div.textContent = opt; - var value = Palette.createChild("span", row); - value.className = "option"; + var value = Palette.createChild("span", row, "option"); if (isFunction) { var input = Palette.createChild("button", value); @@ -91,23 +98,25 @@ Palette.prototype.create = function(document, parentElement) { var entry = palette.model[opt]; var inputValue = entry.functionString; if (inputValue == null || inputValue.length == 0) { - inputValue = opts[opt].type + "{ }"; + inputValue = opts[opt].type + "{\n\n}"; } - var value = prompt("enter function", inputValue); - if (value != null) { - if (value.length == 0) { - value = null; - } + var textarea = new TextArea(); + textarea.show(opt, inputValue); + textarea.okCallback = function(value) { if (value != inputValue) { entry.functionString = value; - entry.input.innerText = value ? "defined" : "not defined"; + entry.input.textContent = value ? "defined" : "not defined"; palette.onchange(); } } } }(opt, this); } else { - var input = Palette.createChild("input", value); + var input = Palette.createChild("input", value, "textInput"); + if (type == "boolean") { + input.size = "5"; + input.maxlength = "5"; + } input.onkeypress = function(event) { var keycode = event.which; if (keycode == 13 || keycode == 8) { @@ -211,7 +220,7 @@ Palette.prototype.write = function(hash) { input.value = value.join(", "); } } else if (type.indexOf("function(") == 0) { - input.innerText = value ? "defined" : "not defined"; + input.textContent = value ? "defined" : "not defined"; this.model[opt].functionString = value ? value.toString() : null; } else { if (value) {