if(typeof $.FroalaEditor == 'undefined') $.FroalaEditor = FroalaEditor;
var isReplace,upTYPE;
// $.FroalaEditor.ICON_TEMPLATES = {
// font_awesome: '',
// text: '[NAME]',
// image: ''
// }
$.FroalaEditor.RegisterShortcut(66, 'font-bold', 'weight', 'B', false);
$.FroalaEditor.CODE_ENTER = ['P', 'DIV', 'BR'];
$.FroalaEditor.FAV_FONTS_COUNT = 5;
$.FroalaEditor.FAV_COLORS_COUNT = 7;
$.FroalaEditor.ICON_TEMPLATES['custom'] = '[NAME]';
$.FroalaEditor.DEFAULTS.tableEditButtons = ['tableHeader', 'tableRemove', 'tableRows', 'tableColumns', 'tableStyle', 'tableCells', 'tableCellColor', 'tableCellVerticalAlign', 'tableCellHorizontalAlign', 'tableCellStyle'];
$.FroalaEditor.DEFAULTS.key = 'cJC7bB4B3B2G2F2D2B2zPAENHMi1JPQRFZBTBa1WWEPYDbA2B6C4D4F4C2B2C3G2D2==';
/* 3.x & 4.x : cJC7bB4B3B2G2F2D2B2zPAENHMi1JPQRFZBTBa1WWEPYDbA2B6C4D4F4C2B2C3G2D2== */
/* >= 2.8.0 : cB7B7C6C5C2C2C1C-7J2A4D4A3C6D2B1F4G1I2rD1Ua1Mf1e1VSYKa1EPYD== */
/* < 2.8.0 : cSXSE1LHAFJVCXCLS== */
$.FroalaEditor.ICONS['align-left'] = {'NAME' : '', template: 'custom'};
$.FroalaEditor.ICONS['align-center'] = {'NAME' : '', template: 'custom'};
$.FroalaEditor.ICONS['align-right'] = {'NAME' : '', template: 'custom'};
$.FroalaEditor.ICONS['align-justify'] = {'NAME' : '', template: 'custom'};
$.FroalaEditor.COMMANDS.tableCellHorizontalAlign.options = {'left': 'Align Left', 'center' : 'Align Center', 'right' : 'Align Right', 'justify' : 'Align Justify'};
$.FroalaEditor.COMMANDS.align.options = {'left': 'Align Left','center' : 'Align Center','right' : 'Align Right', 'justify' : 'Align Justify'};
$.FroalaEditor.COMMANDS.videoDisplay.focus = false;
$.FroalaEditor.COMMANDS.imageDisplay.focus = false;
$.FroalaEditor.COMMANDS.imageStyle.focus = false;
$.FroalaEditor.COMMANDS.linkRemove.focus = false;
/*
font weight
100 Thin (Hairline) 매우 가늘게
200 Extra Light (Ultra Light) 더 가늘게
300 Light 가늘게
400 Normal (Regular) 보통
500 Medium 중간
600 Semi Bold (Demi Bold) 중간 굵게
700 Bold 굵게
800 Extra Bold (Ultra Bold) 더 굵게
900 Black (Heavy) 매우 굵게
950 Extra Black (Ultra Black)
*/
/* 에디터 툴바 타이틀 다국어 처리 */
$.FroalaEditor.LANGUAGE['en'] = {
translation: {
'Save' : 'Save',
'Apply' : 'Apply',
'Remove' : 'Remove',
'Align Left': 'Align Left',
'Align Center': 'Align Center',
'Align Right': 'Align Right',
'Align Justify': 'Align Justify',
'Decrease Indent': "Decrease Indent",
'Increase Indent': "Increase Indent",
'None' : 'None',
'Black' : 'Black',
'Extra Bold' : 'Extra Bold',
'Bold' : 'Bold',
'Semi Bold' : 'Semi Bold',
'Medium' : 'Medium',
'Normal' : 'Normal',
'Light' : 'Light',
'Extra Light': 'Extra Light',
'Thin' : 'Thin',
'Cell Border': 'Border',
'Cell Background': 'Background',
'Text Color': 'Text Color',
'Text color': 'Text Color',
'Background Color': 'Background',
'Cell color': 'Color',
'Replace image' : 'Replace image',
'Replace video' : 'Replace video',
'Border Width': 'Line Width',
'Initial' : 'Initialize',
'Transparency' : 'Transparency',
'Rounded' : 'Rounded',
'Bordered' : 'Bordered',
'Shadow' : 'Shadow',
'Line Height' : 'Line Spacing',
'indent/outdent' : 'Indent',
'Link Setting' : 'Link',
/* 버튼 커스텀 */
'Button Radius' : 'Button Radius',
'Button Border Color' : 'Line',
'Button Background Color' : 'Background',
'Text Hover Color' : 'Text Hover Color',
'Button Border Color Hover': 'Hover Color',
'Button Background Color Hover': 'BG Hover Color',
'Insert Button' : 'Insert Button',
'Insert column before' : 'Insert column left',
'Insert column after' : 'Insert column right',
'Button Border Width' : 'Line Width',
'Button LR Padding' : 'Left & Right Padding',
'Button TB Padding' : 'Top & Bottom Padding',
'Button Padding H' : 'Button Padding (Horizontal)',
'Button Padding V' : 'Button Padding (Vertical)',
/* 버튼 커스텀 */
/* 테이블 */
'Row' : 'Row',
'Column' : 'Column',
'Select Style' : 'Style',
'Customize' : 'Customize',
'Line style' : 'Line style',
'Line width' : 'Line width',
'Line color' : 'Line color',
'Background color' : 'Background color',
'Table Cancel' : 'Cancel',
'Table Insert' : 'Submit',
'Table Border' : 'Table Border',
/* 테이블 */
/* 구분선 */
'Remove HR' : 'Remove',
'HR Align' : 'Alignment',
/* 구분선 */
'Aspect Ratio': 'Aspect Ratio',
}
}
$.FroalaEditor.LANGUAGE['ko'] =
{
translation: {
// Custom Item
'Font Weight' : '글자 굵기',
'Letter Spacing' : '자간',
'Replace image' : '이미지 교체',
'Replace video' : '동영상 교체',
'indent/outdent' : '들여쓰기 / 내어쓰기',
// Place holder
'Type something': '입력하세요.',
// Missing translations
'Save' : '저장',
'Apply' : '적용',
'More Text': 'More Text',
'Text Color': '텍스트',
'Text color': '글자 컬러',
'Background Color': '배경',
'Background color': '배경컬러',
'Inline Class': 'Inline Class',
'Default': '기본값',
'Decimal': '숫자',
'Lower Alpha': '알파벳 소문자',
'Lower Greek': '그리스어',
'Lower Roman': '로마 소문자',
'Upper Alpha': '알파벳 대문자',
'Upper Roman': '로마 대문자',
'Circle': '원형',
'Disc': '채워진 원형',
'Square': '사각형',
'Triangle': '삼각형',
'Single': 'Single',
'Double': 'Double',
'More Rich': 'More Rich',
'More Misc': 'More Misc',
'Download PDF': 'Download PDF',
// Basic formatting
'Black' : '매우 굵게',
'Extra Bold' : '더 굵게',
'Bold' : '굵게',
'Semi Bold' : '중간 굵게',
'Medium' : '중간',
'Normal' : '보통',
'Light' : '가늘게',
'Extra Light': '더 가늘게',
'Thin': '매우 가늘게',
'Italic': '기울임',
'Underline': '밑줄',
'Strikethrough': '취소선',
// Main buttons
'Insert': '삽입',
'Delete': '삭제',
'Cancel': '취소',
'OK': '확인',
'Back': '뒤로',
'Remove': '제거',
'More': '더 보기',
'Update': '갱신',
'Style': '스타일',
// Font
'Font Family': '글꼴',
'Font Size': '글자 크기',
// Colors
'Colors': '컬러',
'Background': '배경',
'Text': 'Text',
'HEX Color': 'HEX Color',
// Paragraphs
'Paragraph Format': '문단 형식',
'Normal': '보통',
'Code': "Code",
'Heading 1': '글머리 1',
'Heading 2': '글머리 2',
'Heading 3': '글머리 3',
'Heading 4': '글머리 4',
'Line Height': '행 높이',
// Style
'Paragraph Style': '문단 모양',
'Inline Style': 'Inline Style',
// Alignment
'Align': '정렬',
'Align Left': '왼쪽',
'Align Center': '가운데',
'Align Right': '오른쪽',
'Align Justify': '양쪽',
'None': '없음',
// Lists
'Ordered List': '글머리 기호',
'Unordered List': '비순차 목록',
// Indent
'Decrease Indent': "내어쓰기",
'Increase Indent': "들여쓰기",
// Links
'Insert Link': '링크 삽입',
'Open in new tab': '새 창으로 열기',
'Open Link': '링크 열기',
'Edit Link': '링크 수정',
'Unlink': '링크 삭제',
'Choose Link': '링크 선택',
// Images
'Replace Image': '이미지 교체',
'Insert Image': '이미지 삽입',
'Upload Image': '이미지 첨부',
'By URL': 'URL 삽입',
'Browse': '찾아보기',
'Drop image': 'Drop image',
'or click': 'or click',
'Manage Images': 'Manage Images',
'Loading': 'Loading',
'Deleting': 'Deleting',
'Tags': 'Tags',
'Are you sure? Image will be deleted.': 'Are you sure? Image will be deleted.',
'Replace': '교체',
'Uploading': 'Uploading',
'Loading image': 'Loading image',
'Display': '배치',
'Inline': '어울림',
'Break Text': '자리 차지',
'Alternative Text': 'Alternative Text',
'Change Size': "크기 변경",
'Width': '가로',
'Height': '세로',
'Something went wrong. Please try again.': '잘못된 값이 있습니다. 다시 시도해 주세요.',
'Image Caption': '이미지 캡션',
'Advanced Edit': 'Advanced Edit',
'Aspect Ratio': '가로 세로 비율 고정',
// Video
'Insert Video': '동영상 삽입',
'Embedded Code': "임베디드 코드",
'Paste in a video URL': 'URL로 동영상 붙여넣기',
'Drop video': 'Drop video',
'Your browser does not support HTML5 video.': 'Your browser does not support HTML5 video.',
'Upload Video': 'Upload Video',
// Tables
'Insert Table': '표 삽입',
'Table Header': '표 머리글',
'Remove Table': '표 삭제',
'Table Style': '표 모양',
'Horizontal Align': '수평 정렬',
'Row': '행',
'Insert row above': '위에 행 삽입',
'Insert row below': '아래에 행 삽입',
'Delete row': '행 삭제',
'Column': '열',
'Insert column before': '왼쪽에 열 삽입',
'Insert column after': '오른쪽에 열 삽입',
'Delete column': '열 삭제',
'Cell': '셀',
'Merge cells': '셀 병합',
'Horizontal split': '수평 분할',
'Vertical split': '수직 분할',
'Cell Border': '선',
'Cell Background': '배경',
'Border Width': '선 굵기',
'Vertical Align': '세로 정렬',
'Top': '위',
'Middle': '가운데',
'Bottom': '아래',
'Align Top': '위 정렬',
'Align Middle': '가운데 정렬',
'Align Bottom': '아래 정렬',
'Cell Style': '셀 모양',
'Border Style' : '선 모양',
'Solid' : '실선',
'Dashed' : '짧은 선',
'Dotted' : '점선',
'Double' : '이중선',
// Files
'Upload File': 'Upload File',
'Drop file': 'Drop file',
// Emoticons
'Emoticons': 'Emoticons',
'Grinning face': 'Grinning face',
'Grinning face with smiling eyes': 'Grinning face with smiling eyes',
'Face with tears of joy': 'Face with tears of joy',
'Smiling face with open mouth': 'Smiling face with open mouth',
'Smiling face with open mouth and smiling eyes': 'Smiling face with open mouth and smiling eyes',
'Smiling face with open mouth and cold sweat': 'Smiling face with open mouth and cold sweat',
'Smiling face with open mouth and tightly-closed eyes': 'Cara sonriente con la boca abierta y los ojos fuertemente cerrados',
'Smiling face with halo': 'Cara sonriente con halo',
'Smiling face with horns': 'Cara sonriente con cuernos',
'Winking face': "Gui\xF1o de la cara",
'Smiling face with smiling eyes': 'Cara sonriente con ojos sonrientes',
'Face savoring delicious food': 'Cara de saborear una deliciosa comida',
'Relieved face': 'Cara Aliviado',
'Smiling face with heart-shaped eyes': "Cara sonriente con los ojos en forma de coraz\xF3n",
'Smiling face with sunglasses': 'Cara sonriente con gafas de sol',
'Smirking face': 'Sonriendo cara',
'Neutral face': 'Cara neutral',
'Expressionless face': 'Rostro inexpresivo',
'Unamused face': 'Cara aburrida',
'Face with cold sweat': "Cara con sudor fr\xEDo",
'Pensive face': 'Rostro pensativo',
'Confused face': 'Cara confusa',
'Confounded face': 'Cara aturdida',
'Kissing face': 'Cara besando',
'Face throwing a kiss': 'Cara lanzando un beso',
'Kissing face with smiling eyes': 'Cara besando con ojos sonrientes',
'Kissing face with closed eyes': 'Cara besando con los ojos cerrados',
'Face with stuck out tongue': 'Cara con la lengua pegada',
'Face with stuck out tongue and winking eye': 'Cara con la lengua pegada y el ojo parpadeante',
'Face with stuck out tongue and tightly-closed eyes': 'Cara con la lengua pegada y los ojos fuertemente cerrados',
'Disappointed face': 'Cara de decepcionado',
'Worried face': "Cara de preocupaci\xF3n",
'Angry face': 'Cara enojada',
'Pouting face': 'Que pone mala cara',
'Crying face': 'Cara llorando',
'Persevering face': 'Cara de perseverancia',
'Face with look of triumph': "Cara con expresi\xF3n de triunfo",
'Disappointed but relieved face': 'Decepcionado pero el rostro aliviado',
'Frowning face with open mouth': "Cara con la boca abierta con el ce\xF1o fruncido",
'Anguished face': 'Rostro angustiado',
'Fearful face': 'Cara temerosa',
'Weary face': 'Rostro cansado',
'Sleepy face': 'Rostro somnoliento',
'Tired face': 'Rostro cansado',
'Grimacing face': 'Cara haciendo una mueca',
'Loudly crying face': 'Cara llorando en voz alta',
'Face with open mouth': 'Cara con la boca abierta',
'Hushed face': 'Cara callada',
'Face with open mouth and cold sweat': 'Cara con la boca abierta y el sudor frío',
'Face screaming in fear': 'Cara gritando de miedo',
'Astonished face': 'Cara asombrosa',
'Flushed face': 'Cara enrojecida',
'Sleeping face': 'Rostro dormido',
'Dizzy face': 'Cara mareada',
'Face without mouth': 'Face without mouth',
'Face with medical mask': 'Face with medical mask',
// Line breaker
'Break': '줄바꿈',
// Math
'Subscript': 'Subscript',
'Superscript': 'Superscript',
// Full screen
'Fullscreen': 'Pantalla completa',
// Horizontal line
'Insert Horizontal Line': '구분선 삽입',
// Clear formatting
'Clear Formatting': '스타일 모두 제거',
// Undo, redo
'Undo': '되돌리기',
'Redo': '다시 실행',
// Select all
'Select All': '전체 선택',
// Code view
'Code View': 'Code View',
// Quote
'Quote': 'Cita',
'Increase': '증가',
'Decrease': '감소',
// Quick Insert
'Quick Insert': '빠른 삽입',
// Spcial Characters
'Special Characters': 'Special Characters',
'Latin': 'Latin',
'Greek': 'Greek',
'Cyrillic': 'Cyrillic',
'Punctuation': 'Punctuation',
'Currency': 'Currency',
'Arrows': 'Arrows',
'Math': 'Math',
'Misc': 'Misc',
// Print.
'Print': 'Print',
// Spell Checker.
'Spell Checker': 'Spell Checker',
// Help
'Help': 'Help',
'Shortcuts': 'Shortcuts',
'Inline Editor': 'Inline Editor',
'Show the editor': 'Show the editor',
'Common actions': 'Common actions',
'Copy': '복사',
'Cut': '잘라내기',
'Paste': 'Paste',
'Basic Formatting': 'Basic Formatting',
'Increase quote level': 'Increase quote level',
'Decrease quote level': 'Decrease quote level',
'Image / Video': 'Image / Video',
'Resize larger': 'Resize larger',
'Resize smaller': 'Resize smaller',
'Table': 'Table',
'Select table cell': 'Select table cell',
'Extend selection one cell': 'Extend selection one cell',
'Extend selection one row': 'Extend selection one row',
'Navigation': 'Navigation',
'Focus popup / toolbar': 'Focus popup / toolbar',
'Return focus to previous position': 'Return focus to previous position',
// Embed.ly
'Embed URL': 'Embed URL',
'Paste in a URL to embed': 'Paste in a URL to embed',
// Word Paste.
'The pasted content is coming from a Microsoft Word document. Do you want to keep the format or clean it up?': 'The pasted content is coming from a Microsoft Word document. Do you want to keep the format or clean it up?',
'Keep': 'Keep',
'Clean': 'Clean',
'Word Paste Detected': 'Word Paste Detected',
'Cell color' : '컬러',
'Enter' : '엔터',
'Link' : '링크',
'Link Setting' : '링크 설정',
'Initial' : '초기화',
'Transparency' : '투명',
'Rounded' : '둥근 모서리',
'Bordered' : '테두리',
'Shadow' : '그림자',
/* 버튼 커스텀 */
'Button Color' : '버튼 컬러',
'Button Align' : '버튼 정렬',
'Button Padding V' : '버튼 여백 (세로)',
'Button Padding H' : '버튼 여백 (가로)',
'Copy Button' : '버튼 복제',
'Remove Button' : '버튼 삭제',
'Button Radius' : '버튼 외곽 곡선',
'Button Border Color' : '선',
'Button Background Color' : '배경',
'Text Hover Color': '롤오버',
'Button Border Color Hover': '롤오버 선',
'Button Background Color Hover': '롤오버 배경',
'Insert Button': '버튼 삽입',
'Button Border Width' : '선 굵기',
'Button LR Padding' : '좌우 여백',
'Button TB Padding' : '상하 여백',
/* 버튼 커스텀 */
/* 테이블 */
'Row' : '행',
'Column' : '열',
'Select Style' : '스타일 선택',
'Customize' : '직접 꾸미기',
'Line style' : '선 스타일',
'Line width' : '선 굵기',
'Line color' : '선 컬러',
'Background color' : '배경컬러',
'Table Cancel' : '취소',
'Table Insert' : '삽입',
'Table Border' : '선',
/* 테이블 */
/* 구분선 */
'Insert HR' : '구분선 삽입',
'Insert File' : '파일첨부',
'Remove HR' : '구분선 제거',
'Margin' : '여백',
'HR Align' : '선 정렬',
'Line Color' : '선 컬러',
/* 구분선 */
}
};
$.FroalaEditor.FONTS_WEIGHTS = {
'KoPub Batang' : [300,400,700],
'Black Han Sans' : [400,700],
'Gmarket Sans' : [400,700],
'Godo' : [400,700],
'Kukdetopokki' : [400,700],
'Nanum Gothic' : [400,700],
'Nanum Gothic Coding' : [400,700],
'Nanum Myeongjo' : [400,700,800],
'Nanum Barun Gothic' : [100,400,700],
'Nanum Pen Script' : [400,700],
'Nanum Barun Pen' : [400,700],
'Nanum Brush Script' : [400,700],
'Nanum Square' : [400,700],
'Nanum Square Round' : [400,700],
'Daraehand' : [400,700],
'Dohyeon' : [400,700],
'Recipekorea' : [400],
'Monsori' : [400],
'Noto Sans KR' : [100,300,400,500,700,900],
'Noto Serif CJK KR' : [400,700],
'BB Tree Gothic' : [400,700],
'BB Tree Namu' : [400,700],
'BB Tree Hand' : [400,700],
'SangSangTitle' : [400,700],
'Seoul Namsan' : [400,700],
'Seoul Hangang' : [400,700],
'Spoqa Han Sans' : [300,400,500,700],
'Suit' : [300,400,700],
'S CoreDream' : [300,400,700,900],
'Yeonsung' : [400,700],
'Oseong and HanEum' : [400,700],
'Iropke Batang' : [400,700],
'Jalnan' : [400],
'Jeju Gothic' : [400,700],
'Jeju Myeongjo' : [400,700],
'Jeju Hallasan' : [400,700],
'Jua' : [400,700],
'Youth' : [400,700],
'Hangyule' : [400,700],
'Hanna' : [400,700],
'Abel' : [400,700],
'Abril Fatface' : [400,700],
'Alegreya' : [400,700],
'Aliquam' : [400,700],
'Arial' : [400,700],
'Cardo' : [400,700],
'Cookie' : [400,700],
'Dancing Script' : [400,700],
'Dosis' : [400,700],
'Droid Sans' : [400,700],
'Droid Serif' : [400,700],
'Fredoka One' : [400,700],
'Georgia' : [400,700],
'Great Vibes' : [400,700],
'Ibarra Real Nova' : [400,700],
'Inter' : [400,500,700],
'Lato' : [400,700],
'League Spartan' : [400,700],
'Libre Baskerville' : [400,700],
'Lora' : [400,700],
'Montserrat' : [300,400,600,800,900],
'Muli' : [400,700],
'Nixie One' : [400,700],
'Noto Sans' : [400,700],
'Open sans' : [400,700],
'Oswald' : [400,700],
'Playball' : [400,700],
'Playfair Display' : [400,700],
'Pretendard' : [300,400,700],
'Poppins' : [400,700],
'PT Sans' : [400,700],
'PT Serif' : [400,700],
'Questrial' : [400,700],
'Quicksand' : [400,700],
'Raleway' : [400,700],
'Roboto' : [400,700],
'Spartan' : [400,700],
'Staatliches' : [400,700],
'Stalemate' : [400,700],
'Times New Roman' : [400,700],
'Trench' : [400,700],
}
/* 에디터 아이콘 재정의 */
$.FroalaEditor.DefineIcon('textColor', {NAME: '', 'template': 'custom'});
// $.FroalaEditor.DefineIcon('backgroundColor', {NAME: '', 'template': 'custom'});
$.FroalaEditor.DefineIcon('bold', {NAME: '', 'template' : 'custom'});
$.FroalaEditor.DefineIcon('font-weight', {NAME: '', template: 'custom'});
$.FroalaEditor.DefineIcon('italic', {NAME: '', 'template' : 'custom'});
$.FroalaEditor.DefineIcon('underline', {NAME: '', 'template': 'custom'});
$.FroalaEditor.DefineIcon('strikeThrough', {NAME: '', 'template': 'custom'});
$.FroalaEditor.DefineIcon('letter-spacing', {NAME: '', template: 'custom'});
$.FroalaEditor.DefineIcon('lineHeight', {NAME: '', 'template': 'custom'});
$.FroalaEditor.DefineIcon('align', {NAME: '', 'template': 'custom'});
$.FroalaEditor.DefineIcon('insertLink', {NAME: '', 'template': 'custom'});
$.FroalaEditor.DefineIcon('inoutdent', {NAME: '', 'template': 'custom'});
$.FroalaEditor.DefineIcon('outdent', {NAME: '', 'template': 'custom'});
$.FroalaEditor.DefineIcon('customFormatUOL', {NAME: '', template:'custom'});
// $.FroalaEditor.DefineIcon('')
$.FroalaEditor.DefineIcon('imageRemove', {NAME: '', template: 'custom'});
$.FroalaEditor.DefineIcon('customInsertMyStorageImageIcon', {NAME: '', template: 'custom'});
$.FroalaEditor.DefineIcon('image-replace', { NAME: '', template: 'custom'});
$.FroalaEditor.DefineIcon('image-align-full', { SRC: 'https://storage.googleapis.com/i.addblock.net/icon/image-align-full.png', ALT: 'Image full width', template: 'image'});
$.FroalaEditor.DefineIcon('image-align-wide', { SRC: 'https://storage.googleapis.com/i.addblock.net/icon/image-align-wide.png', ALT: 'Image wide width', template: 'image'});
$.FroalaEditor.DefineIcon('image-align-original', { SRC: 'https://storage.googleapis.com/i.addblock.net/icon/image-align-original.png', ALT: 'Image wide original', template: 'image'});
$.FroalaEditor.DefineIcon('image-align-left-470', { SRC: 'https://storage.googleapis.com/i.addblock.net/icon/image-align-left-470.png', ALT: 'Image left width 470px', template: 'image'});
$.FroalaEditor.DefineIcon('image-align-right-470', { SRC: 'https://storage.googleapis.com/i.addblock.net/icon/image-align-right-470.png', ALT: 'Image right width 470px', template: 'image'});
// $.FroalaEditor.DefineIcon('image-align-left', {NAME: '', template: 'custom'});
// $.FroalaEditor.DefineIcon('image-align-center', {NAME: '', template: 'custom'});
// $.FroalaEditor.DefineIcon('image-align-right', {NAME: '', template: 'custom'});
$.FroalaEditor.DefineIcon('editor-enter-icon', { NAME: '', template: 'custom'});
$.FroalaEditor.DefineIcon('videoRemove', {NAME: '', template: 'custom'});
$.FroalaEditor.DefineIcon('videoAlign', {NAME: '', template: 'custom'});
$.FroalaEditor.DefineIcon('video-align-left', {NAME: '', template: 'custom'});
$.FroalaEditor.DefineIcon('video-align-center', {NAME: '', template: 'custom'});
$.FroalaEditor.DefineIcon('video-align-right', {NAME: '', template: 'custom'});
$.FroalaEditor.DefineIcon('videoDisplay', {NAME: '', template:'custom'});
$.FroalaEditor.DefineIcon('insertTable', {NAME: '', template: 'custom' });
$.FroalaEditor.DefineIcon('insertHR', {NAME: '', template: 'custom' });
$.FroalaEditor.DefineIcon('tableHeader', {template: 'custom', NAME:'' });
$.FroalaEditor.DefineIcon('tableColumns', {NAME:'', template: 'custom'});
$.FroalaEditor.DefineIcon('tableRows', {NAME:'', template: 'custom'});
$.FroalaEditor.DefineIcon('tableCells', {NAME:'', template: 'custom'});
$.FroalaEditor.DefineIcon('tableCellColor', {NAME: '', template:'custom'});
// $.FroalaEditor.DefineIcon('tableCellBackgroundColor', {NAME:'', template: 'custom'});
$.FroalaEditor.DefineIcon('tableCellHorizontalAlign', {NAME: '', template: 'custom' });
$.FroalaEditor.DefineIcon('tableCellVerticalAlign', {NAME:'', template: 'custom' });
$.FroalaEditor.DefineIcon('tableBorderWidth', {NAME:'', template: 'custom'});
$.FroalaEditor.DefineIcon('tableBorderStyle', {NAME:'', template: 'custom'});
$.FroalaEditor.DefineIcon('tableRemove', {NAME: '', template: 'custom'});
$.FroalaEditor.DefineIcon('quickInsertImageIcon', {NAME: '', template: 'custom'});
$.FroalaEditor.DefineIcon('quickInsertMyStorageImageIcon', {NAME: '', template: 'custom'});
$.FroalaEditor.DefineIcon('quickInsertVideoIcon', {NAME: '', template: 'custom'});
$.FroalaEditor.DefineIcon('quickInsertFileIcon', {NAME: '', template: 'custom'});
$.FroalaEditor.DefineIcon('hrAlign', {NAME: '', template: 'custom'})
$.FroalaEditor.DefineIcon('hrMargin', {NAME: '', template: 'custom'});
$.FroalaEditor.DefineIcon('hrRemove', {NAME: '', template: 'custom'});
$.FroalaEditor.DefineIcon('insertCustomButton', {NAME: '', template: 'custom'});
$.FroalaEditor.DefineIcon('copyCustomButton', {NAME: '', template: 'custom'});
$.FroalaEditor.DefineIcon('settingCustomButton', {NAME: '', template: 'custom'});
$.FroalaEditor.DefineIcon('customButtonColor', {NAME : '', template: 'custom'});
// $.FroalaEditor.DefineIcon('customButtonMargin', {NAME: 'margin', template: 'custom'});
$.FroalaEditor.DefineIcon('customButtonPaddingV', {NAME: '', template: 'custom'});
$.FroalaEditor.DefineIcon('customButtonPaddingH', {NAME: '', template: 'custom'});
$.FroalaEditor.DefineIcon('customButtonBorder', {NAME: '', template: 'custom'});
$.FroalaEditor.DefineIcon('customButtonRadius', {NAME: '', template: 'custom'});
$.FroalaEditor.DefineIcon('customButtonLink', {NAME: '', template: 'custom'});
$.FroalaEditor.DefineIcon('customImageLink', {NAME: '', template: 'custom'});
$.FroalaEditor.DefineIcon('imageLink', {NAME: '', template: 'custom'});
$.FroalaEditor.DefineIcon('customButtonAlign', {NAME: '', template: 'custom'});
$.FroalaEditor.DefineIcon('customButtonLoadTemplate', {NAME: '', template: 'custom'});
$.FroalaEditor.DefineIcon('customButtonSaveTemplate', {NAME: '', template: 'custom'});
$.FroalaEditor.DefineIcon('customButtonUnlink', {NAME: '', template: 'custom'});
$.FroalaEditor.DefineIcon('customImageAlt', {NAME: '', template: 'custom'});
/* 에디터 아이콘 재정의 */
$.FroalaEditor.RegisterCommand('customImageAlt', {
title: $.lang[LANG]['config.alt.modal.edit'],
undo: false,
focus: false,
showOnMobile: true,
callback: function() {
var editor = this;
var $img = editor.image.get();
var html = '\
'+$.lang[LANG]['config.alt.modal.description']+'
\
'+$.lang[LANG]['config.alt.modal.description2']+'
\
\
';
var modal = $(this).showModalFlat($.lang[LANG]['config.alt.modal.title'], html, true, true, function() {
// ok callback
var val = modal.find('#alt-editor').val();
var allowedRegex = /^[ㄱ-ㅎㅏ-ㅣ가-힣a-zA-Z0-9\s-_\.]+$/;
if(val && (checkEmojis(val) || !allowedRegex.test(val))) {
modal.find('.error').remove();
modal.find('.alt-area').after('');
return false;
}
val = $.trim(val).replace(/\s+|\n+/g, '-');
val = val.replace(/-+/g, '-');
$img.attr('alt', val);
modal.modal('hide');
editor.image.edit($img);
}, 'cancel', 'config.apply', 'cl-p70 cl-cmmodal cl-s-btn w560 cl-p0 cl-okbtn-pbt70 img-alt-modal', true, function() {
// close callback
editor.image.edit($img);
}, function() {
// show callback
modal.find('#alt-editor').on('input keypress', function(e) {
if(e.keyCode && e.keyCode == 13) e.preventDefault();
char_count();
});
modal.find('#alt-editor').on('paste', function(event) {
event.preventDefault();
const clipboardData = (event.originalEvent || event).clipboardData;
const pastedData = $.trim(clipboardData.getData('text/plain'));
const textareaElement = document.getElementById('alt-editor');
const selectionStart = textareaElement.selectionStart;
const selectionEnd = textareaElement.selectionEnd;
const currentValue = textareaElement.value;
const modifiedData = currentValue.substring(0, selectionStart) + pastedData.replace(/\s+|\n+/g, '-') + currentValue.substring(selectionEnd);
textareaElement.value = modifiedData;
const newStartPosition = selectionStart + pastedData.length;
const newEndPosition = newStartPosition;
const startPosition = Math.min(newStartPosition, newEndPosition);
const endPosition = Math.max(newStartPosition, newEndPosition);
textareaElement.setSelectionRange(startPosition, endPosition);
char_count();
});
});
var char_count = function() {
var val = modal.find('#alt-editor').val();
var text_cnt = val.length;
if(text_cnt > 150) {
val = val.substring(0, 150);
modal.find('#alt-editor').val(val);
text_cnt = 150;
}
modal.find('.counter-num').text(text_cnt);
};
var alt = ($img.attr('alt') || '').replace(/ /g, '-');
alt = alt.replace(/\n/g, ' ');
modal.find('#alt-editor').val(alt);
char_count();
}
});
$.FroalaEditor.RegisterCommand('textColor', {
title: 'Text color',
undo: true,
focus: false,
showOnMobile: true,
refreshAfterCallback: false,
callback: function () {
var editor = this;
if(editor.browser.safari) editor.selection.save();
// $('.fr-toolbar.fr-inline').addClass('always');
$('button[data-cmd="textColor"]').toggleClass('active');
$('button[data-cmd="textColor"]').colpick({
color:'#0088CC',
layout : 'hex',
extend : true,
flat : isMobile() ? true : false,
onSubmit: function (hsb, hex, rgb) {
hex = hex.toUpperCase();
restoreSelection(selRange);
var oper = $(this.selector).closest('.colpick_hex.extend').find('.nav-pills [data-type].active').data('type');
if(oper == 'text') {
editor.colors.text('#' + hex);
} else if(oper == 'background') {
editor.colors.background('#' + hex);
} else if(oper == 'buttonhovertext') {
var blockCSS = getStyleText();
var $button = editor.customInsertButton.get();
var btnCls = '';
var elName = selectEL;
var blockName = $('.' + selectEL).attr('data-name');
$($button[0].classList).each(function(idx, cls) {
if(cls.indexOf('fr-cst-btn-') > -1) btnCls = cls;
});
if(btnCls) {
if(!blockCSS.children.hasOwnProperty('.' + blockName + ' .' + btnCls + ':hover')) {
blockCSS.children['.' + blockName + ' .' + btnCls + ':hover'] = new Array();
blockCSS.children['.' + blockName + ' .' + btnCls + ':hover']['attributes'] = new Array();
}
if(!blockCSS.children.hasOwnProperty('.' + blockName + ' .' + btnCls + ':hover span')) {
blockCSS.children['.' + blockName + ' .' + btnCls + ':hover span'] = new Array();
blockCSS.children['.' + blockName + ' .' + btnCls + ':hover span']['attributes'] = new Array();
}
blockCSS.children['.' + blockName + ' .' + btnCls + ':hover']['attributes']['color'] = '#'+hex + ' !important';
blockCSS.children['.' + blockName + ' .' + btnCls + ':hover span']['attributes']['color'] = '#'+hex + ' !important';
$('#' + elName + 'css').html(CSSJSON.toCSS(blockCSS));
$('.' + selectEL).addClass('css-changed');
}
}
// $('.fr-toolbar.fr-inline').removeClass('always');
$('button[data-cmd="textColor"]').removeClass('active').colpickHide();
if(typeof SETTINGS.favcolor == 'undefined') SETTINGS.favcolor = ['#FFFFFF','#FFFFFF','#FFFFFF','#FFFFFF','#FFFFFF','#FFFFFF','#000000'];
if(hex && SETTINGS.favcolor.indexOf('#' +hex) == -1) {
if(MODE == 'c' || MODE == 'config') {
$.ajax({
url:'/config/setFavoriteColor',
type:'post',
data:{
'sid' : SID,
'color' : '#'+hex,
},
dataType:'json',
success:function() {
SETTINGS.favcolor.push('#'+hex);
if(SETTINGS.favcolor.length > $.FroalaEditor.FAV_COLORS_COUNT) {
SETTINGS.favcolor.splice(0, SETTINGS.favcolor.length - $.FroalaEditor.FAV_COLORS_COUNT);
}
}
});
} else {
SETTINGS.favcolor.push('#'+hex);
if(SETTINGS.favcolor.length > $.FroalaEditor.FAV_COLORS_COUNT) {
SETTINGS.favcolor.splice(0, SETTINGS.favcolor.length - $.FroalaEditor.FAV_COLORS_COUNT);
}
}
}
},
onHide: function(picker) {
$(picker).removeClass('show-picker');
$($(picker).data('colpick').el).removeClass('active');
},
onBeforeShow: function() {
// restoreSelection(selRange);
var $colpick_layer = $('#' + $(this).data('colpickId'));
var hex = style.getHex($(editor.selection.element()).css('color'));
$('button[data-cmd="textColor"]').colpickSetColor(hex.replace('#',''));
$('.colpick_hex.extend .fav-row').remove();
if(typeof SETTINGS.favcolor == 'undefined') SETTINGS.favcolor = ['#FFFFFF','#FFFFFF','#FFFFFF','#FFFFFF','#FFFFFF','#FFFFFF','#000000'];
var favcolor_html = '';
if(SETTINGS.favcolor.length) {
var gap = $.FroalaEditor.FAV_COLORS_COUNT - SETTINGS.favcolor.length;
for(var i=0; i';
});
}
if(favcolor_html) {
$('.colpick_hex.extend .col-ex-item.color-set').prepend('' + favcolor_html + '
');
}
if(editor.opts.pluginsEnabled.indexOf('customInsertButton') > -1) {
if(editor.customInsertButton.get().length && editor.opts.pagemode != 'post') {
$colpick_layer.find('.nav-pills li[data-type="background"]').attr('data-type', 'buttonhovertext');
} else {
$colpick_layer.find('.nav-pills li[data-type="buttonhovertext"]').attr('data-type', 'background');
}
} else {
$colpick_layer.find('.nav-pills li[data-type="buttonhovertext"]').attr('data-type', 'background');
}
$colpick_layer.find('.nav-pills [data-type="background"] a').text($.FroalaEditor.LANGUAGE[LANG].translation['Background Color']);
$colpick_layer.find('.nav-pills [data-type="buttonhovertext"] a').text($.FroalaEditor.LANGUAGE[LANG].translation['Text Hover Color']);
},
onShow: function() {
// console.log($colpick_layer)
var $colpick_layer = $('#' + $(this).data('colpickId'));
if(Number($colpick_layer.css('left').replace('px','')) < 0) {
$colpick_layer.css('left', '0');
}
if(!$('button[data-cmd="textColor"]').hasClass('active')) {
$colpick_layer.hide();
$colpick_layer.css('opacity', '0');
setTimeout(function() {
$colpick_layer.hide();
$colpick_layer.css('opacity', '1');
});
}
var $trigger = $('button[data-cmd="textColor"]');
if(($trigger.offset().top + $trigger.outerHeight() + $colpick_layer.outerHeight()) > window.innerHeight) {
var top = $trigger.offset().top;
$colpick_layer.css('top',(Number(top)-201)+'px');
}
}
});
var $colpick_layer = $('#' + $('button[data-cmd="textColor"]').data('colpickId'));
$colpick_layer.hide();
$colpick_layer.find('.nav-pills [data-type="text"] a').text($.FroalaEditor.LANGUAGE[LANG].translation['Text Color']);
$colpick_layer.find('.nav-pills [data-type="background"] a').text($.FroalaEditor.LANGUAGE[LANG].translation['Background Color']);
$colpick_layer.find('.nav-pills [data-type="text-hover"] a').text($.FroalaEditor.LANGUAGE[LANG].translation['Text Hover Color']);
$colpick_layer.find('.nav-pills li').removeClass('active');
$colpick_layer.find('.nav-pills li:first').addClass('active');
$colpick_layer.find('[data-color="REMOVE"]').attr('title', $.FroalaEditor.LANGUAGE[LANG].translation['Initial']);
}
});
$.FroalaEditor.RegisterCommand('font-weight', {
title: 'Font Weight',
type: 'dropdown',
undo: true,
focus: true,
showOnMobile: true,
refreshAfterCallback: false,
options: {
'normal' : 'Default',
'100p' : '100',
'200p' : '200',
'300p' : '300',
'400p' : '400',
'500p' : '500',
'600p' : '600',
'700p' : '700',
'800p' : '800',
'900p' : '900',
},
callback: function(cmd, val) {
this.selection.save();
val = val.replace(/p/g, '');
if(this.format.is('strong')) this.format.remove('strong');
if(this.format.is('b')) this.format.remove('b');
this.format.applyStyle('font-weight', val);
},
refreshOnShow: function($btn, $dropdown) {
var font_weight = $(this.selection.endElement()).css('font-weight');
if(font_weight) {
$($dropdown).find('[data-param1="' + font_weight + '"]').addClass('fr-active');
}
}
});
$.FroalaEditor.RegisterCommand('font-bold', {
icon: 'font-weight',
title: 'Font Bold',
undo: true,
focus: true,
showOnMobile: true,
refreshAfterCallback: false,
callback: function(cmd, val) {
var editor = this;
if(cmd) {
if(editor.selection.isCollapsed()) return false;
if(editor.format.is('strong')) this.format.remove('strong');
if(editor.format.is('b')) this.format.remove('b');
if($(editor.selection.get().focusNode.parentElement).css('font-weight') != '700') {
editor.format.applyStyle('font-weight', '700');
} else {
editor.format.applyStyle('font-weight', 'initial');
}
var flag = $(editor.selection.get().focusNode.parentElement).css('font-weight') == '700'
$(editor.$tb).find('button[data-cmd="font-bold"]').toggleClass('active', flag);
}
},
refresh:function() {
var editor = this;
if(editor.format.is('strong') || editor.format.is('b') || $(editor.selection.get().focusNode.parentElement).css('font-weight') == '700') {
$(editor.$tb).find('button[data-cmd="font-bold"]').addClass('active');
} else {
$(editor.$tb).find('button[data-cmd="font-bold"]').removeClass('active');
}
}
});
$.FroalaEditor.RegisterCommand('letter-spacing', {
title: 'Letter Spacing',
type: 'dropdown',
undo: true,
focus: true,
showOnMobile: true,
refreshAfterCallback: false,
options: {
'-2px' : '-2',
'-1px' : '-1',
'0px' : '0',
'1px' : '1',
'2px' : '2',
'3px' : '3',
'4px' : '4',
'5px' : '5',
'6px' : '6',
'7px' : '7',
'8px' : '8',
'9px' : '9',
'10px' : '10'
},
callback: function(cmd, val) {
this.selection.save();
this.format.applyStyle('letter-spacing', val);
},
refresh: function() {
},
refreshOnShow: function($btn, $dropdown) {
var letter_spacing = $(this.selection.endElement()).css('letter-spacing');
if(letter_spacing) {
// letter_spacing = letter_spacing.replace('px', '');
if(letter_spacing == 0) letter_spacing = '0px';
$($dropdown).find('[data-param1="' + letter_spacing + '"]').addClass('fr-active');
}
}
});
$.FroalaEditor.RegisterCommand('customInsertMyStorageImage', {
icon: 'customInsertMyStorageImageIcon',
title: 'Insert Image',
callback: function() {
if(this.image.get()) {
this.replaceimage = this.image.get();
} else {
this.replaceimage = null;
this.selection.save();
}
$('.resource-useit').attr('data-element', 'editor');
$.resource.open();
}
});
$.FroalaEditor.RegisterCommand('image-replace', {
title: 'Replace image',
// icon: 'image-replace',
undo: true,
focus: true,
showOnMobile: true,
// refreshAfterCallback: true,
callback: function () {
this.selection.save();
isReplace = true;
upTYPE = 'image';
$('#file_type').val(upTYPE);
$('#file_multiple').val(false);
$('#uploadFile').val('').removeAttr('multiple').attr('accept','image/gif,image/jpg,image/jpeg,image/png,image/ico,image/webp');
$('#uploadFile').trigger('click');
},
refresh: function ($btn) { }
});
$.FroalaEditor.RegisterCommand('img-align-full', {
title: 'Image full width',
icon: 'image-align-full',
undo: true,
focus: true,
showOnMobile: true,
// refreshAfterCallback: true,
callback: function () {
$(this.image.get()).removeClass(function (index, css) {
return (css.match (/f-align-(left|right|full|wide|original)(-470)*/g) || []).join(' ');
}).addClass('f-align-full');
setForumWrap();
this.image.back();
$('.fr-btn.fr-btn-image').removeClass('active');
$('.fr-btn.fr-btn-image[data-cmd="img-align-full"]').addClass('active');
},
refresh: function ($btn) {
setImageToolbarPosition($btn,this.image.get());
refreshImagebtn(this.image.get());
}
});
$.FroalaEditor.RegisterCommand('img-align-wide', {
title: 'Image wide width',
icon: 'image-align-wide',
undo: true,
focus: true,
showOnMobile: true,
refreshAfterCallback: true,
callback: function () {
$(this.image.get()).removeClass(function (index, css) {
return (css.match (/f-align-(left|right|full|wide|original)(-470)*/g) || []).join(' ');
}).addClass('f-align-wide');
setForumWrap();
this.image.back();
$('.fr-btn.fr-btn-image').removeClass('active');
$('.fr-btn.fr-btn-image[data-cmd="img-align-wide"]').addClass('active');
},
refresh: function ($btn) {
setImageToolbarPosition($btn,this.image.get());
refreshImagebtn(this.image.get());
}
});
$.FroalaEditor.RegisterCommand('img-align-original', {
title: 'Image wide original',
icon: 'image-align-original',
undo: true,
focus: true,
showOnMobile: true,
refreshAfterCallback: true,
callback: function () {
$(this.image.get()).removeClass(function (index, css) {
return (css.match (/f-align-(left|right|full|wide|original)(-470)*/g) || []).join(' ');
}).addClass('f-align-original').removeAttr('style');
this.image.back();
$('.fr-btn.fr-btn-image').removeClass('active');
$('.fr-btn.fr-btn-image[data-cmd="img-align-original"]').addClass('active');
},
refresh: function ($btn) {
setImageToolbarPosition($btn,this.image.get());
refreshImagebtn(this.image.get());
}
});
$.FroalaEditor.RegisterCommand('img-align-left-470', {
title: 'Image left width 470px',
icon: 'image-align-left-470',
undo: true,
focus: true,
showOnMobile: true,
refreshAfterCallback: true,
callback: function () {
$(this.image.get()).removeClass(function (index, css) {
return (css.match (/f-align-(left|right|full|wide|original)(-470)*/g) || []).join(' ');
}).addClass('f-align-left-470');
this.image.back();
$('.fr-btn.fr-btn-image').removeClass('active');
$('.fr-btn.fr-btn-image[data-cmd="img-align-left-470"]').addClass('active');
},
refresh: function ($btn) {
setImageToolbarPosition($btn,this.image.get());
refreshImagebtn(this.image.get());
}
});
$.FroalaEditor.RegisterCommand('img-align-right-470', {
title: 'Image right width 470px',
icon: 'image-align-right-470',
undo: true,
focus: true,
showOnMobile: true,
refreshAfterCallback: true,
callback: function () {
$(this.image.get()).removeClass(function (index, css) {
return (css.match (/f-align-(left|right|full|wide|original)(-470)*/g) || []).join(' ');
}).addClass('f-align-right-470');
this.image.back();
$('.fr-btn.fr-btn-image').removeClass('active');
$('.fr-btn.fr-btn-image[data-cmd="img-align-right-470"]').addClass('active');
},
refresh: function ($btn) {
setImageToolbarPosition($btn,this.image.get());
refreshImagebtn(this.image.get());
}
});
$.FroalaEditor.RegisterCommand('img-align-left', {
title: 'Image left width 350px',
icon: 'image-align-left',
undo: true,
focus: true,
showOnMobile: true,
refreshAfterCallback: true,
callback: function () {
$(this.image.get()).removeClass(function (index, css) {
return (css.match (/f-align-(left|right|full|wide|original)(-470)*/g) || []).join(' ');
}).addClass('f-align-left');
this.image.back();
$('.fr-btn.fr-btn-image').removeClass('active');
$('.fr-btn.fr-btn-image[data-cmd="img-align-left"]').addClass('active');
},
refresh: function ($btn) {
setImageToolbarPosition($btn,this.image.get());
refreshImagebtn(this.image.get());
}
});
$.FroalaEditor.RegisterCommand('img-align-right', {
title: 'Image right width 350px',
icon: 'image-align-right',
undo: true,
focus: true,
showOnMobile: true,
refreshAfterCallback: true,
callback: function () {
$(this.image.get()).removeClass(function (index, css) {
return (css.match (/f-align-(left|right|full|wide|original)(-470)*/g) || []).join(' ');
}).addClass('f-align-right');
this.image.back();
$('.fr-btn.fr-btn-image').removeClass('active');
$('.fr-btn.fr-btn-image[data-cmd="img-align-right"]').addClass('active');
},
refresh: function ($btn) {
setImageToolbarPosition($btn,this.image.get());
refreshImagebtn(this.image.get());
}
});
$.FroalaEditor.RegisterCommand('image-enter', {
title: 'Enter',
icon: 'editor-enter-icon',
undo: true,
focus: true,
showOnMobile: true,
refreshAfterCallback: true,
callback: function () {
var $image = $(this.image.get());
$image.addClass('fr-image-selected');
if(this.opts.enter == $.FroalaEditor.ENTER_P) {
var $new_line = $('
');
var $image_wrap = $image.parent('p');
} else {
var $new_line = $('
');
var $image_wrap = $image.parent('div:not(.fr-view)');
}
if(!$image_wrap.length) $image_wrap = $image;
$image_wrap.after($new_line);
$('.fr-image-selected').removeClass('fr-image-selected');
this.selection.remove();
}
});
$.FroalaEditor.RegisterCommand('video-enter', {
title: 'Enter',
icon: 'editor-enter-icon',
undo: true,
focus: true,
showOnMobile: true,
refreshAfterCallback: true,
callback: function () {
this.video.get().addClass('fr-video-selected');
this.selection.setAfter(this.video.get().parent());
this.selection.restore();
this.cursor.enter();
this.selection.clear();
$('.fr-video-selected').click().removeClass('fr-video-selected');
},
refresh: function ($btn) {
// setVideoToolbarPosition($btn,this.video.get());
refreshVideobtn(this.video.get());
}
});
$.FroalaEditor.RegisterCommand('table-enter', {
title: 'Enter',
icon: 'editor-enter-icon',
undo: true,
focus: true,
showOnMobile: true,
refreshAfterCallback: true,
callback: function () {
// this.selection.setAfter(this.table.selectedTable().closest('div'));
var table_wrap = $(this.table.selectedTable()).closest('.fr-table-responsive');
// this.selection.setAfter(table_wrap);
// this.selection.restore();
if(table_wrap.length) {
this.selection.clear();
if(this.opts.enter == FroalaEditor.ENTER_P) {
var $new_line = $('
');
} else {
var $new_line = $('
');
}
} else {
table_wrap = this.table.selectedTable();
}
$(table_wrap).after($new_line);
// this.selection.setAfter($new_line);
// this.selection.save();
// this.selection.restore();
}
});
$.FroalaEditor.RegisterCommand('hr-enter', {
title: 'Enter',
icon: 'editor-enter-icon',
undo: true,
focus: true,
showOnMobile: true,
refreshAfterCallback: true,
callback: function () {
var $hr = this.customInsertHR.get();
if(this.opts.enter == FroalaEditor.ENTER_P) {
var $new_line = $('
');
} else {
var $new_line = $('
');
}
$hr.after($new_line);
// this.selection.setAfter(this.customInsertHR.get()[0]);
// this.selection.restore();
// this.cursor.enter();
}
});
$.FroalaEditor.RegisterCommand('custom-button-enter', {
title: 'Enter',
icon: 'editor-enter-icon',
undo: true,
focus: true,
showOnMobile: true,
refreshAfterCallback: true,
callback: function () {
var $btn = this.customInsertButton.get();
var $new_line = $('
');
$btn.parent().after($new_line);
// this.selection.setAfter($new_line.get(0));
// this.selection.restore();
// this.cursor.enter();
}
});
$.FroalaEditor.RegisterCommand('video-replace', {
title: 'Replace video',
icon: 'quickInsertVideoIcon',
callback: function(cmd, val) {
var editor = this;
// selRange = saveSelection();
editor.selection.save();
var editor_video = '';
var modal = $(this).showModalFlat($.lang[LANG]['config.replace-video'],videoForm(),true,true,function() {
$('.error').remove();
if(!editor_video) {
modal.modal('hide');
return false;
}
var url = $('#video-url').val();
if(!url) {
$('#video-url').after('').focus();
return;
}
// video url patterns(youtube, instagram, vimeo, dailymotion)
var ytRegExp = /^.*(youtu.be\/|v\/|u\/\w\/|embed\/|watch\?v=|\&v=)([^#\&\?]*).*/;
var ytMatch = url.match(ytRegExp);
var igRegExp = /\/\/instagram.com\/p\/(.[a-zA-Z0-9]*)/;
var igMatch = url.match(igRegExp);
var vRegExp = /\/\/vine.co\/v\/(.[a-zA-Z0-9]*)/;
var vMatch = url.match(vRegExp);
var vimRegExp = /\/\/(player.)?vimeo.com\/([a-z]*\/)*([0-9]{6,11})[?]?.*/;
var vimMatch = url.match(vimRegExp);
var dmRegExp = /.+dailymotion.com\/(video|hub)\/([^_]+)[^#]*(#video=([^_&]+))?/;
var dmMatch = url.match(dmRegExp);
var kakaoExp = /\/\/tv.kakao.com\/(channel|embed)\/([0-9]{6,11}|player)\/cliplink\/([0-9]{6,11})/;
var kaMatch = url.match(kakaoExp);
var sound = url.search("soundcloud.com");
var $video;
if (ytMatch && ytMatch[2].length === 11) {
} else if (igMatch && igMatch[0].length > 0) {
} else if (vMatch && vMatch[0].length > 0) {
} else if (vimMatch && vimMatch[3].length > 0) {
} else if (dmMatch && dmMatch[2].length > 0) {
} else if (kaMatch && kaMatch[3].length > 0) {
} else if (sound>-1) {
} else {
$('#video-url').after('').focus();
return;
}
var video = insertVideo(url,'src');
if(video!=false) {
$(editor_video).find('iframe').attr('src', video);
restoreSelection(selRange);
}
modal.modal('hide');
},'cancel','', 'cl-modal cl-cmmodal cl-p70 cl-s-btn w560 cl-t80 cl-close-btn video-addmodal', '', '', function() {
if(!editor.video.get()) {
modal.modal('hide');
return false;
}
editor_video = editor.video.get()
var url = $(editor_video).find('iframe').attr('src');
modal.find('input#video-url').val(url);
});
$('.flat-modal').css({
'position' : 'absolute',
'z-index' : '1051'
});
$('[data-toggle="popover"]').popover();
$('.flat-modal').next().css('z-index','1050');
}
});
$.FroalaEditor.RegisterQuickInsertButton('quickInsertImageButton', {
icon: 'quickInsertImageIcon',
title: 'Insert Image',
callback: function() {
var editor = this;
editor.selection.save();
// selRange = saveSelection();
upTYPE = 'image';
isReplace = false;
$('#file_type').val(upTYPE);
$('#file_multiple').val(true);
$('#uploadFile').val('').attr('multiple','multiple').attr('accept','image/gif,image/jpg,image/jpeg,image/png,image/ico,image/webp');
$('#uploadFile').trigger('click');
}
});
$.FroalaEditor.RegisterCommand('insertImageButton', {
icon: 'quickInsertImageIcon',
title: 'Insert Image',
callback: function() {
var editor = this;
editor.selection.save();
// selRange = saveSelection();
upTYPE = 'image';
$('#file_type').val(upTYPE);
$('#file_multiple').val(true);
$('#uploadFile').val('').attr('multiple','multiple').attr('accept','image/gif,image/jpg,image/jpeg,image/png,image/ico,image/webp');
$('#uploadFile').trigger('click');
}
});
$.FroalaEditor.RegisterQuickInsertButton('quickInsertMyStorageImageButton', {
icon: 'quickInsertMyStorageImageIcon',
title: 'Insert Image',
callback: function() {
var editor = this;
// console.log('image before')
// console.log(editor.selection.element());
editor.selection.save();
// selRange = saveSelection();
$.resource.open();
$('.resource-useit').attr('data-element', 'editor');
}
});
$.FroalaEditor.RegisterQuickInsertButton('quickInsertVideoButton', {
icon: 'quickInsertVideoIcon',
title: 'Insert Video',
callback: function() {
// this.selection.save();
var editor = this;
editor.selection.save();
// selRange = saveSelection();
var editor = this;
var modal = $(this).showModalFlat($.lang[LANG]['config.insert-video'],videoForm(),true,true,function() {
$('.error').remove();
var url = $('#video-url').val();
if(!url) {
$('#video-url').after('').focus();
return;
}
// video url patterns(youtube, instagram, vimeo, dailymotion)
var ytRegExp = /^.*(youtu.be\/|v\/|u\/\w\/|embed\/|watch\?v=|\&v=)([^#\&\?]*).*/;
var ytMatch = url.match(ytRegExp);
var igRegExp = /\/\/instagram.com\/p\/(.[a-zA-Z0-9]*)/;
var igMatch = url.match(igRegExp);
var vRegExp = /\/\/vine.co\/v\/(.[a-zA-Z0-9]*)/;
var vMatch = url.match(vRegExp);
var vimRegExp = /\/\/(player.)?vimeo.com\/([a-z]*\/)*([0-9]{6,11})[?]?.*/;
var vimMatch = url.match(vimRegExp);
var dmRegExp = /.+dailymotion.com\/(video|hub)\/([^_]+)[^#]*(#video=([^_&]+))?/;
var dmMatch = url.match(dmRegExp);
var sound = url.search("soundcloud.com");
var kakaoExp = /\/\/tv.kakao.com\/(channel|embed)\/([0-9]{6,11}|player)\/cliplink\/([0-9]{6,11})/;
var kaMatch = url.match(kakaoExp);
var $video;
if (ytMatch && ytMatch[2].length === 11) {
} else if (igMatch && igMatch[0].length > 0) {
} else if (vMatch && vMatch[0].length > 0) {
} else if (vimMatch && vimMatch[3].length > 0) {
} else if (dmMatch && dmMatch[2].length > 0) {
} else if (kaMatch && kaMatch[3].length > 0) {
} else if (sound>-1) {
} else {
$('#video-url').after('').focus();
return;
}
if ($video) {
$video.attr('frameborder', 0).attr('class','tpl-video');
range.create().insertNode($video[0]);
//$('.note-editable').fitVids();
}
var video = insertVideo(url,'src'),
frVideo = '' +
'' +
'
';
if(video!=false) {
restoreSelection(selRange);
editor.html.insert(frVideo , true);
}
// editor.video.insertByURL(url);
// editor.selection.restore();
modal.modal('hide');
if(fr_editor) fr_editor.events.trigger('contentChanged');
},'cancel','', 'cl-modal cl-cmmodal cl-p70 cl-s-btn w560 cl-t80 cl-close-btn video-addmodal', '', function() { restoreSelection(selRange); });
$('.flat-modal').css({
'position' : 'absolute',
'z-index' : '1051'
});
$('[data-toggle="popover"]').popover();
$('.flat-modal').next().css('z-index','1050');
}
});
$.FroalaEditor.RegisterCommand('insertVideoButton', {
icon: 'quickInsertVideoIcon',
title: 'Insert Video',
callback: function() {
this.selection.save();
// selRange = saveSelection();
var editor = this;
var modal = $(this).showModalFlat($.lang[LANG]['config.insert-video'],videoForm(),true,true,function() {
$('.error').remove();
var url = $('#video-url').val();
if(!url) {
$('#video-url').after('').focus();
return;
}
// video url patterns(youtube, instagram, vimeo, dailymotion)
var ytRegExp = /^.*(youtu.be\/|v\/|u\/\w\/|embed\/|watch\?v=|\&v=)([^#\&\?]*).*/;
var ytMatch = url.match(ytRegExp);
var igRegExp = /\/\/instagram.com\/p\/(.[a-zA-Z0-9]*)/;
var igMatch = url.match(igRegExp);
var vRegExp = /\/\/vine.co\/v\/(.[a-zA-Z0-9]*)/;
var vMatch = url.match(vRegExp);
var vimRegExp = /\/\/(player.)?vimeo.com\/([a-z]*\/)*([0-9]{6,11})[?]?.*/;
var vimMatch = url.match(vimRegExp);
var dmRegExp = /.+dailymotion.com\/(video|hub)\/([^_]+)[^#]*(#video=([^_&]+))?/;
var dmMatch = url.match(dmRegExp);
var sound = url.search("soundcloud.com");
var $video;
if (ytMatch && ytMatch[2].length === 11) {
} else if (igMatch && igMatch[0].length > 0) {
} else if (vMatch && vMatch[0].length > 0) {
} else if (vimMatch && vimMatch[3].length > 0) {
} else if (dmMatch && dmMatch[2].length > 0) {
} else if (sound>-1) {
} else {
$('#video-url').after('').focus();
return;
}
if ($video) {
$video.attr('frameborder', 0).attr('class','tpl-video');
range.create().insertNode($video[0]);
//$('.note-editable').fitVids();
}
var video = insertVideo(url,'src'),
frVideo = '' +
'' +
'';
if(video!=false) {
restoreSelection(selRange);
editor.html.insert(frVideo , true);
}
// editor.video.insertByURL(url);
// editor.selection.restore();
modal.modal('hide');
},'cancel','', 'cl-modal cl-cmmodal cl-p70 cl-s-btn w560 cl-t80 cl-close-btn video-addmodal', '', function() { restoreSelection(selRange); });
$('.flat-modal').css({
'position' : 'absolute',
'z-index' : '1051'
});
$('[data-toggle="popover"]').popover();
$('.flat-modal').next().css('z-index','1050');
}
});
$.FroalaEditor.RegisterQuickInsertButton('quickInsertFileButton', {
icon: 'quickInsertFileIcon',
title: 'Insert File',
callback: function() {
// selRange = saveSelection();
window.UPLOAD = 0, window.UPLOADED = 0, window.PROGRESS = 0;
if(typeof $('#uploadFile2').data('blueimpFileupload') != 'undefined') $('#uploadFile2').fileupload('destroy');
this.selection.save();
upTYPE = 'file';
$('#file_type').val(upTYPE);
$('#file_multiple').val(true);
if(fr_editor.opts.pagemode == 'post') {
if (postChangedTimeout) {
clearTimeout(postChangedTimeout);
postChangedTimeout = null;
}
}
$.uploadON();
$('#uploadFile2').fileupload({
url: '/fm/attach',
dataType: 'json',
pasteZone: null,
dropZone: null,
async: true,
prependFiles: true,
sequentialUploads: true,
add: function(e,data) {
if(data.originalFiles.length > 20) {
var modal = $(this).showModalFlat('ERROR', $.lang[LANG]['editor.file.upload.multiple.max'], true, false, '', 'ok', '', 'cl-cmmodal cl-s-btn w560 cl-p130 cl-t80 cl-modal cl-none-title cl-close-btn', '', '', function () {
$(document).on('keydown', function (e) {
if (e.keyCode == 27) modal.modal('hide');
});
});
$.uploadOFF();
return false;
}
var r = $.upload_add(e,data,'forum_file');
if(r.submit) {
var jqXHR = data.submit();
UPLOAD++;
} else {
data.context.find('.loading').html('');
data.context.find('.ing').addClass('error').text(r.err);
}
$('.uploadModal .upload-cancel .btn, .uploadModal .upload-close').off('click').on('click', function(e) {
if(jqXHR != undefined) jqXHR.abort();
data.context.fadeOut().remove();
$('.uploadModal #file-upload-progress').css('width','0%');
$.uploadOFF();
UPLOAD = 0;
UPLOADED = 0;
UPLOADSIZE = 0;
PROGRESS = 0;
});
},
progress: function(e, data) {
$.upload_progress(e,data);
},
done: function (e, data) {
$.upload_done(e,data);
UPLOADED++;
if(UPLOADED && data.context.find('.error').length == 0) {
var res = data.result.list[0];
if(res) setfile(res.file, res.uploaded.file_name, res.uploaded.orig_name, res.uploaded.dir);
if(UPLOAD==UPLOADED) {
setTimeout(function() {
$.uploadOFF();
UPLOAD = 0;
UPLOADED = 0;
UPLOADSIZE = 0;
PROGRESS = 0;
},1000);
}
}
if(fr_editor.opts.pagemode == 'post') {
postChangedTimeout = setTimeout(function () {
if (postChanged && ($('#fm-title').val().replace(/ /g, '').length > 0 || editor.html.get().length)) {
isAutosave = true;
temporarySave();
}
}, 7000); // 자동저장 대기시간
}
},
progressall: function (e, data) {
$.upload_progressall(e,data);
},
start : function(e, data) {
$.upload_start(e,data);
progress1 = 0; progress2 = 0; PROGRESS = 0;
},
dragover : function(e, data) {
e.preventDefault();
}
}).prop('disabled', !$.support.fileInput)
.parent().addClass($.support.fileInput ? undefined : 'disabled');
$('#uploadFile2').trigger('click');
}
});
$.FroalaEditor.RegisterQuickInsertButton('quickInsertCustomButton', {
icon: 'insertCustomButton',
title: 'Insert Button',
callback: function() {
var editor = this;
var random_num = Math.floor((Date.now() + Math.random()) * 1000);
editor.commands.clearFormatting();
editor.html.insert('' + (LANG == 'ko' ? '더보기' : 'MORE') + '
', false);
}
});
$.FroalaEditor.RegisterQuickInsertButton('quickInsertHR', {
icon: 'insertHR',
title: 'Insert HR',
callback: function() {
var editor = this;
editor.html.insert('
');
}
});
$.FroalaEditor.RegisterCommand('insertCustomButton', {
icon: 'insertCustomButton',
title: 'Insert Button',
callback: function() {
var editor = this;
var random_num = Math.floor((Date.now() + Math.random()) * 1000);
editor.commands.clearFormatting();
editor.html.insert('' + (LANG == 'ko' ? '더보기' : 'MORE') + '
', false);
if($(window).width() < 768) {
fr_editor.selection.clear();
if(!fr_editor.selection.inEditor() || !fr_editor.core.hasFocus()) {
$('.fr-mobile-quick-insert').find('.fr-command').addClass('fr-disabled');
}
}
}
});
$.FroalaEditor.RegisterCommand('insertFileButton', {
icon: 'quickInsertFileIcon',
title: 'Insert File',
callback: function() {
// selRange = saveSelection();
upTYPE = 'file';
$('#file_type').val(upTYPE);
$('#file_multiple').val(false);
$('#uploadFile').val('').removeAttr('multiple').removeAttr('accept');
$('#uploadFile').trigger('click');
}
});
$.FroalaEditor.RegisterCommand('hrBorderWidth', {
icon: 'tableBorderWidth',
title: 'Border Width',
type:'dropdown',
focus: false,
options: {
'1' : '1',
'2' : '2',
'3' : '3',
'4' : '4',
'5' : '5',
'6' : '6',
'7' : '7',
'8' : '8',
'9' : '9',
'10' : '10',
},
callback: function(cmd, val) {
var editor = this;
editor.customInsertHR.get().css('border-bottom-width', val + 'px');
editor.customInsertHR.drawResizer();
setTimeout(function() {
editor.customInsertHR.refreshToolbar();
});
},
refreshOnShow: function($btn, $dropdown) {
var border_width = this.customInsertHR.get().css('border-bottom-width');
if(border_width) {
border_width = border_width.replace('px', '');
} else {
border_width = 1;
}
$($dropdown).find('[data-param1="' + border_width + '"]').addClass('fr-active');
}
});
$.FroalaEditor.RegisterCommand('hrMargin', {
icon: 'hrMargin',
title: 'Margin',
type:'dropdown',
focus:false,
options: {
'0' : '0',
'1' : '1',
'2' : '2',
'3' : '3',
'4' : '4',
'5' : '5',
'6' : '6',
'7' : '7',
'8' : '8',
'9' : '9',
'10' : '10',
'11' : '11',
'12' : '12',
'13' : '13',
'14' : '14',
'15' : '15',
'16' : '16',
'17' : '17',
'18' : '18',
'19' : '19',
'20' : '20',
},
callback: function(cmd, val) {
var editor = this;
editor.customInsertHR.get().css({'margin-top' : val + 'px', 'margin-bottom' : val + 'px'});
editor.customInsertHR.drawResizer();
setTimeout(function() {
editor.customInsertHR.refreshToolbar();
});
},
refreshOnShow: function($btn, $dropdown) {
var margin = 0;
var margin_top = this.customInsertHR.get().css('margin-top');
var margin_bottom = this.customInsertHR.get().css('margin-bottom');
margin = this.customInsertHR.get().css('margin-top') ? this.customInsertHR.get().css('margin-top') : this.customInsertHR.get().css('margin-bottom');
if(margin) {
margin = margin.replace('px', '');
}
if(margin_top && margin_bottom && margin_top == margin_bottom) {
$($dropdown).find('[data-param1="' + margin + '"]').addClass('fr-active');
}
}
});
$.FroalaEditor.RegisterCommand('hrBorderColor', {
icon: 'textColor',
title: 'Line Color',
focus: false,
callback: function(cmd, val) {
var editor = this;
$('button[data-cmd="hrBorderColor"]').colpick({
color:'#0088CC',
layout : 'hex',
extend : true,
flat : isMobile() ? true : false,
onSubmit: function (hsb, hex, rgb) {
hex = hex.toUpperCase();
// $('.fr-toolbar.fr-inline').removeClass('always');
$(this.el).data('value', '#' + hex);
$(this.el).colpickHide();
var $hr = editor.customInsertHR.get();
$hr.css('border-bottom-color', '#'+hex);
if(typeof SETTINGS.favcolor == 'undefined') SETTINGS.favcolor = ['#FFFFFF','#FFFFFF','#FFFFFF','#FFFFFF','#FFFFFF','#FFFFFF','#000000'];
if(hex && SETTINGS.favcolor.indexOf('#' +hex) == -1) {
if(MODE == 'c' || MODE == 'config') {
$.ajax({
url:'/config/setFavoriteColor',
type:'post',
data:{
'sid' : SID,
'color' : '#'+hex,
},
dataType:'json',
success:function() {
SETTINGS.favcolor.push('#'+hex);
if(SETTINGS.favcolor.length > $.FroalaEditor.FAV_COLORS_COUNT) {
SETTINGS.favcolor.splice(0, SETTINGS.favcolor.length - $.FroalaEditor.FAV_COLORS_COUNT);
}
}
});
} else {
SETTINGS.favcolor.push('#'+hex);
if(SETTINGS.favcolor.length > $.FroalaEditor.FAV_COLORS_COUNT) {
SETTINGS.favcolor.splice(0, SETTINGS.favcolor.length - $.FroalaEditor.FAV_COLORS_COUNT);
}
}
}
},
onHide: function(picker) {
$(picker).removeClass('show-picker');
$($(picker).data('colpick').el).removeClass('active');
},
onBeforeShow: function() {
$(this).toggleClass('active');
},
onShow: function() {
var btn = this;
if(!$(this).hasClass('active')) {
setTimeout(function() {
$(btn).colpickHide();
});
}
var $colpick_layer = $('#' + $(this).data('colpickId'));
$colpick_layer.find('.nav-pills').hide();
var hex = $.colpick.rgbToHex(fixRGB(rgbaToOpacity((editor.customInsertHR.get().css('border-bottom-color')))));
$(this).colpickSetColor(hex.replace('#',''));
$('.colpick_hex.extend .fav-row').remove();
if(typeof SETTINGS.favcolor == 'undefined') SETTINGS.favcolor = ['#FFFFFF','#FFFFFF','#FFFFFF','#FFFFFF','#FFFFFF','#FFFFFF','#000000'];
var favcolor_html = '';
if(SETTINGS.favcolor.length) {
var gap = $.FroalaEditor.FAV_COLORS_COUNT - SETTINGS.favcolor.length;
for(var i=0; i';
});
}
if(favcolor_html) {
$('.colpick_hex.extend .col-ex-item.color-set').prepend('' + favcolor_html + '
');
}
var $trigger = $(this);
if(($trigger.offset().top + $trigger.outerHeight() + $colpick_layer.outerHeight()) > window.innerHeight) {
var top = $trigger.offset().top;
$colpick_layer.css('top',(Number(top)-171)+'px');
}
}
});
}
});
$.FroalaEditor.RegisterCommand('hrAlign', {
icon: 'hrAlign',
title: 'HR Align',
type: 'dropdown',
focus: false,
options: {
'left': "",
'center': "",
'right': ""
},
html: function() {
return '\
';
},
callback: function(cmd, val) {
var editor = this;
editor.customInsertHR.get().attr('align', val);
editor.customInsertHR.drawResizer();
setTimeout(function() {
editor.customInsertHR.refreshToolbar();
},50);
$('button[data-cmd="hrAlign"]').html($('[data-cmd="hrAlign"][data-param1="' + val +'"]').html());
},
refreshOnShow: function($btn, $dropdown) {
var editor = this;
var align = editor.customInsertHR.get().attr('align');
if(!align) {
$dropdown.find('[data-param1="center"]').addClass('fr-active');
} else {
align = align.toLowerCase();
$dropdown.find('[data-param1="' + align +'"]').addClass('fr-active');
}
}
});
Object.assign(FroalaEditor.POPUP_TEMPLATES, {
'customInsertTable.popup' : '[_BUTTONS_][_CUSTOM_LAYER_]',
'customQuickInsert.popup' : '[_BUTTONS_]',
'customInsertHR.popup' : '[_BUTTONS_]',
'customInsertButton.toolbar' : '[_BUTTONS_]',
'customInsertButton.popup' : '[_CUSTOM_LAYER_]',
});
$.FroalaEditor.RegisterCommand('hrRemove', {
icon: 'hrRemove',
title: 'Remove HR',
callback: function(cmd, val) {
var editor = this;
editor.customInsertHR.get().remove();
editor.customInsertHR.hidePopup();
editor.customInsertHR.drawResizer();
editor.customInsertHR.refreshToolbar();
}
});
$.FroalaEditor.RegisterCommand('customButtonRemove', {
icon: 'hrRemove',
title: 'Remove Button',
callback: function() {
var editor = this;
var $button = editor.customInsertButton.get();
if($button.parent('div').get(0) == $(fr_editor.$el).get(0)) {
$button.remove();
} else {
var $parent = $button.parent('div');
$button.remove();
function removeInvisibleSpace(node) {
var newStr = '';
var text = $(node).text();
for(var i=0; i');
}
editor.customInsertButton.hideToolbar();
editor.customInsertButton.drawResizer();
}
});
$.FroalaEditor.RegisterCommand('customButtonCopy', {
icon:'copyCustomButton',
title: 'Copy Button',
callback: function() {
var editor = this;
// editor.selection.setAfter(editor.customInsertButton.get().parents('div:first')[0]);
// editor.selection.restore();
// editor.selection.save();
var $btn = editor.customInsertButton.get();
var $clone = $btn.clone().removeClass('fr-active');
$($clone[0].classList).each(function(idx, cls) {
if(cls.indexOf('fr-cst-btn-') > -1) {
$clone.removeClass(cls);
}
});
var random_num = Math.floor((Date.now() + Math.random()) * 1000);
$clone.addClass('fr-cst-btn-' + random_num);
var clone_html = $clone.outerHTML();
var align = '';
// if($btn.parent().css('text-align')) align = $btn.parent().css('text-align');
// if($btn.parent().get(0) == $(editor.$el).children('div:last').get(0)) {
// var $new_div = $('');
// $new_div.html(clone_html + '');
if($btn.parent('div').get(0) == $(editor.$el).get(0)) {
$btn.wrap('div');
}
$btn.after(' '+clone_html);
// editor.selection.clear();
// editor.selection.setAfter($new_div.get(0));
// editor.selection.restore();
// editor.selection.save();
// editor.html.insert(clone_html, false);
// } else {
// editor.html.insert('
' + '' + clone_html + '' + '
', false);
// }
if(editor.opts.pagemode != 'post') {
var blockCSS = getStyleText();
var btnCls = '';
var elName = selectEL;
var blockName = $('.' + selectEL).attr('data-name');
$($btn[0].classList).each(function(idx, cls) {
if(cls.indexOf('fr-cst-btn-') > -1) btnCls = cls;
});
if(btnCls) {
if(blockCSS.children.hasOwnProperty('.' + blockName + ' .' + btnCls + ':hover')) {
blockCSS.children['.' + blockName + ' .fr-cst-btn-' + random_num + ':hover'] = blockCSS.children['.' + blockName + ' .' + btnCls + ':hover'];
}
if(blockCSS.children.hasOwnProperty('.' + blockName + ' .' + btnCls + ':hover span')) {
blockCSS.children['.' + blockName + ' .fr-cst-btn-' + random_num + ':hover span'] = blockCSS.children['.' + blockName + ' .' + btnCls + ':hover span'];
}
$('#' + elName + 'css').html(CSSJSON.toCSS(blockCSS));
$('.' + selectEL).addClass('css-changed');
}
}
setTimeout(function() {
editor.customInsertButton.refreshToolbar();
});
}
});
$.FroalaEditor.RegisterCommand('customButtonColor', {
icon:'customButtonColor',
title: 'Button Color',
callback: function() {
var editor = this;
$('button[data-cmd="customButtonColor"]').colpick({
color:'#0088CC',
layout : 'hex',
flat : isMobile() ? true : false,
extend : true,
height: 192,
onSubmit: function (hsb, hex, rgb) {
hex = hex.toUpperCase();
// $('.fr-toolbar.fr-inline').removeClass('always');
$(this.el).data('value', '#' + hex);
var $colpick_layer = $('#' + $(this.el).data('colpickId'));
var where = $colpick_layer.find('.nav-pills li.active').data('type');
var $button = editor.customInsertButton.get();
$(this.el).colpickHide();
if(where == 'text') {
$button.css('border-color', '#'+hex);
} else if(where == 'background') {
$button.css('background-color', '#'+hex);
} else if(where == 'buttonhoverborder') {
var blockCSS = getStyleText();
var $button = editor.customInsertButton.get();
var btnCls = '';
var elName = selectEL;
var blockName = $('.' + selectEL).attr('data-name');
$($button[0].classList).each(function(idx, cls) {
if(cls.indexOf('fr-cst-btn-') > -1) btnCls = cls;
});
if(btnCls) {
if(!blockCSS.children.hasOwnProperty('.' + blockName + ' .' + btnCls + ':hover')) {
blockCSS.children['.' + blockName + ' .' + btnCls + ':hover'] = new Array();
blockCSS.children['.' + blockName + ' .' + btnCls + ':hover']['attributes'] = new Array();
}
blockCSS.children['.' + blockName + ' .' + btnCls + ':hover']['attributes']['border-color'] = '#'+hex + ' !important';
$('#' + elName + 'css').html(CSSJSON.toCSS(blockCSS));
$('.' + selectEL).addClass('css-changed');
}
} else if(where == 'buttonhoverbackground') {
var blockCSS = getStyleText();
var $button = editor.customInsertButton.get();
var btnCls = '';
var elName = selectEL;
var blockName = $('.' + selectEL).attr('data-name');
$($button[0].classList).each(function(idx, cls) {
if(cls.indexOf('fr-cst-btn-') > -1) btnCls = cls;
});
if(btnCls) {
if(!blockCSS.children.hasOwnProperty('.' + blockName + ' .' + btnCls + ':hover')) {
blockCSS.children['.' + blockName + ' .' + btnCls + ':hover'] = new Array();
blockCSS.children['.' + blockName + ' .' + btnCls + ':hover']['attributes'] = new Array();
}
blockCSS.children['.' + blockName + ' .' + btnCls + ':hover']['attributes']['background-color'] = '#'+hex + ' !important';
$('#' + elName + 'css').html(CSSJSON.toCSS(blockCSS));
$('.' + selectEL).addClass('css-changed');
}
}
if(typeof SETTINGS.favcolor == 'undefined') SETTINGS.favcolor = ['#FFFFFF','#FFFFFF','#FFFFFF','#FFFFFF','#FFFFFF','#FFFFFF','#000000'];
if(hex && SETTINGS.favcolor.indexOf('#' +hex) == -1) {
if(MODE == 'c' || MODE == 'config') {
$.ajax({
url:'/config/setFavoriteColor',
type:'post',
data:{
'sid' : SID,
'color' : '#'+hex,
},
dataType:'json',
success:function() {
SETTINGS.favcolor.push('#'+hex);
if(SETTINGS.favcolor.length > $.FroalaEditor.FAV_COLORS_COUNT) {
SETTINGS.favcolor.splice(0, SETTINGS.favcolor.length - $.FroalaEditor.FAV_COLORS_COUNT);
}
}
});
} else {
SETTINGS.favcolor.push('#'+hex);
if(SETTINGS.favcolor.length > $.FroalaEditor.FAV_COLORS_COUNT) {
SETTINGS.favcolor.splice(0, SETTINGS.favcolor.length - $.FroalaEditor.FAV_COLORS_COUNT);
}
}
}
},
onHide: function(picker) {
$(picker).removeClass('show-picker');
$($(picker).data('colpick').el).removeClass('active');
},
onBeforeShow: function() {
$(this).toggleClass('active');
},
onShow: function() {
var btn = this;
if(!$(this).hasClass('active')) {
setTimeout(function() {
$(btn).colpickHide();
});
}
var $colpick_layer = $('#' + $(this).data('colpickId'));
$colpick_layer.addClass('customButtonColor');
// $colpick_layer.find('.nav-pills').hide();
var hex = $.colpick.rgbToHex(fixRGB(rgbaToOpacity(editor.customInsertButton.get()[0].style.borderColor)));
$(this).colpickSetColor(hex.replace('#',''));
$('.colpick_hex.extend .fav-row').remove();
if(typeof SETTINGS.favcolor == 'undefined') SETTINGS.favcolor = ['#FFFFFF','#FFFFFF','#FFFFFF','#FFFFFF','#FFFFFF','#FFFFFF','#000000'];
var favcolor_html = '';
if(SETTINGS.favcolor.length) {
var gap = $.FroalaEditor.FAV_COLORS_COUNT - SETTINGS.favcolor.length;
for(var i=0; i
';
});
}
if(favcolor_html) {
$('.colpick_hex.extend .col-ex-item.color-set').prepend('' + favcolor_html + '
');
}
var $trigger = $(this);
if(($trigger.offset().top + $trigger.outerHeight() + $colpick_layer.outerHeight()) > window.innerHeight) {
var top = $trigger.offset().top;
$colpick_layer.css('top',(Number(top)-233)+'px');
}
}
});
var $colpick_layer = $('#' + $('button[data-cmd="customButtonColor"]').data('colpickId'));
if(editor.opts.pagemode != 'post') {
$colpick_layer.find('.nav-pills').addClass('row2 half');
if(!$colpick_layer.find('.nav-pills [data-type="buttonhoverborder"]').length) {
$colpick_layer.find('.nav-pills').append('' + $.FroalaEditor.LANGUAGE[LANG].translation['Button Border Color Hover'] + '');
$colpick_layer.find('.nav-pills').append('' + $.FroalaEditor.LANGUAGE[LANG].translation['Button Background Color Hover'] + '');
}
}
$colpick_layer.hide();
$colpick_layer.find('.nav-pills [data-type="text"] a').text($.FroalaEditor.LANGUAGE[LANG].translation['Button Border Color']);
$colpick_layer.find('.nav-pills [data-type="background"] a').text($.FroalaEditor.LANGUAGE[LANG].translation['Button Background Color']);
$colpick_layer.find('.nav-pills li').removeClass('active');
$colpick_layer.find('.nav-pills li:first').addClass('active');
setTimeout(function() {
editor.customInsertButton.refreshToolbar();
});
}
});
$.FroalaEditor.RegisterCommand('customButtonPaddingH', {
icon: 'customButtonPaddingH',
title: 'Button Padding H',
type: 'dropdown',
html: function() {
var h = '';
h += '- 2
';
for(var i=4; i<=80; i+=4) {
h += '- ' + i + '
';
}
h += '
';
return h;
},
callback: function(cmd, val) {
var editor = this;
var $button = editor.customInsertButton.get();
$button.css({'padding-left' : val+'px', 'padding-right' : val+'px'});
},
refreshOnShow: function(btn, dropdown) {
var editor = this;
var $button = editor.customInsertButton.get();
var padding = 0;
var padding_left = $button.css('padding-left');
var padding_right = $button.css('padding-left');
if(padding_left && padding_right && padding_left == padding_right) padding = padding_left;
if(!padding) padding = 0;
padding = padding.toString().replace('px','');
$(dropdown).find('[data-param1="' + padding + '"]').addClass('fr-active');
}
});
$.FroalaEditor.RegisterCommand('customButtonPaddingV', {
icon: 'customButtonPaddingV',
title: 'Button Padding V',
type: 'dropdown',
html: function() {
var h = '';
h += '- 2
';
for(var i=4; i<=80; i+=4) {
h += '- ' + i + '
';
}
h += '
';
return h;
},
callback: function(cmd, val) {
var editor = this;
var $button = editor.customInsertButton.get();
$button.css({'padding-top' : val+'px', 'padding-bottom' : val+'px'});
},
refreshOnShow: function(btn, dropdown) {
var editor = this;
var $button = editor.customInsertButton.get();
var padding = 0;
var padding_top = $button.css('padding-top');
var padding_bottom = $button.css('padding-bottom')
if(padding_top && padding_bottom && padding_top == padding_bottom) padding = padding_top;
if(!padding) padding = 0;
padding = padding.toString().replace('px','');
$(dropdown).find('[data-param1="' + padding + '"]').addClass('fr-active');
}
});
$.FroalaEditor.RegisterCommand('customButtonMargin', {
icon: 'customButtonMargin',
title: 'Button Margin',
type: 'dropdown',
options: {
0 : '0',
1 : '1',
2 : '2',
3 : '3',
4 : '4',
5 : '5',
6 : '6',
7 : '7',
8 : '8',
9 : '9',
10 : '10',
11 : '11',
12 : '12',
13 : '13',
14 : '14',
15 : '15',
16 : '16',
17 : '17',
18 : '18',
19 : '19',
20 : '20',
},
callback: function(cmd, val) {
var editor = this;
var $button = editor.customInsertButton.get();
$button.css({'margin-left' : val+'px', 'margin-right': val+'px'});
},
refreshOnShow: function(btn, dropdown) {
var editor = this;
var $button = editor.customInsertButton.get();
var margin = $button.css('margin-left') ? $button.css('margin-left') : $button.css('margin-right');
if(!margin) margin = 0;
margin = margin.toString().replace('px','');
$(dropdown).find('[data-param1="' + margin + '"]').addClass('fr-active');
}
});
$.FroalaEditor.RegisterCommand('customButtonBorder', {
icon: 'customButtonBorder',
title: 'Button Border Width',
type: 'dropdown',
options: {
0 : '0',
1 : '1',
2 : '2',
3 : '3',
4 : '4',
5 : '5',
6 : '6',
7 : '7',
8 : '8',
9 : '9',
10 : '10',
11 : '11',
12 : '12',
13 : '13',
14 : '14',
15 : '15',
16 : '16',
17 : '17',
18 : '18',
19 : '19',
20 : '20',
},
callback: function(cmd, val) {
var editor = this;
var $button = editor.customInsertButton.get();
$button.css({'border-width' : val+'px'});
},
refreshOnShow: function(btn, dropdown) {
var editor = this;
var $button = editor.customInsertButton.get();
var border = $button.css('border-width') ? $button.css('border-width') : 0;
border = border.toString().replace('px','');
$(dropdown).find('[data-param1="' + border + '"]').addClass('fr-active');
}
});
$.FroalaEditor.RegisterCommand('customButtonRadius', {
icon: 'customButtonRadius',
title: 'Button Radius',
type: 'dropdown',
options: {
0 : '0',
1 : '1',
2 : '2',
3 : '3',
4 : '4',
5 : '5',
6 : '6',
7 : '7',
8 : '8',
9 : '9',
10 : '10',
11 : '11',
12 : '12',
13 : '13',
14 : '14',
15 : '15',
16 : '16',
17 : '17',
18 : '18',
19 : '19',
20 : '20',
},
callback: function(cmd, val) {
var editor = this;
var $button = editor.customInsertButton.get();
$button.css({'border-radius' : val+'px'});
},
refreshOnShow: function(btn, dropdown) {
var editor = this;
var $button = editor.customInsertButton.get();
var radius = $button.css('border-radius') ? $button.css('border-radius') : 0;
radius = radius.toString().replace('px','');
$(dropdown).find('[data-param1="' + radius + '"]').addClass('fr-active');
}
});
$.FroalaEditor.RegisterCommand('customButtonAlign', {
icon: 'customButtonAlign',
title: 'Button Align',
type: 'dropdown',
options: {
'left': "",
'center': "",
'right': ""
},
html: function() {
return '\
';
},
callback: function(cmd, val) {
var editor = this;
var $button = editor.customInsertButton.get();
if($button.parents('div:first').get(0) == $(editor.$el).get(0)) {
$button.wrap('');
} else {
$button.parents('div:first').css('text-align', val);
}
editor.customInsertButton.drawResizer();
setTimeout(function() {
editor.customInsertButton.refreshToolbar();
},50);
$('button[data-cmd="customButtonAlign"]').html($('[data-cmd="customButtonAlign"][data-param1="' + val +'"]').html());
},
refreshOnShow: function($btn, $dropdown) {
var editor = this;
var $button = editor.customInsertButton.get();
var align = 'left';
align = $button.parents('div:first').css('text-align');
if(!align) {
$dropdown.find('[data-param1="left"]').addClass('fr-active');
} else {
align = align.toLowerCase();
if(align == 'start') align = 'left';
$dropdown.find('[data-param1="' + align +'"]').addClass('fr-active');
}
}
});
$.FroalaEditor.RegisterCommand('customButtonLink', {
icon: 'customButtonLink',
title: 'Link',
callback: function() {
var editor = this;
editor.link.showInsertPopup();
editor.selection.setAfter(editor.customInsertButton.get()[0]);
$('button[data-cmd="customButtonLink"]').addClass('active');
}
});
$.FroalaEditor.RegisterCommand('customImageLink', {
icon: 'customImageLink',
title: 'Link',
callback: function() {
var editor = this;
editor.image.linkimage = editor.image.get();
editor.image.exitEdit(true);
editor.selection.setAfter(editor.image.linkimage);
editor.link.showInsertPopup();
}
});
$.FroalaEditor.RegisterCommand('customButtonUnlink', {
icon: 'customButtonUnlink',
title: 'Unlink',
callback: function() {
var editor = this;
var $button = editor.customInsertButton.get();
if($button.length) {
$button.removeAttr('href')
.removeAttr('data-href')
.removeAttr('data-external-link')
.removeAttr('data-user-link')
.removeAttr('attr-flink')
.removeAttr('attr-bookmark')
.removeAttr('target');
}
},
});
$.FroalaEditor.RegisterCommand('customButtonDetail', {
icon: 'settingCustomButton',
title: 'Detail Setting',
callback: function() {
var editor = this;
// editor.customInsertButton.hideToolbar();
editor.customInsertButton.showPopup();
// $(editor.popups.get('customInsertButton.toolbar')).addClass('always');
}
});
$.FroalaEditor.RegisterCommand('customButtonLinkInsert', {
callback: function() {
var editor = this;
var $button = editor.customInsertButton.get();
var $link_popup = $(editor.popups.get('link.insert'));
var link_type = $link_popup.find('.link-content .link-type.active > div').attr('class');
if(editor.opts.pagemode == 'post') link_type = 'link-out';
var link_val = $link_popup.find('input[name="href"]').val();
$button.attr('href', link_val).attr('data-href', link_val).attr('data-external-link', '').attr('data-user-link', '').attr('attr-flink', '').attr('attr-bookmark', '');
switch(link_type) {
case 'link-out' :
if(link_val) {
if(link_val.toLowerCase().indexOf('http://') == -1 && link_val.toLowerCase().indexOf('https://') == -1 && link_val.toLowerCase().indexOf('tel:') == -1) link_val = 'http://' + link_val;
}
$button.attr('data-external-link', link_val);
break;
case 'link-menu' :
$button.attr('data-user-link', link_val);
break;
case 'link-bookmark' :
var val = $link_popup.find('input[name="attr-bookmark"]').val();
$button.attr('attr-bookmark', val);
break;
case 'link-file' :
var val = $link_popup.find('input[name="attr-flink"]').val();
$button.attr('attr-flink', val);
break;
case 'link-default' :
$button.removeAttr('href')
.removeAttr('data-href')
.removeAttr('data-external-link')
.removeAttr('data-user-link')
.removeAttr('attr-flink')
.removeAttr('attr-bookmark')
.removeAttr('target');
break;
}
var chk_new_win = $link_popup.find('input[name="target"]').prop('checked');
if(chk_new_win) {
$button.attr('target', '_blank');
} else {
$button.attr('target', '');
}
editor.popups.hide('link.insert');
}
});
$.FroalaEditor.RegisterCommand('customImageLinkInsert', {
callback: function() {
var editor = this;
var $image = $(editor.image.linkimage);
var $link_popup = $(editor.popups.get('link.insert'));
var link_type = $link_popup.find('.link-content .link-type.active > div').attr('class');
var link_val = $link_popup.find('input[name="href"]').val();
$image.attr('href', link_val).attr('data-href', link_val).attr('data-external-link', '').attr('data-user-link', '').attr('attr-flink', '').attr('attr-bookmark', '');
switch(link_type) {
case 'link-out' :
if(link_val) {
if(link_val.toLowerCase().indexOf('http://') == -1 && link_val.toLowerCase().indexOf('https://') == -1 && link_val.toLowerCase().indexOf('tel:') == -1) link_val = 'http://' + link_val;
}
$image.attr('data-external-link', link_val);
break;
case 'link-menu' :
$image.attr('data-user-link', link_val);
break;
case 'link-bookmark' :
var val = $link_popup.find('input[name="attr-bookmark"]').val();
$image.attr('attr-bookmark', val);
break;
case 'link-file' :
var val = $link_popup.find('input[name="attr-flink"]').val();
$image.attr('attr-flink', val);
break;
case 'link-default' :
$image.removeAttr('href')
.removeAttr('data-href')
.removeAttr('data-external-link')
.removeAttr('data-user-link')
.removeAttr('attr-flink')
.removeAttr('attr-bookmark')
.removeAttr('target');
break;
}
var chk_new_win = $link_popup.find('input[name="target"]').prop('checked');
if(chk_new_win) {
$image.attr('target', '_blank');
} else {
$image.attr('target', '');
}
editor.image.edit(editor.image.linkimage);
}
});
// Object.assign(FroalaEditor.DEFAULTS, {
// popupButtons: ['back', '|', 'popupButton1', 'popupButton2'],
// });
$.FroalaEditor.PLUGINS.customInsertButton = function(editor) {
function init() {
// $(editor.$el).find('.fr-custom-button').attr('contenteditable', false);
$(editor.$el).find('.fr-custom-button').each(function() {
$(this).addClass('fr-inner');
if($(this).attr('class').indexOf('fr-cst-btn-') == -1) {
var random_num = Math.floor((Date.now() + Math.random()) * 1000);
$(this).addClass('fr-cst-btn-' + random_num);
}
btnInvisibleSpace();
});
$(editor.$el).on('click', '.fr-custom-button', function(e) {
e.preventDefault();
e.stopPropagation();
$('.fr-custom-button').removeClass('fr-active');
$(this).addClass('fr-active');
// editor.selection.save();
drawResizer();
showToolbar();
btnInvisibleSpace();
// editor.selection.clear();
if(this != $(editor.selection.element()).closest('.fr-custom-button').get(0)) {
editor.selection.setAtEnd(this);
editor.selection.restore();
}
});
$(editor.$el).on('mousedown', function(e) {
if(!$(e.target).hasClass('fr-custom-button') && !$('.fr-custom-button').has(e.target).length) {
$('.fr-custom-button.fr-active').removeClass('fr-active');
hidePopup();
removeResizer();
}
});
$(document).on('selectionchange', function(e) {
// console.log('selection changed');
// console.log(e);
function removeInvisibleSpace(node) {
var newStr = '';
var text = $(node).text();
for(var i=0; i
');
// } else {
// $(this).before('');
// }
// if($(this).next().length) {
// if($(this).next().text().charCodeAt(0) != 8204)
// $(this).after('');
// } else {
// $(this).after('');
// }
if($(this).contents().length) {
if($(this).find('span:last').length == 0 && $($(this).contents()[0]).text().charCodeAt(0) != 8204 && $($(this).contents()[0]).text().charCodeAt(0) != 8203) {
$(this).prepend('');
} else {
if($(this).find('span:last').length > 0) {
// console.log($($(this).find('span:last').parent().contents()[0]).text().charCodeAt(0));
if($($(this).find('span:last').parent().contents()[0]).text().charCodeAt(0) != 8204 && $($(this).find('span:last').parent().contents()[0]).text().charCodeAt(0) != 8203) {
$(this).find('span:last').before('');
}
// $(this).find('span:last').parent().contents().each(function() {
// if($(this).text().charCodeAt(0) == 8204 && $(this).text().length == 1) {
// $(this).remove();
// }
// });
}
}
}
if($(this).parent().contents().length) {
var $content = $(this).parent().contents();
var $parent = $(this).parent();
$content.each(function(idx) {
if(!$(this).hasClass('fr-custom-button')) return;
if(idx < $content.length && $($content[idx-1]).text().charCodeAt(0) != 8204 && $($content[idx-1]).text().charCodeAt(0) != 8203) {
$(this).before('');
// console.log('insert zerowidth');
}
if(idx+1 <= $content.length && $($content[idx-1]).text().charCodeAt(0) != 8204 && $($content[idx-1]).text().charCodeAt(0) != 8203) {
$(this).after('');
}
if($parent.find('.fr-custom-button').length == 1 && (typeof $($content[idx+1]) == 'undefined' || ($($content[idx+1]).text().charCodeAt(0) != 8204 && $($content[idx+1]).text().charCodeAt(0) != 8203))) {
$parent.find('.fr-custom-button').after('');
}
});
// if($($(this).parent().contents()[0]).text().charCodeAt(0) != 8204) {
// $(this).parent().prepend('');
// }
// if($($(this).parent().contents()[$(this).parent().contents().length-1]).text().charCodeAt(0) != 8204) {
// $(this).parent().append('');
// }
}
// if($(this).contents().length) {
// if($($(this).contents()[0]).text().charCodeAt(0) != 8204) {
// $(this).prepend('');
// }
// if($($(this).contents()[$(this).contents().length-1]).text().charCodeAt(0) != 8204) {
// $(this).append('');
// }
// }
// $(this).find('span:first').prepend('' + $.FroalaEditor.INVISIBLE_SPACE + '');
});
}
function get() {
return $(editor.$el).find('.fr-custom-button.fr-active');
}
function initPopup() {
var popup_buttons = '';
var template = {
buttons: popup_buttons,
custom_layer: '\
\
\
\
\
\
\
\
텍스트
\
\
\
' + clSVG('pencil',14,14) + '
\
\
\
\
\
\
\
\
\
\
\
\
\
\
\
\
'
}
var $popup = editor.popups.create('customInsertButton.popup', template);
$($popup).addClass('fr-insert-custom-button');
$($popup).on('mouseup', function(e) {
if($('.fr-insert-custom-button').has($(e.target).length) || $('.fr-insert-custom-button')[0] == e.target) {
$($popup).addClass('fr-active');
}
});
$($popup).on('mouseup', function() {
$($popup).find('.cog-btn-slider').each(function() {
if($(this).data('slider')) {
if($(this).data('slider').inDrag) $(this).data('slider').mouseup();
}
});
});
$($popup).find('.btn-button-text-edit').on('click', function() {
$($popup).find('.button-text-viewer').hide();
$($popup).find('.button-text-editor').show();
$($popup).find('.button-text-editor [name="btn_text"]').val($($popup).find('.button-text-viewer .button-text').text());
});
$($popup).find('.btn-button-text-cancel').on('click', function() {
$($popup).find('.button-text-viewer').show();
$($popup).find('.button-text-editor').hide();
$($popup).find('.button-text-editor [name="btn_text"]').val("");
})
$($popup).find('.btn-button-text-ok').on('click', function() {
var $button = get();
var new_text = $($popup).find('.button-text-editor [name="btn_text"]').val();
$button.text(new_text);
$($popup).find('.button-text-viewer .button-text').text(new_text);
$($popup).find('.button-text-viewer').show();
$($popup).find('.button-text-editor').hide();
$($popup).find('.button-text-editor [name="btn_text"]').val("");
drawResizer();
refreshToolbar();
});
$($popup).find('.cog-btn-colpick').colpick({
color:'#0088CC',
layout : 'hex',
extend : true,
onSubmit: function (hsb, hex, rgb) {
hex = hex.toUpperCase();
// $('.fr-toolbar.fr-inline').removeClass('always');
$(this.el).data('value', '#' + hex);
$(this.el).colpickHide();
$(this.el).css('background-color', '#'+hex);
if(typeof SETTINGS.favcolor == 'undefined') SETTINGS.favcolor = ['#FFFFFF','#FFFFFF','#FFFFFF','#FFFFFF','#FFFFFF','#FFFFFF','#000000'];
if(hex && SETTINGS.favcolor.indexOf('#' +hex) == -1) {
if(MODE == 'c' || MODE == 'config') {
$.ajax({
url:'/config/setFavoriteColor',
type:'post',
data:{
'sid' : SID,
'color' : '#'+hex,
},
dataType:'json',
success:function() {
SETTINGS.favcolor.push('#'+hex);
if(SETTINGS.favcolor.length > $.FroalaEditor.FAV_COLORS_COUNT) {
SETTINGS.favcolor.splice(0, SETTINGS.favcolor.length - $.FroalaEditor.FAV_COLORS_COUNT);
}
}
});
} else {
SETTINGS.favcolor.push('#'+hex);
if(SETTINGS.favcolor.length > $.FroalaEditor.FAV_COLORS_COUNT) {
SETTINGS.favcolor.splice(0, SETTINGS.favcolor.length - $.FroalaEditor.FAV_COLORS_COUNT);
}
}
}
},
onHide: function(picker) {
$(picker).removeClass('show-picker');
$($(picker).data('colpick').el).removeClass('active');
},
onBeforeShow: function() {
$(this).toggleClass('active');
},
onShow: function() {
var $colpick_layer = $('#' + $(this).data('colpickId'));
$colpick_layer.find('.nav-pills').hide();
var hex = $(this).data('value');
$(this).colpickSetColor(hex.replace('#',''));
$('.colpick_hex.extend .fav-row').remove();
if(typeof SETTINGS.favcolor == 'undefined') SETTINGS.favcolor = ['#FFFFFF','#FFFFFF','#FFFFFF','#FFFFFF','#FFFFFF','#FFFFFF','#000000'];
var favcolor_html = '';
if(SETTINGS.favcolor.length) {
var gap = $.FroalaEditor.FAV_COLORS_COUNT - SETTINGS.favcolor.length;
for(var i=0; i';
});
}
if(favcolor_html) {
$('.colpick_hex.extend .col-ex-item.color-set').prepend('' + favcolor_html + '
');
}
var $trigger = $(this);
if(($trigger.offset().top + $trigger.outerHeight() + $colpick_layer.outerHeight()) > window.innerHeight) {
var top = $trigger.offset().top;
$colpick_layer.css('top',(Number(top)-201)+'px');
}
}
});
$($popup).on('mousedown', function(e) {
var container = $('.bs-bg-picker');
if(e.target != $('.bs-bg-picker').get(0)) {
$('.bs-bg-picker').colpickHide();
}
var container = $('.bs-bd-picker');
if(e.target != $('.bs-bd-picker').get(0)) {
$('.bs-bd-picker').colpickHide();
}
});
return $popup;
}
function initToolbar() {
var popup_buttons = '';
var popupButtons = ['customButtonLink'/*,'customButtonUnlink'*/,'customButtonColor','customButtonRadius','customButtonBorder','customButtonAlign','customButtonPaddingH','customButtonPaddingV'/*,'customButtonMargin','customButtonInsert'*/,'customButtonCopy','custom-button-enter','customButtonRemove'];
popup_buttons += '';
popup_buttons += editor.button.buildList(popupButtons);
popup_buttons += '
';
var template = { buttons: popup_buttons };
var $toolbar = editor.popups.create('customInsertButton.toolbar', template);
$($toolbar).addClass('fr-custom-button-toolbar');
editor.popups.show('customInsertButton.toolbar');
editor.popups.hide('customInsertButton.toolbar');
return $toolbar;
}
function showPopup() {
var $popup = editor.popups.get('customInsertButton.popup');
if(!$popup) $popup = initPopup();
// editor.popups.setContainer('customInsertButton.popup', editor.$tb);
var $button = get();
var lr_mg = ud_mg = lr_pd = ud_pd = bd = round = 0;
var text = $button.text();
var bg_color = $button.css('background-color');
var bd_color = $button.css('border-color');
lr_mg = Number($button.css('margin-left').replace('px', ''));
ud_mg = Number($button.css('margin-top').replace('px', ''));
lr_pd = Number($button.css('padding-left').replace('px', ''));
ud_pd = Number($button.css('padding-top').replace('px', ''));
bd = Number($button.css('border-width').replace('px', ''));
round = Number($button.css('border-radius').replace('px', ''));
$($popup).find('.lr-mg-value').text(lr_mg);
$($popup).find('.ud-mg-value').text(ud_mg);
$($popup).find('.lr-pd-value').text(lr_pd);
$($popup).find('.ud-pd-value').text(ud_pd);
$($popup).find('.bd-value').text(bd);
$($popup).find('.round-value').text(round);
$($popup).find('.button-text').text(text);
$($popup).find('.bs-bg-picker').attr('data-value', bg_color).data('value', bg_color).css('background-color', bg_color);
$($popup).find('.bs-bd-picker').attr('data-value', bd_color).data('value', bd_color).css('background-color', bd_color);
$($popup).find('.lr-mg-slider').slider({
'orientation': 'horizontal',
'min' : 0,
'max' : 20,
'step' : 1,
'value' : lr_mg,
'handle' : 'round',
// 'reversed' : true,
'tooltip' : 'hide',
}).on('slide', function(data) {
$($popup).find('.lr-mg-value').text(data.value);
var $button = get();
$button.css({'margin-left': data.value, 'margin-right': data.value});
drawResizer();
refreshToolbar();
}).on('slideStop', function(data) {
$($popup).find('.lr-mg-value').text(data.value);
var $button = get();
$button.css({'margin-left': data.value, 'margin-right': data.value});
drawResizer();
refreshToolbar();
});
$($popup).find('.ud-mg-slider').slider({
'orientation': 'horizontal',
'min' : 0,
'max' : 20,
'step' : 1,
'value' : ud_mg,
'handle' : 'round',
// 'reversed' : true,
'tooltip' : 'hide',
}).on('slide', function(data) {
$($popup).find('.ud-mg-value').text(data.value);
var $button = get();
$button.css({'margin-top': data.value, 'margin-bottom': data.value});
drawResizer();
refreshToolbar();
}).on('slideStop', function(data) {
$($popup).find('.ud-mg-value').text(data.value);
var $button = get();
$button.css({'margin-top': data.value, 'margin-bottom': data.value});
drawResizer();
refreshToolbar();
});
$($popup).find('.lr-pd-slider').slider({
'orientation': 'horizontal',
'min' : 0,
'max' : 20,
'step' : 1,
'value' : lr_pd,
'handle' : 'round',
// 'reversed' : true,
'tooltip' : 'hide',
}).on('slide', function(data) {
$($popup).find('.lr-pd-value').text(data.value);
var $button = get();
$button.css({'padding-left': data.value, 'padding-right': data.value});
drawResizer();
refreshToolbar();
}).on('slideStop', function(data) {
$($popup).find('.lr-pd-value').text(data.value);
var $button = get();
$button.css({'padding-left': data.value, 'padding-right': data.value});
drawResizer();
refreshToolbar();
});
$($popup).find('.ud-pd-slider').slider({
'orientation': 'horizontal',
'min' : 0,
'max' : 20,
'step' : 1,
'value' : ud_pd,
'handle' : 'round',
// 'reversed' : true,
'tooltip' : 'hide',
}).on('slide', function(data) {
$($popup).find('.ud-pd-value').text(data.value);
var $button = get();
$button.css({'padding-top': data.value, 'padding-bottom': data.value});
drawResizer();
refreshToolbar();
}).on('slideStop', function(data) {
$($popup).find('.ud-pd-value').text(data.value);
var $button = get();
$button.css({'padding-top': data.value, 'padding-bottom': data.value});
drawResizer();
refreshToolbar();
});
$($popup).find('.bd-slider').slider({
'orientation': 'horizontal',
'min' : 0,
'max' : 20,
'step' : 1,
'value' : bd,
'handle' : 'round',
// 'reversed' : true,
'tooltip' : 'hide',
}).on('slide', function(data) {
$($popup).find('.bd-value').text(data.value);
var $button = get();
$button.css({'border-width': data.value});
drawResizer();
refreshToolbar();
}).on('slideStop', function(data) {
$($popup).find('.bd-value').text(data.value);
var $button = get();
$button.css({'border-width': data.value});
drawResizer();
refreshToolbar();
});
$($popup).find('.round-slider').slider({
'orientation': 'horizontal',
'min' : 0,
'max' : 20,
'step' : 1,
'value' : round,
'handle' : 'round',
// 'reversed' : true,
'tooltip' : 'hide',
}).on('slide', function(data) {
$($popup).find('.round-value').text(data.value);
var $button = get();
$button.css('border-radius', data.value);
drawResizer();
refreshToolbar();
}).on('slideStop', function(data) {
$($popup).find('.round-value').text(data.value);
var $button = get();
$button.css('border-radius', data.value);
drawResizer();
refreshToolbar();
});
editor.popups.show('customInsertButton.popup');
}
function showToolbar() {
// console.log('button toolbar show');
var $toolbar = editor.popups.get('customInsertButton.toolbar');
if(!$toolbar) $toolbar = initToolbar();
// editor.popups.setContainer('customInsertButton.toolbar', editor.$box);
// editor.popups.show('customInsertButton.toolbar');
$toolbar.addClass('fr-active');
var $button = get();
if($button.length) {
var align = 'left';
align = $button.parents('div:first').css('text-align');
switch (align) {
case 'left' :
$('button[data-cmd="customButtonAlign"]').html(FroalaEditor.COMMANDS.customButtonAlign.options.left);
break;
case 'center' :
$('button[data-cmd="customButtonAlign"]').html(FroalaEditor.COMMANDS.customButtonAlign.options.center);
break;
case 'right' :
$('button[data-cmd="customButtonAlign"]').html(FroalaEditor.COMMANDS.customButtonAlign.options.right);
break;
default:
$('button[data-cmd="customButtonAlign"]').html(FroalaEditor.COMMANDS.customButtonAlign.options.left);
break;
}
}
refreshToolbar();
}
function refreshToolbar() {
var $resizer = $('.fr-button-resizer'), $toolbar = editor.popups.get('customInsertButton.toolbar');
if(!get().length) {
// editor.popups.hide('customInsertButton.toolbar');
if($toolbar) $toolbar.removeClass('fr-active');
if(editor.selection.isCollapsed()) editor.toolbar.hide();
return false;
} else {
var isLink = get().attr('href') ? true : false;
}
if(!isLink) {
$($toolbar).find('[data-cmd="customButtonUnlink"]').hide();
} else {
$($toolbar).find('[data-cmd="customButtonUnlink"]').show();
}
var toolbar_top = 0, toolbar_left = 0;
toolbar_top = $resizer.offset().top + $resizer.outerHeight() - 7;
toolbar_left = $resizer.offset().left + $resizer.outerWidth() / 2 - $($toolbar).outerWidth() / 2;
$($toolbar).css({'left' : toolbar_left, 'right' : '' });
if((toolbar_left + $($toolbar).outerWidth()) > window.innerWidth) {
$($toolbar).css({'left' : '', 'right' : '0' });
}
if(toolbar_left < 0) {
$($toolbar).css({'left' : '0', 'right': ''});
}
if(toolbar_top + $($toolbar).outerHeight(true) > $(window).height()) {
toolbar_top = toolbar_top - ($resizer.outerHeight() + $($toolbar).outerHeight(true));
}
$($toolbar).css({'top' : toolbar_top });
setTimeout(function() {
if(!get().length) {
// editor.popups.hide('customInsertButton.toolbar');
$toolbar.removeClass('fr-active');
if(!editor.selection.isCollapsed()) editor.toolbar.show();
} else {
if(editor.selection.isCollapsed()) {
editor.toolbar.hide();
if($toolbar) {
$toolbar.addClass('fr-active');
if(isLink) {
$toolbar.find('[data-cmd="customButtonLink"]').addClass('fr-active');
} else {
$toolbar.find('[data-cmd="customButtonLink"]').removeClass('fr-active');
}
}
} else {
// editor.popups.hide('customInsertButton.toolbar');
$toolbar.removeClass('fr-active');
editor.toolbar.show();
}
}
});
}
function hidePopup() {
editor.popups.hide('customInsertButton.popup');
$(editor.popups.get('customInsertButton.toolbar')).removeClass('always');
}
function hideToolbar() {
editor.popups.hide('customInsertButton.toolbar');
}
function initResizer() {
$(editor.$box).find('.fr-button-resizer').remove();
var $resizer = $('');
$resizer.hide();
$(editor.$wp).append($resizer);
return $resizer;
}
function removeResizer() {
$(editor.$box).find('.fr-button-resizer').remove();
}
function drawResizer() {
var focus_layer;
if($(editor.$box).find('.fr-button-resizer').length) {
focus_layer = $(editor.$box).find('.fr-button-resizer');
} else {
focus_layer = initResizer();
}
var target = get()[0];
if(!target) {
focus_layer.hide();
return false;
}
var container_offset_x = $(editor.$el).offset().left;
var container_offset_y = $(editor.$el).offset().top;
var target_offset_x = $(target).offset().left;
var target_offset_y = $(target).offset().top;
var target_height = $(target).outerHeight(true);
var target_width = $(target).outerWidth(true);
var target_border = target.style.borderWidth;
var target_margin_top = Number($(target).css('margin-top').replace('px', ''));
var target_margin_bottom = Number($(target).css('margin-bottom').replace('px', ''));
var target_margin_left = Number($(target).css('margin-left').replace('px', ''));
var target_margin_right = Number($(target).css('margin-right').replace('px', ''));
// target_height += target_margin_top + target_margin_bottom;
// target_width += target_margin_left + target_margin_right;
if(target_border) target_border = target_border.replace('px', '');
target_border = Number(target_border);
focus_layer.css('margin-top', target_margin_top * -1);
focus_layer.css('margin-left', target_margin_left * -1);
focus_layer.css('left', target_offset_x - container_offset_x);
focus_layer.css('top', target_offset_y - container_offset_y);
focus_layer.css('height', target_height);
focus_layer.css('width', target_width);
focus_layer.css('border', '1px solid #0098f7');
focus_layer.css('position', 'absolute');
focus_layer.show();
}
return {
init: init,
showPopup: showPopup,
showToolbar: showToolbar,
hidePopup: hidePopup,
hideToolbar: hideToolbar,
drawResizer: drawResizer,
refreshToolbar: refreshToolbar,
get: get,
btnInvisibleSpace: btnInvisibleSpace
}
}
$.FroalaEditor.PLUGINS.customInsertHR = function(editor) {
var left_down = false;
var right_down = false;
var align = 'center';
var resizerMoveLeft = function(e) {
if(left_down == true) {
var focus_layer = $(editor.$wp).find('.fr-hr-resizer');
var resizer_left = focus_layer.find('.fr-left'),
resizer_right = focus_layer.find('.fr-right');
var $hr = get();
align = $hr.attr('align') ? $hr.attr('align').toLowerCase() : align;
var resizer_x_min = $(editor.$wp).offset().left;
var resizer_x_max = $(editor.$wp).offset().left + $(editor.$wp).outerWidth();
var offset_sx = Number(resizer_left.attr('data-sx'));
var resizer_left_width = resizer_left.outerWidth();
var pointer_x = 0;
if(e.type == 'mousemove' || e.type == 'mouseup') {
pointer_x = e.originalEvent.pageX;
} else if(e.type == 'touchmove' || e.type == 'touchend') {
pointer_x = e.originalEvent.changedTouches[0].pageX;
}
var real_gap = (offset_sx - pointer_x);
var beforeWidth = Number(resizer_left.attr('data-swidth'));
var xy_gap = beforeWidth + real_gap;
if(xy_gap > $(editor.$wp).outerWidth()) xy_gap = $(editor.$wp).outerWidth();
if(xy_gap < 10) xy_gap = 10;
$hr.css('width', xy_gap);
drawResizer();
refreshToolbar();
$('.fr-insert-hr').removeClass('fr-active');
}
}
var resizerMoveRight = function(e) {
// console.log(right_down)
if(right_down == true) {
var focus_layer = $(editor.$wp).find('.fr-hr-resizer');
var resizer_left = focus_layer.find('.fr-left'),
resizer_right = focus_layer.find('.fr-right');
var $hr = get();
align = $hr.attr('align') ? $hr.attr('align').toLowerCase() : align;
var resizer_x_min = $(editor.$wp).offset().left;
var resizer_x_max = $(editor.$wp).offset().left + $(editor.$wp).outerWidth();
var offset_sx = Number(resizer_right.attr('data-sx'));
var resizer_left_width = resizer_right.outerWidth();
var pointer_x = 0;
if(e.type == 'mousemove' || e.type == 'mouseup') {
pointer_x = e.originalEvent.pageX;
} else if(e.type == 'touchmove' || e.type == 'touchend') {
pointer_x = e.originalEvent.changedTouches[0].pageX;
}
var real_gap = (offset_sx - pointer_x);
var beforeWidth = Number(resizer_right.attr('data-swidth'));
var xy_gap = beforeWidth - real_gap;
if(xy_gap > $(editor.$wp).outerWidth()) xy_gap = $(editor.$wp).outerWidth();
if(xy_gap < 10) xy_gap = 10;
$hr.css('width', xy_gap);
drawResizer();
refreshToolbar();
$('.fr-insert-hr').removeClass('fr-active');
}
}
var resizerUp = function(e) {
if(left_down || right_down) {
e.preventDefault();
e.stopPropagation();
showPopup();
editor.quickInsert.hide();
editor.selection.clear();
}
left_down = false;
right_down = false;
$(editor.$wp).find('.fr-hr-resizer.fr-active').removeClass('fr-active');
$(document).off('mousemove touchmove', resizerMoveLeft);
$(document).off('mousemove touchmove', resizerMoveRight);
$('.fr-hr-overlay').remove();
}
var resizerDown = function(e) {
var $hr = get();
if($(e.currentTarget).hasClass('fr-left')) {
left_down = true;
}
if($(e.currentTarget).hasClass('fr-right')) {
right_down = true;
}
if(e.type == 'mousedown') {
$(e.currentTarget).attr('data-sx', e.originalEvent.pageX);
// $(e.currentTarget).attr('data-sy', e.originalEvent.pageY);
} else if(e.type == 'touchstart') {
$(e.currentTarget).attr('data-sx', e.originalEvent.changedTouches[0].pageX);
// $(e.currentTarget).attr('data-sy', e.originalEvent.changedTouches[0].pageY);
}
if(!$('.fr-hr-overlay').length) $('body').append('');
$('.fr-hr-overlay').show();
$(e.currentTarget).attr('data-swidth', $hr.outerWidth());
$(editor.$wp).find('.fr-hr-resizer').addClass('fr-active');
$(document).on('mousemove touchmove', resizerMoveLeft);
$(document).on('mousemove touchmove', resizerMoveRight);
$(document).off('mouseup touchend', resizerUp);
$(document).on('mouseup touchend', resizerUp);
}
function init() {
$('.fr-insert-hr').remove();
$(editor.$el).on('click', 'hr', function(e) {
e.preventDefault();
e.stopPropagation();
// $(editor.$el).focus();
var target = this;
editor.selection.setAfter(target);
editor.selection.save();
editor.quickInsert.hide();
$('.fr-hr').removeClass('fr-active');
$(target).addClass('fr-active');
showPopup();
});
$(editor.$wp).on('click', '.fr-hr-resizer', function(e) {
editor.selection.save();
showPopup();
// editor.selection.clear();
// e.preventDefault();
// e.stopPropagation();
// showPopup();
});
$(editor.$wp).off('mousedown touchstart', '.fr-hr-resizer .fr-left, .fr-hr-resizer .fr-right', resizerDown);
$(editor.$wp).on('mousedown touchstart', '.fr-hr-resizer .fr-left, .fr-hr-resizer .fr-right', resizerDown);
$(editor.$el).on('mousedown', function(e) {
if(e.target.nodeName.toLowerCase() !== 'hr' && !$('.fr-hr-resizer').has($(e.target)).length && e.target != $('.fr-hr-resizer').get(0)) {
$('.fr-hr.fr-active').removeClass('fr-active');
hidePopup();
}
});
$(window).resize(function() {
if(get().length) {
drawResizer();
refreshToolbar();
}
});
}
function get() {
return $(editor.$box).find('.fr-hr.fr-active');
}
function refreshToolbar() {
var $popup = editor.popups.get('customInsertHR.popup');
var $resizer = $('.fr-hr-resizer');
if(!$('.fr-hr-resizer').length) return;
var toolbar_top = 0, toolbar_left = 0;
toolbar_top = $resizer.offset().top + $resizer.outerHeight() - 7;
toolbar_left = $resizer.offset().left + $resizer.outerWidth() / 2 - $($popup).outerWidth() / 2;
$($popup).css({'left' : toolbar_left, 'right' : '' });
if((toolbar_left + $($popup).outerWidth()) > window.innerWidth) {
$($popup).css({'left' : '', 'right' : '0' });
}
if(toolbar_left < 0) {
$($popup).css({'left' : '0', 'right': ''});
}
if(toolbar_top + $($popup).outerHeight(true) > $(window).height()) {
toolbar_top = toolbar_top - ($resizer.outerHeight() + $($popup).outerHeight(true));
}
$($popup).css({'top' : toolbar_top });
}
function initResizer() {
$(editor.$box).find('.fr-hr-resizer').remove();
var $resizer = $('');
$resizer.hide();
$(editor.$wp).append($resizer);
return $resizer;
}
function removeResizer() {
$(editor.$box).find('.fr-hr-resizer').remove();
}
function drawResizer() {
$(editor.$tb).removeClass('always');
var focus_layer;
if($(editor.$box).find('.fr-hr-resizer').length) {
focus_layer = $(editor.$box).find('.fr-hr-resizer');
} else {
focus_layer = initResizer();
}
var target = get()[0];
if(!target) {
focus_layer.hide();
return false;
}
var container_offset_x = $(editor.$el).offset().left;
var container_offset_y = $(editor.$el).offset().top;
var target_offset_x = $(target).offset().left;
var target_offset_y = $(target).offset().top;
// var target_height = $(target).outerHeight();
var target_height = Number($(target).css('border-bottom-width').replace('px', ''));
var target_width = $(target).outerWidth();
var target_margin_top = Number($(target).css('margin-top').replace('px', ''));
var target_margin_bottom = Number($(target).css('margin-bottom').replace('px', ''));
var target_border = target.style.borderWidth;
if(target_border) target_border = target_border.replace('px', '');
target_border = Number(target_border);
target_height += target_margin_top + target_margin_bottom;
focus_layer.css('left', target_offset_x - container_offset_x);
focus_layer.css('top', target_offset_y - container_offset_y - target_margin_top);
focus_layer.css('height', target_height);
focus_layer.css('width', target_width);
focus_layer.css('border', '1px solid #0098f7');
focus_layer.css('position', 'absolute');
focus_layer.show();
}
function initPopup() {
var popup_buttons = '';
var popupButtons = ['hrBorderColor','hrBorderWidth','hrAlign','hrMargin','hr-enter','hrRemove'];
popup_buttons += '';
popup_buttons += editor.button.buildList(popupButtons);
popup_buttons += '
';
var template = { buttons: popup_buttons};
var $popup = editor.popups.create('customInsertHR.popup', template);
$($popup).addClass('fr-insert-hr');
return $popup;
}
function showPopup() {
var $popup = editor.popups.get('customInsertHR.popup');
if(!$popup) $popup = initPopup();
editor.popups.show('customInsertHR.popup');
drawResizer();
var $hr = get();
if($hr.length) {
var align = 'center';
if($hr.is('[align]')) align = $hr.attr('align');
$('button[data-cmd="hrAlign"]').html(FroalaEditor.ICONS['align-' + align]['NAME']);
}
refreshToolbar();
popPos = $(editor.popups.get('customInsertHR.popup')).css('top').replace('px', '');
}
function hidePopup () {
editor.popups.hide('customInsertHR.popup');
$('button[data-cmd="hrBorderColor"]').removeClass('active').colpickHide();
removeResizer();
}
return {
showPopup: showPopup,
hidePopup: hidePopup,
init: init,
get: get,
drawResizer: drawResizer,
refreshToolbar: refreshToolbar,
left_down: left_down,
right_down: right_down,
resizerDown: resizerDown
}
}
$.FroalaEditor.PLUGINS.customQuickInsert = function(editor) {
function initPopup() {
var popup_buttons = '';
var popupButtons = ['insertImageButton','insertVideoButton','insertFileButton','insertTableButton','insertCustomButton','insertHR'];
popup_buttons += editor.button.buildList(popupButtons);
var template = { buttons: popup_buttons };
var $popup = editor.popups.create('customQuickInsert.popup', template);
$($popup).addClass('fr-mobile-quick-insert fr-mobile');
return $popup;
}
function showPopup() {
var $popup = editor.popups.get('customQuickInsert.popup');
if(!$popup) $popup = initPopup();
// editor.popups.setContainer('customQuickInsert.popup', $('body'));
editor.popups.show('customQuickInsert.popup');
// editor.popups.hide('customQuickInsert.popup');
}
function hidePopup () {
editor.popups.hide('customQuickInsert.popup');
}
return {
showPopup: showPopup,
hidePopup: hidePopup
}
}
$.FroalaEditor.PLUGINS.customInsertTable = function(editor) {
function initPopup() {
var popup_buttons = '';
// if(editor.opts.popupButtons.length > 1) {
// popup_buttons += '';
// }
var template = {
buttons: popup_buttons,
custom_layer: '\
\
'
};
var $popup = editor.popups.create('customInsertTable.popup', template);
var max_table_row_cnt = 10, max_table_col_cnt = 10;
$($popup).find('input[name="style_type"], input[name="table_row_cnt"], input[name="table_col_cnt"]').on('input change', function() {
var row_cnt = Number($('.row-cnt-box input').val());
if(row_cnt > max_table_row_cnt) row_cnt = max_table_row_cnt;
if(row_cnt < 1) row_cnt = 1;
$($popup).find('.row-cnt-box input').val(row_cnt);
var col_cnt = Number($('.col-cnt-box input').val());
if(col_cnt > max_table_col_cnt) col_cnt = max_table_col_cnt;
if(col_cnt < 1) col_cnt = 1;
$($popup).find('.col-cnt-box input').val(col_cnt);
renderPreviewTable();
if($($popup).find('input[name="style_type"]:checked').val() == 'preset') {
$($popup).find('.style-box').show();
$($popup).find('.custom-box').hide();
} else if($($popup).find('input[name="style_type"]:checked').val() == 'custom') {
$($popup).find('.custom-box').show();
$($popup).find('.style-box').hide();
}
});
$($popup).find('.row-cnt-box .btn-row-oper').on('click', function() {
var row_cnt = Number($('.row-cnt-box input').val());
if($(this).data('oper') == 'plus') {
if(row_cnt+1 >= max_table_row_cnt) row_cnt = max_table_row_cnt;
else row_cnt += 1;
} else if($(this).data('oper') == 'minus') {
if(row_cnt-1 < 1) row_cnt = 1;
else row_cnt -= 1;
}
$($popup).find('.row-cnt-box input').val(row_cnt);
renderPreviewTable();
});
$($popup).find('.col-cnt-box .btn-col-oper').on('click', function() {
var col_cnt = Number($('.col-cnt-box input').val());
if($(this).data('oper') == 'plus') {
if(col_cnt+1 >= max_table_col_cnt) col_cnt = max_table_col_cnt;
else col_cnt += 1;
} else if($(this).data('oper') == 'minus') {
if(col_cnt-1 < 1) col_cnt = 1;
else col_cnt -= 1;
}
$($popup).find('.col-cnt-box input').val(col_cnt);
renderPreviewTable();
});
$($popup).find('.btn-border-oper').on('click', function() {
var border = Number($('.border-width-box input').val());
if($(this).data('oper') == 'plus') {
if(border+1 > 10) border = 10;
else border += 1;
} else if($(this).data('oper') == 'minus') {
if(border-1 < 1) border = 1;
else border -= 1;
}
$($popup).find('.border-width-box input').val(border);
renderPreviewTable();
});
$($popup).find('.btn-border-style-oper').on('click', function() {
if($(this).data('oper') == 'double' && $($popup).find('input[name="table_border_width"]').val() < 3) $($popup).find('input[name="table_border_width"]').val(3);
$($popup).find('.border-style-box').data('value', $(this).data('oper'));
renderPreviewTable();
});
$($popup).find('input[name="table_border_width"]').on('input', function() {
var border_width = $(this).val();
if(border_width < 1) {
border_width = 1;
$($popup).find('input[name="table_border_width"]').val(border_width);
} else if(border_width > 10) {
border_width = 10;
$($popup).find('input[name="table_border_width"]').val(border_width);
}
renderPreviewTable();
});
$($popup).find('.btn-style-type').on('click', function() {
$($popup).find('.style-box').data('value', $(this).data('value'));
renderPreviewTable();
});
$($popup).find('.btn-background-color-picker, .btn-border-color-picker').colpick({
color:'#0088CC',
layout : 'hex',
extend : true,
flat : isMobile() ? true : false,
onSubmit: function (hsb, hex, rgb) {
hex = hex.toUpperCase();
// $('.fr-toolbar.fr-inline').removeClass('always');
$(this.el).data('value', '#' + hex);
$(this.el).colpickHide();
$(this.el).css('background-color', '#'+hex);
editor.customInsertTable.renderPreviewTable();
if(typeof SETTINGS.favcolor == 'undefined') SETTINGS.favcolor = ['#FFFFFF','#FFFFFF','#FFFFFF','#FFFFFF','#FFFFFF','#FFFFFF','#000000'];
if(hex && SETTINGS.favcolor.indexOf('#' +hex) == -1) {
if(MODE == 'c' || MODE == 'config') {
$.ajax({
url:'/config/setFavoriteColor',
type:'post',
data:{
'sid' : SID,
'color' : '#'+hex,
},
dataType:'json',
success:function() {
SETTINGS.favcolor.push('#'+hex);
if(SETTINGS.favcolor.length > $.FroalaEditor.FAV_COLORS_COUNT) {
SETTINGS.favcolor.splice(0, SETTINGS.favcolor.length - $.FroalaEditor.FAV_COLORS_COUNT);
}
}
});
} else {
SETTINGS.favcolor.push('#'+hex);
if(SETTINGS.favcolor.length > $.FroalaEditor.FAV_COLORS_COUNT) {
SETTINGS.favcolor.splice(0, SETTINGS.favcolor.length - $.FroalaEditor.FAV_COLORS_COUNT);
}
}
}
},
onHide: function(picker) {
$(picker).removeClass('show-picker');
$($(picker).data('colpick').el).removeClass('active');
},
onBeforeShow: function() {
$(this).toggleClass('active');
},
onShow: function() {
var btn = this;
if(!$(this).hasClass('active')) {
setTimeout(function() {
$(btn).colpickHide();
});
}
var $colpick_layer = $('#' + $(this).data('colpickId'));
$colpick_layer.find('.nav-pills').hide();
var hex = $(this).data('value');
$(this).colpickSetColor(hex.replace('#',''));
$('.colpick_hex.extend .fav-row').remove();
if(typeof SETTINGS.favcolor == 'undefined') SETTINGS.favcolor = ['#FFFFFF','#FFFFFF','#FFFFFF','#FFFFFF','#FFFFFF','#FFFFFF','#000000'];
var favcolor_html = '';
if(SETTINGS.favcolor.length) {
var gap = $.FroalaEditor.FAV_COLORS_COUNT - SETTINGS.favcolor.length;
for(var i=0; i';
});
}
if(favcolor_html) {
$('.colpick_hex.extend .col-ex-item.color-set').prepend('' + favcolor_html + '
');
}
var $trigger = $(this);
if(($trigger.offset().top + $trigger.outerHeight() + $colpick_layer.outerHeight()) > window.innerHeight) {
var top = $trigger.offset().top;
$colpick_layer.css('top',(Number(top)-171)+'px');
}
}
});
$($popup).on('mousedown', function(e) {
if(e.target != $('.btn-border-color-picker').get(0)) {
$($popup).find('.btn-border-color-picker').colpickHide().removeClass('active');
}
if(e.target != $('.btn-background-color-picker').get(0)) {
$($popup).find('.btn-background-color-picker').colpickHide().removeClass('active');
}
})
$($popup).find('.btn-cancel, .close-popup').on('click', function() {
hidePopup();
});
$($popup).find('.btn-apply').on('click', function() {
// console.log(renderPreviewTable())
var table_html = '' + renderPreviewTable().outerHTML() + '
';
// $table_html.find('table').css('width', '');
var box_width = $(editor.$box).width();
editor.html.insert(table_html);
editor.events.trigger('contentChanged');
editor.selection.clear();
editor.$box.find('.fr-table-new .fr-table').css('width', box_width);
editor.$box.find('.fr-table-new').removeClass('fr-table-new');
hidePopup();
});
editor.popups.onRefresh('customInsertTable.popup', function() {
// console.log('popup refresh')
});
editor.popups.onHide('customInsertTable.popup', function(e) {
// console.log(e);
// editor.popups.get('customInsertTable.popup').remove();
// initPopup();
// console.log('popup hide');
});
renderPreviewTable();
return $popup;
}
function showPopup() {
var $popup = editor.popups.get('customInsertTable.popup');
if(!$popup) $popup = initPopup();
$($popup).addClass('fr-popup-custom-table');
// editor.popups.setContainer('customInsertTable.popup', editor.$tb);
var $btn = $('.fr-btn[data-cmd="quickInsertTableButton"]');
if(!$btn.length) $btn = $(editor.popups.get('customQuickInsert.popup')).find('[data-cmd="insertTableButton"]');
var left = $btn.offset().left + $btn.outerWidth(true) /2;
var top = $btn.offset().top + (editor.opts.toolbarBottom ? 10 : $btn.outerHeight() - 10);
var win_height = $(window).height();
var popup_height = $($popup).outerHeight();
if((top + popup_height) > win_height) {
top = win_height / 2 - popup_height / 2;
}
editor.popups.show('customInsertTable.popup', left, top, $btn.outerHeight());
popPos = $(editor.popups.get('customInsertTable.popup')).css('top').replace('px', '');
}
function hidePopup() {
editor.popups.hide('customInsertTable.popup');
}
function renderPreviewTable() {
var $popup = editor.popups.get('customInsertTable.popup');
var defaults = {
'col' : 4,
'row' : 4,
'border-style' : 'solid',
'border-width' : 1,
'background-color' : 'transparent',
'border-color' : '#cccccc'
}
var opts = {};
$popup.find('.comm-opts').each(function() {
if($(this).val() && !isNaN($(this).val())) {
opts[$(this).data('attr')] = $(this).val();
} else if($(this).data('value')) {
opts[$(this).data('attr')] = $(this).data('value');
}
});
var table_html = '';
opts = $.extend(defaults, opts);
if($popup.find('input[name="style_type"]:checked').val() == 'custom') {
$popup.find('.fr-insert-table-popup .opts').each(function() {
if($(this).val() && !isNaN($(this).val())) {
opts[$(this).data('attr')] = $(this).val();
} else if($(this).data('value')) {
opts[$(this).data('attr')] = $(this).data('value');
}
});
}
var table_html = '';
opts = $.extend(defaults, opts);
table_html += '';
for(var row = 1; row<=opts.row; row++) {
table_html += '';
for(var col = 1; col<=opts.col; col++) {
table_html += ' | ';
}
table_html += '
';
}
table_html += '
';
var $table_html = $(table_html);
$popup.find('.fr-insert-table-popup .fr-table-preview').html($table_html);
if($popup.find('input[name="style_type"]:checked').val() == 'preset') {
var type = $($popup).find('.style-box').data('value');
var type_num = type.replace('type', '');
var border_color1, border_color2, cell_color1, cell_color2, cell_color3, cell_color4;
if(type_num <= 8) {
border_color1 = '#cccccc';
border_color2 = '#e7e8e9';
cell_color1 = '#f3f3f3';
cell_color2 = '#f8f8f8';
cell_color3 = '#ebebeb';
cell_color4 = '#010101';
// cell_color5 = '#ebebeb';
} else if(type_num > 8 && type_num <= 16) {
border_color1 = '#a3bcd0';
border_color2 = '#c8d7e2';
cell_color1 = '#e5ecf2';
cell_color2 = '#fbfbfc';
cell_color3 = '#e5ecf2';
cell_color4 = '#5883ab';
// cell_color5 = '#e5ecf2';
}
type_num = type_num % 8;
switch(type_num) {
case 1:
$table_html.find('td').css({
'border' : '1px solid ' + border_color1
});
break;
case 2:
$table_html.find('td').css({
'border' : '1px solid ' + border_color1
});
$table_html.find('tr:odd').find('td').css({
'background-color' : cell_color1
});
break;
case 3:
$table_html.find('td').css({
'border-top' : '1px solid ' + border_color1,
'border-bottom' : '1px solid ' + border_color1,
'border-left': 'none',
'border-right': 'none'
});
$table_html.find('tr:odd').find('td').css({
'background-color' : cell_color1
});
break;
case 4:
$table_html.css({
'border' : '1.1px solid ' + border_color1
});
$table_html.find('td').css({
'border' : '1px solid ' + border_color2
});
$table_html.find('tr:first').find('td').css({
'background-color' : cell_color1
});
break;
case 5:
$table_html.find('td').css({
'border' : '1px solid ' + border_color1
});
$table_html.find('tr:even td').css({
'background-color' : cell_color2
});
$table_html.find('tr:odd td').css({
'background-color' : cell_color3
});
break;
case 6:
$table_html.find('tr:even td').css({
'background-color' : cell_color3
});
$table_html.find('tr:first td').css({
'background-color' : cell_color4
});
$table_html.find('td').css({
'border' : '1px solid ' + border_color1,
'border-left' : 'none',
'border-right' : 'none'
});
break;
case 7:
$table_html.find('td').css({
'border' : '1px solid ' + border_color1
});
$table_html.find('tr').find('td:first').css({
'background-color': cell_color1
});
$table_html.find('tr:first td').css({
'background-color' : cell_color4
});
break;
case 0:
$table_html.find('td').css({
'border' : '1px solid ' + border_color1
});
$table_html.find('tr').find('td:first').css({
'background-color' : cell_color4
});
break;
}
}
return $table_html;
}
return {
showPopup: showPopup,
hidePopup: hidePopup,
renderPreviewTable : renderPreviewTable,
initPopup: initPopup
}
}
$.FroalaEditor.RegisterQuickInsertButton('quickInsertTableButton', {
icon: 'insertTable',
title: 'Insert Table',
popup: true,
plugin: 'customInsertTable',
callback: function() {
var editor = this;
if(!this.popups.isVisible('customInsertTable.popup')) {
this.customInsertTable.showPopup();
} else {
if(this.$el.find('.fr-marker')) {
}
// this.popups.hide('customInsertTable.popup');
}
var $popup = editor.popups.get('customInsertTable.popup');
}
});
$.FroalaEditor.RegisterCommand('insertTableButton', {
icon: 'insertTable',
title: 'Insert Table',
popup: true,
plugin: 'customInsertTable',
callback: function() {
var editor = this;
if(!this.popups.isVisible('customInsertTable.popup')) {
this.customInsertTable.showPopup();
} else {
if(this.$el.find('.fr-marker')) {
}
// this.popups.hide('customInsertTable.popup');
}
var $popup = editor.popups.get('customInsertTable.popup');
}
});
$.FroalaEditor.RegisterCommand('tableCellColor', {
icon: 'tableCellColor',
title: 'Cell color',
undo: true,
focus: false,
showOnMobile: true,
callback: function() {
var editor = this;
$('button[data-cmd="tableCellColor"]').toggleClass('active');
$('.fr-command[data-cmd="tableCellColor"]').colpick({
color:'#0088CC',
layout : 'hex',
extend : true,
flat : isMobile() ? true : false,
onSubmit: function (hsb, hex, rgb) {
hex = hex.toUpperCase();
// $('.fr-toolbar.fr-inline').removeClass('always');
var oper = $(this.selector).closest('.colpick_hex.extend').find('.nav-pills [data-type].active').data('type');
if(oper == 'text') {
// $(editor.table.selectedCells()).css('border-color', '#' + hex);
$(editor.table.selectedTable()).find('td').css('border-color', '#' + hex);
} else if(oper == 'background') {
$(editor.table.selectedCells()).css('background-color', '#' + hex);
}
$('.fr-command[data-cmd="tableCellColor"]').colpickHide();
if(typeof SETTINGS.favcolor == 'undefined') SETTINGS.favcolor = ['#FFFFFF','#FFFFFF','#FFFFFF','#FFFFFF','#FFFFFF','#FFFFFF','#000000'];
if(hex && SETTINGS.favcolor.indexOf('#' +hex) == -1 && (MODE == 'c' || MODE == 'config')) {
$.ajax({
url:'/config/setFavoriteColor',
type:'post',
data:{
'sid' : SID,
'color' : '#'+hex,
},
dataType:'json',
success:function() {
SETTINGS.favcolor.push('#'+hex);
if(SETTINGS.favcolor.length > $.FroalaEditor.FAV_COLORS_COUNT) {
SETTINGS.favcolor.splice(0, SETTINGS.favcolor.length - $.FroalaEditor.FAV_COLORS_COUNT);
}
}
});
}
},
onHide: function() {
},
onShow: function() {
var $colpick_layer = $('#' + $(this).data('colpickId'));
// $colpick_layer.find('.nav-pills').hide();
var hex = $.colpick.rgbToHex(fixRGB(rgbaToOpacity(editor.table.selectedCells()[0].style.borderColor)));
$colpick_layer.find('.nav-pills [data-type="text"] a').text($.FroalaEditor.LANGUAGE[LANG].translation['Table Border']);
$colpick_layer.find('.nav-pills [data-type="background"] a').text($.FroalaEditor.LANGUAGE[LANG].translation['Cell Background']);
$colpick_layer.find('.nav-pills li').removeClass('active');
// $colpick_layer.find('.nav-pills li[data-type="background"]').addClass('active');
$colpick_layer.find('.nav-pills li:first').addClass('active');
$(this).colpickSetColor(hex.replace('#',''));
$('.colpick_hex.extend .fav-row').remove();
if(typeof SETTINGS.favcolor == 'undefined') SETTINGS.favcolor = ['#FFFFFF','#FFFFFF','#FFFFFF','#FFFFFF','#FFFFFF','#FFFFFF','#000000'];
var favcolor_html = '';
if(SETTINGS.favcolor.length && (MODE == 'c' || MODE == 'config')) {
var gap = $.FroalaEditor.FAV_COLORS_COUNT - SETTINGS.favcolor.length;
for(var i=0; i';
});
}
if(favcolor_html) {
$('.colpick_hex.extend .col-ex-item.color-set').prepend('' + favcolor_html + '
');
}
var $trigger = $(this);
if(($trigger.offset().top + $trigger.outerHeight() + $colpick_layer.outerHeight()) > window.innerHeight) {
var top = $trigger.offset().top;
// $colpick_layer.css('top',(Number(top)-171)+'px');
$colpick_layer.css('top',(Number(top)-201)+'px');
}
}
});
},
refresh: function($btn) {
if(!$($btn).hasClass('active')) $($btn).colpickHide();
}
});
$.FroalaEditor.RegisterCommand('tableBorderStyle', {
icon: 'tableBorderStyle',
title: 'Border Style',
type:'dropdown',
options: {
'none' : 'None',
'solid' : 'Solid',
'dashed' : 'Dashed',
'dotted' : 'Dotted',
'double' : 'Double',
},
callback: function(cmd, val) {
var border_width = 0;
if(val == 'none') {
} else if(val == 'double') {
border_width = 3;
} else {
border_width = 1
}
$(this.table.selectedCells()).css({
'border-style' : val,
'border-width' : border_width + 'px'
});
},
refreshOnShow: function($btn, $dropdown) {
var border_style = this.table.selectedCells()[0].style.borderStyle;
if(border_style) {
$($dropdown).find('[data-param1="' + border_style + '"]').addClass('fr-active');
}
}
});
$.FroalaEditor.RegisterCommand('tableBorderWidth', {
icon: 'tableBorderWidth',
title: 'Border Width',
type:'dropdown',
options: {
'0' : 'None',
'1' : '1',
'2' : '2',
'3' : '3',
'4' : '4',
'5' : '5',
'6' : '6',
'7' : '7',
'8' : '8',
'9' : '9',
'10' : '10',
},
callback: function(cmd, val) {
$(this.table.selectedCells()).css({
'border-width' : val + 'px'
});
},
refreshOnShow: function($btn, $dropdown) {
var border_width = this.table.selectedCells()[0].style.borderWidth;
if(border_width) {
border_width = border_width.replace('px', '');
$($dropdown).find('[data-param1="' + border_width + '"]').addClass('fr-active');
}
}
});
$.FroalaEditor.RegisterCommand('customFormatOL', {
icon: 'formatOL',
title: 'Ordered List',
type: 'dropdown',
options : {
'none' : 'None',
'decimal' : 'Decimal',
'lower-alpha' : 'Lower Alpha',
'lower-greek' : 'Lower Greek',
'lower-roman' : 'Lower Roman',
'upper-alpha' : 'Upper Alpha',
'upper-roman' : 'Upper Roman',
},
callback: function(cmd, val) {
this.selection.save();
if(val == 'none') {
if(this.format.is('ol')) {
this.commands.exec('formatOL');
}
} else {
this.commands.exec('formatOL', [val]);
}
}
});
$.FroalaEditor.RegisterCommand('customFormatUL', {
icon: 'formatUL',
title: 'Unordered List',
type: 'dropdown',
refreshAfterCallback: true,
options : {
'none' : 'None',
'circle' : 'Circle',
'disc' : 'Disc',
'square' : 'Square',
'disclosure-closed' : 'Triangle'
},
callback: function(cmd, val, val2) {
this.selection.save();
if(val == 'none') {
if(this.format.is('ul')) {
this.commands.exec('formatUL');
}
} else {
this.commands.exec('formatUL', [val]);
}
}
});
$.FroalaEditor.RegisterCommand('customFormatUOL', {
icon: 'customFormatUOL',
title: 'Ordered List',
type: 'dropdown',
html: function() {
return '\
\
'
},
callback: function(cmd, val) {
// selRange = saveSelection()
if(val == 'none') {
while(this.format.is('ol')) {
this.commands.exec('formatOL');
}
while(this.format.is('ul')) {
this.commands.exec('formatUL');
}
} else {
this.commands.exec('formatOL', [val]);
}
},
refreshOnShow: function($btn, $dropdown) {
var list_style = $(this.selection.element()).css('list-style-type');
if(list_style && list_style != 'none' && (this.format.is('ol') || this.format.is('ul'))) {
$($dropdown).find('[data-param1="' + list_style + '"]').addClass('fr-active');
} else {
$($dropdown).find('[data-param1="none"]').addClass('fr-active');
}
}
});
$.FroalaEditor.RegisterCommand('customInOutdent', {
icon: 'inoutdent',
title: 'indent/outdent',
type: 'dropdown',
options: {
'indent' : "",
'outdent' : "",
},
html: function() {
return '\
\
';
},
callback: function(cmd, val) {
if(val == 'indent') {
this.commands.indent();
} else if(val == 'outdent') {
this.commands.outdent();
}
},
refreshOnShow: function($btn, $dropdown) {
// if(this.selection.endElement)
var checkOLFirst = false,
marginLeftFlag = false;
$($dropdown).find('[data-param1="indent"],[data-param1="outdent"]').removeClass('fr-disabled');
$(this.selection.blocks()).each(function() {
if($(this).is('li') && $(this).prev('li').length == 0) checkOLFirst = true;
if( $(this).css('margin-left') != '0px' ||
$(this).parents('ol,ul').length > 1 ||
($(this).closest('ol,ul').css('margin-left') != '0px' && typeof $(this).closest('ol,ul').css('margin-left') != 'undefined')
) {
marginLeftFlag = true;
}
});
if(checkOLFirst) $($dropdown).find('[data-param1="indent"]').addClass('fr-disabled');
if(!marginLeftFlag) $($dropdown).find('[data-param1="outdent"]').addClass('fr-disabled');
$($dropdown).find('[data-param1="indent"]').attr('title', $.FroalaEditor.LANGUAGE[LANG].translation['Increase Indent']);
$($dropdown).find('[data-param1="outdent"]').attr('title', $.FroalaEditor.LANGUAGE[LANG].translation['Decrease Indent']);
}
});
function hideLargeImagebtn() {
if($('body').width()>768) {
$('.fr-btn.fr-btn-image[data-cmd="img-align-full"], .fr-btn.fr-btn-image[data-cmd="img-align-wide"]').hide();
}
}
function showLargeImagebtn() {
if($('body').width()>768) {
$('.fr-btn.fr-btn-image[data-cmd="img-align-full"], .fr-btn.fr-btn-image[data-cmd="img-align-wide"]').show();
$('.fr-btn.fr-command[data-cmd="imageAlign"]').hide();
}
}
function refreshImagebtn($obj) {
if($('body').width() < 768) $('.fr-btn.fr-command[data-cmd="imageAlign"]').hide();
if($obj.hasClass('image-width-small')) {
hideLargeImagebtn();
if($obj.hasClass('f-align-original')) $('.fr-btn.fr-command[data-cmd="imageAlign"]').show();
else $('.fr-btn.fr-command[data-cmd="imageAlign"]').hide();
} else showLargeImagebtn();
// $obj.removeClass(function (index, css) {
// return (css.match (/f-align-(left|right|full|wide|original)(-470)*/g) || []).join(' ');
// });
var imgClass = $obj.attr('class').match(/f-align-(left|right|full|wide|original)(-470)*/g),
align = (imgClass==null) ? '' : imgClass[0],
align = (align) ? align.replace('f-','img-') : '';
$('button[data-cmd="' + align + '"]').addClass('active');
}
function refreshVideobtn($obj) {
// if($obj.find('iframe').width()<720 && $('body').width() > 767) {
// $('.fr-btn.fr-command[data-cmd="videoAlign"]').show();
// } else {
// $('.fr-btn.fr-command[data-cmd="videoAlign"]').hide();
// }
// $('.fr-video-resizer').css({
// width: ($obj.find('iframe').width() + 2) + 'px',
// height: ($obj.find('iframe').height() +2) + 'px',
// });
}
function setImageToolbarPosition($btn,$img) {
var $toolbar = $btn.parents('.fr-popup'),
$resizer = $('.fr-image-resizer');
$toolbar.css('visibility','hidden');
$resizer.css('visibility','hidden');
setTimeout(function() {
$resizer.width($img.width()+'px');
$resizer.height($img.height()+'px');
$resizer.css('top', ($img.offset().top - $('#fm-editor').offset().top -18) + 'px');
$resizer.css('left', ($img.offset().left - $('#fm-editor').offset().left -16) + 'px');
// $resizer.css('top', '-1px');
// $resizer.css('left','-1px');
var top = $resizer.offset().top + ($img.height()/2-28),
left = $img.offset().left + ($img.width() - $toolbar.width()) / 2;
if($toolbar.hasClass('fr-above')) top = top + 10;
$toolbar.css('top', top + 'px');
$toolbar.css('left', left + 'px');
$toolbar.css('visibility','visible');
$resizer.css('visibility','visible');
// $toolbar.find('[data-cmd="img-align-full"], [data-cmd="img-align-wide"], [data-cmd="img-align-original"], [data-cmd="img-align-left-470"], [data-cmd="img-align-right-470"], [data-cmd="img-align-left"], [data-cmd="img-align-right"]').show();
},100);
}
function setVideoToolbarPosition($btn,$img) {
var $toolbar = $btn.parents('.fr-popup'),
$resizer = $('.fr-video-resizer');
$toolbar.css('visibility','hidden');
setTimeout(function() {
var top = $resizer.offset().top + ($img.height()/2-28);
if($toolbar.hasClass('fr-above')) top = top + 10;
$toolbar.css('top',top + 'px');
$toolbar.css('visibility','visible');
},100);
}
function lastLineEmpty() {
// if($('#forum-modal .fr-view p:last-child').text() == '' && $('#forum-modal .fr-view p:last-child').find('*').length < 2 &&
// $('#forum-modal .fr-view p:last-child').find('img').length == 0 &&
// $('#forum-modal .fr-view p:last-child').find('iframe').length == 0 ) {
// $('#forum-modal .fr-view p:last-child').addClass('last-line-empty');
// } else {
// if($('#forum-modal .fr-view p:last-child').text().charCodeAt(0) == '8204' &&
// $('#forum-modal .fr-view p:last-child').find('img').length == 0 &&
// $('#forum-modal .fr-view p:last-child').find('iframe').length == 0) $('#forum-modal .fr-view p:last-child').addClass('last-line-empty');
// else $('#forum-modal .fr-view p:last-child').removeClass('last-line-empty');
// }
}
$(document).on('click','#forum-modal .fr-view p', function(e) {
// if($(this).hasClass('last-line-empty')) $(this).removeClass('last-line-empty');
// else lastLineEmpty();
});
function editorImageReplace(src, orig_name) {
var $img = fr_editor.image.get(),
$btn = $('.fr-popup.fr-active').find('button[data-cmd="image-replace"]'),
tmpImg = new Image();
tmpImg.src = src;
tmpImg.onload = function() {
$img.attr('src',src);
$img.attr('alt', orig_name);
$img.removeClass('image-width-small');
// if(this.width < 720) $img.addClass('image-width-small');
// setImageToolbarPosition($btn,$img);
// refreshImagebtn($img);
$.processOFF();
fr_editor.image.edit($img);
};
}
function imageSetClass($obj) {
// var width = $('.forum-write').hasClass('w740') ? 720 : 1140;
// if($obj.width()< width) $obj.addClass('image-width-small').addClass('f-align-original');
}
$(function() {
$(document).on('mouseenter','.forum-view.post .fr-file',function(e) {
var $wrapper = $(this).parent('.edt-type-file');
$wrapper.addClass('active');
var file_name_width = $wrapper.find('.fr-file').outerWidth();
var box_width = $wrapper.outerWidth();
var file_name_left = $wrapper.find('.fr-file').position().left;
if((box_width - (file_name_width + file_name_left)) > 70) { // 30px 좌측 패딩 제외
var offleft = $wrapper.find('.fr-file').offset().left - $wrapper.offset().left,
align = $('.sideToolbar .tb-text-align').attr('data-align'),
pos = 50;
if(align == 'right') pos = -($wrapper.find('.fr-file').width() + 100);
var left = $wrapper.find('.fr-file').width() + offleft + pos;
$wrapper.append('');
$wrapper.append('');
} else {
var offleft = $wrapper.find('.fr-file').offset().left - $wrapper.offset().left,
align = $('.sideToolbar .tb-text-align').attr('data-align'),
pos = 50;
if(align == 'right') pos = -($wrapper.find('.fr-file').width() + 100);
var left = $wrapper.find('.fr-file').width() + offleft + pos - 100;
$wrapper.append('');
$wrapper.append('');
}
}).on('mouseleave','.forum-view.post .edt-type-file',function(e) {
$(this).removeClass('active');
$('.edt-file-delete').remove();
$('.edt-enter').remove();
}).on('click','.forum-view.post .edt-type-file, #forum-modal .fr-file',function(e) {
e.stopPropagation();
e.preventDefault();
// if($(this).parents('p').next().length == 0) {
// $(this).parents('p').after('
');
// $(('#forum-modal')).scrollTop($('#forum-modal').height());
// }
});
$(document).on('click','.forum-view.post .edt-file-delete', function(e) {
fr_editor.undo.saveStep();
$(this).parents('.edt-type-file').replaceWith($.FroalaEditor.INVISIBLE_SPACE);
});
$(document).on('click','.forum-view.post .edt-enter', function(e) {
fr_editor.undo.saveStep();
$(this).parents('div').after('​
');
});
$(document).on('click','#fm-thumb',function(e) {
if(!$(this).hasClass('empty')) {
var thumbDeleteModal = $(this).showModalFlat('INFORMATION', $.lang[LANG]['config.postforum.thumbnail..delete'], true, true, function(e) {
$('#fm-thumb').addClass('empty').find('.bg').remove();
$('#fm-title').addClass('thumb-empty');
$('#fm-thumb').find('img').attr('src','//storage.googleapis.com/i.addblock.net/icon/thumb_icon.png');
thumbDeleteModal.modal('hide');
if(fr_editor) fr_editor.events.trigger('contentChanged');
}, 'cancel', 'ok','cl-cmmodal cl-s-btn w560 cl-p130 cl-t80 cl-modal cl-none-title cl-close-btn');
return false;
}
// fr_editor.selection.save();
isReplace = false;
upTYPE = 'thumb';
$('#file_type').val(upTYPE);
$('#file_multiple').val(false);
$('#uploadFile').val('').removeAttr('multiple').attr('accept','image/jpg,image/jpeg,image/png,image/ico,image/webp');
$('#uploadFile').trigger('click');
});
$(document).on('click','.tb-attach-file',function(e) {
fr_editor.selection.save();
isReplace = false;
upTYPE = 'image';
$('#file_type').val(upTYPE);
$('#file_multiple').val(false);
$('#uploadFile').val('').removeAttr('multiple').attr('accept','image/gif,image/jpg,image/jpeg,image/png,image/ico,image/webp');
$('#uploadFile').trigger('click');
});
$(document).on('click','.tb-file-insert', function(e) {
upTYPE = 'file';
$('#file_type').val(upTYPE);
$('#file_multiple').val(false);
$('#uploadFile').val('').removeAttr('multiple').removeAttr('accept');
$('#uploadFile').trigger('click');
});
$(document).on('click','.tb-video-insert', function(e) {
fr_editor.selection.save();
var modal = $(this).showModalFlat($.lang[LANG]['config.insert-video'],videoForm(),true,true,function() {
$('.error').remove();
var url = $('#video-url').val();
if(!url) {
$('#video-url').after('').focus();
return;
}
// video url patterns(youtube, instagram, vimeo, dailymotion)
var ytRegExp = /^.*(youtu.be\/|v\/|u\/\w\/|embed\/|watch\?v=|\&v=)([^#\&\?]*).*/;
var ytMatch = url.match(ytRegExp);
var igRegExp = /\/\/instagram.com\/p\/(.[a-zA-Z0-9]*)/;
var igMatch = url.match(igRegExp);
var vRegExp = /\/\/vine.co\/v\/(.[a-zA-Z0-9]*)/;
var vMatch = url.match(vRegExp);
var vimRegExp = /\/\/(player.)?vimeo.com\/([a-z]*\/)*([0-9]{6,11})[?]?.*/;
var vimMatch = url.match(vimRegExp);
var dmRegExp = /.+dailymotion.com\/(video|hub)\/([^_]+)[^#]*(#video=([^_&]+))?/;
var dmMatch = url.match(dmRegExp);
var sound = url.search("soundcloud.com");
var $video;
if (ytMatch && ytMatch[2].length === 11) {
} else if (igMatch && igMatch[0].length > 0) {
} else if (vMatch && vMatch[0].length > 0) {
} else if (vimMatch && vimMatch[3].length > 0) {
} else if (dmMatch && dmMatch[2].length > 0) {
} else if (sound>-1) {
} else {
$('#video-url').after('').focus();
return;
}
if ($video) {
$video.attr('frameborder', 0).attr('class','tpl-video');
range.create().insertNode($video[0]);
//$('.note-editable').fitVids();
}
var video = insertVideo(url,'src'),
frVideo = '' +
'' +
'';
if(video!=false) {
restoreSelection(selRange);
fr_editor.html.insert(frVideo , true);
}
modal.modal('hide');
},'cancel','', 'cl-modal cl-cmmodal cl-p70 cl-s-btn w560 cl-t80 cl-close-btn video-addmodal');
$('.flat-modal').css({
'position' : 'absolute',
'z-index' : '1051'
});
$('[data-toggle="popover"]').popover();
$('.flat-modal').next().css('z-index','1050');
});
$(document).on('click','.tb-divider-insert', function(e) {
var mode = ($(this).hasClass('pc')) ? ".pc" : ".mobile";
if($('.sub-divider'+mode).css('display') == "block") $('.sub-divider'+mode).hide();
else $('.sub-divider'+mode).show();
fr_editor.selection.save();
// fr_editor.image.insert('http://storage.googleapis.com/cr-resource/forum/958ee630c0ff8b9f857b9002f937e808/811d09af2cd93ce62080d8ccfaed37ce.png',true);
});
$(document).on('click','.tb-insert-hr', function(e) {
var type = $(this).attr('data-type');
fr_editor.selection.restore();
switch(type) {
case "h1": fr_editor.html.insert('
',true); break;
case "h2": fr_editor.html.insert('
',true); break;
case "h3": fr_editor.html.insert('
',true); break;
case "h4": fr_editor.html.insert('
',true); break;
case "h5": fr_editor.html.insert('
',true); break;
default: return; break;
}
$('.sub-divider').hide();
});
});
var videoForm = function() {
return '' +
'';
}
window.onload = function(){
// setLanguage(LANG);
document.getElementById('uploadFile').onchange = function(e) {
$.processON('Uploading...');
$('#uploadForm').after('');
var checkMulti = e.target.multiple,
uploaded = 0;
if(checkMulti) {
var total = e.target.files.length;
if(total > 20) {
e.preventDefault();
var modal = $(this).showModalFlat('ERROR',$.lang[LANG]['editor.image.upload.multiple.max'],true,false,'','ok','','cl-cmmodal cl-s-btn w560 cl-p130 cl-t80 cl-modal cl-none-title cl-close-btn','','',function() {
$(document).on('keydown', function(e) {
if(e.keyCode == 27) modal.modal('hide');
});
});
$.processOFF();
$('#uploadIFrame').remove();
return;
}
// $.processON('Uploading...(0 / ' + total + ')');
$('.processModal').addClass('uploadFile-process');
var editorCursor = $(fr_editor.selection.blocks()).eq(0);
}
document.getElementById('uploadIFrame').onload = function(e) {
$('#forum-attach').modal('hide');
var res = $.parseJSON($('#uploadIFrame').contents().find('body').text()),
error_str = '';
if(typeof res.error != 'undefined' && res.error) {
var modal = $(this).showModalFlat('',res.error,true,false,'','ok','','cl-cmmodal cl-s-btn w560 cl-p130 cl-t80 cl-modal cl-none-title cl-close-btn','','',function() {
$(document).on('keydown', function(e) {
if(e.keyCode == 27) modal.modal('hide');
});
});
$.processOFF();
$('#uploadIFrame').remove();
return;
}
var file_type = $('#file_type').val();
if(checkMulti) {
var end_fupload = function(res_o) {
var editorWrap = editorCursor.closest('.fr-element[contenteditable]'),
prev_files = '';
$.each(res_o.list, function(e_i, e_o) {
uploaded++;
var file_html = '';
if(navigator.userAgent.indexOf('Firefox') > -1) file_html = '​
' + file_html;
if(uploaded == res_o.list.length && navigator.userAgent.indexOf('Firefox') > -1) file_html+='​
';
if(e_i == 0) editorCursor.find('.fr-marker[data-type="false"]').closest('div').eq(0).before(file_html);
else editorWrap.find('img[src="'+prev_files+'"]').closest('div').eq(0).after(file_html);
prev_files = e_o.file;
if(uploaded == res_o.list.length) {
editorCursor.find('.fr-marker[data-type="false"], .fr-marker[data-type="true"]').remove();
$('.fr-wrapper').removeClass('show-placeholder');
$.processOFF();
if(fr_editor) fr_editor.events.trigger('contentChanged');
if($(window).width() < 768) {
if(!fr_editor.selection.inEditor() || !fr_editor.core.hasFocus()) {
$('.fr-mobile-quick-insert').find('.fr-command').addClass('fr-disabled');
}
} else {
setTimeout(function() {
if(editorWrap.find('img[src="'+prev_files+'"]').lenth > 0) fr_editor.image.edit(editorWrap.find('img[src="'+prev_files+'"]'));
}, 800);
}
}
});
}
end_fupload(res);
} else {
if(res.file_type == 'thumb') {
if($('#fm-thumb').hasClass('empty')) {
$('#fm-thumb').removeClass('empty').append('
');
$('#fm-title').removeClass('thumb-empty');
}
$('#fm-thumb').find('img.fm-thumb-img').attr('src',res.thumb).attr('data-file-name',res.uploaded.file_name).attr('data-file-dir',res.uploaded.dir);
var thumb_history_idx = $('#fm-thumb').find('input[type="hidden"]').length;
$('#fm-thumb').append('')
$.processOFF();
if(fr_editor) fr_editor.events.trigger('contentChanged');
} else {
setfile(res.file, res.uploaded.file_name, res.uploaded.orig_name, res.uploaded.dir);
}
}
$('#uploadIFrame').remove();
}
document.getElementById('uploadForm').submit();
}
}
function setfile(file,file_name,orig_name,file_dir) {
var $file = $(''),
$result = $(' '+ orig_name + '');
$del = $('');
$file.append($result).append($del);
$file.appendTo('.upload-files');
restoreSelection(selRange);
if(upTYPE == 'image') {
var tmpImg = new Image();
$.processON('Image loading...');
if(isReplace == true) {
editorImageReplace(file, orig_name);
} else {
tmpImg.src = file;
tmpImg.onload = function() {
fr_editor.image.insert(file, true);
$.processOFF();
};
}
} else {
fr_editor.file.insert(file, orig_name, { 'link' : file, 'target': '_blank' });
if($(window).width() < 768) {
if(!fr_editor.selection.inEditor() || !fr_editor.core.hasFocus()) {
$('.fr-mobile-quick-insert').find('.fr-command').addClass('fr-disabled');
}
}
$.processOFF();
}
}
// var removeColpick = function() {
// $('.fr-toolbar.fr-inline').removeClass('always');
// $('button[data-cmd="textColor"]').removeClass('active').colpickHide();
// }
' + $.lang[LANG]['editor.video.info.title'] + '
' + '' + '' + '