diff options
Diffstat (limited to 'sources/plugins/html5video/plugin.js')
-rw-r--r-- | sources/plugins/html5video/plugin.js | 28 |
1 files changed, 19 insertions, 9 deletions
diff --git a/sources/plugins/html5video/plugin.js b/sources/plugins/html5video/plugin.js index 1bfff7f..bf51285 100644 --- a/sources/plugins/html5video/plugin.js +++ b/sources/plugins/html5video/plugin.js | |||
@@ -9,9 +9,9 @@ | |||
9 | /* | 9 | /* |
10 | * Allowed content rules (http://docs.ckeditor.com/#!/guide/dev_allowed_content_rules): | 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. | 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 and controls attributes. | 12 | * - video tags with src, controls, width and height attributes. |
13 | */ | 13 | */ |
14 | allowedContent: 'div(!ckeditor-html5-video){text-align,float,margin-left,margin-right}; video[src,controls,autoplay];', | 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];', | 15 | requiredContent: 'div(ckeditor-html5-video); video[src,controls];', |
16 | upcast: function( element ) { | 16 | upcast: function( element ) { |
17 | return element.name === 'div' && element.hasClass( 'ckeditor-html5-video' ); | 17 | return element.name === 'div' && element.hasClass( 'ckeditor-html5-video' ); |
@@ -32,6 +32,7 @@ | |||
32 | width = this.element.getChild( 0 ).getAttribute( 'width' ); | 32 | width = this.element.getChild( 0 ).getAttribute( 'width' ); |
33 | height = this.element.getChild( 0 ).getAttribute( 'height' ); | 33 | height = this.element.getChild( 0 ).getAttribute( 'height' ); |
34 | autoplay = this.element.getChild( 0 ).getAttribute( 'autoplay' ); | 34 | autoplay = this.element.getChild( 0 ).getAttribute( 'autoplay' ); |
35 | responsive = this.element.getAttribute( 'data-responsive' ); | ||
35 | } | 36 | } |
36 | 37 | ||
37 | if ( src ) { | 38 | if ( src ) { |
@@ -45,19 +46,19 @@ | |||
45 | 46 | ||
46 | if ( width ) { | 47 | if ( width ) { |
47 | this.setData( 'width', width ); | 48 | this.setData( 'width', width ); |
48 | } else { | ||
49 | this.setData( 'width', '400' ); | ||
50 | } | 49 | } |
51 | 50 | ||
52 | if ( height ) { | 51 | if ( height ) { |
53 | this.setData( 'height', height ); | 52 | this.setData( 'height', height ); |
54 | } else { | ||
55 | this.setData( 'height', '300' ); | ||
56 | } | 53 | } |
57 | 54 | ||
58 | if ( autoplay ) { | 55 | if ( autoplay ) { |
59 | this.setData( 'autoplay', 'yes' ); | 56 | this.setData( 'autoplay', 'yes' ); |
60 | } | 57 | } |
58 | |||
59 | if ( responsive ) { | ||
60 | this.setData( 'responsive', responsive ); | ||
61 | } | ||
61 | } | 62 | } |
62 | }, | 63 | }, |
63 | data: function() { | 64 | data: function() { |
@@ -72,9 +73,18 @@ | |||
72 | // Append it to the container of the plugin. | 73 | // Append it to the container of the plugin. |
73 | this.element.append( videoElement ); | 74 | this.element.append( videoElement ); |
74 | } | 75 | } |
75 | this.element.getChild( 0 ).setAttribute( 'src', this.data.src ) | 76 | this.element.getChild( 0 ).setAttribute( 'src', this.data.src ); |
76 | .setAttribute( 'width', this.data.width ) | 77 | if (this.data.width) this.element.getChild( 0 ).setAttribute( 'width', this.data.width ); |
77 | .setAttribute( 'height', this.data.height ); | 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 | } | ||
78 | } | 88 | } |
79 | 89 | ||
80 | this.element.removeStyle( 'float' ); | 90 | this.element.removeStyle( 'float' ); |