Fix faulty external-js single-file wiki (#5570)

* Fix problems with building single-file wiki using external-js template

* core/templates/external-js/tiddlywiki5-external-js.html.tid,
  core/templates/external-js/save-all-external-js.tid,
  core/templates/external-js/save-offline-external-js.tid
  core/templates/external-js/load-external-js.tid:
  Fix #5343. Exclude client-server plugins in tiddler imports and to
  specify a working URL for loading tiddlywiki5.js from local disk.
  Mirror save/all and save/offline templates in the regular server
  edition.

  Fix #4717 (tiddlywiki5-external-js.html.tid)

* core/modules/saver-handler.js:
  Need the change to make single file autosave work with the external-js
  template.

* editions/server-external-js/tiddlywiki.info:
  Provide external-js related build targets.

* core/language/en-GB/Snippets/ExtJSReadme.tid:
  Temporary doc to supplement TW5.com's external-js section. Demonstrate
  that upgrade could be done on single-file wikis with an externalized
  TW core.

* core/language/en-GB/Snippets/GetTiddlyWikiJS.tid:
  Documentation. Meant to be included in every wiki and to help end
  users acquire tiddlywiki5.js.

* Pre-configure save-wiki template for end-users

* Remove the newline character at the end of the file.

* Trim "template" value in saveWiki()

* Safeguard the code from extraneous whitespaces in transcluded result.

* Rename and add versioning to downloaded tiddlywiki core JS

* Rename "tiddlywiki5.js" to "twcore-VERSION.js"

* Preload $:/config/SaveWikiButton/Template tiddler with the required
  external-js template value.

* Update external-js user documentation

* Add "download tiddlywiki core JS" menu item to the "cloud" button.

* Update build's target defintions associated with external-js template.

* Move the user doc to the tw5.com edition.

* Coding style update

* Undo template name changes

* Correct text & fill colors on some disabled buttons

* Add new "export tiddlywiki core" button under page control tools

This new button can export tiddlywiki's core JS from user's wiki as
long as the wiki is served with the regular "root" template. The
button will be ineffective, thus disabled, if the core has already been
externalized by the "external-js" template.

With this button, a full standalone html wiki can obtain the matching
core JS without TiddlyWiki on node.js. Once this is done, the html wiki
can be converted to using the "external-js" template.

* Alternate version of "save tiddlywiki core for offline use"

This version will fire up a "Save File" dialogue box when clicked,
instead of directing the user to a helper doc for further instruction.
It achieves this by using the "download" attribute of the <a> html tag.
It works on most modern desktop browsers, but older browsers (e.g. IE)
may display the file instead.

* Adjust font-weight to match other menu items

* Merge two user documentations into one

* Add user-browser-cache=yes to --listen command

* Update "export tiddlywiki core" button hint

* Simpler implementation for switching btw online/offline core URL

Shave off one template by using filtered transclusion to control
online/offline core URL.

* Update user doc

Update the user doc to clarify that build index step is not needed to
initialize a new wiki.

* Rename twcore to tiddlywikicore

* Reformat the user doc

* Rework export-tiddlywikicore button

Popup an error message instead of disabling the button when export
core cannot be performed.

* Revert "Correct text & fill colors on some disabled buttons"

This reverts commit e7dbb7e712e5cd23e57ec068b9fe9ed3bbaf4617.

core/language/en-GB/Buttons.multids

@@ -32,6 +32,8 @@ ExportTiddler/Caption: export tiddler
 ExportTiddler/Hint: Export tiddler
 ExportTiddlers/Caption: export tiddlers
 ExportTiddlers/Hint: Export tiddlers
+ExportTiddlyWikiCore/Caption: export TiddlyWiki core
+ExportTiddlyWikiCore/Hint: Export the ~TiddlyWiki core code for running with external ~JavaScript   
 SidebarSearch/Hint: Select the sidebar search field
 Fold/Caption: fold tiddler
 Fold/Hint: Fold the body of this tiddler

core/modules/saver-handler.js

@@ -157,7 +157,8 @@ SaverHandler.prototype.saveWiki = function(options) {
 		return false;
 	}
 	var	variables = options.variables || {},
-		template = options.template || "$:/core/save/all",
+		template = (options.template || 
+		           this.wiki.getTiddlerText("$:/config/SaveWikiButton/Template","$:/core/save/all")).trim(),
 		downloadType = options.downloadType || "text/plain",
 		text = this.wiki.renderTiddler(downloadType,template,options),
 		callback = function(err) {

core/templates/external-js/save-all-external-js.tid

@@ -4,4 +4,5 @@ title: $:/core/save/all-external-js
 \define saveTiddlerFilter()
 [is[tiddler]] -[prefix[$:/state/popup/]] -[prefix[$:/temp/]] -[prefix[$:/HistoryList]] -[status[pending]plugin-type[import]] -[[$:/core]] -[[$:/boot/boot.css]] -[type[application/javascript]library[yes]] -[[$:/boot/boot.js]] -[[$:/boot/bootprefix.js]] +[sort[title]] $(publishFilter)$
 \end
+\define coreURL() %24%3A%2Fcore%2Ftemplates%2Ftiddlywiki5.js
 {{$:/core/templates/tiddlywiki5-external-js.html}}

core/templates/external-js/save-offline-external-js.tid

@@ -0,0 +1,8 @@
+title: $:/core/save/offline-external-js
+
+\import [[$:/core/ui/PageMacros]] [all[shadows+tiddlers]tag[$:/tags/Macro]!has[draft.of]]
+\define saveTiddlerFilter()
+[is[tiddler]] -[prefix[$:/state/popup/]] -[prefix[$:/temp/]] -[prefix[$:/HistoryList]] -[status[pending]plugin-type[import]] -[[$:/core]] -[[$:/plugins/tiddlywiki/filesystem]] -[[$:/plugins/tiddlywiki/tiddlyweb]] -[[$:/boot/boot.css]] -[type[application/javascript]library[yes]] -[[$:/boot/boot.js]] -[[$:/boot/bootprefix.js]] +[sort[title]] $(publishFilter)$
+\end
+\define coreURL() tiddlywikicore-$(version)$.js
+{{$:/core/templates/tiddlywiki5-external-js.html}}

core/templates/external-js/tiddlywiki.js.tiddlers.tid

@@ -2,4 +2,8 @@ title: $:/core/templates/tiddlywiki5.js/tiddlers
 
 `
 $tw.preloadTiddlerArray(`<$text text=<<jsontiddlers "[[$:/core]]">>/>`);
+$tw.preloadTiddlerArray([{
+	title: "$:/config/SaveWikiButton/Template",
+	text: "$:/core/save/offline-external-js"
+}]);
 `

core/templates/external-js/tiddlywiki5-external-js.html.tid

@@ -2,7 +2,7 @@ title: $:/core/templates/tiddlywiki5-external-js.html
 
 \rules only filteredtranscludeinline transcludeinline
 <!doctype html>
-{{$:/core/templates/MOTW.html}}<html lang="`<$text text={{{ [{$:/language}get[name]] }}}/>`">
+{{$:/core/templates/MOTW.html}}<html lang="{{{ [{$:/language}get[name]] }}}">
 <head>
 <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
 <!--~~ Raw markup for the top of the head section ~~-->
@@ -43,5 +43,6 @@ title: $:/core/templates/tiddlywiki5-external-js.html
 <!--~~ Raw markup for the bottom of the body section ~~-->
 {{{ [all[shadows+tiddlers]tag[$:/tags/RawMarkupWikified/BottomBody]] ||$:/core/templates/raw-static-tiddler}}}
 </body>
-<script src="%24%3A%2Fcore%2Ftemplates%2Ftiddlywiki5.js" onerror="alert('Error: Cannot load tiddlywiki.js');"></script>
+<!--~~ Load external JS ~~-->
+<script src="{{{ [<coreURL>] }}}" onerror="alert('Error: Cannot load {{{ [<coreURL>] }}}');"></script>
 </html>

core/ui/PageControls/export-tiddlywikicore.tid

@@ -0,0 +1,25 @@
+title: $:/core/ui/Buttons/export-tiddlywikicore
+tags: $:/tags/PageControls
+caption: {{$:/core/images/star-filled}} {{$:/language/Buttons/ExportTiddlyWikiCore/Caption}}
+description: {{$:/language/Buttons/ExportTiddlyWikiCore/Hint}}
+
+\whitespace trim
+\define jsFileName() tiddlywikicore-$(version)$.js
+\define noExportMsg()
+It appears that you have a wiki with an external ~TiddlyWiki core. The export action cannot be performed.
+<p>You will need to view the page source in your browser. Then go to the very bottom the the source, find the last `<script>` 
+element, and right-click its `src` URI. Save the link as ''$(jsFileName)$''</p>
+\end
+
+<$button tooltip={{$:/language/Buttons/ExportTiddlyWikiCore/Hint}} aria-label={{$:/language/Buttons/ExportTiddlyWikiCore/Caption}} class=<<tv-config-toolbar-class>>>
+<$list filter="[[$:/boot/boot.js]is[missing]]" variable="ignore" emptyMessage="""<$action-sendmessage $message="tm-download-file" $param="$:/core/templates/tiddlywiki5.js" filename=<<jsFileName>>/>""" >
+<$action-setfield $tiddler=<<qualify "$:/temp/alert">> text=<<noExportMsg>> subtitle="Export ~TiddllyWiki Core"/>
+<$action-sendmessage $message="tm-modal" $param=<<qualify "$:/temp/alert">>/>
+</$list>
+<$list filter="[<tv-config-toolbar-icons>match[yes]]" variable="listItem">
+{{$:/core/images/star-filled}}
+</$list>
+<$list filter="[<tv-config-toolbar-text>match[yes]]">
+<span class="tc-btn-text"><$text text={{$:/language/Buttons/ExportTiddlyWikiCore/Caption}}/></span>
+</$list>
+</$button>

core/wiki/config/PageControlButtons.multids

@@ -4,6 +4,7 @@ core/ui/Buttons/advanced-search: hide
 core/ui/Buttons/close-all: hide
 core/ui/Buttons/encryption: hide
 core/ui/Buttons/export-page: hide
+core/ui/Buttons/export-tiddlywikicore: hide
 core/ui/Buttons/fold-all: hide
 core/ui/Buttons/full-screen: hide
 core/ui/Buttons/home: hide

core/wiki/tags/PageControls.tid

@@ -1,2 +1,2 @@
 title: $:/tags/PageControls
-list: [[$:/core/ui/Buttons/home]] [[$:/core/ui/Buttons/close-all]] [[$:/core/ui/Buttons/fold-all]] [[$:/core/ui/Buttons/unfold-all]] [[$:/core/ui/Buttons/permaview]] [[$:/core/ui/Buttons/new-tiddler]] [[$:/core/ui/Buttons/new-journal]] [[$:/core/ui/Buttons/new-image]] [[$:/core/ui/Buttons/import]] [[$:/core/ui/Buttons/export-page]] [[$:/core/ui/Buttons/control-panel]] [[$:/core/ui/Buttons/advanced-search]] [[$:/core/ui/Buttons/manager]] [[$:/core/ui/Buttons/tag-manager]] [[$:/core/ui/Buttons/language]] [[$:/core/ui/Buttons/palette]] [[$:/core/ui/Buttons/theme]] [[$:/core/ui/Buttons/storyview]] [[$:/core/ui/Buttons/encryption]] [[$:/core/ui/Buttons/timestamp]] [[$:/core/ui/Buttons/full-screen]] [[$:/core/ui/Buttons/print]] [[$:/core/ui/Buttons/save-wiki]] [[$:/core/ui/Buttons/refresh]] [[$:/core/ui/Buttons/more-page-actions]]
+list: [[$:/core/ui/Buttons/home]] [[$:/core/ui/Buttons/close-all]] [[$:/core/ui/Buttons/fold-all]] [[$:/core/ui/Buttons/unfold-all]] [[$:/core/ui/Buttons/permaview]] [[$:/core/ui/Buttons/new-tiddler]] [[$:/core/ui/Buttons/new-journal]] [[$:/core/ui/Buttons/new-image]] [[$:/core/ui/Buttons/import]] [[$:/core/ui/Buttons/export-page]] [[$:/core/ui/Buttons/control-panel]] [[$:/core/ui/Buttons/advanced-search]] [[$:/core/ui/Buttons/manager]] [[$:/core/ui/Buttons/tag-manager]] [[$:/core/ui/Buttons/language]] [[$:/core/ui/Buttons/palette]] [[$:/core/ui/Buttons/theme]] [[$:/core/ui/Buttons/storyview]] [[$:/core/ui/Buttons/encryption]] [[$:/core/ui/Buttons/timestamp]] [[$:/core/ui/Buttons/full-screen]] [[$:/core/ui/Buttons/print]] [[$:/core/ui/Buttons/save-wiki]] [[$:/core/ui/Buttons/refresh]] [[$:/core/ui/Buttons/export-tiddlywikicore]] [[$:/core/ui/Buttons/more-page-actions]]

editions/server-external-js/tiddlywiki.info

@@ -11,13 +11,16 @@
 	],
 	"build": {
 		"listen": [
-			"--listen","root-tiddler=$:/core/save/all-external-js"],
+			"--listen","root-tiddler=$:/core/save/all-external-js","use-browser-cache=yes"],
 		"index": [
-			"--rendertiddler","$:/plugins/tiddlywiki/tiddlyweb/save/offline","index.html","text/plain"],
+			"--rendertiddler","$:/core/save/offline-external-js","index.html","text/plain",
+			"--render","$:/core/templates/tiddlywiki5.js","[[tiddlywikicore-]addsuffix<version>addsuffix[.js]]","text/plain"],
 		"static": [
 			"--rendertiddler","$:/core/templates/static.template.html","static.html","text/plain",
 			"--rendertiddler","$:/core/templates/alltiddlers.template.html","alltiddlers.html","text/plain",
 			"--rendertiddlers","[!is[system]]","$:/core/templates/static.tiddler.html","static","text/plain",
-			"--rendertiddler","$:/core/templates/static.template.css","static/static.css","text/plain"]
+			"--rendertiddler","$:/core/templates/static.template.css","static/static.css","text/plain"],
+		"tiddlywikicore": [
+			"--render","$:/core/templates/tiddlywiki5.js","[[tiddlywikicore-]addsuffix<version>addsuffix[.js]]","text/plain"]
 	}
