Merge pull request #120 from easycoder/dev

Quickstart tutorial

Author: easycoder

dist/easycoder-min.js

@@ -2317,7 +2317,7 @@ const EasyCoder_Core = {
 					radius_t
 				};
 			}
-			if ([`now`, `today`, `newline`, `break`, `empty`, `uuid`].includes(token)) {
+			if ([`now`, `today`, `newline`, `backtick`, `break`, `empty`, `uuid`].includes(token)) {
 				compiler.next();
 				return {
 					domain: `core`,
@@ -2750,6 +2750,12 @@ const EasyCoder_Core = {
 					numeric: false,
 					content: `\n`
 				};
+			case `backtick`:
+				return {
+					type: `constant`,
+					numeric: false,
+					content: `\``
+				};
 			case `break`:
 				return {
 					type: `constant`,

dist/easycoder.js

@@ -141,6 +141,9 @@ const EasyCoder_IWSY = {
 					});
 					return 0;
 				case `load`:
+					if (typeof EasyCoder.iwsyFunctions !== `undefined`) {
+						throw Error(`IWSY has already been set up`);
+					}
 					const playerRecord = program.getSymbolRecord(command.player);
 					const player = playerRecord.element[playerRecord.index];
 					player.innerHTML = ``;

dist/plugins/iwsy.js

@@ -162,6 +162,8 @@ const IWSY = (player, text) => {
         element.style[`background-size`] = `cover`;
         element.style.border = defaults.border;
         element.style[`overflow`] = `hidden`;
+        element.style[`display`] = `none`;
+        element.style[`opacity`] = `0`;
         val = defaults.textMarginLeft;
         if (!isNaN(val)) {
             val *= w;
@@ -228,6 +230,7 @@ const IWSY = (player, text) => {
             for (const block of script.blocks) {
                 if (block.defaults.name === name) {
                     block.element.style.opacity = showHide ? `1.0` : `0.0`;
+                    block.element.style.display = showHide ? `block` : `none`;
                     break;
                 }
             }
@@ -265,27 +268,41 @@ const IWSY = (player, text) => {
             for (const block of stepBlocks)
             {
                 block.element.style.opacity = upDown ? 1.0 : 0.0;
+                block.element.style.display = upDown ? `block` : `none`;
             }
             step.next();
         } else {
             const animSteps = Math.round(step.duration * 25);
             const continueFlag = step.continue;
+            for (const block of stepBlocks)
+            {
+                block.element.style.display = `block`;
+            }
             let animStep = 0;
             const interval = setInterval(() => {
-                if (animStep < animSteps) {
-                    const ratio =  0.5 - Math.cos(Math.PI * animStep / animSteps) / 2;
-                    let blocks = stepBlocks.length;
-                    for (const block of stepBlocks)
-                    {
-                        block.element.style.opacity = upDown ? ratio : 1.0 - ratio;
+                try {
+                    if (animStep < animSteps) {
+                        const ratio =  0.5 - Math.cos(Math.PI * animStep / animSteps) / 2;
+                        for (const block of stepBlocks)
+                        {
+                            block.element.style.opacity = upDown ? ratio : 1.0 - ratio;
+                        }
+                        animStep++;
+                    } else {
+                        for (const block of stepBlocks)
+                        {
+                            block.element.style.opacity = upDown ? 1 : 0;
+                            block.element.style.display = upDown ? `block` :`none`;
+                        }
+                        script.stepping = false;
+                        clearInterval(interval);
+                        if (!continueFlag) {
+                            step.next();
+                        }
                     }
-                    animStep++;
-                } else {
-                    script.stepping = false;
+                } catch(err) {
                     clearInterval(interval);
-                    if (!continueFlag) {
-                        step.next();
-                    }
+                    throw Error(err);
                 }
             }, 40);
             if (continueFlag) {
@@ -496,6 +513,11 @@ const IWSY = (player, text) => {
             }
             return true;
         });
+        if (typeof block.element === `undefined`) {
+            throw Error(`Block '${block.defaults.name}' has not been set up`);
+        }
+        block.element.style.opacity = 1;
+        block.element.style.display = `block`;
         if (script.speed === `scan`) {
             doTransitionStep(block, target, 1.0);
             setFinalState(block,target);
@@ -674,7 +696,6 @@ const IWSY = (player, text) => {
     // Show a block
     const block = blockIndex => {
         player.innerHTML = ``;
-        // player.style.background = null;
         const w = player.getBoundingClientRect().width / 1000;
         const h = player.getBoundingClientRect().height / 1000;
         script.blocks.forEach((block, index) => {
@@ -769,13 +790,13 @@ const IWSY = (player, text) => {
                     } else {
                         switch (item) {
                             case `left`:
-                                styles.push(`float:left`);
+                                styles.push(`float:left;margin-right:1em`);
                                 break;
                             case `center`:
                                 styles.push(`margin:0 auto`);
                                 break;
                             case `right`:
-                                styles.push(`float:right`);
+                                styles.push(`float:right;margin-left:1em`);
                                 break;
                             case `clear`:
                                 styles.push(`clear:both`);

iwsy/iwsy.js

@@ -105,6 +105,7 @@ Restart:
         index DeleteBlock to N
         index Editor to N
         create Row in Table
+        set the style of Row to `margin-bottom:0.2em`
         create Cell in Row
         set the style of Cell to `width:100%;display:flex`
         create Link in Cell
@@ -241,6 +242,7 @@ Restart:
     	put the index of DeleteBlock into N
         json delete element N of Blocks
         set property `blocks` of Presentation to Blocks
+        put -1 into SelectedBlock
         go to Restart
     end
 	stop

iwsy/resources/ecs/blocks.txt

@@ -75,6 +75,7 @@ Restart:
         set property `content` of Item to empty
         json add Item to Items
         set property `content` of Presentation to Items
+        put -1 into SelectedItem
         go to Restart
     end
 
@@ -102,6 +103,7 @@ Restart:
         put element N of Items into Item
         put property `name` of Item into ItemName
         create Row in Table
+        set the style of Row to `margin-bottom:0.2em`
         create Cell in Row
         set the style of Cell to `width:100%;display:flex`
         create EditButton in Cell
@@ -199,6 +201,7 @@ Restart:
         put property `content` of Presentation into Items
         json delete property ItemName of Items
         set property `content` of Presentation to Items
+        put -1 into SelectedItem
         go to Restart
     end
 	stop

iwsy/resources/ecs/content.txt

@@ -4,7 +4,6 @@
 
     import div Container
 
-    div Tracer
     div Panel
     div FileListing
     div FileRow
@@ -51,9 +50,6 @@
     if Mobile set the style of Panel to `background:#ffe`
     else set the style of Panel to `width:100%;height:100%`
 
-    create Tracer in Panel
-    set attribute `id` of Tracer to `easycoder-tracer`
-
     create Uploader in Panel
     set the style of Uploader to `width:100%;padding:0.5em 0;font-size:80%;text-align:center`
     create UploadFile in Uploader
@@ -68,7 +64,7 @@
     set attribute `max` of UploadProgress to 100
 
     create Buttons in Panel
-    set the style of Buttons to `display:flex`
+    set the style of Buttons to `display:flex;margin-bottom:0.5em`
     create UploadButton in Buttons
     set the style of UploadButton to `flex:1;width:150px;height:40px;font-family:sans;color:black`
     set the text of UploadButton to `Upload`
@@ -132,10 +128,12 @@ Show:
     put property `home` of UserRecord into Home
     put Home cat `/` cat property `id` of UserRecord into Home
     put `users/` cat Home cat `/images` into Home
-    put Home into CurrentPath
+    get CurrentPath from storage as `.filepath`
+    if CurrentPath is empty put Home into CurrentPath
 
 !	Build the list
 Browser:
+    put CurrentPath into storage as `.filepath`
     rest get Content from `ulist/` cat Email cat `/` cat Password cat `/` cat CurrentPath cat `?v=` cat now
     or begin
         alert `Failed to list files.`
@@ -148,7 +146,7 @@ Browser:
     set the elements of FileName to FileCount
 
   ! Add a row for each file
-    set the content of Scroller to ``
+    clear Scroller
     set Even
 
     if CurrentPath is not Home
@@ -239,7 +237,6 @@ SelectFile:
         set attribute `src` of Image to `/resources/` cat FilePath cat `?v=` cat now
         on click CloseButton go to CloseMedia
         set the text of URL to `resources/` cat FilePath
-!    highlight URL
         on click DeleteButton
         begin
           rest post to `udelete/` cat Email cat `/` cat Password cat `/` cat FilePath or

iwsy/resources/ecs/fileman.txt

@@ -25,6 +25,7 @@
       	if mobile set Mobile else clear Mobile
     end
 
+    set style `position` of Container to `relative`
     set style `padding` of Container to `0 1em`
     set style `overflow-y` of Container to `scroll`
 
@@ -70,23 +71,27 @@ GetPage:
     stop
 
 !------------------------------------------------------------------------------
-!	This is the Showndown extension.
+!	This is the Showdown extension.
 
 !	Decorate is called for every occurrence of ~...~ in the topic data
 Decorate:
     put the payload of DecoratorCallback into Payload
-    put the position of `:` in Payload into N
-    if N is -1
-    begin
-    	if Payload is `clear` put `<div style="height:1px;clear:both"></div>` into Payload
-    end
+    if Payload is `iwsy` put `<img src="resources/icon/iwsy.png" `
+    	cat `style="height:0.8em;position:relative;top:0.1em" />` into Payload
+    else if Payload is `clear` put `<div style="height:1px;clear:both"></div>` into Payload
     else
     begin
-        put left N of Payload into Function
-        add 1 to N
-        put from N of Payload into Data
-        if Function is `img` gosub to ProcessImage
-        else if Function is `page` gosub to ProcessPage
+        put the position of `:` in Payload into N
+        if N is greater than 0
+        begin
+            put left N of Payload into Function
+            add 1 to N
+            put from N of Payload into Data
+            if Function is `m`
+            	put `<span style="font-family:monospace;color:darkred">` cat Data cat `</span>` into Payload
+            else if Function is `img` gosub to ProcessImage
+            else if Function is `page` gosub to ProcessPage
+        end
     end
     set the payload of DecoratorCallback to Payload
     stop

iwsy/resources/ecs/help.txt

@@ -288,6 +288,7 @@ L2:
         set the content of NameEditor to empty
         put empty into CurrentScriptName
         gosub to CreateNewPresentation
+        iwsy script Presentation
         put Presentation into LastSavedState
     	gosub to UpdateCurrentSection
 	end
@@ -439,6 +440,9 @@ L2:
         end
         else if Action is `block`
         begin
+        	set style `display` of FileManPanel to `none`
+        	set style `display` of HelpPanel to `none`
+        	set style `display` of Player to `block`
         	put property `block` of Message into N
             iwsy block N
         end
@@ -484,7 +488,6 @@ CreateNewPresentation:
     set Item to array
     set property `blocks` of Presentation to Item
     set property `content` of Presentation to Item
-    iwsy load Player Presentation
 	return
 
 SetupSteps:
@@ -653,14 +656,20 @@ SelectFile:
     put File into CurrentScriptName
 	if UserRecord rest get Presentation from
     	`/resources/users/` cat UserHome cat `/scripts/` cat File cat `?v=` cat now
-    else get Presentation from storage as File
+!    else get Presentation from storage as File
+    send to StepsModule
+    send to BlocksModule
+    send to ContentModule
     put Presentation into LastSavedState
     gosub to UpdateCurrentSection
     gosub to SetStatusGreen
     set the content of Status to `Presentation '` cat File cat `' loaded`
     fork to ResetStatus
     set ShowRun
-    iwsy load Player Presentation
+    set style `display` of FileManPanel to `none`
+    set style `display` of HelpPanel to `none`
+    set style `display` of Player to `block`
+    iwsy script Presentation
 
 CloseBrowser:
     set style `background-color` of Overlay to `rgba(0,0,0,0.0)`
@@ -694,13 +703,8 @@ DoRunStop:
     	set style `display` of Player to `block`
     	put property `steps` of Presentation into Item
     	if the json count of Item is 0 stop
-        put element 0 of Item into Item
-        if property `action` of Item is not `init`
-        begin
-        	alert `The first step of a presentation must be an 'init' action.`
-            stop
-        end
     	set Running
+        set style `display` of FileManPanel to `none`
 		gosub to ClearStepsButtons
         set attribute `src` of RunStop to `resources/icon/runstop.png`