Fossil SCM

Removed the FORM element - it was superfluous and particularly stubborn in how it responded to every button.

stephan 2020-05-06 01:58 fileedit-ajaxify
Commit 7635d9345d0d7f0f8d54bc2be7511eee5bf74b03dce735681beff9b58cf58021
Parent b48212f6ea83876…
2 files changed -16 +4 -19
~ src/fileedit.c ~ src/fossil.page.fileedit.js
M src/fileedit.c
-16
--- src/fileedit.c
+++ src/fileedit.c
@@ -1520,23 +1520,10 @@
15201520
 ********************************************************************/
15211521
 CX("<p>This page is <em>NEW AND EXPERIMENTAL</em>. "
15221522
 "USE AT YOUR OWN RISK, preferably on a test "
15231523
 "repo.</p>\n");
15241524
1525
- /*
1526
- ** We don't strictly need a FORM because we manually cherry-pick and
1527
- ** submit the form data, but it being in a form allows us to easily
1528
- ** use the FormData type for serialization.
1529
- **
1530
- ** TODO?: we can almost certainly replace this element with a plain
1531
- ** DIV, which would eliminate the event-handling hassles of trying
1532
- ** to suppress the submit... but it would also eliminate the option
1533
- ** of using HTML form field validation.
1534
- */
1535
- CX("<form action='#' method='POST' class='fileedit' "
1536
- "id='fileedit-form'>");
1537
-
15381525
 /******* Hidden fields *******/
15391526
 CX("<input type='hidden' name='r' value='%s'>",
15401527
 cimi.zParentUuid);
15411528
 CX("<input type='hidden' name='file' value='%T'>",
15421529
 zFilename);
@@ -1768,13 +1755,10 @@
17681755
 CX("<div id='fileedit-manifest'></div>\n");
17691756
 }
17701757
17711758
 CX("</div>"/*#fileedit-tab-commit*/);
17721759
1773
- /******* End of form *******/
1774
- CX("</form>\n");
1775
-
17761760
 /* Dynamically populate the editor... */
17771761
 blob_appendf(&endScript,
17781762
 "fossil.page.loadFile('%j','%j');",
17791763
 zFilename, cimi.zParentUuid);
17801764
17811765
--- src/fileedit.c
+++ src/fileedit.c
@@ -1520,23 +1520,10 @@
1520 ********************************************************************/
1521 CX("<p>This page is <em>NEW AND EXPERIMENTAL</em>. "
1522 "USE AT YOUR OWN RISK, preferably on a test "
1523 "repo.</p>\n");
1524
1525 /*
1526 ** We don't strictly need a FORM because we manually cherry-pick and
1527 ** submit the form data, but it being in a form allows us to easily
1528 ** use the FormData type for serialization.
1529 **
1530 ** TODO?: we can almost certainly replace this element with a plain
1531 ** DIV, which would eliminate the event-handling hassles of trying
1532 ** to suppress the submit... but it would also eliminate the option
1533 ** of using HTML form field validation.
1534 */
1535 CX("<form action='#' method='POST' class='fileedit' "
1536 "id='fileedit-form'>");
1537
1538 /******* Hidden fields *******/
1539 CX("<input type='hidden' name='r' value='%s'>",
1540 cimi.zParentUuid);
1541 CX("<input type='hidden' name='file' value='%T'>",
1542 zFilename);
@@ -1768,13 +1755,10 @@
1768 CX("<div id='fileedit-manifest'></div>\n");
1769 }
1770
1771 CX("</div>"/*#fileedit-tab-commit*/);
1772
1773 /******* End of form *******/
1774 CX("</form>\n");
1775
1776 /* Dynamically populate the editor... */
1777 blob_appendf(&endScript,
1778 "fossil.page.loadFile('%j','%j');",
1779 zFilename, cimi.zParentUuid);
1780
1781
--- src/fileedit.c
+++ src/fileedit.c
@@ -1520,23 +1520,10 @@
1520 ********************************************************************/
1521 CX("<p>This page is <em>NEW AND EXPERIMENTAL</em>. "
1522 "USE AT YOUR OWN RISK, preferably on a test "
1523 "repo.</p>\n");
1524
 
 
 
 
 
 
 
 
 
 
 
 
 
