jQuery.fn.bindAll = function(options) {
var $this = this;
jQuery.each(options, function(key, val){
$this.bind(key, val);
});
return this;
}
jQuery(function ($) {
'use strict';
var ed_nonce = '';
if( !!opener && !!opener.window && !!opener.window.nhn ){
ed_nonce = opener.window.nhn.husky.SE2M_Configuration.SE2M_Accessibility.ed_nonce;
}
// Change this to the location of your server-side upload handler:
var gnu = {
url : './php/?_nonce='+ed_nonce,
container_el : 'body',
dreg_area : '#drag_area',
dreg_area_list : '#drag_area > ul',
progress_bar : '#progress .progress-bar',
filter : /^(image\/bmp|image\/gif|image\/jpg|image\/jpeg|image\/png)$/i,
files : [],
file_limit : 10, //한번에 올릴수 파일갯수 제한
imgw : 100,
imgh : 70,
file_api_support : !!(window.ProgressEvent && window.FileReader),
$elTextGuide : $("#guide_text"),
init : function(){
$(this.dreg_area_list).sortable({
'cursor':'pointer',
'placeholder':'placeholder'
});
$(this.dreg_area_list).disableSelection();
if( this.file_api_support ) this.$elTextGuide.removeClass("hidebg").addClass("showbg");
},
file_push : function(file){
var othis = this,
last = othis.files.length;
othis.files.push(file);
},
_readymodebg : function(){
if( this.file_api_support ) {
var sClass = this.$elTextGuide.attr('class');
if(sClass.indexOf('hidebg') > 0){
this.$elTextGuide.removeClass('hidebg');
this.$elTextGuide.addClass('showbg');
}
}
},
_startmodebg : function(){
if( this.file_api_support ) {
var sClass = this.$elTextGuide.attr('class');
if(sClass.indexOf('hidebg') < 0){
this.$elTextGuide.removeClass('showbg');
this.$elTextGuide.addClass('hidebg');
}
}
},
_delete : function(e){
e.preventDefault();
var othis = gnu,
$button = $(e.currentTarget),
delete_url = $button.attr("data-delete");
if( delete_url ){
$.ajax({
url: othis.url+"&del=1&file="+ delete_url
}).done(function (result) {
});
}
$button.parents('li.sort_list').fadeOut(300, function(){
$(this).remove();
var $dreg_area = $(othis.dreg_area_list);
$dreg_area.sortable('refresh');
if( !$dreg_area.children('li').length ) othis._readymodebg();
});
},
_add : function(e, data, preload){
var othis = this;
othis._startmodebg();
data.context = $('
').addClass("sort_list").appendTo(this.dreg_area_list);
$.each(data.files, function (index, file) {
if ( !preload && !othis.filter.test(file.type)) {
data.context.remove();
alert('이미지만 허용합니다.');
return true;
}
var node = $('')
.append($('').text(file.name))
.append($('').addClass("delete_img").attr({"data-delete":file.name,"data-url":file.url}).html("
")),
$img = "
",
size_text = '';
if ( preload && preload != 'swfupload' ){
var ret = othis.get_ratio( file.width, file.height ),
size_text = file.width+" x "+file.height;
$img = "
";
}
if (!index) {
node
.prepend('
')
.prepend($img);
if(size_text){
node.append('
')
.append($('').text(size_text))
}
}
node.appendTo(data.context);
node.find(".delete_img").on("click", othis._delete);
});
$(othis.dreg_area_list).sortable('refresh');
},
get_file_all : function(){
var othis = this,
oDate = new Date();
$.ajax({
// Uncomment the following to send cross-domain cookies:
//xhrFields: {withCredentials: true},
//url: $('#fileupload').fileupload('option', 'url'),
url: this.url+"&t="+ oDate.getTime(),
dataType: 'json',
context: $('#fileupload')[0]
}).always(function () {
//$(this).removeClass('fileupload-processing');
}).done(function (result) {
$.each(result.files, function (index, data) {
var tmp = { files : [] };
tmp.files[0] = data;
othis._add( $.Event('add'), tmp, 'preload' );
});
});
},
_processalways : function(e, data){
var index = data.index,
file = data.files[index],
node = $(data.context.children()[index]);
if (file.error) {
node
.append('
')
.append($('').text(file.error));
}
if (index + 1 === data.files.length) {
data.context.find('button')
.text('Upload')
.prop('disabled', !!data.files.error);
}
},
obj_to_arr : function(obj){
var array = $.map(obj, function(value, index) {
return [value];
});
return array;
},
_done : function(e, data){
var othis = this;
$.each(data.result.files, function (index, file) {
if (file.url && !file.error) {
var ret = othis.get_ratio( file.width, file.height ),
node = $(data.context.children()[index]),
size_text = file.width+" x "+file.height,
//$img = "
",
link = $('')
.attr('target', '_blank')
.prop('href', file.url);
node
//.wrap(link)
.append('
')
.append($('').text(size_text))
.find("img.pre_thumb").attr({"src":file.url,"width":ret['width'],"height":ret['height']})
.end().find(".delete_img").attr({"data-delete":file.name,"data-url":file.url});
} else if (file.error) {
var error = $('').text(file.error);
$(data.context.children()[index])
.append('
')
.append(error);
}
othis.file_push(file);
});
},
get_ratio : function(width, height){
var ratio = 0,
ret_img = [];
if( !width || !height ){
ret_img['width'] = this.imgw;
ret_img['height'] = this.imgh;
return ret_img;
}
if(width > this.imgw){
ratio = this.imgw / width;
height = height * ratio;
width = this.imgw;
}
if( height > this.imgh ){
ratio = this.imgh / height;
width = width * ratio;
height = this.imgh;
}
ret_img['width'] = parseInt(width);
ret_img['height'] = parseInt(height);
return ret_img;
},
setPhotoToEditor : function(oFileInfo){
if (!!opener && !!opener.nhn && !!opener.nhn.husky && !!opener.nhn.husky.PopUpManager) {
//스마트 에디터 플러그인을 통해서 넣는 방법 (oFileInfo는 Array)
opener.nhn.husky.PopUpManager.setCallback(window, 'SET_PHOTO', [oFileInfo]);
//본문에 바로 tag를 넣는 방법 (oFileInfo는 String으로
)
//opener.nhn.husky.PopUpManager.setCallback(window, 'PASTE_HTML', [oFileInfo]);
}
}
}
$('#fileupload').fileupload({
url: gnu.url,
dataType: 'json',
container_el: gnu.container_el,
dropZone: $(gnu.dreg_area),
autoUpload: true,
sequentialUploads: true,
acceptFileTypes: /(\.|\/)(gif|jpe?g|bmp|png)$/i,
// Enable image resizing, except for Android and Opera,
// which actually support image resizing, but fail to
// send Blob objects via XHR requests:
disableImageResize: true,
limit_filesLength : gnu.file_limit
}).on('fileuploadadd', function (e, data) {
gnu._add(e, data);
}).on('fileuploadprocessalways', function (e, data) {
gnu._processalways(e, data);
}).on('fileuploaddone', function (e, data) {
gnu._done( e, data );
}).on('fileuploadfail', function (e, data) {
$.each(data.files, function (index, file) {
var error = $('').text('File upload failed.');
$(data.context.children()[index])
.append('
')
.append(error);
});
}).prop('disabled', !$.support.fileInput)
.parent().addClass($.support.fileInput ? undefined : 'disabled');
gnu.init();
var listeners = {
data : {},
log : false,
swfuploadLoaded: function(event){
if(this.log) $('.log', this).append('Loaded');
},
fileQueued: function(event, file){
if(this.log) $('.log', this).append('File queued - '+file.name+'');
// start the upload once it is queued
// but only if this queue is not disabled
if (!$('input[name=disabled]:checked', this).length) {
$(this).swfupload('startUpload');
}
},
fileQueueError: function(event, file, errorCode, message){
switch (errorCode)
{
case -100 :
alert("파일을 "+message+"개 이하로 선택해주세요.");
break;
}
if(this.log) $('.log', this).append('File queue error - '+message+'');
},
fileDialogStart: function(event){
if(this.log) $('.log', this).append('File dialog start');
},
fileDialogComplete: function(event, numFilesSelected, numFilesQueued){
if(this.log) $('.log', this).append('File dialog complete');
},
uploadStart: function(event, file){
listeners.data.files = $.makeArray(file);
gnu._add( event, listeners.data, 'swfupload' );
if(this.log) $('.log', this).append('Upload start - '+file.name+'');
},
uploadProgress: function(event, file, bytesLoaded){
if(this.log) $('.log', this).append('Upload progress - '+bytesLoaded+'');
},
uploadSuccess: function(event, file, serverData){
listeners.data.result = jQuery.parseJSON( serverData );
gnu._done( event, listeners.data );
if(this.log) $('.log', this).append('Upload success - '+file.name+'');
},
uploadComplete: function(event, file){
if(this.log) $('.log', this).append('Upload complete - '+file.name+'');
// upload has completed, lets try the next one in the queue
// but only if this queue is not disabled
if (!$('input[name=disabled]:checked', this).length) {
$(this).swfupload('startUpload');
}
},
uploadError: function(event, file, errorCode, message){
if(this.log) $('.log', this).append('Upload error - '+message+'');
}
};
$(gnu.container_el).bindAll(listeners);
/* listeners이벤트 */
$(gnu.dreg_area).bind('drop dragover', function (e) {
e.preventDefault();
if( !gnu.file_api_support && e.type == 'drop' ) alert("브라우저가 드래그 앤 드랍을 지원하지 않습니다.");
});
$("#all_remove_btn").bind("click", function(e){
e.preventDefault();
if( $(gnu.dreg_area_list).children().length ){
if (confirm("추가한 이미지가 있습니다.정말 삭제 하시겠습니까?")){
$(gnu.dreg_area_list).find(".delete_img").each( function(i){
$(this).trigger("click");
});
$(gnu.dreg_area_list).sortable('refresh');
}
}
});
$("#img_upload_submit").bind("click", function(e){
e.preventDefault();
var aResult = [], j = 0;
$(gnu.dreg_area_list).find(".delete_img").each( function(i, f){
if( !$(this).attr("data-url") ) return true;
aResult[j] = [];
aResult[j]['bNewLine'] = 'true';
aResult[j]['sAlign'] = '';
aResult[j]['sFileName'] = $(this).attr("data-delete");
aResult[j]['sFileURL'] = $(this).attr("data-url");
j++;
});
if( aResult.length ){
gnu.setPhotoToEditor(aResult);
aResult = null;
}
window.close();
});
$("#close_w_btn").bind("click", function(e){
e.preventDefault();
window.close();
});
});