aboutsummaryrefslogtreecommitdiff
path: root/js/components/popup.reel/popup.js
diff options
context:
space:
mode:
Diffstat (limited to 'js/components/popup.reel/popup.js')
-rwxr-xr-xjs/components/popup.reel/popup.js336
1 files changed, 168 insertions, 168 deletions
diff --git a/js/components/popup.reel/popup.js b/js/components/popup.reel/popup.js
index c66a39fa..f9f38a3c 100755
--- a/js/components/popup.reel/popup.js
+++ b/js/components/popup.reel/popup.js
@@ -30,237 +30,237 @@ POSSIBILITY OF SUCH DAMAGE.
30 30
31//////////////////////////////////////////////////////////////////////// 31////////////////////////////////////////////////////////////////////////
32// 32//
33var Montage = require("montage/core/core").Montage, 33var Montage = require("montage/core/core").Montage,
34 Component = require("montage/ui/component").Component; 34 Component = require("montage/ui/component").Component;
35//////////////////////////////////////////////////////////////////////// 35////////////////////////////////////////////////////////////////////////
36//Exporting as Popup 36//Exporting as Popup
37exports.Popup = Montage.create(Component, { 37exports.Popup = Montage.create(Component, {
38 //////////////////////////////////////////////////////////////////// 38 ////////////////////////////////////////////////////////////////////
39 // 39 //
40 hasTemplate: { 40 hasTemplate: {
41 value: true 41 value: true
42 }, 42 },
43 //////////////////////////////////////////////////////////////////// 43 ////////////////////////////////////////////////////////////////////
44 // 44 //
45 _content: { 45 _content: {
46 numerable: false, 46 numerable: false,
47 value: null 47 value: null
48 }, 48 },
49 //////////////////////////////////////////////////////////////////// 49 ////////////////////////////////////////////////////////////////////
50 // 50 //
51 content: { 51 content: {
52 enumerable: true, 52 enumerable: true,
53 get: function() { 53 get: function() {
54 return this._content; 54 return this._content;
55 }, 55 },
56 set: function(value) { 56 set: function(value) {
57 this._content = value; 57 this._content = value;
58 } 58 }
59 }, 59 },
60 //////////////////////////////////////////////////////////////////// 60 ////////////////////////////////////////////////////////////////////
61 // 61 //
62 _position: { 62 _position: {
63 numerable: false, 63 numerable: false,
64 value: null 64 value: null
65 }, 65 },
66 //////////////////////////////////////////////////////////////////// 66 ////////////////////////////////////////////////////////////////////
67 //Position is set with X,Y Coordinates from Top and Left respetively 67 //Position is set with X,Y Coordinates from Top and Left respetively
68 position: { 68 position: {
69 enumerable: true, 69 enumerable: true,
70 get: function() { 70 get: function() {
71 return this._position; 71 return this._position;
72 }, 72 },
73 set: function(value) { 73 set: function(value) {
74 this._position = value; 74 this._position = value;
75 if (value.x) { 75 if (value.x) {
76 this.element.style.left = value.x; 76 this.element.style.left = value.x;
77 } 77 }
78 if (value.y) { 78 if (value.y) {
79 this.element.style.top = value.y; 79 this.element.style.top = value.y;
80 } 80 }
81 } 81 }
82 }, 82 },
83 //////////////////////////////////////////////////////////////////// 83 ////////////////////////////////////////////////////////////////////
84 // 84 //
85 _tooltip: { 85 _tooltip: {
86 numerable: false, 86 numerable: false,
87 value: null 87 value: null
88 }, 88 },
89 //////////////////////////////////////////////////////////////////// 89 ////////////////////////////////////////////////////////////////////
90 // 90 //
91 tooltip: { 91 tooltip: {
92 enumerable: true, 92 enumerable: true,
93 get: function() { 93 get: function() {
94 return this._tooltip; 94 return this._tooltip;
95 }, 95 },
96 set: function(value) { 96 set: function(value) {
97 this._tooltip = value; 97 this._tooltip = value;
98 } 98 }
99 }, 99 },
100 //////////////////////////////////////////////////////////////////// 100 ////////////////////////////////////////////////////////////////////
101 // 101 //
102 prepareForDraw: { 102 prepareForDraw: {
103 enumerable: false, 103 enumerable: false,
104 value: function() { 104 value: function() {
105 this.element.style.pointerEvents = 'auto'; 105 this.element.style.pointerEvents = 'auto';
106 } 106 }
107 }, 107 },
108 //////////////////////////////////////////////////////////////////// 108 ////////////////////////////////////////////////////////////////////
109 // 109 //
110 willDraw: { 110 willDraw: {
111 enumerable: false, 111 enumerable: false,
112 value: function() { 112 value: function() {
113 // 113 //
114 } 114 }
115 }, 115 },
116 //////////////////////////////////////////////////////////////////// 116 ////////////////////////////////////////////////////////////////////
117 // 117 //
118 draw: { 118 draw: {
119 enumerable: false, 119 enumerable: false,
120 value: function() { 120 value: function() {
121 // 121 //
122 if (!this._content) { 122 if (!this._content) {
123 return; 123 return;
124 } 124 }
125 if (!this._content.style.width) { 125 if (!this._content.style.width) {
126 this._content.style.width = 'auto'; 126 this._content.style.width = 'auto';
127 } 127 }
128 if (!this._content.style.float) { 128 if (!this._content.style.float) {
129 this._content.style.float = 'left'; 129 this._content.style.float = 'left';
130 } 130 }
131 this.popupContent.appendChild(this._content); 131 this.popupContent.appendChild(this._content);
132 // 132 //
133 if (!this.tooltip) { 133 if (!this.tooltip) {
134 this.tooltip = {}; 134 this.tooltip = {};
135 this.tooltip.side = 'none'; 135 this.tooltip.side = 'none';
136 this.tooltip.align = 'none'; 136 this.tooltip.align = 'none';
137 } 137 }
138 switch (this.tooltip.side.toLowerCase()) { 138 switch (this.tooltip.side.toLowerCase()) {
139 case 'top': 139 case 'top':
140 this.element.style.marginTop = (this.popupTooltip.clientHeight) + 'px'; 140 this.element.style.marginTop = (this.popupTooltip.clientHeight) + 'px';
141 break; 141 break;
142 case 'bottom': 142 case 'bottom':
143 this.element.style.marginTop = -(this.element.clientHeight+(this.popupTooltip.clientHeight)) + 'px'; 143 this.element.style.marginTop = -(this.element.clientHeight+(this.popupTooltip.clientHeight)) + 'px';
144 break; 144 break;
145 case 'left': 145 case 'left':
146 this.element.style.marginLeft = (this.popupTooltip.clientWidth) + 'px'; 146 this.element.style.marginLeft = (this.popupTooltip.clientWidth) + 'px';
147 break; 147 break;
148 case 'right': 148 case 'right':
149 this.element.style.marginLeft = -(this.element.clientWidth + this.popupTooltip.clientWidth) + 'px'; 149 this.element.style.marginLeft = -(this.element.clientWidth + this.popupTooltip.clientWidth) + 'px';
150 break; 150 break;
151 default: 151 default:
152 //console.log("Error: Tooltip side value of "+this.tooltip.side.toLowerCase()+" property not allowed"); 152 //console.log("Error: Tooltip side value of "+this.tooltip.side.toLowerCase()+" property not allowed");
153 break; 153 break;
154 } 154 }
155 // 155 //
156 switch (this.tooltip.align.toLowerCase()) { 156 switch (this.tooltip.align.toLowerCase()) {
157 case 'top': 157 case 'top':
158 this.element.style.marginTop = -Math.round((this.popupTooltip.clientHeight/2)+this.popupTooltip.offsetTop) + 'px'; 158 this.element.style.marginTop = -Math.round((this.popupTooltip.clientHeight/2)+this.popupTooltip.offsetTop) + 'px';
159 break; 159 break;
160 case 'bottom': 160 case 'bottom':
161 this.element.style.marginTop = -Math.round(this.element.clientHeight-((this.element.clientHeight - this.popupTooltip.offsetTop)-(this.popupTooltip.clientHeight/2))) + 'px'; 161 this.element.style.marginTop = -Math.round(this.element.clientHeight-((this.element.clientHeight - this.popupTooltip.offsetTop)-(this.popupTooltip.clientHeight/2))) + 'px';
162 break; 162 break;
163 case 'left': 163 case 'left':
164 this.element.style.marginLeft = -Math.round(this.element.clientWidth-((this.element.clientWidth - this.popupTooltip.offsetLeft)-(this.popupTooltip.clientWidth/2))) + 'px'; 164 this.element.style.marginLeft = -Math.round(this.element.clientWidth-((this.element.clientWidth - this.popupTooltip.offsetLeft)-(this.popupTooltip.clientWidth/2))) + 'px';
165 break; 165 break;
166 case 'right': 166 case 'right':
167 this.element.style.marginLeft = -(this.element.clientWidth - this.popupTooltip.clientWidth) + 'px'; 167 this.element.style.marginLeft = -(this.element.clientWidth - this.popupTooltip.clientWidth) + 'px';
168 break; 168 break;
169 case 'center': 169 case 'center':
170 this.element.style.marginLeft = -Math.round(this.element.clientWidth/2-((this.element.clientWidth/2 - this.popupTooltip.offsetLeft)-(this.popupTooltip.clientWidth/2))) + 'px'; 170 this.element.style.marginLeft = -Math.round(this.element.clientWidth/2-((this.element.clientWidth/2 - this.popupTooltip.offsetLeft)-(this.popupTooltip.clientWidth/2))) + 'px';
171 break; 171 break;
172 case 'middle': 172 case 'middle':
173 this.element.style.marginTop = -Math.round(this.element.clientHeight/2-((this.element.clientHeight/2 - this.popupTooltip.offsetTop)-(this.popupTooltip.clientHeight/2))) + 'px'; 173 this.element.style.marginTop = -Math.round(this.element.clientHeight/2-((this.element.