(function () {
'use strict';
var weburlregex =
/^(https?|ftp):\/\/(((([a-z]|\d|-|\.|_|~|[\u00a0-\ud7ff\uf900-\ufdcf\ufdf0-\uffef])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:)*@)?(((\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5]))|((([a-z]|\d|[\u00a0-\ud7ff\uf900-\ufdcf\ufdf0-\uffef])|(([a-z]|\d|[\u00a0-\ud7ff\uf900-\ufdcf\ufdf0-\uffef])([a-z]|\d|-|\.|_|~|[\u00a0-\ud7ff\uf900-\ufdcf\ufdf0-\uffef])*([a-z]|\d|[\u00a0-\ud7ff\uf900-\ufdcf\ufdf0-\uffef])))\.)+(([a-z]|[\u00a0-\ud7ff\uf900-\ufdcf\ufdf0-\uffef])|(([a-z]|[\u00a0-\ud7ff\uf900-\ufdcf\ufdf0-\uffef])([a-z]|\d|-|\.|_|~|[\u00a0-\ud7ff\uf900-\ufdcf\ufdf0-\uffef])*([a-z]|[\u00a0-\ud7ff\uf900-\ufdcf\ufdf0-\uffef])))\.?)(:\d*)?)(\/((([a-z]|\d|-|\.|_|~|[\u00a0-\ud7ff\uf900-\ufdcf\ufdf0-\uffef])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)+(\/(([a-z]|\d|-|\.|_|~|[\u00a0-\ud7ff\uf900-\ufdcf\ufdf0-\uffef])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)*)*)?)?(\?((([a-z]|\d|-|\.|_|~|[\u00a0-\ud7ff\uf900-\ufdcf\ufdf0-\uffef])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)|[\ue000-\uf8ff]|\/|\?)*)?(\#((([a-z]|\d|-|\.|_|~|[\u00a0-\ud7ff\uf900-\ufdcf\ufdf0-\uffef])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)|\/|\?)*)?$/i;
function getbaseurl() {
var scripts = document.getelementsbytagname('script'),
elem = scripts[scripts.length - 1],
path = elem.src,
segments = path.split('/');
segments.pop();
return segments.join('/');
};
var $ = jquery,
// 默认配置。
syssetting = {
base_url: getbaseurl() + "/",
},
lessie9 = /msie\s((8\.0)|(9\.0))/.test(navigator.useragent);
// 分片上传配置。
var powerchunkconfig =
{
/*是否开启分片*/
chunked: true // [默认值：false]是否要分片处理大文件上传
, chunksize: 5 * 1024 * 1024 // [默认值：5242880] 如果要分片，分多大一片？ 默认大小为5m。分片大小2m-10m之间,
, mergeurl: '/uploadfile/merge' // 合并分片的后端路径。
, inituploaderglobalregistration: function () {
if (window.uploaderglobalregistrationed == true) {
return;
}
webuploader.uploader.register({
'before-send-file': 'beforesendfile',
'before-send': 'beforesend'
},
{
beforesendfile: function (file) {
// 在文件发送之前request，此时还没有分片（如果配置了分片的话），可以用来做文件整体md5验证。
var me = this;
onbeforesendfile(file, me);
},
beforesend: function (block) {
// 在分片发送之前request，可以用来做分片验证，如果此分片已经上传成功了，可返回一个rejected promise来跳过此分片上传。
}
});
function onbeforesendfile(file, me) {
var owner = me.owner,
deferred = webuploader.deferred();
if (!file.identifier) {
file.identifier = webuploader.base.guid().replace('wu_', '');
}
return deferred.promise();
}
window.uploaderglobalregistrationed = true;
}
, onuploadbeforesend: function (block, data, options) {
if (data == null) {
data = {};
}
// block为分块数据。
// block.file为分块对应的file对象。
// data为要发送的数据
var currentfile = block.file;
data.filename = currentfile.name;
data.identifier = currentfile.identifier;
data.index = block.chunk;
data.ischunked = block.chunks > 1;
data.chunksize = options.chunksize;
currentfile.ischunked = data.ischunked;
}
/*发送合并文件的请求。*/
, sendmergefiles: function (fileobject, options, fn) {
if (fileobject.ischunked && options.mergeurl) {
var mergedata =
{
filename: fileobject.name,
identifier: fileobject.identifier,
};
var postdata = $.extend(mergedata, options.formdata);
// 使用$.ajaxpreventcsrf的时候，重复的属性会导致csrf请求错误。
delete postdata.__requestverificationtoken;
var trycount = 0;
var retrylimit = 3;
$.ajaxpreventcsrf(
{
url: options.mergeurl,
data: postdata,
type: 'post',
success: function (result) {
var jsonresult = powerchunkconfig.tryparsejson(result);
fn && fn(fileobject, jsonresult);
},
error: function (xhr) {
if (powerchunkconfig.checkenableretrystatus(xhr.status)) {
trycount++;
if (trycount <= retrylimit) {
$.ajaxpreventcsrf(this);
return;
}
return;
}
}
});
} else {
fn && fn(fileobject);
}
},
checkenableretrystatus: function (status) {
// xhr.status ==504
return status > 399 && status < 599 && status != 403;
},
tryparsejson: function (value) {
try {
if ((typeof (value) == 'string')) {
return json.parse(value);
}
} catch (e) { }
return value;
},
// 上传最大进度(不包括上传的后续处理)。
maximumprogress: 98,
uploadprogresscomplete: function (file, meuploader) {
var $li = meuploader.getli(file.id),
$progress = $li.find('.progress'),
$percenttext = $progress.children('.text'),
$percentimg = $progress.children('.percentage'),
percentagenum = 100;
$percenttext.html(percentagenum + '%');
$percentimg.css('width', percentagenum + '%');
meuploader.$progress.addclass('hidden')
}
};
/*
* 上传队列。
*/
function queue() {
this._queue = [];
}
$.extend(queue.prototype,
{
/*
* @method getlength
* description 获取队列长度。
*/
getlength: function () {
return this._queue.length;
},
/*
* @method getlength
* description 获取队列长度。
*/
clear: function () {
return this._queue.length = 0;
},
/*
* @method append
* description 将新文件加到对队列尾部。
* @param {uploadresponse} uploadresponse 上传相应对象。
*/
append: function (uploadresponse) {
this._queue.push(uploadresponse);
return this;
},
/*
* @method removefile
* description 从队列中删除指定fileid的file。
* @param {uploadresponse} uploadresponse 上传相应对象。
*/
removefile: function (fileid) {
var fileindex = this.getfileindex(fileid);
if (fileindex >= 0) {
this._queue.splice(fileindex, 1);
}
return this._queue;
},
getfile: function (fileid) {
var fileindex = this.getfileindex(fileid);
if (fileindex >= 0) {
return this._queue[fileindex];
}
return undefined;
},
/*
* @method getfileindex
* description 获得指定fileid的file在队列中的位置（下标）。
* @param {uploadresponse} uploadresponse 上传相应对象。
*/
getfileindex: function (fileid) {
for (var i = 0; i < this._queue.length; i++) {
if (fileid === this._queue[i].fileid) {
return i;
}
}
return -1;
}
});
/*
* @method uploadresponse。
* @description 封装uploadresponse信息，用于转成json字符串。
* @param fileid fileid，file唯一的标识。
* @param uploadpath 上传路径。
* @param filename 文件名。
* @param title 标题。
* @param intro 简介。
*/
function uploadresponse(fileid, uploadpath, filename, title, intro, filesize, ismultiplevideo) {
this.fileid = fileid;
if (ismultiplevideo) {
this.videourl = uploadpath;
this.videotitle = title;
this.videointro = intro;
} else {
this.photourl = uploadpath;
this.phototitle = title;
this.photointro = intro;
}
this.filename = filename;
this.filesize = filesize;
};
/*
* 获取15位的随机数
*/
function getrandomid() {
var loop = 'abcdefghijklmnopqrstuvwxyzabcdefghijklmnopqrstuvwxyz'.split(''),
i = 0,
randoms = [];
for (; i < 15; i++) {
randoms.push(loop[math.floor(math.random() * 51)]);
}
return randoms.join('');
}
function unitconversion(size) {
var n = 0,
unit;
while (size / 1024 > 1 && n < 4) {
size = size / 1024;
n++;
}
switch (n) {
case 0:
unit = 'b';
break;
case 1:
unit = 'kb';
break;
case 2:
unit = 'mb';
break;
case 3:
unit = 'gb';
break;
default:
unit = 'tb';
break;
}
return math.round(size) + unit;
}
var getfilecss = (function () {
var css = {};
var fileicon = {};
//压缩文件
$.each(['rar', 'zip', 'arj', 'gz', 'z', '7z'],
function (index, element) {
css[element] = 'rar';
fileicon[element] = "zip";
});
//图片
$.each(['bmp', 'gif', 'jpg', 'pic', 'png', 'tif', 'jpeg'],
function (index, element) {
css[element] = 'pic';
});
//word文档
$.each([/*'txt',*/ 'doc', 'hlp', 'wps', 'docx'],
function (index, element) {
css[element] = 'word';
fileicon[element] = "doc";
});
//pdf文档
$.each(['pdf'],
function (index, element) {
css[element] = 'pdf';
fileicon[element] = "pdf";
});
//excel文档
$.each(['xls', 'xlsx'],
function (index, element) {
css[element] = 'excel';
fileicon[element] = "xls";
});
//视频
$.each([
'wmv', 'asf', 'asx', 'rm', 'rmvb', 'mpg', 'mpeg', 'mpe', '3gp', 'mov', 'mp4', 'm4v', 'avi', 'dat',
'mkv',
'flv', 'vob'
],
function (index, element) {
css[element] = 'video';
fileicon[element] = "video";
});
//音频
$.each([
'mp3', 'aac', 'wav', 'wma', 'cda', 'flac', 'm4a', 'mid', 'mka', 'mp2', 'mpa', 'mpc', 'ape', 'ofr',
'ogg',
'ra', 'wv', 'tta', 'ac3', 'dts'
],
function (index, element) {
css[element] = 'music';
fileicon[element] = "audio";
});
//ppt
$.each([
'ppt', 'pptx', 'pptm', 'ppsx', 'ppsm', 'potx', 'potm', 'ppam'
],
function (index, element) {
css[element] = 'ppt';
fileicon[element] = "ppt";
});
//txt
$.each([
'txt'
],
function (index, element) {
css[element] = 'txt';
fileicon[element] = "txt";
});
//css
$.each([
'css'
],
function (index, element) {
css[element] = 'css';
fileicon[element] = "css";
});
//html
$.each([
'html'
],
function (index, element) {
css[element] = 'html';
fileicon[element] = "html";
});
//js
$.each([
'js'
],
function (index, element) {
css[element] = 'js';
fileicon[element] = "js";
});
//cshtml
$.each([
'cshtml'
],
function (index, element) {
css[element] = 'cshtml';
fileicon[element] = "cshtml";
});
css.file = "files";
fileicon.file = "unknown";
return function (filetype, isfileicon) {
if(isfileicon)
{
return !!filetype ? (fileicon[filetype.tolowercase()] || fileicon["file"]) : fileicon["file"];
}else{
return !!filetype ? (css[filetype.tolowercase()] || css["file"]) : css["file"];
}
};
}());
var videoelements = [];
function setimgvideocover($img, videosrc) {
if ($img.length > 0 && videosrc) {
if (!$img.attr('src')) {
$img.attr('src', '/content/_common/base/img/file_icons/video_4x.png');
}
var videoelement = document.createelement("video");
videoelement.src = videosrc;
videoelement.muted = true;
videoelement.autoplay = true; // 视频一定要设置自动播放，否则抓出来的封面不是白的就是透明的
videoelement.setattribute("crossorigin", 'anonymous');
videoelement.setattribute('playsinline', '');
videoelement.setattribute('webkit-playsinline', ''); //这个属性是内联播放，避免在ios中，ios会劫持播放器，自动弹出播放界面
videoelement.addeventlistener("loadeddata", () => {
try {
var { videowidth, videoheight } = videoelement; // 获取video的宽高
// var maxlength = videowidth > videoheight ? videowidth : videoheight;
// 固定视频缩略图生成比例
var imgwidth = 800;
var imgheight = 450;
var x = 0, y = 0, width = 0, height = 0;
// 计算缩小后图片的宽高以及canvas绘制的位置信息
if (videowidth / videoheight >= 1.5) {
width = imgwidth;
height = videoheight * (imgwidth / videowidth);
x = 0;
y = (imgheight - height) / 2;
} else {
height = imgheight;
width = videowidth * (imgheight / videoheight);
y = 0;
x = (imgwidth - width) / 2;
}
var canvas = document.createelement("canvas");
canvas.width = imgwidth;
canvas.height = imgheight;
var ctx = canvas.getcontext("2d");
ctx.fillstyle = "#000";
ctx.fillrect(0, 0, imgwidth, imgheight);
ctx.drawimage(videoelement, x, y, width, height);
var src = canvas.todataurl("image/png"); // 完成base64图片的创建
$img.attr('src', src);
// 清空video对象
videoelements.splice($.inarray(videoelement, videoelements), 1);
videoelement = null;
} catch (e) {
$img.attr('src', '/content/_common/base/img/file_icons/video_4x.png');
}
})
videoelement.addeventlistener("error", () => {
$img.attr('src', '/content/_common/base/img/file_icons/video_4x.png');
});
videoelements.push(videoelement); // 存储video对象防止回收
}
}
function setimgwarpsrc(imgwarp, filepath) {
var fileextension = '';
var extensionarray = filepath.split('.');
if (extensionarray.length > 0) {
fileextension = extensionarray[extensionarray.length - 1];
}
var filecss = getfilecss(fileextension);
var filename = getfilecss(fileextension,true);
var filetypepath = filecss === 'pic' ? filepath : '/content/_common/base/img/file_icons/' + filename + '_4x.png';
if (imgwarp.length > 0) {
if (filecss === 'video') {
setimgvideocover(imgwarp, filepath);
} else {
imgwarp.attr('src', filetypepath).addclass(filecss);
}
}
return { type: filecss, path: filetypepath };
}
pe.ui.inituploader = function (element) {
var $uploadelement = $(element),
setting = $.extend({}, syssetting, $uploadelement.data()),
webuploader;
setting.lable = $uploadelement.data("type") === 'video' ? "视频" : (setting.uploadresourcetype.tolowercase() === 'file' ? "文件" : "图片");
var mimetypes = setting.extensions.split(',');
for (var i = 0; i < mimetypes.length; i++) {
if (mimetypes[i] == "jpg" || mimetypes[i] == "png" || mimetypes[i] == "jpeg" || mimetypes[i] == "gif" || mimetypes[i] == "bmp") {
mimetypes[i] = 'image/' + mimetypes[i];
}
else {
mimetypes[i] = '.' + mimetypes[i];
}
}
setting.mimetypes = mimetypes.join(',');
if (setting.isuploadmulti === false) {
setting.isautoupload = 'true';
webuploader = createwebupload((setting.uploadresourcetype.tolowercase() === 'file'
? singlefileupload
: singleupload),
$uploadelement,
setting);
} else if (setting.isuploadmulti) {
webuploader = createwebupload((setting.uploadresourcetype === 'file'
? multiplefileupload
: multipleimageupload),
$uploadelement,
setting); // 多图片上传。
if ($.ui) {
// 图片拖动排序初始化。
$.ui.isoveraxis = function (x, reference, size) {
return (x > reference) && (x < (reference + size));
};
var $sortable = $uploadelement.find("ul.sortable");
$sortable.sortable({
update: function () {
webuploader.savefilemsgbyhtml();
}
});
$sortable.disableselection();
}
}
$uploadelement.data('webuploader', webuploader);
return webuploader;
};
/**
* 检查输入内容是否包含xss代码
* @param {string} v 待检查内容。
* @return {boolean} true-存在xss代码,false-不存在。
*/
function checkisxss(v) {
var res1 = (new regexp("\\b(document|eval|script|img|svg|javascript|alert|on(error|mousewheel|mouseover|click|load|submit|focus|blur|start))\\b")).test(v);
var res2 = (new regexp("<", "g")).test(v);
var res3 = (new regexp(">", "g")).test(v);
var res4 = (new regexp("'", "g")).test(v);
var res5 = (new regexp("\"", "g")).test(v);
return ((res1 == true) || (res2 == true) || (res3 == true) || (res4 == true) || (res5 == true));
}
$(function () {
powerchunkconfig.inituploaderglobalregistration();
// 循环初始化上传控件。
$('[data-ui-type="uploader"]')
.each(function () {
var that = $(this),
autoinit = that.data('autoinit');
if (typeof autoinit === 'undefined' || autoinit === true) {
pe.ui.inituploader(that);
}
});
});
/*
* 创建一个上传控件
* @return object 上传控件对象
* @upload function 上传控件构造函数
* @$uploadelement jqueryobject 传给控件构造函数的参数
* @setting object 传给控件构造函数的设置参数
*/
function createwebupload(upload, $uploadelement, setting) {
var uploader;
if (!$.isfunction(upload)) {
return;
}
uploader = new upload($uploadelement, setting);
// 修改的初始化
if (setting.editvalue) {
uploader.initedit(setting.editvalue);
settimeout(function () {
uploader.showthumbnailplaceholder();
},
10);
}
return uploader;
}
/*
* 上传控件核心。
*/
function poweruploader($uploadelement, setting) {
var ratio = window.devicepixelratio || 1, // web uploader功能
self = this;
this.setting = setting, // 配置。
this.thumbnailwidth = 0.5, // 缩略图宽高。// 优化retina, 在retina下这个值是2。
this.thumbnailheight = 0.5; // 当width或者height的值介于0-1时，被当成百分比使用。
this.$uploadplaceholder = $uploadelement.find('#upload-placeholder'); // 初始化的选择文件的区域。
this.$files = $uploadelement.find('#files-' + this.setting.propertyname); // 文件列表（区域）。
this.$filemsg = this.$files.children('#' + this.setting.propertyname); // 文件信息。
// this.$btnselectfile = $uploadelement.find('#filepicker_' + this.setting.propertyname + ' :file'); // 选择文件按钮。在这里找不到。
// 初始化web uploader
this.uploader = window.webuploader.create({
// 内部根据当前运行是创建，可能是input元素，也可能是flash。
pick: {
id: '#file-picker-' + this.setting.propertyname, // 选择按钮id。
label: "上传" + this.setting.lable, // 选择文件的按钮文本。
multiple: this.setting.isuploadmulti, // == 'true') ? true : false // 是否单文件。true表示单文件，false表示多文件。
},
// swf文件路径。
swf: this.setting.base_url + 'uploader.swf',
// 拖拽上传。功能可用，样式不对。
dnd: '.' + this.setting.dndclass,
// 粘贴。功能不可用。
// paste: 'body',
// 只允许选择文件，可选。
accept: {
title: 'images',
extensions: this.setting.extensions, // 用户能上传的的类型，不在这范围内的，即使选择了也不会上传。
mimetypes: setting.mimetypes // 点“选择文件”，默认打开该类型的文件。
},
filesinglesizelimit: this.setting.filesinglesizelimit, // 验证单个文件大小是否超出限制, 超出则不允许加入队列。
filesizelimit: this.setting.filesizelimit, // 验证文件总大小是否超出限制, 超出则不允许加入队列。
filenumlimit: this.setting.filenumlimit, // 验证文件总数量, 超出则不允许加入队列。
// 缩略图
thumb: {
width: 200,
height: 200,
// 图片质量，只有type为`image/jpeg`的时候才有效。
quality: 100,
// 是否允许放大，如果想要生成小图的时候不失真，此选项应该设置为false.
allowmagnify: false,
// 是否允许裁剪。
crop: true
},
// 自动上传。
auto: (this.setting.isautoupload.tolowercase() === 'true') ? true : false,
// 文件接收服务端。
server: this.setting.uploadurl,
// 文件上传请求的参数表，每次发送都会发送此对象中的参数。
formdata: {
uploadproviderkey: this.setting.uploadproviderkey,
__requestverificationtoken: $('input[name="__requestverificationtoken"]').val()
//__requestverificationtoken: pe.security.csrf.getrequestverificationtokenvalue()
},
timeout: 60 * 60 * 1000, // 60分钟
compress: (this.setting.precompression && this.setting.precompression.tolowercase() === 'true')
? getcompressconfig(this.setting)
: false,
chunked: powerchunkconfig.chunked || false,
chunksize: powerchunkconfig.chunksize,
mergeurl: this.setting.mergeurl || powerchunkconfig.mergeurl
});
return this;
}
function getcompressconfig(setting) {
return {
width: setting.scalewidth === 0 ? 99999 : setting.scalewidth,
height: setting.scaleheight === 0 ? 99999 : setting.scaleheight,
// 图片质量，只有type为`image/jpeg`的时候才有效。
quality: 90,
// 是否允许放大，如果想要生成小图的时候不失真，此选项应该设置为false.
allowmagnify: false,
// 是否允许裁剪。
crop: false,
// 是否保留头部meta信息。
preserveheaders: true,
// 如果发现压缩后文件大小比原来还大，则使用原来图片
// 此属性可能会影响图片自动纠正功能
nocompressiflarger: false,
// 单位字节，如果图片大小小于此值，不会采用压缩。
compresssize: 0
};
}
$.extend(poweruploader.prototype,
{
/*
* @method savefilemsg。
* @description 保存上传文件信息（到隐藏控件）。
* @param filemsg 上传文件信息。
*/
savefilemsg: function (filemsg) {
this.$filemsg.val(filemsg)
.trigger('change');
},
/*
* @method savefilemsg。
* @description 重置上传文件信息。
*/
resetfilemsg: function () {
this.$filemsg.val('')
.trigger('change');
},
/*
* @method showthumbnail。
* @description 显示缩略图。
* @param $img img标签，jquery对象。
* @param webuploader webuploader对象。
* @param file 文件。javascript的file对象。
* @param thumbnailwidth 缩略图宽度。
* @param thumbnailheight 缩略图高度。
*/
showthumbnail: function ($fileitem, webuploader, file, thumbnailwidth, thumbnailheight) {
var $img = $fileitem.find('img');
webuploader.makethumb(file,
function (error, src) {
if (error) {
$img.attr('src', '');
return;
}
$img.attr('src', src);
},
thumbnailwidth,
thumbnailheight);
return $img;
},
/*
* @method showweburlimg。
* @description 显示外链图片。
* @param $img img标签，jquery对象。
* @param webimgurl 外链地址。
*/
showweburlimg: function ($fileitem, file) {
var imgwarp = $fileitem.find('img');
var photourl = typeof file === 'string'
? file
: file.photourl.replace(this.setting.uploadpathreplacesymbol, this.setting.uploadpath);
setimgwarpsrc(imgwarp, photourl);
return imgwarp;
},
/*
* @method setuploadproviderkey。
* @description 设置uploadproviderkey。
* @param uploadproviderkey。
*/
setuploadproviderkey: function (uploadproviderkey) {
this.uploader.options.formdata.uploadproviderkey = uploadproviderkey;
}
});
/*
* 继承
* @parent function 父类构造函数
* @sub function 子类构造函数
*/
var inherit = (function () {
function f() { }
return function (parent, sub) {
f.prototype = parent.prototype;
sub.prototype = new f();
sub.prototype.constructor = sub;
sub.uper = parent.prototype;
};
}());
/*
* 文件上传webupload构造函数
* @return object webupload实例
* @$uploadelement jqueryobject 封装了上传控件元素的jquery对象
* @setting object 参数
*/
function multiplefilewebupload($uploadelement, setting) {
this.setting = setting;
this.$files = $uploadelement.find('#files-' + this.setting.propertyname); // 文件列表（区域）。
this.$uploadplaceholder = $uploadelement.find('#upload-placeholder'); // 初始化的选择文件的区域。
this.$filemsg = this.$files.children('#' + this.setting.propertyname); // 文件信息。
this.uploader = window.webuploader.create({
// 内部根据当前运行是创建，可能是input元素，也可能是flash。
pick: {
id: '#file-picker-' + this.setting.propertyname, // 选择按钮id。
label: '上传' + this.setting.lable, // 选择文件的按钮文本。
multiple: this.setting.isuploadmulti, // == 'true') ? true : false // 是否单文件。true表示单文件，false表示多文件。
},
// swf文件路径。
swf: this.setting.base_url + 'uploader.swf',
// 拖拽上传。功能可用，样式不对。
dnd: '.' + this.setting.dndclass,
// 粘贴。功能不可用。
// paste: 'body',
// 只允许选择文件，可选。
accept: {
title: 'files',
extensions: this.setting.extensions, // 用户能上传的的类型，不在这范围内的，即使选择了也不会上传。
mimetypes: setting.mimetypes // 点“选择文件”，默认打开该类型的文件。
},
filesizelimit: this.setting.filesizelimit, // 验证文件总大小是否超出限制, 超出则不允许加入队列。
filesinglesizelimit: this.setting.filesinglesizelimit, // 验证单个文件大小是否超出限制, 超出则不允许加入队列。
// 自动上传。
auto: (this.setting.isautoupload.tolowercase() === 'true') ? true : false,
// 文件接收服务端。
server: this.setting.uploadurl,
// 文件上传请求的参数表，每次发送都会发送此对象中的参数。
formdata: {
uploadproviderkey: this.setting.uploadproviderkey,
__requestverificationtoken: $('input[name="__requestverificationtoken"]').val()
//__requestverificationtoken: pe.security.csrf.getrequestverificationtokenvalue()
},
compress: false,
chunked: powerchunkconfig.chunked || false,
chunksize: powerchunkconfig.chunksize,
mergeurl: this.setting.mergeurl || powerchunkconfig.mergeurl
});
$uploadelement.data("curuploadobject", this.uploader);
}
inherit(poweruploader, multiplefilewebupload);
$.extend(multiplefilewebupload.prototype,
{
showweburlimg: function ($fileitem, fileinfo) {
var $filename = $fileitem.find("#filename"),
fileisstring = typeof fileinfo === 'string',
isweburl,
parts,
filename = fileinfo.filename,
title,
url = fileinfo.photourl || fileinfo.videourl;
if (fileisstring) {
parts = fileinfo.split('/');
filename = parts[parts.length - 1];
title = parts[parts.length - 1];
isweburl = fileisstring || weburlregex.test(fileinfo);
} else {
title = fileinfo.phototitle || fileinfo.videotitle;
isweburl = fileisstring || weburlregex.test(url);
}
this.addfilecss($filename, filename);
$filename.text(title);
$fileitem.find("#uploadstatus").text('');
$fileitem.find('#filesize').text(isweburl ? "未知" : unitconversion(fileinfo.filesize));
var $a = $fileitem.find('i.fa-save').removeclass('hidden').parent();
$a.attr('href',
fileisstring
? fileinfo
: (isweburl
? url
: this.setting.downurl + '?fileurl=' + encodeuricomponent(url)));
var imgwarp = $fileitem.find('img');
var photourl = typeof fileinfo === 'string'
? fileinfo
: url.replace(this.setting.uploadpathreplacesymbol, this.setting.uploadpath);
setimgwarpsrc(imgwarp, photourl);
return imgwarp;
},
showthumbnail: function ($fileitem, webuploader, file, thumbnailwidth, thumbnailheight) {
var $img = $fileitem.find('img');
var filecss = getfilecss(file.ext);
if (filecss === 'pic') {
webuploader.makethumb(file, function (error, src) { $img.attr('src', src); }, thumbnailwidth, thumbnailheight);
}
else if (filecss === 'video') {
setimgvideocover($img, url.createobjecturl(file.source.source));
}
else {
setimgwarpsrc($img, file.name);
}
return $img;
},
//showthumbnail: function ($fileitem, webuploader, file, thumbnailwidth, thumbnailheight) {
// var $div = $fileitem.find('#filemsg'),
// $filename = $div.find("#filename");
// this.addfilecss($filename, file.name);
// $filename.text(file.name);
// $div.find("#filesize").text(unitconversion(file.size));
// $div.find("#uploadstatus").text("等待上传……");
//},
addfilecss: function ($filename, filename) {
var file = filename.split('.');
$filename.addclass(getfilecss(file[file.length - 1]));
}
});
/*
* 单图片上传控件。
*/
function singleupload($uploadelement, setting) {
this.multiuploader = this.createnewuploader($uploadelement, setting);
var self = this,
coreuploader = this.multiuploader.uploader,
$datax,
$datay,
$datawidth,
$dataheight;
this.setting = setting;
this.$thumbnail = this.multiuploader.$files.find('#thumbnail' + setting.propertyname); // 缩略图。
this.$progress = this.multiuploader.$files.find('li .progress'); // 滚动条。
this.$operations = this.multiuploader.$files.find('#operations');
this.$btnreupload = this.$operations.children('#btnreupload'); // 按钮（重新上传）。
this.$btndelete = this.$operations.children('#btndelete'); // 按钮（删除）。 undone 只是在队列里删除，没有删除服务器上的文件。
this.$weburl = $uploadelement.find('#weburl-' + setting.propertyname); // 添加外链弹出层。
this.$txtweburl = this.$weburl.find('#txtweburl'); // 外链文本框。
this.$btnconfirmweburl = this.$weburl.find('#btnconfirmweburl'); // “外链窗口”的确认按钮。
this.$files = $uploadelement.find('#files-' + setting.propertyname);
this.$photomodal = $uploadelement.find('#photo-' + setting.propertyname); // 添加图片弹出层。
this.$photo = this.$photomodal.find('#photo-element'); // 图片标签。
this.$videomodal = $uploadelement.find('#video-' + setting.propertyname); // 添加视频弹出层。
this.$video = this.$videomodal.find('#video-element'); // 视频标签。
// 不使用 data-dismiss="modal" 而是手动添加弹窗关闭，此处为了防止上传控件在多层弹窗中的级联关闭事件
$uploadelement.find(".modal .close-current").click(function () {
$(this).closest(".modal").modal('hide');
})
var $thumbnail = this.$thumbnail;
$thumbnail.on("error",
function () {
//上传图片后才会有显示加载失败的提示。
if ($thumbnail.attr("src")) {
$thumbnail.attr("src", "/content/_common/base/img/error-forbidden.jpg");
}
});
/*
* 剪裁
*/
this.$btncropper = this.$operations.find('#btncropper'); // 图片裁剪按钮。
this.$cropper = $uploadelement.find('#corpper-' + setting.propertyname);
this.$cropperimage = this.$cropper.find('div.img-container > img');
this.$imgpreview = this.$cropper.find('div.img-preview');
this.$datax = this.$cropper.find('#datax');
this.$datay = this.$cropper.find('#datay');
this.$dataheight = this.$cropper.find("#dataheight");
this.$datawidth = this.$cropper.find("#datawidth");
this.$cropper.find("#zoom_in")
.on('click',
function () {
self.$cropperimage.cropper('zoom', 0.1);
});
this.$cropper.find("#zoom_out")
.on('click',
function () {
self.$cropperimage.cropper('zoom', -0.1);
});
this.$cropper.find("#rotate_left")
.on('click',
function () {
self.$cropperimage.cropper('rotate', -90);
});
this.$cropper.find("#rotate_right")
.on('click',
function () {
self.$cropperimage.cropper('rotate', 90);
});
$datax = this.$cropper.find("#datax");
$datay = this.$cropper.find("#datay");
$datawidth = this.$cropper.find("#datawidth");
$dataheight = this.$cropper.find("#dataheight");
$.each([$datax, $datay, $datawidth, $dataheight],
function () {
this.on('change',
function () {
self.$cropperimage.cropper("setdata",
{
x: $datax.val(),
y: $datay.val(),
width: $datawidth.val(),
height: $dataheight.val()
});
});
});
this.$cropper.find('#lockaspectratio')
.on('change',
function () {
if ($(this).prop('checked')) {
self.$cropperimage.cropper("setaspectratio", $datawidth.val() / $dataheight.val());
} else {
self.$cropperimage.cropper("setaspectratio", "auto");
}
});
this.$radios = this.$cropper.find("div.docs-options :radio");
var $inputimage = this.$cropper.find("#inputimage");
$inputimage.attr('accept', setting.mimetypes);
if (window.filereader) {
$inputimage.change(function () {
var filereader = new filereader(),
files = this.files,
file;
if (!files.length) {
return;
}
file = files[0];
if (/^image\/\w+$/.test(file.type)) {
filereader.readasdataurl(file);
filereader.onload = function () {
$inputimage.val("");
self.$cropperimage.cropper("reset", true).cropper("replace", this.result);
//解决bug：#12620 点击剪裁，在剪裁页面点击“重新上传”按钮上传新图片，再点击“未选中区域”或“网格线”，图片变成了原始图片。但是图片会闪。
self.radioschange(this.result);
};
} else {
showmessage("please choose an image file.");
}
});
} else {
$inputimage.addclass("hide");
}
this.$btnupldateurl = this.$files.find('#btnupldateurl');
this.$updateurl = $uploadelement.find('#updateurl_' + setting.propertyname); //修改图片
this.$imageurl = this.$updateurl.find('#txturl'); //图片地址
this.$btnconfirmnewurl = this.$updateurl.find('#btnconfirmnewurl'); //确认修改地址
this.$uploadsuccess = this.$files.find('div.upload-success'); //上传完成图标
this.$uploadimgwrap = this.$files.find('div.imgwrap'); //上传完成图标
self.$btnupldateurl.click(function (event) {
event.preventdefault();
self.$updateurl.modal('show');
var url = self.multiuploader.$filemsg.val().replacepathsymbolforshow(setting.uploadpathreplacesymbol, setting.uploadpath);
self.$imageurl.val(url);
self.$imageurl.oldurl = url;
});
self.$btnconfirmnewurl.on('click',
function () {
var url = self.$imageurl.val();
if (!url) {
alert(self.setting.lable + "地址不能为空");
return;
}
function updatesuccess(fileurl, srcurl) {
self.$updateurl.modal('hide');
self.multiuploader.$filemsg.val(fileurl);
self.$thumbnail.attr('src', srcurl);
}
if (weburlregex.test(url)) {
updatesuccess(url, url);
} else {
if (!/^\/.*$/.test(url)) {
url = '/' + url;
}
var val = url;
if ((new regexp("^" + self.setting.uploadpath + ".*$")).test(url)) {
val = url.replace(self.setting.uploadpath, setting.uploadpathreplacesymbol);
}
updatesuccess(val, url);
}
});
// 图片预览click。
this.onbtnphotoclick = function (event) {
event.preventdefault();
var fileurl = $('#' + setting.propertyname).val();
var url = fileurl.replace(self.setting.uploadpathreplacesymbol, self.setting.uploadpath);
self.$photo.attr("src", url);
self.$photomodal.modal('show');
}
// 查看视频click。
this.onbtnvideoclick = function (event) {
event.preventdefault();
var fileurl = $('#' + setting.propertyname).val();
var url = fileurl.replace(self.setting.uploadpathreplacesymbol, self.setting.uploadpath);
self.$video.find("source").attr("src", url);
var video = self.$video[0];
video.onloadedmetadata = function (evt) {
var v_width = video.videowidth,
v_height = video.videoheight,
w_width = ($(window).width() * 0.8) - 49,
w_height = $(window).height() - 154;
var v_proportion = v_width / v_height;
var w_proportion = w_width / w_height;
// if(v_proportion > w_proportion){
// $("#modalvideo .modal-dialog").width("80%");
// $("#interviewervideo").width("100%");
// }else{
// $("#modalvideo .modal-dialog").width(w_height * v_proportion + 32 - 8);
// $("#interviewervideo").width(w_height * v_proportion - 8);
// }
// 视频强制显示16*9 或9*16
if (v_width > v_height) {
// 横屏
if (w_width / 16 < w_height / 9) {
self.$videomodal.find(".modal-dialog").width(w_width + 32);
self.$video.width(w_width);
self.$video.height(w_width / 16 * 9);
} else {
self.$videomodal.find(".modal-dialog").width((w_height / 9 * 16) + 32);
self.$video.width(w_height / 9 * 16);
self.$video.height(w_height);
}
} else {
// 竖屏
self.$videomodal.find(".modal-dialog").width((w_height / 16 * 9) + 32);
self.$video.width(w_height / 16 * 9);
self.$video.height(w_height);
}
};
// 播放视频。
video.load();
self.$videomodal.modal('show');
video.play();
};
// 视频关闭
self.$videomodal.on('hidden.bs.modal',
function () {
var video = self.$video[0];
video.pause();
});
// 显示隐藏遮罩层
this.showorhideoverlay = function (fileextension, $fileitem) {
$fileitem.find('.overlay').remove();
var filecss = getfilecss(fileextension);
if (filecss === 'video' && self.$videomodal.length > 0) {
var $videooverlay = $('');
$videooverlay.click(this.onbtnvideoclick);
$fileitem.append($videooverlay);
} else if (filecss === 'pic' && self.$photomodal.length > 0) {
var $photooverlay = $('');
$photooverlay.click(this.onbtnphotoclick);
$fileitem.append($photooverlay);
}
}
this.initedit = function (file) {
self.multiuploader.showweburlimg(self.$files, file)
.attr('fileid', file.fileid);
// self.$uploadsuccess.removeclass('hidden');
self.$uploadimgwrap.addclass('imgwrap-upload-success'); // 上传成功，由图标表示，改为通过图片透明度表示
var fileextension = '';
var extensionarray = file.split('.');
if (extensionarray.length > 0) {
fileextension = extensionarray[extensionarray.length - 1];
}
self.showorhideoverlay(fileextension, self.$files.find('li'));
};
// 重新上传。
this.onbtnreuploadclick = function (event) {
event.preventdefault();
var $btnselectfile = self.multiuploader.$uploadplaceholder
.find('#file-picker-' + setting.propertyname + ' :file');
if ($btnselectfile.length) {
$btnselectfile.click();
}
};
this.onconfirmweburlclick = function () {
var url = self.$txtweburl.val();
if (!url) {
alert('请填写文件地址。');
return;
} else if (checkisxss(url)) {
alert('地址内容不允许含有潜在危险的代码，请重新输入。');
return;
}
self.$weburl.modal('hide');
self.showthumbnailplaceholder();
if (weburlregex.test(url)) {
self.savefilemsg(url);
} else {
if (!/^\/.*$/.test(url)) {
url = '/' + url;
}
var val = url;
if ((new regexp("^" + self.setting.uploadpath + ".*$")).test(url)) {
val = url.replace(self.setting.uploadpath, setting.uploadpathreplacesymbol);
}
self.savefilemsg(val);
}
self.multiuploader.showweburlimg(self.$files, url);
// self.$uploadsuccess.removeclass('hidden');
self.$uploadimgwrap.addclass('imgwrap-upload-success'); // 上传成功，由图标表示，改为通过图片透明度表示
//外链图片上传后，因为存在跨域问题而不允许剪裁 。需要隐藏剪裁图标
$("#btncropper").hide();
var fileextension = '';
var extensionarray = url.split('.');
if (extensionarray.length > 0) {
fileextension = extensionarray[extensionarray.length - 1];
}
self.showorhideoverlay(fileextension, self.$files.find('li'));
};
// 删除。
this.onbtndelete = function (event) {
event.preventdefault();
// 删除文件。如果是修改，原来的文件是不在webuploader的queue里的，所以先判断一下。
if (coreuploader.getfile(self.$thumbnail.attr('id'))) {
coreuploader.removefile(self.$thumbnail.attr('id'));
}
//清空word导入隐藏的内容
if (self.$wordcontent) {
self.$wordcontent.html("");
}
// 删除记录的文件信息。
self.resetfilemsg();
self.showinitplaceholder();
self.$txtweburl.val("");
};
/*
* 当有文件加入队列
*/
this.onfilequeued = function (file) {
self.multiuploader.showthumbnail(self.$files,
coreuploader,
file,
self.multiuploader.thumbnailwidth,
self.multiuploader.thumbnailheight);
self.showthumbnailplaceholder();
self.$btnupldateurl.hide();
self.showorhideoverlay(file.ext, self.$files.find('li'));
};
// 文件上传过程中创建进度条实时显示。
this.onuploadprogress = function (file, percentage) {
var $percenttext = self.$progress.children('.text'),
$percentimg = self.$progress.children('.percentage'),
percentagenum = parseint(percentage * 100);
if (powerchunkconfig.maximumprogress > 0 && percentagenum > powerchunkconfig.maximumprogress) {
return;
}
$percenttext.html(percentagenum + '%');
$percentimg.css('width', percentagenum + '%');
if (self.$progress.hasclass('hidden')) {
self.$progress.removeclass('hidden');
}
};
this.onuploadsuccess = function (file, response) {
if (response.iserror) {
alert(response.errormsg);
self.onbtndelete(new event('', {}));
return;
}
if (!self.multiuploader.$files.length) {
return;
}
self.uploadsuccesscallback(file, response); // 上传成功的回调函数。
};
this.radioschange = function (src) {
self.$radios.off('change');
self.$radios.on("change",
function (e) {
var $this = $(this),
options = {};
//#12621 修改多个radio选中项错乱的问题。
self.$radios.each(function (index, element) {
var $this = $(element);
if ($this.prop("checked")) {
options[$this.attr("name")] = $this.val() === "true" ? true : false;
}
});
self.$cropperimage.attr('src', '');
self.$cropperimage.cropper("destroy");
self.newcropper(src, options);
});
};
this.newcropper = function (ret, options) {
options = $.extend({},
{
multiple: true,
preview: '.img-preview',
done: function (data) {
self.$datax.val(data.x);
self.$datay.val(data.y);
self.$dataheight.val(data.height);
self.$datawidth.val(data.width);
}
},
options);
self.$cropperimage.attr('src', ret);
self.$cropperimage.cropper(options);
};
this.onerror = function (type, tip) {
switch (type) {
case 'f_duplicate':
alert('您选择的文件已存在，请选择其他文件。');
break;
case 'f_exceed_size':
alert('单个文件过大。');
break;
case 'q_exceed_size_limit':
alert('超过总的上传大小。');
break;
default:
alert(tip);
break;
}
};
this.onuplaoderror = function (file, reason) {
var $li = $('#' + file.id),
$error = $li.find('div.error');
// 避免重复创建
if (!$error.length) {
$error = $('').appendto($li);
}
$error.text('上传失败');
};
this.onuploadcomplete = function (file) {
//// 上传后可能还需要进行其他处理，所以这里不直接处理。 self.$progress.addclass('hidden');
};
if (this.constructor === singleupload) {
this.initialize();
// 当文件被加入队列之前触发，此事件的handler返回值为false，则此文件不会被添加进入队列。
coreuploader.on('beforefilequeued',
function (file) {
// 清空队列。实际上是把队列中的文件的状态置为"status.cancelled"。
var $existsfiles = $(coreuploader.getfiles());
if ($existsfiles.length >= 1) {
$existsfiles.each(function (index, existsfile) {
coreuploader.removefile(existsfile);
});
}
});
this.$cropper.find('#btncropperok')
.on('click',
function () {
var files = coreuploader.getfiles();
var data = self.$cropperimage.cropper("getdataurl", 'image/jpeg'),
id = getrandomid(),
contenttype = 'image/jpeg',
filename;
if (files.length == 0) {
var arr = self.multiuploader.$filemsg.val().split('/');
filename = arr[arr.length - 1];
} else {
filename = files[files.length - 1].name;
}
$.ajax(setting.cropperuploadurl,
{
data: {
uploadproviderkey: setting.uploadproviderkey,
filename: filename,
contenttype: contenttype,
file: data,
__requestverificationtoken: pe.security.csrf.getrequestverificationtokenvalue()
},
type: 'post',
success: function (result) {
if (result.iserror) {
return;
}
self.uploadsuccesscallback(
{
id: id,
size: '',
name: result.filename
},
{
errormsg: null,
filename: filename,
iserror: false,
relativepath: result.relativepath,
_row: "{\"filename\":\"" +
result.filename +
"\",\"relativepath\":\"" +
result.relativepath +
"\",\"errormsg\":null,\"iserror\":null}"
});
self.$thumbnail.attr('src', data);
},
error: function (xhr) {
}
});
self.$cropper.modal('hide');
});
this.$cropper.on("shown.bs.modal",
function () {
var src = self.multiuploader.$filemsg.val(),
files;
if (src && !!src.replace(/\s/g, '')) {
src = src.replacepathsymbolforshow(self.setting.uploadpathreplacesymbol, self.setting.uploadpath);
self.newcropper(src);
self.radioschange(src);
} else {
files = coreuploader.getfiles();
coreuploader.makethumb(files[files.length - 1],
function (error, ret) {
self.newcropper(ret);
self.radioschange(ret);
},
1,
1);
}
})
.on("hidden.bs.modal",
function () {
self.$cropper.find('#lockaspectratio').prop('checked', false);
self.$cropperimage.attr('src', '');
self.$cropperimage.cropper("destroy");
});
if (this.$btnreupload.length > 0) {
coreuploader.addbutton({
id: this.$btnreupload[0]
});
var $div = this.$btnreupload.find("div.webuploader-pick"),
self = this;
this.$btnreupload.append($div.children());
$div.remove();
settimeout(function () {
self.$btnreupload.find('div').width('100%').height('100%').css('left', 6).css('top', 0);
},
10);
}
}
$uploadelement.data("curuploadobject", coreuploader);
}
$.extend(singleupload.prototype,
{
createnewuploader: function ($uploadelement, setting) {
return new poweruploader($uploadelement, setting);
},
destroy: function () {
this.multiuploader.uploader.destroy();
},
initialize: function () {
var coreuploader = this.multiuploader.uploader;
coreuploader.on('filequeued', this.onfilequeued);
coreuploader.on('uploadprogress', this.onuploadprogress);
var meuploader = this;
coreuploader.on('uploadsuccess', function (file, response) {
var meoptions = this.options;
powerchunkconfig.sendmergefiles(file, meoptions, function (newfile, newresponse) {
if (newresponse) {
response = newresponse;
}
powerchunkconfig.uploadprogresscomplete(file, meuploader);
meuploader.onuploadsuccess(file, response);
});
});
coreuploader.on('error', this.onerror);
coreuploader.on('uploaderror', this.onuplaoderror);
coreuploader.on('uploadcomplete', this.onuploadcomplete);
coreuploader.on('uploadbeforesend', function (block, data) {
powerchunkconfig.onuploadbeforesend(block, data, this.options);
});
//this.$btnreupload.on('click', this.onbtnreuploadclick);
this.$btndelete.on('click', this.onbtndelete);
this.$btnconfirmweburl.on('click', this.onconfirmweburlclick);
if (this.onbtnmodify) {
this.$btnmodify.on('click', this.onbtnmodify);
this.$btndone.on('click', this.onbtndone);
this.$btncancel.on('click', this.onbtncancel);
}
},
/*
* 获取显示文件信息的li元素
* @file object file对象实例
*/
getli: function (id) {
var $li = this.multiuploader.$files.find('li').has('#fileinfo[fileid=' + id + ']');
return $li;
},
/*
* @method uploadsuccesscallback。
* @description 上传成功的回调函数。
* @param file:文件。javascript的file对象。
* @param response:服务器返回的json对象。
*/
uploadsuccesscallback: function (file, response) {
this.savefilemsg(response.relativepath);
//2015-8-26 为解决图片上传后不带水印问题（临时方法）
if (response.relativepath) {
this.$thumbnail.attr('src',
response.relativepath.replacepathsymbolforshow(this.setting.uploadpathreplacesymbol, this.setting.uploadpath));
}
this.$progress.addclass('hidden'); // 删除进度条
// this.multiuploader.$files.find('div.upload-success').removeclass('hidden'); // 单文件加“钩”样式。
this.multiuploader.$files.find('.imgwrap').addclass('imgwrap-upload-success'); // 上传成功，由图标表示，改为通过图片透明度表示
this.$btnupldateurl.show();
//单图上传后 可以剪裁图片，显示剪裁图标
$("#btncropper").show();
},
/*
* @method savefilemsg。
* @description 保存上传文件信息。
* @param uploadpath 上传路径。
*/
savefilemsg: function (uploadpath) {
this.multiuploader.savefilemsg(uploadpath);
},
/*
* @method resetfilemsg。
* @description 重置上传文件信息。
*/
resetfilemsg: function () {
this.multiuploader.resetfilemsg(); // 保存上传成功的文件信息（到隐藏控件）
},
/* @method showinitplaceholder。
* @description 显示初始界面。
*/
showinitplaceholder: function () {
this.multiuploader.$uploadplaceholder.removeattr('style'); // 显示“选择文件”界面。
this.multiuploader.$files.addclass('hidden'); // 显示“文件列表”界面。
},
/* @method showthumbnailplaceholder。
* @description 显示缩略图界面。
*/
showthumbnailplaceholder: function () {
var self = this;
//this.$btnupldateurl.hide();
settimeout(function () {
self.multiuploader.$files.removeclass('hidden'); // 显示“文件列表”界面。
// self.multiuploader.$uploadplaceholder.addclass('hidden'); // 隐藏“选择文件”界面。
self.multiuploader.$uploadplaceholder.css('position', 'absolute').css('top', -15000);
},
10);
}
});
/*
* 单文件
*/
function singlefileupload($uploadelement, setting) {
singleupload.call(this, $uploadelement, setting);
var self = this,
coreuploader = this.multiuploader.uploader;
setting.uploadpathregexp = new regexp("^" + self.setting.uploadpath + ".*$", "i");
this.$btnredown = this.$operations.find('#btnredown'); // 按钮保存到本地。
this.$filename = this.$files.find('#filename');
this.$filesize = this.$files.find('#filesize');
this.$wordcontent = $uploadelement.find("#wordcontent"); //word导入隐藏的内容。
this.$pdfcontent = $uploadelement.find("#pdfcontent");
this.$audiocontent = $uploadelement.find("#audiocontent");
this.$btnredown.hide();
this.onconfirmweburlclick = function () {
var url = self.$txtweburl.val();
if (!url) {
alert('请填写文件地址。');
return;
} else if (checkisxss(url)) {
alert('地址内容不允许含有潜在危险的代码，请重新输入。');
return;
}
self.$weburl.modal('hide');
self.showthumbnailplaceholder();
if (weburlregex.test(url)) {
self.$btnredown.attr('href', url);
self.savefilemsg(url);
} else {
//todo：未清楚该部分代码之前是处理了那些情况问题；暂屏蔽该部分代码，解决外链视频地址保存时多了/问题，例如rtmp://live.hkstv.hk.lxdns.com/live/hks
//if (!/^\/.*$/.test(url)) {
// url = '/' + url;
//}
var val = url;
if (self.setting.uploadpathregexp.test(url)) {
val = url.replace(new regexp(self.setting.uploadpath, "i"), setting.uploadpathreplacesymbol);
url = url.replace(new regexp(self.setting.uploadpath, "i"), self.setting.downpath);
}
self.savefilemsg(val);
self.$btnredown.attr('href', self.setting.downurl + '?fileurl=' + encodeuricomponent(url));
}
var paths = url.split('/');
self.$btnredown.show();
self.$filename.text(paths[paths.length - 1]);
updateurl();
self.multiuploader.showweburlimg(self.$files, url);
// self.$uploadsuccess.removeclass('hidden');
self.$uploadimgwrap.addclass('imgwrap-upload-success'); // 上传成功，由图标表示，改为通过图片透明度表示
var fileextension = '';
var extensionarray = url.split('.');
if (extensionarray.length > 0) {
fileextension = extensionarray[extensionarray.length - 1];
}
self.showorhideoverlay(fileextension, self.$files.find('li'));
};
function updateurl() {
//前台上传不提供修改地址的按钮
//if (!self.$btnconfirmnewurl[0].binder) {
// self.$btnconfirmnewurl.click(function (event) {
// var url = self.$imageurl.val();
// if (!url) {
// alert(self.setting.lable + "地址不能为空");
// return;
// }
// function updatesuccess(fileurl, srcurl) {
// self.$updateurl.modal('hide');
// self.multiuploader.$filemsg.val(fileurl);
// self.$thumbnail.attr('src', srcurl);
// }
// if (weburlregex.test(url)) {
// updatesuccess(url, url);
// self.$btnredown.attr('href', url);
// } else {
// if (!/^\/.*$/.test(url)) {
// url = '/' + url;
// }
// var val = url;
// if (self.setting.uploadpathregexp.test(url)) {
// val = url.replace(new regexp(self.setting
// .uploadpath,
// "i"),
// setting.uploadpathreplacesymbol);
// url = url.replace(new regexp(self.setting.uploadpath, "i"), self.setting.downpath);
// }
// updatesuccess(val, url);
// self.$btnredown.attr('href', self.setting.downurl + '?fileurl=' + encodeuricomponent(url));
// }
// var urlpath = url.split('/');
// self.$filename.text(urlpath[urlpath.length - 1]);
// self.$filename.attr('class', 'name ' + getfilecss(urlpath[urlpath.length - 1].split('.')[1]));
// });
// self.$btnconfirmnewurl[0].binder = true;
//}
}
this.initedit = function (file) {
self.multiuploader.showweburlimg(self.$files, file)
.attr('fileid', file.fileid);
// self.$uploadsuccess.removeclass('hidden');
self.$uploadimgwrap.addclass('imgwrap-upload-success'); // 上传成功，由图标表示，改为通过图片透明度表示
updateurl();
self.$btnredown.show();
var urlpath = file.split('/');
self.$filename.text(urlpath[urlpath.length - 1]);
if ((new regexp("^" + self.setting.uploadpath + ".*$", "i")).test(file)) {
file = file.replace(new regexp(self.setting.uploadpath, "i"), self.setting.downpath);
}
this.$btnredown.attr('href', this.setting.downurl + '?fileurl=' + encodeuricomponent(file));
var fileextension = '';
var extensionarray = file.split('.');
if (extensionarray.length > 0) {
fileextension = extensionarray[extensionarray.length - 1];
}
self.showorhideoverlay(fileextension, self.$files.find('li'));
};
this.onuploadsuccess = function (file, response) {
if (response.iserror) {
alert(response.errormsg);
self.onbtndelete(new event('', {}));
return;
}
if (!self.multiuploader.$files.length) {
return;
}
updateurl();
self.uploadsuccesscallback(file, response); // 上传成功的回调函数。
};
/*
* 当有文件加入队列
*/
this.onfilequeued = function (file) {
self.$filename.text(file.name);
//self.$filename.addclass(getfilecss(file.name.split('.')[1] || "file"));
self.showthumbnailplaceholder();
self.$btnupldateurl.hide();
self.showorhideoverlay(file.ext, self.$files.find('li'));
};
if (this.constructor === singlefileupload) {
this.initialize();
// 当文件被加入队列之前触发，此事件的handler返回值为false，则此文件不会被添加进入队列。
coreuploader.on('beforefilequeued',
function (file) {
// 清空队列。实际上是把队列中的文件的状态置为"status.cancelled"。
var $existsfiles = $(coreuploader.getfiles());
if ($existsfiles.length >= 1) {
$existsfiles.each(function (index, existsfile) {
coreuploader.removefile(existsfile);
});
}
});
if (this.$btnreupload.length > 0) {
coreuploader.addbutton({
id: this.$btnreupload[0]
});
var $div = this.$btnreupload.find("div.webuploader-pick"),
self = this;
this.$btnreupload.append($div.children());
$div.remove();
settimeout(function () {
self.$btnreupload.find('div').width('100%').height('100%').css('left', 6).css('top', 0);
},
10);
}
}
$uploadelement.data("curuploadobject", coreuploader);
}
inherit(singleupload, singlefileupload);
$.extend(singlefileupload.prototype,
{
/*
* @method uploadsuccesscallback。
* @description 上传成功的回调函数。
* @param file:文件。javascript的file对象。
* @param response:服务器返回的json对象。
*/
uploadsuccesscallback: function (file, response) {
singlefileupload.uper.uploadsuccesscallback.call(this, file, response);
this.$btnredown.show();
this.$btnredown
.attr('href', this.setting.downurl + '?fileurl=' + encodeuricomponent(response.relativepath));
var imgwrapsrc = '';
if (response.relativepath && response.relativepath != '') {
imgwrapsrc = response.relativepath.replace(this.setting.uploadpathreplacesymbol, this.setting.uploadpath);
}
var photoentity = setimgwarpsrc(this.$files.find('.imgwrap > img'), imgwrapsrc);
this.$filename.text(response.filename);
if (response.errormessage) {
alert(response.errormessage);
return;
}
this.$wordcontent.html(response.result);
this.$pdfcontent.html(response.result);
this.$audiocontent.html(response.result);
},
/* @method showthumbnailplaceholder。
* @description 显示缩略图界面。
*/
showthumbnailplaceholder: function () {
singlefileupload.uper.showthumbnailplaceholder.call(this);
}
});
/*
* 多图片上传控件。
*/
function multipleimageupload($uploadelement, setting) {
if (!(this instanceof multipleimageupload)) {
return;
}
singleupload.call(this, $uploadelement, setting);
this.$uploadelement = $uploadelement;
var self = this,
coreuploader = this.multiuploader.uploader;
this.setting = setting;
// 文件项。
this.$defaultfileitem = this.$uploadelement.find('#defaultfileitem');
this.$btnedit = this.$defaultfileitem.find('#btnedit'); // 按钮（编辑）。
this.$btnreupload = this.$defaultfileitem.find('#btnreupload'); // 按钮（重新上传）。
// this.$btnweburl = this.$defaultfileitem.find('#btnweburl'); // 按钮（添加外链）。
this.$fileinfo = this.$defaultfileitem.find('#fileinfo'); // 记录文件信息。
this.$btndelete = this.$defaultfileitem.find('#btndelete'); // 按钮（删除）。 undone 只是在队列里删除，没有删除服务器上的文件。
this.$btnmodify = this.$defaultfileitem.find('#btnmodify'); // 按钮（修改）。
this.$btndone = this.$defaultfileitem.find('#btndone'); // 按钮（完成）。
this.$btncancel = this.$defaultfileitem.find('#btncancel'); // 按钮（取消）。
// 状态栏。
this.$statusbar = this.$uploadelement.find('#statusbar'); // 状态栏。
this.$btncontinueupload = this.$statusbar.find('#btncontinueupload'); // 继续添加按钮。
this.$btnbeginupload = this.$statusbar.find('#btnbeginupload'); // 开始上传按钮。
if (setting.isautoupload.tolowercase() === 'true') {
this.$btnbeginupload.hide();
}
if (lessie9) {
this.$btnreupload.addclass('hidden');
}
// 编辑层
this.$edit = this.$uploadelement.find('#edit-' + setting.propertyname); // 编辑层。
this.$txtimagetitle = this.$uploadelement.find('#txtimagetitle'); // 图片名字。
this.$txtintro = this.$uploadelement.find('#txtintro'); // 图片简介。
this.$btnconfirmedit = this.$edit.find('#btnconfirmedit'); // “编辑窗口”的确认按钮。
this.$imageurl = this.$edit.find('#txturl');
// 外链层
this.$weburl = this.$uploadelement.find('#weburl-' + setting.propertyname); // 添加外链弹出层。
this.$txtweburl = this.$weburl.find('#txtweburl'); // 外链文本框。
this.$btnconfirmweburl = this.$weburl.find('#btnconfirmweburl'); // “外链窗口”的确认按钮。
this.queue = new queue(); // 文件队列
this.tempqueue = new queue(); // 临时文件队列（当文件加入上传队列时插入）
this.curfileindex = -1; // 当前操作文件。
this.clearfileindex = function () {
self.curfileindex = -1;
};
this.cropperid = -1;
this.$cropperthumbnail = null;
this.cropperphotourl = null;
function cropper() {
var filename;
self.$cropper.find('#btncropperok')
.on('click',
function (event) {
var data = self.$cropperimage.cropper("getdataurl", 'image/jpeg'),
id = getrandomid(),
contenttype = 'image/jpeg';
$.ajax(setting.cropperuploadurl,
{
data: {
uploadproviderkey: setting.uploadproviderkey,
filename: filename,
contenttype: contenttype,
file: data,
__requestverificationtoken: pe.security.csrf.getrequestverificationtokenvalue()
},
type: 'post',
success: function (result) {
if (result.iserror) {
return;
}
self.$cropperthumbnail.parents('li').find('#fileinfo').attr('fileid', id);
self.uploadsuccesscallback(
{
id: id,
size: '',
name: result.filename
},
{
errormsg: null,
filename: filename,
iserror: false,
relativepath: result.relativepath,
_row: "{\"filename\":\"" +
result.filename +
"\",\"relativepath\":\"" +
result.relativepath +
"\",\"errormsg\":null,\"iserror\":null}"
});
self.$cropperthumbnail.attr('src', data);
self.savefilemsgbyhtml();
},
error: function (xhr) {
}
});
self.$cropper.modal('hide');
});
self.$cropper.on("shown.bs.modal",
function (event) {
var $input = self.multiuploader.$files.find('input[fileid=' + self.cropperid + ']'),
src = $input.attr('filepath'),
str,
file = coreuploader.getfile(self.cropperid);
if (!src && !file) {
src = $input.parent().find('p.imgwrap img').attr('src');
}
if (src && !!src.replace(/\s/g, '')) {
src = src.replacepathsymbolforshow(self.setting.uploadpathreplacesymbol, self.setting.uploadpath);
str = src.split('/');
filename = str[str.length - 1];
self.newcropper(src);
self.radioschange(src);
} else {
if (window.filereader) {
var filereader = new filereader();
filereader.readasdataurl(file.source.source);
filereader.onload = function () {
filename = file.name;
self.newcropper(this.result);
self.radioschange(this.result);
};
} else {
coreuploader.makethumb(file,
function (error, ret) {
filename = file.name;
self.newcropper(ret);
self.radioschange(ret);
},
1,
1);
}
}
})
.on("hidden.bs.modal",
function () {
self.$cropper.find('#lockaspectratio').prop('checked', false);
self.$cropperimage.attr('src', '');
self.$cropperimage.cropper("destroy");
});
}
this.onuploadsuccess = function (file, response) {
if (response.iserror) {
var $fileitem = this.getli(file.id);
if ($fileitem) {
$fileitem.find('div.upload-error').text(response.errormsg).removeclass('hidden');
self.deletefile(file.id);
self.updatefilemsg();
self.resetcurfileindex();
}
return;
}
if (!self.multiuploader.$files.length) {
return;
}
self.uploadsuccesscallback(file, response); // 上传成功的回调函数。
};
this.deletebyfileid = function (fileid) {
// 删除webuploader的queue中的文件。
var $fileinfo = self.multiuploader.$files.find('input[fileid="' + fileid + '"]');
if ($fileinfo) {
var $bedeleteli = $fileinfo.parents('li');
if ($fileinfo.attr('index') <= -1) {
return;
}
self.deletefile(fileid);
$bedeleteli.remove(); // 删除html节点。
self.updatefilemsg();
// 如果是最后一个html节点，则显示初始状态。
if (self.multiuploader.$files.children('li').length <= 0) {
self.showinitplaceholder();
}
self.resetcurfileindex();
}
}
self.$btnconfirmedit.click(function (event) {
var url = self.$imageurl.val();
if (!url) {
alert("地址不能为空");
self.$imageurl.focus();
event.stoppropagation();
return;
} else if (checkisxss(url)) {
alert('地址内容不允许含有潜在危险的代码，请重新输入。');
self.$imageurl.focus();
event.stoppropagation();
return;
} else if (self.$weburl.length === 0 && weburlregex.test(url)) {
alert('地址内容禁止输入外部url链接，请重新输入。');
self.$imageurl.focus();
event.stoppropagation();
return;
}
// 不允许含有潜在危险的html代码，危险的html代码将自动清除！
self.$txtintro.val(pe.ui.filterstringxss(self.$txtintro.val()));
self.$txtimagetitle.val(pe.ui.filterstringxss(self.$txtimagetitle.val()));
function updatesuccess(fileurl, srcurl) {
self.$updateurl.modal('hide');
if (self.ismultiplevideo) {
self.$imageurl.file.videourl = fileurl;
} else {
self.$imageurl.file.photourl = fileurl;
}
self.$imageurl.file.filename = fileurl.substr(fileurl.lastindexof('/') + 1);
setimgwarpsrc(self.$imageurl.$newfileitem.find('p.imgwrap img'), srcurl);
}
if (weburlregex.test(url)) {
updatesuccess(url, url);
} else {
//todo：未清楚该部分代码之前是处理了那些情况问题；暂屏蔽该部分代码，解决外链视频地址保存时多了/问题，例如rtmp://live.hkstv.hk.lxdns.com/live/hks
//if (!/^\/.*$/.test(url)) {
// url = '/' + url;
//}
var val = url;
if ((new regexp("^" + self.setting.uploadpath + ".*$", "i")).test(url)) {
val = url.replace(new regexp(self.setting.uploadpath, "i"), setting.uploadpathreplacesymbol);
}
updatesuccess(val, url);
}
var $img,
$fileinfo,
$existsfileitem = self.multiuploader.$files.find('li')
.has('#fileinfo[index=' + self.curfileindex + ']'); // 根据curfileindex找到已存在的文件项。
if (!$existsfileitem) {
alert('错误');
return;
}
$fileinfo = $existsfileitem.find('#fileinfo');
$fileinfo.attr('phototitle', self.$txtimagetitle.val());
$fileinfo.attr('photointro', self.$txtintro.val());
$existsfileitem.find('#filetitle').val(self.$txtimagetitle.val());
// 更新队列中相应文件。
var queuefile = self.queue.getfile($fileinfo.attr('fileid'));
if (self.ismultiplevideo) {
queuefile.videotitle = self.$txtimagetitle.val();
queuefile.videointro = self.$txtintro.val();
} else {
queuefile.phototitle = self.$txtimagetitle.val();
queuefile.photointro = self.$txtintro.val();
}
// 重置编辑层。
self.$txtimagetitle.val('');
self.$txtintro.val('');
self.updatefilemsg();
self.savefilemsgbyhtml();
self.resetcurfileindex();
});
// 文件上传过程中创建进度条实时显示。
this.onuploadprogress = function (file, percentage) {
var $li = self.getli(file.id),
$progress = $li.find('.progress'),
$percenttext = $progress.children('.text'),
$percentimg = $progress.children('.percentage'),
percentagenum = parseint(percentage * 100);
if (powerchunkconfig.maximumprogress > 0 && percentagenum > powerchunkconfig.maximumprogress) {
return;
}
$percenttext.html(percentagenum + '%');
$percentimg.css('width', percentagenum + '%');
if ($progress.hasclass('hidden')) {
$progress.removeclass('hidden');
}
};
this.initedit = function (files) {
settimeout(function () {
if (!$.isarray(files)) {
files = $.parsejson(files.replace(/\r|\n/g, ''));
}
$.each(files,
function (index, file) {
var $newfileitem = self.$defaultfileitem.clone(true), // 同时克隆事件。
$fileinfo = $newfileitem.find('#fileinfo'),
$newbtnreupload = $newfileitem.find('#btnreupload'),
$filetitle,
fileurl;
if (!file.fileid) {
file.fileid = getrandomid();
}
$newfileitem.attr('id', '');
$fileinfo.attr('index', self.getindex());
$newfileitem.removeclass('hidden');
$newfileitem.find('.progress').addclass('hidden');
$newfileitem.find('#btnedit').show();
$newfileitem.find('#btnaddfeaturedimage').show();
self.multiuploader.$files.append($newfileitem);
$newfileitem.find("#btnmodify").show();
// $newfileitem.find('.upload-success').removeclass('hidden');
$newfileitem.find('.imgwrap').addclass('imgwrap-upload-success');
$filetitle = $newfileitem.find('#filetitle');
if (self.ismultiplevideo) {
$fileinfo.attr('photointro', file.videointro);
$filetitle.val(file.videotitle);
fileurl = file.videourl;
} else {
$fileinfo.attr('photointro', file.photointro);
$filetitle.val(file.phototitle);
fileurl = file.photourl;
}
$filetitle.on('blur',
function () {
var value = pe.ui.filterstringxss($(this).val());
$(this).val(value);
if (self.ismultiplevideo) {
file.videotitle = value;
} else {
file.phototitle = value;
}
self.savefilemsgbyhtml();
});
$newfileitem.find('#btncropper')
.on('mousedown',
function () {
self.cropperid = $fileinfo.attr('fileid');
self.$cropperthumbnail = $newfileitem.find('img');
self.cropperphotourl = file.photourl;
});
// 重新上传
if ($newbtnreupload.length > 0 && $newbtnreupload[0].addeventlistener) {
$newbtnreupload[0].addeventlistener('click',
function () {
self.curfileindex = $(this).parents('li').find('#fileinfo').attr('index');
},
true);
}
var $btnupldateurl = $newfileitem.find('#btnedit');
if ($btnupldateurl.length > 0) {
(function ($btnupldateurl, file, $newfileitem, self) {
var btnupldateurl = $btnupldateurl[0];
btnupldateurl.file = file;
btnupldateurl.$newfileitem = $newfileitem;
$btnupldateurl.click(function (event) {
event.preventdefault();
self.$imageurl.file = btnupldateurl.file;
self.$imageurl.$newfileitem = btnupldateurl.$newfileitem;
var url;
if (self.ismultiplevideo) {
url = self.$imageurl.file.videourl;
} else {
url = self.$imageurl.file.photourl;
}
var url = url.replacepathsymbolforshow(setting.uploadpathreplacesymbol, setting.uploadpath);
self.$imageurl.val(url);
self.$imageurl.oldurl = url;
});
}($btnupldateurl, file, $newfileitem, self));
$btnupldateurl[0].binder = true;
}
var fileextension = '';
var extensionarray = fileurl.split('.');
if (extensionarray.length > 0) {
fileextension = extensionarray[extensionarray.length - 1];
}
self.showorhideoverlay(fileextension, $newfileitem);
self.multiuploader.showweburlimg($newfileitem, file);
$fileinfo.attr('fileid', file.fileid)
.attr('filename', file.filename);
self.queue.append(file);
});
},
10);
self.resetcurfileindex();
};
// 编辑click。
this.$btnedit.on('click',
function () {
var $itemli = $(this).parents('li'),
$fileinfo = $itemli.find('#fileinfo'),
$queueitem = self.queue.getfile($fileinfo.attr('fileid'));
if (self.ismultiplevideo) {
self.$txtimagetitle.val($queueitem.videotitle); // 标题。
self.$txtintro.val($queueitem.videointro); // 描述。
} else {
self.$txtimagetitle.val($queueitem.phototitle); // 标题。
self.$txtintro.val($queueitem.photointro); // 描述。
}
self.curfileindex = $fileinfo.attr('index');
});
this.onbtnreuploadclick = function (event) {
event.preventdefault();
var $btnselectfile = self.multiuploader.$uploadplaceholder
.find('#file-picker-' + setting.propertyname + ' :file');
if ($btnselectfile.length) {
self.curfileindex = $(this).parents('li').find('#fileinfo').attr('index');
$btnselectfile.click();
}
};
// 外链窗口的确认按钮click。
this.onconfirmweburlclick = function () {
var $fileinfo,
$fileitem,
weburl = self.$txtweburl.val(),
fileid = getrandomid(),
name,
val;
if (!weburl) {
alert('请填写外链地址。');
return;
} else if (checkisxss(weburl)) {
alert('地址内容不允许含有潜在危险的代码，请重新输入。');
return;
}
if (weburlregex.test(weburl)) {
val = weburl;
} else {
//todo：未清楚该部分代码之前是处理了那些情况问题；暂屏蔽该部分代码，解决外链视频地址保存时多了/问题，例如rtmp://live.hkstv.hk.lxdns.com/live/hks
//if (!/^\/.*$/.test(weburl)) {
// weburl = '/' + weburl;
//}
val = weburl;
if ((new regexp("^" + self.setting.uploadpath + ".*$", "i")).test(weburl)) {
val = weburl.replace(new regexp(self.setting.uploadpath, "i"), setting.uploadpathreplacesymbol);
}
}
// 上传新文件。
$fileitem = self.$defaultfileitem.clone(true); // 同时克隆事件。
$fileinfo = $fileitem.find('#fileinfo');
$fileinfo.attr('index', fileid);
$fileitem.removeclass('hidden');
self.multiuploader.$files.append($fileitem);
$fileinfo.attr('fileid', fileid); // 由于不能产生fileid，所以用地址作为fileid。
name = weburl.substr(weburl.lastindexof('/') + 1);
// 显示图片。
self.multiuploader.showweburlimg($fileitem, weburl);
var filenamewithoutextension = name.substring(0, name.lastindexof("."))
$fileitem.find('#filetitle').val(filenamewithoutextension);
self.hiddenprogress($fileitem, false);
self.updatefilemsg();
self.resetcurfileindex();
self.$weburl.modal('hide'); // 隐藏编辑框。
self.showthumbnailplaceholder();
self.$txtweburl.val('');
var fileextension = '';
var extensionarray = weburl.split('.');
if (extensionarray.length > 0) {
fileextension = extensionarray[extensionarray.length - 1];
}
self.showorhideoverlay(fileextension, $fileitem);
self.uploadsuccesscallback(
{
id: fileid,
size: '',
name: name
},
{
errormsg: null,
filename: name,
iserror: false,
relativepath: val,
_row: "{\"filename\":\"" +
name +
"\",\"relativepath\":\"" +
val +
"\",\"errormsg\":null,\"iserror\":null}"
});
// 重新上传
var $newbtnreupload = $fileitem.find('#btnreupload');
if ($newbtnreupload.length > 0 && $newbtnreupload[0].addeventlistener) {
$newbtnreupload[0].addeventlistener('click',
function () {
self.curfileindex = $(this).parents('li').find('#fileinfo').attr('index');
},
true);
}
// 图片裁剪（外链图片无法裁剪）
$fileitem.find('#btncropper').addclass('hidden');
};
// 删除按钮click。
this.onbtndelete = function (event) {
event.preventdefault();
// 删除webuploader的queue中的文件。
var $bedeleteli = $(this).parents('li'),
$fileinfo = $bedeleteli.find('#fileinfo');
if ($fileinfo.attr('index') <= -1) {
return;
}
self.deletefile($fileinfo.attr('fileid'));
$bedeleteli.remove(); // 删除html节点。
self.updatefilemsg();
// 如果是最后一个html节点，则显示初始状态。
if (self.multiuploader.$files.children('li').length <= 0) {
self.showinitplaceholder();
}
self.resetcurfileindex();
};
// 修改按钮click。
this.onbtnmodify = function (event) {
event.preventdefault();
var $bemodifyli = $(this).parents('li'),
$fileinfo = $bemodifyli.find('#fileinfo');
if ($fileinfo.attr('index') <= -1) {
return;
}
$(this).hide();
$bemodifyli.find("#btndone").show();
$bemodifyli.find("#btncancel").show();
var $filename = $bemodifyli.find("#filename");
var filename = $filename.text();
var $modifyinput = self.multiuploader.$files.find("#modifyinput");
$.each(self.multiuploader.$files.find("#modifyinput"),
function (index, item) {
$(item).parents('li').find('#btncancel').click();
});
// 重复点击容错。
if ($filename.find("#modifyinput").length <= 0) {
var $filenameinput = "";
$filename.text('').append($filenameinput);
} else {
filename = $filename.find("#modifyinput").val();
}
$filename.find('input').val('').focus().val(filename); // 光标。
};
this.onbtndone = function (event) {
event.preventdefault();
var $bemodifyli = $(this).parents('li'),
$fileinfo = $bemodifyli.find('#fileinfo');
if ($fileinfo.attr('index') <= -1) {
return;
}
var $filename = $bemodifyli.find("#filename");
var filename = $filename.find('input').val();
if (filename == "") {
alert('请输入文件名。');
$filename.find('input').focus();
return;
}
var selffile = self.queue.getfile($fileinfo.attr('fileid'));
selffile.phototitle = filename;
self.updatefilemsg();
$filename.text(filename);
$(this).hide();
$bemodifyli.find("#btnmodify").show();
$bemodifyli.find("#btncancel").attr("data-title", filename).hide();
};
this.onbtncancel = function (event) {
event.preventdefault();
var $bemodifyli = $(this).parents('li'),
$fileinfo = $bemodifyli.find('#fileinfo');
if ($fileinfo.attr('index') <= -1) {
return;
}
var selffile = self.queue.getfile($fileinfo.attr('fileid'));
$bemodifyli.find("#filename").text(selffile.phototitle);
$(this).hide();
$bemodifyli.find("#btnmodify").show();
$bemodifyli.find("#btndone").hide();
};
// 继续添加按钮click
coreuploader.addbutton({
id: this.$btncontinueupload[0]
});
var $div = this.$btncontinueupload.find("div.webuploader-pick");
this.$btncontinueupload.append($div.html());
$div.remove();
settimeout(function () {
self.$btncontinueupload.find('div').width('100%').height('100%').css('top', 0).css('left', 0);
},
10);
if (this.$btncontinueupload[0].addeventlistener) {
this.$btncontinueupload[0].addeventlistener('click',
function () {
self.resetcurfileindex();
},
true);
}
// 开始上传按钮click
this.$btnbeginupload.click(function () {
coreuploader.upload();
});
// 图片预览click。
this.onbtnphotoclick = function (event) {
event.preventdefault();
var $itemli = $(this).parents('li'),
$fileinfo = $itemli.find('#fileinfo'),
$queueitem = self.queue.getfile($fileinfo.attr('fileid'));
if (!$queueitem) {
$queueitem = self.tempqueue.getfile($fileinfo.attr('fileid'));
}
var url;
if (self.ismultiplevideo) {
url = $queueitem.videourl;
} else {
url = $queueitem.photourl;
}
var url = url.replace(self.setting.uploadpathreplacesymbol, self.setting.uploadpath);
self.$photo.attr("src", url);
self.$photomodal.modal('show');
}
// 查看视频click。
this.onbtnvideoclick = function (event) {
event.preventdefault();
var $itemli = $(this).parents('li'),
$fileinfo = $itemli.find('#fileinfo'),
$queueitem = self.queue.getfile($fileinfo.attr('fileid'));
if (!$queueitem) {
$queueitem = self.tempqueue.getfile($fileinfo.attr('fileid'));
}
var url;
if (self.ismultiplevideo) {
url = $queueitem.videourl;
} else {
url = $queueitem.photourl;
}
var url = url.replace(self.setting.uploadpathreplacesymbol, self.setting.uploadpath);
self.$video.find("source").attr("src", url);
var video = self.$video[0];
video.onloadedmetadata = function (evt) {
var v_width = video.videowidth,
v_height = video.videoheight,
w_width = ($(window).width() * 0.8) - 49,
w_height = $(window).height() - 154;
var v_proportion = v_width / v_height;
var w_proportion = w_width / w_height;
// if(v_proportion > w_proportion){
// $("#modalvideo .modal-dialog").width("80%");
// $("#interviewervideo").width("100%");
// }else{
// $("#modalvideo .modal-dialog").width(w_height * v_proportion + 32 - 8);
// $("#interviewervideo").width(w_height * v_proportion - 8);
// }
// 视频强制显示16*9 或9*16
if (v_width > v_height) {
// 横屏
if (w_width / 16 < w_height / 9) {
self.$videomodal.find(".modal-dialog").width(w_width + 32);
self.$video.width(w_width);
self.$video.height(w_width / 16 * 9);
} else {
self.$videomodal.find(".modal-dialog").width((w_height / 9 * 16) + 32);
self.$video.width(w_height / 9 * 16);
self.$video.height(w_height);
}
} else {
// 竖屏
self.$videomodal.find(".modal-dialog").width((w_height / 16 * 9) + 32);
self.$video.width(w_height / 16 * 9);
self.$video.height(w_height);
}
};
// 播放视频。
video.load();
self.$videomodal.modal('show');
video.play();
};
// 当文件被加入队列以后触发。
this.onfilequeued = function (file) {
var $fileinfo, // 文件信息。
$newbtnreupload,
$fileitem, // 文件项。
filenamewithoutextension = file.name.substring(0, file.name.lastindexof("."));
if (self.curfileindex != -1) {
// 重新上传（curfileindex是正在操作的已有文件的下标）。
$fileinfo = self.multiuploader.$files.find('#fileinfo[index=' + self.curfileindex + ']');
$fileitem = $fileinfo.parent();
self.deletefile($fileinfo.attr('fileid'));
if (!$fileitem) {
return;
}
$fileitem.find('div.upload-success').addclass('hidden');
$fileitem.find('.imgwrap').removeclass('imgwrap-upload-success');
} else {
// 上传新文件。
$fileitem = self.$defaultfileitem.clone(true); // 同时克隆事件。
$fileinfo = $fileitem.find('#fileinfo');
$newbtnreupload = $fileitem.find('#btnreupload');
$fileinfo.attr('index', self.getindex());
$fileitem.removeclass('hidden');
self.multiuploader.$files.append($fileitem);
if ($newbtnreupload.length > 0 && $newbtnreupload[0].addeventlistener) {
$newbtnreupload[0].addeventlistener('click',
function () {
self.curfileindex = $(this).parents('li').find('#fileinfo').attr('index');
},
true);
}
}
$fileitem.find('#btncropper')
.on('mousedown',
function () {
self.cropperid = $fileinfo.attr('fileid');
self.$cropperthumbnail = $fileitem.find('img');
self.cropperphotourl = file.photourl;
});
$fileitem.find('#filetitle').val(filenamewithoutextension);
self.showorhideoverlay(file.ext, $fileitem);
// 解决视频文件在队列中无法预览的问题
var uploadresponse = new uploadresponse(file.id, url.createobjecturl(file.source.source), file.name, filenamewithoutextension, '', file.size, self.ismultiplevideo);
self.tempqueue.append(uploadresponse);
self.multiuploader.showthumbnail($fileitem,
coreuploader,
file,
self.multiuploader.thumbnailwidth,
self.multiuploader.thumbnailheight);
$fileinfo.attr('fileid', file.id)
.attr('filename', file.name);
self.showthumbnailplaceholder();
self.resetcurfileindex();
$fileitem.find('#btnedit').hide();
$fileitem.find('#btnaddfeaturedimage').hide();
};
if (this.constructor === multipleimageupload) {
this.initialize();
cropper();
}
if (this.$btnreupload.length > 0) {
coreuploader.addbutton({
id: this.$btnreupload[0]
});
var $div = this.$btnreupload.find("div.webuploader-pick"),
self = this;
this.$btnreupload.append($div.children());
$div.remove();
settimeout(function () {
self.$btnreupload.find('div').width('100%').height('100%').css('left', 6).css('top', 0);
},
10);
}
$uploadelement.data("curuploadobject", coreuploader);
};
inherit(singleupload, multipleimageupload);
$.extend(multipleimageupload.prototype,
{
initialize: function () {
multipleimageupload.uper.initialize.call(this);
this.$edit.find('button.close').on('click', this.clearfileindex);
this.$edit.find('button.pe-cancel').on('click', this.clearfileindex);
this.$weburl.find('button.close').on('click', this.clearfileindex);
this.$weburl.find('button.pe-cancel').on('click', this.clearfileindex);
},
/*
* 删除webuploader控件队列里面的文件
*/
deletefile: function (fileid) {
if (this.multiuploader.uploader.getfile(fileid)) {
this.multiuploader.uploader.removefile(fileid);
}
this.queue.removefile(fileid);
},
/*
* @method uploadsuccesscallback。
* @description 上传成功的回调函数。
* @param file:文件。javascript的file对象。
* @param response:服务器返回的json对象。
*/
uploadsuccesscallback: function (file, response) {
var queuefile = this.savefilemsg(file.id,
response.relativepath,
response.filename,
file.size,
file.name.substring(0, file.name.lastindexof(".")));
var $fileitem = this.getli(file.id);
var $btnupldateurl = $fileitem.find('#btnedit'),
self = this;
self.$btnedit.show();
$fileitem.find('input[fileid=' + file.id + ']').attr('filepath', response.relativepath);
var imgwrapsrc = '';
if (response.relativepath && response.relativepath != '') {
imgwrapsrc = response.relativepath.replacepathsymbolforshow(self.setting.uploadpathreplacesymbol, self.setting.uploadpath);
}
var fileentity = setimgwarpsrc($fileitem.find('.imgwrap > img'), imgwrapsrc);
function $filenamebindevent($file) {
var $filetitle = $file.find('#filetitle');
$filetitle.unbind('blur');
$filetitle.on('blur',
function () {
var value = pe.ui.filterstringxss($(this).val());
$(this).val(value);
if (self.ismultiplevideo) {
self.queue.getfile(file.id).videotitle = value;
} else {
self.queue.getfile(file.id).phototitle = value;
}
self.savefilemsgbyhtml();
});
}
$filenamebindevent($fileitem);
this.hiddenprogress($fileitem, false);
$fileitem.find('#btnaddfeaturedimage').show();
$btnupldateurl.show();
if ($btnupldateurl.length && !$btnupldateurl[0].binder) {
(function ($btnupldateurl, file, $newfileitem, self) {
var btnupldateurl = $btnupldateurl[0];
btnupldateurl.file = file;
btnupldateurl.$newfileitem = $newfileitem;
$btnupldateurl.click(function (event) {
event.preventdefault();
self.$imageurl.file = btnupldateurl.file;
self.$imageurl.$newfileitem = btnupldateurl.$newfileitem;
var url;
if (self.ismultiplevideo) {
url = self.$imageurl.file.videourl;
} else {
url = self.$imageurl.file.photourl;
}
var url = url.replacepathsymbolforshow(self.setting.uploadpathreplacesymbol, self.setting.uploadpath);
self.$imageurl.val(url);
self.$imageurl.oldurl = url;
});
}($btnupldateurl, queuefile, $fileitem, this));
$btnupldateurl[0].binder = true;
}
// 多视频上传 添加封面图片/添加视频待播放时画面 自动化机制
if (self.setting.cropperuploadurl && fileentity.type === 'video') {
settimeout(function () {
var featuredimageexist = $("input[name=featuredimage]").val() != '';
if (!featuredimageexist) {
var videocover = $fileitem.find('.imgwrap > img').attr('src');
if (videocover.indexof("data:image") > -1) {
$.ajax(self.setting.cropperuploadurl,
{
data: {
uploadproviderkey: 'videofeaturedimage',
filename: pe.tools.uuid(16, 4) + '.jpg',
contenttype: 'image/jpeg',
file: videocover,
__requestverificationtoken: pe.security.csrf.getrequestverificationtokenvalue()
},
type: 'post',
success: function (result) {
if (result.iserror || !result.relativepath) {
return;
}
var relativepath = result.relativepath.replace(self.setting.uploadpathreplacesymbol, self.setting.uploadpath);
if (!featuredimageexist) {
addphotocore('featuredimage', relativepath);
}
},
error: function (xhr) {
}
});
}
}
}, 500);
}
function addphotocore(fieldname, imgsrc) {
$("input[name=" + fieldname + "]").val(imgsrc);
$("#thumbnail" + fieldname + "").parent(".imgwrap").addclass("imgwrap-upload-success");
$("#thumbnail" + fieldname + "").attr('src', imgsrc);
var $uploadplaceholder = $("#file-picker-" + fieldname + "").parents('#upload-placeholder');
$uploadplaceholder.css("position", "absolute");
$uploadplaceholder.css("top", "-15000px");
$("#files-" + fieldname + "").removeclass("hidden");
}
},
hiddenprogress: function ($li, iserror) {
$li.find('div.progress').addclass('hidden');
if ($li.parent().hasclass("photolist")) {
if (iserror) {
$li.find('.imgwrap').removeclass('imgwrap-upload-success');
} else {
$li.find('.imgwrap').addclass('imgwrap-upload-success');
}
} else {
if (iserror) {
$li.find('div.upload-error').removeclass('hidden');
} else {
$li.find('div.upload-success').removeclass('hidden');
}
}
},
/* @method savefile。
* @description 保存上传成功的文件信息（到隐藏控件）。
* @param uploadpath:上传路径。
* @param filename:文件名。
*/
savefilemsg: function (fileid, uploadpath, filename, filesize, filetitle) {
var uploadresponse,
title = filetitle || filename;
// 保存上传成功的文件信息（到隐藏控件）
uploadresponse = new uploadresponse(fileid, uploadpath, filename, title, '', filesize, this.ismultiplevideo);
this.queue.append(uploadresponse);
this.updatefilemsg();
return uploadresponse;
},
/* @method savefilemsgbyhtml。
* @description 根据html结构保存上传成功的文件信息（到隐藏控件）。
*/
savefilemsgbyhtml: function () {
if (this.multiuploader.$files.children('li').length <= 0) {
return;
}
var newqueue = new queue(),
self = this;
this.multiuploader.$files.children('li')
.each(function (index, item) {
var $img = $(item).find('#fileinfo');
var newfile = self.queue.getfile($img.attr('fileid'));
if (newfile != undefined) {
newqueue.append(newfile);
}
});
this.queue.clear();
this.queue = newqueue;
this.updatefilemsg();
},
/* @method updatefilemsg。
* @description 更新文件信息。
*/
updatefilemsg: function () {
if (this.queue.getlength() <= 0) {
this.multiuploader.savefilemsg('');
return;
}
var strjsonfile,
ifyquere = [],
j = 0,
temp;
for (; j < this.queue._queue.length; j++) {
temp = $.extend(true, {}, this.queue._queue[j]);
temp['fileid'] = undefined;
ifyquere.push(temp);
}
// 保存上传成功的文件信息（到隐藏控件）
strjsonfile = json.stringify(ifyquere);
this.multiuploader.savefilemsg(strjsonfile);
},
/*
* @method resetcurfileindex。
* @description 重置当前操作的文件的下标。
*/
resetcurfileindex: function () {
this.curfileindex = -1;
},
/* @method showthumbnailplaceholder。
* @description 显示缩略图界面。
*/
showthumbnailplaceholder: function () {
var self = this;
settimeout(function () {
// 隐藏“选择文件”界面。
self.multiuploader.$uploadplaceholder.css('position', 'absolute').css('top', -15000);
// 显示“文件列表”界面。
self.multiuploader.$files.removeclass('hidden');
// 显示状态列表
self.$statusbar.removeclass('hidden');
},
10);
},
/* @method showinitplaceholder。
* @description 显示初始界面。
*/
showinitplaceholder: function () {
// 显示“选择文件”界面。
this.multiuploader.$uploadplaceholder.removeattr('style');
// 隐藏“文件列表”界面。
this.multiuploader.$files.addclass('hidden');
// 隐藏状态列表
this.$statusbar.addclass('hidden');
},
/*
* @method resetfilemsg。
* @description 保存上传文件信息。
* @param uploadpath 上传路径。
*/
resetfilemsg: function () {
// 保存上传成功的文件信息（到隐藏控件）
this.multiuploader.resetfilemsg();
},
/*
* 获取一个文件下标
* @return number 通过闭包每一次都返回不一样的下标
*/
getindex: (function () {
var index = -1;
return function () {
return ++index;
};
}())
});
/*
* 多文件上传
*/
function multiplefileupload($uploadelement, setting) {
if (!(this instanceof multiplefileupload)) {
return;
}
multipleimageupload.call(this, $uploadelement, setting);
var self = this;
// 是否多视频上传
this.ismultiplevideo = this.$uploadelement.attr('data-type') === 'video';
// 文件上传成功，给item添加成功class, 用样式标记上传成功
this.onuploadsuccess = function (file, response) {
if (response.iserror) {
var $fileitem = this.getli(file.id);
if ($fileitem) {
$fileitem.find('div.upload-error').text(response.errormsg).removeclass('hidden');
self.deletefile(file.id);
self.updatefilemsg();
self.resetcurfileindex();
}
return;
}
var $statucs = self.multiuploader.$files.find("#fileinfo[fileid=" + file.id + ']')
.parent()
.find('#uploadstatus');
$statucs.text('');
if (!self.multiuploader.$files.length) {
return;
}
// 上传成功的回调函数。
self.uploadsuccesscallback(file, response);
};
if (this.constructor === multiplefileupload) {
this.initialize();
}
}
inherit(multipleimageupload, multiplefileupload);
$.extend(multiplefileupload.prototype,
{
getfilemsg: function (file) {
return this.multiuploader.$files.find("#fileinfo[fileid=" + file.id + ']').parent().find('#filemsg');
},
createnewuploader: function ($uploadelement, setting) {
return new multiplefilewebupload($uploadelement, setting);
}
});
}());