A web app launcher with responsive design

[Mark Smith]

Hi Tom, Andreas didn’t mention what the platform was in his message so I just googled  “LC web deployment” and it turned up this… 

https://lessons.livecode.com/m/4071/l/800867-how-do-i-put-my-first-app-on-the-web

However, since you mentioned WASM I looked it up and you are correct, LC 10 (which Andreas was using) is using Web Assembly not HTML5. 

Sent from my iPhone

> On Aug 14, 2022, at 1:07 AM, Tom Glod via use-livecode <use-livecode at lists.runrev.com> wrote:
> 
> Hey Andreas, thanks for sharing, cool example of responsive design.
> 
> I thought the HTML5/javascript export was dead, and WASM would be used
> instead.
> It could be my own confusion about terminology being used.
> Can someone clarify this for me?
> 
> Thanks,
> 
> Tom
> 
> 
>> On Sat, Aug 13, 2022 at 5:41 PM Mark Smith via use-livecode <
>> use-livecode at lists.runrev.com> wrote:
>> 
>> Congratulations Andreas and thanks for sharing. I haven’t done any work
>> with the new LC HTML5 engine but I was really impressed with the speed of
>> loading it on my new M1 Pro — about 3-4 seconds on first download and then
>> a second or so thereafter. On my iPhone 12 not so fast… more like 30 on the
>> first download but again very quick (a second or two) on subsequent loads.
>> It looks like you’ve got a lot of the tech working with objects and screens
>> and the adaptive resizing. When I do get around to getting into this (and
>> it looks very enticing) I’ll know where to go for help :)
>> 
>> Mark
>> 
>> 
>>> On 13 Aug 2022, at 8:24 pm, Andreas Bergendal via use-livecode <
>> use-livecode at lists.runrev.com> wrote:
>>> 
>>> Friends, I have done wonderful things with LC10 web deployment!
>>> 
>>> I’m excited to share with you the fruits of this week's extensive
>> research and testing!
>>> 
>>> TL;DR:
>>> Try this: https://wheninspace.com/portal/ <
>> https://wheninspace.com/portal/>
>>> 
>>> Long version:
>>> 
>>> I wanted to do two things:
>>> 
>>> 1) Like we often do with desktop standalones: Create a minimal
>> launcher/splash stack as standalone, which only does one thing - open an
>> external stack that does everything else. This way I can then update
>> individual stacks, without having to build a new standalone each time.
>>> 
>>> 2) Get the resizing of the browser window to trigger the resize of the
>> stacks and all the responsive design therein, and make it look good on both
>> desktop and mobile. (Refining the example from the mothership, ”Meeting
>> space”.)
>>> 
>>> I have accomplished both!
>>> You can see and test the result here:
>>> https://wheninspace.com/portal/ <https://wheninspace.com/portal/>
>>> 
>>> Please try it both in desktop browsers (resizing the browser to various
>> sizes) and mobile browsers (both portrait and landscape orientation).
>>> 
>>> The standalone consists of a minimal launch stack that just acts as
>> event listening agent (even after closing itself) and opens the Portal
>> stack which is an external LC stack. The Portal stack then has buttons for
>> opening additional external LC stacks.
>>> 
>>> When the launcher stack receives a resize signal from the browser (from
>> the JavaScript in the html file), it dispatches ”resizeEvent” with the
>> width/height values to the topStack, which can subsequently rearrange its
>> stack rect and content accordingly.
>>> 
>>> As a bonus, I also demonstrate the possibility to show several stacks in
>> the same browser window!
>>> 
>>> I find the LC web deployment option a true game-changer! A new world is
>> opening! Let’s build it! :)
>>> 
>>> /Andreas
>>> _______________________________________________
>>> use-livecode mailing list
>>> use-livecode at lists.runrev.com
>>> Please visit this url to subscribe, unsubscribe and manage your
>> subscription preferences:
>>> http://lists.runrev.com/mailman/listinfo/use-livecode
>> 
>> 
>> _______________________________________________
>> use-livecode mailing list
>> use-livecode at lists.runrev.com
>> Please visit this url to subscribe, unsubscribe and manage your
>> subscription preferences:
>> http://lists.runrev.com/mailman/listinfo/use-livecode
>> 
> _______________________________________________
> use-livecode mailing list
> use-livecode at lists.runrev.com
> Please visit this url to subscribe, unsubscribe and manage your subscription preferences:
> http://lists.runrev.com/mailman/listinfo/use-livecode