Skip to content

Commit

Permalink
add a case study with an elaborate scripter #3777
Browse files Browse the repository at this point in the history
  • Loading branch information
girba committed May 15, 2024
1 parent 8ad7c2b commit afa41e6
Show file tree
Hide file tree
Showing 6 changed files with 349 additions and 8 deletions.
304 changes: 304 additions & 0 deletions lepiter/3g3781052c0zhq0qvf6csjamr.lepiter
Original file line number Diff line number Diff line change
@@ -0,0 +1,304 @@
{
"__schema" : "4.1",
"__type" : "page",
"children" : {
"__type" : "snippets",
"items" : [
{
"__type" : "textSnippet",
"children" : {
"__type" : "snippets",
"items" : [ ]
},
"createEmail" : {
"__type" : "email",
"emailString" : "<unknown>"
},
"createTime" : {
"__type" : "time",
"time" : {
"__type" : "dateAndTime",
"dateAndTimeString" : "2024-05-15T20:12:40.188599+02:00"
}
},
"editEmail" : {
"__type" : "email",
"emailString" : "<unknown>"
},
"editTime" : {
"__type" : "time",
"time" : {
"__type" : "dateAndTime",
"dateAndTimeString" : "2024-05-15T20:13:04.149933+02:00"
}
},
"uid" : {
"__type" : "uid",
"uidString" : "ReSi/dnUDQCQG9+HC/c4Og=="
},
"paragraphStyle" : {
"__type" : "textStyle"
},
"string" : "We often show screenshots of Glamorous Toolkit in our communication. For example, consider this one:"
},
{
"__type" : "exampleSnippet",
"children" : {
"__type" : "snippets",
"items" : [ ]
},
"createEmail" : {
"__type" : "email",
"emailString" : "<unknown>"
},
"createTime" : {
"__type" : "time",
"time" : {
"__type" : "dateAndTime",
"dateAndTimeString" : "2024-05-15T20:13:06.368297+02:00"
}
},
"editEmail" : {
"__type" : "email",
"emailString" : "<unknown>"
},
"editTime" : {
"__type" : "time",
"time" : {
"__type" : "dateAndTime",
"dateAndTimeString" : "2024-05-15T20:13:06.368297+02:00"
}
},
"uid" : {
"__type" : "uid",
"uidString" : "uQyezuPUDQCl5dBMC/c4Og=="
},
"exampleSelector" : "scripterWithElaborateScenario",
"previewHeight" : 500,
"previewShowSelector" : "gtScreenshotFor:",
"exampleBehaviorName" : "GtTour",
"codeExpanded" : true,
"previewExpanded" : false,
"noCode" : true
},
{
"__type" : "textSnippet",
"children" : {
"__type" : "snippets",
"items" : [ ]
},
"createEmail" : {
"__type" : "email",
"emailString" : "<unknown>"
},
"createTime" : {
"__type" : "time",
"time" : {
"__type" : "dateAndTime",
"dateAndTimeString" : "2024-05-15T22:00:49.75622+02:00"
}
},
"editEmail" : {
"__type" : "email",
"emailString" : "<unknown>"
},
"editTime" : {
"__type" : "time",
"time" : {
"__type" : "dateAndTime",
"dateAndTimeString" : "2024-05-15T22:00:50.156256+02:00"
}
},
"uid" : {
"__type" : "uid",
"uidString" : "OH7dT+XUDQCnxzmxC/c4Og=="
},
"paragraphStyle" : {
"__type" : "textStyle"
},
"string" : "This screenshot contains an elaborate scene with three panes. In the first pane, we have a Coder on the {{gtClass:GtLudoGame}} class, in which we have expanded {{gtMethod:GtLudoGame>>moveTokenNamed:}} method and in that method we expanded a message. Then we looked for references by pressing a shortcut and this produced a second pane with a filter tool. In that filter tool we scrolled down to {{gtMethod:GtLudoRecordingGameExamples>>#gameShowingAllMoves2}}, a method that happens to be an example (which is like a test that returns an object). We expanded the method and we executed the example by clicking on the button from the contextual toolbar of the method coder. This then produced the third pane containing an inspector with the result. And a little detail: as the mouse hovered over the button there is also a tooltip associated with that button."
},
{
"__type" : "textSnippet",
"children" : {
"__type" : "snippets",
"items" : [ ]
},
"createEmail" : {
"__type" : "email",
"emailString" : "<unknown>"
},
"createTime" : {
"__type" : "time",
"time" : {
"__type" : "dateAndTime",
"dateAndTimeString" : "2024-05-15T22:04:05.319958+02:00"
}
},
"editEmail" : {
"__type" : "email",
"emailString" : "<unknown>"
},
"editTime" : {
"__type" : "time",
"time" : {
"__type" : "dateAndTime",
"dateAndTimeString" : "2024-05-15T22:04:05.319958+02:00"
}
},
"uid" : {
"__type" : "uid",
"uidString" : "+ZGFW+XUDQCqvbBwC/c4Og=="
},
"paragraphStyle" : {
"__type" : "textStyle"
},
"string" : "These actions can be produced manually. But a proper graphical stack should allow us to simulate manual interactions programmatically, too. In Glamorous Toolkit we can. "
},
{
"__type" : "textSnippet",
"children" : {
"__type" : "snippets",
"items" : [ ]
},
"createEmail" : {
"__type" : "email",
"emailString" : "<unknown>"
},
"createTime" : {
"__type" : "time",
"time" : {
"__type" : "dateAndTime",
"dateAndTimeString" : "2024-05-15T22:00:58.632266+02:00"
}
},
"editEmail" : {
"__type" : "email",
"emailString" : "<unknown>"
},
"editTime" : {
"__type" : "time",
"time" : {
"__type" : "dateAndTime",
"dateAndTimeString" : "2024-05-15T22:04:07.095802+02:00"
}
},
"uid" : {
"__type" : "uid",
"uidString" : "ufJkUOXUDQCn0koEC/c4Og=="
},
"paragraphStyle" : {
"__type" : "textStyle"
},
"string" : "For example, the script that produces a scene like in the picture from above is found in {{gtMethod:GtTour >> #scripterWithElaborateScenario|expanded=false}}. The script makes use of {{gtClass:BlScripter}}, a scripting engine for the graphical stack. Scripter offers an an API that provides default abilities for searching for elements and for simulating actions (such as `click` or `shortcut`). The API is also extensible with higher level queries, such as `methodCoder` which gives us more concise abilities to work with a tool like Coder. For example, we can ask quite concisely a `methodCoder` to `clickOnPlayAndInspectExampleButton`."
},
{
"__type" : "textSnippet",
"children" : {
"__type" : "snippets",
"items" : [ ]
},
"createEmail" : {
"__type" : "email",
"emailString" : "<unknown>"
},
"createTime" : {
"__type" : "time",
"time" : {
"__type" : "dateAndTime",
"dateAndTimeString" : "2024-05-15T22:03:28.128798+02:00"
}
},
"editEmail" : {
"__type" : "email",
"emailString" : "<unknown>"
},
"editTime" : {
"__type" : "time",
"time" : {
"__type" : "dateAndTime",
"dateAndTimeString" : "2024-05-15T22:03:28.373027+02:00"
}
},
"uid" : {
"__type" : "uid",
"uidString" : "SRFOWeXUDQCqEQXzC/c4Og=="
},
"paragraphStyle" : {
"__type" : "textStyle"
},
"string" : "The above script is quite elaborate. But the good news is that you can build it iteratively. Here is how it looks like in the editor that we used to write this very article. Executing the code from the snippet simply shows an inspector on the {{gtClass:BlScripter}} instance. And this inspector shows multiple dedicated views, one of which is the preview of the resulting scene."
},
{
"__type" : "exampleSnippet",
"children" : {
"__type" : "snippets",
"items" : [ ]
},
"createEmail" : {
"__type" : "email",
"emailString" : "<unknown>"
},
"createTime" : {
"__type" : "time",
"time" : {
"__type" : "dateAndTime",
"dateAndTimeString" : "2024-05-15T22:04:15.562191+02:00"
}
},
"editEmail" : {
"__type" : "email",
"emailString" : "<unknown>"
},
"editTime" : {
"__type" : "time",
"time" : {
"__type" : "dateAndTime",
"dateAndTimeString" : "2024-05-15T22:04:15.562191+02:00"
}
},
"uid" : {
"__type" : "uid",
"uidString" : "wtshXOXUDQCq02TFC/c4Og=="
},
"exampleSelector" : "scripterWithElaborateScenario",
"previewHeight" : 500,
"previewShowSelector" : "gtStepsFor:",
"exampleBehaviorName" : "GtTour",
"codeExpanded" : true,
"previewExpanded" : false,
"noCode" : true
}
]
},
"createEmail" : {
"__type" : "email",
"emailString" : "<unknown>"
},
"createTime" : {
"__type" : "time",
"time" : {
"__type" : "dateAndTime",
"dateAndTimeString" : "2024-05-15T08:30:25.4933+02:00"
}
},
"editEmail" : {
"__type" : "email",
"emailString" : "<unknown>"
},
"editTime" : {
"__type" : "time",
"time" : {
"__type" : "dateAndTime",
"dateAndTimeString" : "2024-05-15T08:30:25.4933+02:00"
}
},
"pageType" : {
"__type" : "namedPage",
"title" : "Scripting an elaborate user interface scenario"
},
"uid" : {
"__type" : "uuid",
"uuid" : "9328a2fd-d9d4-0d00-901a-2cbf0bf7383a"
}
}
4 changes: 2 additions & 2 deletions lepiter/59974yyx38w1jgov9kp63wtqf.lepiter
Original file line number Diff line number Diff line change
Expand Up @@ -66,7 +66,7 @@
"__type" : "time",
"time" : {
"__type" : "dateAndTime",
"dateAndTimeString" : "2024-03-19T07:34:25.48284+01:00"
"dateAndTimeString" : "2024-05-15T08:29:15.339296+02:00"
}
},
"uid" : {
Expand All @@ -76,7 +76,7 @@
"paragraphStyle" : {
"__type" : "textStyle"
},
"string" : "How distinct? Let's see. We have reading-like scenarios such as {{gtPage:Working with a REST API: the GitHub case study|db=2j9m7db2i4oz116bexd7wbdxo|label=API browsing}}, analyzing the code structure in {{gtPage:Analyzing JavaScript React Native: the Zooniverse case study|db=2j9m7db2i4oz116bexd7wbdxo|label=different languages}} and {{gtPage:Analyzing feature toggles from a Python project: the Open edX case study|db=2j9m7db2i4oz116bexd7wbdxo|label=technologies}}. But using the same tools and techniques also seem to apply to construction-like scenarios like {{gtPage:Executable domain-driven design: the Ludo game case studyin}}, working with external languages like {{gtPage:Exploring GitHub through GraphQL |db=2j9m7db2i4oz116bexd7wbdxo|label=GraphQL}} or {{gtPage:Visualizing yarn.lock files using JavaScript and Pharo|db=2j9m7db2i4oz116bexd7wbdxo|label=JavaScript}}, and even {{gtPage:PetitParser SPL case study|db=2j9m7db2i4oz116bexd7wbdxo|label=building a new language}}."
"string" : "How distinct? Let's see. We have reading-like scenarios such as {{gtPage:Working with a REST API: the GitHub case study|db=2j9m7db2i4oz116bexd7wbdxo|label=API browsing}}, analyzing the code structure in {{gtPage:Analyzing JavaScript React Native: the Zooniverse case study|db=2j9m7db2i4oz116bexd7wbdxo|label=different languages}} and {{gtPage:Analyzing feature toggles from a Python project: the Open edX case study|db=2j9m7db2i4oz116bexd7wbdxo|label=technologies}}. But using the same tools and techniques also seem to apply to construction-like scenarios like {{gtPage:Executable domain-driven design: the Ludo game case study}}, working with external languages like {{gtPage:Exploring GitHub through GraphQL |db=2j9m7db2i4oz116bexd7wbdxo|label=GraphQL}} or {{gtPage:Visualizing yarn.lock files using JavaScript and Pharo|db=2j9m7db2i4oz116bexd7wbdxo|label=JavaScript}}, and even {{gtPage:PetitParser SPL case study|db=2j9m7db2i4oz116bexd7wbdxo|label=building a new language}}."
},
{
"__type" : "textSnippet",
Expand Down
37 changes: 37 additions & 0 deletions lepiter/6k9vwu4iqoe6r1g3or2plhse3.lepiter
Original file line number Diff line number Diff line change
Expand Up @@ -1571,6 +1571,43 @@
},
"string" : "[[Explaining the text editor's selection mechanism]]"
},
{
"__type" : "textSnippet",
"children" : {
"__type" : "snippets",
"items" : [ ]
},
"createEmail" : {
"__type" : "email",
"emailString" : "<unknown>"
},
"createTime" : {
"__type" : "time",
"time" : {
"__type" : "dateAndTime",
"dateAndTimeString" : "2024-05-15T08:30:05.767303+02:00"
}
},
"editEmail" : {
"__type" : "email",
"emailString" : "<unknown>"
},
"editTime" : {
"__type" : "time",
"time" : {
"__type" : "dateAndTime",
"dateAndTimeString" : "2024-05-15T08:30:24.058548+02:00"
}
},
"uid" : {
"__type" : "uid",
"uidString" : "jx0H/NnUDQCO4ND0C/c4Og=="
},
"paragraphStyle" : {
"__type" : "textStyle"
},
"string" : "[[Scripting an elaborate user interface scenario]]"
},
{
"__type" : "textSnippet",
"children" : {
Expand Down
4 changes: 2 additions & 2 deletions lepiter/8w0nfqczshj1njxes11wuazjj.lepiter
Original file line number Diff line number Diff line change
Expand Up @@ -178,7 +178,7 @@
"__type" : "time",
"time" : {
"__type" : "dateAndTime",
"dateAndTimeString" : "2023-08-23T13:24:14.883222+02:00"
"dateAndTimeString" : "2024-05-15T22:13:59.37435+02:00"
}
},
"uid" : {
Expand All @@ -188,7 +188,7 @@
"paragraphStyle" : {
"__type" : "textStyle"
},
"string" : "#The Moldable Development environment"
"string" : "w#The Moldable Development environment"
},
{
"__type" : "textSnippet",
Expand Down

0 comments on commit afa41e6

Please sign in to comment.