Skip to content

Commit 9d74e12

Browse files
MitchC1999MitchC1999
committed
DOC-3251: Update revisionhistory demo
1 parent 89c6b87 commit 9d74e12

File tree

4 files changed

+110
-151
lines changed

4 files changed

+110
-151
lines changed

‎modules/ROOT/examples/live-demos/revisionhistory/index.js‎

Lines changed: 43 additions & 88 deletions
Original file line numberDiff line numberDiff line change
@@ -1,69 +1,15 @@
1-
const getRandomDelay = () => {
2-
const minDelay = 500;
3-
const maxDelay = 2000;
4-
return Math.floor(Math.random() * (maxDelay - minDelay + 1)) + minDelay;
5-
};
1+
const API_URL = 'https://demouserdirectory.tiny.cloud/users';
62

7-
/* This represents a database of users on the server */
8-
const userDb = {
9-
'john.doe': {
10-
id: 'john.doe',
11-
name: 'John Doe',
12-
avatar: 'https://i.pravatar.cc/150?img=11'
13-
}
14-
};
15-
16-
const lightRevisions = [
17-
{
18-
revisionId: '3',
19-
author: {
20-
id: 'tiny.husky',
21-
name: 'A Tiny Husky',
22-
avatar: '{{imagesdir}}/tiny-husky.jpg',
23-
},
24-
createdAt: '2023-11-25T08:30:21.578Z'
25-
},
26-
{
27-
revisionId: '2',
28-
author: {
29-
id: 'tiny.user',
30-
name: 'A Tiny User',
31-
avatar: '{{imagesdir}}/logos/android-chrome-192x192.png',
32-
},
33-
createdAt: '2023-11-24T22:26:21.578Z',
34-
},
35-
{
36-
revisionId: '1',
37-
author: {
38-
id: 'tiny.user',
39-
name: 'A Tiny User',
40-
avatar: '{{imagesdir}}/logos/android-chrome-192x192.png',
41-
},
42-
createdAt: '2023-11-23T20:26:21.578Z',
43-
},
44-
];
45-
46-
const revisionhistory_fetch = () =>
47-
new Promise((resolve) => {
48-
setTimeout(() => {
49-
resolve(
50-
lightRevisions
51-
.sort((a, b) =>
52-
new Date(a.createdAt) < new Date(b.createdAt) ? -1 : 1
53-
)
54-
.reverse()
55-
);
56-
}, getRandomDelay());
57-
});
3+
const fakeDelay = 200;
584

