From 212d23114e1a15d426c72bc37f1b132d1578ac57 Mon Sep 17 00:00:00 2001
From: Graham Trott <gtanyware@gmail.com>
Date: Wed, 3 Jun 2020 20:30:16 +0100
Subject: [PATCH] Redesign block & content structure
---
iwsy/iwsy.js | 10 +-
iwsy/resources/ecs/blocks.txt | 13 ++-
iwsy/resources/ecs/content.txt | 162 ++++++++++++++++----------------
iwsy/resources/ecs/scripted.txt | 1 -
iwsy/resources/ecs/steps.txt | 12 ++-
iwsy/resources/json/test.json | 41 ++++----
6 files changed, 129 insertions(+), 110 deletions(-)
diff --git a/iwsy/iwsy.js b/iwsy/iwsy.js
index 270a440..7e72692 100644
--- a/iwsy/iwsy.js
+++ b/iwsy/iwsy.js
@@ -151,9 +151,13 @@ const IWSY = (container, text) => {
if (!block.element) {
createBlock(block);
}
- const content = script.content[item.content];
- const converter = new showdown.Converter();
- block.textPanel.innerHTML = converter.makeHtml(content.split(`%0a`).join(`\n`));
+ for (const text of script.content) {
+ if (text.name === item.content) {
+ const converter = new showdown.Converter();
+ block.textPanel.innerHTML =
+ converter.makeHtml(text.content.split(`%0a`).join(`\n`));
+ }
+ }
}
}
}
diff --git a/iwsy/resources/ecs/blocks.txt b/iwsy/resources/ecs/blocks.txt
index f32f6dd..5b67c47 100644
--- a/iwsy/resources/ecs/blocks.txt
+++ b/iwsy/resources/ecs/blocks.txt
@@ -21,6 +21,7 @@
variable PropertyNames
variable PropertyName
variable SelectedBlock
+ variable SavedIndex
variable Message
variable N
variable NBlocks
@@ -93,7 +94,7 @@ Restart:
set the text of EditButton to property `name` of Block
create Link in Cell
create DeleteBlock in Link
- set the style of DeleteBlock to `width:1em;margin:0.1em 0 0 0.2em`
+ set the style of DeleteBlock to `width:1em;margin:0.2em 0 0 0.2em`
set attribute `src` of DeleteBlock to `/resources/icon/stop.png`
create Editor in Row
set the style of Editor to `margin:0.5em;border:1px solid black;padding:0.2em;display:none`
@@ -101,8 +102,9 @@ Restart:
end
on click EditButton
begin
- gosub to SaveSelectedBlock
- put the index of EditButton into SelectedBlock
+ put the index of EditButton into SavedIndex
+ gosub to SaveSelectedBlock
+ put SavedIndex into SelectedBlock
put 0 into N
while N is less than NBlocks
begin
@@ -118,10 +120,10 @@ Restart:
end
index EditButton to SelectedBlock
index Editor to SelectedBlock
+ index SaveButton to SelectedBlock
if style `display` of Editor is `none`
begin
set style `background` of EditButton to `lightgray`
- index SaveButton to SelectedBlock
set style `display` of Editor to `block`
put element SelectedBlock of Blocks into Block
put the json count of PropertyNames into N
@@ -149,7 +151,6 @@ Restart:
end
else
begin
- gosub to SaveSelectedBlock
clear Editor
set style `display` of Editor to `none`
end
@@ -166,6 +167,7 @@ Restart:
! Save the seleced block
SaveSelectedBlock:
if SelectedBlock is -1 return
+ index EditButton to SelectedBlock
put element SelectedBlock of Blocks into Block
put 0 into N
while N is less than the json count of PropertyNames
@@ -175,6 +177,7 @@ SaveSelectedBlock:
set property PropertyName of Block to the text of PropertyValue
add 1 to N
end
+ set the text of EditButton to property `name` of Block
set element SelectedBlock of Blocks to Block
set property `blocks` of Presentation to Blocks
diff --git a/iwsy/resources/ecs/content.txt b/iwsy/resources/ecs/content.txt
index 1d642ab..57561cd 100644
--- a/iwsy/resources/ecs/content.txt
+++ b/iwsy/resources/ecs/content.txt
@@ -5,13 +5,10 @@
import div Panel and variable Presentation
div Editor
+ div Title
+ div Table
div Row
div Cell
- div Title
- table Table
- tr TR
- td TD
- span ItemNameSpan
input ItemNameInput
textarea TextArea
button EditButton
@@ -24,10 +21,11 @@
variable ItemNames
variable ItemName
variable SelectedItem
- variable Action
+ variable SavedIndex
variable Message
variable N
- variable B
+ variable NumItems
+ variable Content
put -1 into SelectedItem
@@ -44,7 +42,14 @@ Start:
Restart:
put property `content` of Presentation into Items
- put the json keys of Items into ItemNames
+ set ItemNames to array
+ put 0 into N
+ while N is less than the json count of Items
+ begin
+ put element N of Items into Item
+ json add property `name` of Item to ItemNames
+ add 1 to N
+ end
clear Panel
create Row in Panel
@@ -68,99 +73,89 @@ Restart:
go to Restart
end
- put the json keys of Items into ItemNames
- put the json count of ItemNames into N
- set the elements of ItemNameSpan to N
- set the elements of ItemNameInput to N
- set the elements of EditButton to N
- set the elements of Editor to N
- set the elements of SaveButton to N
- set the elements of DeleteItem to N
- set the elements of TextArea to N
+ put the json count of Items into NumItems
+ set the elements of EditButton to NumItems
+ set the elements of Editor to NumItems
+ set the elements of SaveButton to NumItems
+ set the elements of DeleteItem to NumItems
+ set the elements of ItemNameInput to NumItems
+ set the elements of TextArea to NumItems
create Table in Panel
set the style of Table to `width:100%`
- put 0 into B
- while B is less than the elements of EditButton
+ put 0 into N
+ while N is less than the elements of EditButton
begin
- index EditButton to B
- index DeleteItem to B
- index ItemNameSpan to B
- index ItemNameInput to B
- put element B of ItemNames into ItemName
- create TR in Table
- create TD in TR
- set the style of TD to `width:8em;border:1px solid black`
- index ItemNameSpan to B
- create ItemNameSpan in TD
- set the content of ItemNameSpan to ItemName
- index ItemNameInput to B
- create ItemNameInput in TD
- set the style of ItemNameInput to `width:100%;display:none`
- set the content of ItemNameInput to ItemName
- create TD in TR
- set the style of TD to `border:1px solid black`
- index Editor to B
- create Row in TD
- set the style of Row to `display:flex`
- create EditButton in Row
- set the style of EditButton to `flex:1`
- set the text of EditButton to `Edit`
+ index EditButton to N
+ index DeleteItem to N
+ index Editor to N
+ index ItemNameInput to N
+ put element N of Items into Item
+ put property `name` of Item into ItemName
+ create Row in Table
create Cell in Row
- set the style of Cell to `width:1.4em;text-align:center`
+ set the style of Cell to `width:100%;display:flex`
+ create EditButton in Cell
+ set the style of EditButton to `flex:1`
+ set the text of EditButton to ItemName
create Link in Cell
create DeleteItem in Link
- set the style of DeleteItem to `width:1em;margin-top:0.1em`
+ set the style of DeleteItem to `width:1em;margin:0.2em 0 0 0.2em`
set attribute `src` of DeleteItem to `/resources/icon/stop.png`
- create Editor in TD
- set the style of Editor to `display:none`
- add 1 to B
+ create Editor in Row
+ set the style of Editor to `margin:0.5em;border:1px solid black;padding:0.2em;display:none`
+ add 1 to N
end
on click EditButton
begin
- gosub to SaveSelectedItem
- put the index of EditButton into SelectedItem
- put the text of EditButton into Action
+ put the index of EditButton into SavedIndex
+ gosub to SaveSelectedItem
+ put SavedIndex into SelectedItem
put 0 into N
- while N is less than the json count of ItemNames
+ while N is less than NumItems
begin
- index EditButton to N
- set style `background` of EditButton to ``
- set the text of EditButton to `Edit`
- index ItemNameSpan to N
- index ItemNameInput to N
- set the content of ItemNameSpan to the text of ItemNameInput
- set style `display` of ItemNameSpan to `inline`
- set style `display` of ItemNameInput to `none`
- index Editor to N
- set style `display` of Editor to `none`
+ if N is not SelectedItem
+ begin
+ index EditButton to N
+ set style `background` of EditButton to ``
+ index Editor to N
+ set style `display` of Editor to `none`
+ clear Editor
+ end
add 1 to N
end
index EditButton to SelectedItem
- if Action is `Edit`
+ index ItemNameInput to SelectedItem
+ index TextArea to SelectedItem
+ index SaveButton to SelectedItem
+ index Editor to SelectedItem
+ if style `display` of Editor is `none`
begin
+ put element SelectedItem of Items into Item
set style `background` of EditButton to `lightgray`
- set the text of EditButton to `Close`
- index ItemNameSpan to SelectedItem
- index ItemNameInput to SelectedItem
- index TextArea to SelectedItem
- index SaveButton to SelectedItem
- set style `display` of ItemNameSpan to `none`
- set style `display` of ItemNameInput to `inline`
- index Editor to SelectedItem
+ create Row in Editor
+ set the style of Row to `display:flex`
+ create Cell in Row
+ set the style of Cell to `width:5em`
+ set the content of Cell to `Name`
+ create ItemNameInput in Row
+ set the style of ItemNameInput to `flex:1`
+ set the text of ItemNameInput to property `name` of Item
set style `display` of Editor to `block`
- clear Editor
create TextArea in Editor
set the style of TextArea to `width:100%;max-width:100%;height:8em`
- put element SelectedItem of ItemNames into ItemName
- put property ItemName of Items into Item
- replace `%0a` with newline in Item
- set the content of TextArea to Item
+ put property `content` of Item into Content
+ replace `%0a` with newline in Content
+ set the content of TextArea to Content
create SaveButton in Editor
set the style of SaveButton to `width:100%`
set the text of SaveButton to `Save`
on click SaveButton gosub to SaveSelectedItem
end
- else gosub to SaveSelectedItem
+ else
+ begin
+ clear Editor
+ set style `display` of Editor to `none`
+ end
end
on click DeleteItem
begin
@@ -177,14 +172,15 @@ Restart:
SaveSelectedItem:
if SelectedItem is -1 return
index ItemNameInput to SelectedItem
+ index EditButton to SelectedItem
+ put element SelectedItem of Items into Item
+ set property `name` of Item to the text of ItemNameInput
+ set the text of EditButton to the text of ItemNameInput
index TextArea to SelectedItem
- put the content of TextArea into Item
- replace newline with `%0a` in Item
- set property ItemName of Items to Item
- if ItemNameInput is not ItemName json delete property ItemName of Items
- put ItemNameInput into ItemName
- set element SelectedItem of ItemNames to ItemName
- set property ItemName of Items to Item
+ put the content of TextArea into Content
+ replace newline with `%0a` in Content
+ set property `content` of Item to Content
+ set element SelectedItem of Items to Item
set property `content` of Presentation to Items
! Tell the parent to refresh the script
diff --git a/iwsy/resources/ecs/scripted.txt b/iwsy/resources/ecs/scripted.txt
index 79bbbcc..bdf4407 100644
--- a/iwsy/resources/ecs/scripted.txt
+++ b/iwsy/resources/ecs/scripted.txt
@@ -15,7 +15,6 @@
button Save
button Delete
variable Name
- variable CurrentName
variable Content
variable Current
variable Password
diff --git a/iwsy/resources/ecs/steps.txt b/iwsy/resources/ecs/steps.txt
index 5b0fbe6..4894d1b 100644
--- a/iwsy/resources/ecs/steps.txt
+++ b/iwsy/resources/ecs/steps.txt
@@ -45,6 +45,7 @@
variable Blocks
variable Block
variable Contents
+ variable Content
variable Target
variable Duration
variable URL
@@ -303,7 +304,6 @@ CreateNewStep:
! Edit a single step
EditStep:
put property `blocks` of Presentation into Blocks
- put property `content` of Presentation into Contents
set BlockNames to array
put 0 into N
while N is less than the json count of Blocks
@@ -312,7 +312,15 @@ EditStep:
json add property `name` of Block to BlockNames
add 1 to N
end
- put the json keys of Contents into ContentNames
+ put property `content` of Presentation into Contents
+ set ContentNames to array
+ put 0 into N
+ while N is less than the json count of Contents
+ begin
+ put element N of Contents into Content
+ json add property `name` of Content to ContentNames
+ add 1 to N
+ end
put element SelectedStep of Steps into CurrentStep
clear Editor
diff --git a/iwsy/resources/json/test.json b/iwsy/resources/json/test.json
index e0bf6a4..6d5b0ba 100644
--- a/iwsy/resources/json/test.json
+++ b/iwsy/resources/json/test.json
@@ -56,46 +56,55 @@
},
{
"name": "left",
- "background": "",
- "border": "",
+ "background": "rgba(80,80,80,0.5)",
+ "border": "1px solid gray",
"borderRadius": "",
"fontColor": "yellow",
"fontFamily": "",
"fontSize": 50,
"fontStyle": "",
"fontWeight": "",
- "height": 700,
+ "height": 650,
"left": 50,
"textAlign": "",
- "textMarginLeft": 10,
- "textMarginTop": "",
+ "textMarginLeft": 20,
+ "textMarginTop": 20,
"top": 300,
"width": 400
},
{
"name": "right",
- "background": "",
- "border": "",
+ "background": "rgba(80,80,80,0.5)",
+ "border": "1px solid gray",
"borderRadius": "",
"fontColor": "yellow",
"fontFamily": "",
"fontSize": 50,
"fontStyle": "",
"fontWeight": "",
- "height": 700,
+ "height": 650,
"left": 550,
"textAlign": "",
- "textMarginLeft": "",
- "textMarginTop": "",
+ "textMarginLeft": 20,
+ "textMarginTop": 20,
"top": 300,
"width": 400
}
],
- "content": {
- "main title": "# I Wanna Show You%0a%0a### for knockout presentations",
- "page 1 left": "### PowerPoint%0a%0a - is slide-based%0a - is a PC application%0a - is hard to embed%0a%0aPowerPoint is organized mainly around static text blocks and tied to the desktop.",
- "page 1 right": "### I Wanna Show You%0a - is step based%0a - runs in your browser%0a - is fully embeddable%0a%0aIWannaShowYou is a modern product built to handle color, movement and the online world."
- },
+ "content": [
+ {
+ "name": "iwannashowyou",
+ "content": "# I Wanna Show You%0a%0a### _for knockout presentations_"
+ },
+ {
+ "name": "page 1 left",
+ "content": "### PowerPoint%0a%0a - is slide-based%0a - is a PC application%0a - is hard to embed%0a%0aPowerPoint is a dated product organized mainly around static text blocks and tied to the desktop."
+ },
+ {
+ "name": "page 1 right",
+ "content": "### I Wanna Show You%0a - is step based%0a - runs in your browser%0a - is fully embeddable%0a%0aIWannaShowYou is a modern product built to handle color, movement and a mobile environment."
+ }
+ ],
"steps": [
{
"title": "My first presentation",
@@ -118,7 +127,7 @@
"blocks": [
{
"block": "center title",
- "content": "main title"
+ "content": "iwannashowyou"
},
{
"block": "left",