Changes for page EditSheet

Summary

• Page properties (1 modified, 0 added, 0 removed)
• Objects (2 modified, 0 added, 0 removed)
  • XWiki.JavaScriptExtension[0]
  • XWiki.StyleSheetExtension[0]

Details

Page properties

Content

...	...	@@ -1,38 +1,0 @@
1		-{{include reference="CKEditor.VelocityMacros"/}}
2		-
3		-{{velocity}}
4		-#if ($doc.fullName == 'CKEditor.EditSheet')
5		- This is a sheet for editing the document content using [[CKEditor>>http://ckeditor.com/]].
6		-#else
7		- {{html clean="false"}}
8		- ## Include the auto-save styles.
9		- #set ($discard = $xwiki.ssfx.use('js/xwiki/editors/autosave.css', true))
10		- #if ("$!request.section" != '')
11		- <div class="hidden">
12		- <input type="hidden" name="section" value="$!escapetool.xml($request.section)"/>
13		- </div>
14		- #end
15		- <div class="row">
16		- <div class="cke-editMeta col-xs-12 col-md-7">
17		- ## Add support for editing the page title (which is not available by default in Inline Form edit mode).
18		- #set ($editor = 'wiki')
19		- #template('editmeta.vm')
20		- #set ($editor = 'inline')
21		- </div>
22		- </div>
23		- ## The xwikieditcontent id is needed for the auto-save feature.
24		- <div id="xwikieditcontent" data-autosave="true">
25		- #set ($parameters = {
26		- 'content': $tdoc.content,
27		- 'attributes': {
28		- 'id': 'content',
29		- 'name': 'content',
30		- 'rows': 25,
31		- 'cols': 80
32		- }
33		- })
34		- #ckeditor($parameters)
35		- </div>
36		- {{/html}}
37		-#end
38		-{{/velocity}}

XWiki.JavaScriptExtension[0]

Code

...	...	@@ -54,9 +54,11 @@
54	54	}
55	55
56	56	var uploadDisabled = element.hasAttribute('data-upload-disabled');
	57	+ var startupFocus = element.hasAttribute('data-startup-focus');
57	57
58	58	var config = {
59	59	filebrowserUploadUrl: uploadDisabled ? '' : getUploadURL(sourceDocument, 'filebrowser'),
	61	+ startupFocus,
60	60	height: $(element).height(),
61	61	// Used to resolve and serialize relative references. Also used to make HTTP requests with the right context.
62	62	sourceDocument: sourceDocument,
...	...	@@ -127,5 +127,49 @@
127	127	object[key] = newValue;
128	128	};
129	129
	132	+ // See XWIKI-21351: Macros using RequireJS are not properly displayed by the standalone WYSIWYG editor even when
	133	+ // JavaScript is enabled.
	134	+ //
	135	+ // For each CKEditor instance that uses a separate DOM document for the edited content (i.e. classical iframe-based
	136	+ // editor) we overwrite the appendChild and insertBefore functions of the initial HEAD element in order to make sure
	137	+ // that RequireJS appends the script tags to the current HEAD element (because the HEAD element is overwritten each
	138	+ // time the edited content is reloaded, like when inserting a macro or switching between Source and WYSIWYG modes).
	139	+ //
	140	+ // We have to overwrite both appendChild and insertBefore because depending on the presence of the BASE element
	141	+ // RequireJS uses one or the other.
	142	+ ckeditor.on('instanceReady', ({editor}) => {
	143	+ if (editor.document.$ !== document) {
	144	+ // This editor instance is using a separate DOM document for editing which means it's a standalone editor.
	145	+ const initialHead = editor.document.$.head;
	146	+ const originalAppendChild = initialHead.appendChild;
	147	+ initialHead.appendChild = function() {
	148	+ const currentHead = editor.document.$.head;
	149	+ if (currentHead !== initialHead) {
	150	+ // The edited content has been reloaded. Append to the current HEAD.
	151	+ return currentHead.appendChild.apply(currentHead, arguments);
	152	+ } else {
	153	+ // Still using the initial HEAD so preserve the default behavior.
	154	+ originalAppendChild.apply(initialHead, arguments);
	155	+ }
	156	+ };
	157	+ const originalInsertBefore = initialHead.insertBefore;
	158	+ initialHead.insertBefore = function(newChild, existingChild) {
	159	+ const currentHead = editor.document.$.head;
	160	+ if (currentHead !== initialHead) {
	161	+ // The edited content has been reloaded. Normally the given existingChild should be a child of the initial
	162	+ // HEAD element (not the current one), but better check to be sure.
	163	+ if (existingChild.parentNode === currentHead) {
	164	+ return currentHead.insertBefore(newChild, existingChild);
	165	+ } else {
	166	+ return currentHead.appendChild.apply(newChild);
	167	+ }
	168	+ } else {
	169	+ // Still using the initial HEAD so preserve the default behavior.
	170	+ return originalInsertBefore.apply(initialHead, arguments);
	171	+ }
	172	+ };
	173	+ }
	174	+ });
	175	+
