Fix Audio plugin for CKEditor - refs BT#12748 (#1953)

* Remove field to set height to audio in CKEditor plugin - refs BT#12748

* Fix option to set autoplay to audio in CKEditor plugin - refs BT#12748

* Fix fake-image for audio in CKEditor plugin - refs BT#12748

main/inc/lib/javascript/ckeditor/plugins/audio/dialogs/audio.js

@@ -9,35 +9,21 @@ CKEDITOR.dialog.add('audio', function(editor)
             value = generateId();
         }
 
-        if (this.id !== 'autoplay') {
-            audioNode.setAttribute(this.id, value);
-            
-            switch (this.id) {
-                case 'width':
-                    audioNode.setAttribute('style', 'width:' + value + 'px;');
-                    break;
-                case 'height':
-                    var styleAttr = audioNode.getAttribute('style');
-
-                    audioNode.setAttribute('style', styleAttr + 'height:' + value + 'px;');
-                    break;
-            }
-        } else {
-            if (value === true) {
-                audioNode.setAttribute(this.id, '');
-            }
-        }
-
-        if (!value) {
-            return;
-        }
-
         switch (this.id) {
             case 'width':
+                audioNode.setAttribute('style', 'width:' + value + 'px;');
                 extraStyles.width = value + 'px';
+                //no break
+            case 'id':
+                audioNode.setAttribute(this.id, value);
                 break;
-            case 'height':
-                extraStyles.height = value + 'px';
+            case 'autoplay':
+                if (value === true) {
+                    audioNode.setAttribute('autoplay', 'autoplay');
+                    break;
+                }
+
+                audioNode.removeAttribute('autoplay');
                 break;
         }
     }
@@ -53,11 +39,21 @@ CKEDITOR.dialog.add('audio', function(editor)
 
     function loadValue(audioNode) {
         if (audioNode) {
-            this.setValue(audioNode.getAttribute(this.id));
-        } else {
-            if (this.id == 'id') {
-                this.setValue(generateId());
+            var value = audioNode.getAttribute(this.id);
+
+            if (this.id != 'autoplay') {
+                this.setValue(value);
+
+                return;
             }
+
+            this.setValue(value === 'autoplay');
+
+            return;
+        }
+
+        if (this.id == 'id') {
+            this.setValue(generateId());
         }
     }
 
@@ -165,7 +161,7 @@ CKEDITOR.dialog.add('audio', function(editor)
                 elements: [
                     {
                         type: 'hbox',
-                        widths: ['33%', '33%', '33%'],
+                        widths: ['20%', '80%'],
                         children: [
                             {
                                 type: 'text',
@@ -176,15 +172,6 @@ CKEDITOR.dialog.add('audio', function(editor)
                                 commit: commitValue,
                                 setup: loadValue
                             },
-                            {
-                                type: 'text',
-                                id: 'height',
-                                label: editor.lang.common.height,
-                                'default': 300,
-                                validate: CKEDITOR.dialog.validate.notEmpty(lang.heightRequired),
-                                commit: commitValue,
-                                setup: loadValue
-                            },
                             {
                                 type: 'text',
                                 id: 'id',
@@ -276,7 +263,8 @@ CKEDITOR.dialog.add('audio', function(editor)
                                 type: 'checkbox',
                                 label: lang.autoPlay,
                                 'default': false,
-                                commit: commitValue
+                                commit: commitValue,
+                                setup: loadValue
                             }
                         ]
                     }

main/inc/lib/javascript/ckeditor/plugins/audio/plugin.js

@@ -33,7 +33,7 @@
                     'background-color:gray;' +
                     'border: 1px solid #a9a9a9;' +
                     'width: 80px;' +
-                    'height: 80px;' +
+                    'height: 40px;' +
                     '}';
         },
         onLoad: function() {
@@ -118,18 +118,13 @@
                                 }
                             }
 
-                            var fakeElement = editor.createFakeParserElement(realElement, 'cke_video', 'audio', false),
+                            var fakeElement = editor.createFakeParserElement(realElement, 'cke_audio', 'audio', false),
                                     fakeStyle = fakeElement.attributes.style || '';
 
-                            var width = realElement.attributes.width,
-                                    height = realElement.attributes.height;
+                            var width = realElement.attributes.width;
 
                             if (typeof width != 'undefined') {
-                                fakeStyle = fakeElement.attributes.style = fakeStyle + 'width:' + CKEDITOR.tools.cssLength(width) + ';';
-                            }
-
-                            if (typeof height != 'undefined') {
-                                fakeStyle = fakeElement.attributes.style = fakeStyle + 'height:' + CKEDITOR.tools.cssLength(height) + ';';
+                                fakeElement.attributes.style = fakeStyle + 'width:' + CKEDITOR.tools.cssLength(width) + ';';
                             }
 
                             return fakeElement;