From: Robert Konigsberg Date: Mon, 16 Jan 2012 22:01:09 +0000 (-0500) Subject: Move textarea to common area. X-Git-Tag: v1.0.0~320^2~13 X-Git-Url: https://adrianiainlam.tk/git/?a=commitdiff_plain;h=b49775481c37d9c849d91c25221e84349477361f;p=dygraphs.git Move textarea to common area. --- diff --git a/common/textarea.css b/common/textarea.css new file mode 100644 index 0000000..85e0bb8 --- /dev/null +++ b/common/textarea.css @@ -0,0 +1,38 @@ +.textarea { + position: absolute; + border: 1px solid black; + background-color: #dddddd; + z-index: 12; +} + +.textarea .prompt { + padding-left: 2px; +} + +.textarea .buttons { + position: absolute; + bottom: 5px; + right: 5px; +} + +.textarea button { + color: #222222; +} + +.textarea .editor { + font-family: Inconsolata, Courier New, Courier; + margin: 4px; +} + +#modalBackground { + position: fixed; + left: 0; + top: 0; + width: 100%; + height: 100%; + z-index: 11; + background-color:#333333; + display: none; + opacity: 0.40; + filter: alpha(opacity=40) +} diff --git a/common/textarea.js b/common/textarea.js new file mode 100644 index 0000000..ce45d8a --- /dev/null +++ b/common/textarea.js @@ -0,0 +1,116 @@ +// Copyright (c) 2012 Google, Inc. +// +// Permission is hereby granted, free of charge, to any person obtaining a copy +// of this software and associated documentation files (the "Software"), to deal +// in the Software without restriction, including without limitation the rights +// to use, copy, modify, merge, publish, distribute, sublicense, and/or sell +// copies of the Software, and to permit persons to whom the Software is +// furnished to do so, subject to the following conditions: +// +// The above copyright notice and this permission notice shall be included in +// all copies or substantial portions of the Software. +// +// THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR +// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, +// FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE +// AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER +// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, +// OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN +// THE SOFTWARE. + +/** + * @fileoverview Dygraphs options palette text area. + * + * @author konigsberg@google.com (Robert Konigsberg) + */ +"use strict"; + +function TextArea(parent) { + var body = document.getElementsByTagName("body")[0]; + if (!parent) { + parent = body; + } + this.elem = TextArea.createChild("div", parent, "textarea"); + this.title = TextArea.createChild("div", this.elem, "title"); + this.textarea = TextArea.createChild("textarea", this.elem, "editor"); + this.buttons = TextArea.createChild("div", this.elem, "buttons"); + this.ok = TextArea.createChild("button", this.buttons); + this.ok.textContent = "OK"; + this.cancel = TextArea.createChild("button", this.buttons); + this.cancel.textContent = "Cancel"; + + var textarea = this; + this.ok.onclick = function() { + textarea.hide(); + textarea.okCallback(textarea.textarea.value); + }; + this.cancel.onclick = function() { + textarea.hide(); + textarea.cancelCallback(); + }; + this.reposition = function() { + var left = (document.documentElement.clientWidth - textarea.elem.offsetWidth) / 2; + var top = (document.documentElement.clientHeight - textarea.elem.offsetHeight) / 2; + textarea.elem.style.left = Math.max(left, 0) + "px"; + textarea.elem.style.top = Math.max(top, 0) + "px"; + } + + this.background = TextArea.createChild("div", body, "background"); + this.background.id = "modalBackground"; + this.hide(); +} + +/* I think this is the third place I've copied this function */ +TextArea.createChild = function(type, parent, className) { + var elem = document.createElement(type); + parent.appendChild(elem); + if (className) { + elem.className = className; + } + return elem; +}; + +TextArea.prototype.cancelCallback = function() { +}; + +TextArea.prototype.okCallback = function(content) { +}; + +TextArea.prototype.show = function(title, content) { + this.title.textContent = title; + this.textarea.value = content; + + var height = 315; + var width = 445; + + + var sums = function(adds, subtracts, field) { + var total = 0; + for (var idx in adds) { + total += parseInt(adds[idx][field]); + } + for (var idx2 in subtracts) { + total -= parseInt(subtracts[idx2][field]); + } + return total; + } + this.elem.style.display = "block"; + this.background.style.display = "block"; + + this.elem.style.height = height + "px"; + this.elem.style.width = width + "px"; + + this.textarea.style.height = (-18 + sums([this.elem], [this.title, this.buttons], "offsetHeight")) + "px"; + this.textarea.style.width = (-16 + sums([this.elem], [ ], "offsetWidth")) + "px"; + + this.reposition(); + window.addEventListener('resize', this.reposition, false); + document.documentElement.addEventListener('onscroll', this.reposition); +} + +TextArea.prototype.hide = function() { + this.elem.style.display = "none"; + this.background.style.display = "none"; + window.removeEventListener("resize", this.reposition); + document.documentElement.removeEventListener("onscroll", this.reposition); +} diff --git a/experimental/palette/index.css b/experimental/palette/index.css index 57ebaae..d17ca62 100644 --- a/experimental/palette/index.css +++ b/experimental/palette/index.css @@ -1,6 +1,6 @@ @import url("palette.css"); @import url("tooltip.css"); -@import url("textarea.css"); +@import url("../../common/textarea.css"); #selector { width: 150px; diff --git a/experimental/palette/index.html b/experimental/palette/index.html index ced58a9..e5f1754 100644 --- a/experimental/palette/index.html +++ b/experimental/palette/index.html @@ -8,7 +8,7 @@ - + diff --git a/experimental/palette/textarea.css b/experimental/palette/textarea.css deleted file mode 100644 index 85e0bb8..0000000 --- a/experimental/palette/textarea.css +++ /dev/null @@ -1,38 +0,0 @@ -.textarea { - position: absolute; - border: 1px solid black; - background-color: #dddddd; - z-index: 12; -} - -.textarea .prompt { - padding-left: 2px; -} - -.textarea .buttons { - position: absolute; - bottom: 5px; - right: 5px; -} - -.textarea button { - color: #222222; -} - -.textarea .editor { - font-family: Inconsolata, Courier New, Courier; - margin: 4px; -} - -#modalBackground { - position: fixed; - left: 0; - top: 0; - width: 100%; - height: 100%; - z-index: 11; - background-color:#333333; - display: none; - opacity: 0.40; - filter: alpha(opacity=40) -} diff --git a/experimental/palette/textarea.js b/experimental/palette/textarea.js deleted file mode 100644 index 3f97a89..0000000 --- a/experimental/palette/textarea.js +++ /dev/null @@ -1,107 +0,0 @@ -// Copyright (c) 2012 Google, Inc. -// -// Permission is hereby granted, free of charge, to any person obtaining a copy -// of this software and associated documentation files (the "Software"), to deal -// in the Software without restriction, including without limitation the rights -// to use, copy, modify, merge, publish, distribute, sublicense, and/or sell -// copies of the Software, and to permit persons to whom the Software is -// furnished to do so, subject to the following conditions: -// -// The above copyright notice and this permission notice shall be included in -// all copies or substantial portions of the Software. -// -// THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR -// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, -// FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE -// AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER -// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, -// OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN -// THE SOFTWARE. - -/** - * @fileoverview Dygraphs options palette text area. - * - * @author konigsberg@google.com (Robert Konigsberg) - */ -"use strict"; - -function TextArea(parent) { - var body = document.getElementsByTagName("body")[0]; - if (!parent) { - parent = body; - } - this.elem = Palette.createChild("div", parent, "textarea"); - this.title = Palette.createChild("div", this.elem, "title"); - this.textarea = Palette.createChild("textarea", this.elem, "editor"); - this.buttons = Palette.createChild("div", this.elem, "buttons"); - this.ok = Palette.createChild("button", this.buttons); - this.ok.textContent = "OK"; - this.cancel = Palette.createChild("button", this.buttons); - this.cancel.textContent = "Cancel"; - - var textarea = this; - this.ok.onclick = function() { - textarea.hide(); - textarea.okCallback(textarea.textarea.value); - }; - this.cancel.onclick = function() { - textarea.hide(); - textarea.cancelCallback(); - }; - this.reposition = function() { - var left = (document.documentElement.clientWidth - textarea.elem.offsetWidth) / 2; - var top = (document.documentElement.clientHeight - textarea.elem.offsetHeight) / 2; - console.log("reposition", left, top); - textarea.elem.style.left = Math.max(left, 0) + "px"; - textarea.elem.style.top = Math.max(top, 0) + "px"; - } - - this.background = Palette.createChild("div", body, "background"); - this.background.id = "modalBackground"; - this.hide(); -} - -TextArea.prototype.cancelCallback = function() { -}; - -TextArea.prototype.okCallback = function(content) { -}; - -TextArea.prototype.show = function(title, content) { - this.title.textContent = title; - this.textarea.value = content; - - var height = 315; - var width = 445; - - - var sums = function(adds, subtracts, field) { - var total = 0; - for (var idx in adds) { - total += parseInt(adds[idx][field]); - } - for (var idx2 in subtracts) { - total -= parseInt(subtracts[idx2][field]); - } - return total; - } - this.elem.style.display = "block"; - this.background.style.display = "block"; - - this.elem.style.height = height + "px"; - this.elem.style.width = width + "px"; - - this.textarea.style.height = (-18 + sums([this.elem], [this.title, this.buttons], "offsetHeight")) + "px"; - this.textarea.style.width = (-16 + sums([this.elem], [ ], "offsetWidth")) + "px"; - - this.reposition(); - window.addEventListener('resize', this.reposition, false); - document.documentElement.addEventListener('onscroll', this.reposition); -} - -TextArea.prototype.hide = function() { - this.elem.style.display = "none"; - this.background.style.display = "none"; - window.removeEventListener("resize", this.reposition); - document.documentElement.removeEventListener("onscroll", this.reposition); -}