video_wev8.js
17.4 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
/**
* Created by JetBrains PhpStorm.
* User: taoqili
* Date: 12-2-20
* Time: 上午11:19
* To change this template use File | Settings | File Templates.
*/
(function(){
editor.setOpt({
videoFieldName:"upfile"
});
var video = {},
uploadVideoList = [],
isModifyUploadVideo = false;
window.onload = function(){
$focus($G("videoUrl"));
initTabs();
initVideo();
initUpload();
};
/* 初始化tab标签 */
function initTabs(){
var tabs = $G('tabHeads').children;
for (var i = 0; i < tabs.length; i++) {
domUtils.on(tabs[i], "click", function (e) {
var target = e.target || e.srcElement;
for (var j = 0; j < tabs.length; j++) {
if(tabs[j] == target){
tabs[j].className = "focus";
$G(tabs[j].getAttribute('data-content-id')).style.display = "block";
}else {
tabs[j].className = "";
$G(tabs[j].getAttribute('data-content-id')).style.display = "none";
}
}
});
}
}
function initVideo(){
createAlignButton( ["videoFloat", "upload_alignment"] );
addUrlChangeListener($G("videoUrl"));
addOkListener();
//编辑视频时初始化相关信息
(function(){
var img = editor.selection.getRange().getClosedNode(),url;
if(img && img.className){
var hasFakedClass = (img.className == "edui-faked-video"),
hasUploadClass = img.className.indexOf("edui-upload-video")!=-1;
if(hasFakedClass || hasUploadClass) {
$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);
}
if(hasUploadClass) {
isModifyUploadVideo = true;
}
}
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;
case "upload":
return insertUpload();
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
}, isModifyUploadVideo ? 'upload':null);
}
/**
* 将元素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 );
}
/**
* 创建图片浮动选择按钮
* @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_wev8.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;";
}
}
/* 插入上传视频 */
function insertUpload(){
var videoObjs=[],
uploadDir = editor.options.videoPath,
width = $G('upload_width').value || 420,
height = $G('upload_height').value || 280,
align = findFocus("upload_alignment","name") || 'none';
for(var key in uploadVideoList) {
var file = uploadVideoList[key];
videoObjs.push({
url: uploadDir + file.url,
width:width,
height:height,
align:align
});
}
editor.execCommand('insertvideo', videoObjs, 'upload');
}
/*初始化上传标签*/
function initUpload(){
var settings = {
upload_url:editor.options.videoUrl, //附件上传服务器地址
file_post_name:editor.options.videoFieldName, //向后台提交的表单名
flash_url:"../../third-party/swfupload/swfupload.swf",
flash9_url:"../../third-party/swfupload/swfupload_fp9.swf",
post_params:{"PHPSESSID":"<?php echo session_id(); ?>","fileNameFormat":editor.options.fileNameFormat}, //解决session丢失问题
file_size_limit:"100 MB", //文件大小限制,此处仅是前端flash选择时候的限制,具体还需要和后端结合判断
file_types:"*.*", //允许的扩展名,多个扩展名之间用分号隔开,支持*通配符
file_types_description:"Video Files", //扩展名描述
file_upload_limit:100, //单次可同时上传的文件数目
file_queue_limit:10, //队列中可同时上传的文件数目
custom_settings:{ //自定义设置,用户可在此向服务器传递自定义变量
progressTarget:"fsUploadProgress",
startUploadId:"startUpload"
},
debug:false,
// 按钮设置
button_image_url:"../../themes/default/images/filescan_wev8.png",
button_width:"100",
button_height:"25",
button_placeholder_id:"spanButtonPlaceHolder",
button_text:'<span class="theFont">'+lang.browseFiles+'</span>',
button_text_style:".theFont { font-size:14px;}",
button_text_left_padding:10,
button_text_top_padding:4,
// 所有回调函数
swfupload_preload_handler:preLoad,
swfupload_load_failed_handler:loadFailed,
file_queued_handler:fileQueued,
file_queue_error_handler:fileQueueError,
//选择文件完成回调
file_dialog_complete_handler:function(numFilesSelected, numFilesQueued) {
var me = this; //此处的this是swfupload对象
if (numFilesQueued > 0) {
dialog.buttons[0].setDisabled(true);
var start = $G(this.customSettings.startUploadId);
start.style.display = "";
start.onclick = function(){
me.startUpload();
start.style.display = "none";
}
}
},
upload_start_handler:uploadStart,
upload_progress_handler:uploadProgress,
upload_error_handler:uploadError,
upload_success_handler:function (file, serverData) {
try{
var info = eval("("+serverData+")");
}catch(e){}
var progress = new FileProgress(file, this.customSettings.progressTarget);
if(info.state=="SUCCESS"){
progress.setComplete();
progress.setStatus("<span style='color: #0b0;font-weight: bold'>"+lang.uploadSuccess+"</span>");
uploadVideoList.push({url:info.url,type:info.fileType,original:info.original});
progress.toggleCancel(true,this,lang.delSuccessFile);
}else{
progress.setError();
progress.setStatus(info.state);
progress.toggleCancel(true,this,lang.delFailSaveFile);
}
},
//上传完成回调
upload_complete_handler:uploadComplete,
//队列完成回调
queue_complete_handler:function(numFilesUploaded){
dialog.buttons[0].setDisabled(false);
// var status = $G("divStatus");
// var num = status.innerHTML.match(/\d+/g);
// status.innerHTML = ((num && num[0] ?parseInt(num[0]):0) + numFilesUploaded) +lang.statusPrompt;
}
};
var swfupload = new SWFUpload( settings );
};
})();