595
const revisions = [
606
{
617
revisionId: '3',
628
createdAt: '2023-11-24T22:26:21.578Z',
639
author: {
64-
id: 'tiny.husky',
10+
id: 'james-wilson',
6511
name: 'A Tiny Husky',
66-
avatar: '{{imagesdir}}/tiny-husky.jpg',
12+
avatar: 'https://sneak-preview.tiny.cloud/demouserdirectory/images/employee_james-wilson_128_52f19412.jpg',
6713
},
6814
content: `
6915
<p><img style="display: block; margin-left: auto; margin-right: auto;" title="Tiny Logo" src="https://www.tiny.cloud/docs/images/logos/android-chrome-256x256.png" alt="TinyMCE Logo" width="128" height="128"></p>
@@ -101,9 +47,9 @@ const revisions = [
10147
revisionId: '2',
10248
createdAt: '2023-11-25T08:30:21.578Z',
10349
author: {
104-
id: 'tiny.user',
105-
name: 'A Tiny User',
106-
avatar: '{{imagesdir}}/logos/android-chrome-192x192.png',
50+
id: 'mia.andersson',
51+
name: 'Mia Andersson',
52+
avatar: 'https://sneak-preview.tiny.cloud/demouserdirectory/images/employee_mia-andersson_128_e6f9424b.jpg',
10753
},
10854
content: `
10955
<p><img style="display: block; margin-left: auto; margin-right: auto;" title="Tiny Logo" src="https://www.tiny.cloud/docs/images/logos/android-chrome-256x256.png" alt="TinyMCE Logo" width="128" height="128"></p>
@@ -147,9 +93,9 @@ const revisions = [
14793
revisionId: '1',
14894
createdAt: '2023-11-29T10:11:21.578Z',
14995
author: {
150-
id: 'tiny.user',
151-
name: 'A Tiny User',
152-
avatar: '{{imagesdir}}/logos/android-chrome-192x192.png',
96+
id: 'mia.andersson',
97+
name: 'Mia Andersson',
98+
avatar: 'https://sneak-preview.tiny.cloud/demouserdirectory/images/employee_mia-andersson_128_e6f9424b.jpg',
15399
},
154100
content: `
155101
<p><img style="display: block; margin-left: auto; margin-right: auto;" title="Tiny Logo" src="https://www.tiny.cloud/docs/images/logos/android-chrome-256x256.png" alt="TinyMCE Logo" width="128" height="128"></p>
@@ -191,35 +137,44 @@ const revisions = [
191137
}
192138
];
193139

194-
const revisionhistory_fetch_revision = (_editor, revision) =>
195-
new Promise((resolve, reject) => {
196-
setTimeout(() => {
197-
const newRevision = revisions.find((r) => r.revisionId === revision.revisionId);
198-
if (newRevision === undefined) {
199-
reject(`Revision ${revision.revisionId} is not found`);
200-
} else {
201-
resolve(newRevision);
202-
}
203-
}, getRandomDelay());
204-
});
140+
const revisionhistory_fetch = () => new Promise((resolve) => {
141+
setTimeout(() => {
142+
const sortedRevisions = revisions
143+
.sort((a, b) => new Date(a.createdAt) < new Date(b.createdAt) ? 1 : -1);
144+
resolve(sortedRevisions);
145+
}, fakeDelay);
146+
});
147+
148+
const revisionhistory_fetch_revision = (_editor, revision) => new Promise((resolve, reject) => {
149+
setTimeout(() => {
150+
const revision = revisions.find((r) => r.revisionId === revision.revisionId);
151+
if (revision) {
152+
resolve(revision);
153+
} else {
154+
reject(`Revision ${revision.revisionId} is not found`);
155+
}
156+
}, fakeDelay);
157+
});
205158

206159
tinymce.init({
207160
selector: 'textarea#revisionhistory',
208161
height: 800,
209-
plugins: 'revisionhistory',
210-
toolbar: 'revisionhistory',
162+
plugins: 'revisionhistory help code link lists image',
163+
toolbar: 'undo redo | styles | bold italic underline | revisionhistory | link image | code',
211164
content_style: 'body { font-family:Helvetica,Arial,sans-serif; font-size:16px }',
212165
revisionhistory_fetch,
213166
revisionhistory_fetch_revision,
214-
user_id: 'john.doe',
215-
fetch_users: (userIds) => {
216-
return Promise.all(
217-
userIds.map(
218-
(userId) => new Promise(
219-
(resolve) => resolve(userDb[userId] || { id: userId })
220-
)
221-
)
222-
)
223-
},
224-
revisionhistory_display_author: true
167+
revisionhistory_display_author: true,
168+
user_id: 'kai-nakamura',
169+
fetch_users: (userIds) => Promise.all(userIds
170+
.map((userId) =>
171+
fetch(`${API_URL}/${userId}`)
172+
.then((response) => response.json())
173+
.then((user) => ({
174+
id: user.id,
175+
name: user.name,
176+
avatar: user.image,
177+
custom: user
178+
}))
179+
.catch(() => ({ id: userId })))),
225180
});

‎modules/ROOT/examples/live-demos/suggestededits-access-feedback/index.js‎

Lines changed: 22 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -4,25 +4,26 @@ const tinymceElement = document.querySelector('textarea#suggestededits-access-fe
44
const model = JSON.parse(tinymceElement.getAttribute('suggestededits-model'));
55

66
tinymce.init({
7-
selector: 'textarea#suggestededits-access-feedback',
8-
height: 500,
9-
plugins: 'suggestededits advlist anchor autolink code charmap emoticons fullscreen help image link lists media preview searchreplace table',
10-
toolbar: 'undo redo | suggestededits | styles fontsizeinput | bold italic | align bullist numlist | table link image | code',
11-
user_id: 'kai-nakamura',
12-
fetch_users: (userIds) => Promise.all(userIds
13-
.map((userId) =>
14-
fetch(`${API_URL}/${userId}`)
15-
.then((response) => response.json())
16-
.then((user) => ({
17-
id: user.id,
18-
name: user.name,
19-
avatar: user.image,
20-
custom: user
21-
}))
22-
.catch(() => ({ id: userId })))),
23-
content_style: 'body { font-family:Helvetica,Arial,sans-serif; font-size:16px }',
24-
suggestededits_model: model,
25-
readonly: false, // Set to true to prevent edits to the content
26-
suggestededits_access: 'feedback', // Set this value to restrict the permissions in the Suggested Edits view
27-
suggestededits_content: 'html'
7+
selector: 'textarea#suggestededits-access-feedback',
8+
height: 500,
9+
plugins: 'suggestededits advlist anchor autolink code charmap emoticons fullscreen help image link lists media preview searchreplace table',
10+
toolbar: 'undo redo | suggestededits | styles fontsizeinput | bold italic | align bullist numlist | table link image | code',
11+
readonly: false, // Set to true to prevent edits to the content
12+
13+
suggestededits_model: model,
14+
suggestededits_access: 'feedback', // Set this value to restrict the permissions in the Suggested Edits view
15+
suggestededits_content: 'html',
16+
17+
user_id: 'kai-nakamura',
18+
fetch_users: (userIds) => Promise.all(userIds
19+
.map((userId) =>
20+
fetch(`${API_URL}/${userId}`)
21+
.then((response) => response.json())
22+
.then((user) => ({
23+
id: user.id,
24+
name: user.name,
25+
avatar: user.image,
26+
custom: user
27+
}))
28+
.catch(() => ({ id: userId })))),
2829
});

‎modules/ROOT/examples/live-demos/suggestededits-access-read/index.js‎

Lines changed: 23 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -1,28 +1,29 @@
11
const API_URL = 'https://demouserdirectory.tiny.cloud/users';
22

3-
const tinymceElement = document.querySelector('textarea#suggestededits-access-read');
3+
const tinymceElement = document.querySelector('textarea#suggestededits-access-feedback');
44
const model = JSON.parse(tinymceElement.getAttribute('suggestededits-model'));
55

66
tinymce.init({
7-
selector: 'textarea#suggestededits-access-read',
8-
height: 500,
9-
plugins: 'suggestededits advlist anchor autolink code charmap emoticons fullscreen help image link lists media preview searchreplace table',
10-
toolbar: 'undo redo | suggestededits | styles fontsizeinput | bold italic | align bullist numlist | table link image | code',
11-
user_id: 'kai-nakamura',
12-
fetch_users: (userIds) => Promise.all(userIds
13-
.map((userId) =>
14-
fetch(`${API_URL}/${userId}`)
15-
.then((response) => response.json())
16-
.then((user) => ({
17-
id: user.id,
18-
name: user.name,
19-
avatar: user.image,
20-
custom: user
21-
}))
22-
.catch(() => ({ id: userId })))),
23-
content_style: 'body { font-family:Helvetica,Arial,sans-serif; font-size:16px }',
24-
suggestededits_model: model,
25-
readonly: false, // Set to true to prevent edits to the content
26-
suggestededits_access: 'read', // Set this value to restrict the permissions in the Suggested Edits view
27-
suggestededits_content: 'html'
7+
selector: 'textarea#suggestededits-access-read',
8+
height: 500,
9+
plugins: 'suggestededits advlist anchor autolink code charmap emoticons fullscreen help image link lists media preview searchreplace table',
10+
toolbar: 'undo redo | suggestededits | styles fontsizeinput | bold italic | align bullist numlist | table link image | code',
11+
readonly: false, // Set to true to prevent edits to the content
12+
13+
suggestededits_model: model,
14+
suggestededits_access: 'read', // Set this value to restrict the permissions in the Suggested Edits view
15+
suggestededits_content: 'html',
16+
17+
user_id: 'kai-nakamura',
18+
fetch_users: (userIds) => Promise.all(userIds
19+
.map((userId) =>
20+
fetch(`${API_URL}/${userId}`)
21+
.then((response) => response.json())
22+
.then((user) => ({
23+
id: user.id,
24+
name: user.name,
25+
avatar: user.image,
26+
custom: user
27+
}))
28+
.catch(() => ({ id: userId })))),
2829
});

‎modules/ROOT/examples/live-demos/suggestededits/index.js‎

Lines changed: 22 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -4,24 +4,26 @@ const tinymceElement = document.querySelector('textarea#suggestededits');
44
const model = JSON.parse(tinymceElement.getAttribute('suggestededits-model'));
55

66
tinymce.init({
7-
selector: 'textarea#suggestededits',
8-
height: 500,
9-
plugins: 'suggestededits advlist anchor autolink code charmap emoticons fullscreen help image link lists media preview searchreplace table',
10-
toolbar: 'undo redo | suggestededits | styles fontsizeinput | bold italic | align bullist numlist | table link image | code',
11-
user_id: 'kai-nakamura',
12-
fetch_users: (userIds) => Promise.all(userIds
13-
.map((userId) =>
14-
fetch(`${API_URL}/${userId}`)
15-
.then((response) => response.json())
16-
.then((user) => ({
17-
id: user.id,
18-
name: user.name,
19-
avatar: user.image,
20-
custom: user
21-
}))
22-
.catch(() => ({ id: userId })))),
23-
content_style: 'body { font-family:Helvetica,Arial,sans-serif; font-size:16px }',
24-
suggestededits_model: model,
25-
suggestededits_access: 'full',
26-
suggestededits_content: 'html'
7+
selector: 'textarea#suggestededits',
8+
height: 500,
9+
plugins: 'suggestededits advlist anchor autolink code charmap emoticons fullscreen help image link lists media preview searchreplace table',
10+
toolbar: 'undo redo | suggestededits | styles fontsizeinput | bold italic | align bullist numlist | table link image | code',
11+
content_style: 'body { font-family:Helvetica,Arial,sans-serif; font-size:16px }',
12+
13+
suggestededits_model: model,
14+
suggestededits_access: 'full',
15+
suggestededits_content: 'html',
16+
17+
user_id: 'kai-nakamura',
18+
fetch_users: (userIds) => Promise.all(userIds
19+
.map((userId) =>
20+
fetch(`${API_URL}/${userId}`)
21+
.then((response) => response.json())
22+
.then((user) => ({
23+
id: user.id,
24+
name: user.name,
25+
avatar: user.image,
26+
custom: user
27+
}))
28+
.catch(() => ({ id: userId })))),
2729
});

0 commit comments

Comments
 (0)