-}
+}

editions/tw5.com/tiddlers/webserver/Using the external JavaScript template.tid

@@ -1,23 +1,95 @@
 created: 20180905075846391
-modified: 20200814110131083
+modified: 20210611055708739
 tags: [[WebServer Guides]]
 title: Using the external JavaScript template
 type: text/vnd.tiddlywiki
 
-Setting the [[root-tiddler|WebServer Parameter: root-tiddler]] parameter to `$:/core/save/all-external-js` switches to a special template that externalises TiddlyWiki's core ~JavaScript into a separate file. For example:
+You can use a special template to externalise TiddlyWiki's core code into a separate file. This configuration allows the browser to cache the core for improved efficiency. 
 
-```
-tiddlywiki editions/tw5.com-server/ --listen host=0.0.0.0 "root-tiddler=$:/core/save/all-external-js"
-```
-
-To ensure that the "save changes" button saves a full, standalone wiki, it is also necessary to set the tiddler $:/config/SaveWikiButton/Template to contain `$:/core/save/all-external-js`.
-
-The provided edition `server-external-js` contains all the configuration necessary to use the external ~JavaScript template.
-
-!! Background
+! Background
 
 TiddlyWiki in the single file configuration ordinarily packs everything into a single file: your data, and the ~JavaScript, CSS and HTML comprising TiddlyWiki itself. This lack of dependencies is usually very convenient: it means that it is impossible for the parts of a TiddlyWiki to become separated, and enormously improves the chances of it still functioning in the future.
 
 However, there is some inefficiency in this arrangement because the core code is repeatedly loaded and saved every time the content of the wiki is saved. This inefficiency is partially ameliorated when working in the client server configuration because once the wiki is loaded by the browser the synchronisation process only transmits individual tiddlers back and forth to the server.
 
