INTRO: A script and todo manager workflow / UI experiment + video howto's

764 views
Skip to first unread message

PMario

unread,
Oct 25, 2017, 7:38:05 AM10/25/17
to tiddl...@googlegroups.com
Hi folks,

I want to introduce a video series, that is based on a bundle, that I created and which is attached here.
The bundle implements a workflow, that was requested some time ago by a user here in the group.

I use tiddly wiki to deal with a set of scripts that allow me to reproduce some results I need to be able to reproduce (go go science !).
Each of these scripts is contained in a tiddler that is tagged with the name of the article it is related.

Each of these scripts has three main fields:
*summary, that is a description of what it is computed,
*todo, you know what it is,
*results, which is a list of path to files than are the e.g. files, tables ... generated by the script.

IMO we can see a request like this, relatively often here in the group. That's why I wanted to explore it a little bit closer.

And here, is what I came up with as a FIRST STEP.

see the ~10m video: Script / ToDo manager for TiddlyWiki 01

The second step will be a video about the plugins I did use to create my "development environment". Which I will post soon!

What do you think?
Feedback very welcome!

have fun!
mario
PS: The end result of this journey, should be a bundle / plugins, that are generic enought to be a good base for user based layouts.

PPS: Video-list

Script / ToDo manager for TiddlyWiki 01 ... How to use the bundle / workflow
Script Todo - Footer HowTo - 02. ... It contains a short overview, how the specific footers for the Script and ToDo tiddlers are created. 2nd attachment
Script Todo Manager - elements - 03 ... Overview about the different tiddlers in the bundle
Script Todo - layout and styles - 04 ... Description, how the "script-list" view was created, CSS and layout overview. 3rd attachment
Script Todo Manager - todo list - 05 .. This video discusses the todo-list layout and the CSS used to define it.
    Script Todo Manager - working with filters - 06 .. This video discusses, how you experiment with filters.
    Script Todo - list-widget magic - 07 .. Using the list-widget to create 2 different type of links.
Script Todo Manager - grid layout moar basics - 08 ... This video discusses advanced possibilities of the grid-template-areas setting for grid base UIs. 4th attachment
Script Todo Manager - let todo actions happen - 09 ... This video shows the implementation details of the todo input UI

Script Todo Manager - description inline editing part - 10 ... This video shows the inlie editing components for the script description field

Script Todo Manager Problem - new bundle needed - 11 ... This video discusses a shortcomming, that requires the bundle to be fixed ;) see attachment V0.0.3 of the bundle

Script Todo Manager - link list part1 - functionality - 12 ... This video shows the editing components for the script links array

Script Todo Manager - link list part2 - implementation - 13 ... This video shows the editing components for the script links array. Digging into the code!

Script Todo Manager - lists and dynamic variables - 14 ... This is a short discussion about, how the list widget uses variables and how we can access and modify them

Script Todo Manager - create toggle button from scratch part1 - 15 ... This video discusses the creation of a toggle button from scratch. It also shows, how to assign specific "on-open", "on-close" actions to the button

Script Todo Manager - create toggle button from scratch part2 - 16 ... ^^^^

Script Todo Manager - create toggle button from scratch part3 - 17 ... This video discusses the usage, of the newly created toggle button.


script-manager.bundle.0.0.1.json
script-manager.bundle.0.0.3.json

@TiddlyTweeter

unread,
Oct 25, 2017, 8:08:50 AM10/25/17
to TiddlyWiki
Ciao PMario

Excellent! Useful both for the initial purpose but more generally too in illustrating how EASY stuff is once you know what to do.

My One Problem with such tutorials is the general problem with this group that in 3 weeks time no one will know it exists. More and more I feel we need a Central Hub of some kind that presents instructional material that is Organised so you can find things. We can't just leave this to Jeremy.

I think its a great shame we seem to lack the collective will to figure out a solution to this issue.

The truth is that IF I'd been aware that such tutorials existed when I started my learning would have been much faster. I wasn't so I didn't :-).

Best wishes
Josiah

@TiddlyTweeter

unread,
Oct 25, 2017, 11:14:43 AM10/25/17
to TiddlyWiki
Ciao PMario

Further to my last ...


The second step will be a video about the plugins I did use to create my "development environment".

Spot on!

An issue is this: de facto people who hang out here are mainly doing DIY, or edging towards it. For decent DIY you need a "workshop" (in the UK its called "a shed", in Italy a "laboratorio" :-), an environment suited to on-going fiddling-about ("bricolage" in the wonderful French word that fits TW so very well).

