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