JAVASCRIPT   51

media js

Guest on 7th July 2022 01:57:19 AM

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

Raw Paste


Login or Register to edit or fork this paste. It's free.