I think there are many unseen "workshops" behind what happens here. I think if they were a bit more visible sometimes it would help quite a lot.

Its NOT just outcomes that matter to problem solving. Its the modus operandi too.

Best wishes
Josiah

PMario

unread,
Oct 25, 2017, 11:45:05 AM10/25/17
to TiddlyWiki
On Wednesday, October 25, 2017 at 5:14:43 PM UTC+2, @TiddlyTweeter wrote:
Further to my last ...

The second step will be a video about the plugins I did use to create my "development environment".

Spot on!

:)
 
I think there are many unseen "workshops" behind what happens here. I think if they were a bit more visible sometimes it would help quite a lot.

That's right. ... Hacking stuff together, that does what I want is really fast. ... Because I know, what to do if something goes wrong. ... But putting stuff together that covers all edge-cases requires 10x as long.

Eg: I did create a "toggleMe" macro ... which comes in very handy. It's part of the bundle already. And I want to convert it into a propper plugin, because I think it may be useful for everyone, who want's to create custom TW UI's. ...

I'm sure I can talk 10 min about every single tiddler and again about every different input UI. ...

I'm just not sure, if anybody wants to see it :)
 
Its NOT just outcomes that matter to problem solving. Its the modus operandi too.

right.

-m


PMario

unread,
Oct 25, 2017, 4:32:13 PM10/25/17
to TiddlyWiki
Hi,

This is the second video: Script Todo - Footer HowTo - 02. It contains a short overview, how the specific footers for the Script and ToDo tiddlers are created.

This post contains an attached bundle with the plugins, that I used to create the stuff.
They can also be found here: https://wikilabs.github.io/

The next video will discuss the different bundle elements.

have fun!
mario


 

script-manager-dev-simple.bundle.json

Sylvain Naudin

unread,
Oct 26, 2017, 7:08:49 AM10/26/17
to TiddlyWiki
Hi Mario, I just wath the first video, it's a nice one, very clear and good speed voice.

Cheers,
Sylvain

@TiddlyTweeter

unread,
Oct 26, 2017, 8:06:22 AM10/26/17
to TiddlyWiki
Ciao PMario

Excellent again!

I think its a really good example of a practical, useful, tutorial on how to make a "DIY workshop" effectively.

One suggestion. Say something about the skill level needed to get the most out of it. In my guess its not "beginner" level. Its more like "medium to advanced." For instance, in may case, I'll have to watch it a few times to fully get the details. But that may just be my general slowness. Perhaps also write a little more about what it is for, what the benefits are?

Best wishes
Josiah

PMario

unread,
Oct 26, 2017, 8:44:48 AM10/26/17
to TiddlyWiki
On Thursday, October 26, 2017 at 2:06:22 PM UTC+2, @TiddlyTweeter wrote:
Excellent again!

thx
 
One suggestion. Say something about the skill level needed to get the most out of it.

ok
 
In my guess its not "beginner" level. Its more like "medium to advanced." For instance, in may case, I'll have to watch it a few times to fully get the details. But that may just be my general slowness. Perhaps also write a little more about what it is for, what the benefits are?

As I said in the first video. ... I also got tricked a bit by the clear definition, what's the usecase (as I did understand it). ...

The connections between the different elements are relatively straight forward:

a) script ... tagged with article name ... not part of the bundle, because it's obvious. ... But I should mention it ;)

b) script view ... contains "summary / description" field.
c) script view ... contains a list of "related todo's"
d) script view ... contains a list of "links to additional info / files"

Now the users question was: How to create the connections? + UI ...

I did it that way:

 - Article, scripts, todo's and links-container ... are physical tiddlers.

 - I could have done the different links as single tiddlers too, but I think that would create unnecessary "noise". That's why I did contain all the links in one tiddler.

 - Every script tiddler can be related to several link-containers. ... Link-containers are tagged with the script-name

 - Todo's contain a field named: script.  ... This field contains (links to) the related script


With those definitions in place, we can create all the needed lists and the related UI.

have fun!
mario

TonyM

unread,
Oct 26, 2017, 7:02:57 PM10/26/17
to TiddlyWiki
Mario,

Good work, It demonstrates well how videos can be more comprehensive, allowing the watcher to "read between the lines" visually as well as understanding "context" that is hard to communicate in text or pure audio. I have watched the first two so far, and you now have me wanting to use and extend the tools you demonstrate.

