webcit/tiny_mce/plugins/inlinepopups/jscripts/mcwindows.js

   1 /**\r
   2  * $RCSfile: mcwindows.js,v $\r
   3  * $Revision: 1.2 $\r
   4  * $Date: 2005/10/18 13:59:43 $\r
   5  *\r
   6  * Moxiecode DHTML Windows script.\r
   7  *\r
   8  * @author Moxiecode\r
   9  * @copyright Copyright © 2004, Moxiecode Systems AB, All rights reserved.\r
  10  */\r
  11 \r
  12 // Windows handler\r
  13 function MCWindows() {\r
  14         this.settings = new Array();\r
  15         this.windows = new Array();\r
  16         this.isMSIE = (navigator.appName == "Microsoft Internet Explorer");\r
  17         this.isGecko = navigator.userAgent.indexOf('Gecko') != -1;\r
  18         this.isSafari = navigator.userAgent.indexOf('Safari') != -1;\r
  19         this.isMac = navigator.userAgent.indexOf('Mac') != -1;\r
  20         this.isMSIE5_0 = this.isMSIE && (navigator.userAgent.indexOf('MSIE 5.0') != -1);\r
  21         this.action = "none";\r
  22         this.selectedWindow = null;\r
  23         this.zindex = 100;\r
  24         this.mouseDownScreenX = 0;\r
  25         this.mouseDownScreenY = 0;\r
  26         this.mouseDownLayerX = 0;\r
  27         this.mouseDownLayerY = 0;\r
  28         this.mouseDownWidth = 0;\r
  29         this.mouseDownHeight = 0;\r
  30 };\r
  31 \r
  32 MCWindows.prototype.init = function(settings) {\r
  33         this.settings = settings;\r
  34 \r
  35         if (this.isMSIE)\r
  36                 this.addEvent(document, "mousemove", mcWindows.eventDispatcher);\r
  37         else\r
  38                 this.addEvent(window, "mousemove", mcWindows.eventDispatcher);\r
  39 \r
  40         this.addEvent(document, "mouseup", mcWindows.eventDispatcher);\r
  41 };\r
  42 \r
  43 MCWindows.prototype.getParam = function(name, default_value) {\r
  44         var value = null;\r
  45 \r
  46         value = (typeof(this.settings[name]) == "undefined") ? default_value : this.settings[name];\r
  47 \r
  48         // Fix bool values\r
  49         if (value == "true" || value == "false")\r
  50                 return (value == "true");\r
  51 \r
  52         return value;\r
  53 };\r
  54 \r
  55 MCWindows.prototype.eventDispatcher = function(e) {\r
  56         e = typeof(e) == "undefined" ? window.event : e;\r
  57 \r
  58         if (mcWindows.selectedWindow == null)\r
  59                 return;\r
  60 \r
  61         // Switch focus\r
  62         if (mcWindows.isGecko && e.type == "mousedown") {\r
  63                 var elm = e.currentTarget;\r
  64 \r
  65                 for (var n in mcWindows.windows) {\r
  66                         var win = mcWindows.windows[n];\r
  67                         if (typeof(win) == 'function')\r
  68                                 continue;\r
  69 \r
  70                         if (win.headElement == elm || win.resizeElement == elm) {\r
  71                                 win.focus();\r
  72                                 break;\r
  73                         }\r
  74                 }\r
  75         }\r
  76 \r
  77         switch (e.type) {\r
  78                 case "mousemove":\r
  79                         mcWindows.selectedWindow.onMouseMove(e);\r
  80                         break;\r
  81 \r
  82                 case "mouseup":\r
  83                         mcWindows.selectedWindow.onMouseUp(e);\r
  84                         break;\r
  85 \r
  86                 case "mousedown":\r
  87                         mcWindows.selectedWindow.onMouseDown(e);\r
  88                         break;\r
  89 \r
  90                 case "focus":\r
  91                         mcWindows.selectedWindow.onFocus(e);\r
  92                         break;\r
  93         }\r
  94 }\r
  95 \r
  96 MCWindows.prototype.addEvent = function(obj, name, handler) {\r
  97         if (this.isMSIE)\r
  98                 obj.attachEvent("on" + name, handler);\r
  99         else\r
 100                 obj.addEventListener(name, handler, true);\r
 101 };\r
 102 \r
 103 MCWindows.prototype.cancelEvent = function(e) {\r
 104         if (this.isMSIE) {\r
 105                 e.returnValue = false;\r
 106                 e.cancelBubble = true;\r
 107         } else\r
 108                 e.preventDefault();\r
 109 };\r
 110 \r
 111 MCWindows.prototype.parseFeatures = function(opts) {\r
 112         // Cleanup the options\r
 113         opts = opts.toLowerCase();\r
 114         opts = opts.replace(/;/g, ",");\r
 115         opts = opts.replace(/[^0-9a-z=,]/g, "");\r
 116 \r
 117         var optionChunks = opts.split(',');\r
 118         var options = new Array();\r
 119 \r
 120         options['left'] = 10;\r
 121         options['top'] = 10;\r
 122         options['width'] = 300;\r
 123         options['height'] = 300;\r
 124         options['resizable'] = true;\r
 125         options['minimizable'] = true;\r
 126         options['maximizable'] = true;\r
 127         options['close'] = true;\r
 128         options['movable'] = true;\r
 129 \r
 130         if (opts == "")\r
 131                 return options;\r
 132 \r
 133         for (var i=0; i<optionChunks.length; i++) {\r
 134                 var parts = optionChunks[i].split('=');\r
 135 \r
 136                 if (parts.length == 2)\r
 137                         options[parts[0]] = parts[1];\r
 138         }\r
 139 \r
 140         return options;\r
 141 };\r
 142 \r
 143 MCWindows.prototype.open = function(url, name, features) {\r
 144         var win = new MCWindow();\r
 145         var winDiv, html = "", id;\r
 146 \r
 147         features = this.parseFeatures(features);\r
 148 \r
 149         // Create div\r
 150         id = "mcWindow_" + name;\r
 151 \r
 152         width = parseInt(features['width']);\r
 153         height = parseInt(features['height'])-12-19;\r
 154 \r
 155         if (this.isMSIE)\r
 156                 width -= 2;\r
 157 \r
 158         // Setup first part of window\r
 159         win.id = id;\r
 160         win.url = url;\r
 161         win.name = name;\r
 162         win.features = features;\r
 163         this.windows[name] = win;\r
 164 \r
 165         iframeWidth = width;\r
 166         iframeHeight = height;\r
 167 \r
 168         // Create inner content\r
 169         html += '<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">';\r
 170         html += '<html>';\r
 171         html += '<head>';\r
 172         html += '<title>Wrapper iframe</title>';\r
 173         html += '<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">';\r
 174         html += '<link href="../jscripts/tiny_mce/themes/advanced/css/editor_ui.css" rel="stylesheet" type="text/css" />';\r
 175         html += '</head>';\r
 176         html += '<body onload="parent.mcWindows.onLoad(\'' + name + '\');">';\r
 177 \r
 178         html += '<div id="' + id + '_container" class="mceWindow">';\r
 179         html += '<div id="' + id + '_head" class="mceWindowHead" onmousedown="parent.mcWindows.windows[\'' + name + '\'].focus();">';\r
 180         html += '  <div id="' + id + '_title" class="mceWindowTitle"';\r
 181         html += '  onselectstart="return false;" unselectable="on" style="-moz-user-select: none !important;">No name window</div>';\r
 182         html += '    <div class="mceWindowHeadTools">';\r
 183         html += '      <a href="javascript:parent.mcWindows.windows[\'' + name + '\'].close();" onmousedown="return false;" class="mceWindowClose"><img border="0" src="../jscripts/tiny_mce/themes/advanced/images/window_close.gif" /></a>';\r
 184 //      html += '      <a href="javascript:mcWindows.windows[\'' + name + '\'].maximize();" onmousedown="return false;" class="mceWindowMaximize"></a>';\r
 185 //      html += '      <a href="javascript:mcWindows.windows[\'' + name + '\'].minimize();" onmousedown="return false;" class="mceWindowMinimize"></a>';\r
 186         html += '    </div>';\r
 187         html += '</div><div id="' + id + '_body" class="mceWindowBody" style="width: ' + width + 'px; height: ' + height + 'px;">';\r
 188         html += '<iframe id="' + id + '_iframe" name="' + id + '_iframe" onfocus="parent.mcWindows.windows[\'' + name + '\'].focus();" frameborder="0" width="' + iframeWidth + '" height="' + iframeHeight + '" src="' + url + '" class="mceWindowBodyIframe"></iframe></div>';\r
 189         html += '<div id="' + id + '_statusbar" class="mceWindowStatusbar" onmousedown="parent.mcWindows.windows[\'' + name + '\'].focus();">';\r
 190         html += '<div id="' + id + '_resize" class="mceWindowResize"><img onmousedown="parent.mcWindows.windows[\'' + name + '\'].focus();" border="0" src="../jscripts/tiny_mce/themes/advanced/images/window_resize.gif" /></div>';\r
 191         html += '</div>';\r
 192         html += '</div>';\r
 193 \r
 194         html += '</body>';\r
 195         html += '</html>';\r
 196 \r
 197         // Create iframe\r
 198         this.createFloatingIFrame(id, features['left'], features['top'], features['width'], features['height'], html);\r
 199 };\r
 200 \r
 201 // Gets called when wrapper iframe is initialized\r
 202 MCWindows.prototype.onLoad = function(name) {\r
 203         var win = mcWindows.windows[name];\r
 204         var id = "mcWindow_" + name;\r
 205         var wrapperIframe = window.frames[id + "_iframe"].frames[0];\r
 206         var wrapperDoc = window.frames[id + "_iframe"].document;\r
 207         var doc = window.frames[id + "_iframe"].document;\r
 208         var winDiv = document.getElementById("mcWindow_" + name + "_div");\r
 209         var realIframe = window.frames[id + "_iframe"].frames[0];\r
 210 \r
 211         // Set window data\r
 212         win.id = "mcWindow_" + name + "_iframe";\r
 213         win.winElement = winDiv;\r
 214         win.bodyElement = doc.getElementById(id + '_body');\r
 215         win.iframeElement = doc.getElementById(id + '_iframe');\r
 216         win.headElement = doc.getElementById(id + '_head');\r
 217         win.titleElement = doc.getElementById(id + '_title');\r
 218         win.resizeElement = doc.getElementById(id + '_resize');\r
 219         win.containerElement = doc.getElementById(id + '_container');\r
 220         win.left = win.features['left'];\r
 221         win.top = win.features['top'];\r
 222         win.frame = window.frames[id + '_iframe'].frames[0];\r
 223         win.wrapperFrame = window.frames[id + '_iframe'];\r
 224         win.wrapperIFrameElement = document.getElementById(id + "_iframe");\r
 225 \r
 226         // Add event handlers\r
 227         mcWindows.addEvent(win.headElement, "mousedown", mcWindows.eventDispatcher);\r
 228         mcWindows.addEvent(win.resizeElement, "mousedown", mcWindows.eventDispatcher);\r
 229 \r
 230         if (mcWindows.isMSIE) {\r
 231                 mcWindows.addEvent(realIframe.document, "mousemove", mcWindows.eventDispatcher);\r
 232                 mcWindows.addEvent(realIframe.document, "mouseup", mcWindows.eventDispatcher);\r
 233         } else {\r
 234                 mcWindows.addEvent(realIframe, "mousemove", mcWindows.eventDispatcher);\r
 235                 mcWindows.addEvent(realIframe, "mouseup", mcWindows.eventDispatcher);\r
 236                 mcWindows.addEvent(realIframe, "focus", mcWindows.eventDispatcher);\r
 237         }\r
 238 \r
 239         for (var i=0; i<window.frames.length; i++) {\r
 240                 if (!window.frames[i]._hasMouseHandlers) {\r
 241                         if (mcWindows.isMSIE) {\r
 242                                 mcWindows.addEvent(window.frames[i].document, "mousemove", mcWindows.eventDispatcher);\r
 243                                 mcWindows.addEvent(window.frames[i].document, "mouseup", mcWindows.eventDispatcher);\r
 244                         } else {\r
 245                                 mcWindows.addEvent(window.frames[i], "mousemove", mcWindows.eventDispatcher);\r
 246                                 mcWindows.addEvent(window.frames[i], "mouseup", mcWindows.eventDispatcher);\r
 247                         }\r
 248 \r
 249                         window.frames[i]._hasMouseHandlers = true;\r
 250                 }\r
 251         }\r
 252 \r
 253         if (mcWindows.isMSIE) {\r
 254                 mcWindows.addEvent(win.frame.document, "mousemove", mcWindows.eventDispatcher);\r
 255                 mcWindows.addEvent(win.frame.document, "mouseup", mcWindows.eventDispatcher);\r
 256         } else {\r
 257                 mcWindows.addEvent(win.frame, "mousemove", mcWindows.eventDispatcher);\r
 258                 mcWindows.addEvent(win.frame, "mouseup", mcWindows.eventDispatcher);\r
 259                 mcWindows.addEvent(win.frame, "focus", mcWindows.eventDispatcher);\r
 260         }\r
 261 \r
 262         this.selectedWindow = win;\r
 263 };\r
 264 \r
 265 MCWindows.prototype.createFloatingIFrame = function(id_prefix, left, top, width, height, html) {\r
 266         var iframe = document.createElement("iframe");\r
 267         var div = document.createElement("div");\r
 268 \r
 269         width = parseInt(width);\r
 270         height = parseInt(height)+1;\r
 271 \r
 272         // Create wrapper div\r
 273         div.setAttribute("id", id_prefix + "_div");\r
 274         div.setAttribute("width", width);\r
 275         div.setAttribute("height", (height));\r
 276         div.style.position = "absolute";\r
 277         div.style.left = left + "px";\r
 278         div.style.top = top + "px";\r
 279         div.style.width = width + "px";\r
 280         div.style.height = (height) + "px";\r
 281         div.style.backgroundColor = "white";\r
 282         div.style.display = "none";\r
 283 \r
 284         if (this.isGecko) {\r
 285                 iframeWidth = width + 2;\r
 286                 iframeHeight = height + 2;\r
 287         } else {\r
 288                 iframeWidth = width;\r
 289                 iframeHeight = height + 1;\r
 290         }\r
 291 \r
 292         // Create iframe\r
 293         iframe.setAttribute("id", id_prefix + "_iframe");\r
 294         iframe.setAttribute("name", id_prefix + "_iframe");\r
 295         iframe.setAttribute("border", "0");\r
 296         iframe.setAttribute("frameBorder", "0");\r
 297         iframe.setAttribute("marginWidth", "0");\r
 298         iframe.setAttribute("marginHeight", "0");\r
 299         iframe.setAttribute("leftMargin", "0");\r
 300         iframe.setAttribute("topMargin", "0");\r
 301         iframe.setAttribute("width", iframeWidth);\r
 302         iframe.setAttribute("height", iframeHeight);\r
 303 //      iframe.setAttribute("src", "../jscripts/tiny_mce/blank.htm");\r
 304         // iframe.setAttribute("allowtransparency", "false");\r
 305         iframe.setAttribute("scrolling", "no");\r
 306         iframe.style.width = iframeWidth + "px";\r
 307         iframe.style.height = iframeHeight + "px";\r
 308         iframe.style.backgroundColor = "white";\r
 309         div.appendChild(iframe);\r
 310 \r
 311         document.body.appendChild(div);\r
 312 \r
 313         // Fixed MSIE 5.0 issue\r
 314         div.innerHTML = div.innerHTML;\r
 315 \r
 316         if (this.isSafari) {\r
 317                 // Give Safari some time to setup\r
 318                 window.setTimeout(function() {\r
 319                         doc = window.frames[id_prefix + '_iframe'].document;\r
 320                         doc.open();\r
 321                         doc.write(html);\r
 322                         doc.close();\r
 323                 }, 10);\r
 324         } else {\r
 325                 doc = window.frames[id_prefix + '_iframe'].window.document\r
 326                 doc.open();\r
 327                 doc.write(html);\r
 328                 doc.close();\r
 329         }\r
 330 \r
 331         div.style.display = "block";\r
 332 \r
 333         return div;\r
 334 };\r
 335 \r
 336 // Window instance\r
 337 function MCWindow() {\r
 338 };\r
 339 \r
 340 MCWindow.prototype.focus = function() {\r
 341         this.winElement.style.zIndex = mcWindows.zindex++;\r
 342         mcWindows.selectedWindow = this;\r
 343 };\r
 344 \r
 345 MCWindow.prototype.minimize = function() {\r
 346 };\r
 347 \r
 348 MCWindow.prototype.maximize = function() {\r
 349         \r
 350 };\r
 351 \r
 352 MCWindow.prototype.startResize = function() {\r
 353         mcWindows.action = "resize";\r
 354 };\r
 355 \r
 356 MCWindow.prototype.startMove = function(e) {\r
 357         mcWindows.action = "move";\r
 358 };\r
 359 \r
 360 MCWindow.prototype.close = function() {\r
 361         document.body.removeChild(this.winElement);\r
 362         mcWindows.windows[this.name] = null;\r
 363 };\r
 364 \r
 365 MCWindow.prototype.onMouseMove = function(e) {\r
 366         var scrollX = 0;//this.doc.body.scrollLeft;\r
 367         var scrollY = 0;//this.doc.body.scrollTop;\r
 368 \r
 369         // Calculate real X, Y\r
 370         var dx = e.screenX - mcWindows.mouseDownScreenX;\r
 371         var dy = e.screenY - mcWindows.mouseDownScreenY;\r
 372 \r
 373         switch (mcWindows.action) {\r
 374                 case "resize":\r
 375                         width = mcWindows.mouseDownWidth + (e.screenX - mcWindows.mouseDownScreenX);\r
 376                         height = mcWindows.mouseDownHeight + (e.screenY - mcWindows.mouseDownScreenY);\r
 377 \r
 378                         width = width < 100 ? 100 : width;\r
 379                         height = height < 100 ? 100 : height;\r
 380 \r
 381                         this.wrapperIFrameElement.style.width = width+2;\r
 382                         this.wrapperIFrameElement.style.height = height+2;\r
 383                         this.wrapperIFrameElement.width = width+2;\r
 384                         this.wrapperIFrameElement.height = height+2;\r
 385                         this.winElement.style.width = width;\r
 386                         this.winElement.style.height = height;\r
 387 \r
 388                         height = height-12-19;\r
 389 \r
 390                         this.containerElement.style.width = width;\r
 391 \r
 392                         this.iframeElement.style.width = width;\r
 393                         this.iframeElement.style.height = height;\r
 394                         this.bodyElement.style.width = width;\r
 395                         this.bodyElement.style.height = height;\r
 396                         this.headElement.style.width = width;\r
 397                         //this.statusElement.style.width = width;\r
 398 \r
 399                         mcWindows.cancelEvent(e);\r
 400                         break;\r
 401 \r
 402                 case "move":\r
 403                         this.left = mcWindows.mouseDownLayerX + (e.screenX - mcWindows.mouseDownScreenX);\r
 404                         this.top = mcWindows.mouseDownLayerY + (e.screenY - mcWindows.mouseDownScreenY);\r
 405                         this.winElement.style.left = this.left + "px";\r
 406                         this.winElement.style.top = this.top + "px";\r
 407 \r
 408                         mcWindows.cancelEvent(e);\r
 409                         break;\r
 410         }\r
 411 };\r
 412 \r
 413 MCWindow.prototype.onMouseUp = function(e) {\r
 414         mcWindows.action = "none";\r
 415 };\r
 416 \r
 417 MCWindow.prototype.onFocus = function(e) {\r
 418         // Gecko only handler\r
 419         var winRef = e.currentTarget;\r
 420 \r
 421         for (var n in mcWindows.windows) {\r
 422                 var win = mcWindows.windows[n];\r
 423                 if (typeof(win) == 'function')\r
 424                         continue;\r
 425 \r
 426                 if (winRef.name == win.id) {\r
 427                         win.focus();\r
 428                         return;\r
 429                 }\r
 430         }\r
 431 };\r
 432 \r
 433 MCWindow.prototype.onMouseDown = function(e) {\r
 434         var elm = mcWindows.isMSIE ? this.wrapperFrame.event.srcElement : e.target;\r
 435 \r
 436         var scrollX = 0;//this.doc.body.scrollLeft;\r
 437         var scrollY = 0;//this.doc.body.scrollTop;\r
 438 \r
 439         mcWindows.mouseDownScreenX = e.screenX;\r
 440         mcWindows.mouseDownScreenY = e.screenY;\r
 441         mcWindows.mouseDownLayerX = this.left;\r
 442         mcWindows.mouseDownLayerY = this.top;\r
 443         mcWindows.mouseDownWidth = parseInt(this.winElement.style.width);\r
 444         mcWindows.mouseDownHeight = parseInt(this.winElement.style.height);\r
 445 \r
 446         if (elm == this.resizeElement.firstChild)\r
 447                 this.startResize(e);\r
 448         else\r
 449                 this.startMove(e);\r
 450 \r
 451         mcWindows.cancelEvent(e);\r
 452 };\r
 453 \r
 454 // Global instance\r
 455 var mcWindows = new MCWindows();\r