File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
/**
* Convert a single file-input element into a 'multiple' input list
* Usage:
*
* 1. Create a file input element (no name)
* eg. <input type="file" id="first_file_element">
*
* 2. Create a DIV for the output to be written to
* eg. <div id="files_list"></div>
*
* 3. Instantiate a MultiSelector object, passing in the DIV and an (optional) maximum number of files
* eg. var multi_selector = new MultiSelector( document.getElementById( 'files_list' ), 3 );
*
* 4. Add the first element
* eg. multi_selector.addElement( document.getElementById( 'first_file_element' ) );
*
* img_view boolean - 이미지 파일 첨부 미리보기
*/
function MultiSelectorModi( list_target, max , file_label, img_view ){
// Where to write the list
this.list_target = list_target;
// How many elements?
this.count = 0;
// How many elements?
this.id = 0;
this.update_count = 0;
// Is there a maximum?
if( max ){
this.max = max;
} else {
this.max = -1;
};
this.file_label = file_label
this.current_count = 0;
//console.log('update!!!!!!');
/**
* Add a new file input element
*/
_base = this;
this.addElement = function( element ){
//console.log('update_count>'+this.update_count);
//console.log('max>'+this.max);
//console.log('count>'+this.count);
// Make sure it's a file input element
if( element.tagName == 'INPUT' && element.type == 'file' ){
//console.log('check step addElement start');
// Element name -- what number am I?
element.name = 'file_' + this.id;
element.id = 'egovfile_' + this.id;
element.class = "";
//미리보기 안할경우 에러방지
if(!( undefined == this.file_label || ""==this.file_label)){
//document.getElementById(this.file_label).setAttribute("for","egovfile_"+this.id);
}
//console.log('file_label>'+element.name);
this.id++;
// Add reference to this object
element.multi_selector = this;
// What to do when a file is selected
element.onchange = function(){
var sErrMsg = "첨부파일 갯수는 ["+_base.max+"]이상 첨부할 수 없습니다!";
if( _base.update_count > 0 ){
if( _base.count > (_base.max-_base.update_count) ){
//element.value = "";
//alert(sErrMsg); return;
return;
}
}
// img view 미리보기 기능
if (img_view) {
var pathname = element.value;
var ext = pathname.split('.').pop().toLowerCase();
if( ".gif.jpg.bmp.jpeg.png".indexOf(ext) != -1 ){
this.multi_selector.imgViewChange( this );
} else {
element.value = "";
alert("이미지 형식의 확장자만 업로드 가능합니다!"); return;
}
}
if( _base.max > 0 && _base.count > _base.max ){
//element.value = "";
//alert(sErrMsg); return;
return;
}
// New file input
var new_element = document.createElement( 'input' );
new_element.type = 'file';
// Add new element
this.parentNode.insertBefore( new_element, this );
// Apply 'update' to element
this.multi_selector.addElement( new_element );
// Update list
this.multi_selector.addListRowNew( this );
// Hide this: we can't use display:none because Safari doesn't like it
this.style.position = 'absolute';
this.style.left = '-1000px';
this.style.top = '-1000px';
this.style.display = 'none';
this.style.visibility = 'hidden';
this.style.width = '0';
this.style.height = '0';
this.style.overflow = 'hidden';
new_element.onkeypress = function(){
return false;
};
};
// If we've reached maximum number, disable input element
if( this.max != -1 && this.count >= this.max ){
//element.disabled = true;
};
// File element counter
this.count++;
// Most recent element
this.current_element = element;
} else {
// This can only be applied to file input elements!
alert( 'Error: not a file input element' );
};
};
/* 이미지 변환 function */
this.addImgViewChange = function( element ){
element.multi_selector = this;
element.onchange = function(){
var sErrMsg = "첨부파일 갯수는 ["+_base.max+"]이상 첨부할 수 없습니다!";
if( _base.update_count > 0 ){
if( _base.count > (_base.max-_base.update_count) ){
//element.value = "";
//alert(sErrMsg); return;
return;
}
}
// img view 미리보기 기능
if (img_view) {
var pathname = element.value;
var ext = pathname.split('.').pop().toLowerCase();
if( ".gif.jpg.bmp.jpeg.png".indexOf(ext) != -1 ){
this.multi_selector.imgViewChange( this );
} else {
element.value = "";
alert("이미지 형식의 확장자만 업로드 가능합니다!"); return;
}
}
if( _base.max > 0 && _base.count > _base.max ){
//element.value = "";
//alert(sErrMsg); return;
return;
}
// Hide this: we can't use display:none because Safari doesn't like it
/*this.style.position = 'absolute';
this.style.left = '-1000px';
this.style.top = '-1000px';
this.style.display = 'none';
this.style.visibility = 'hidden';
this.style.width = '0';
this.style.height = '0';
this.style.overflow = 'hidden';*/
};
};
/**
* Add a new row to the list of files
*/
this.addListRowNew = function( element ){
// Row div
var new_row = document.createElement( 'div' );
new_row.className = "file_add";
// Delete button
var new_row_button = document.createElement( 'img' );
new_row_button.src = '../../../images/egovframework/com/cmm/btn/btn_del.png';
new_row_button.className = "cursor";
new_row_button.style.margin = "0 0 0 0";
new_row_button.style.padding = "0 0 0 0";
//new_row_button.style.top = '3px';
// References
new_row.element = element;
// Delete function
new_row_button.onclick= function(){
// Remove element from form
this.parentNode.element.parentNode.removeChild( this.parentNode.element );
// Remove this row from the list
this.parentNode.parentNode.removeChild( this.parentNode );
// Decrement counter
this.parentNode.element.multi_selector.count--;
// Re-enable input element (if it's disabled)
this.parentNode.element.multi_selector.current_element.disabled = false;
// img view
if (img_view) document.getElementById("img_view").style.display = "none";
// which nixes your already queued uploads
return false;
};
// Set row value
//new_row.innerHTML = element.value;
new_row.innerHTML = "<input type='text' class='input2' readonly='readonly' style='width:50%; ' value='"+element.value+" ' style='padding:0 0 0 0;margin:0 0 0 0;'>";
// Add button
new_row.appendChild( new_row_button );
// Add it to the list
this.list_target.appendChild( new_row );
};
/**
* Add a new row to the list of files
*/
this.addListRow = function( element ){
// Row div
var new_row = document.createElement( 'div' );
// Delete button
var new_row_button = document.createElement( 'input' );
new_row_button.type = 'button';
new_row_button.value = 'Delete';
// References
new_row.element = element;
// Delete function
new_row_button.onclick= function(){
// Remove element from form
this.parentNode.element.parentNode.removeChild( this.parentNode.element );
// Remove this row from the list
this.parentNode.parentNode.removeChild( this.parentNode );
// Decrement counter
this.parentNode.element.multi_selector.count--;
// Re-enable input element (if it's disabled)
this.parentNode.element.multi_selector.current_element.disabled = false;
// img view
if (img_view) document.getElementById("DIV_IMG_VIEW").style.display = "none";
// which nixes your already queued uploads
return false;
};
// Set row value
new_row.innerHTML = element.value;
// Add button
new_row.appendChild( new_row_button );
// Add it to the list
this.list_target.appendChild( new_row );
};
/**
* img file view change
*/
this.imgViewChange = function( element ){
if(document.getElementById("egovComFileList").style.display=="none"){
document.getElementById("egovComFileList").style.display = "block";
}
document.getElementById("img_view").style.display = "";
//파일선택 후 파일 미리보기
if ( window.FileReader ) {
/* 크롬, 사파리, 파이어폭스, 오페라, IE 10 이상에서는 HTML5 FileReader 이용 */
var reader = new FileReader();
reader.onload = function (e) {
//$('#'+preImg).attr('src', e.target.result);
document.getElementById("img_view").src = e.target.result;
};
reader.readAsDataURL(element.files[0]);
//return input.files[0].name; // 파일명 return
} else {
/* IE 8, 9에서 가능하나 권장하지 않음 */
var img = document.getElementById("img_view");
img.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"
+ element.value + "', sizingMethod='scale')"; //이미지 로딩, sizingMethod는 div에 맞춰서 사이즈를 자동조절 하는 역할
/* IE 8, 9에서 불가능 */
//document.getElementById("IMG_VIEW").src = element.value;
img.width = 66;
img.height = 52;
img.alt = "";
}
};
};
function MultiSelector( list_target, max , file_label, img_view, maxSize, img_bbs, elementName, isPdf ){
// Where to write the list
this.list_target = list_target;
// How many elements?
this.count = 0;
// How many elements?
this.id = 0;
this.update_count = 0;
// Is there a maximum?
if( max ){
this.max = max;
} else {
this.max = -1;
};
// max 파일사이즈. mb
if( maxSize ){
this.maxSize = maxSize;
this.maxSizeByte = maxSize * 1024 * 1024;
} else {
this.maxSize = -1;
};
this.file_label = file_label
this.current_count = 0;
//console.log('update!!!!!!');
/**
* Add a new file input element
*/
var _base = this;
this.addElement = function( element ){
//console.log('update_count>'+this.update_count);
//console.log('max>'+this.max);
//console.log('count>'+this.count);
// Make sure it's a file input element
if( element.tagName == 'INPUT' && element.type == 'file' ){
//console.log('check step addElement start');
// Element name -- what number am I?
element.name = 'file_' + this.id;
element.id = 'egovfile_' + this.id;
element.class = "";
// 첨부파일 항목 여러개시 file name/id 처리. (ex 대관관리)
if (elementName) {
element.name = elementName + '_' + this.id;
element.id = elementName + '_' + this.id;
}
//미리보기 안할경우 에러방지
if(!( undefined == this.file_label || ""==this.file_label)){
document.getElementById(this.file_label).setAttribute("for","egovfile_"+this.id);
}
//console.log('file_label>'+element.name);
this.id++;
// Add reference to this object
element.multi_selector = this;
// What to do when a file is selected
element.onchange = function(){
// img view 미리보기, imgBbs 이미지 게시판
if (img_view || img_bbs) {
var pathname = element.value;
var ext = pathname.split('.').pop().toLowerCase();
if( ".gif.jpg.bmp.jpeg.png".indexOf(ext) != -1 ){
} else {
element.value = "";
alert("이미지 형식의 확장자만 업로드 가능합니다!");
return;
}
} else{
var pathname = element.value;
var ext = pathname.split('.').pop().toLowerCase();
if( ".ppt.pptx.doc.docx.xls.pdf.ai.psd.hwp.txt.bmp.gif.jpg.jpeg.png.raw.wav.wma.mp3.mp4.mkv.avi.flv.mov.zip.alz.egg.rar".indexOf(ext) != -1 ){
}else{
element.value = "";
alert("지금 확장자는 업로드 불가능합니다!");
return;
}
}
if (isPdf) {
var pathname = element.value;
var ext = pathname.split('.').pop().toLowerCase();
if( ".pdf".indexOf(ext) != -1 ){
} else {
element.value = "";
alert("PDF 형식의 확장자만 업로드 가능합니다!");
return;
}
}
if (this.files
&& multi_selector.maxSize != -1
&& this.files[0].size > multi_selector.maxSizeByte) {
alert( '파일사이즈가 초과되었습니다. 최대크기 ' + maxSize + 'mb' );
this.value = '';
return;
}
var sErrMsg = "첨부파일 갯수는 ["+_base.max+"]이상 첨부할 수 없습니다!";
if( _base.update_count > 0 ){
if( _base.count > (_base.max-_base.update_count) ){
element.value = "";
alert(sErrMsg);
return;
}
}
if( _base.max > 0 && _base.count > _base.max ){
element.value = "";
alert(sErrMsg);
return;
}
// New file input
var new_element = document.createElement( 'input' );
new_element.type = 'file';
// Add new element
this.parentNode.insertBefore( new_element, this );
// Apply 'update' to element
this.multi_selector.addElement( new_element );
// Update list
this.multi_selector.addListRowNew( this );
// Hide this: we can't use display:none because Safari doesn't like it
this.style.position = 'absolute';
this.style.left = '-1000px';
this.style.top = '-1000px';
this.style.display = 'none';
this.style.visibility = 'hidden';
this.style.width = '0';
this.style.height = '0';
this.style.overflow = 'hidden';
new_element.onkeypress = function(){
return false;
};
};
// If we've reached maximum number, disable input element
if( this.max != -1 && this.count >= this.max ){
//element.disabled = true;
};
// File element counter
this.count++;
// Most recent element
this.current_element = element;
} else {
// This can only be applied to file input elements!
alert( 'Error: not a file input element' );
};
};
/**
* Add a new row to the list of files
*/
this.addListRowNew = function( element ){
// Row div
var new_row = document.createElement( 'div' );
new_row.className = "file_add";
// Delete button
var new_row_button = document.createElement( 'img' );
new_row_button.src = '../../../images/egovframework/com/cmm/btn/btn_del.png';
new_row_button.className = "cursor";
new_row_button.style.margin = "0 0 0 0";
new_row_button.style.padding = "0 0 0 0";
//new_row_button.style.top = '3px';
// References
new_row.element = element;
// 이미지 미리보기
if (img_view) {
var imgViewDiv = document.getElementById("DIV_IMG_VIEW");
var newImgDiv = document.createElement( 'div' );
newImgDiv.innerHTML = '<img src="" name="IMG_VIEW" id="IMG_VIEW" class="imgView" align="middle" alt="미리보기" title="미리보기">';
imgViewDiv.appendChild( newImgDiv );
new_row.viewElement = newImgDiv;
this.imgViewChange(element, newImgDiv);
}
// Delete function
new_row_button.onclick= function(){
// 미리보기 삭제
if (img_view) {
this.parentNode.viewElement.parentNode.removeChild( this.parentNode.viewElement );
}
// Remove element from form
this.parentNode.element.parentNode.removeChild( this.parentNode.element );
// Remove this row from the list
this.parentNode.parentNode.removeChild( this.parentNode );
// Decrement counter
this.parentNode.element.multi_selector.count--;
// Re-enable input element (if it's disabled)
this.parentNode.element.multi_selector.current_element.disabled = false;
// which nixes your already queued uploads
return false;
};
// Set row value
//new_row.innerHTML = element.value;
new_row.innerHTML = "<input type='text' class='input2' readonly='readonly' style='width:50%; ' value='"+element.value+" ' style='padding:0 0 0 0;margin:0 0 0 0;'>";
// Add button
new_row.appendChild( new_row_button );
// Add it to the list
this.list_target.appendChild( new_row );
};
/**
* img file view change
*/
this.imgViewChange = function( element, div ){
//파일선택 후 파일 미리보기
if ( window.FileReader ) {
/* 크롬, 사파리, 파이어폭스, 오페라, IE 10 이상에서는 HTML5 FileReader 이용 */
var reader = new FileReader();
reader.onload = function (e) {
//$('#'+preImg).attr('src', e.target.result);
div.firstChild.src = e.target.result;
};
reader.readAsDataURL(element.files[0]);
//return input.files[0].name; // 파일명 return
} else {
/* IE 8, 9에서 가능하나 권장하지 않음 */
var img = document.getElementById("IMG_VIEW");
img.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"
+ element.value + "', sizingMethod='scale')"; //이미지 로딩, sizingMethod는 div에 맞춰서 사이즈를 자동조절 하는 역할
/* IE 8, 9에서 불가능 */
//document.getElementById("IMG_VIEW").src = element.value;
img.width = 66;
img.height = 52;
img.alt = "";
}
};
};