Some feedback: You have a good voice for audio because a deep voice carries well through smaller speakers. I have good speakers at home and still had a little difficulty and it is possibly because there is subtle (almost imperceptible) echo where you are recording, that is in tune with your voice frequency. If you can apply some additional treble, place something soft over a hard surface near your recording location I think your voice would be clearer.

I have being convinced video is a good communication method for both newbies and complex communications alike for some time, but your example proves it.

PS I really want to use your tab link tool, can we make it create tiddlers tagged with the current tiddler and a suffix for the tab name?

Thanks for your work

Tony

On Wednesday, October 25, 2017 at 10:38:05 PM UTC+11, PMario wrote:
Hi folks,

I want to introduce a video series, that is based on a bundle, that I created and which is attached here.
The bundle implements a workflow, that was requested some time ago by a user here in the group.

I use tiddly wiki to deal with a set of scripts that allow me to reproduce some results I need to be able to reproduce (go go science !).
Each of these scripts is contained in a tiddler that is tagged with the name of the article it is related.

Each of these scripts has three main fields:
*summary, that is a description of what it is computed,
*todo, you know what it is,
*results, which is a list of path to files than are the e.g. files, tables ... generated by the script.

IMO we can see a request like this, relatively often here in the group. That's why I wanted to explore it a little bit closer.

And here, is what I came up with as a FIRST STEP.

see the ~10m video: Script / ToDo manager for TiddlyWiki 01

The second step will be a video about the plugins I did use to create my "development environment". Which I will post soon!

What do you think?
Feedback very welcome!

have fun!
mario
PS: The end result of this journe, should be a bundle / plugins, that are generic enought to be a good base for user based layouts.

PMario

unread,
Oct 27, 2017, 6:15:43 AM10/27/17
to TiddlyWiki
On Friday, October 27, 2017 at 1:02:57 AM UTC+2, TonyM wrote:
Some feedback: You have a good voice for audio because a deep voice carries well through smaller speakers. I have good speakers at home and still had a little difficulty and it is possibly because there is subtle (almost imperceptible) echo where you are recording, that is in tune with your voice frequency. If you can apply some additional treble, place something soft over a hard surface near your recording location I think your voice would be clearer.

I did have a closer look at the recordings, and you are right. I'm using a "noise gate", that blocks the recording below a certain noise treshhold. So what you hear is the "white noise", when I'm talking and your speaker volume is slightly higher than I did expect / test. ....

I think I can fix this (most of it) with different software settings and a slightly different mic position.

I have being convinced video is a good communication method for both newbies and complex communications alike for some time, but your example proves it.

thx

PS I really want to use your tab link tool, ...

I did name it "link-to-tabs" .. since Mat's tool is called tablink, and does the same thing. see: https://wikilabs.github.io/editions/link-to-tabs/

... can we make it create tiddlers tagged with the current tiddler and a suffix for the tab name?
 
I'm not 100% sure, what you want to do here.

I think,
 - you want a modified "new here" button,
 - that creates a tagged tiddler and
 - the tiddler name should contain a suffix eg: "-tab"

The question here is "currentTiddler". 

a) Do you mean the tiddler that contains the tab, or
b) the name of the tab tiddler, which could be a caption or the real tiddler name, that is shown if you open the tab.

But IMO this should be a new thread.

have fun!
mario

@TiddlyTweeter

unread,
Oct 27, 2017, 6:38:04 AM10/27/17
to tiddl...@googlegroups.com
Ciao PMario

Small tech comment on the minor sound issue that TonyM wrote about. Auto-on-off gates are more trouble than they are worth. What can sound like "white noise" is actually a latency problem as software tries to do what hardware should. In my experience the single biggest issue is the quality of the microphone and its type--some are much better for this type of thing. If you are going to do a lot of this type of recording its perhaps worth buying one. A mid level effective way is to record sound using a dedicated recording device separate from computer and sync the sound later. But that's likely more hassle and cost than you need. I would look at mike types though. If you need info on options you can send me a private message.

J.

PMario

unread,
Oct 27, 2017, 7:23:51 AM10/27/17
to TiddlyWiki
On Friday, October 27, 2017 at 12:38:04 PM UTC+2, @TiddlyTweeter wrote:
Small tech comment on the minor sound issue that TonyM wrote about. Auto-on-off gates are more trouble than they are worth. What can sound like "white noise" is actually a latency problem as software tries to do what hardware should. In my experience the single biggest issue is the quality of the microphone and its type--some are much better for this type of thing. If you are going to do a lot of this type of recording its perhaps worth buying one. A mid level effective way is to record sound using a dedicated recording device separate from computer and sync the sound later. But that's likely more hassle and cost than you need. I would look at mike types though. If you need info on options you can send me a private message.

