From d1844275460a3e3a32e199326f6b36938a329091 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Isma=C3=ABl=20Bouya?= <ismael.bouya@normalesup.org>
Date: Thu, 26 Jan 2017 15:12:37 +0100
Subject: Change html5 audio player

---
 sources/plugins/html5audio/dialogs/html5audio.js | 117 +++++++++++++++++++++++
 sources/plugins/html5audio/icons/html5audio.png  | Bin 0 -> 560 bytes
 sources/plugins/html5audio/lang/de.js            |  13 +++
 sources/plugins/html5audio/lang/en.js            |  13 +++
 sources/plugins/html5audio/lang/es.js            |  13 +++
 sources/plugins/html5audio/lang/eu.js            |  13 +++
 sources/plugins/html5audio/lang/fr.js            |  13 +++
 sources/plugins/html5audio/lang/ru.js            |  13 +++
 sources/plugins/html5audio/lang/uk.js            |  13 +++
 sources/plugins/html5audio/lang/uz.js            |  13 +++
 sources/plugins/html5audio/plugin.js             | 112 ++++++++++++++++++++++
 11 files changed, 333 insertions(+)
 create mode 100644 sources/plugins/html5audio/dialogs/html5audio.js
 create mode 100644 sources/plugins/html5audio/icons/html5audio.png
 create mode 100644 sources/plugins/html5audio/lang/de.js
 create mode 100644 sources/plugins/html5audio/lang/en.js
 create mode 100644 sources/plugins/html5audio/lang/es.js
 create mode 100644 sources/plugins/html5audio/lang/eu.js
 create mode 100644 sources/plugins/html5audio/lang/fr.js
 create mode 100644 sources/plugins/html5audio/lang/ru.js
 create mode 100644 sources/plugins/html5audio/lang/uk.js
 create mode 100644 sources/plugins/html5audio/lang/uz.js
 create mode 100644 sources/plugins/html5audio/plugin.js

(limited to 'sources/plugins/html5audio')