130	130	return $.Deferred().resolve(ckeditor).promise();
131	131	});

XWiki.StyleSheetExtension[0]

Code

...	...	@@ -204,8 +204,6 @@
204	204	a.cke_button.cke_button__xwiki-macro-edit > span.cke_button_icon.cke_button__xwiki-macro-edit_icon,
205	205	a.cke_button.cke_button__xwiki-link-open > span.cke_button_icon.cke_button__xwiki-link-open_icon,
206	206	a.cke_button.cke_button__insert > span.cke_button_icon.cke_button__insert_icon {
207		- /* This is needed for XWiki versions older than 7.1M1 where we overwrite the icons path (see above). */
208		- background-image: none !important;
209	209	font-family: 'Glyphicons Halflings';
210	210	position: relative;
211	211	top: 1px;
...	...	@@ -236,7 +236,7 @@
236	236	*/
237	237	ul.cke_autocomplete_panel {
238	238	border: 1px solid rgba(0, 0, 0, 0.15);
239		- border-radius: 4px;
	237	+ border-radius: @border-radius-base;
240	240	box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
241	241	font: inherit;
242	242	padding: 5px 0;
...	...	@@ -288,7 +288,7 @@
288	288	width: 14px;
289	289	}
290	290	.ckeditor-autocomplete-item-icon-wrapper img {
291		- border-radius: 3px;
	289	+ border-radius: @border-radius-small;
292	292	max-height: 14px;
293	293	max-width: 14px;
294	294	vertical-align: text-top;
...	...	@@ -307,12 +307,12 @@
307	307	justify-content: center;
308	308	}
309	309	.ckeditor-autocomplete-item-preview-wrapper img {
310		- border-radius: 3px;
	308	+ border-radius: @border-radius-small;
311	311	max-height: 64px;
312	312	max-width: 64px;
313	313	vertical-align: text-top;
314	314	}
315		-/* The image still takes some space in IE11 even if there's no source specified. Let's make sure it's hidden.
	313	+/* The image still takes some space in all browsers even if there's no source specified. Let's make sure it's hidden.
316	316	See CKEDITOR-389: Missing space in the suggestions that appear while using the autocomplete function on IE 11 */
317	317	.ckeditor-autocomplete-item-preview-wrapper img[src=""],
318	318	.ckeditor-autocomplete-item-icon-wrapper img[src=""] {
...	...	@@ -448,3 +448,20 @@
448	448	z-index: 9995;
449	449	}
450	450	}
	449	+
	450	+/*
	451	+ * Override the CKEditor reset for the table border color.
	452	+ * The default border color from CKEditor is quite lacking on contrast.
	453	+ */
	454	+.cke_editable.cke_show_borders table.cke_show_border,
	455	+.cke_editable.cke_show_borders table.cke_show_border > tr > th,
	456	+.cke_editable.cke_show_borders table.cke_show_border > tr > td,
	457	+.cke_editable.cke_show_borders table.cke_show_border > thead > tr > th,
	458	+.cke_editable.cke_show_borders table.cke_show_border > thead > tr > td,
	459	+.cke_editable.cke_show_borders table.cke_show_border > tbody > tr > th,
	460	+.cke_editable.cke_show_borders table.cke_show_border > tbody > tr > td,
	461	+.cke_editable.cke_show_borders table.cke_show_border > tfoot > tr > th,
	462	+.cke_editable.cke_show_borders table.cke_show_border > tfoot > tr > td {
	463	+ border-color: @table-border-color;
	464	+ border-style: solid;
	465	+}