1 /* 2 Copyright (c) 2003-2012, CKSource - Frederico Knabben. All rights reserved. 3 For licensing, see LICENSE.html or http://ckeditor.com/license 4 */ 5 6 (function() 7 { 8 // Map 'true' and 'false' values to match W3C's specifications 9 // http://www.w3.org/TR/REC-html40/present/frames.html#h-16.5 10 var checkboxValues = 11 { 12 scrolling : { 'true' : 'yes', 'false' : 'no' }, 13 frameborder : { 'true' : '1', 'false' : '0' } 14 }; 15 16 function loadValue( iframeNode ) 17 { 18 var isCheckbox = this instanceof CKEDITOR.ui.dialog.checkbox; 19 if ( iframeNode.hasAttribute( this.id ) ) 20 { 21 var value = iframeNode.getAttribute( this.id ); 22 if ( isCheckbox ) 23 this.setValue( checkboxValues[ this.id ][ 'true' ] == value.toLowerCase() ); 24 else 25 this.setValue( value ); 26 } 27 } 28 29 function commitValue( iframeNode ) 30 { 31 var isRemove = this.getValue() === '', 32 isCheckbox = this instanceof CKEDITOR.ui.dialog.checkbox, 33 value = this.getValue(); 34 if ( isRemove ) 35 iframeNode.removeAttribute( this.att || this.id ); 36 else if ( isCheckbox ) 37 iframeNode.setAttribute( this.id, checkboxValues[ this.id ][ value ] ); 38 else 39 iframeNode.setAttribute( this.att || this.id, value ); 40 } 41 42 CKEDITOR.dialog.add( 'iframe', function( editor ) 43 { 44 var iframeLang = editor.lang.iframe, 45 commonLang = editor.lang.common, 46 dialogadvtab = editor.plugins.dialogadvtab; 47 return { 48 title : iframeLang.title, 49 minWidth : 350, 50 minHeight : 260, 51 onShow : function() 52 { 53 // Clear previously saved elements. 54 this.fakeImage = this.iframeNode = null; 55 56 var fakeImage = this.getSelectedElement(); 57 if ( fakeImage && fakeImage.data( 'cke-real-element-type' ) && fakeImage.data( 'cke-real-element-type' ) == 'iframe' ) 58 { 59 this.fakeImage = fakeImage; 60 61 var iframeNode = editor.restoreRealElement( fakeImage ); 62 this.iframeNode = iframeNode; 63 64 this.setupContent( iframeNode ); 65 } 66 }, 67 onOk : function() 68 { 69 var iframeNode; 70 if ( !this.fakeImage ) 71 iframeNode = new CKEDITOR.dom.element( 'iframe' ); 72 else 73 iframeNode = this.iframeNode; 74 75 // A subset of the specified attributes/styles 76 // should also be applied on the fake element to 77 // have better visual effect. (#5240) 78 var extraStyles = {}, extraAttributes = {}; 79 this.commitContent( iframeNode, extraStyles, extraAttributes ); 80 81 // Refresh the fake image. 82 var newFakeImage = editor.createFakeElement( iframeNode, 'cke_iframe', 'iframe', true ); 83 newFakeImage.setAttributes( extraAttributes ); 84 newFakeImage.setStyles( extraStyles ); 85 if ( this.fakeImage ) 86 { 87 newFakeImage.replace( this.fakeImage ); 88 editor.getSelection().selectElement( newFakeImage ); 89 } 90 else 91 editor.insertElement( newFakeImage ); 92 }, 93 contents : [ 94 { 95 id : 'info', 96 label : commonLang.generalTab, 97 accessKey : 'I', 98 elements : 99 [ 100 { 101 type : 'vbox', 102 padding : 0, 103 children : 104 [ 105 { 106 id : 'src', 107 type : 'text', 108 label : commonLang.url, 109 required : true, 110 validate : CKEDITOR.dialog.validate.notEmpty( iframeLang.noUrl ), 111 setup : loadValue, 112 commit : commitValue 113 } 114 ] 115 }, 116 { 117 type : 'hbox', 118 children : 119 [ 120 { 121 id : 'width', 122 type : 'text', 123 style : 'width:100%', 124 labelLayout : 'vertical', 125 label : commonLang.width, 126 validate : CKEDITOR.dialog.validate.htmlLength( commonLang.invalidHtmlLength.replace( '%1', commonLang.width ) ), 127 setup : loadValue, 128 commit : commitValue 129 }, 130 { 131 id : 'height', 132 type : 'text', 133 style : 'width:100%', 134 labelLayout : 'vertical', 135 label : commonLang.height, 136 validate : CKEDITOR.dialog.validate.htmlLength( commonLang.invalidHtmlLength.replace( '%1', commonLang.height ) ), 137 setup : loadValue, 138 commit : commitValue 139 }, 140 { 141 id : 'align', 142 type : 'select', 143 'default' : '', 144 items : 145 [ 146 [ commonLang.notSet , '' ], 147 [ commonLang.alignLeft , 'left' ], 148 [ commonLang.alignRight , 'right' ], 149 [ commonLang.alignTop , 'top' ], 150 [ commonLang.alignMiddle , 'middle' ], 151 [ commonLang.alignBottom , 'bottom' ] 152 ], 153 style : 'width:100%', 154 labelLayout : 'vertical', 155 label : commonLang.align, 156 setup : function( iframeNode, fakeImage ) 157 { 158 loadValue.apply( this, arguments ); 159 if ( fakeImage ) 160 { 161 var fakeImageAlign = fakeImage.getAttribute( 'align' ); 162 this.setValue( fakeImageAlign && fakeImageAlign.toLowerCase() || '' ); 163 } 164 }, 165 commit : function( iframeNode, extraStyles, extraAttributes ) 166 { 167 commitValue.apply( this, arguments ); 168 if ( this.getValue() ) 169 extraAttributes.align = this.getValue(); 170 } 171 } 172 ] 173 }, 174 { 175 type : 'hbox', 176 widths : [ '50%', '50%' ], 177 children : 178 [ 179 { 180 id : 'scrolling', 181 type : 'checkbox', 182 label : iframeLang.scrolling, 183 setup : loadValue, 184 commit : commitValue 185 }, 186 { 187 id : 'frameborder', 188 type : 'checkbox', 189 label : iframeLang.border, 190 setup : loadValue, 191 commit : commitValue 192 } 193 ] 194 }, 195 { 196 type : 'hbox', 197 widths : [ '50%', '50%' ], 198 children : 199 [ 200 { 201 id : 'name', 202 type : 'text', 203 label : commonLang.name, 204 setup : loadValue, 205 commit : commitValue 206 }, 207 { 208 id : 'title', 209 type : 'text', 210 label : commonLang.advisoryTitle, 211 setup : loadValue, 212 commit : commitValue 213 } 214 ] 215 }, 216 { 217 id : 'longdesc', 218 type : 'text', 219 label : commonLang.longDescr, 220 setup : loadValue, 221 commit : commitValue 222 } 223 ] 224 }, 225 dialogadvtab && dialogadvtab.createAdvancedTab( editor, { id:1, classes:1, styles:1 }) 226 ] 227 }; 228 }); 229 })(); 230