Thanks for the info. ... But I did have a software setting problem too, which imo made the noise problem worse. ... I hope the setup for the 4th video is much better now. It's uploading atm.

For my other videos, I did have a very old analog headset, that really worked well. But it fell apart 2 months ago. So I did already buy a new mic (a very cheap on :). ... But it seems I still have some issues with the right position and software settings :)    ...  It may turn out, that I need a better mic. ... we'll see.

-m
 

PMario

unread,
Oct 27, 2017, 7:57:35 AM10/27/17
to TiddlyWiki
Hi foks,

Just uploaded the 4th video: Script Todo - layout and styles - 04

It contains a description, how the "script-list" view was created, about the CSS used and a layout overview.

According to the feedback form Tony, I have tweaked the audio settings a bit. So please tell me, if it is better for you now!

The next 2 videos will discuss the ToDo-list layout and the "new todo" layout in more detail.

As always: Feedback very welcome! ... Also subscribe to the channel and Hit the Like-Button ;)

have fun!
mario

PMario

unread,
Oct 27, 2017, 8:00:00 AM10/27/17
to TiddlyWiki
Upps,

I forgot the attachment, which contains the 2 test tiddlers that I created in the last video. For those of you, that want to avoid writing ;)

have fun!
-m
test-styles.bundle.json

Eneko Gotzon

unread,
Oct 27, 2017, 9:57:36 AM10/27/17
to tiddl...@googlegroups.com
For non English native speakers like me it would be beneficial to use YouTube's automatic captioning feature (and to try to pronounce as well as clear as possible :).

Thank you very much, code sorcerers!

--
You received this message because you are subscribed to the Google Groups "TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email to tiddlywiki+unsubscribe@googlegroups.com.
To post to this group, send email to tiddl...@googlegroups.com.
Visit this group at https://groups.google.com/group/tiddlywiki.
To view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/cd6a9977-3e68-424b-bd55-1a707cedad98%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.



--
Eneko Gotzon Ares
Izan, egon, egin
Donostia – EH, Baskonia, NA Oso
——————————————————
Mezu hau eta berari atxikitako agiri oro isilpeko dira eta soilik hartzaileari zuzentzen zaizkie. Mezu hau hutsegitez jasoz gero berau ezabatzea eskatzen da eta igorleari horren berri ematea eskertuko litzake. Baimen agerikorik gabe debekatuta dago mezu honen edota bere edukinen edozein erabilera edo hedatzea, bai osoki zein zatiz. 
Mezu elektronikoak andea daitezke; mezu hau andeaturik, aldaturik edota aizun balego Eneko Gotzon Aresek edota bere ordezkariek uko egiten diote edonolako ardurei.

@TiddlyTweeter

unread,
Oct 27, 2017, 11:04:26 AM10/27/17
to TiddlyWiki
Ciao PMario,

I see Part 3 online. I can't see it mentioned on Google Groups??? But is it just me missing it here?

Best wishes
Josiah

PMario

unread,
Oct 27, 2017, 11:06:29 AM10/27/17
to TiddlyWiki
On Friday, October 27, 2017 at 3:57:36 PM UTC+2, Eneko Gotzon wrote:
For non English native speakers like me it would be beneficial to use YouTube's automatic captioning feature (and to try to pronounce as well as clear as possible :).

Hi,

The problem here is, that I'm a "non English native" speaker too. ...

I did try the automatic captioning with my very first videos. See the reviewed text:



... But Then I did sit there for hours to fix the stuff that was recorded. Because 70% was just wrong. ...



But at least it was funny to see, what google did understand :)

Since these tests are long ago, I'll give it a new shot :)

-m
 

@TiddlyTweeter

unread,
Oct 27, 2017, 12:01:11 PM10/27/17
to TiddlyWiki
Ciao PMario

Tech sidenote: Auto-captioning on YT is rarely as good as its claimed. I think its usually too much work to get into. BUT the tech behind it IS getting better and maybe it works better now?

In the past you had to speak like a robot if you wanted it automatic. YouTube is a PRIMITIVE instrument. Professional software like Premiere and Avid do it quite well.

I think your spoken English is good.

IF you want on screen words then I think you'll have to write them & display them unless YT has got factors better than it was.

Best wishes
Josiah

PMario

