wp-includes/js/tinymce/plugins/media/js/media.js

   1 (function() {
   2         var url;
   3
   4         if (url = tinyMCEPopup.getParam("media_external_list_url"))
   5                 document.write('<script language="javascript" type="text/javascript" src="' + tinyMCEPopup.editor.documentBaseURI.toAbsolute(url) + '"></script>');
   6
   7         function get(id) {
   8                 return document.getElementById(id);
   9         }
  10
  11         function getVal(id) {
  12                 var elm = get(id);
  13
  14                 if (elm.nodeName == "SELECT")
  15                         return elm.options[elm.selectedIndex].value;
  16
  17                 if (elm.type == "checkbox")
  18                         return elm.checked;
  19
  20                 return elm.value;
  21         }
  22
  23         function setVal(id, value, name) {
  24                 if (typeof(value) != 'undefined') {
  25                         var elm = get(id);
  26
  27                         if (elm.nodeName == "SELECT")
  28                                 selectByValue(document.forms[0], id, value);
  29                         else if (elm.type == "checkbox") {
  30                                 if (typeof(value) == 'string') {
  31                                         value = value.toLowerCase();
  32                                         value = (!name && value === 'true') || (name && value === name.toLowerCase());
  33                                 }
  34                                 elm.checked = !!value;
  35                         } else
  36                                 elm.value = value;
  37                 }
  38         }
  39
  40         window.Media = {
  41                 init : function() {
  42                         var html, editor;
  43
  44                         this.editor = editor = tinyMCEPopup.editor;
  45
  46                         // Setup file browsers and color pickers
  47                         get('filebrowsercontainer').innerHTML = getBrowserHTML('filebrowser','src','media','media');
  48                         get('qtsrcfilebrowsercontainer').innerHTML = getBrowserHTML('qtsrcfilebrowser','quicktime_qtsrc','media','media');
  49                         get('bgcolor_pickcontainer').innerHTML = getColorPickerHTML('bgcolor_pick','bgcolor');
  50                         get('video_altsource1_filebrowser').innerHTML = getBrowserHTML('video_filebrowser_altsource1','video_altsource1','media','media');
  51                         get('video_altsource2_filebrowser').innerHTML = getBrowserHTML('video_filebrowser_altsource2','video_altsource2','media','media');
  52                         get('audio_altsource1_filebrowser').innerHTML = getBrowserHTML('audio_filebrowser_altsource1','audio_altsource1','media','media');
  53                         get('audio_altsource2_filebrowser').innerHTML = getBrowserHTML('audio_filebrowser_altsource2','audio_altsource2','media','media');
  54                         get('video_poster_filebrowser').innerHTML = getBrowserHTML('filebrowser_poster','video_poster','media','image');
  55
  56                         html = this.getMediaListHTML('medialist', 'src', 'media', 'media');
  57                         if (html == "")
  58                                 get("linklistrow").style.display = 'none';
  59                         else
  60                                 get("linklistcontainer").innerHTML = html;
  61
  62                         if (isVisible('filebrowser'))
  63                                 get('src').style.width = '230px';
  64
  65                         if (isVisible('video_filebrowser_altsource1'))
  66                                 get('video_altsource1').style.width = '220px';
  67
  68                         if (isVisible('video_filebrowser_altsource2'))
  69                                 get('video_altsource2').style.width = '220px';
  70
  71                         if (isVisible('audio_filebrowser_altsource1'))
  72                                 get('audio_altsource1').style.width = '220px';
  73
  74                         if (isVisible('audio_filebrowser_altsource2'))
  75                                 get('audio_altsource2').style.width = '220px';
  76
  77                         if (isVisible('filebrowser_poster'))
  78                                 get('video_poster').style.width = '220px';
  79
  80                         this.data = tinyMCEPopup.getWindowArg('data');
  81                         this.dataToForm();
  82                         this.preview();
  83                 },
  84
  85                 insert : function() {
  86                         var editor = tinyMCEPopup.editor;
  87
  88                         this.formToData();
  89                         editor.execCommand('mceRepaint');
  90                         tinyMCEPopup.restoreSelection();
  91                         editor.selection.setNode(editor.plugins.media.dataToImg(this.data));
  92                         tinyMCEPopup.close();
  93                 },
  94
  95                 preview : function() {
  96                         get('prev').innerHTML = this.editor.plugins.media.dataToHtml(this.data, true);
  97                 },
  98
  99                 moveStates : function(to_form, field) {
 100                         var data = this.data, editor = this.editor, data = this.data,
 101                                 mediaPlugin = editor.plugins.media, ext, src, typeInfo, defaultStates, src;
 102
 103                         defaultStates = {
 104                                 // QuickTime
 105                                 quicktime_autoplay : true,
 106                                 quicktime_controller : true,
 107
 108                                 // Flash
 109                                 flash_play : true,
 110                                 flash_loop : true,
 111                                 flash_menu : true,
 112
 113                                 // WindowsMedia
 114                                 windowsmedia_autostart : true,
 115                                 windowsmedia_enablecontextmenu : true,
 116                                 windowsmedia_invokeurls : true,
 117
 118                                 // RealMedia
 119                                 realmedia_autogotourl : true,
 120                                 realmedia_imagestatus : true
 121                         };
 122
 123                         function parseQueryParams(str) {
 124                                 var out = {};
 125
 126                                 if (str) {
 127                                         tinymce.each(str.split('&'), function(item) {
 128                                                 var parts = item.split('=');
 129
 130                                                 out[unescape(parts[0])] = unescape(parts[1]);
 131                                         });
 132                                 }
 133
 134                                 return out;
 135                         };
 136
 137                         function setOptions(type, names) {
 138                                 var i, name, formItemName, value, list;
 139
 140                                 if (type == data.type || type == 'global') {
 141                                         names = tinymce.explode(names);
 142                                         for (i = 0; i < names.length; i++) {
 143                                                 name = names[i];
 144                                                 formItemName = type == 'global' ? name : type + '_' + name;
 145
 146                                                 if (type == 'global')
 147                                                         list = data;
 148                                                 else if (type == 'video' || type == 'audio') {
 149                                                         list = data.video.attrs;
 150
 151                                                         if (!list && !to_form)
 152                                                                 data.video.attrs = list = {};
 153                                                 } else
 154                                                         list = data.params;
 155
 156                                                 if (list) {
 157                                                         if (to_form) {
 158                                                                 setVal(formItemName, list[name], type == 'video' || type == 'audio' ? name : '');
 159                                                         } else {
 160                                                                 delete list[name];
 161
 162                                                                 value = getVal(formItemName);
 163                                                                 if ((type == 'video' || type == 'audio') && value === true)
 164                                                                         value = name;
 165
 166                                                                 if (defaultStates[formItemName]) {
 167                                                                         if (value !== defaultStates[formItemName]) {
 168                                                                                 value = "" + value;
 169                                                                                 list[name] = value;
 170                                                                         }
 171                                                                 } else if (value) {
 172                                                                         value = "" + value;
 173                                                                         list[name] = value;
 174                                                                 }
 175                                                         }
 176                                                 }
 177                                         }
 178                                 }
 179                         }
 180
 181                         if (!to_form) {
 182                                 data.type = get('media_type').options[get('media_type').selectedIndex].value;
 183                                 data.width = getVal('width');
 184                                 data.height = getVal('height');
 185
 186                                 // Switch type based on extension
 187                                 src = getVal('src');
 188                                 if (field == 'src') {
 189                                         ext = src.replace(/^.*\.([^.]+)$/, '$1');
 190                                         if (typeInfo = mediaPlugin.getType(ext))
 191                                                 data.type = typeInfo.name.toLowerCase();
 192
 193                                         setVal('media_type', data.type);
 194                                 }
 195
 196                                 if (data.type == "video" || data.type == "audio") {
 197                                         if (!data.video.sources)
 198                                                 data.video.sources = [];
 199
 200                                         data.video.sources[0] = {src: getVal('src')};
 201                                 }
 202                         }
 203
 204                         // Hide all fieldsets and show the one active
 205                         get('video_options').style.display = 'none';
 206                         get('audio_options').style.display = 'none';
 207                         get('flash_options').style.display = 'none';
 208                         get('quicktime_options').style.display = 'none';
 209                         get('shockwave_options').style.display = 'none';
 210                         get('windowsmedia_options').style.display = 'none';
 211                         get('realmedia_options').style.display = 'none';
 212
 213                         if (get(data.type + '_options'))
 214                                 get(data.type + '_options').style.display = 'block';
 215
 216                         setVal('media_type', data.type);
 217
 218                         setOptions('flash', 'play,loop,menu,swliveconnect,quality,scale,salign,wmode,base,flashvars');
 219                         setOptions('quicktime', 'loop,autoplay,cache,controller,correction,enablejavascript,kioskmode,autohref,playeveryframe,targetcache,scale,starttime,endtime,target,qtsrcchokespeed,volume,qtsrc');
 220                         setOptions('shockwave', 'sound,progress,autostart,swliveconnect,swvolume,swstretchstyle,swstretchhalign,swstretchvalign');
 221                         setOptions('windowsmedia', 'autostart,enabled,enablecontextmenu,fullscreen,invokeurls,mute,stretchtofit,windowlessvideo,balance,baseurl,captioningid,currentmarker,currentposition,defaultframe,playcount,rate,uimode,volume');
 222                         setOptions('realmedia', 'autostart,loop,autogotourl,center,imagestatus,maintainaspect,nojava,prefetch,shuffle,console,controls,numloop,scriptcallbacks');
 223                         setOptions('video', 'poster,autoplay,loop,muted,preload,controls');
 224                         setOptions('audio', 'autoplay,loop,preload,controls');
 225                         setOptions('global', 'id,name,vspace,hspace,bgcolor,align,width,height');
 226
 227                         if (to_form) {
 228                                 if (data.type == 'video') {
 229                                         if (data.video.sources[0])
 230                                                 setVal('src', data.video.sources[0].src);
 231
 232                                         src = data.video.sources[1];
 233                                         if (src)
 234                                                 setVal('video_altsource1', src.src);
 235
 236                                         src = data.video.sources[2];
 237                                         if (src)
 238                                                 setVal('video_altsource2', src.src);
 239                 } else if (data.type == 'audio') {
 240                     if (data.video.sources[0])
 241                         setVal('src', data.video.sources[0].src);
 242
 243                     src = data.video.sources[1];
 244                     if (src)
 245                         setVal('audio_altsource1', src.src);
 246
 247                     src = data.video.sources[2];
 248                     if (src)
 249                         setVal('audio_altsource2', src.src);
 250                                 } else {
 251                                         // Check flash vars
 252                                         if (data.type == 'flash') {
 253                                                 tinymce.each(editor.getParam('flash_video_player_flashvars', {url : '$url', poster : '$poster'}), function(value, name) {
 254                                                         if (value == '$url')
 255                                                                 data.params.src = parseQueryParams(data.params.flashvars)[name] || data.params.src;
 256                                                 });
 257                                         }
 258
 259                                         setVal('src', data.params.src);
 260                                 }
 261                         } else {
 262                                 src = getVal("src");
 263
 264                                 // YouTube
 265                                 if (src.match(/youtube.com(.+)v=([^&]+)/)) {
 266                                         data.width = 425;
 267                                         data.height = 350;
 268                                         data.params.frameborder = '0';
 269                                         data.type = 'iframe';
 270                                         src = 'http://www.youtube.com/embed/' + src.match(/v=([^&]+)/)[1];
 271                                         setVal('src', src);
 272                                         setVal('media_type', data.type);
 273                                 }
 274
 275                                 // Google video
 276                                 if (src.match(/video.google.com(.+)docid=([^&]+)/)) {
 277                                         data.width = 425;
 278                                         data.height = 326;
 279                                         data.type = 'flash';
 280                                         src = 'http://video.google.com/googleplayer.swf?docId=' + src.match(/docid=([^&]+)/)[1] + '&hl=en';
 281                                         setVal('src', src);
 282                                         setVal('media_type', data.type);
 283                                 }
 284
 285                                 if (data.type == 'video') {
 286                                         if (!data.video.sources)
 287                                                 data.video.sources = [];
 288
 289                                         data.video.sources[0] = {src : src};
 290
 291                                         src = getVal("video_altsource1");
 292                                         if (src)
 293                                                 data.video.sources[1] = {src : src};
 294
 295                                         src = getVal("video_altsource2");
 296                                         if (src)
 297                                                 data.video.sources[2] = {src : src};
 298                 } else if (data.type == 'audio') {
 299                     if (!data.video.sources)
 300                         data.video.sources = [];
 301
 302                     data.video.sources[0] = {src : src};
 303
 304                     src = getVal("audio_altsource1");
 305                     if (src)
 306                         data.video.sources[1] = {src : src};
 307
 308                     src = getVal("audio_altsource2");
 309                     if (src)
 310                         data.video.sources[2] = {src : src};
 311                                 } else
 312                                         data.params.src = src;
 313
 314                                 // Set default size
 315                 setVal('width', data.width || (data.type == 'audio' ? 300 : 320));
 316                 setVal('height', data.height || (data.type == 'audio' ? 32 : 240));
 317                         }
 318                 },
 319
 320                 dataToForm : function() {
 321                         this.moveStates(true);
 322                 },
 323
 324                 formToData : function(field) {
 325                         if (field == "width" || field == "height")
 326                                 this.changeSize(field);
 327
 328                         if (field == 'source') {
 329                                 this.moveStates(false, field);
 330                                 setVal('source', this.editor.plugins.media.dataToHtml(this.data));
 331                                 this.panel = 'source';
 332                         } else {
 333                                 if (this.panel == 'source') {
 334                                         this.data = this.editor.plugins.media.htmlToData(getVal('source'));
 335                                         this.dataToForm();
 336                                         this.panel = '';
 337                                 }
 338
 339                                 this.moveStates(false, field);
 340                                 this.preview();
 341                         }
 342                 },
 343
 344                 beforeResize : function() {
 345             this.width = parseInt(getVal('width') || (this.data.type == 'audio' ? "300" : "320"), 10);
 346             this.height = parseInt(getVal('height') || (this.data.type == 'audio' ? "32" : "240"), 10);
 347                 },
 348
 349                 changeSize : function(type) {
 350                         var width, height, scale, size;
 351
 352                         if (get('constrain').checked) {
 353                 width = parseInt(getVal('width') || (this.data.type == 'audio' ? "300" : "320"), 10);
 354                 height = parseInt(getVal('height') || (this.data.type == 'audio' ? "32" : "240"), 10);
 355
 356                                 if (type == 'width') {
 357                                         this.height = Math.round((width / this.width) * height);
 358                                         setVal('height', this.height);
 359                                 } else {
 360                                         this.width = Math.round((height / this.height) * width);
 361                                         setVal('width', this.width);
 362                                 }
 363                         }
 364                 },
 365
 366                 getMediaListHTML : function() {
 367                         if (typeof(tinyMCEMediaList) != "undefined" && tinyMCEMediaList.length > 0) {
 368                                 var html = "";
 369
 370                                 html += '<select id="linklist" name="linklist" style="width: 250px" onchange="this.form.src.value=this.options[this.selectedIndex].value;Media.formToData(\'src\');">';
 371                                 html += '<option value="">---</option>';
 372
 373                                 for (var i=0; i<tinyMCEMediaList.length; i++)
 374                                         html += '<option value="' + tinyMCEMediaList[i][1] + '">' + tinyMCEMediaList[i][0] + '</option>';
 375
 376                                 html += '</select>';
 377
 378                                 return html;
 379                         }
 380
 381                         return "";
 382                 }
 383         };
 384
 385         tinyMCEPopup.requireLangPack();
 386         tinyMCEPopup.onInit.add(function() {
 387                 Media.init();
 388         });
 389 })();