aboutsummaryrefslogtreecommitdiff
path: root/js/components/popup.reel
diff options
context:
space:
mode:
authorJose Antonio Marquez2012-06-17 14:52:20 -0700
committerJose Antonio Marquez2012-06-17 14:52:20 -0700
commitf48416d68e2762ece2816e7e2387f0aa3ffa797f (patch)
tree42ea238f27a56883cae199ee943d82771bee9cca /js/components/popup.reel
parentffc03c14fe9cf6c2ba92338aeae89cc1aea51259 (diff)
downloadninja-f48416d68e2762ece2816e7e2387f0aa3ffa797f.tar.gz
Cleaning up element references
Diffstat (limited to 'js/components/popup.reel')
-rwxr-xr-xjs/components/popup.reel/popup.html8
-rwxr-xr-xjs/components/popup.reel/popup.js24
2 files changed, 17 insertions, 15 deletions
diff --git a/js/components/popup.reel/popup.html b/js/components/popup.reel/popup.html
index cc31106e..2262289c 100755
--- a/js/components/popup.reel/popup.html
+++ b/js/components/popup.reel/popup.html
@@ -16,7 +16,9 @@
16 "owner": { 16 "owner": {
17 "prototype": "js/components/Popup.reel", 17 "prototype": "js/components/Popup.reel",
18 "properties": { 18 "properties": {
19 "element": {"#": "default_popup"} 19 "element": {"#": "default_popup"},
20 "popupTooltip": {"#": "tooltip"},
21 "popupContent": {"#": "content"}
20 } 22 }
21 } 23 }
22 } 24 }
@@ -27,8 +29,8 @@
27 <body> 29 <body>
28 30
29 <div data-montage-id="default_popup" class="default_popup"> 31 <div data-montage-id="default_popup" class="default_popup">
30 <div class="tooltip"><span/></div> 32 <div data-montage-id="tooltip" class="tooltip"><span/></div>
31 <div class="content"></div> 33 <div data-montage-id="content" class="content"></div>
32 </div> 34 </div>
33 35
34 </body> 36 </body>
diff --git a/js/components/popup.reel/popup.js b/js/components/popup.reel/popup.js
index ae483ea9..2d89db13 100755
--- a/js/components/popup.reel/popup.js
+++ b/js/components/popup.reel/popup.js
@@ -104,7 +104,7 @@ exports.Popup = Montage.create(Component, {
104 if (!this._content.style.float) { 104 if (!this._content.style.float) {
105 this._content.style.float = 'left'; 105 this._content.style.float = 'left';
106 } 106 }
107 this.element.getElementsByClassName('content')[0].appendChild(this._content); 107 this.popupContent.appendChild(this._content);
108 // 108 //
109 if (!this.tooltip) { 109 if (!this.tooltip) {
110 this.tooltip = {}; 110 this.tooltip = {};
@@ -113,16 +113,16 @@ exports.Popup = Montage.create(Component, {
113 } 113 }
114 switch (this.tooltip.side.toLowerCase()) { 114 switch (this.tooltip.side.toLowerCase()) {
115 case 'top': 115 case 'top':
116 this.element.style.marginTop = (this.element.getElementsByClassName('tooltip')[0].clientHeight) + 'px'; 116 this.element.style.marginTop = (this.popupTooltip.clientHeight) + 'px';
117 break; 117 break;
118 case 'bottom': 118 case 'bottom':
119 this.element.style.marginTop = -(this.element.clientHeight+(this.element.getElementsByClassName('tooltip')[0].clientHeight)) + 'px'; 119 this.element.style.marginTop = -(this.element.clientHeight+(this.popupTooltip.clientHeight)) + 'px';
120 break; 120 break;
121 case 'left': 121 case 'left':
122 this.element.style.marginLeft = (this.element.getElementsByClassName('tooltip')[0].clientWidth) + 'px'; 122 this.element.style.marginLeft = (this.popupTooltip.clientWidth) + 'px';
123 break; 123 break;
124 case 'right': 124 case 'right':
125 this.element.style.marginLeft = -(this.element.clientWidth + this.element.getElementsByClassName('tooltip')[0].clientWidth) + 'px'; 125 this.element.style.marginLeft = -(this.element.clientWidth + this.popupTooltip.clientWidth) + 'px';
126 break; 126 break;
127 default: 127 default:
128 //console.log("Error: Tooltip side value of "+this.tooltip.side.toLowerCase()+" property not allowed"); 128 //console.log("Error: Tooltip side value of "+this.tooltip.side.toLowerCase()+" property not allowed");
@@ -131,22 +131,22 @@ exports.Popup = Montage.create(Component, {
131 // 131 //
132 switch (this.tooltip.align.toLowerCase()) { 132 switch (this.tooltip.align.toLowerCase()) {
133 case 'top': 133 case 'top':
134 this.element.style.marginTop = -Math.round((this.element.getElementsByClassName('tooltip')[0].clientHeight/2)+this.element.getElementsByClassName('tooltip')[0].offsetTop) + 'px'; 134 this.element.style.marginTop = -Math.round((this.popupTooltip.clientHeight/2)+this.popupTooltip.offsetTop) + 'px';
135 break; 135 break;
136 case 'bottom': 136 case 'bottom':
137 this.element.style.marginTop = -Math.round(this.element.clientHeight-((this.element.clientHeight - this.element.getElementsByClassName('tooltip')[0].offsetTop)-(this.element.getElementsByClassName('tooltip')[0].clientHeight/2))) + 'px'; 137 this.element.style.marginTop = -Math.round(this.element.clientHeight-((this.element.clientHeight - this.popupTooltip.offsetTop)-(this.popupTooltip.clientHeight/2))) + 'px';
138 break; 138 break;
139 case 'left': 139 case 'left':
140 this.element.style.marginLeft = -Math.round(this.element.clientWidth-((this.element.clientWidth - this.element.getElementsByClassName('tooltip')[0].offsetLeft)-(this.element.getElementsByClassName('tooltip')[0].clientWidth/2))) + 'px'; 140 this.element.style.marginLeft = -Math.round(this.element.clientWidth-((this.element.clientWidth - this.popupTooltip.offsetLeft)-(this.popupTooltip.clientWidth/2))) + 'px';
141 break; 141 break;
142 case 'right': 142 case 'right':
143 this.element.style.marginLeft = -(this.element.clientWidth - this.element.getElementsByClassName('tooltip')[0].clientWidth) + 'px'; 143 this.element.style.marginLeft = -(this.element.clientWidth - this.popupTooltip.clientWidth) + 'px';
144 break; 144 break;
145 case 'center': 145 case 'center':
146 this.element.style.marginLeft = -Math.round(this.element.clientWidth/2-((this.element.clientWidth/2 - this.element.getElementsByClassName('tooltip')[0].offsetLeft)-(this.element.getElementsByClassName('tooltip')[0].clientWidth/2))) + 'px'; 146 this.element.style.marginLeft = -Math.round(this.element.clientWidth/2-((this.element.clientWidth/2 - this.popupTooltip.offsetLeft)-(this.popupTooltip.clientWidth/2))) + 'px';
147 break; 147 break;
148 case 'middle': 148 case 'middle':
149 this.element.style.marginTop = -Math.round(this.element.clientHeight/2-((this.element.clientHeight/2 - this.element.getElementsByClassName('tooltip')[0].offsetTop)-(this.element.getElementsByClassName('tooltip')[0].clientHeight/2))) + 'px'; 149 this.element.style.marginTop = -Math.round(this.element.clientHeight/2-((this.element.clientHeight/2 - this.popupTooltip.offsetTop)-(this.popupTooltip.clientHeight/2))) + 'px';
150 break; 150 break;
151 default: 151 default:
152 //console.log("Error: Tooltip align value of "+this.tooltip.align.toLowerCase()+" property not allowed"); 152 //console.log("Error: Tooltip align value of "+this.tooltip.align.toLowerCase()+" property not allowed");
@@ -170,7 +170,7 @@ exports.Popup = Montage.create(Component, {
170 enumerable: true, 170 enumerable: true,
171 value: function () { 171 value: function () {
172 // 172 //
173 var longD = '22px', shortD = '10px', shortP = '-10px', longP = '8px', tip = this.element.getElementsByClassName('tooltip')[0]; 173 var longD = '22px', shortD = '10px', shortP = '-10px', longP = '8px', tip = this.popupTooltip;
174 // 174 //
175 if (this.tooltip && this.tooltip.side) { 175 if (this.tooltip && this.tooltip.side) {
176 switch (this.tooltip.side.toLowerCase()) { 176 switch (this.tooltip.side.toLowerCase()) {
generated by cgit v1.2.3 (git 2.25.1) at 2024-07-05 04:11:16 +0000