Skip to Content

Changes for page EditSheet

Last modified by teamwire005 on 2025/05/06 08:20
From version 3.1
edited by teamwire004
on 2024/01/16 09:33
Change comment: Install extension [org.xwiki.platform:xwiki-platform-ckeditor-ui/14.10.13]
To version 1.1
edited by teamwire001
on 2021/06/11 07:39
Change comment: Install extension [org.xwiki.contrib:application-ckeditor-ui/1.53.2]

Summary

Details

Page properties
Author
... ... @@ -1,1 +1,1 @@
1 -XWiki.teamwire004
1 +XWiki.teamwire001
XWiki.JavaScriptExtension[0]
Code
... ... @@ -1,40 +1,49 @@
1 1  /*
2 -#if ($services.debug.minify)
3 - #set ($jsExtension = '.min')
4 -#else
5 - #set ($jsExtension = '')
2 +#set ($ckeditorPath = $services.webjars.url('org.xwiki.contrib:application-ckeditor-webjar', 'ckeditor'))
3 +#set ($bootstrap3typeaheadPath = $services.webjars.url('org.webjars.npm:bootstrap-3-typeahead', 'bootstrap3-typeahead.min'))
4 +#set ($fastDiffPath = $services.webjars.url('org.webjars.npm:fast-diff', 'diff'))
5 +#if ($ckeditorPath.indexOf('?') >= 0)
6 + ## Before XWiki 7.1M1 the WebJar resource path was included in the query string which means we have to specify the
7 + ## '.js' extension (Require.js doesn't add it in this case).
8 + #set ($ckeditorPath = "${ckeditorPath}.js")
9 + #set ($bootstrap3typeaheadPath = "${bootstrap3typeaheadPath}.js")
10 + #set ($fastDiffPath = "${$fastDiffPath}.js")
6 6  #end
7 -#set ($ckeditorPath = $services.webjars.url('org.xwiki.platform:xwiki-platform-ckeditor-webjar', 'ckeditor'))
8 8  #set ($ckeditorBasePath = $stringtool.removeEnd($stringtool.removeEnd($ckeditorPath, '.js'), 'ckeditor'))
9 -#set ($resourcePickerBundlePath = "${ckeditorBasePath}plugins/xwiki-resource/resourcePicker.bundle$jsExtension")
10 -#set ($macroWizardBundlePath = "${ckeditorBasePath}plugins/xwiki-macro/macroWizard.bundle$jsExtension")
11 -#set ($imageWizardBundlePath = "${ckeditorBasePath}plugins/xwiki-image/imageWizard.bundle$jsExtension")
13 +#set ($resourcePickerBundlePath = "${ckeditorBasePath}plugins/xwiki-resource/resourcePicker.bundle.min")
14 +#set ($macroWizardBundlePath = "${ckeditorBasePath}plugins/xwiki-macro/macroWizard.bundle.min")
12 12  #set ($modalPath = "${ckeditorBasePath}plugins/xwiki-dialog/modal.min")
13 13  #set ($l10nPath = "${ckeditorBasePath}plugins/xwiki-localization/l10n.min")
17 +#if ($resourcePickerBundlePath.indexOf('?') >= 0)
18 + ## Before XWiki 7.1M1 the WebJar resource path was included in the query string which means we have to specify the
19 + ## '.js' extension (Require.js doesn't add it in this case).
20 + #set ($resourcePickerBundlePath = "${resourcePickerBundlePath}.js")
21 + #set ($macroWizardBundlePath = "${macroWizardBundlePath}.js")
22 + #set ($modalPath = "${modalPath}.js")
23 + #set ($l10nPath = "${l10nPath}.js")
24 +#end
14 14  */
15 15  require.config({
16 16   paths: {
17 17   ckeditor: '$!ckeditorPath',
18 - resourcePickerBundle: '$!resourcePickerBundlePath',
29 + resource: '$!resourcePickerBundlePath',
30 + resourcePicker: '$!resourcePickerBundlePath',
31 + entityResourcePicker: '$!resourcePickerBundlePath',
32 + entityResourceSuggester: '$!resourcePickerBundlePath',
33 + entityResourceDisplayer: '$!resourcePickerBundlePath',
19 19   modal: '$!modalPath',
20 20   l10n: '$!l10nPath',
21 21   macroWizard: '$!macroWizardBundlePath',
22 - imageWizard: '$!imageWizardBundlePath',
23 23   // This is used by the resource suggest picker on the link modal.
24 - 'bootstrap3-typeahead': $jsontool.serialize($services.webjars.url('org.webjars.npm:bootstrap-3-typeahead',
25 - 'bootstrap3-typeahead.min')),
38 + 'bootstrap3-typeahead': '$!bootstrap3typeaheadPath',
26 26   // This is used to preserve the selection when switching between WYSIWYG and Source modes.
27 - 'fast-diff': $jsontool.serialize($services.webjars.url('org.webjars.npm:fast-diff', 'diff'))
40 + 'fast-diff': '$!fastDiffPath'
28 28   },
29 - bundles: {
30 - 'resourcePickerBundle': ['resource', 'resourcePicker', 'entityResourcePicker', 'entityResourceSuggester',
31 - 'entityResourceDisplayer']
32 - },
33 33   shim: {
34 34   ckeditor: {
35 35   exports: 'CKEDITOR',
36 36   // This includes dependencies of the plugins bundled with the CKEditor code.
37 - deps: ['jquery', 'resource', 'resourcePicker', 'macroWizard', 'imageWizard']
46 + deps: ['jquery', 'resource', 'resourcePicker', 'macroWizard']
38 38   }
39 39   },
40 40   config: {
... ... @@ -63,6 +63,53 @@
63 63   "$!services.webjars.url('org.xwiki.platform:xwiki-platform-tree-webjar', 'require-config.min.js', {'evaluate': true})"
64 64  ], function($, ckeditor, xwikiMeta) {
65 65   var deferred = $.Deferred();
75 +
76 + var loadJavaScriptSkinExtensions = $jsontool.serialize($xwiki.getDocument('CKEditor.Config'
77 + ).getValue('loadJavaScriptSkinExtensions')) === 1;
78 +
79 + // See http://docs.ckeditor.com/#!/guide/dev_allowed_content_rules
80 + var allowedContentBySyntax = {
81 + 'xwiki/2.1': {
82 + '$1': {
83 + elements: {
84 + // Elements required because the editor input is a full HTML page.
85 + html: true, head: true, link: true, script: loadJavaScriptSkinExtensions, body: true,
86 + // Headings
87 + h1: true, h2: true, h3: true, h4: true, h5: true, h6: true,
88 + // Lists
89 + dl: true, ol: true, ul: true,
90 + // Tables
91 + table: true, tr: true, th: true, td: true,
92 + // Formatting
93 + span: true, strong: true, em: true, ins: true, del: true, sub: true, sup: true, tt: true, pre: true,
94 + // Others
95 + div: true, hr: true, p: true, a: true, img: true, blockquote: true
96 + },
97 + // The elements above can have any attribute, through the parameter (%%) syntax.
98 + attributes: '*',
99 + styles: '*',
100 + classes: '*'
101 + },
102 + '$2': {
103 + // The XWiki syntax doesn't support parameters for the following elements.
104 + elements: {br: true, dd: true, dt: true, li: true, tbody: true}
105 + },
106 + '$3': {
107 + // Wiki syntax macros can output any HTML.
108 + match: CKEDITOR.plugins.xwikiMacro.isMacroOutput,
109 + attributes: '*',
110 + styles: '*',
111 + classes: '*'
112 + }
113 + },
114 + 'plain/1.0': ';'
115 + };
116 + allowedContentBySyntax['xwiki/2.0'] = allowedContentBySyntax['xwiki/2.1'];
117 + // This is a hack, increasing the technical debt since the CKEditor module should not know about the Markdown
118 + // syntax. Actually it should not know either about the xwiki/2.0 and xwiki/2.1 syntaxes ;)
119 + // This should be fixed by implementing https://jira.xwiki.org/browse/CKEDITOR-319
120 + allowedContentBySyntax['markdown/1.2'] = allowedContentBySyntax['xwiki/2.1'];
121 +
66 66   var currentLocale = $('html').attr('lang') || '';
67 67  
68 68   // We have to pass the plugin that makes the request (the initiator) because the expected response can be different
... ... @@ -71,7 +71,6 @@
71 71   return document.getURL('get', $.param({
72 72   sheet: 'CKEditor.FileUploader',
73 73   outputSyntax: 'plain',
74 - // The syntax and language are important especially when the upload request creates a new document.
75 75   syntax: document.syntax,
76 76   language: currentLocale,
77 77   form_token: xwikiMeta.form_token,
... ... @@ -81,26 +81,45 @@
81 81  
82 82   // Extend the default CKEditor configuration with settings that depend on the source document.
83 83   var getConfig = function(element) {
84 - var sourceSyntax = $(element).attr('data-syntax');
85 85   var sourceDocument = XWiki.currentDocument;
86 - sourceDocument.syntax = XWiki.docsyntax;
87 - var sourceDocumentReference = XWiki.Model.resolve($(element).attr('data-sourceDocumentReference'),
88 - XWiki.EntityType.DOCUMENT, XWiki.currentDocument.documentReference);
89 - if (!XWiki.currentDocument.documentReference.equals(sourceDocumentReference)) {
90 - sourceDocument = new XWiki.Document(sourceDocumentReference);
91 - // We assume the syntax of the source document is the same as the syntax of the edited content.
92 - sourceDocument.syntax = sourceSyntax;
140 + var sourceDocumentReference = $(element).attr('data-sourceDocumentReference');
141 + if (sourceDocumentReference) {
142 + sourceDocument = new XWiki.Document(XWiki.Model.resolve(sourceDocumentReference, XWiki.EntityType.DOCUMENT));
93 93   }
94 -
95 - var uploadDisabled = element.hasAttribute('data-upload-disabled');
96 -
144 + sourceDocument.syntax = $(element).attr('data-sourceDocumentSyntax');
97 97   var config = {
98 - filebrowserUploadUrl: uploadDisabled ? '' : getUploadURL(sourceDocument, 'filebrowser'),
146 + allowedContent: allowedContentBySyntax[sourceDocument.syntax],
147 + editorplaceholder: $jsontool.serialize($services.localization.render('ckeditor.content.placeholder')),
148 + filebrowserUploadUrl: getUploadURL(sourceDocument, 'filebrowser'),
149 + // This is used in CKEditor.FileUploader so we must keep them in sync.
150 + fileTools_defaultFileName: '__fileCreatedFromDataURI__',
99 99   height: $(element).height(),
152 + // CKEditor uses '-' (dash) as locale separator (between the language code and the country code).
153 + language: currentLocale.toLowerCase().replace('_', '-'),
154 + uploadUrl: getUploadURL(sourceDocument, 'filetools'),
155 + 'xwiki-link': {
156 + labelGenerator: sourceDocument.getURL('get', $.param({
157 + sheet: 'CKEditor.LinkLabelGenerator',
158 + outputSyntax: 'plain',
159 + language: currentLocale
160 + }))
161 + },
162 + 'xwiki-resource': {
163 + dispatcher: sourceDocument.getURL('get', $.param({
164 + sheet: 'CKEditor.ResourceDispatcher',
165 + outputSyntax: 'plain',
166 + language: currentLocale
167 + }))
168 + },
169 + 'xwiki-source': {
170 + htmlConverter: sourceDocument.getURL('get', $.param({
171 + sheet: 'CKEditor.HTMLConverter',
172 + outputSyntax: 'plain',
173 + language: currentLocale
174 + }))
175 + },
100 100   mentions: [
101 101   {
102 - // We use the source document to compute the feed URL because we want the suggested link references to be
103 - // relative to the edited document (we want the editor to output relative references as much as possible).
104 104   feed: sourceDocument.getURL('get', $.param({
105 105   sheet: 'CKEditor.LinkSuggestions',
106 106   outputSyntax: 'plain',
... ... @@ -121,28 +121,20 @@
121 121   '<div class="ckeditor-autocomplete-item-hint">{hint}</div>',
122 122   '</li>'].join(''),
123 123   outputTemplate: '<a href="{url}" data-reference="{typed}|-|{type}|-|{reference}">{label}</a>',
124 - followingSpace: true,
125 125   marker: '[',
126 126   minChars: 0,
127 127   itemsLimit: 6
128 128   }
129 - ],
130 - // Used to resolve and serialize relative references. Also used to make HTTP requests with the right context.
131 - sourceDocument: sourceDocument,
132 - // The syntax of the edited content is not always the same as the syntax of the source document (which applies to
133 - // the source document content, but we might be editing something else, like an object property).
134 - sourceSyntax: sourceSyntax,
135 - uploadUrl: uploadDisabled ? '' : getUploadURL(sourceDocument, 'filetools'),
136 - 'xwiki-link': {
137 - // We use the source document to compute the link label generator URL because we want the link references to be
138 - // resolved relative to the edited document (as they were inserted).
139 - labelGenerator: sourceDocument.getURL('get', $.param({
140 - sheet: 'CKEditor.LinkLabelGenerator',
141 - outputSyntax: 'plain',
202 + ]
203 + };
204 + if ($(element).attr('data-officeImporterSupported') === 'true') {
205 + config['xwiki-office'] = {
206 + importer: sourceDocument.getURL('get', $.param({
207 + sheet: 'CKEditor.OfficeImporter',
142 142   language: currentLocale
143 143   }))
144 - }
145 - };
210 + };
211 + }
146 146   return config;
147 147   };
148 148  
XWiki.JavaScriptExtension[1]
Code
... ... @@ -163,3 +163,16 @@
163 163   ckeEditMeta.attr('id', 'editMeta').addClass('col-md-pull-5')
164 164   .before($('#contentmenu').parent('.col-md-5').addClass('col-md-push-7'));
165 165  });
166 +
167 +// Activate the auto-save feature on XWiki versions older than 8.2RC1 (XE-1562), where CKEditor is not the default
168 +// WYSIWYG editor and thus it is loaded with a sheet (CKEditor.EditSheet). Note that for XWiki 8.2RC1 and 8.2 (where
169 +// CKEditor is the default WYSIWYG editor) the auto-save feature is not activated because the WYSIWYG edit mode doesn't
170 +// active it. This has been fixed in 8.2.1 and 8.3M1 (XWIKI-8614).
171 +// Note that we can't enable auto-save by loading autosave.js from the editing sheet (CKEditor.EditSheet) because on
172 +// older versions of XWiki (XWIKI-8614) autosave.js needs to be loaded after actionbuttons.js, which is loaded after the
173 +// editing sheet is rendered.
174 +require(['jquery'], function($) {
175 + if ($('#xwikieditcontent').data('autosave')) {
176 + require(["$xwiki.getSkinFile('js/xwiki/editors/autosave.js', true)"]);
177 + }
178 +});
XWiki.JavaScriptExtension[2]
Code
... ... @@ -1,11 +1,4 @@
1 1  require(['jquery', 'xwiki-ckeditor', 'xwiki-events-bridge'], function($, ckeditorPromise) {
2 - // Make sure we don't create the editors twice because this file can be loaded twice (by RequireJS, for in-place
3 - // editing, and as a JSX resource, for standalone editing).
4 - if (ckeditorPromise.__editSheetLoaded) {
5 - return;
6 - }
7 - ckeditorPromise.__editSheetLoaded = true;
8 -
9 9   var createEditors = function(ckeditor, container) {
10 10   container.find('.ckeditor-textarea').each(function() {
11 11   // Wrap in try/catch so that a failure to load one editor doesn't affect the other editors.
... ... @@ -20,9 +20,9 @@
20 20   var createEditor = function(ckeditor, textArea, instanceConfig) {
21 21   var deferred = $.Deferred();
22 22   var editor = ckeditor.replace(textArea, instanceConfig);
23 - editor.once('instanceReady', deferred.resolve.bind(deferred, editor));
16 + editor.once('instanceReady', $.proxy(deferred, 'resolve', editor));
24 24   editor.once('reload', function(event) {
25 - event.data.promise = event.data.promise.then(createEditor.bind(null, ckeditor, textArea));
18 + event.data.promise = event.data.promise.then($.proxy(createEditor, null, ckeditor, textArea));
26 26   });
27 27   return deferred.promise();
28 28   };
XWiki.StyleSheetExtension[0]
Code
... ... @@ -1,7 +1,7 @@
1 1  #template('colorThemeInit.vm')
2 2  
3 3  /*
4 -#set ($ckeditorSkinPath = $services.webjars.url('org.xwiki.platform:xwiki-platform-ckeditor-webjar', 'skins/moono-lisa'))
4 +#set ($ckeditorSkinPath = $services.webjars.url('org.xwiki.contrib:application-ckeditor-webjar', 'skins/moono-lisa'))
5 5  #if ($ckeditorSkinPath.indexOf('?') >= 0)
6 6   ## The WebJar resource path was specified in the query string before 7.1M1 which prevented the browser from resolving
7 7   ## relative paths. See XWIKI-10880 (A CSS file inside a webjar cannot use a resource from that webjar).
XWiki.UIExtensionClass[0]
Extension Parameters
... ... @@ -1,2 +1,2 @@
1 1  id=xwiki-ckeditor
2 -path=$xwiki.getURL('CKEditor.EditSheet', 'jsx', $escapetool.url({'v': $services.extension.installed.getInstalledExtension('org.xwiki.platform:xwiki-platform-ckeditor-ui', "wiki:$xcontext.database").version.value, 'xwiki-version': $services.extension.core.getCoreExtension('org.xwiki.platform:xwiki-platform-tree-webjar').version.value, 'fast-diff-version': $services.extension.installed.getInstalledExtension('org.webjars.npm:fast-diff', "wiki:$xcontext.database").version.value, 'bs3typeahead-version': $services.extension.installed.getInstalledExtension('org.webjars.npm:bootstrap-3-typeahead', "wiki:$xcontext.database").version.value}))
2 +path=$xwiki.getURL('CKEditor.EditSheet', 'jsx', $escapetool.url({'v': $services.extension.installed.getInstalledExtension('org.xwiki.contrib:application-ckeditor-ui', "wiki:$xcontext.database").version.value, 'xwiki-version': $services.extension.core.getCoreExtension('org.xwiki.platform:xwiki-platform-tree-webjar').version.value, 'fast-diff-version': $services.extension.installed.getInstalledExtension('org.webjars.npm:fast-diff', "wiki:$xcontext.database").version.value, 'bs3typeahead-version': $services.extension.installed.getInstalledExtension('org.webjars.npm:bootstrap-3-typeahead', "wiki:$xcontext.database").version.value}))