-The remaining inefficiency when working in the client server configuration is that the single page wiki that is initially loaded will contain a copy of the entire core code of TiddlyWiki, making it impossible for the browser to cache it.
+The remaining inefficiency when working in the client server configuration is that the single page wiki that is initially loaded will contain a copy of the entire core code of TiddlyWiki, making it impossible for the browser to cache it.
+
+! A quickstart
+
+The mechanism will be activated by setting the [[root-tiddler|WebServer Parameter: root-tiddler]] parameter to `$:/core/save/all-external-js`. This template externalises TiddlyWiki's core JavaScript into a separate file. For example, the following command will start your server with caching enabled. It will transfer the wiki with two GET requests, and the core can be cached by the browser.
+
+```
+tiddlywiki YOUR_WIKI_FOLDER --listen 'root-tiddler=$:/core/save/all-external-js' use-browser-cache=yes
+```
+
+<<.tip """You can activate your browser's ''Developer Tools: Network'' tab and reload the page to see how it works.""">>
+
+<<.tip """On Windows, Command Prompt (CMD) users need to replace single quotes `'` with double quotation marks `"`.""">>
+
+! Initializing a new wiki
+
+The provided edition `server-external-js` contains all the configuration necessary to use the external ~JavaScript template. Here is an example:
+
+```
+tiddlywiki ./myNewWiki --init server-external-js
+tiddlywiki ./myNewWiki --build listen
+```
+
+The above commands perform the following:
+
+* Create a new wiki with external-js customization included.
+* Start the server with external-js enabled. The server listens on port 8080. Visit http://localhost:8080 in your browser.
+
+To customize your `--build listen` command, see [[tiddlywiki.info Files]] and [[ListenCommand]].
+
+! Standalone wiki with the external-js template
+
+You can use the "external-js" template with your standalone wiki, but this requires that you have ~TiddlyWiki's core ~JavaScript saved alongside your html file. You may prefer this configuration, for example, if you have several wikis on a ~WebDav server. (See: [[Saving via WebDAV]])
+
+<<.warning "Since working with several files, that belong together, will open up all kinds of synchronisation challenges, this functionality is intended for advanced users.">>
+
+!! Saving your snapshots
+
+If you start your ~TiddlyWiki server in the "external-js" configuration, snapshots you saved from the wiki will also have the external-js configuration: 
+
+* Click on the "cloud" button and choose <<.icon $:/core/images/download-button>>  ''Save snapshot for offline use''. The html wiki you saved will have a reduced file size compared to a regular snapshot because the ~TiddlyWiki core code has been externalized. However, to be able to use this wiki, you ''must'' also own a copy of ~TiddlyWiki's core ~JavaScript. 
+* Click on the "cloud" button and choose <<.icon $:/core/images/download-button>> ''Save ~TiddlyWiki core for offline use'' to download the core ~JavaScript from the server. Save this file in the same folder as your html wiki. <<.from-version "5.2.0">>
+
+The "server-external-js" edition lets you save the snapshot from the command line:
+
+```
+tiddlywiki YOUR_WIKI_FOLDER --build index
+```
+
+Files "index.html" and "tiddlywikicore-5.x.x.js" will be saved in your wiki folder's `output` directory.
+
+!! Obtaining the ~TiddlyWiki core with tiddlywiki command
+
+You can also run the following command to obtain the core ~JavaScript. The file "tiddlywikicore-5.x.x.js" will be saved in the`output` directory of your wiki folder:
+
+```
+tiddlywiki YOUR_WIKI_FOLDER \
+    --render '$:/core/templates/tiddlywiki5.js' \
+    '[[tiddlywikicore-]addsuffix<version>addsuffix[.js]]' \
+    'text/plain'
+```
+
+The "server-external-js" edition has the shortcut set up for you. Just run:
+
+```
+tiddlywiki YOUR_WIKI_FOLDER --build tiddlywikicore
+```
+
+! Upgrading your standalone wiki <span style="font-size:0.65em">(experimental)</span>
+
+Before you proceed, backup your wiki first! Follow the steps below to upgrade a single-file wiki with the external-js template:
+
+# Proceed with the [[Upgrade Process for Standalone TiddlyWikis|Upgrading]]. Your wiki will be converted to a full standalone HTML.
+
+# Open your upgraded wiki in the browser. If you'd like to revert to using the regular template, restore the original shadow tiddler `$:/config/SaveWikiButton/Template` by deleting any custom copy. Save your wiki and you are done. 
+
+# Otherwise, from your wiki, select the ''Tools'' tab from the sidebar and click on the <<.icon $:/core/images/star-filled>> ''export tiddlywiki core'' button to obtain the core from your wiki.
+
+# Verify that `$:/config/SaveWikiButton/Template` still contains `$:/core/save/offline-external-js`. Modify if necessary.
+
+# Save your wiki again. Your wiki is now converted to using the external core.

