fanbinit/rhymix
1
0
Fork 0
mirror of https://github.com/Lastorder-DC/rhymix.git synced 2026-01-23 21:29:58 +09:00
Code Issues Projects Releases Packages Wiki Activity

#1331 커버 이미지를 선택할 수 있는 기능 추가

Browse source 
- files 테이블에 cover_image 컬럼 추가
- 썸네일 생성 로직에 cover_image 값을 참조하여 이미지 선택 사용
- 파일 업로드 기능에 UI 추가
This commit is contained in:
bnu 2015-07-07 15:04:06 +09:00
parent cc5207423e
commit 4faa291880
14 changed files with 225 additions and 39 deletions
Download patch file Download diff file Expand all files Collapse all files

38
common/js/plugins/jquery.fileupload/css/style.css
View file

@ -10,8 +10,7 @@
border: 1px solid #d7d8d8;
border-radius: 3px;
}
/* dropzone */
/* dropzone */
.xefu-dropzone {
padding: 12px;
border: 1px solid #fafafa;
@ -70,12 +69,42 @@
height: 60px;
border: 3px solid #DDD;
}
.xefu-list-images input,
.xefu-list-images button {
.xefu-list-images input {
position: absolute;
top: 0;
left: 0;
}
.xefu-act-set-cover:hover {
color: red;
}
.xefu-list-images .xefu-act-set-cover {
display: none;
cursor: pointer;
position: absolute;
top: 0;
left: auto;
right: 0;
margin: 0;
padding: 1px 0 1px 2px;
border-radius: 0 0 0 5px;
font-size: 15px;
line-height: 15px;
background-color: #6cbd7e;
}
.xefu-list-images li:hover .xefu-act-set-cover {
display: inline;
color: #666;
background-color: #ddd;
}
.xefu-list-images .xefu-is-cover-image:hover .xefu-act-set-cover,
.xefu-is-cover-image .xefu-act-set-cover {
display: inline;
color: #fff;
background-color: #6cbd7e;
}
.xefu-is-cover-image {
border-color: #6cbd7e !important;
}
.xefu-list-images .xefu-file-name,
.xefu-list-images .xefu-file-size {
display: none;
@ -87,7 +116,6 @@
.selected {
border-color: #6CBD7E !important;
}
/* END:images */

28
common/js/plugins/jquery.fileupload/js/main.js
View file

@ -20,9 +20,10 @@
actSelectedInsertContent : '.xefu-act-link-selected',
actSelectedDeleteFile : '.xefu-act-delete-selected',
actDeleteFile : '.xefu-act-delete',
actSetCover : '.xefu-act-set-cover',
tmplXeUploaderFileitem : '<li class="xefu-file xe-clearfix" data-file-srl="{{file_srl}}"><span class="xefu-file-name">{{source_filename}}</span><span class="xefu-file-info"><span>{{disp_file_size}}</span><span><input type="checkbox" data-file-srl="{{file_srl}}"> 선택</span></span></li>',
tmplXeUploaderFileitemImage: '<li class="xefu-file xefu-file-image" data-file-srl="{{file_srl}}"><strong class="xefu-file-name">{{source_filename}}</strong><span class="xefu-file-info"><span class="xefu-file-size">{{disp_file_size}}</span><span><img src="{{download_url}}" alt=""></span><span><input type="checkbox" data-file-srl="{{file_srl}}"></span></span></li>'
tmplXeUploaderFileitemImage: '<li class="xefu-file xefu-file-image {{#if cover_image}}xefu-is-cover-image{{/if}}" data-file-srl="{{file_srl}}"><strong class="xefu-file-name">{{source_filename}}</strong><span class="xefu-file-info"><span class="xefu-file-size">{{disp_file_size}}</span><span><img src="{{download_url}}" alt=""></span><span><input type="checkbox" data-file-srl="{{file_srl}}"></span><button class="xefu-act-set-cover" data-file-srl="{{file_srl}}" title="커버이미지로 선택"><i class="xi-check-circle"></i></button></span></li>'
};
var _elements = [
@ -30,6 +31,7 @@
'actSelectedInsertContent',
'actSelectedDeleteFile',
'actDeleteFile',
'actSetCover',
'controll',
'dropZone',
'filelist',
@ -150,7 +152,6 @@
// finderSelect
var fileselect = data.settings.fileList.finderSelect({children:"li", enableDesktopCtrlDefault:true});
console.log(data.settings.fileList);
data.settings.fileList.on("mousedown", 'img', function(e){ e.preventDefault(); });
fileselect.finderSelect('addHook','highlight:after', function(el) {
@ -169,6 +170,11 @@
e.preventDefault();
});
fileselect.on("click", ".xefu-act-set-cover", function(e){
e.preventDefault();
self.setCover($container, e.currentTarget);
});
$(document).bind('dragover', function (e) {
var timeout = window.dropZoneTimeout,
@ -273,7 +279,7 @@
/**
* 파일 목록 갱신
*/
loadFilelist: function($container) {
loadFilelist: function($container) {
var self = this;
var data = $container.data();
var obj = {};
@ -281,6 +287,7 @@
obj.editor_sequence = data.editorSequence;
$.exec_json('file.getFileList', obj, function(res){
console.log(res);
data.uploadTargetSrl = res.upload_target_srl;
editorRelKeys[data.editorSequence].primary.value = res.upload_target_srl;
data.uploadTargetSrl = res.uploadTargetSrl;
@ -330,6 +337,21 @@
data.settings.controll.show()
data.settings.fileList.show();
});
},
setCover: function($container, selected_el) {
var data = $container.data();
var $el = $(selected_el);
var file_srl = $el.data().fileSrl;
exec_json('file.procFileSetCoverImage', {'file_srl': file_srl}, function(res) {
if(res.error != 0) return;
data.settings.filelistImages.find('li').removeClass('xefu-is-cover-image');
var $parentLi = $el.closest('li');
$parentLi.addClass('xefu-is-cover-image');
});
}
});