]> git.immae.eu Git - perso/Immae/Projets/packagist/ludivine-ckeditor-component.git/blame - sources/plugins/html5audio/plugin.js
Update to 4.7.3
[perso/Immae/Projets/packagist/ludivine-ckeditor-component.git] / sources / plugins / html5audio / plugin.js
CommitLineData
d1844275
IB
1CKEDITOR.plugins.add( 'html5audio', {\r
2 requires: 'widget',\r
1794320d 3 lang: 'de,el,en,eu,es,fr,ru,uk,uz,zh-cn',\r
d1844275
IB
4 icons: 'html5audio',\r
5 init: function( editor ) {\r
6 editor.widgets.add( 'html5audio', {\r
7 button: editor.lang.html5audio.button,\r
8 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.\r
9 // See issue #9 on github: https://github.com/iametza/ckeditor-html5-audio/issues/9\r
10 editables: {},\r
11 /*\r
12 * Allowed content rules (http://docs.ckeditor.com/#!/guide/dev_allowed_content_rules):\r
13 * - div-s with text-align,float,margin-left,margin-right inline style rules and required ckeditor-html5-audio class.\r
14 * - audio tags with src and controls attributes.\r
15 */\r
1794320d 16 allowedContent: 'div(!ckeditor-html5-audio){text-align,float,margin-left,margin-right}; audio[src,controls,controlslist,autoplay];',\r
d1844275
IB
17 requiredContent: 'div(ckeditor-html5-audio); audio[src,controls];',\r
18 upcast: function( element ) {\r
19 return element.name === 'div' && element.hasClass( 'ckeditor-html5-audio' );\r
20 },\r
21 dialog: 'html5audio',\r
22 init: function() {\r
23 var src = '';\r
24 var autoplay = '';\r
25 var align = this.element.getStyle( 'text-align' );\r
26\r
27 // If there's a child (the audio element)\r
28 if ( this.element.getChild( 0 ) ) {\r
29 // get it's attributes.\r
30 src = this.element.getChild( 0 ).getAttribute( 'src' );\r
31 autoplay = this.element.getChild( 0 ).getAttribute( 'autoplay' );\r
1794320d 32 allowdownload = !this.element.getChild( 0 ).getAttribute( 'controlslist' );\r
d1844275
IB
33 }\r
34\r
35 if ( src ) {\r
36 this.setData( 'src', src );\r
37\r
38 if ( align ) {\r
39 this.setData( 'align', align );\r
40 } else {\r
41 this.setData( 'align', 'none' );\r
42 }\r
43\r
44 if ( autoplay ) {\r
45 this.setData( 'autoplay', 'yes' );\r
46 }\r
1794320d
IB
47\r
48 if ( allowdownload ) {\r
49 this.setData( 'allowdownload', 'yes' );\r
50 }\r
d1844275
IB
51 }\r
52 },\r
53 data: function() {\r
54 // If there is an audio source\r
55 if ( this.data.src ) {\r
56 // and there isn't a child (the audio element)\r
57 if ( !this.element.getChild( 0 ) ) {\r
58 // Create a new <audio> element.\r
59 var audioElement = new CKEDITOR.dom.element( 'audio' );\r
60 // Set the controls attribute.\r
61 audioElement.setAttribute( 'controls', 'controls' );\r
62 // Append it to the container of the plugin.\r
63 this.element.append( audioElement );\r
64 }\r
65 this.element.getChild( 0 ).setAttribute( 'src', this.data.src );\r
66 }\r
67\r
68 this.element.removeStyle( 'float' );\r
69 this.element.removeStyle( 'margin-left' );\r
70 this.element.removeStyle( 'margin-right' );\r
71\r
72 if ( this.data.align === 'none' ) {\r
73 this.element.removeStyle( 'text-align' );\r
74 } else {\r
75 this.element.setStyle( 'text-align', this.data.align );\r
76 }\r
77\r
78 if ( this.data.align === 'left' ) {\r
79 this.element.setStyle( 'float', this.data.align );\r
80 this.element.setStyle( 'margin-right', '10px' );\r
81 } else if ( this.data.align === 'right' ) {\r
82 this.element.setStyle( 'float', this.data.align );\r
83 this.element.setStyle( 'margin-left', '10px' );\r
84 }\r
85\r
86 if ( this.element.getChild( 0 ) ) {\r
87 if ( this.data.autoplay === 'yes' ) {\r
88 this.element.getChild( 0 ).setAttribute( 'autoplay', 'autoplay' );\r
89 } else {\r
90 this.element.getChild( 0 ).removeAttribute( 'autoplay' );\r
91 }\r
1794320d
IB
92 if ( this.data.allowdownload === 'yes' ) {\r
93 this.element.getChild( 0 ).removeAttribute( 'controlslist' );\r
94 } else {\r
95 this.element.getChild( 0 ).setAttribute( 'controlslist', 'nodownload' );\r
96 }\r
d1844275
IB
97 }\r
98 }\r
99 } );\r
100\r
101 if ( editor.contextMenu ) {\r
102 editor.addMenuGroup( 'html5audioGroup' );\r
103 editor.addMenuItem( 'html5audioPropertiesItem', {\r
104 label: editor.lang.html5audio.audioProperties,\r
105 icon: 'html5audio',\r
106 command: 'html5audio',\r
107 group: 'html5audioGroup'\r
108 });\r
109\r
110 editor.contextMenu.addListener( function( element ) {\r
111 if ( element &&\r
112 element.getChild( 0 ) &&\r
113 element.getChild( 0 ).hasClass &&\r
114 element.getChild( 0 ).hasClass( 'ckeditor-html5-audio' ) ) {\r
115 return { html5audioPropertiesItem: CKEDITOR.TRISTATE_OFF };\r
116 }\r
117 });\r
118 }\r
119\r
120 CKEDITOR.dialog.add( 'html5audio', this.path + 'dialogs/html5audio.js' );\r
121 }\r
122} );\r