editions/tw5.com/tiddlywiki.info

@@ -52,8 +52,8 @@
 			"--rendertiddlers","[!is[system]]","$:/core/templates/static.tiddler.html","static","text/plain",
 			"--rendertiddler","$:/core/templates/static.template.css","static/static.css","text/plain"],
 		"external-js": [
-			"--rendertiddler","$:/core/save/all-external-js","index.html","text/plain",
-			"--rendertiddler","$:/core/templates/tiddlywiki5.js","tiddlywiki.js","text/plain"]
+			"--rendertiddler","$:/core/save/offline-external-js","index.html","text/plain",
+			"--render","$:/core/templates/tiddlywiki5.js","[[tiddlywikicore-]addsuffix<version>addsuffix[.js]]","text/plain"]
 	},
 	"config": {
 		"retain-original-tiddler-path": true

plugins/tiddlywiki/tiddlyweb/syncer-actions-download-tiddlywikicore.tid

@@ -0,0 +1,7 @@
+title: $:/plugins/tiddlywiki/tiddlyweb/syncer-actions/download-tiddlywikicore
+tags: $:/tags/SyncerDropdown
+
+\define tiddlywikicoreFilename() tiddlywikicore-$(version)$.js
+<$reveal state="$:/config/SaveWikiButton/Template" type="match" text="$:/core/save/offline-external-js">
+<a class="tc-tiddlylink" style="font-weight:unset" href="%24%3A%2Fcore%2Ftemplates%2Ftiddlywiki5.js" download=<<tiddlywikicoreFilename>>>{{$:/core/images/download-button}} Save ~TiddlyWiki core for offline use</a>
+</$reveal>

plugins/tiddlywiki/tiddlyweb/tags-syncerdropdown.tid

@@ -1,2 +1,2 @@
 title: $:/tags/SyncerDropdown
-list: $:/plugins/tiddlywiki/tiddlyweb/syncer-actions/login-status $:/plugins/tiddlywiki/tiddlyweb/syncer-actions/login $:/plugins/tiddlywiki/tiddlyweb/syncer-actions/refresh $:/plugins/tiddlywiki/tiddlyweb/syncer-actions/logout $:/plugins/tiddlywiki/tiddlyweb/syncer-actions/save-snapshot $:/plugins/tiddlywiki/tiddlyweb/syncer-actions/copy-logs
+list: $:/plugins/tiddlywiki/tiddlyweb/syncer-actions/login-status $:/plugins/tiddlywiki/tiddlyweb/syncer-actions/login $:/plugins/tiddlywiki/tiddlyweb/syncer-actions/refresh $:/plugins/tiddlywiki/tiddlyweb/syncer-actions/logout $:/plugins/tiddlywiki/tiddlyweb/syncer-actions/save-snapshot $:/plugins/tiddlywiki/tiddlyweb/syncer-actions/download-tiddlywikicore $:/plugins/tiddlywiki/tiddlyweb/syncer-actions/copy-logs