1525 /******* Hidden fields *******/
1526 CX("<input type='hidden' name='r' value='%s'>",
1527 cimi.zParentUuid);
1528 CX("<input type='hidden' name='file' value='%T'>",
1529 zFilename);
@@ -1768,13 +1755,10 @@
1755 CX("<div id='fileedit-manifest'></div>\n");
1756 }
1757
1758 CX("</div>"/*#fileedit-tab-commit*/);
1759
 
 
 
1760 /* Dynamically populate the editor... */
1761 blob_appendf(&endScript,
1762 "fossil.page.loadFile('%j','%j');",
1763 zFilename, cimi.zParentUuid);
1764
1765
M src/fossil.page.fileedit.js
+4 -19
--- src/fossil.page.fileedit.js
+++ src/fossil.page.fileedit.js
@@ -11,11 +11,10 @@
1111
 P.tabs = new fossil.TabManager('#fileedit-tabs');
1212
 P.e = {
1313
 taEditor: E('#fileedit-content-editor'),
1414
 taComment: E('#fileedit-comment'),
1515
 ajaxContentTarget: E('#ajax-target'),
16
- form: E('#fileedit-form'),
1716
 btnCommit: E("#fileedit-btn-commit"),
1817
 btnReload: E("#fileedit-tab-content > .fileedit-options > "
1918
 +"button.fileedit-content-reload"),
2019
 selectPreviewModeWrap: E('#select-preview-mode'),
2120
 selectHtmlEmsWrap: E('#select-preview-html-ems'),
@@ -37,32 +36,17 @@
3736
 //e.preventDefault();
3837
 //e.stopPropagation();
3938
 return P;
4039
 };
4140
42
- P.e.form.addEventListener("submit", function(e) {
43
- e.target.checkValidity();
44
- /* All of this is needed to keep the form from submitting every
45
- time any button in the form is clicked: */
46
- e.preventDefault();
47
- e.stopPropagation();
48
- return false;
49
- }, false);
5041
 //P.tabs.getButtonForTab(P.e.tabs.preview)
5142
 P.e.tabs.preview.querySelector(
5243
 'button'
5344
 ).addEventListener(
5445
 "click",(e)=>P.preview(), false
5546
 );
5647
57
- document.querySelector('#fileedit-form').addEventListener(
58
- "click",function(e){
59
- stopEvent(e);
60
- return false;
61
- }
62
- );
63
-
6448
 const diffButtons = E('#fileedit-tab-diff-buttons');
6549
 diffButtons.querySelector('button.sbs').addEventListener(
6650
 "click",(e)=>P.diff(true), false
6751
 );
6852
 diffButtons.querySelector('button.unified').addEventListener(
@@ -178,12 +162,13 @@
178162
 });
179163
 return this;
180164
 };
181165
182166
 /**
183
- Fetches the page preview based on the contents and settings of this
184
- page's form, and updates the UI with with the preview.
167
+ Fetches the page preview based on the contents and settings of
168
+ this page's input fields, and updates the UI with with the
169
+ preview.
185170
186171
 Returns this object, noting that the operation is async.
187172
 */
