#1086 코드 정리

This commit is contained in:
bnu 2015-03-16 20:13:36 +09:00
parent aac394b852
commit 89fa04ddbf
3 changed files with 141 additions and 59 deletions

View file

@ -39,7 +39,7 @@
.xe-uploader-filelist-container {
display: none;
padding: 0 10px 10px;
padding: 0 10px;
}
/* images */
@ -51,12 +51,6 @@
padding: 5px 0;
border-bottom: 1px solid #E6E6E6;
}
.xe-uploader-filelist-container .xe-uploader-filelist-images input {
display: none;
}
.xe-uploader-filelist-container .xe-uploader-filelist-images:hover input {
display: block;
}
.xe-uploader-filelist-container .xe-uploader-filelist-images ul,
.xe-uploader-filelist-container .xe-uploader-filelist-images li {
list-style: none;
@ -109,7 +103,7 @@
padding: 0;
}
.xe-uploader-filelist-container .xe-uploader-filelist-files li {
padding: 3px 0;
}
.xe-uploader-filelist-container .xe-uploader-filelist-files li.selected {
background-color: #E9F3EF;
@ -136,3 +130,74 @@
height: 3px;
background-color: #6AB97D;
}
.xe-uploader-btn {
display: inline-block;
*display: inline;
margin: 0;
padding: 0 12px !important;
height: 24px !important;
overflow: visible;
border: 1px solid #bbbbbb;
border-color: #e6e6e6 #e6e6e6 #bfbfbf;
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
border-bottom-color: #a2a2a2;
border-radius: 2px;
text-decoration: none !important;
text-align: center;
text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
vertical-align: top;
line-height: 24px !important;
font-family: inherit;
font-size: 12px;
color: #333333;
*zoom: 1;
cursor: pointer;
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
background-color: #f5f5f5;
*background-color: #e6e6e6;
background-image: -moz-linear-gradient(top, #ffffff, #e6e6e6);
background-image: -webkit-linear-gradient(top, #ffffff, #e6e6e6);
background-image: -webkit-gradient(top, #ffffff, #e6e6e6);
background-image: -o-linear-gradient(top, #ffffff, #e6e6e6);
background-image: linear-gradient(top, #ffffff, #e6e6e6);
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#e6e6e6', GradientType=0);
filter: progid: DXImageTransform.Microsoft.gradient(enabled=false);
}
input.xe-uploader-btn,
button.xe-uploader-btn {
height: 26px !important;
}
.xe-uploader-btn:hover,
.xe-uploader-btn:active,
.xe-uploader-btn[disabled] {
color: #333;
background-color: #e6e6e6;
*background-color: #d9d9d9;
}
.xe-uploader-btn>a,
.xe-uploader-btn>button,
.xe-uploader-btn>input,
.xe-uploader-btn>span {
display: inline-block;
*zoom: 1;
margin: 0 -12px !important;
padding: 0 12px !important;
overflow: visible;
width: auto;
height: 24px;
border: 0;
vertical-align: top;
text-decoration: none !important;
line-height: 24px;
font-family: inherit;
font-size: 12px;
color: #333;
cursor: pointer;
background: none;
}

View file

@ -6,17 +6,41 @@
dataType: 'json',
replaceFileInput: false,
fileListContaner: $('.xe-uploader-filelist-container'),
dropZone: '.xe-uploader-dropzone',
fileListContaner: '.xe-uploader-filelist-container',
controllContainer: '.xe-uploader-controll-container',
fileItem: 'li',
filelist: '.xe-uploader-filelist-files ul',
filelistImages: '.xe-uploader-filelist-images ul',
actSelectedInsertContent : $('.xe-uploader-act-link-selected'),
actSelectedDeleteFile : $('.xe-uploader-act-delete-selected'),
actDeleteFile : $('.xe-uploader-act-delete'),
progressbar: '.xe-uploader-progressbar',
progressbarGraph: '.xe-uploader-progressbar div',
progressStatus: '.xe-uploader-progress-status',
progressPercent: '.xe-uploader-progress-percent',
tmplXeUploaderFileitem : '<li class="xe-uploader-fileitem xe-uploader-fileitem-file clearfix" data-file-srl="{{file_srl}}"><span class="xe-uploader-fileitem-filename">{{source_filename}}</span><span class="xe-uploader-fileitem-info"><span>{{disp_file_size}}</span><span><input type="checkbox" data-file-srl="{{file_srl}}"> 선택</span></span></li>',
actSelectedInsertContent : '.xe-uploader-act-link-selected',
actSelectedDeleteFile : '.xe-uploader-act-delete-selected',
actDeleteFile : '.xe-uploader-act-delete',
tmplXeUploaderFileitem : '<li class="xe-uploader-fileitem xe-uploader-fileitem-file xe-clearfix" data-file-srl="{{file_srl}}"><span class="xe-uploader-fileitem-filename">{{source_filename}}</span><span class="xe-uploader-fileitem-info"><span>{{disp_file_size}}</span><span><input type="checkbox" data-file-srl="{{file_srl}}"> 선택</span></span></li>',
tmplXeUploaderFileitemImage: '<li class="xe-uploader-fileitem xe-uploader-fileitem-image" data-file-srl="{{file_srl}}"><strong class="xe-uploader-fileitem-filename">{{source_filename}}</strong><span class="xe-uploader-fileitem-info"><span class="xe-uploader-fileitem-info-filesize">{{disp_file_size}}</span><span><img src="{{download_url}}" alt=""></span><span><input type="checkbox" data-file-srl="{{file_srl}}"></span></span></li>'
};
var _elements = [
'fileListContaner',
'actSelectedInsertContent',
'actSelectedDeleteFile',
'actDeleteFile',
'controllContainer',
'dropZone',
'filelist',
'filelistImages',
'progressbar',
'progressbarGraph',
'progressPercent',
'progressStatus',
];
var XeUploader = xe.createApp('XeUploader', {
files: {},
selected_files: {},
@ -24,7 +48,6 @@
last_selected_file: null,
editor_sequence: null,
init : function() {
this.file_list_container = $('.xe-uploader-filelist select');
},
createInstance: function(containerEl, opt) {
var self = this;
@ -61,35 +84,34 @@
change: function(e, data) {
},
always: function() {
// console.info('@always');
// console.log(arguments);
},
start: function() {
// console.info('@start');
// console.log(arguments);
$('.xe-uploader-progressbar div').width(0);
$('.xe-uploader-progress-message').show();
$('.xe-uploader-progressbar').show();
self.settings.progressbarGraph.width(0);
self.settings.progressStatus.show();
self.settings.progressbar.show();
},
progressall: function (e, data) {
var progress = parseInt(data.loaded / data.total * 100, 10);
$('.xe-uploader-progressbar div').width(progress+'%');
$('.xe-uploader-progressall').text(progress+'%');
self.settings.progressbarGraph.width(progress+'%');
self.settings.progressPercent.text(progress+'%');
if(progress >= 100) {
$('.xe-uploader-progressbar, .xe-uploader-progress-message').delay(3000).slideUp();
self.settings.progressbar.delay(3000).slideUp();
self.settings.progressStatus.delay(3000).slideUp();
}
}
};
this.settings = $.extend({} , default_settings, settings, opt || {});
$.each(_elements, function(idx, val) {
if(typeof self.settings[val] === 'string') self.settings[val] = $container.find(self.settings[val]);
});
var INS = $container.fileupload(this.settings)
.prop('disabled', !$.support.fileInput)
.parent()
.addClass($.support.fileInput ? undefined : 'disabled');
console.log('fileupload');
console.log(INS);
$container.data('xe-uploader-instance', this);
// 파일 목록 불러오기
@ -119,16 +141,13 @@
self.selected_files = selected;
});
fileselect.on("click", ":checkbox", function(e){
e.preventDefault();
});
e.preventDefault();
});
$(document).bind('dragover', function (e) {
var dropZone = $('.xe-uploader-container .xe-uploader-dropzone'),
timeout = window.dropZoneTimeout;
var timeout = window.dropZoneTimeout;
if (!timeout) {
dropZone.addClass('in');
self.settings.dropZone.addClass('in');
} else {
clearTimeout(timeout);
}
@ -142,13 +161,13 @@
node = node.parentNode;
} while (node != null);
if (found) {
dropZone.addClass('hover');
self.settings.dropZone.addClass('hover');
} else {
dropZone.removeClass('hover');
self.settings.dropZone.removeClass('hover');
}
window.dropZoneTimeout = setTimeout(function () {
window.dropZoneTimeout = null;
dropZone.removeClass('in hover');
self.settings.dropZone.removeClass('in hover');
}, 100);
});
},
@ -184,6 +203,9 @@
_getCkeInstance(this.editor_sequence).insertHtml(temp_code, "unfiltered_html");
},
/**
* 지정된 하나의 파일 또는 다중 선택된 파일 삭제
*/
deleteFile: function(file_srl) {
var self = this;
var file_srls = [];
@ -194,9 +216,8 @@
if(!file) return;
var file_srl = $(file).data().fileSrl;
var fileinfo = self.files[file_srl];
file_srls.push(fileinfo.file_srl);
file_srls.push(file_srl);
});
}
else
@ -209,11 +230,14 @@
exec_json('file.procFileDelete', {'file_srls': file_srls, 'editor_sequence': this.editor_sequence}, function() {
file_srls = file_srls.split(',');
$.each(file_srls, function(idx, srl){
$('.xe-uploader-filelist-container ul').find('li[data-file-srl=' + srl + ']').remove();
self.settings.fileListContaner.find('ul').find('li[data-file-srl=' + srl + ']').remove();
});
self.loadFilelist();
});
},
/**
* 파일 목록 갱신
*/
loadFilelist: function() {
var self = this;
var data = this.$container.data();
@ -221,11 +245,9 @@
$.exec_json('file.getFileList', {'editor_sequence': self.$container.data('editor-sequence')}, function(res){
data.uploadTargetSrl = res.upload_target_srl;
editorRelKeys[self.$container.data('editor-sequence')].primary.value = res.upload_target_srl;
data.uploadTargetSrl = res.uploadTargetSrl;
$('.xe-uploader-filelist select').empty();
$('.file_attach_info').html(res.upload_status);
// @TODO 정리
$('.allowed_filetypes').text(res.allowed_filetypes);
$('.allowed_filesize').text(res.allowed_filesize);
$('.allowed_attach_size').text(res.allowed_attach_size);
@ -239,12 +261,14 @@
var result_image = [];
var result = [];
// 첨부된 파일이 없으면 감춤
if(!res.files.length) {
$('.xe-uploader-controll-container, .xe-uploader-filelist-container').hide();
self.settings.fileListContaner.hide();
self.settings.controllContainer.hide();
return;
}
// 이미지와 그외 파일 분리
$.each(res.files, function (index, file) {
if(self.files[file.file_srl]) return;
@ -259,10 +283,12 @@
}
});
$('.xe-uploader-filelist-container .xe-uploader-filelist-images ul').append(result_image.join(''));
$('.xe-uploader-filelist-container .xe-uploader-filelist-files ul').append(result.join(''));
// 파일 목록
self.settings.filelistImages.append(result_image.join(''));
self.settings.filelist.append(result.join(''));
$('.xe-uploader-controll-container').show()
// 컨트롤, 리스트 표시
self.settings.controllContainer.show()
self.settings.fileListContaner.show();
});
}