Merge pull request #125 from easycoder/dev

Doc updates & bug fixes

Author: easycoder

iwsy/resources/ecs/fileman.txt

@@ -126,7 +126,7 @@ Show:
     put property `email` of UserRecord into Email
     get Password from storage as `password`
     put property `home` of UserRecord into Home
-    put Home cat `/` cat property `id` of UserRecord into Home
+    put Home cat `/` cat property `id` of UserRecord cat `images` into Home
     put `users/` cat Home cat `/images` into Home
     get CurrentPath from storage as `.filepath`
     if CurrentPath is empty put Home into CurrentPath

iwsy/resources/ecs/iwsy.txt

@@ -376,22 +376,7 @@ L2:
         send to FileManModule
     end
 
-    on click Help
-    begin
-    	if Running stop
-    	if HelpModule is not running
-        begin
-      		require js
-            	`https://cdn.jsdelivr.net/gh/easycoder/easycoder.github.io/dist/plugins/showdown.js?v=` cat now
-            rest get Script from `/resources/ecs/help.txt?v=` cat now
-            run Script with HelpPanel as HelpModule
-        end
-        set style `display` of Player to `none`
-        set style `display` of FileManPanel to `none`
-    	set style `display` of HelpPanel to `block`
-        send to HelpModule
-    end
-    
+    on click Help go to ShowHelp    
     on click RunStop go to DoRunStop
     on click FullScreen go to RunFullScreen
 
@@ -468,8 +453,26 @@ L2:
             fork to ResetStatus
         end
     end
+    
+    get Item from storage as `alreadyrun`
+    if Item is empty go to ShowHelp
 	stop
 
+ShowHelp:
+    if Running stop
+    if HelpModule is not running
+    begin
+        require js
+        	`https://cdn.jsdelivr.net/gh/easycoder/easycoder.github.io/dist/plugins/showdown.js?v=` cat now
+        rest get Script from `/resources/ecs/help.txt?v=` cat now
+        run Script with HelpPanel as HelpModule
+    end
+    set style `display` of Player to `none`
+    set style `display` of FileManPanel to `none`
+    set style `display` of HelpPanel to `block`
+    send to HelpModule
+    stop
+
 SavePresentation:
 	rest post Content to `usave/` cat UserEmail cat `/` cat UserPassword cat `/`
     	cat `users/` cat UserHome cat `/scripts/` cat Name

iwsy/resources/ecs/user.txt

@@ -145,8 +145,8 @@
 
 !	Start the user manager
 Start:
-    get Email from storage as `email`
-    get Password from storage as `password`
+    get Email from storage as `user.email`
+    get Password from storage as `user.password`
     if Email is empty stop
     if Password is empty stop
     go to SetupLogin
@@ -171,6 +171,7 @@ ProcessLogin:
     if Record is empty go to NoRecord
     if property `email` of Record is not EmailInput go to NoRecord
     put property `password` of Record into Password
+    replace `/` with `~` in Password
     rest get Validated from `validate/` cat Password cat `/` cat PasswordInput
     if Validated is `yes`
     begin
@@ -197,13 +198,13 @@ DoLoggedIn:
     return
 
 ClearStorage:
-    put empty into storage as `email`
-    put empty into storage as `password`
+    put empty into storage as `user.email`
+    put empty into storage as `user.password`
 	return
 
 SetStorage:
-	put EmailInput into storage as `email`
-	put PasswordInput into storage as `password`
+	put EmailInput into storage as `user.email`
+	put PasswordInput into storage as `user.password`
 	return
 
 !	Register as new user
@@ -249,7 +250,7 @@ ProcessRegistration:
       	cat `<h1>` cat ConfirmationCode cat `</h1>`
       	cat `If you did not request this email, please ignore it and no action will be taken.`
       	cat `</body></html>`
-    rest post Record to `email`
+    rest post Record to `user`
     set style `display` of ConfirmationDiv to `flex`
     set the text of RegisterButton to `Confirm registration`
     wait 10 ticks
@@ -328,7 +329,7 @@ ResetPassword2:
       	cat `<h1>` cat ConfirmationCode cat `</h1>`
       	cat `If you did not request this email, please ignore it and no action will be taken.`
       	cat `</body></html>`
-    rest post Record to `email`
+    rest post Record to `user`
     set style `display` of ResetDiv to `flex`
     set style `display` of PasswordDiv to `flex`
     set the content of PasswordInput to ``

