httemplate/elements/fckeditor/editor/dialog/fck_image/fck_image.js

   1 /*\r
   2  * FCKeditor - The text editor for Internet - http://www.fckeditor.net\r
   3  * Copyright (C) 2003-2007 Frederico Caldeira Knabben\r
   4  *\r
   5  * == BEGIN LICENSE ==\r
   6  *\r
   7  * Licensed under the terms of any of the following licenses at your\r
   8  * choice:\r
   9  *\r
  10  *  - GNU General Public License Version 2 or later (the "GPL")\r
  11  *    http://www.gnu.org/licenses/gpl.html\r
  12  *\r
  13  *  - GNU Lesser General Public License Version 2.1 or later (the "LGPL")\r
  14  *    http://www.gnu.org/licenses/lgpl.html\r
  15  *\r
  16  *  - Mozilla Public License Version 1.1 or later (the "MPL")\r
  17  *    http://www.mozilla.org/MPL/MPL-1.1.html\r
  18  *\r
  19  * == END LICENSE ==\r
  20  *\r
  21  * Scripts related to the Image dialog window (see fck_image.html).\r
  22  */\r
  23 \r
  24 var oEditor             = window.parent.InnerDialogLoaded() ;\r
  25 var FCK                 = oEditor.FCK ;\r
  26 var FCKLang             = oEditor.FCKLang ;\r
  27 var FCKConfig   = oEditor.FCKConfig ;\r
  28 var FCKDebug    = oEditor.FCKDebug ;\r
  29 \r
  30 var bImageButton = ( document.location.search.length > 0 && document.location.search.substr(1) == 'ImageButton' ) ;\r
  31 \r
  32 //#### Dialog Tabs\r
  33 \r
  34 // Set the dialog tabs.\r
  35 window.parent.AddTab( 'Info', FCKLang.DlgImgInfoTab ) ;\r
  36 \r
  37 if ( !bImageButton && !FCKConfig.ImageDlgHideLink )\r
  38         window.parent.AddTab( 'Link', FCKLang.DlgImgLinkTab ) ;\r
  39 \r
  40 if ( FCKConfig.ImageUpload )\r
  41         window.parent.AddTab( 'Upload', FCKLang.DlgLnkUpload ) ;\r
  42 \r
  43 if ( !FCKConfig.ImageDlgHideAdvanced )\r
  44         window.parent.AddTab( 'Advanced', FCKLang.DlgAdvancedTag ) ;\r
  45 \r
  46 // Function called when a dialog tag is selected.\r
  47 function OnDialogTabChange( tabCode )\r
  48 {\r
  49         ShowE('divInfo'         , ( tabCode == 'Info' ) ) ;\r
  50         ShowE('divLink'         , ( tabCode == 'Link' ) ) ;\r
  51         ShowE('divUpload'       , ( tabCode == 'Upload' ) ) ;\r
  52         ShowE('divAdvanced'     , ( tabCode == 'Advanced' ) ) ;\r
  53 }\r
  54 \r
  55 // Get the selected image (if available).\r
  56 var oImage = FCK.Selection.GetSelectedElement() ;\r
  57 \r
  58 if ( oImage && oImage.tagName != 'IMG' && !( oImage.tagName == 'INPUT' && oImage.type == 'image' ) )\r
  59         oImage = null ;\r
  60 \r
  61 // Get the active link.\r
  62 var oLink = FCK.Selection.MoveToAncestorNode( 'A' ) ;\r
  63 \r
  64 var oImageOriginal ;\r
  65 \r
  66 function UpdateOriginal( resetSize )\r
  67 {\r
  68         if ( !eImgPreview )\r
  69                 return ;\r
  70 \r
  71         if ( GetE('txtUrl').value.length == 0 )\r
  72         {\r
  73                 oImageOriginal = null ;\r
  74                 return ;\r
  75         }\r
  76 \r
  77         oImageOriginal = document.createElement( 'IMG' ) ;      // new Image() ;\r
  78 \r
  79         if ( resetSize )\r
  80         {\r
  81                 oImageOriginal.onload = function()\r
  82                 {\r
  83                         this.onload = null ;\r
  84                         ResetSizes() ;\r
  85                 }\r
  86         }\r
  87 \r
  88         oImageOriginal.src = eImgPreview.src ;\r
  89 }\r
  90 \r
  91 var bPreviewInitialized ;\r
  92 \r
  93 window.onload = function()\r
  94 {\r
  95         // Translate the dialog box texts.\r
  96         oEditor.FCKLanguageManager.TranslatePage(document) ;\r
  97 \r
  98         GetE('btnLockSizes').title = FCKLang.DlgImgLockRatio ;\r
  99         GetE('btnResetSize').title = FCKLang.DlgBtnResetSize ;\r
 100 \r
 101         // Load the selected element information (if any).\r
 102         LoadSelection() ;\r
 103 \r
 104         // Show/Hide the "Browse Server" button.\r
 105         GetE('tdBrowse').style.display                          = FCKConfig.ImageBrowser        ? '' : 'none' ;\r
 106         GetE('divLnkBrowseServer').style.display        = FCKConfig.LinkBrowser         ? '' : 'none' ;\r
 107 \r
 108         UpdateOriginal() ;\r
 109 \r
 110         // Set the actual uploader URL.\r
 111         if ( FCKConfig.ImageUpload )\r
 112                 GetE('frmUpload').action = FCKConfig.ImageUploadURL ;\r
 113 \r
 114         window.parent.SetAutoSize( true ) ;\r
 115 \r
 116         // Activate the "OK" button.\r
 117         window.parent.SetOkButton( true ) ;\r
 118 }\r
 119 \r
 120 function LoadSelection()\r
 121 {\r
 122         if ( ! oImage ) return ;\r
 123 \r
 124         var sUrl = oImage.getAttribute( '_fcksavedurl' ) ;\r
 125         if ( sUrl == null )\r
 126                 sUrl = GetAttribute( oImage, 'src', '' ) ;\r
 127 \r
 128         GetE('txtUrl').value    = sUrl ;\r
 129         GetE('txtAlt').value    = GetAttribute( oImage, 'alt', '' ) ;\r
 130         GetE('txtVSpace').value = GetAttribute( oImage, 'vspace', '' ) ;\r
 131         GetE('txtHSpace').value = GetAttribute( oImage, 'hspace', '' ) ;\r
 132         GetE('txtBorder').value = GetAttribute( oImage, 'border', '' ) ;\r
 133         GetE('cmbAlign').value  = GetAttribute( oImage, 'align', '' ) ;\r
 134 \r
 135         var iWidth, iHeight ;\r
 136 \r
 137         var regexSize = /^\s*(\d+)px\s*$/i ;\r
 138 \r
 139         if ( oImage.style.width )\r
 140         {\r
 141                 var aMatchW  = oImage.style.width.match( regexSize ) ;\r
 142                 if ( aMatchW )\r
 143                 {\r
 144                         iWidth = aMatchW[1] ;\r
 145                         oImage.style.width = '' ;\r
 146                         SetAttribute( oImage, 'width' , iWidth ) ;\r
 147                 }\r
 148         }\r
 149 \r
 150         if ( oImage.style.height )\r
 151         {\r
 152                 var aMatchH  = oImage.style.height.match( regexSize ) ;\r
 153                 if ( aMatchH )\r
 154                 {\r
 155                         iHeight = aMatchH[1] ;\r
 156                         oImage.style.height = '' ;\r
 157                         SetAttribute( oImage, 'height', iHeight ) ;\r
 158                 }\r
 159         }\r
 160 \r
 161         GetE('txtWidth').value  = iWidth ? iWidth : GetAttribute( oImage, "width", '' ) ;\r
 162         GetE('txtHeight').value = iHeight ? iHeight : GetAttribute( oImage, "height", '' ) ;\r
 163 \r
 164         // Get Advances Attributes\r
 165         GetE('txtAttId').value                  = oImage.id ;\r
 166         GetE('cmbAttLangDir').value             = oImage.dir ;\r
 167         GetE('txtAttLangCode').value    = oImage.lang ;\r
 168         GetE('txtAttTitle').value               = oImage.title ;\r
 169         GetE('txtLongDesc').value               = oImage.longDesc ;\r
 170 \r
 171         if ( oEditor.FCKBrowserInfo.IsIE )\r
 172         {\r
 173                 GetE('txtAttClasses').value = oImage.className || '' ;\r
 174                 GetE('txtAttStyle').value = oImage.style.cssText ;\r
 175         }\r
 176         else\r
 177         {\r
 178                 GetE('txtAttClasses').value = oImage.getAttribute('class',2) || '' ;\r
 179                 GetE('txtAttStyle').value = oImage.getAttribute('style',2) ;\r
 180         }\r
 181 \r
 182         if ( oLink )\r
 183         {\r
 184                 var sLinkUrl = oLink.getAttribute( '_fcksavedurl' ) ;\r
 185                 if ( sLinkUrl == null )\r
 186                         sLinkUrl = oLink.getAttribute('href',2) ;\r
 187 \r
 188                 GetE('txtLnkUrl').value         = sLinkUrl ;\r
 189                 GetE('cmbLnkTarget').value      = oLink.target ;\r
 190         }\r
 191 \r
 192         UpdatePreview() ;\r
 193 }\r
 194 \r
 195 //#### The OK button was hit.\r
 196 function Ok()\r
 197 {\r
 198         if ( GetE('txtUrl').value.length == 0 )\r
 199         {\r
 200                 window.parent.SetSelectedTab( 'Info' ) ;\r
 201                 GetE('txtUrl').focus() ;\r
 202 \r
 203                 alert( FCKLang.DlgImgAlertUrl ) ;\r
 204 \r
 205                 return false ;\r
 206         }\r
 207 \r
 208         var bHasImage = ( oImage != null ) ;\r
 209 \r
 210         if ( bHasImage && bImageButton && oImage.tagName == 'IMG' )\r
 211         {\r
 212                 if ( confirm( 'Do you want to transform the selected image on a image button?' ) )\r
 213                         oImage = null ;\r
 214         }\r
 215         else if ( bHasImage && !bImageButton && oImage.tagName == 'INPUT' )\r
 216         {\r
 217                 if ( confirm( 'Do you want to transform the selected image button on a simple image?' ) )\r
 218                         oImage = null ;\r
 219         }\r
 220 \r
 221         if ( !bHasImage )\r
 222         {\r
 223                 if ( bImageButton )\r
 224                 {\r
 225                         oImage = FCK.EditorDocument.createElement( 'INPUT' ) ;\r
 226                         oImage.type = 'image' ;\r
 227                         oImage = FCK.InsertElementAndGetIt( oImage ) ;\r
 228                 }\r
 229                 else\r
 230                         oImage = FCK.CreateElement( 'IMG' ) ;\r
 231         }\r
 232         else\r
 233                 oEditor.FCKUndo.SaveUndoStep() ;\r
 234 \r
 235         UpdateImage( oImage ) ;\r
 236 \r
 237         var sLnkUrl = GetE('txtLnkUrl').value.Trim() ;\r
 238 \r
 239         if ( sLnkUrl.length == 0 )\r
 240         {\r
 241                 if ( oLink )\r
 242                         FCK.ExecuteNamedCommand( 'Unlink' ) ;\r
 243         }\r
 244         else\r
 245         {\r
 246                 if ( oLink )    // Modifying an existent link.\r
 247                         oLink.href = sLnkUrl ;\r
 248                 else                    // Creating a new link.\r
 249                 {\r
 250                         if ( !bHasImage )\r
 251                                 oEditor.FCKSelection.SelectNode( oImage ) ;\r
 252 \r
 253                         oLink = oEditor.FCK.CreateLink( sLnkUrl )[0] ;\r
 254 \r
 255                         if ( !bHasImage )\r
 256                         {\r
 257                                 oEditor.FCKSelection.SelectNode( oLink ) ;\r
 258                                 oEditor.FCKSelection.Collapse( false ) ;\r
 259                         }\r
 260                 }\r
 261 \r
 262                 SetAttribute( oLink, '_fcksavedurl', sLnkUrl ) ;\r
 263                 SetAttribute( oLink, 'target', GetE('cmbLnkTarget').value ) ;\r
 264         }\r
 265 \r
 266         return true ;\r
 267 }\r
 268 \r
 269 function UpdateImage( e, skipId )\r
 270 {\r
 271         e.src = GetE('txtUrl').value ;\r
 272         SetAttribute( e, "_fcksavedurl", GetE('txtUrl').value ) ;\r
 273         SetAttribute( e, "alt"   , GetE('txtAlt').value ) ;\r
 274         SetAttribute( e, "width" , GetE('txtWidth').value ) ;\r
 275         SetAttribute( e, "height", GetE('txtHeight').value ) ;\r
 276         SetAttribute( e, "vspace", GetE('txtVSpace').value ) ;\r
 277         SetAttribute( e, "hspace", GetE('txtHSpace').value ) ;\r
 278         SetAttribute( e, "border", GetE('txtBorder').value ) ;\r
 279         SetAttribute( e, "align" , GetE('cmbAlign').value ) ;\r
 280 \r
 281         // Advances Attributes\r
 282 \r
 283         if ( ! skipId )\r
 284                 SetAttribute( e, 'id', GetE('txtAttId').value ) ;\r
 285 \r
 286         SetAttribute( e, 'dir'          , GetE('cmbAttLangDir').value ) ;\r
 287         SetAttribute( e, 'lang'         , GetE('txtAttLangCode').value ) ;\r
 288         SetAttribute( e, 'title'        , GetE('txtAttTitle').value ) ;\r
 289         SetAttribute( e, 'longDesc'     , GetE('txtLongDesc').value ) ;\r
 290 \r
 291         if ( oEditor.FCKBrowserInfo.IsIE )\r
 292         {\r
 293                 e.className = GetE('txtAttClasses').value ;\r
 294                 e.style.cssText = GetE('txtAttStyle').value ;\r
 295         }\r
 296         else\r
 297         {\r
 298                 SetAttribute( e, 'class'        , GetE('txtAttClasses').value ) ;\r
 299                 SetAttribute( e, 'style', GetE('txtAttStyle').value ) ;\r
 300         }\r
 301 }\r
 302 \r
 303 var eImgPreview ;\r
 304 var eImgPreviewLink ;\r
 305 \r
 306 function SetPreviewElements( imageElement, linkElement )\r
 307 {\r
 308         eImgPreview = imageElement ;\r
 309         eImgPreviewLink = linkElement ;\r
 310 \r
 311         UpdatePreview() ;\r
 312         UpdateOriginal() ;\r
 313 \r
 314         bPreviewInitialized = true ;\r
 315 }\r
 316 \r
 317 function UpdatePreview()\r
 318 {\r
 319         if ( !eImgPreview || !eImgPreviewLink )\r
 320                 return ;\r
 321 \r
 322         if ( GetE('txtUrl').value.length == 0 )\r
 323                 eImgPreviewLink.style.display = 'none' ;\r
 324         else\r
 325         {\r
 326                 UpdateImage( eImgPreview, true ) ;\r
 327 \r
 328                 if ( GetE('txtLnkUrl').value.Trim().length > 0 )\r
 329                         eImgPreviewLink.href = 'javascript:void(null);' ;\r
 330                 else\r
 331                         SetAttribute( eImgPreviewLink, 'href', '' ) ;\r
 332 \r
 333                 eImgPreviewLink.style.display = '' ;\r
 334         }\r
 335 }\r
 336 \r
 337 var bLockRatio = true ;\r
 338 \r
 339 function SwitchLock( lockButton )\r
 340 {\r
 341         bLockRatio = !bLockRatio ;\r
 342         lockButton.className = bLockRatio ? 'BtnLocked' : 'BtnUnlocked' ;\r
 343         lockButton.title = bLockRatio ? 'Lock sizes' : 'Unlock sizes' ;\r
 344 \r
 345         if ( bLockRatio )\r
 346         {\r
 347                 if ( GetE('txtWidth').value.length > 0 )\r
 348                         OnSizeChanged( 'Width', GetE('txtWidth').value ) ;\r
 349                 else\r
 350                         OnSizeChanged( 'Height', GetE('txtHeight').value ) ;\r
 351         }\r
 352 }\r
 353 \r
 354 // Fired when the width or height input texts change\r
 355 function OnSizeChanged( dimension, value )\r
 356 {\r
 357         // Verifies if the aspect ration has to be mantained\r
 358         if ( oImageOriginal && bLockRatio )\r
 359         {\r
 360                 var e = dimension == 'Width' ? GetE('txtHeight') : GetE('txtWidth') ;\r
 361 \r
 362                 if ( value.length == 0 || isNaN( value ) )\r
 363                 {\r
 364                         e.value = '' ;\r
 365                         return ;\r
 366                 }\r
 367 \r
 368                 if ( dimension == 'Width' )\r
 369                         value = value == 0 ? 0 : Math.round( oImageOriginal.height * ( value  / oImageOriginal.width ) ) ;\r
 370                 else\r
 371                         value = value == 0 ? 0 : Math.round( oImageOriginal.width  * ( value / oImageOriginal.height ) ) ;\r
 372 \r
 373                 if ( !isNaN( value ) )\r
 374                         e.value = value ;\r
 375         }\r
 376 \r
 377         UpdatePreview() ;\r
 378 }\r
 379 \r
 380 // Fired when the Reset Size button is clicked\r
 381 function ResetSizes()\r
 382 {\r
 383         if ( ! oImageOriginal ) return ;\r
 384 \r
 385         GetE('txtWidth').value  = oImageOriginal.width ;\r
 386         GetE('txtHeight').value = oImageOriginal.height ;\r
 387 \r
 388         UpdatePreview() ;\r
 389 }\r
 390 \r
 391 function BrowseServer()\r
 392 {\r
 393         OpenServerBrowser(\r
 394                 'Image',\r
 395                 FCKConfig.ImageBrowserURL,\r
 396                 FCKConfig.ImageBrowserWindowWidth,\r
 397                 FCKConfig.ImageBrowserWindowHeight ) ;\r
 398 }\r
 399 \r
 400 function LnkBrowseServer()\r
 401 {\r
 402         OpenServerBrowser(\r
 403                 'Link',\r
 404                 FCKConfig.LinkBrowserURL,\r
 405                 FCKConfig.LinkBrowserWindowWidth,\r
 406                 FCKConfig.LinkBrowserWindowHeight ) ;\r
 407 }\r
 408 \r
 409 function OpenServerBrowser( type, url, width, height )\r
 410 {\r
 411         sActualBrowser = type ;\r
 412         OpenFileBrowser( url, width, height ) ;\r
 413 }\r
 414 \r
 415 var sActualBrowser ;\r
 416 \r
 417 function SetUrl( url, width, height, alt )\r
 418 {\r
 419         if ( sActualBrowser == 'Link' )\r
 420         {\r
 421                 GetE('txtLnkUrl').value = url ;\r
 422                 UpdatePreview() ;\r
 423         }\r
 424         else\r
 425         {\r
 426                 GetE('txtUrl').value = url ;\r
 427                 GetE('txtWidth').value = width ? width : '' ;\r
 428                 GetE('txtHeight').value = height ? height : '' ;\r
 429 \r
 430                 if ( alt )\r
 431                         GetE('txtAlt').value = alt;\r
 432 \r
 433                 UpdatePreview() ;\r
 434                 UpdateOriginal( true ) ;\r
 435         }\r
 436 \r
 437         window.parent.SetSelectedTab( 'Info' ) ;\r
 438 }\r
 439 \r
 440 function OnUploadCompleted( errorNumber, fileUrl, fileName, customMsg )\r
 441 {\r
 442         switch ( errorNumber )\r
 443         {\r
 444                 case 0 :        // No errors\r
 445                         alert( 'Your file has been successfully uploaded' ) ;\r
 446                         break ;\r
 447                 case 1 :        // Custom error\r
 448                         alert( customMsg ) ;\r
 449                         return ;\r
 450                 case 101 :      // Custom warning\r
 451                         alert( customMsg ) ;\r
 452                         break ;\r
 453                 case 201 :\r
 454                         alert( 'A file with the same name is already available. The uploaded file has been renamed to "' + fileName + '"' ) ;\r
 455                         break ;\r
 456                 case 202 :\r
 457                         alert( 'Invalid file type' ) ;\r
 458                         return ;\r
 459                 case 203 :\r
 460                         alert( "Security error. You probably don't have enough permissions to upload. Please check your server." ) ;\r
 461                         return ;\r
 462                 default :\r
 463                         alert( 'Error on file upload. Error number: ' + errorNumber ) ;\r
 464                         return ;\r
 465         }\r
 466 \r
 467         sActualBrowser = '' ;\r
 468         SetUrl( fileUrl ) ;\r
 469         GetE('frmUpload').reset() ;\r
 470 }\r
 471 \r
 472 var oUploadAllowedExtRegex      = new RegExp( FCKConfig.ImageUploadAllowedExtensions, 'i' ) ;\r
 473 var oUploadDeniedExtRegex       = new RegExp( FCKConfig.ImageUploadDeniedExtensions, 'i' ) ;\r
 474 \r
 475 function CheckUpload()\r
 476 {\r
 477         var sFile = GetE('txtUploadFile').value ;\r
 478 \r
 479         if ( sFile.length == 0 )\r
 480         {\r
 481                 alert( 'Please select a file to upload' ) ;\r
 482                 return false ;\r
 483         }\r
 484 \r
 485         if ( ( FCKConfig.ImageUploadAllowedExtensions.length > 0 && !oUploadAllowedExtRegex.test( sFile ) ) ||\r
 486                 ( FCKConfig.ImageUploadDeniedExtensions.length > 0 && oUploadDeniedExtRegex.test( sFile ) ) )\r
 487         {\r
 488                 OnUploadCompleted( 202 ) ;\r
 489                 return false ;\r
 490         }\r
 491 \r
 492         return true ;\r
 493 }