sources/plugins/html5video/dialogs/html5video.js

   1 CKEDITOR.dialog.add( 'html5video', function( editor ) {
   2     return {
   3         title: editor.lang.html5video.title,
   4         minWidth: 500,
   5         minHeight: 100,
   6         contents: [ {
   7             id: 'info',
   8             label: editor.lang.html5video.infoLabel,
   9             elements: [ {
  10                 type: 'vbox',
  11                 padding: 0,
  12                 children: [
  13                     {
  14                     type: 'hbox',
  15                     widths: [ '365px', '110px' ],
  16                     align: 'right',
  17                     children: [ {
  18                         type: 'text',
  19                         id: 'url',
  20                         label: editor.lang.html5video.allowed,
  21                         required: true,
  22                         validate: CKEDITOR.dialog.validate.notEmpty( editor.lang.html5video.urlMissing ),
  23                         setup: function( widget ) {
  24                             this.setValue( widget.data.src );
  25                         },
  26                         commit: function( widget ) {
  27                             widget.setData( 'src', this.getValue() );
  28                         }
  29                     },
  30                     {
  31                         type: 'button',
  32                         id: 'browse',
  33                         // v-align with the 'txtUrl' field.
  34                         // TODO: We need something better than a fixed size here.
  35                         style: 'display:inline-block;margin-top:14px;',
  36                         align: 'center',
  37                         label: editor.lang.common.browseServer,
  38                         hidden: true,
  39                         filebrowser: 'info:url'
  40                     } ]
  41                 } ]
  42             },
  43             {
  44                 type: 'hbox',
  45                 id: 'size',
  46                 children: [ {
  47                     type: 'text',
  48                     id: 'width',
  49                     label: editor.lang.common.width,
  50                     'default': 400,
  51                     setup: function( widget ) {
  52                         if ( widget.data.width ) {
  53                             this.setValue( widget.data.width );
  54                         }
  55                     },
  56                     commit: function( widget ) {
  57                         widget.setData( 'width', this.getValue() );
  58                     }
  59                 },
  60                 {
  61                     type: 'text',
  62                     id: 'height',
  63                     label: editor.lang.common.height,
  64                     'default': 300,
  65                     setup: function( widget ) {
  66                         if ( widget.data.height ) {
  67                             this.setValue( widget.data.height );
  68                         }
  69                     },
  70                     commit: function( widget ) {
  71                         widget.setData( 'height', this.getValue() );
  72                     }
  73                 },
  74                 ]
  75             },
  76
  77             {
  78                 type: 'hbox',
  79                 id: 'alignment',
  80                 children: [ {
  81                     type: 'radio',
  82                     id: 'align',
  83                     label: editor.lang.common.align,
  84                     items: [
  85                         [editor.lang.common.alignCenter, 'center'],
  86                         [editor.lang.common.alignLeft, 'left'],
  87                         [editor.lang.common.alignRight, 'right'],
  88                         [editor.lang.common.alignNone, 'none']
  89                     ],
  90                     'default': 'center',
  91                     setup: function( widget ) {
  92                         if ( widget.data.align ) {
  93                             this.setValue( widget.data.align );
  94                         }
  95                     },
  96                     commit: function( widget ) {
  97                         widget.setData( 'align', this.getValue() );
  98                     }
  99                 } ]
 100             } ]
 101         },
 102         {
 103             id: 'Upload',
 104             hidden: true,
 105             filebrowser: 'uploadButton',
 106             label: editor.lang.html5video.upload,
 107             elements: [ {
 108                 type: 'file',
 109                 id: 'upload',
 110                 label: editor.lang.html5video.btnUpload,
 111                 style: 'height:40px',
 112                 size: 38
 113             },
 114             {
 115                 type: 'fileButton',
 116                 id: 'uploadButton',
 117                 filebrowser: 'info:url',
 118                 label: editor.lang.html5video.btnUpload,
 119                 'for': [ 'Upload', 'upload' ]
 120             } ]
 121         },
 122         {
 123             id: 'advanced',
 124             label: editor.lang.html5video.advanced,
 125             elements: [ {
 126                 type: 'vbox',
 127                 padding: 0,
 128                 children: [ {
 129                     type: 'hbox',
 130                     children: [ {
 131                         type: 'radio',
 132                         id: 'autoplay',
 133                         label: editor.lang.html5video.autoplay,
 134                         items: [
 135                             [editor.lang.html5video.yes, 'yes'],
 136                             [editor.lang.html5video.no, 'no']
 137                         ],
 138                         'default': 'no',
 139                         setup: function( widget ) {
 140                             if ( widget.data.autoplay ) {
 141                                 this.setValue( widget.data.autoplay );
 142                             }
 143                         },
 144                         commit: function( widget ) {
 145                             widget.setData( 'autoplay', this.getValue() );
 146                         }
 147                     } ]
 148                 } ]
 149             } ]
 150         } ]
 151     };
 152 } );