iwsy/resources/help/about.md

@@ -0,0 +1,17 @@
+~page:contents:Contents~
+
+## About us
+
+~iwsy~ is a client-size all-JavaScript web application, currently under development by a small independent software development team.
+
+## Contact us
+
+
+
+## Technical stuff
+
+The ~iwsy~ user interface is coded entirely in [EasyCoder](https://easycoder.github.io) scripts, which download, compile and run as they are needed. Everything is done in the browser; there is no build process for the web app. A small server-side REST module handles user registration and login and manages files created by users and stored on the server.
+
+There are a little over 3000 lines of code in total. The largest code module (that runs the **Steps** panel opposite) is just over 1000 lines long and typically takes under 50ms to compile. Modules are loaded when they are first needed, so the load time of the web app is around 1.5 seconds (Pingdom Tools). The web app uses about 15MB of heap space while running.
+
+We are keen to collaborate with anyone who may have ideas for improving the website and the range of features it provides. Enquiries should be made in the first instance to the email address given above.

iwsy/resources/help/action-pause.md

@@ -0,0 +1,11 @@
+~page:contents:Contents~
+
+# The `pause` action
+
+This action pauses the presentation for a given nmber of seconds.
+
+~img:resources/users/2020/160/1/images/quickstart/pause.png:100%~
+
+The **Action**, **Name** and **Label** properties are present for all actions.
+
+The **Duration** property is the time in seconds the pause should take.

iwsy/resources/help/action-transition.md

@@ -28,3 +28,5 @@ All of these effects apply to text blocks; the first two also apply to blocks th
 When the color of text is to be changed, the size values in both **Block** and **Target** must be expressed in the form **#RRGGBB**, where **RRGGBB** carries the hex values of the red, green and blue components of the color.
 
 Fades and other animated effects run at 25 frames/sec, as a compromise between visual smoothness and processing requirements.
+
+Next: ~page:action-pause:Pause~

iwsy/resources/help/addBlock.md

@@ -0,0 +1,29 @@
+~page:contents:Contents~
+
+# The Buttons panel
+
+Above this Help page, under the banner, is a panel of buttons. The job of each button is as follows:
+
+~img:resources/icon/new.png:{float:left;height:2em;margin-right:1em}~ Start a new presentation. This clears the workspace. If you have unsaved work it will prompt you to save it. 
+
+~img:resources/icon/open.png:{float:left;height:2em;margin-right:1em}~ Open a saved presentation. This displays a list of all presentations and lets you select one. Note that if you are not a registered user, presentations will be saved into your browser's private space. For registered users they are saved to the ~iwsy~ website, into a space allocated to that user.
+
+If you have unsaved work you will be prompted to save it before opening the list.
+
+~img:resources/icon/save.png:{float:left;height:2em;margin-right:1em}~ Save your current work. It will be saved using whatever name is shown in the **Script name** box below the buttons. If this box is empty you will be prompted for a name. Files all have ~m:.json~ extensions; if this is omitted it will be added.
+
+~img:resources/icon/trash.png:{float:left;height:2em;margin-right:1em}~ Delete the current presentation. You will be prompted to confirm before the delete goes ahead.
+
+~img:resources/icon/fileman.png:{float:left;height:2em;margin-right:1em}~ Open the image manager. This shows you all the images you have uploaded to our server. If you are not registered, this button is non-operational.
+
+~img:resources/icon/run.png:{float:left;height:2em;margin-right:1em}~ Run your presentation. A player is created in the spacce currently occupied by this Help page and the presentation runs without manual intervention. The button changes to ~img:resources/icon/runstop.png:icon~. If you click this the presentation will stop.
+
+~img:resources/icon/fullscreen.png:{float:left;height:2em;margin-right:1em}~ Run your presentation in full-screen mode. This is the mode you will use when connected to an overhead projector, for example.
+
+In fullscreen mode the presentation waits for a mouse click or a button press. A mouse click or either of the space or right-arrow keys will cause the presentation to start in manual mode, where it stops after each visual change and waits for you to click or press again. If you press the Enter key the presentation will run according to the timing given by its individual steps. You can interrupt this my clicking or by pressing space or right-arrow.
+
+In some cases the browser will report the screen size incorrectly and some backgrounds will not show properly; if this happens it's best to select full-screen mode in your browser before clicking this button.
+
+~img:resources/icon/help.png:{float:left;height:2em;margin-right:1em}~ Display this help at the page you were last viewing.
+
+~img:resources/icon/trash.png:{float:left;height:2em;margin-right:1em}~ Login or Register. This displays the ~page:users:Login panel~.

iwsy/resources/help/addContent.md

@@ -1,20 +1,16 @@
-~page:iwsy:Home~
+~page:iwsy:Home and Introduction~
 
 # ~iwsy~ Help - Contents
 
 ~page:quickstart:Quick-start tutorial~ **Beginners start here!**
 
 ~page:users:User registration and login~
 
-~page:project:The Project panel~
-
-~page:start:Starting a project~
-
-~page:addStep:Adding a step~
+~page:buttons:The Buttons panel~
 
-~page:addBlock:Adding a block~
+~page:project:The Project panel~
 
-~page:addContent:Adding content~
+~page:about:About us, contacts etc.~
 
 ## Actions
 
@@ -29,3 +25,5 @@
 ~page:action-crossfade:The **crossfade** action~
 
 ~page:action-transition:The **transition** action~
+
+~page:action-pause:The **pause** action~

iwsy/resources/help/addStep.md

@@ -22,4 +22,18 @@ The basic features of ~iwsy~ are:
  - Built-in help - what you're reading
  - A ~page:quickstart:quick-start tutorial~
 
+## Background
+
+~iwsy~ started with a need to embed a slide show in a web page, but rather than just a sequence of pictures I wanted something between that and a video. Videos are time-consuming to make and almost impossible to alter when changes happen to the things being described. Presentation packages such as PowerPoint, on the other hand, lack extensive animation features and are hard to embed in a web page. It seemed to me there was room between the two for a new type of product, and once the idea took hold it was hard to put down. It coincided with the Coronoavirus pandemic, which enforced solitude at home and provided the time for development to take place.
+
+Much of my previous work in recent years has been in building websites, often of a specialized nature with unusual interactive needs. Not having an exceptional intellect I have difficulty with complexity and this has become something of an obsession over the years. Rather than face the issue directly I devised a programming language suited to those who, like myself, regard excessive complexity as something to be avoided at all costs. The language, called EasyCoder, is itself written in JavaScript and has been applied to a number of web projects. I have yet to find a user interface that it cannot handle.
+
+EasyCoder takes plain text scripts and compiles them in the browser. This is very quick, typically taking less than 50ms for a 1000-line script. EasyCoder scripts tend to be much shorter than their JavaScript equivalents, though by how much depends on the work being done. More importantly, they are readable by any intelligent person who understands the target domain. The basics of the language can be picked up in a day, which compares with the 3 or 4 months needed to learn React or Angular on top of JavaScript itself. So the long term maintenance prospects of an EasyCoder website such as ~iwsy~ are good as there will always be someone around who can learn it quickly.
+
+The other main advantage of EasyCoder is that it doesn't have a build process. Scripts are loaded directly into the browser and compiled there. The only build tool needed is a text editor.
+
+So that's the environment for ~iwsy~. All of the website UI is coded in EasyCoder. The presentation engine itself is just under 1000 lines of vanilla JavaScript and can be used independently of the ~iwsy~ website. This ensures performance is as good as it can get without moving to WebAssembly, though the latter is always an option.
+
+The project is hosted on GitHub as part of EasyCoder and enquiries are welcome from other programmers who are interested in contributing. The range of transition effects is currently limited so there is considerable scope for extension. An outline plug-in mechanism is also present so it should be possible to enhance the system without major disruption each time.
+
 ~page:contents:Contents~

iwsy/resources/help/buttons.md

@@ -14,7 +14,7 @@ Click the **Blocks** button over in the right-hand panel, then click the ~img:/r
 
 ~img:resources/users/2020/160/1/images/quickstart/newblock.png:100%~
 
-Most of these default values are fine as they are; they describe a block that occupies the whole window area. Let's just change the ~m:name~ property to ~m:background~ and the ~m:background~ property to ~m:url('resources/users/2020/160/1/images/SemoigoDawn.jpg')~. The effect will be to display a full-size image. This is what the panel should look like now:
+Most of these default values are fine as they are; they describe a block that occupies the whole window area. Let's just change the ~m:name~ property to ~m:background~ and the ~m:background~ property to ~m:url('resources/users/2020/160/1/images/SemoigoDawn.jpg')~. When the presentation runs, the effect will be to display a full-size image. This is what the panel should look like now:
 
 ~img:resources/users/2020/160/1/images/quickstart/first-block.png:100%~