File:
[LON-CAPA] /
loncom /
html /
htmlarea /
Attic /
popupdiv.js
Revision
1.1:
download - view:
text,
annotated -
select for diffs
Wed Feb 18 08:07:15 2004 UTC (20 years, 4 months ago) by
www
Branches:
MAIN
CVS tags:
version_2_5_X,
version_2_5_99_0,
version_2_5_2,
version_2_5_1,
version_2_5_0,
version_2_4_X,
version_2_4_99_0,
version_2_4_2,
version_2_4_1,
version_2_4_0,
version_2_3_X,
version_2_3_99_0,
version_2_3_2,
version_2_3_1,
version_2_3_0,
version_2_2_X,
version_2_2_99_1,
version_2_2_99_0,
version_2_2_2,
version_2_2_1,
version_2_2_0,
version_2_1_X,
version_2_1_99_3,
version_2_1_99_2,
version_2_1_99_1,
version_2_1_99_0,
version_2_1_3,
version_2_1_2,
version_2_1_1,
version_2_1_0,
version_2_0_X,
version_2_0_99_1,
version_2_0_2,
version_2_0_1,
version_2_0_0,
version_1_99_3,
version_1_99_2,
version_1_99_1_tmcc,
version_1_99_1,
version_1_99_0_tmcc,
version_1_99_0,
version_1_3_X,
version_1_3_3,
version_1_3_2,
version_1_3_1,
version_1_3_0,
version_1_2_X,
version_1_2_99_1,
version_1_2_99_0,
version_1_2_1,
version_1_2_0,
version_1_1_99_5,
version_1_1_99_4,
version_1_1_99_3,
version_1_1_99_2,
version_1_1_99_1,
version_1_1_99_0,
HEAD
Install HTMLArea
1: /** This file is derived from PopupDiv, developed by Mihai Bazon for
2: * SamWare.net. Modifications were needed to make it usable in HTMLArea.
3: * HTMLArea is a free WYSIWYG online HTML editor from InteractiveTools.com.
4: *
5: * This file does not function standalone. It is dependent of global functions
6: * defined in HTMLArea-3.0 (htmlarea.js).
7: *
8: * Please see file htmlarea.js for further details.
9: **/
10:
11: var is_ie = ( (navigator.userAgent.toLowerCase().indexOf("msie") != -1) &&
12: (navigator.userAgent.toLowerCase().indexOf("opera") == -1) );
13: var is_compat = (document.compatMode == "BackCompat");
14:
15: function PopupDiv(editor, titleText, handler, initFunction) {
16: var self = this;
17:
18: this.editor = editor;
19: this.doc = editor._mdoc;
20: this.handler = handler;
21:
22: var el = this.doc.createElement("div");
23: el.className = "content";
24:
25: var popup = this.doc.createElement("div");
26: popup.className = "dialog popupdiv";
27: this.element = popup;
28: var s = popup.style;
29: s.position = "absolute";
30: s.left = "0px";
31: s.top = "0px";
32:
33: var title = this.doc.createElement("div");
34: title.className = "title";
35: this.title = title;
36: popup.appendChild(title);
37:
38: HTMLArea._addEvent(title, "mousedown", function(ev) {
39: self._dragStart(is_ie ? window.event : ev);
40: });
41:
42: var button = this.doc.createElement("div");
43: button.className = "button";
44: title.appendChild(button);
45: button.innerHTML = "×";
46: title.appendChild(this.doc.createTextNode(titleText));
47: this.titleText = titleText;
48:
49: button.onmouseover = function() {
50: this.className += " button-hilite";
51: };
52: button.onmouseout = function() {
53: this.className = this.className.replace(/\s*button-hilite\s*/g, " ");
54: };
55: button.onclick = function() {
56: this.className = this.className.replace(/\s*button-hilite\s*/g, " ");
57: self.close();
58: };
59:
60: popup.appendChild(el);
61: this.content = el;
62:
63: this.doc.body.appendChild(popup);
64:
65: this.dragging = false;
66: this.onShow = null;
67: this.onClose = null;
68: this.modal = false;
69:
70: initFunction(this);
71: };
72:
73: PopupDiv.currentPopup = null;
74:
75: PopupDiv.prototype.showAtElement = function(el, mode) {
76: this.defaultSize();
77: var pos, ew, eh;
78: var popup = this.element;
79: popup.style.display = "block";
80: var w = popup.offsetWidth;
81: var h = popup.offsetHeight;
82: popup.style.display = "none";
83: if (el != window) {
84: pos = PopupDiv.getAbsolutePos(el);
85: ew = el.offsetWidth;
86: eh = el.offsetHeight;
87: } else {
88: pos = {x:0, y:0};
89: var size = PopupDiv.getWindowSize();
90: ew = size.x;
91: eh = size.y;
92: }
93: var FX = false, FY = false;
94: if (mode.indexOf("l") != -1) {
95: pos.x -= w;
96: FX = true;
97: }
98: if (mode.indexOf("r") != -1) {
99: pos.x += ew;
100: FX = true;
101: }
102: if (mode.indexOf("t") != -1) {
103: pos.y -= h;
104: FY = true;
105: }
106: if (mode.indexOf("b") != -1) {
107: pos.y += eh;
108: FY = true;
109: }
110: if (mode.indexOf("c") != -1) {
111: FX || (pos.x += Math.round((ew - w) / 2));
112: FY || (pos.y += Math.round((eh - h) / 2));
113: }
114: this.showAt(pos.x, pos.y);
115: };
116:
117: PopupDiv.prototype.defaultSize = function() {
118: var s = this.element.style;
119: var cs = this.element.currentStyle;
120: var addX = (is_ie && is_compat) ? (parseInt(cs.borderLeftWidth) +
121: parseInt(cs.borderRightWidth) +
122: parseInt(cs.paddingLeft) +
123: parseInt(cs.paddingRight)) : 0;
124: var addY = (is_ie && is_compat) ? (parseInt(cs.borderTopWidth) +
125: parseInt(cs.borderBottomWidth) +
126: parseInt(cs.paddingTop) +
127: parseInt(cs.paddingBottom)) : 0;
128: s.display = "block";
129: s.width = (this.content.offsetWidth + addX) + "px";
130: s.height = (this.content.offsetHeight + this.title.offsetHeight) + "px";
131: s.display = "none";
132: };
133:
134: PopupDiv.prototype.showAt = function(x, y) {
135: this.defaultSize();
136: var s = this.element.style;
137: s.display = "block";
138: s.left = x + "px";
139: s.top = y + "px";
140: this.hideShowCovered();
141:
142: PopupDiv.currentPopup = this;
143: HTMLArea._addEvents(this.doc.body, ["mousedown", "click"], PopupDiv.checkPopup);
144: HTMLArea._addEvents(this.editor._doc.body, ["mousedown", "click"], PopupDiv.checkPopup);
145: if (is_ie && this.modal) {
146: this.doc.body.setCapture(false);
147: this.doc.body.onlosecapture = function() {
148: (PopupDiv.currentPopup) && (this.doc.body.setCapture(false));
149: };
150: }
151: window.event && HTMLArea._stopEvent(window.event);
152:
153: if (typeof this.onShow == "function") {
154: this.onShow();
155: } else if (typeof this.onShow == "string") {
156: eval(this.onShow);
157: }
158:
159: var field = this.element.getElementsByTagName("input")[0];
160: if (!field) {
161: field = this.element.getElementsByTagName("select")[0];
162: }
163: if (!field) {
164: field = this.element.getElementsByTagName("textarea")[0];
165: }
166: if (field) {
167: field.focus();
168: }
169: };
170:
171: PopupDiv.prototype.close = function() {
172: this.element.style.display = "none";
173: PopupDiv.currentPopup = null;
174: this.hideShowCovered();
175: HTMLArea._removeEvents(this.doc.body, ["mousedown", "click"], PopupDiv.checkPopup);
176: HTMLArea._removeEvents(this.editor._doc.body, ["mousedown", "click"], PopupDiv.checkPopup);
177: is_ie && this.modal && this.doc.body.releaseCapture();
178: if (typeof this.onClose == "function") {
179: this.onClose();
180: } else if (typeof this.onClose == "string") {
181: eval(this.onClose);
182: }
183: this.element.parentNode.removeChild(this.element);
184: };
185:
186: PopupDiv.prototype.getForm = function() {
187: var forms = this.content.getElementsByTagName("form");
188: return (forms.length > 0) ? forms[0] : null;
189: };
190:
191: PopupDiv.prototype.callHandler = function() {
192: var tags = ["input", "textarea", "select"];
193: var params = new Object();
194: for (var ti in tags) {
195: var tag = tags[ti];
196: var els = this.content.getElementsByTagName(tag);
197: for (var j = 0; j < els.length; ++j) {
198: var el = els[j];
199: params[el.name] = el.value;
200: }
201: }
202: this.handler(this, params);
203: return false;
204: };
205:
206: PopupDiv.getAbsolutePos = function(el) {
207: var r = { x: el.offsetLeft, y: el.offsetTop };
208: if (el.offsetParent) {
209: var tmp = PopupDiv.getAbsolutePos(el.offsetParent);
210: r.x += tmp.x;
211: r.y += tmp.y;
212: }
213: return r;
214: };
215:
216: PopupDiv.getWindowSize = function() {
217: if (window.innerHeight) {
218: return { y: window.innerHeight, x: window.innerWidth };
219: }
220: if (this.doc.body.clientHeight) {
221: return { y: this.doc.body.clientHeight, x: this.doc.body.clientWidth };
222: }
223: return { y: this.doc.documentElement.clientHeight, x: this.doc.documentElement.clientWidth };
224: };
225:
226: PopupDiv.prototype.hideShowCovered = function () {
227: var self = this;
228: function isContained(el) {
229: while (el) {
230: if (el == self.element) {
231: return true;
232: }
233: el = el.parentNode;
234: }
235: return false;
236: };
237: var tags = new Array("applet", "select");
238: var el = this.element;
239:
240: var p = PopupDiv.getAbsolutePos(el);
241: var EX1 = p.x;
242: var EX2 = el.offsetWidth + EX1;
243: var EY1 = p.y;
244: var EY2 = el.offsetHeight + EY1;
245:
246: if (el.style.display == "none") {
247: EX1 = EX2 = EY1 = EY2 = 0;
248: }
249:
250: for (var k = tags.length; k > 0; ) {
251: var ar = this.doc.getElementsByTagName(tags[--k]);
252: var cc = null;
253:
254: for (var i = ar.length; i > 0;) {
255: cc = ar[--i];
256: if (isContained(cc)) {
257: cc.style.visibility = "visible";
258: continue;
259: }
260:
261: p = PopupDiv.getAbsolutePos(cc);
262: var CX1 = p.x;
263: var CX2 = cc.offsetWidth + CX1;
264: var CY1 = p.y;
265: var CY2 = cc.offsetHeight + CY1;
266:
267: if ((CX1 > EX2) || (CX2 < EX1) || (CY1 > EY2) || (CY2 < EY1)) {
268: cc.style.visibility = "visible";
269: } else {
270: cc.style.visibility = "hidden";
271: }
272: }
273: }
274: };
275:
276: PopupDiv.prototype._dragStart = function (ev) {
277: if (this.dragging) {
278: return false;
279: }
280: this.dragging = true;
281: PopupDiv.currentPopup = this;
282: var posX = ev.clientX;
283: var posY = ev.clientY;
284: if (is_ie) {
285: posY += this.doc.body.scrollTop;
286: posX += this.doc.body.scrollLeft;
287: } else {
288: posY += window.scrollY;
289: posX += window.scrollX;
290: }
291: var st = this.element.style;
292: this.xOffs = posX - parseInt(st.left);
293: this.yOffs = posY - parseInt(st.top);
294: HTMLArea._addEvent(this.doc, "mousemove", PopupDiv.dragIt);
295: HTMLArea._addEvent(this.doc, "mouseover", HTMLArea._stopEvent);
296: HTMLArea._addEvent(this.doc, "mouseup", PopupDiv.dragEnd);
297: HTMLArea._stopEvent(ev);
298: };
299:
300: PopupDiv.dragIt = function (ev) {
301: var popup = PopupDiv.currentPopup;
302: if (!(popup && popup.dragging)) {
303: return false;
304: }
305: is_ie && (ev = window.event);
306: var posX = ev.clientX;
307: var posY = ev.clientY;
308: if (is_ie) {
309: posY += this.doc.body.scrollTop;
310: posX += this.doc.body.scrollLeft;
311: } else {
312: posY += window.scrollY;
313: posX += window.scrollX;
314: }
315: popup.hideShowCovered();
316: var st = popup.element.style;
317: st.left = (posX - popup.xOffs) + "px";
318: st.top = (posY - popup.yOffs) + "px";
319: HTMLArea._stopEvent(ev);
320: };
321:
322: PopupDiv.dragEnd = function () {
323: var popup = PopupDiv.currentPopup;
324: if (!popup) {
325: return false;
326: }
327: popup.dragging = false;
328: HTMLArea._removeEvent(popup.doc, "mouseup", PopupDiv.dragEnd);
329: HTMLArea._removeEvent(popup.doc, "mouseover", HTMLArea._stopEvent);
330: HTMLArea._removeEvent(popup.doc, "mousemove", PopupDiv.dragIt);
331: popup.hideShowCovered();
332: };
333:
334: PopupDiv.checkPopup = function (ev) {
335: is_ie && (ev = window.event);
336: var el = is_ie ? ev.srcElement : ev.target;
337: var cp = PopupDiv.currentPopup;
338: for (; (el != null) && (el != cp.element); el = el.parentNode);
339: if (el == null) {
340: cp.modal || ev.type == "mouseover" || cp.close();
341: HTMLArea._stopEvent(ev);
342: }
343: };
344:
345: PopupDiv.prototype.addButtons = function() {
346: var self = this;
347: var div = this.doc.createElement("div");
348: this.content.appendChild(div);
349: div.className = "buttons";
350: for (var i = 0; i < arguments.length; ++i) {
351: var btn = arguments[i];
352: var button = this.doc.createElement("button");
353: div.appendChild(button);
354: button.innerHTML = HTMLArea.I18N.buttons[btn];
355: switch (btn) {
356: case "ok":
357: button.onclick = function() {
358: self.callHandler();
359: self.close();
360: };
361: break;
362: case "cancel":
363: button.onclick = function() {
364: self.close();
365: };
366: break;
367: }
368: }
369: };
FreeBSD-CVSweb <freebsd-cvsweb@FreeBSD.org>
![[BACK]](/icons/back.gif){kind=icon}
Return to popupdiv.js CVS log ![[TXT]](/icons/text.gif){kind=icon}
![[DIR]](/icons/dir.gif){kind=icon}
Up to [LON-CAPA] / loncom / html / htmlarea