]> git.immae.eu Git - perso/Immae/Projets/packagist/ludivine-ckeditor-component.git/blobdiff - sources/plugins/html5video/plugin.js
Update to 4.7.3
[perso/Immae/Projets/packagist/ludivine-ckeditor-component.git] / sources / plugins / html5video / plugin.js
index 1bfff7f9b518c6236b3354d3335318b54ad4b463..bf512852da7d389a8516a1de920e3c91b8236527 100644 (file)
@@ -9,9 +9,9 @@
             /*\r
              * Allowed content rules (http://docs.ckeditor.com/#!/guide/dev_allowed_content_rules):\r
              *  - div-s with text-align,float,margin-left,margin-right inline style rules and required ckeditor-html5-video class.\r
-             *  - video tags with src and controls attributes.\r
+             *  - video tags with src, controls, width and height attributes.\r
              */\r
-            allowedContent: 'div(!ckeditor-html5-video){text-align,float,margin-left,margin-right}; video[src,controls,autoplay];',\r
+            allowedContent: 'div[data-responsive](!ckeditor-html5-video){text-align,float,margin-left,margin-right}; video[src,controls,autoplay,width, height]{max-width,height};',\r
             requiredContent: 'div(ckeditor-html5-video); video[src,controls];',\r
             upcast: function( element ) {\r
                 return element.name === 'div' && element.hasClass( 'ckeditor-html5-video' );\r
@@ -32,6 +32,7 @@
                     width = this.element.getChild( 0 ).getAttribute( 'width' );\r
                     height = this.element.getChild( 0 ).getAttribute( 'height' );\r
                     autoplay = this.element.getChild( 0 ).getAttribute( 'autoplay' );\r
+                                                                               responsive = this.element.getAttribute( 'data-responsive' );\r
                 }\r
 \r
                 if ( src ) {\r
 \r
                     if ( width ) {\r
                         this.setData( 'width', width );\r
-                    } else {\r
-                        this.setData( 'width', '400' );\r
                     }\r
 \r
                     if ( height ) {\r
                         this.setData( 'height', height );\r
-                    } else {\r
-                        this.setData( 'height', '300' );\r
                     }\r
 \r
                     if ( autoplay ) {\r
                         this.setData( 'autoplay', 'yes' );\r
                     }\r
+\r
+                    if ( responsive ) {\r
+                        this.setData( 'responsive', responsive );\r
+                    }\r
                 }\r
             },\r
             data: function() {\r
                         // Append it to the container of the plugin.\r
                         this.element.append( videoElement );\r
                     }\r
-                    this.element.getChild( 0 ).setAttribute( 'src', this.data.src )\r
-                        .setAttribute( 'width', this.data.width )\r
-                        .setAttribute( 'height', this.data.height );\r
+                    this.element.getChild( 0 ).setAttribute( 'src', this.data.src );\r
+                    if (this.data.width) this.element.getChild( 0 ).setAttribute( 'width', this.data.width );\r
+                    if (this.data.height) this.element.getChild( 0 ).setAttribute( 'height', this.data.height );\r
+\r
+                    if ( this.data.responsive ) {\r
+                            this.element.setAttribute("data-responsive", this.data.responsive);\r
+                            this.element.getChild( 0 ).setStyle( 'max-width', '100%' );\r
+                            this.element.getChild( 0 ).setStyle( 'height', 'auto' );\r
+                    } else {\r
+                            this.element.getChild( 0 ).removeStyle( 'max-width' );\r
+                            this.element.getChild( 0 ).removeStyle( 'height' );\r
+                    }\r
                 }\r
 \r
                 this.element.removeStyle( 'float' );\r