188173
 F.page.preview = function(switchToTab){
189174
 if(!this.finfo){
@@ -221,11 +206,11 @@
221206
 return this;
222207
 };
223208
224209
 /**
225210
 Fetches the content diff based on the contents and settings of this
226
- page's form, and updates the UI with the diff view.
211
+ page's input fields, and updates the UI with the diff view.
227212
228213
 Returns this object, noting that the operation is async.
229214
 */
230215
 F.page.diff = function(sbs){
231216
 if(!this.finfo){
232217
--- src/fossil.page.fileedit.js
+++ src/fossil.page.fileedit.js
@@ -11,11 +11,10 @@
11 P.tabs = new fossil.TabManager('#fileedit-tabs');
12 P.e = {
13 taEditor: E('#fileedit-content-editor'),
14 taComment: E('#fileedit-comment'),
15 ajaxContentTarget: E('#ajax-target'),
16 form: E('#fileedit-form'),
17 btnCommit: E("#fileedit-btn-commit"),
18 btnReload: E("#fileedit-tab-content > .fileedit-options > "
19 +"button.fileedit-content-reload"),
20 selectPreviewModeWrap: E('#select-preview-mode'),
21 selectHtmlEmsWrap: E('#select-preview-html-ems'),
@@ -37,32 +36,17 @@
37 //e.preventDefault();
38 //e.stopPropagation();
39 return P;
40 };
41
42 P.e.form.addEventListener("submit", function(e) {
43 e.target.checkValidity();
44 /* All of this is needed to keep the form from submitting every
45 time any button in the form is clicked: */
46 e.preventDefault();
47 e.stopPropagation();
48 return false;
49 }, false);
50 //P.tabs.getButtonForTab(P.e.tabs.preview)
51 P.e.tabs.preview.querySelector(
52 'button'
53 ).addEventListener(
54 "click",(e)=>P.preview(), false
55 );
56
57 document.querySelector('#fileedit-form').addEventListener(
58 "click",function(e){
59 stopEvent(e);
60 return false;
61 }
62 );
63
64 const diffButtons = E('#fileedit-tab-diff-buttons');
65 diffButtons.querySelector('button.sbs').addEventListener(
66 "click",(e)=>P.diff(true), false
67 );
68 diffButtons.querySelector('button.unified').addEventListener(
@@ -178,12 +162,13 @@
178 });
179 return this;
180 };
181
182 /**
183 Fetches the page preview based on the contents and settings of this
184 page's form, and updates the UI with with the preview.
 
185
186 Returns this object, noting that the operation is async.
187 */
188 F.page.preview = function(switchToTab){
189 if(!this.finfo){
@@ -221,11 +206,11 @@
221 return this;
222 };
223
224 /**
225 Fetches the content diff based on the contents and settings of this
226 page's form, and updates the UI with the diff view.
227
228 Returns this object, noting that the operation is async.
229 */
230 F.page.diff = function(sbs){
231 if(!this.finfo){
232
--- src/fossil.page.fileedit.js
+++ src/fossil.page.fileedit.js
@@ -11,11 +11,10 @@
11 P.tabs = new fossil.TabManager('#fileedit-tabs');
12 P.e = {
13 taEditor: E('#fileedit-content-editor'),
14 taComment: E('#fileedit-comment'),
15 ajaxContentTarget: E('#ajax-target'),
 
16 btnCommit: E("#fileedit-btn-commit"),
17 btnReload: E("#fileedit-tab-content > .fileedit-options > "
18 +"button.fileedit-content-reload"),
19 selectPreviewModeWrap: E('#select-preview-mode'),
20 selectHtmlEmsWrap: E('#select-preview-html-ems'),
@@ -37,32 +36,17 @@
36 //e.preventDefault();
37 //e.stopPropagation();
38 return P;
39 };
40
 
 
 
 
 
 
 
 
41 //P.tabs.getButtonForTab(P.e.tabs.preview)
42 P.e.tabs.preview.querySelector(
43 'button'
44 ).addEventListener(
45 "click",(e)=>P.preview(), false
46 );
47
 
 
 
 
 
 
 
48 const diffButtons = E('#fileedit-tab-diff-buttons');
49 diffButtons.querySelector('button.sbs').addEventListener(
50 "click",(e)=>P.diff(true), false
51 );
52 diffButtons.querySelector('button.unified').addEventListener(
@@ -178,12 +162,13 @@
162 });
163 return this;
164 };
165
166 /**
167 Fetches the page preview based on the contents and settings of
168 this page's input fields, and updates the UI with with the
169 preview.
170
171 Returns this object, noting that the operation is async.
172 */
173 F.page.preview = function(switchToTab){
174 if(!this.finfo){
@@ -221,11 +206,11 @@
206 return this;
207 };
208
209 /**
210 Fetches the content diff based on the contents and settings of this
211 page's input fields, and updates the UI with the diff view.
212
213 Returns this object, noting that the operation is async.
214 */
215 F.page.diff = function(sbs){
216 if(!this.finfo){
217

Keyboard Shortcuts

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