style24.admin/src/main/webapp/ux/plugins/gaga/gaga.summernote.js

/*
 * Summernote Java Script written by gagamel.
 *
 * Copyright (c) 2010 gagamel
 * Dual licensed under GPL (GPL-LICENSE.txt) licenses.
 *
 * $Date: 2020-10-29 $
 *
 * 사용 예)
 * 		// HTML 태그는 textarea로 구성
 * 		// id는 gagaSn.summernote 함수 호출 시에 넘겨줘야 한다.
 * 		<textarea class="textareaR4" name="clauseContent" id="clauseContent"></textarea>
 *
 * 		// Import할 자바스크립트 파일
 * 		<script type="text/javascript" src="/ux/plugins/summernote/summernote.js?v=2020102902"></script>
 * 		<script type="text/javascript" src="/ux/plugins/gaga/gaga.summernote.js?v=2020102902"></script>
 *
 * 		<script type="text/javascript">
 * 			// Get a summernote options
 * 			var snOptions = gagaSn.getToolbarOptions();
 *
 * 			$(document).ready(function() {
 * 				// Create a summernote
 * 				gagaSn.createSummernote(snOptions, '#clauseContent');
 * 			});
 * 		</script>
 */

var gagaSn = {
	/**
	 * Get a Toolbar options
	 * @param type - 유형(default, media: 사진/동영상 업로드)
	 */
	getToolbarOptions : function(type) {
		if (typeof(type) == 'undefined' || type == 'default') {
			return [
				['style', ['style']],
				//['Font Style', ['fontname']], <!-- 210309 삭제 -->
				['fontsize', ['fontsize']],
				['height', ['height']],
				['style', ['bold', 'italic', 'underline','clear']],
				['font', ['strikethrough', 'superscript', 'subscript']],
				['color', ['color']],
				['para', ['ul', 'ol', 'paragraph']],
				['Insert', ['table']],
				['Insert', ['link']],
				['misc', [ 'print']], //  프린트
				['code', ['fullscreen', 'codeview', 'help']]
			];
		} else if (type == 'media') {
			return [
				['style', ['style']],
				//['Font Style', ['fontname']], <!-- 210309 삭제 -->
				['fontsize', ['fontsize']],
				['height', ['height']],
				['style', ['bold', 'italic', 'underline','clear']],
				['font', ['strikethrough', 'superscript', 'subscript']],
				['color', ['color']],
				['para', ['ul', 'ol', 'paragraph']],
				['Insert', ['table']],
				['Insert', ['link', 'picture', 'video']],
				['misc', [ 'print']], // 프린트
				['code', ['fullscreen', 'codeview', 'help']]
			];
		}
	},

	/**
	 * Create a summernote
	 * @param toolbarOptions - 툴바옵션
	 * @param editorId - 에디터 ID
	 * @param editorHeight - 에디터 height
	 */
	createSummernote : function(toolbarOptions, editorId, editorHeight) {
		if (typeof(editorHeight) == 'undefined') editorHeight = 300;
		
		$(editorId).summernote({
			disableDragAndDrop: true, //drag&drop 사용안함
			placeholder: '내용을 입력하세요',
			height: editorHeight, //에디터 기본 높이
			lang : 'ko-KR', //기본 언어 인코딩
			//fontNames: ['Malgun Gothic', 'HY견고딕', 'Helvetica', 'Verdana', 'Arial', 'Arial Black'], //폰트 스타일  <!-- 210309 삭제 -->
			//fontNamesIgnoreCheck: ['Malgun Gothic'], //기본폰트 스타일  <!-- 210309 삭제 -->
			fontNames: ['Noto Sans kr'], //폰트 스타일  <!-- 210309 수정 -->
			fontNamesIgnoreCheck: ['Noto Sans kr'], //기본폰트 스타일  <!-- 210309 수정 -->
			focus: false, //로드시 에디터창에 포커싱
			fontSizes: ['8','9','10','11','12','13','14','15','16','17','18','19','20','24','30','36'],
			toolbar: toolbarOptions,
			callbacks: {
				onImageUpload: function(files) { // 이미지 업로드
					for (var i = 0; i < files.length; i++) {
						gagaSn.uploadImage(files[i], this);
					}
				},
				onPaste: function(e) {
					var clipboardData = e.originalEvent.clipboardData;
					if (clipboardData && clipboardData.items && clipboardData.items.length) {
						var item = clipboardData.items[0];
						if (item.kind === 'file' && item.type.indexOf('image/') !== -1) {
							e.preventDefault();
						}
					}
				}
			}
		});
	},

	/**
	 * Set value to summernote
	 */
	setContents : function(editorId, content) {
		var content = content.replaceAll("&lt;", "<").replaceAll("&gt;",">").replaceAll("&quot;","\"");

		try {
			$(editorId).summernote('code', content);
		} catch(e) {
			// Do nothing
		}
	},
	
	uploadImage : function(file, editorId) {
		var formData = new FormData();
		formData.append("file", file);
		formData.append("policy", "image");
		
		$.ajax({
			data : formData,
			type : 'POST',
			url : '/common/file/upload?subDir=/editor',
			cache : false,
			contentType : false,
			enctype : 'multipart/form-data',
			processData : false,
			success : function(data) {
				console.log("================== EDITOR FILE UPLOAD ===================");
				console.log(data);
				console.log("================== // EDITOR FILE UPLOAD ===================");
				$(editorId).summernote('insertImage', data.viewUrl + "/editor/" + data.newFileName);
			}
		});
	}
	
}