diff --git a/sources/plugins/html5audio/dialogs/html5audio.js b/sources/plugins/html5audio/dialogs/html5audio.js
new file mode 100644
index 0000000..0ab0d7d
--- /dev/null
+++ b/sources/plugins/html5audio/dialogs/html5audio.js
@@ -0,0 +1,117 @@
+CKEDITOR.dialog.add( 'html5audio', function( editor ) {
+    return {
+        title: editor.lang.html5audio.title,
+        minWidth: 500,
+        minHeight: 100,
+        contents: [ {
+            id: 'info',
+            label: editor.lang.html5audio.infoLabel,
+            elements: [ {
+                type: 'vbox',
+                padding: 0,
+                children: [ {
+                    type: 'hbox',
+                    widths: [ '365px', '110px' ],
+                    align: 'right',
+                    children: [ {
+                        type: 'text',
+                        id: 'url',
+                        label: editor.lang.common.url,
+                        required: true,
+                        validate: CKEDITOR.dialog.validate.notEmpty( editor.lang.html5audio.urlMissing ),
+                        setup: function( widget ) {
+                            this.setValue( widget.data.src );
+                        },
+                        commit: function( widget ) {
+                            widget.setData( 'src', this.getValue() );
+                        }
+                    },
+                    {
+                        type: 'button',
+                        id: 'browse',
+                        // v-align with the 'txtUrl' field.
+                        // TODO: We need something better than a fixed size here.
+                        style: 'display:inline-block;margin-top:14px;',
+                        align: 'center',
+                        label: editor.lang.common.browseServer,
+                        hidden: true,
+                        filebrowser: 'info:url'
+                    } ]
+                } ]
+            },
+            {
+                type: 'hbox',
+                id: 'alignment',
+                children: [ {
+                    type: 'radio',
+                    id: 'align',
+                    label: editor.lang.common.align,
+                    items: [
+                        [editor.lang.common.alignCenter, 'center'],
+                        [editor.lang.common.alignLeft, 'left'],
+                        [editor.lang.common.alignRight, 'right'],
+                        [editor.lang.common.alignNone, 'none']
+                    ],
+                    'default': 'center',
+                    setup: function( widget ) {
+                        if ( widget.data.align ) {
+                            this.setValue( widget.data.align );
+                        }
+                    },
+                    commit: function( widget ) {
+                        widget.setData( 'align', this.getValue() );
+                    }
+                } ]
+            } ]
+        },
+        {
+            id: 'Upload',
+            hidden: true,
+            filebrowser: 'uploadButton',
+            label: editor.lang.html5audio.upload,
+            elements: [ {
+                type: 'file',
+                id: 'upload',
+                label: editor.lang.html5audio.btnUpload,
+                style: 'height:40px',
+                size: 38
+            },
+            {
+                type: 'fileButton',
+                id: 'uploadButton',
+                filebrowser: 'info:url',
+                label: editor.lang.html5audio.btnUpload,
+                'for': [ 'Upload', 'upload' ]
+            } ]
+        },
+        {
+            id: 'advanced',
+            label: editor.lang.html5audio.advanced,
+            elements: [ {
+                type: 'vbox',
+                padding: 0,
+                children: [ {
+                    type: 'hbox',
+                    children: [ {
+                        type: 'radio',
+                        id: 'autoplay',
+                        label: editor.lang.html5audio.autoplay,
+                        items: [
+                            [editor.lang.html5audio.yes, 'yes'],
+                            [editor.lang.html5audio.no, 'no']
+                        ],
+                        'default': 'no',
+                        setup: function( widget ) {
+                            if ( widget.data.autoplay ) {
+                                this.setValue( widget.data.autoplay );
+                            }
+                        },
+                        commit: function( widget ) {
+                            widget.setData( 'autoplay', this.getValue() );
+                        }
+                    } ]
+                } ]
+            } ]
+        } ]
+    };
+} );
diff --git a/sources/plugins/html5audio/icons/html5audio.png b/sources/plugins/html5audio/icons/html5audio.png
new file mode 100644
index 0000000..4367015
Binary files /dev/null and b/sources/plugins/html5audio/icons/html5audio.png differ
diff --git a/sources/plugins/html5audio/lang/de.js b/sources/plugins/html5audio/lang/de.js
new file mode 100644
index 0000000..e084a60
--- /dev/null
+++ b/sources/plugins/html5audio/lang/de.js
@@ -0,0 +1,13 @@
+CKEDITOR.plugins.setLang( 'html5audio', 'de', {
+    button: 'HTML5 Audio einfügen',
+    title: 'HTML5 Audio',
+    infoLabel: 'Audio Infos',
+    urlMissing: 'Sie haben keine URL zur Audio-Datei angegeben.',
+    audioProperties: 'Audio-Einstellungen',
+    upload: 'Hochladen',
+    btnUpload: 'Zum Server senden',
+    advanced: 'Erweitert',
+    autoplay: 'Autoplay?',
+    yes: 'Ja',
+    no: 'Nein'
+} );
diff --git a/sources/plugins/html5audio/lang/en.js b/sources/plugins/html5audio/lang/en.js
new file mode 100644
index 0000000..fffce1e
--- /dev/null
+++ b/sources/plugins/html5audio/lang/en.js
@@ -0,0 +1,13 @@
+CKEDITOR.plugins.setLang( 'html5audio', 'en', {
+    button: 'Insert HTML5 audio',
+    title: 'HTML5 audio',
+    infoLabel: 'Audio info',
+    urlMissing: 'Audio source URL is missing.',
+    audioProperties: 'Audio properties',
+    upload: 'Upload',
+    btnUpload: 'Send it to the server',
+    advanced: 'Advanced',
+    autoplay: 'Autoplay?',
+    yes: 'Yes',
+    no: 'No'
+} );
diff --git a/sources/plugins/html5audio/lang/es.js b/sources/plugins/html5audio/lang/es.js
new file mode 100644
index 0000000..f1aec8e
--- /dev/null
+++ b/sources/plugins/html5audio/lang/es.js
@@ -0,0 +1,13 @@
+CKEDITOR.plugins.setLang( 'html5audio', 'es', {
+    button: 'Insertar audio HTML5',
+    title: 'Audio HTML5',
+    infoLabel: 'Información del audio',
+    urlMissing: 'La URL del audio no puede estar vacia.',
+    audioProperties: 'Propiedades del audio',
+    upload: 'Cargar',
+    btnUpload: 'Enviar al servidor',
+    advanced: 'Avanzado',
+    autoplay: '¿Reproducir automáticamente?',
+    yes: 'Si',
+    no: 'No'
+} );
diff --git a/sources/plugins/html5audio/lang/eu.js b/sources/plugins/html5audio/lang/eu.js
new file mode 100644
index 0000000..9275d88
--- /dev/null
+++ b/sources/plugins/html5audio/lang/eu.js
@@ -0,0 +1,13 @@
+CKEDITOR.plugins.setLang( 'html5audio', 'eu', {
+    button: 'Txertatu HTML5 audioa',
+    title: 'HTML5 audioa',
+    infoLabel: 'Audioaren informazioa',
+    urlMissing: 'Audioaren URLak ezin du hutsik egon.',
+    audioProperties: 'Audioaren propietateak',
+    upload: 'Kargatu',
+    btnUpload: 'Bidali zerbitzarira',
+    advanced: 'Aurreratua',
+    autoplay: 'Automatikoki erreproduzitu?',
+    yes: 'Bai',
+    no: 'Ez'
+} );
diff --git a/sources/plugins/html5audio/lang/fr.js b/sources/plugins/html5audio/lang/fr.js
new file mode 100644
index 0000000..b9fa4af
--- /dev/null
+++ b/sources/plugins/html5audio/lang/fr.js
@@ -0,0 +1,13 @@
+CKEDITOR.plugins.setLang( 'html5audio', 'fr', {
+    button: 'Insérer un lecteur audio HTML5',
+    title: 'HTML5 audio',
+    infoLabel: 'Informations audio',
+    urlMissing: 'URL de la source audio manquante. Veuillez la renseigner.',
+    audioProperties: 'Propriétés Audio',
+    upload: 'Télécharger',
+    btnUpload: 'Envoyer vers le serveur',
+    advanced: 'Avancé',
+    autoplay: 'Jouer automatiquement ?',
+    yes: 'Oui',
+    no: 'Non'
+} );
diff --git a/sources/plugins/html5audio/lang/ru.js b/sources/plugins/html5audio/lang/ru.js
new file mode 100644
index 0000000..94be193
--- /dev/null
+++ b/sources/plugins/html5audio/lang/ru.js
@@ -0,0 +1,13 @@
+CKEDITOR.plugins.setLang( 'html5audio', 'ru', {
+    button: 'Вставить HTML5 аудио',
+    title: 'HTML5 аудио',
+    infoLabel: 'Аудио',
+    urlMissing: 'Не выбран источник аудио',
+    audioProperties: 'Свойства аудио',
+    upload: 'Загрузить',
+    btnUpload: 'Загрузить на сервер',
+    advanced: 'Дополнительно',
+    autoplay: 'Автовоспроизведение',
+    yes: 'Да',
+    no: 'Нет'
+} );
diff --git a/sources/plugins/html5audio/lang/uk.js b/sources/plugins/html5audio/lang/uk.js
new file mode 100644
index 0000000..6e050f1
--- /dev/null
+++ b/sources/plugins/html5audio/lang/uk.js
@@ -0,0 +1,13 @@
+CKEDITOR.plugins.setLang( 'html5audio', 'uk', {
+    button: 'Вставити HTML5 аудіо',
+    title: 'HTML5 аудіо',
+    infoLabel: 'Інформація',
+    urlMissing: 'Не обрано джерела аудіо',
+    audioProperties: 'Властивості аудіо',
+    upload: 'Відвантажити',
+    btnUpload: 'Відвантажити на сервер',
+    advanced: 'Додатково',
+    autoplay: 'Автовідтворення?',
+    yes: 'Так',
+    no: 'Ні'
+} );
diff --git a/sources/plugins/html5audio/lang/uz.js b/sources/plugins/html5audio/lang/uz.js
new file mode 100644
index 0000000..8827b53
--- /dev/null
+++ b/sources/plugins/html5audio/lang/uz.js
@@ -0,0 +1,13 @@
+CKEDITOR.plugins.setLang( 'html5audio', 'uz', {
+    button: 'HTML5 audio qo‘shing',
+    title: 'HTML5 audio',
+    infoLabel: 'Audio ma\'lumot',
+    urlMissing: 'Audio\'ning URL manbasi topilmadi.',
+    audioProperties: 'Audio xususiyatlari',
+    upload: 'Yuklash',
+    btnUpload: 'Serverga jo‘natish',
+    advanced: 'Kengaytrilgan',
+    autoplay: 'Avtoijro?',
+    yes: 'Ha',
+    no: 'Yo‘q'
+} );
diff --git a/sources/plugins/html5audio/plugin.js b/sources/plugins/html5audio/plugin.js
new file mode 100644
index 0000000..86bcfbd
--- /dev/null
+++ b/sources/plugins/html5audio/plugin.js
@@ -0,0 +1,112 @@
+CKEDITOR.plugins.add( 'html5audio', {
+    requires: 'widget',
+    lang: 'de,en,eu,es,fr,ru,uk,uz',
+    icons: 'html5audio',
+    init: function( editor ) {
+        editor.widgets.add( 'html5audio', {
+            button: editor.lang.html5audio.button,
+            template: '<div class="ckeditor-html5-audio"></div>',   // We add the audio element when needed in the data function, to avoid having an undefined src attribute.
+                                                                    // See issue #9 on github: https://github.com/iametza/ckeditor-html5-audio/issues/9
+            editables: {},
+            /*
+             * Allowed content rules (http://docs.ckeditor.com/#!/guide/dev_allowed_content_rules):
+             *  - div-s with text-align,float,margin-left,margin-right inline style rules and required ckeditor-html5-audio class.
+             *  - audio tags with src and controls attributes.
+             */
+            allowedContent: 'div(!ckeditor-html5-audio){text-align,float,margin-left,margin-right}; audio[src,controls,autoplay];',
+            requiredContent: 'div(ckeditor-html5-audio); audio[src,controls];',
+            upcast: function( element ) {
+                return element.name === 'div' && element.hasClass( 'ckeditor-html5-audio' );
+            },
+            dialog: 'html5audio',
+            init: function() {
+                var src = '';
+                var autoplay = '';
+                var align = this.element.getStyle( 'text-align' );
+
+                // If there's a child (the audio element)
+                if ( this.element.getChild( 0 ) ) {
+                    // get it's attributes.
+                    src = this.element.getChild( 0 ).getAttribute( 'src' );
+                    autoplay = this.element.getChild( 0 ).getAttribute( 'autoplay' );
+                }
+
+                if ( src ) {
+                    this.setData( 'src', src );
+
+                    if ( align ) {
+                        this.setData( 'align', align );
+                    } else {
+                        this.setData( 'align', 'none' );
+                    }
+
+                    if ( autoplay ) {
+                        this.setData( 'autoplay', 'yes' );
+                    }
+                }
+            },
+            data: function() {
+                // If there is an audio source
+                if ( this.data.src ) {
+                    // and there isn't a child (the audio element)
+                    if ( !this.element.getChild( 0 ) ) {
+                        // Create a new <audio> element.
+                        var audioElement = new CKEDITOR.dom.element( 'audio' );
+                        // Set the controls attribute.
+                        audioElement.setAttribute( 'controls', 'controls' );
+                        // Append it to the container of the plugin.
+                        this.element.append( audioElement );
+                    }
+                    this.element.getChild( 0 ).setAttribute( 'src', this.data.src );
+                }
+
+                this.element.removeStyle( 'float' );
+                this.element.removeStyle( 'margin-left' );
+                this.element.removeStyle( 'margin-right' );
+
+                if ( this.data.align === 'none' ) {
+                    this.element.removeStyle( 'text-align' );
+                } else {
+                    this.element.setStyle( 'text-align', this.data.align );
+                }
+
+                if ( this.data.align === 'left' ) {
+                    this.element.setStyle( 'float', this.data.align );
+                    this.element.setStyle( 'margin-right', '10px' );
+                } else if ( this.data.align === 'right' ) {
+                    this.element.setStyle( 'float', this.data.align );
+                    this.element.setStyle( 'margin-left', '10px' );
+                }
+
+                if ( this.element.getChild( 0 ) ) {
+                    if ( this.data.autoplay === 'yes' ) {
+                        this.element.getChild( 0 ).setAttribute( 'autoplay', 'autoplay' );
+                    } else {
+                        this.element.getChild( 0 ).removeAttribute( 'autoplay' );
+                    }
+                }
+            }
+        } );
+
+        if ( editor.contextMenu ) {
+            editor.addMenuGroup( 'html5audioGroup' );
+            editor.addMenuItem( 'html5audioPropertiesItem', {
+                label: editor.lang.html5audio.audioProperties,
+                icon: 'html5audio',
+                command: 'html5audio',
+                group: 'html5audioGroup'
+            });
+
+            editor.contextMenu.addListener( function( element ) {
+                if ( element &&
+                     element.getChild( 0 ) &&
+                     element.getChild( 0 ).hasClass &&
+                     element.getChild( 0 ).hasClass( 'ckeditor-html5-audio' ) ) {
+                    return { html5audioPropertiesItem: CKEDITOR.TRISTATE_OFF };
+                }
+            });
+        }
+
+        CKEDITOR.dialog.add( 'html5audio', this.path + 'dialogs/html5audio.js' );
+    }
+} );
-- 
cgit v1.2.3