リビジョン | ea3d0994b31035b8ca8ddfaa942bb3a659e12c8a (tree) |
---|---|
日時 | 2015-01-28 21:26:50 |
作者 | naoki hirata <naoki@magi...> |
コミッター | naoki hirata |
「CKEditorテスト用」ウィジェット更新。
@@ -0,0 +1,235 @@ | ||
1 | +/* | |
2 | + * CKEditor(WYSIWYGエディター)の設定 | |
3 | + * | |
4 | + * LICENSE: This source file is licensed under the terms of the GNU General Public License. | |
5 | + * | |
6 | + * @package Magic3 Framework | |
7 | + * @author 平田直毅(Naoki Hirata) <naoki@aplo.co.jp> | |
8 | + * @copyright Copyright 2006-2015 Magic3 Project. | |
9 | + * @license http://www.gnu.org/copyleft/gpl.html GPL License | |
10 | + * @version SVN: $Id$ | |
11 | + * @link http://www.magic3.org | |
12 | + */ | |
13 | +// スタイルメニューの定義 | |
14 | +CKEDITOR.stylesSet.add( 'default', [ | |
15 | + /* Block Styles */ | |
16 | + | |
17 | + // These styles are already available in the "Format" combo ("format" plugin), | |
18 | + // so they are not needed here by default. You may enable them to avoid | |
19 | + // placing the "Format" combo in the toolbar, maintaining the same features. | |
20 | + /* | |
21 | + { name: 'Paragraph', element: 'p' }, | |
22 | + { name: 'Heading 1', element: 'h1' }, | |
23 | + { name: 'Heading 2', element: 'h2' }, | |
24 | + { name: 'Heading 3', element: 'h3' }, | |
25 | + { name: 'Heading 4', element: 'h4' }, | |
26 | + { name: 'Heading 5', element: 'h5' }, | |
27 | + { name: 'Heading 6', element: 'h6' }, | |
28 | + { name: 'Preformatted Text',element: 'pre' }, | |
29 | + { name: 'Address', element: 'address' }, | |
30 | + */ | |
31 | + | |
32 | + { name: 'イタリックタイトル', element: 'h2', styles: { 'font-style': 'italic' } }, | |
33 | + { name: 'サブタイトル', element: 'h3', styles: { 'color': '#aaa', 'font-style': 'italic' } }, | |
34 | + { | |
35 | + name: 'グレーブロック', | |
36 | + element: 'div', | |
37 | + styles: { | |
38 | + padding: '5px 10px', | |
39 | + background: '#eee', | |
40 | + border: '1px solid #ccc' | |
41 | + } | |
42 | + }, | |
43 | + | |
44 | + /* Inline Styles */ | |
45 | + | |
46 | + // These are core styles available as toolbar buttons. You may opt enabling | |
47 | + // some of them in the Styles combo, removing them from the toolbar. | |
48 | + // (This requires the "stylescombo" plugin) | |
49 | + /* | |
50 | + { name: 'Strong', element: 'strong', overrides: 'b' }, | |
51 | + { name: 'Emphasis', element: 'em' , overrides: 'i' }, | |
52 | + { name: 'Underline', element: 'u' }, | |
53 | + { name: 'Strikethrough', element: 'strike' }, | |
54 | + { name: 'Subscript', element: 'sub' }, | |
55 | + { name: 'Superscript', element: 'sup' }, | |
56 | + */ | |
57 | + | |
58 | +// { name: '黄マーカー(span)', element: 'span', styles: { 'background-color': 'Yellow' } }, | |
59 | +// { name: '緑マーカー(span)', element: 'span', styles: { 'background-color': 'Lime' } }, | |
60 | + | |
61 | + { name: '文字大(big)', element: 'big' }, | |
62 | + { name: '文字小(small)', element: 'small' }, | |
63 | + | |
64 | +// { name: 'コード(code)', element: 'code' }, | |
65 | +// { name: 'Keyboard Phrase', element: 'kbd' }, | |
66 | +// { name: 'Sample Text', element: 'samp' }, | |
67 | +// { name: 'Variable', element: 'var' }, | |
68 | + | |
69 | + { name: '削除文(del)', element: 'del' }, | |
70 | + { name: '挿入文(ins)', element: 'ins' }, | |
71 | + | |
72 | + { name: '引用(cite)', element: 'cite' }, | |
73 | + { name: '引用文(q)', element: 'q' }, | |
74 | + | |
75 | +// { name: 'Language: RTL', element: 'span', attributes: { 'dir': 'rtl' } }, | |
76 | +// { name: 'Language: LTR', element: 'span', attributes: { 'dir': 'ltr' } }, | |
77 | + | |
78 | + /* Object Styles */ | |
79 | + | |
80 | + { | |
81 | + name: '画像左寄せ', | |
82 | + element: 'img', | |
83 | + attributes: { 'class': 'left' } | |
84 | + }, | |
85 | + | |
86 | + { | |
87 | + name: '画像右寄せ', | |
88 | + element: 'img', | |
89 | + attributes: { 'class': 'right' } | |
90 | + }, | |
91 | + | |
92 | + { | |
93 | + name: '簡易テーブル', | |
94 | + element: 'table', | |
95 | + attributes: { | |
96 | + cellpadding: '5', | |
97 | + cellspacing: '0', | |
98 | + border: '1', | |
99 | + bordercolor: '#ccc' | |
100 | + }, | |
101 | + styles: { | |
102 | + 'border-collapse': 'collapse' | |
103 | + } | |
104 | + }, | |
105 | + | |
106 | + { name: '枠なしテーブル', element: 'table', styles: { 'border-style': 'hidden', 'background-color': '#E6E6FA' } } | |
107 | +// { name: '四角リスト', element: 'ul', styles: { 'list-style-type': 'square' } } | |
108 | +]); | |
109 | + | |
110 | +CKEDITOR.editorConfig = function( config ) { | |
111 | + // Define changes to default configuration here. | |
112 | + // For the complete reference: | |
113 | + // http://docs.ckeditor.com/#!/api/CKEDITOR.config | |
114 | + config.language = 'ja'; | |
115 | + config.enterMode = CKEDITOR.ENTER_BR; // 改行をbrに変更 | |
116 | + config.shiftEnterMode = CKEDITOR.ENTER_DIV; | |
117 | + config.autoParagraph = false; | |
118 | + config.fillEmptyBlocks = false; // 「 」が自動的に入るのを防ぐ | |
119 | + config.toolbarCanCollapse = true; // ツールバー表示制御 | |
120 | + | |
121 | + // ツールバーの設定 | |
122 | + config.toolbar_Full = [ | |
123 | + { name: 'tools', items: [ 'Maximize', 'ShowBlocks', 'Source' ] }, | |
124 | + { name: 'clipboard', items: [ 'Templates', '-', 'Cut', 'Copy', 'Paste', 'PasteText', 'PasteFromWord', '-', 'Undo', 'Redo' ] }, | |
125 | + { name: 'editing', items : [ 'Find','Replace','-','SelectAll' ] }, | |
126 | + { name: 'insert', items: [ 'Image', 'Flash', 'YouTube', 'Googlemaps', 'Table', 'HorizontalRule' ] }, | |
127 | + { name: 'colors', items : [ 'TextColor', 'BGColor' ] }, | |
128 | + { name: 'others', items: [ 'LinkInfo', 'M3Templates' ] }, | |
129 | + '/', | |
130 | + { name: 'basicstyles', items: [ 'Bold', 'Italic', 'Underline', 'Strike', '-', 'RemoveFormat' ] }, | |
131 | + { name: 'paragraph', items: [ 'NumberedList', 'BulletedList', '-', 'Outdent', 'Indent', /*'-', 'Blockquote', 'CreateDiv',*/ '-', 'JustifyLeft', 'JustifyCenter', 'JustifyRight', 'JustifyBlock' ] }, | |
132 | + { name: 'links', items: [ 'Link', 'Unlink', 'Anchor' ] }, | |
133 | + { name: 'styles', items: [ 'Styles', 'Format', 'FontSize' ] } | |
134 | +// | |
135 | + ]; | |
136 | + config.toolbar_Layout = [ | |
137 | + { name: 'tools', items: [ 'Maximize', 'ShowBlocks' ] }, | |
138 | + { name: 'document', items: [ 'Source' ] }, | |
139 | + { name: 'clipboard', items: [ 'Undo', 'Redo' ] }, | |
140 | + { name: 'basicstyles', items: [ 'Bold', 'Italic', 'Underline', 'Strike', '-', 'RemoveFormat' ] }, | |
141 | + { name: 'paragraph', items: [ 'JustifyLeft', 'JustifyCenter', 'JustifyRight', 'JustifyBlock' ] }, | |
142 | + { name: 'styles', items: [ 'Styles', 'Format', 'FontSize' ] } | |
143 | + ]; | |
144 | + config.stylesCombo_stylesSet = 'default'; | |
145 | + | |
146 | + // メッセージの変更 | |
147 | + config.image_previewText = '<strong>「サーバブラウザ」ボタン</strong>をクリックすると画像ブラウザが立ち上がります。サムネール表示の画像をダブルクリックすると画像が取得できます。画像をアップロードするには、画像ブラウザ上部の「アップロード」ボタンをクリックするか、画像ブラウザ上へ画像ファイルをドロップします。'; | |
148 | + | |
149 | + // 追加プラグインの設定 | |
150 | + config.extraPlugins = 'youtube,googlemaps,linkinfo,m3templates'; | |
151 | + config.removePlugins = 'iframe'; | |
152 | + config.allowedContent = true; // ACF(Advanced Content Filter)を使用しない。SCRIPT,IFRAMEタグ等許可。 | |
153 | +// config.extraAllowedContent = 'iframe'; | |
154 | +// config.autoGrow_maxHeight = 800; // 指定サイズまで入力に合わせて拡大 | |
155 | + | |
156 | + // KCFinderの設定 | |
157 | + if (!jQuery().elfinder){ // elFinderが使用できない場合 | |
158 | + config.filebrowserBrowseUrl = M3_ROOT_URL + '/scripts/kcfinder-2.51/browse.php?type=file'; | |
159 | + config.filebrowserImageBrowseUrl = M3_ROOT_URL + '/scripts/kcfinder-2.51/browse.php?type=image'; | |
160 | + config.filebrowserFlashBrowseUrl = M3_ROOT_URL + '/scripts/kcfinder-2.51/browse.php?type=flash'; | |
161 | + } | |
162 | +}; | |
163 | +CKEDITOR.on('dialogDefinition', function(ev){ | |
164 | + var dialogName = ev.data.name; | |
165 | + var dialogDefinition = ev.data.definition; | |
166 | + var dialog = dialogDefinition.dialog; | |
167 | + | |
168 | + if (dialogName == 'image' || dialogName == 'flash'){ | |
169 | + dialogDefinition.removeContents('Upload'); // 「アップロード」タブ削除 | |
170 | + } | |
171 | + | |
172 | + // ファイルブラウザ | |
173 | + if (jQuery().elfinder){ // elFinderが使用できる場合 | |
174 | + var editor = ev.editor; | |
175 | + var tabCount = dialogDefinition.contents.length; | |
176 | + for (var i = 0; i < tabCount; i++){ | |
177 | + var browseButton = dialogDefinition.contents[i].get('browse'); | |
178 | + | |
179 | + if (browseButton !== null){ | |
180 | + browseButton.hidden = false; | |
181 | + browseButton.onClick = function(dialog, i){ | |
182 | + var title; | |
183 | + | |
184 | + editor._.filebrowserSe = this; | |
185 | + | |
186 | + switch (dialogName){ | |
187 | + case 'image': | |
188 | + title = '画像を選択'; | |
189 | + break; | |
190 | + case 'flash': | |
191 | + title = 'Flashを選択'; | |
192 | + break; | |
193 | + default: | |
194 | + title = 'ファイルを選択'; | |
195 | + break; | |
196 | + } | |
197 | + | |
198 | + $('<div />').dialog({ | |
199 | + title: title, | |
200 | + modal: true, | |
201 | + width: "80%", | |
202 | + zIndex: 99999, | |
203 | + open: function(){ | |
204 | + $(this).parent().css("padding", "0px"); | |
205 | + $(this).css("padding", "0px"); | |
206 | + }, | |
207 | + create: function(event, ui){ | |
208 | + var option = ''; | |
209 | + if (dialogName == 'image' || dialogName == 'flash'){ | |
210 | + option = '?dirtype=' + dialogName; | |
211 | + } else if (dialogName == 'm3link'){ | |
212 | + option = '?dirtype=file'; | |
213 | + } | |
214 | + $(this).elfinder({ | |
215 | + url: M3_ROOT_URL + '/scripts/elfinder-2.1/php/connector.php' + option, | |
216 | + //url: M3_ROOT_URL + '/scripts/elfinder-2.1/php/connector.php' + option, | |
217 | + height: '600px', | |
218 | + lang: 'ja', | |
219 | + resizable: false, | |
220 | + getFileCallback: function(file){ | |
221 | + var url = file.url; | |
222 | + CKEDITOR.tools.callFunction(editor._.filebrowserFn, url); | |
223 | + $('a.ui-dialog-titlebar-close[role="button"]').click(); | |
224 | + } | |
225 | + }).elfinder('instance'); | |
226 | + } | |
227 | + }); | |
228 | + } | |
229 | + } | |
230 | + } | |
231 | + } | |
232 | +}); | |
233 | +CKEDITOR.on('instanceReady',function(){ | |
234 | + if (typeof(m3AdjustParentWindow) == "function") m3AdjustParentWindow(); // フレームサイズ調整 | |
235 | +}); |
@@ -36,29 +36,27 @@ function createUrl() | ||
36 | 36 | $(function(){ |
37 | 37 | m3SetConfigTable('mainconfig'); |
38 | 38 | |
39 | + // URL作成用にCKEditorを直接起動可能にする | |
39 | 40 | m3LoadCKTools(); |
40 | 41 | |
41 | - // スクリプト編集エディター作成 | |
42 | - //m3SetWysiwygEditor('item_content', 500/* 高さ */); | |
43 | - //m3SetScriptEditor('item_content', 500/* 高さ */); | |
44 | -// var scriptFile = M3_ROOT_URL + '/scripts/codemirror-3.1/lib/codemirror.js'; | |
45 | -//$("<script>").attr("src", scriptFile).appendTo("head"); | |
46 | -//CodeMirror.fromTextArea(document.getElementById("item_content"), {mode: "php"}); | |
47 | - var editor = CodeMirror.fromTextArea(document.getElementById("item_content"), { | |
48 | - mode: "javascript", | |
49 | - lineNumbers: true, | |
50 | - matchBrackets: true, | |
51 | - extraKeys: {"Enter": "newlineAndIndentContinueComment"} | |
52 | - }); | |
53 | - | |
42 | + // elFinder用の設定でCKEditorを作成 | |
54 | 43 | var config = {}; |
55 | - config['customConfig'] = M3_ROOT_URL + '/scripts/m3/ckconfig_test.js'; | |
44 | + config['customConfig'] = M3_ROOT_URL + '/scripts/m3/ckconfig_elfinder.js'; | |
56 | 45 | config['toolbar'] = 'Full'; |
57 | 46 | var editor = CKEDITOR.replace('editor', config); |
58 | 47 | var editor2 = CKEDITOR.replace('editor2', config); |
59 | 48 | |
49 | + // 標準のCKEditor作成方法 | |
60 | 50 | //m3SetWysiwygEditor('editor', 100/* 高さ */); |
61 | 51 | //m3SetWysiwygEditor('editor2', 100/* 高さ */); |
52 | + | |
53 | + // スクリプト編集エディター作成 | |
54 | + var editor = CodeMirror.fromTextArea(document.getElementById("item_content"), { | |
55 | + mode: "javascript", | |
56 | + lineNumbers: true, | |
57 | + matchBrackets: true, | |
58 | + extraKeys: {"Enter": "newlineAndIndentContinueComment"} | |
59 | + }); | |
62 | 60 | }); |
63 | 61 | // IEのエラーは非表示 |
64 | 62 | /*function hideIEErrors(){ |