unread,
Oct 28, 2017, 11:53:35 AM10/28/17
to TiddlyWiki
Hi,


Script Todo Manager - todo list - 05 .. This video discusses the todo-list layout and the CSS used to define it.

As always.

have fun!
mario


PMario

unread,
Oct 28, 2017, 1:02:31 PM10/28/17
to TiddlyWiki
On Saturday, October 28, 2017 at 5:53:35 PM UTC+2, PMario wrote:
Script Todo Manager - todo list - 05 .. This video discusses the todo-list layout and the CSS used to define it.

I did review this video and found out, that it needs 2 elements explained in detail:

- Script Todo Manager - working with filters - 06 .. This video discusses, how you experiment with filters.
- Script Todo - list-widget magic - 07 .. Using the list-widget to create 2 different type of links.

have fun!
mario

PMario

unread,
Oct 28, 2017, 3:20:41 PM10/28/17
to tiddl...@googlegroups.com
Hi there,

Just one more video.

Script Todo Manager - grid layout moar basics - 08 ... This video discusses advanced possibilities of the grid-template-areas setting for grid base UIs.

Really cool stuff, that's possible now, since all major browsers support grid based UIs.

Also see attached file, used in the video.

have fun!
mario





grid-styles.bundle.json

PMario

unread,
Oct 28, 2017, 5:40:04 PM10/28/17
to TiddlyWiki
Hi,

If you really want to know, how it works, you'll want to have a look at this one :)


Script Todo Manager - let todo actions happen - 09 ... This video shows the implementation details of the todo input UI

have fun!
mario


@TiddlyTweeter

unread,
Oct 29, 2017, 6:31:06 AM10/29/17
to TiddlyWiki
The CSS related video (#5) is very good. Its the extra piece needed.

CSS in TW deserves much more documentation because its somewhat different in how it works than most people expect. (1) css IDs are not reliable [downside]. (2) css can be VERY EASILY applied and unapplied [big upside].

This is obvious to US. I'm pretty sure this is NOT obvious to new users. 

Also, you might want to document that not all of that CSS is backwards compatible?

Best wishes
Josiah

PMario

unread,
Oct 31, 2017, 12:54:51 PM10/31/17
to tiddl...@googlegroups.com
Hi,
Did just upload several videos:

Script Todo Manager - description inline editing part - 10 ... This video shows the inlie editing components for the script description field

Script Todo Manager Problem - new bundle needed - 11 ... This video discusses a shortcomming, that requires the bundle to be fixed ;) see attachment V0.0.3 of the bundle

Script Todo Manager - link list part1 - functionality - 12 ... This video shows the editing components for the script links array

Script Todo Manager - link list part2 - implementation - 13 ... This video shows the editing components for the script links array. Digging into the code!

Script Todo Manager - lists and dynamic variables - 14 ... This is a short discussion about, how the list widget uses variables and how we can access and modify them

Script Todo Manager - create toggle button from scratch part1 - 15 ... This video discusses the creation of a toggle button from scratch. It also shows, how to assign specific "on-open", "on-close" actions to the button

Script Todo Manager - create toggle button from scratch part2 - 16 ... ^^^^

Script Todo Manager - create toggle button from scratch part3 - 17 ... This video discusses the usage, of the newly created toggle button.


have fun!

mario


script-manager.bundle.0.0.3.json

@TiddlyTweeter

unread,
Nov 2, 2017, 6:17:22 PM11/2/17
to TiddlyWiki
This a major series. Very useful.

Könntest du eine Seite nur dafür machen?

Buona notte
Josiah

PMario

unread,
Nov 4, 2017, 7:02:46 PM11/4/17
to TiddlyWiki
On Thursday, November 2, 2017 at 11:17:22 PM UTC+1, @TiddlyTweeter wrote:
This a major series. Very useful.

thx
 
Könntest du eine Seite nur dafür machen?
 
What do you mean by: "creating a page for only this?"

-m

@TiddlyTweeter

unread,
Nov 4, 2017, 8:28:04 PM11/4/17
to TiddlyWiki
I meant "create a site/page/tiddlywiki just for this series."

Josiah

PMario

unread,
Nov 6, 2017, 11:53:19 AM11/6/17
to TiddlyWiki
On Sunday, November 5, 2017 at 1:28:04 AM UTC+1, @TiddlyTweeter wrote:
I meant "create a site/page/tiddlywiki just for this series."

Yea. I probably will in the future. ... But this recording project already blocked a project, that is also important.

-m
Reply all
Reply to author
Forward
0 new messages