http://www.tiddlywiki.com/
a reusable non-linear personal web notebook
[[TiddlyWiki Load Page]] [[Code Changes]] siteLoading
[[TiddlyWiki Load Page]]
When TiddlyWiki loads, a blank, half-styled page is displayed before the entire wiki appears. This was confusing for people who would think that the page was broken or buggy.\n\nThree [[code changes|Code Changes]] have fixed that. Now it will show a box (like a splash screen) that contains a customizable [[message|siteLoading]]. If the siteLoading tiddler doesn't exist no message appears; but even better: no half-styled page appears either.\n\nIf you want to view the loadingMessage again (or show it off) just reload this page. It actually has a timer built in to emphasize the splash screen. Download [[this page|1-2-28notimer.html]] to get the real deal.
The only downside to this techniqu is that the siteLoading tiddler shouldn't have any wiki text or line breaks: They show up unstyled and as their original wiki text.
[[TiddlyWiki Load Page]]\n[[Limitations]]\n[[Code Changes]]\n[[siteLoading]]\n\n\n© [[osmosoft|http://www.osmosoft.com]] 2005\n\n<<newTiddler>>\n<<newJournal "DD MMM YYYY">>\n
In the saveToDive function, classes were added to the storage so we could target them later.\n\n{{{\nTiddler.prototype.saveToDiv = function()\n{\n return '<div class="' + this.title + '" tiddler="' + this.title + '" modified="' +\n this.modified.convertToYYYYMMDDHHMM() + '" modifier="' + this.modifier +\n '" tags="' + this.getTags() + '">' +\n this.escapeLineBreaks().htmlEncode() + '</div>';\n}\n}}}\n\nIn the StyleSheet (this won't work in the StyleSheet tiddler) The following rules were added to show the siteLoading class and hide the #contentWrapper.\n\n{{{\n#contentWrapper{\n display:none;\n}\n\n#storeArea{\n display: block;\n text-align: center;\n width: 300px;\n margin: 100px auto;\n padding: 50px;\n}\n\n#storeArea *{\n display: none;\n}\n\n#storeArea .siteLoading{\n display: block;\n color: #000;\n font-size: 24px;\n background-color: #e6e6e6;\n border-right: 3px solid #ccc;\n border-bottom: 3px solid #ccc;\n}\n}}}\n\nAnd finally, at the end of the Main() function these two lines of code turn off the siteLoading message and turn on the rest of the site:\n\n{{{\ndocument.getElementById('contentWrapper').style.display = "block";\ndocument.getElementById('storeArea').style.display = "none";\n}}}\n\n
Please wait while TiddlyWiki loads...