You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
372 lines
13 KiB
372 lines
13 KiB
/**
|
|
* Created by JetBrains PhpStorm.
|
|
* User: taoqili
|
|
* Date: 12-2-20
|
|
* Time: 上午11:19
|
|
* To change this template use File | Settings | File Templates.
|
|
*/
|
|
var video = {};
|
|
|
|
(function(){
|
|
video.init = function(){
|
|
// switchTab("videoTab");
|
|
createAlignButton( ["videoFloat"] );
|
|
addUrlChangeListener($G("videoUrl"));
|
|
addOkListener();
|
|
|
|
|
|
//编辑视频时初始化相关信息
|
|
(function(){
|
|
var img = editor.selection.getRange().getClosedNode(),url;
|
|
if(img && img.className == "edui-faked-video"){
|
|
$G("videoUrl").value = url = img.getAttribute("_url");
|
|
$G("videoWidth").value = img.width;
|
|
$G("videoHeight").value = img.height;
|
|
var align = domUtils.getComputedStyle(img,"float"),
|
|
parentAlign = domUtils.getComputedStyle(img.parentNode,"text-align");
|
|
updateAlignButton(parentAlign==="center"?"center":align);
|
|
}
|
|
createPreviewVideo(url);
|
|
})();
|
|
};
|
|
/**
|
|
* 监听确认和取消两个按钮事件，用户执行插入或者清空正在播放的视频实例操作
|
|
*/
|
|
function addOkListener(){
|
|
dialog.onok = function(){
|
|
$G("preview").innerHTML = "";
|
|
var currentTab = findFocus("tabHeads","tabSrc");
|
|
switch(currentTab){
|
|
case "video":
|
|
return insertSingle();
|
|
break;
|
|
// case "videoSearch":
|
|
// return insertSearch("searchList");
|
|
// break;
|
|
}
|
|
};
|
|
dialog.oncancel = function(){
|
|
$G("preview").innerHTML = "";
|
|
};
|
|
}
|
|
|
|
function selectTxt(node){
|
|
if(node.select){
|
|
node.select();
|
|
}else{
|
|
var r = node.createTextRange && node.createTextRange();
|
|
r.select();
|
|
}
|
|
}
|
|
|
|
/**
|
|
* 依据传入的align值更新按钮信息
|
|
* @param align
|
|
*/
|
|
function updateAlignButton( align ) {
|
|
var aligns = $G( "videoFloat" ).children;
|
|
for ( var i = 0, ci; ci = aligns[i++]; ) {
|
|
if ( ci.getAttribute( "name" ) == align ) {
|
|
if ( ci.className !="focus" ) {
|
|
ci.className = "focus";
|
|
}
|
|
} else {
|
|
if ( ci.className =="focus" ) {
|
|
ci.className = "";
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
/**
|
|
* 将单个视频信息插入编辑器中
|
|
*/
|
|
function insertSingle(){
|
|
var width = $G("videoWidth"),
|
|
height = $G("videoHeight"),
|
|
url=$G('videoUrl').value,
|
|
align = findFocus("videoFloat","name");
|
|
if(!url) return false;
|
|
if ( !checkNum( [width, height] ) ) return false;
|
|
editor.execCommand('insertvideo', {
|
|
url: convert_url(url),
|
|
width: width.value,
|
|
height: height.value,
|
|
align: align
|
|
});
|
|
}
|
|
|
|
/**
|
|
* 将元素id下的所有代表视频的图片插入编辑器中
|
|
* @param id
|
|
*/
|
|
function insertSearch(id){
|
|
var imgs = domUtils.getElementsByTagName($G(id),"img"),
|
|
videoObjs=[];
|
|
for(var i=0,img; img=imgs[i++];){
|
|
if(img.getAttribute("selected")){
|
|
videoObjs.push({
|
|
url:img.getAttribute("ue_video_url"),
|
|
width:420,
|
|
height:280,
|
|
align:"none"
|
|
});
|
|
}
|
|
}
|
|
editor.execCommand('insertvideo',videoObjs);
|
|
}
|
|
|
|
/**
|
|
* 找到id下具有focus类的节点并返回该节点下的某个属性
|
|
* @param id
|
|
* @param returnProperty
|
|
*/
|
|
function findFocus( id, returnProperty ) {
|
|
var tabs = $G( id ).children,
|
|
property;
|
|
for ( var i = 0, ci; ci = tabs[i++]; ) {
|
|
if ( ci.className=="focus" ) {
|
|
property = ci.getAttribute( returnProperty );
|
|
break;
|
|
}
|
|
}
|
|
return property;
|
|
}
|
|
function convert_url(s){
|
|
return s.replace(/http:\/\/www\.tudou\.com\/programs\/view\/([\w\-]+)\/?/i,"http://www.tudou.com/v/$1")
|
|
.replace(/http:\/\/www\.youtube\.com\/watch\?v=([\w\-]+)/i,"http://www.youtube.com/v/$1")
|
|
.replace(/http:\/\/v\.youku\.com\/v_show\/id_([\w\-=]+)\.html/i,"http://player.youku.com/player.php/sid/$1")
|
|
.replace(/http:\/\/www\.56\.com\/u\d+\/v_([\w\-]+)\.html/i, "http://player.56.com/v_$1.swf")
|
|
.replace(/http:\/\/www.56.com\/w\d+\/play_album\-aid\-\d+_vid\-([^.]+)\.html/i, "http://player.56.com/v_$1.swf")
|
|
.replace(/http:\/\/v\.ku6\.com\/.+\/([^.]+)\.html/i, "http://player.ku6.com/refer/$1/v.swf");
|
|
}
|
|
|
|
/**
|
|
* 检测传入的所有input框中输入的长宽是否是正数
|
|
* @param nodes input框集合，
|
|
*/
|
|
function checkNum( nodes ) {
|
|
for ( var i = 0, ci; ci = nodes[i++]; ) {
|
|
var value = ci.value;
|
|
if ( !isNumber( value ) && value) {
|
|
alert( lang.numError );
|
|
ci.value = "";
|
|
ci.focus();
|
|
return false;
|
|
}
|
|
}
|
|
return true;
|
|
}
|
|
|
|
/**
|
|
* 数字判断
|
|
* @param value
|
|
*/
|
|
function isNumber( value ) {
|
|
return /(0|^[1-9]\d*$)/.test( value );
|
|
}
|
|
|
|
/**
|
|
* tab切换
|
|
* @param tabParentId
|
|
* @param keepFocus 当此值为真时，切换按钮上会保留focus的样式
|
|
*/
|
|
function switchTab( tabParentId,keepFocus ) {
|
|
var tabElements = $G( tabParentId ).children,
|
|
tabHeads = tabElements[0].children,
|
|
tabBodys = tabElements[1].children;
|
|
for ( var i = 0, length = tabHeads.length; i < length; i++ ) {
|
|
var head = tabHeads[i];
|
|
domUtils.on( head, "click", function () {
|
|
//head样式更改
|
|
for ( var k = 0, len = tabHeads.length; k < len; k++ ) {
|
|
if(!keepFocus)tabHeads[k].className = "";
|
|
}
|
|
this.className = "focus";
|
|
//body显隐
|
|
var tabSrc = this.getAttribute( "tabSrc" );
|
|
for ( var j = 0, length = tabBodys.length; j < length; j++ ) {
|
|
var body = tabBodys[j],
|
|
id = body.getAttribute( "id" );
|
|
|
|
if ( id == tabSrc ) {
|
|
body.style.display = "";
|
|
if(id=="videoSearch"){
|
|
selectTxt($G("videoSearchTxt"));
|
|
}
|
|
if(id=="video"){
|
|
selectTxt($G("videoUrl"));
|
|
}
|
|
|
|
} else {
|
|
body.style.display = "none";
|
|
}
|
|
}
|
|
} );
|
|
}
|
|
}
|
|
/**
|
|
* 创建图片浮动选择按钮
|
|
* @param ids
|
|
*/
|
|
function createAlignButton( ids ) {
|
|
for ( var i = 0, ci; ci = ids[i++]; ) {
|
|
var floatContainer = $G( ci ),
|
|
nameMaps = {"none":lang['default'], "left":lang.floatLeft, "right":lang.floatRight, "center":lang.block};
|
|
for ( var j in nameMaps ) {
|
|
var div = document.createElement( "div" );
|
|
div.setAttribute( "name", j );
|
|
if ( j == "none" ) div.className="focus";
|
|
div.style.cssText = "background:url(images/" + j + "_focus.jpg);";
|
|
div.setAttribute( "title", nameMaps[j] );
|
|
floatContainer.appendChild( div );
|
|
}
|
|
switchSelect( ci );
|
|
}
|
|
}
|
|
|
|
/**
|
|
* 选择切换
|
|
* @param selectParentId
|
|
*/
|
|
function switchSelect( selectParentId ) {
|
|
var selects = $G( selectParentId ).children;
|
|
for ( var i = 0, ci; ci = selects[i++]; ) {
|
|
domUtils.on( ci, "click", function () {
|
|
for ( var j = 0, cj; cj = selects[j++]; ) {
|
|
cj.className = "";
|
|
cj.removeAttribute && cj.removeAttribute( "class" );
|
|
}
|
|
this.className = "focus";
|
|
} )
|
|
}
|
|
}
|
|
|
|
/**
|
|
* 监听url改变事件
|
|
* @param url
|
|
*/
|
|
function addUrlChangeListener(url){
|
|
if (browser.ie) {
|
|
url.onpropertychange = function () {
|
|
createPreviewVideo( this.value );
|
|
}
|
|
} else {
|
|
url.addEventListener( "input", function () {
|
|
createPreviewVideo( this.value );
|
|
}, false );
|
|
}
|
|
}
|
|
|
|
/**
|
|
* 根据url生成视频预览
|
|
* @param url
|
|
*/
|
|
function createPreviewVideo(url){
|
|
|
|
if ( !url )return;
|
|
var matches = url.match(/youtu.be\/(\w+)$/) || url.match(/youtube\.com\/watch\?v=(\w+)/) || url.match(/youtube.com\/v\/(\w+)/),
|
|
youku = url.match(/youku\.com\/v_show\/id_(\w+)/),
|
|
youkuPlay = /player\.youku\.com/ig.test(url);
|
|
if(!youkuPlay){
|
|
if (matches){
|
|
url = "https://www.youtube.com/v/" + matches[1] + "?version=3&feature=player_embedded";
|
|
}else if(youku){
|
|
url = "http://player.youku.com/player.php/sid/"+youku[1]+"/v.swf"
|
|
}else if(!endWith(url,[".swf",".flv",".wmv"])){
|
|
$G("preview").innerHTML = lang.urlError;
|
|
return;
|
|
}
|
|
}else{
|
|
url = url.replace(/\?f=.*/,"");
|
|
}
|
|
$G("preview").innerHTML = '<embed type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer"' +
|
|
' src="' + url + '"' +
|
|
' width="' + 420 + '"' +
|
|
' height="' + 280 + '"' +
|
|
' wmode="transparent" play="true" loop="false" menu="false" allowscriptaccess="never" allowfullscreen="true" ></embed>';
|
|
}
|
|
|
|
/**
|
|
* 末尾字符检测
|
|
* @param str
|
|
* @param endStrArr
|
|
*/
|
|
function endWith(str,endStrArr){
|
|
for(var i=0,len = endStrArr.length;i<len;i++){
|
|
var tmp = endStrArr[i];
|
|
if(str.length - tmp.length<0) return false;
|
|
|
|
if(str.substring(str.length-tmp.length)==tmp){
|
|
return true;
|
|
}
|
|
}
|
|
return false;
|
|
}
|
|
|
|
/**
|
|
* ajax获取视频信息
|
|
*/
|
|
function getMovie(){
|
|
var keywordInput = $G("videoSearchTxt");
|
|
if(!keywordInput.getAttribute("hasClick") ||!keywordInput.value){
|
|
selectTxt(keywordInput);
|
|
return;
|
|
}
|
|
$G( "searchList" ).innerHTML = lang.loading;
|
|
var keyword = keywordInput.value,
|
|
type = $G("videoType").value,
|
|
str="";
|
|
ajax.request(editor.options.getMovieUrl,{
|
|
searchKey:keyword,
|
|
videoType:type,
|
|
onsuccess:function(xhr){
|
|
try{
|
|
var info = eval("("+xhr.responseText+")");
|
|
}catch(e){
|
|
return;
|
|
}
|
|
|
|
var videos = info.multiPageResult.results;
|
|
var html=["<table width='530'>"];
|
|
for(var i=0,ci;ci = videos[i++];){
|
|
html.push(
|
|
"<tr>" +
|
|
"<td><img title='"+lang.clickToSelect+"' ue_video_url='"+ci.outerPlayerUrl+"' alt='"+ci.tags+"' width='106' height='80' src='"+ci.picUrl+"' /> </td>" +
|
|
"<td>" +
|
|
"<p><a target='_blank' title='"+lang.goToSource+"' href='"+ci.itemUrl+"'>"+ci.title.substr(0,30)+"</a></p>" +
|
|
"<p style='height: 62px;line-height: 20px' title='"+ci.description+"'> "+ ci.description.substr(0,95) +" </p>" +
|
|
"</td>" +
|
|
"</tr>"
|
|
);
|
|
}
|
|
html.push("</table>");
|
|
$G("searchList").innerHTML = str = html.length ==2 ?lang.noVideo : html.join("");
|
|
var imgs = domUtils.getElementsByTagName($G("searchList"),"img");
|
|
if(!imgs)return;
|
|
for(var i=0,img;img = imgs[i++];){
|
|
domUtils.on(img,"click",function(){
|
|
changeSelected(this);
|
|
})
|
|
}
|
|
}
|
|
});
|
|
}
|
|
|
|
/**
|
|
* 改变对象o的选中状态
|
|
* @param o
|
|
*/
|
|
function changeSelected(o){
|
|
if ( o.getAttribute( "selected" ) ) {
|
|
o.removeAttribute( "selected" );
|
|
o.style.cssText = "filter:alpha(Opacity=100);-moz-opacity:1;opacity: 1;border: 2px solid #fff";
|
|
} else {
|
|
o.setAttribute( "selected", "true" );
|
|
o.style.cssText = "filter:alpha(Opacity=50);-moz-opacity:0.5;opacity: 0.5;border:2px solid blue;";
|
|
}
|
|
}
|
|
|
|
|
|
|
|
})();
|