diff options
Diffstat (limited to 'sources/plugins/html5video')
-rw-r--r-- | sources/plugins/html5video/dialogs/html5video.js | 161 | ||||
-rw-r--r-- | sources/plugins/html5video/icons/html5video.png | bin | 0 -> 14773 bytes | |||
-rw-r--r-- | sources/plugins/html5video/lang/de.js | 14 | ||||
-rw-r--r-- | sources/plugins/html5video/lang/en.js | 15 | ||||
-rw-r--r-- | sources/plugins/html5video/lang/es.js | 14 | ||||
-rw-r--r-- | sources/plugins/html5video/lang/eu.js | 14 | ||||
-rw-r--r-- | sources/plugins/html5video/lang/fr.js | 14 | ||||
-rw-r--r-- | sources/plugins/html5video/lang/ru.js | 15 | ||||
-rw-r--r-- | sources/plugins/html5video/lang/uk.js | 14 | ||||
-rw-r--r-- | sources/plugins/html5video/lang/uz.js | 14 | ||||
-rw-r--r-- | sources/plugins/html5video/plugin.js | 139 |
11 files changed, 414 insertions, 0 deletions
diff --git a/sources/plugins/html5video/dialogs/html5video.js b/sources/plugins/html5video/dialogs/html5video.js new file mode 100644 index 0000000..76799e7 --- /dev/null +++ b/sources/plugins/html5video/dialogs/html5video.js | |||
@@ -0,0 +1,161 @@ | |||
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: 'checkbox', | ||
45 | id: 'responsive', | ||
46 | label: editor.lang.html5video.responsive, | ||
47 | setup: function( widget ) { | ||
48 | this.setValue( widget.data.responsive ); | ||
49 | }, | ||
50 | commit: function( widget ) { | ||
51 | widget.setData( 'responsive', this.getValue()?'true':'' ); | ||
52 | } | ||
53 | }, | ||
54 | { | ||
55 | type: 'hbox', | ||
56 | id: 'size', | ||
57 | children: [ { | ||
58 | type: 'text', | ||
59 | id: 'width', | ||
60 | label: editor.lang.common.width, | ||
61 | setup: function( widget ) { | ||
62 | if ( widget.data.width ) { | ||
63 | this.setValue( widget.data.width ); | ||
64 | } | ||
65 | }, | ||
66 | commit: function( widget ) { | ||
67 | widget.setData( 'width', this.getValue() ); | ||
68 | } | ||
69 | }, | ||
70 | { | ||
71 | type: 'text', | ||
72 | id: 'height', | ||
73 | label: editor.lang.common.height, | ||
74 | setup: function( widget ) { | ||
75 | if ( widget.data.height ) { | ||
76 | this.setValue( widget.data.height ); | ||
77 | } | ||
78 | }, | ||
79 | commit: function( widget ) { | ||
80 | widget.setData( 'height', this.getValue() ); | ||
81 | } | ||
82 | }, | ||
83 | ] | ||
84 | }, | ||
85 | |||
86 | { | ||
87 | type: 'hbox', | ||
88 | id: 'alignment', | ||
89 | children: [ { | ||
90 | type: 'radio', | ||
91 | id: 'align', | ||
92 | label: editor.lang.common.align, | ||
93 | items: [ | ||
94 | [editor.lang.common.alignCenter, 'center'], | ||
95 | [editor.lang.common.alignLeft, 'left'], | ||
96 | [editor.lang.common.alignRight, 'right'], | ||
97 | [editor.lang.common.alignNone, 'none'] | ||
98 | ], | ||
99 | 'default': 'center', | ||
100 | setup: function( widget ) { | ||
101 | if ( widget.data.align ) { | ||
102 | this.setValue( widget.data.align ); | ||
103 | } | ||
104 | }, | ||
105 | commit: function( widget ) { | ||
106 | widget.setData( 'align', this.getValue() ); | ||
107 | } | ||
108 | } ] | ||
109 | } ] | ||
110 | }, | ||
111 | { | ||
112 | id: 'Upload', | ||
113 | hidden: true, | ||
114 | filebrowser: 'uploadButton', | ||
115 | label: editor.lang.html5video.upload, | ||
116 | elements: [ { | ||
117 | type: 'file', | ||
118 | id: 'upload', | ||
119 | label: editor.lang.html5video.btnUpload, | ||
120 | style: 'height:40px', | ||
121 | size: 38 | ||
122 | }, | ||
123 | { | ||
124 | type: 'fileButton', | ||
125 | id: 'uploadButton', | ||
126 | filebrowser: 'info:url', | ||
127 | label: editor.lang.html5video.btnUpload, | ||
128 | 'for': [ 'Upload', 'upload' ] | ||
129 | } ] | ||
130 | }, | ||
131 | { | ||
132 | id: 'advanced', | ||
133 | label: editor.lang.html5video.advanced, | ||
134 | elements: [ { | ||
135 | type: 'vbox', | ||
136 | padding: 0, | ||
137 | children: [ { | ||
138 | type: 'hbox', | ||
139 | children: [ { | ||
140 | type: 'radio', | ||
141 | id: 'autoplay', | ||
142 | label: editor.lang.html5video.autoplay, | ||
143 | items: [ | ||
144 | [editor.lang.html5video.yes, 'yes'], | ||
145 | [editor.lang.html5video.no, 'no'] | ||
146 | ], | ||
147 | 'default': 'no', | ||
148 | setup: function( widget ) { | ||
149 | if ( widget.data.autoplay ) { | ||
150 | this.setValue( widget.data.autoplay ); | ||
151 | } | ||
152 | }, | ||
153 | commit: function( widget ) { | ||
154 | widget.setData( 'autoplay', this.getValue() ); | ||
155 | } | ||
156 | } ] | ||
157 | } ] | ||
158 | } ] | ||
159 | } ] | ||
160 | }; | ||
161 | } ); | ||
diff --git a/sources/plugins/html5video/icons/html5video.png b/sources/plugins/html5video/icons/html5video.png new file mode 100644 index 0000000..a246517 --- /dev/null +++ b/sources/plugins/html5video/icons/html5video.png | |||
Binary files differ | |||
diff --git a/sources/plugins/html5video/lang/de.js b/sources/plugins/html5video/lang/de.js new file mode 100644 index 0000000..ddf4c8b --- /dev/null +++ b/sources/plugins/html5video/lang/de.js | |||
@@ -0,0 +1,14 @@ | |||
1 | CKEDITOR.plugins.setLang( 'html5video', 'de', { | ||
2 | button: 'HTML5 Video einfügen', | ||
3 | title: 'HTML5 Video', | ||
4 | infoLabel: 'Video Infos', | ||
5 | allowed: 'Erlaubte Dateierweiterungen: MP4, WebM, Ogv', | ||
6 | urlMissing: 'Sie haben keine URL zur Video-Datei angegeben.', | ||
7 | videoProperties: 'Video-Einstellungen', | ||
8 | upload: 'Hochladen', | ||
9 | btnUpload: 'Zum Server senden', | ||
10 | advanced: 'Erweitert', | ||
11 | autoplay: 'Autoplay?', | ||
12 | yes: 'Ja', | ||
13 | no: 'Nein' | ||
14 | } ); | ||
diff --git a/sources/plugins/html5video/lang/en.js b/sources/plugins/html5video/lang/en.js new file mode 100644 index 0000000..40eae12 --- /dev/null +++ b/sources/plugins/html5video/lang/en.js | |||
@@ -0,0 +1,15 @@ | |||
1 | CKEDITOR.plugins.setLang( 'html5video', 'en', { | ||
2 | button: 'Insert HTML5 video', | ||
3 | title: 'HTML5 video', | ||
4 | infoLabel: 'Video info', | ||
5 | allowed: 'Allowed file extensions: MP4, WebM, Ogv', | ||
6 | urlMissing: 'Video source URL is missing.', | ||
7 | videoProperties: 'Video properties', | ||
8 | upload: 'Upload', | ||
9 | btnUpload: 'Send it to the server', | ||
10 | advanced: 'Advanced', | ||
11 | autoplay: 'Autoplay?', | ||
12 | yes: 'Yes', | ||
13 | no: 'No', | ||
14 | responsive: 'Responsive width' | ||
15 | } ); | ||
diff --git a/sources/plugins/html5video/lang/es.js b/sources/plugins/html5video/lang/es.js new file mode 100644 index 0000000..4077935 --- /dev/null +++ b/sources/plugins/html5video/lang/es.js | |||
@@ -0,0 +1,14 @@ | |||
1 | CKEDITOR.plugins.setLang( 'html5video', 'es', { | ||
2 | button: 'Insertar video HTML5', | ||
3 | title: 'Video HTML5', | ||
4 | infoLabel: 'Información del video', | ||
5 | allowed: 'Extensiones de archivo permitidas: MP4, WebM, Ogv', | ||
6 | urlMissing: 'La URL del video no puede estar vacia.', | ||
7 | videoProperties: 'Propiedades del video', | ||
8 | upload: 'Cargar', | ||
9 | btnUpload: 'Enviar al servidor', | ||
10 | advanced: 'Avanzado', | ||
11 | autoplay: '¿Reproducir automáticamente?', | ||
12 | yes: 'Si', | ||
13 | no: 'No' | ||
14 | } ); | ||
diff --git a/sources/plugins/html5video/lang/eu.js b/sources/plugins/html5video/lang/eu.js new file mode 100644 index 0000000..78635d7 --- /dev/null +++ b/sources/plugins/html5video/lang/eu.js | |||
@@ -0,0 +1,14 @@ | |||
1 | CKEDITOR.plugins.setLang( 'html5video', 'eu', { | ||
2 | button: 'Txertatu HTML5 bideoa', | ||
3 | title: 'HTML5 bideoa', | ||
4 | infoLabel: 'Bideoaren informazioa', | ||
5 | allowed: 'Baimendutako fitxategi luzapenak: MP4, WebM, Ogv', | ||
6 | urlMissing: 'Bideoaren URLak ezin du hutsik egon.', | ||
7 | videoProperties: 'Bideoaren propietateak', | ||
8 | upload: 'Kargatu', | ||
9 | btnUpload: 'Bidali zerbitzarira', | ||
10 | advanced: 'Aurreratua', | ||
11 | autoplay: 'Automatikoki erreproduzitu?', | ||
12 | yes: 'Bai', | ||
13 | no: 'Ez' | ||
14 | } ); | ||
diff --git a/sources/plugins/html5video/lang/fr.js b/sources/plugins/html5video/lang/fr.js new file mode 100644 index 0000000..326f622 --- /dev/null +++ b/sources/plugins/html5video/lang/fr.js | |||
@@ -0,0 +1,14 @@ | |||
1 | CKEDITOR.plugins.setLang( 'html5video', 'fr', { | ||
2 | button: 'Insérer un lecteur video HTML5', | ||
3 | title: 'HTML5 video', | ||
4 | infoLabel: 'Informations video', | ||
5 | allowed: 'Extensions de fichiers autorisées: MP4, WebM, Ogv', | ||
6 | urlMissing: 'URL de la source video manquante. Veuillez la renseigner.', | ||
7 | videoProperties: 'Propriétés Video', | ||
8 | upload: 'Télécharger', | ||
9 | btnUpload: 'Envoyer vers le serveur', | ||
10 | advanced: 'Avancé', | ||
11 | autoplay: 'Jouer automatiquement ?', | ||
12 | yes: 'Oui', | ||
13 | no: 'Non' | ||
14 | } ); | ||
diff --git a/sources/plugins/html5video/lang/ru.js b/sources/plugins/html5video/lang/ru.js new file mode 100644 index 0000000..cd5a195 --- /dev/null +++ b/sources/plugins/html5video/lang/ru.js | |||
@@ -0,0 +1,15 @@ | |||
1 | CKEDITOR.plugins.setLang( 'html5video', 'ru', { | ||
2 | button: 'Вставить HTML5 видео', | ||
3 | title: 'HTML5 видео', | ||
4 | infoLabel: 'Видео', | ||
5 | allowed: 'Допустимые расширения файлов: MP4, WebM, Ogv', | ||
6 | urlMissing: 'Не выбран источник видео', | ||
7 | videoProperties: 'Свойства видео', | ||
8 | upload: 'Загрузить', | ||
9 | btnUpload: 'Загрузить на сервер', | ||
10 | advanced: 'Дополнительно', | ||
11 | autoplay: 'Автовоспроизведение', | ||
12 | yes: 'Да', | ||
13 | no: 'Нет', | ||
14 | responsive: 'Адаптивная ширина' | ||
15 | } ); | ||
diff --git a/sources/plugins/html5video/lang/uk.js b/sources/plugins/html5video/lang/uk.js new file mode 100644 index 0000000..32b920c --- /dev/null +++ b/sources/plugins/html5video/lang/uk.js | |||
@@ -0,0 +1,14 @@ | |||
1 | CKEDITOR.plugins.setLang( 'html5video', 'uk', { | ||
2 | button: 'Вставити HTML5 відео', | ||
3 | title: 'HTML5 відео', | ||
4 | infoLabel: 'Інформація', | ||
5 | allowed: 'Допустимі розширення файлів: MP4, WebM, Ogv', | ||
6 | urlMissing: 'Не обрано джерела відео', | ||
7 | videoProperties: 'Властивості відео', | ||
8 | upload: 'Відвантажити', | ||
9 | btnUpload: 'Відвантажити на сервер', | ||
10 | advanced: 'Додатково', | ||
11 | autoplay: 'Автовідтворення?', | ||
12 | yes: 'Так', | ||
13 | no: 'Ні' | ||
14 | } ); | ||
diff --git a/sources/plugins/html5video/lang/uz.js b/sources/plugins/html5video/lang/uz.js new file mode 100644 index 0000000..5fec9a2 --- /dev/null +++ b/sources/plugins/html5video/lang/uz.js | |||
@@ -0,0 +1,14 @@ | |||
1 | CKEDITOR.plugins.setLang( 'html5video', 'uz', { | ||
2 | button: 'HTML5 video qo‘shing', | ||
3 | title: 'HTML5 video', | ||
4 | infoLabel: 'Video ma\'lumot', | ||
5 | allowed: 'Ruxsat etilgan kengaytmalar: MP4, WebM, Ogv', | ||
6 | urlMissing: 'Video\'ning URL manbasi topilmadi.', | ||
7 | videoProperties: 'Video xususiyatlari', | ||
8 | upload: 'Yuklash', | ||
9 | btnUpload: 'Serverga jo‘natish', | ||
10 | advanced: 'Kengaytrilgan', | ||
11 | autoplay: 'Avtoijro?', | ||
12 | yes: 'Ha', | ||
13 | no: 'Yo‘q' | ||
14 | } ); | ||
diff --git a/sources/plugins/html5video/plugin.js b/sources/plugins/html5video/plugin.js new file mode 100644 index 0000000..bf51285 --- /dev/null +++ b/sources/plugins/html5video/plugin.js | |||
@@ -0,0 +1,139 @@ | |||
1 | CKEDITOR.plugins.add( 'html5video', { | ||
2 | requires: 'widget', | ||
3 | lang: 'de,en,eu,es,ru,uk,fr', | ||
4 | icons: 'html5video', | ||
5 | init: function( editor ) { | ||
6 | editor.widgets.add( 'html5video', { | ||
7 | button: editor.lang.html5video.button, | ||
8 | template: '<div class="ckeditor-html5-video"></div>', | ||
9 | /* | ||
10 | * Allowed content rules (http://docs.ckeditor.com/#!/guide/dev_allowed_content_rules): | ||
11 | * - div-s with text-align,float,margin-left,margin-right inline style rules and required ckeditor-html5-video class. | ||
12 | * - video tags with src, controls, width and height attributes. | ||
13 | */ | ||
14 | allowedContent: 'div[data-responsive](!ckeditor-html5-video){text-align,float,margin-left,margin-right}; video[src,controls,autoplay,width, height]{max-width,height};', | ||
15 | requiredContent: 'div(ckeditor-html5-video); video[src,controls];', | ||
16 | upcast: function( element ) { | ||
17 | return element.name === 'div' && element.hasClass( 'ckeditor-html5-video' ); | ||
18 | }, | ||
19 | dialog: 'html5video', | ||
20 | init: function() { | ||
21 | var src = ''; | ||
22 | var autoplay = ''; | ||
23 | var align = this.element.getStyle( 'text-align' ); | ||
24 | |||
25 | var width = ''; | ||
26 | var height = ''; | ||
27 | |||
28 | // If there's a child (the video element) | ||
29 | if ( this.element.getChild( 0 ) ) { | ||
30 | // get it's attributes. | ||
31 | src = this.element.getChild( 0 ).getAttribute( 'src' ); | ||
32 | width = this.element.getChild( 0 ).getAttribute( 'width' ); | ||
33 | height = this.element.getChild( 0 ).getAttribute( 'height' ); | ||
34 | autoplay = this.element.getChild( 0 ).getAttribute( 'autoplay' ); | ||
35 | responsive = this.element.getAttribute( 'data-responsive' ); | ||
36 | } | ||
37 | |||
38 | if ( src ) { | ||
39 | this.setData( 'src', src ); | ||
40 | |||
41 | if ( align ) { | ||
42 | this.setData( 'align', align ); | ||
43 | } else { | ||
44 | this.setData( 'align', 'none' ); | ||
45 | } | ||
46 | |||
47 | if ( width ) { | ||
48 | this.setData( 'width', width ); | ||
49 | } | ||
50 | |||
51 | if ( height ) { | ||
52 | this.setData( 'height', height ); | ||
53 | } | ||
54 | |||
55 | if ( autoplay ) { | ||
56 | this.setData( 'autoplay', 'yes' ); | ||
57 | } | ||
58 | |||
59 | if ( responsive ) { | ||
60 | this.setData( 'responsive', responsive ); | ||
61 | } | ||
62 | } | ||
63 | }, | ||
64 | data: function() { | ||
65 | // If there is an video source | ||
66 | if ( this.data.src ) { | ||
67 | // and there isn't a child (the video element) | ||
68 | if ( !this.element.getChild( 0 ) ) { | ||
69 | // Create a new <video> element. | ||
70 | var videoElement = new CKEDITOR.dom.element( 'video' ); | ||
71 | // Set the controls attribute. | ||
72 | videoElement.setAttribute( 'controls', 'controls' ); | ||
73 | // Append it to the container of the plugin. | ||
74 | this.element.append( videoElement ); | ||
75 | } | ||
76 | this.element.getChild( 0 ).setAttribute( 'src', this.data.src ); | ||
77 | if (this.data.width) this.element.getChild( 0 ).setAttribute( 'width', this.data.width ); | ||
78 | if (this.data.height) this.element.getChild( 0 ).setAttribute( 'height', this.data.height ); | ||
79 | |||
80 | if ( this.data.responsive ) { | ||
81 | this.element.setAttribute("data-responsive", this.data.responsive); | ||
82 | this.element.getChild( 0 ).setStyle( 'max-width', '100%' ); | ||
83 | this.element.getChild( 0 ).setStyle( 'height', 'auto' ); | ||
84 | } else { | ||
85 | this.element.getChild( 0 ).removeStyle( 'max-width' ); | ||
86 | this.element.getChild( 0 ).removeStyle( 'height' ); | ||
87 | } | ||
88 | } | ||
89 | |||
90 | this.element.removeStyle( 'float' ); | ||
91 | this.element.removeStyle( 'margin-left' ); | ||
92 | this.element.removeStyle( 'margin-right' ); | ||
93 | |||
94 | if ( this.data.align === 'none' ) { | ||
95 | this.element.removeStyle( 'text-align' ); | ||
96 | } else { | ||
97 | this.element.setStyle( 'text-align', this.data.align ); | ||
98 | } | ||
99 | |||
100 | if ( this.data.align === 'left' ) { | ||
101 | this.element.setStyle( 'float', this.data.align ); | ||
102 | this.element.setStyle( 'margin-right', '10px' ); | ||
103 | } else if ( this.data.align === 'right' ) { | ||
104 | this.element.setStyle( 'float', this.data.align ); | ||
105 | this.element.setStyle( 'margin-left', '10px' ); | ||
106 | } | ||
107 | |||
108 | if ( this.element.getChild( 0 ) ) { | ||
109 | if ( this.data.autoplay === 'yes' ) { | ||
110 | this.element.getChild( 0 ).setAttribute( 'autoplay', 'autoplay' ); | ||
111 | } else { | ||
112 | this.element.getChild( 0 ).removeAttribute( 'autoplay' ); | ||
113 | } | ||
114 | } | ||
115 | } | ||
116 | } ); | ||
117 | |||
118 | if ( editor.contextMenu ) { | ||
119 | editor.addMenuGroup( 'html5videoGroup' ); | ||
120 | editor.addMenuItem( 'html5videoPropertiesItem', { | ||
121 | label: editor.lang.html5video.videoProperties, | ||
122 | icon: 'html5video', | ||
123 | command: 'html5video', | ||
124 | group: 'html5videoGroup' | ||
125 | }); | ||
126 | |||
127 | editor.contextMenu.addListener( function( element ) { | ||
128 | if ( element && | ||
129 | element.getChild( 0 ) && | ||
130 | element.getChild( 0 ).hasClass && | ||
131 | element.getChild( 0 ).hasClass( 'ckeditor-html5-video' ) ) { | ||
132 | return { html5videoPropertiesItem: CKEDITOR.TRISTATE_OFF }; | ||
133 | } | ||
134 | }); | ||
135 | } | ||
136 | |||
137 | CKEDITOR.dialog.add( 'html5video', this.path + 'dialogs/html5video.js' ); | ||
138 | } | ||
139 | } ); | ||