public/javascripts/tiny_mce/plugins/inlinepopups/jscripts/mcwindows.js

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