Fossil SCM

Moved Save button to the Preview tab, as that follows the common app-wide pattern of not enabling a save until a preview has first been triggered.

stephan 2020-07-31 04:33 ajax-wiki-editor
Commit 31296ec2040928b65e7b2f3a7f211a753f623e6daa074dc35617eb8e86df2096
Parent d5e4d7a9a92ff0f…
3 files changed +20 -10 +1 -1 +5 -5
~ src/fossil.page.wikiedit.js ~ src/style.wikiedit.css ~ src/wiki.c
M src/fossil.page.wikiedit.js
+20 -10
--- src/fossil.page.wikiedit.js
+++ src/fossil.page.wikiedit.js
@@ -570,10 +570,12 @@
570570
 };
571571
 F.fetch.aftersend = function(){
572572
 if(0===--ajaxState.count){
573573
 D.removeClass(document.body, 'waiting');
574574
 D.enable(ajaxState.toDisable);
575
+ delete ajaxState.toDisable /* required to avoid enable/disable
576
+ race condition with the save button */;
575577
 }
576578
 };
577579
578580
 F.onPageLoad(function() {
579581
 document.body.classList.add('wikiedit');
@@ -582,11 +584,11 @@
582584
 P.tabs = new fossil.TabManager('#wikiedit-tabs');
583585
 P.e = { /* various DOM elements we work with... */
584586
 taEditor: E('#wikiedit-content-editor'),
585587
 // btnCommit: E("#wikiedit-btn-commit"),
586588
 btnReload: E("#wikiedit-tab-content button.wikiedit-content-reload"),
587
- btnSave: E("#wikiedit-tab-save button.wikiedit-save"),
589
+ btnSave: E("button.wikiedit-save"),
588590
 selectMimetype: E('select[name=mimetype]'),
589591
 selectFontSizeWrap: E('#select-font-size'),
590592
 // selectDiffWS: E('select[name=diff_ws]'),
591593
 cbAutoPreview: E('#cb-preview-autoupdate > input[type=checkbox]'),
592594
 previewTarget: E('#wikiedit-tab-preview-wrapper'),
@@ -595,11 +597,11 @@
595597
 tabs:{
596598
 pageList: E('#wikiedit-tab-pages'),
597599
 content: E('#wikiedit-tab-content'),
598600
 preview: E('#wikiedit-tab-preview'),
599601
 diff: E('#wikiedit-tab-diff'),
600
- save: E('#wikiedit-tab-save')
602
+ misc: E('#wikiedit-tab-misc')
601603
 //commit: E('#wikiedit-tab-commit')
602604
 }
603605
 };
604606
605607
 P.tabs.e.container.insertBefore(
@@ -612,10 +614,11 @@
612614
 P.tabs.addEventListener(
613615
 /* Set up some before-switch-to tab event tasks... */
614616
 'before-switch-to', function(ev){
615617
 if(ev.detail===P.e.tabs.preview){
616618
 P.baseHrefForWiki();
619
+ P.updateSaveButton();
617620
 if(P.previewNeedsUpdate && P.e.cbAutoPreview.checked) P.preview();
618621
 }else if(ev.detail===P.e.tabs.diff){
619622
 /* Work around a weird bug where the page gets wider than
620623
 the window when the diff tab is NOT in view and the
621624
 current SBS diff widget is wider than the window. When
@@ -623,19 +626,12 @@
623626
 the page size again. Weird. Maybe FF-specific. Note that
624627
 this weirdness happens even though P.e.diffTarget's parent
625628
 is hidden (and therefore P.e.diffTarget is also hidden).
626629
 */
627630
 D.removeClass(P.e.diffTarget, 'hidden');
628
- }else if(ev.detail===P.e.tabs.save){
629
- const btn = P.e.btnSave;
631
+ }else if(ev.detail===P.e.tabs.misc){
630632
 P.updateAttachmentView();
631
- if(!P.winfo || !P.getStashedWinfo(P.winfo)){
632
- D.disable(btn).innerText =
633
- "There are no changes to save";
634
- }else{
635
- D.enable(btn).innerText = "Save changes";
636
- }
637633
 }
638634
 }
639635
 );
640636
 P.tabs.addEventListener(
641637
 /* Set up auto-refresh of the preview tab... */
@@ -810,10 +806,24 @@
810806
 title = title.join(' ');
811807
 f.titleElement.innerText = title;
812808
 f.pageTitleHeader.innerText = title;
813809
 return this;
814810
 };
811
+
812
+ /**
813
+ Change the save button depending on whether we have stuff to save
814
+ or not.
815
+ */
816
+ P.updateSaveButton = function(){
817
+ if(!this.winfo || !this.getStashedWinfo(this.winfo)){
818
+ D.disable(this.e.btnSave).innerText =
819
+ "There are no changes to save";
820
+ }else{
821
+ D.enable(this.e.btnSave).innerText = "Save changes";
822
+ }
823
+ return this;
824
+ };
815825
816826
 /** Updates attachment-related links and returns this. */
817827
 P.updateAttachmentView = function(){
818828
 const wrapper = P.e.attachmentWrapper;
819829
 D.clearElement(wrapper);
820830
--- src/fossil.page.wikiedit.js
+++ src/fossil.page.wikiedit.js
@@ -570,10 +570,12 @@
570 };
571 F.fetch.aftersend = function(){
572 if(0===--ajaxState.count){
573 D.removeClass(document.body, 'waiting');
574 D.enable(ajaxState.toDisable);
 
 
575 }
576 };
577
578 F.onPageLoad(function() {
579 document.body.classList.add('wikiedit');
@@ -582,11 +584,11 @@
582 P.tabs = new fossil.TabManager('#wikiedit-tabs');
583 P.e = { /* various DOM elements we work with... */
584 taEditor: E('#wikiedit-content-editor'),
585 // btnCommit: E("#wikiedit-btn-commit"),
586 btnReload: E("#wikiedit-tab-content button.wikiedit-content-reload"),
587 btnSave: E("#wikiedit-tab-save button.wikiedit-save"),
588 selectMimetype: E('select[name=mimetype]'),
589 selectFontSizeWrap: E('#select-font-size'),
590 // selectDiffWS: E('select[name=diff_ws]'),
591 cbAutoPreview: E('#cb-preview-autoupdate > input[type=checkbox]'),
592 previewTarget: E('#wikiedit-tab-preview-wrapper'),
@@ -595,11 +597,11 @@
595 tabs:{
596 pageList: E('#wikiedit-tab-pages'),
597 content: E('#wikiedit-tab-content'),
598 preview: E('#wikiedit-tab-preview'),
599 diff: E('#wikiedit-tab-diff'),
600 save: E('#wikiedit-tab-save')
601 //commit: E('#wikiedit-tab-commit')
602 }
603 };
604
605 P.tabs.e.container.insertBefore(
@@ -612,10 +614,11 @@
612 P.tabs.addEventListener(
613 /* Set up some before-switch-to tab event tasks... */
614 'before-switch-to', function(ev){
615 if(ev.detail===P.e.tabs.preview){
616 P.baseHrefForWiki();
 
617 if(P.previewNeedsUpdate && P.e.cbAutoPreview.checked) P.preview();
618 }else if(ev.detail===P.e.tabs.diff){
619 /* Work around a weird bug where the page gets wider than
620 the window when the diff tab is NOT in view and the
621 current SBS diff widget is wider than the window. When
@@ -623,19 +626,12 @@
623 the page size again. Weird. Maybe FF-specific. Note that
624 this weirdness happens even though P.e.diffTarget's parent
625 is hidden (and therefore P.e.diffTarget is also hidden).
626 */
627 D.removeClass(P.e.diffTarget, 'hidden');
628 }else if(ev.detail===P.e.tabs.save){
629 const btn = P.e.btnSave;
630 P.updateAttachmentView();
631 if(!P.winfo || !P.getStashedWinfo(P.winfo)){
632 D.disable(btn).innerText =
633 "There are no changes to save";
634 }else{
635 D.enable(btn).innerText = "Save changes";
636 }
637 }
638 }
639 );
640 P.tabs.addEventListener(
641 /* Set up auto-refresh of the preview tab... */
@@ -810,10 +806,24 @@
810 title = title.join(' ');
811 f.titleElement.innerText = title;
812 f.pageTitleHeader.innerText = title;
813 return this;
814 };
 
 
 
 
 
 
 
 
 
 
 
 
 
 
815
816 /** Updates attachment-related links and returns this. */
817 P.updateAttachmentView = function(){
818 const wrapper = P.e.attachmentWrapper;
819 D.clearElement(wrapper);
820
--- src/fossil.page.wikiedit.js
+++ src/fossil.page.wikiedit.js
@@ -570,10 +570,12 @@
570 };
571 F.fetch.aftersend = function(){
572 if(0===--ajaxState.count){
573 D.removeClass(document.body, 'waiting');
574 D.enable(ajaxState.toDisable);
575 delete ajaxState.toDisable /* required to avoid enable/disable
576 race condition with the save button */;
577 }
578 };
579
580 F.onPageLoad(function() {
581 document.body.classList.add('wikiedit');
@@ -582,11 +584,11 @@
584 P.tabs = new fossil.TabManager('#wikiedit-tabs');
585 P.e = { /* various DOM elements we work with... */
586 taEditor: E('#wikiedit-content-editor'),
587 // btnCommit: E("#wikiedit-btn-commit"),
588 btnReload: E("#wikiedit-tab-content button.wikiedit-content-reload"),
589 btnSave: E("button.wikiedit-save"),
590 selectMimetype: E('select[name=mimetype]'),
591 selectFontSizeWrap: E('#select-font-size'),
592 // selectDiffWS: E('select[name=diff_ws]'),
593 cbAutoPreview: E('#cb-preview-autoupdate > input[type=checkbox]'),
594 previewTarget: E('#wikiedit-tab-preview-wrapper'),
@@ -595,11 +597,11 @@
597 tabs:{
598 pageList: E('#wikiedit-tab-pages'),
599 content: E('#wikiedit-tab-content'),
600 preview: E('#wikiedit-tab-preview'),
601 diff: E('#wikiedit-tab-diff'),
602 misc: E('#wikiedit-tab-misc')
603 //commit: E('#wikiedit-tab-commit')
604 }
605 };
606
607 P.tabs.e.container.insertBefore(
@@ -612,10 +614,11 @@
614 P.tabs.addEventListener(
615 /* Set up some before-switch-to tab event tasks... */
616 'before-switch-to', function(ev){
617 if(ev.detail===P.e.tabs.preview){
618 P.baseHrefForWiki();
619 P.updateSaveButton();
620 if(P.previewNeedsUpdate && P.e.cbAutoPreview.checked) P.preview();
621 }else if(ev.detail===P.e.tabs.diff){
622 /* Work around a weird bug where the page gets wider than
623 the window when the diff tab is NOT in view and the
624 current SBS diff widget is wider than the window. When
@@ -623,19 +626,12 @@
626 the page size again. Weird. Maybe FF-specific. Note that
627 this weirdness happens even though P.e.diffTarget's parent
628 is hidden (and therefore P.e.diffTarget is also hidden).
629 */
630 D.removeClass(P.e.diffTarget, 'hidden');
631 }else if(ev.detail===P.e.tabs.misc){
 
632 P.updateAttachmentView();
 
 
 
 
 
 
633 }
634 }
635 );
636 P.tabs.addEventListener(
637 /* Set up auto-refresh of the preview tab... */
@@ -810,10 +806,24 @@
806 title = title.join(' ');
807 f.titleElement.innerText = title;
808 f.pageTitleHeader.innerText = title;
809 return this;
810 };
811
812 /**
813 Change the save button depending on whether we have stuff to save
814 or not.
815 */
816 P.updateSaveButton = function(){
817 if(!this.winfo || !this.getStashedWinfo(this.winfo)){
818 D.disable(this.e.btnSave).innerText =
819 "There are no changes to save";
820 }else{
821 D.enable(this.e.btnSave).innerText = "Save changes";
822 }
823 return this;
824 };
825
826 /** Updates attachment-related links and returns this. */
827 P.updateAttachmentView = function(){
828 const wrapper = P.e.attachmentWrapper;
829 D.clearElement(wrapper);
830
M src/style.wikiedit.css
+1 -1
--- src/style.wikiedit.css
+++ src/style.wikiedit.css
@@ -98,11 +98,11 @@
9898
 align-items: flex-start;
9999
 max-width: 15em;
100100
 }
101101
 body.wikiedit .WikiList .new-page input {
102102
 }
103
-body.wikiedit #wikiedit-tab-save h3 {
103
+body.wikiedit #wikiedit-tab-misc h3 {
104104
 margin: 0;
105105
 }
106106
 body.wikiedit span.mini-tip {
107107
 font-size: 80%;
108108
 }
109109
--- src/style.wikiedit.css
+++ src/style.wikiedit.css
@@ -98,11 +98,11 @@
98 align-items: flex-start;
99 max-width: 15em;
100 }
101 body.wikiedit .WikiList .new-page input {
102 }
103 body.wikiedit #wikiedit-tab-save h3 {
104 margin: 0;
105 }
106 body.wikiedit span.mini-tip {
107 font-size: 80%;
108 }
109
--- src/style.wikiedit.css
+++ src/style.wikiedit.css
@@ -98,11 +98,11 @@
98 align-items: flex-start;
99 max-width: 15em;
100 }
101 body.wikiedit .WikiList .new-page input {
102 }
103 body.wikiedit #wikiedit-tab-misc h3 {
104 margin: 0;
105 }
106 body.wikiedit span.mini-tip {
107 font-size: 80%;
108 }
109
M src/wiki.c
+5 -5
--- src/wiki.c
+++ src/wiki.c
@@ -1161,11 +1161,11 @@
11611161
 }
11621162
 /****** Preview tab ******/
11631163
 {
11641164
 CX("<div id='wikiedit-tab-preview' "
11651165
 "data-tab-parent='wikiedit-tabs' "
1166
- "data-tab-label='Preview'"
1166
+ "data-tab-label='Preview &amp; Save'"
11671167
 ">");
11681168
 CX("<div class='wikiedit-options flex-container flex-row'>");
11691169
 CX("<button id='btn-preview-refresh' "
11701170
 "data-f-preview-from='wikiContent' "
11711171
 /* ^^^ fossil.page[methodName]() OR text source elem ID,
@@ -1174,10 +1174,11 @@
11741174
 "data-f-preview-via='_postPreview' "
11751175
 /* ^^^ fossil.page[methodName](content, callback) */
11761176
 "data-f-preview-to='#wikiedit-tab-preview-wrapper' "
11771177
 /* ^^^ dest elem ID */
11781178
 ">Refresh</button>");
1179
+ CX("<button class='wikiedit-save'>Save</button>");
11791180
 /* Toggle auto-update of preview when the Preview tab is selected. */
11801181
 style_labeled_checkbox("cb-preview-autoupdate",
11811182
 NULL,
11821183
 "Auto-refresh?",
11831184
 "1", 1,
@@ -1204,17 +1205,16 @@
12041205
 "Diffs will be shown here."
12051206
 "</div>");
12061207
 CX("</div>"/*#wikiedit-tab-diff*/);
12071208
 }
12081209
1210
+ /****** The obligatory "Misc" tab ******/
12091211
 {
1210
- CX("<div id='wikiedit-tab-save' "
1212
+ CX("<div id='wikiedit-tab-misc' "
12111213
 "data-tab-parent='wikiedit-tabs' "
1212
- "data-tab-label='Save, Help, etc.'"
1214
+ "data-tab-label='Help, Attachments, etc.'"
12131215
 ">");
1214
- CX("<button class='wikiedit-save'>Save</button>");
1215
- CX("<hr>");
12161216
 CX("<h3>Wiki formatting rules</h3>");
12171217
 CX("<ul>");
12181218
 CX("<li><a href='%R/wiki_rules'>Fossil wiki format</a></li>");
12191219
 CX("<li><a href='%R/md_rules'>Markdown format</a></li>");
12201220
 CX("<li>Plain-text pages use no special formatting.</li>");
12211221
--- src/wiki.c
+++ src/wiki.c
@@ -1161,11 +1161,11 @@
1161 }
1162 /****** Preview tab ******/
1163 {
1164 CX("<div id='wikiedit-tab-preview' "
1165 "data-tab-parent='wikiedit-tabs' "
1166 "data-tab-label='Preview'"
1167 ">");
1168 CX("<div class='wikiedit-options flex-container flex-row'>");
1169 CX("<button id='btn-preview-refresh' "
1170 "data-f-preview-from='wikiContent' "
1171 /* ^^^ fossil.page[methodName]() OR text source elem ID,
@@ -1174,10 +1174,11 @@
1174 "data-f-preview-via='_postPreview' "
1175 /* ^^^ fossil.page[methodName](content, callback) */
1176 "data-f-preview-to='#wikiedit-tab-preview-wrapper' "
1177 /* ^^^ dest elem ID */
1178 ">Refresh</button>");
 
1179 /* Toggle auto-update of preview when the Preview tab is selected. */
1180 style_labeled_checkbox("cb-preview-autoupdate",
1181 NULL,
1182 "Auto-refresh?",
1183 "1", 1,
@@ -1204,17 +1205,16 @@
1204 "Diffs will be shown here."
1205 "</div>");
1206 CX("</div>"/*#wikiedit-tab-diff*/);
1207 }
1208
 
1209 {
1210 CX("<div id='wikiedit-tab-save' "
1211 "data-tab-parent='wikiedit-tabs' "
1212 "data-tab-label='Save, Help, etc.'"
1213 ">");
1214 CX("<button class='wikiedit-save'>Save</button>");
1215 CX("<hr>");
1216 CX("<h3>Wiki formatting rules</h3>");
1217 CX("<ul>");
1218 CX("<li><a href='%R/wiki_rules'>Fossil wiki format</a></li>");
1219 CX("<li><a href='%R/md_rules'>Markdown format</a></li>");
1220 CX("<li>Plain-text pages use no special formatting.</li>");
1221
--- src/wiki.c
+++ src/wiki.c
@@ -1161,11 +1161,11 @@
1161 }
1162 /****** Preview tab ******/
1163 {
1164 CX("<div id='wikiedit-tab-preview' "
1165 "data-tab-parent='wikiedit-tabs' "
1166 "data-tab-label='Preview &amp; Save'"
1167 ">");
1168 CX("<div class='wikiedit-options flex-container flex-row'>");
1169 CX("<button id='btn-preview-refresh' "
1170 "data-f-preview-from='wikiContent' "
1171 /* ^^^ fossil.page[methodName]() OR text source elem ID,
@@ -1174,10 +1174,11 @@
1174 "data-f-preview-via='_postPreview' "
1175 /* ^^^ fossil.page[methodName](content, callback) */
1176 "data-f-preview-to='#wikiedit-tab-preview-wrapper' "
1177 /* ^^^ dest elem ID */
1178 ">Refresh</button>");
1179 CX("<button class='wikiedit-save'>Save</button>");
1180 /* Toggle auto-update of preview when the Preview tab is selected. */
1181 style_labeled_checkbox("cb-preview-autoupdate",
1182 NULL,
1183 "Auto-refresh?",
1184 "1", 1,
@@ -1204,17 +1205,16 @@
1205 "Diffs will be shown here."
1206 "</div>");
1207 CX("</div>"/*#wikiedit-tab-diff*/);
1208 }
1209
1210 /****** The obligatory "Misc" tab ******/
1211 {
1212 CX("<div id='wikiedit-tab-misc' "
1213 "data-tab-parent='wikiedit-tabs' "
1214 "data-tab-label='Help, Attachments, etc.'"
1215 ">");
 
 
1216 CX("<h3>Wiki formatting rules</h3>");
1217 CX("<ul>");
1218 CX("<li><a href='%R/wiki_rules'>Fossil wiki format</a></li>");
1219 CX("<li><a href='%R/md_rules'>Markdown format</a></li>");
1220 CX("<li>Plain-text pages use no special formatting.</li>");
1221

Keyboard Shortcuts

Open search /
Next entry (timeline) j
Previous entry (timeline) k
Open focused entry Enter
Show this help ?
Toggle theme Top nav button