Mercurial > google_bookmarks_incsearch

comparison chrome/content/glayer_ex.js @ 0:c47ec96326ad

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
initial import
author Yoshiki Yazawa <yaz@honeyplanet.jp>
date Fri, 15 Aug 2008 01:57:59 +0900
parents
children
comparison
equal deleted inserted replaced
-1:000000000000 0:c47ec96326ad
1 /*
2 --------------------------------------------------------
3 glayer_ex.js (glayer.js extensions)
4 Version 1.0 (Update 2007/05/28)
5
6 - onozaty (http://www.enjoyxstudy.com)
7
8 Released under the Creative Commons License(Attribution 2.1 Japan):
9 http://creativecommons.org/licenses/by/2.1/jp/
10
11 For details, see the web site:
12 http://www.enjoyxstudy.com/javascript/glayer/extension/
13 http://www.enjoyxstudy.com/javascript/glayer/
14
15 --------------------------------------------------------
16 */
17 Glayer.copyProperties(Glayer, {
18 //// Base ////
19 boxClassName: 'glayer_box',
20 createBox: function(boxElement) {
21 boxElement = this.createElement(boxElement);
22 boxElement.className = this.boxClassName;
23 return boxElement;
24 },
25 showBox: function(boxElement, boxOptions, grayElement) {
26 this.setBoxPosition(boxElement, boxOptions);
27 return this.showParallel([boxElement], grayElement);
28 },
29 hideBox: function(boxElement, grayElement) {
30 return this.hideParallel([boxElement], grayElement);
31 },
32 fadeInBox: function(boxElement, boxOptions, grayElement, fadeOption) {
33 this.setBoxPosition(boxElement, boxOptions);
34 return this.fadeInParallel([boxElement], grayElement, fadeOption);
35 },
36 fadeOutBox: function(boxElement, grayElement, fadeOption) {
37 return this.fadeOutParallel([boxElement], grayElement, fadeOption);
38 },
39
40 setBoxPosition: function(boxElement, boxOptions) {
41 var style = boxElement.style;
42
43 boxOptions = boxOptions || {};
44 var topRatio = boxOptions.topRatio != null ? boxOptions.topRatio : 0.5;
45 var leftRatio = boxOptions.leftRatio != null ? boxOptions.leftRatio : 0.5;
46 style.width = boxOptions.width || '';
47 style.height = boxOptions.height || '';
48
49 var windowTop = 0;
50 var windowLeft = 0;
51 var position = this._getStyle(boxElement, 'position');
52 if (position != 'fixed') {
53 windowTop = document.documentElement.scrollTop || document.body.scrollTop;
54 windowLeft = document.documentElement.scrollLeft || document.body.scrollLeft;
55 }
56
57 style.display = '';
58 var offsetHeight = boxElement.offsetHeight;
59 var offsetWidth = boxElement.offsetWidth;
60 style.display = 'none';
61
62 var windowSize = this.getWindowSize();
63
64 style.top = ((windowSize.height * topRatio) - (offsetHeight * topRatio) + windowTop) + 'px';
65 style.left = ((windowSize.width * leftRatio) - (offsetWidth * leftRatio) + windowLeft) + 'px';
66 },
67
68 //// Message ////
69 defaultMessage: {
70 boxId: 'glayer_message',
71 textId: 'glayer_message_text'
72 },
73 createMessageBox: function(message, boxOptions) {
74 boxOptions = boxOptions || {};
75 var boxElement = boxOptions.box || this.defaultMessage.boxId;
76 var boxId = boxElement.id || boxElement;
77 var textElement = boxOptions.text || this.defaultMessage.textId;
78 var textId = textElement.id || textElement;
79
80 boxElement = this.getElement(boxElement);
81 if (!boxElement) {
82 boxElement = this.createBox(boxId);
83 textElement = document.createElement('p');
84 textElement.id = textId;
85 boxElement.appendChild(textElement);
86 } else {
87 textElement = this.getElement(textElement);
88 }
89
90 textElement.innerHTML = message;
91 return boxElement;
92 },
93
94 showMessage: function(message, boxOptions, grayElement) {
95 return this.showBox(this.createMessageBox(message, boxOptions), boxOptions, grayElement);
96 },
97 hideMessage: function(boxElement, grayElement) {
98 return this.hideBox(boxElement || this.defaultMessage.boxId, grayElement);
99 },
100 fadeInMessage: function(message, boxOptions, grayElement, fadeOption) {
101 return this.fadeInBox(this.createMessageBox(message, boxOptions), boxOptions, grayElement, fadeOption);
102 },
103 fadeOutMessage: function(boxElement, grayElement, fadeOption) {
104 return this.fadeOutBox(boxElement || this.defaultMessage.boxId, grayElement, fadeOption);
105 },
106
107 //// Alert ////
108 defaultAlert: {
109 boxId: 'glayer_alert',
110 textId: 'glayer_alert_text',
111 buttonId: 'glayer_alert_button',
112 okId: 'glayer_alert_ok',
113 okLabel: 'OK'
114 },
115 getDefaultAlertOkFunc: function() {
116 return function(){ Glayer.hideAlert(); };
117 },
118
119 createAlertBox: function(message, boxOptions) {
120
121 boxOptions = boxOptions || {};
122 var boxElement = boxOptions.box || this.defaultAlert.boxId;
123 var boxId = boxElement.id || boxElement;
124 var textElement = boxOptions.text || this.defaultAlert.textId;
125 var textId = textElement.id || textElement;
126 var okElement = boxOptions.ok || this.defaultAlert.okId;
127 var okId = okElement.id || okElement;
128
129 boxElement = this.getElement(boxElement);
130 if (!boxElement) {
131 boxElement = this.createBox(boxId);
132
133 textElement = document.createElement('p');
134 textElement.id = textId;
135 boxElement.appendChild(textElement);
136
137 var buttonElement = document.createElement('p');
138 buttonElement.id = this.defaultAlert.buttonId;
139 boxElement.appendChild(buttonElement);
140
141 okElement = document.createElement('input');
142 okElement.type = 'button';
143 okElement.id = okId;
144 buttonElement.appendChild(okElement);
145 } else {
146 textElement = this.getElement(textElement);
147 okElement = this.getElement(okElement);
148 }
149
150 textElement.innerHTML = message;
151
152 okElement.value = boxOptions.okLabel || this.defaultAlert.okLabel;
153 okElement.onclick = boxOptions.callback || this.getDefaultAlertOkFunc();
154
155 return boxElement;
156 },
157
158 showAlert: function(message, boxOptions, grayElement) {
159 return this.showBox(this.createAlertBox(message, boxOptions), boxOptions, grayElement);
160 },
161 hideAlert: function(boxElement, grayElement) {
162 return this.hideBox(boxElement || this.defaultAlert.boxId, grayElement);
163 },
164 fadeInAlert: function(message, boxOptions, grayElement, fadeOption) {
165 return this.fadeInBox(this.createAlertBox(message, boxOptions), boxOptions, grayElement, fadeOption);
166 },
167 fadeOutAlert: function(boxElement, grayElement, fadeOption) {
168 return this.fadeOutBox(boxElement || this.defaultAlert.boxId, grayElement, fadeOption);
169 },
170
171 //// Confirm ////
172 defaultConfirm: {
173 boxId: 'glayer_confirm',
174 textId: 'glayer_confirm_text',
175 buttonId: 'glayer_confirm_button',
176 okId: 'glayer_confirm_ok',
177 okLabel: 'OK',
178 cancelId: 'glayer_confirm_cancel',
179 cancelLabel: 'Cancel'
180 },
181 getConfirmResultFunc: function(callback, result) {
182 return function(){ callback(result); };
183 },
184
185 createConfirmBox: function(message, resultCallback, boxOptions) {
186
187 boxOptions = boxOptions || {};
188 var boxElement = boxOptions.box || this.defaultConfirm.boxId;
189 var boxId = boxElement.id || boxElement;
190 var textElement = boxOptions.text || this.defaultConfirm.textId;
191 var textId = textElement.id || textElement;
192 var okElement = boxOptions.ok || this.defaultConfirm.okId;
193 var okId = okElement.id || okElement;
194 var cancelElement = boxOptions.cancel || this.defaultConfirm.cancelId;
195 var cancelId = cancelElement.id || cancelElement;
196
197 boxElement = this.getElement(boxElement);
198 if (!boxElement) {
199 boxElement = this.createBox(boxId);
200
201 textElement = document.createElement('p');
202 textElement.id = textId;
203 boxElement.appendChild(textElement);
204
205 var buttonElement = document.createElement('p');
206 buttonElement.id = this.defaultConfirm.buttonId;
207 boxElement.appendChild(buttonElement);
208
209 okElement = document.createElement('input');
210 okElement.type = 'button';
211 okElement.id = okId;
212 buttonElement.appendChild(okElement);
213 cancelElement = document.createElement('input');
214 cancelElement.type = 'button';
215 cancelElement.id = cancelId;
216 buttonElement.appendChild(cancelElement);
217 } else {
218 textElement = this.getElement(textElement);
219 okElement = this.getElement(okElement);
220 cancelElement = this.getElement(cancelElement);
221 }
222
223 textElement.innerHTML = message;
224
225 okElement.value = boxOptions.okLabel || this.defaultConfirm.okLabel;
226 okElement.onclick = this.getConfirmResultFunc(resultCallback, true);
227
228 cancelElement.value = boxOptions.cancelLabel || this.defaultConfirm.cancelLabel;
229 cancelElement.onclick = this.getConfirmResultFunc(resultCallback, false);
230
231 return boxElement;
232 },
233
234 showConfirm: function(message, resultCallback, boxOptions, grayElement) {
235 return this.showBox(this.createConfirmBox(message, resultCallback, boxOptions), boxOptions, grayElement);
236 },
237 hideConfirm: function(boxElement, grayElement) {
238 return this.hideBox(boxElement || this.defaultConfirm.boxId, grayElement);
239 },
240 fadeInConfirm: function(message, resultCallback, boxOptions, grayElement, fadeOption) {
241 return this.fadeInBox(this.createConfirmBox(message, resultCallback, boxOptions), boxOptions, grayElement, fadeOption);
242 },
243 fadeOutConfirm: function(boxElement, grayElement, fadeOption) {
244 return this.fadeOutBox(boxElement || this.defaultConfirm.boxId, grayElement, fadeOption);
245 }
246 });