Forem: Andre Garzia

LiveCode is a modern day HyperCard

Andre Garzia — Mon, 29 Jul 2019 11:11:59 +0000

This post is a reply to Why HyperCard had to Die — by Stanislav. I’m not saying the post is wrong, I am just presenting an alternative that is alive and working well. LiveCode is a modern day HyperCard and everyone who used HyperCard will feel at home at it.

LiveCode runs on macOS, Windows and Linux and can generate standalone binaries for all those platforms plus Android and iOS. You can get it from https://www.livecode.com or you can get a GPL version of it from https://www.livecode.org.

In this post, I will recreate the demo that Stanislav created on their post which was a simple four operation calculator. I hope readers will notice how familiar the environment is and yet how modern it became.

Disclaimer: I work for LiveCode.

LiveCode Start Center

The first step is to create a stack.

Creating a new stack

We name it SmallCalculator using the Stack Inspector that is available from the menu or with the CTRL+K hotkey.

Naming the stack

Lets drag & drop a field into the stack to serve as our LCD for the calculator.

Drag & Drop an object into the stack

Be aware that just like HyperCard, we’re working with a stacks -> cards -> objects metaphor. All we’re doing here is targetting card 1 which is the first card on the stack. When I mentioned droping a field into the stack, it is actually creating a field on card 1 of stack “SmallCalculator”.

Naming the field

To create the buttons we also drag & drop from the tools palette.

Creating and a button

Lets name it and use the drag handlers to resize it (much like you’d do on a graphics design program).

Resizing and naming the button

After that it is time to edit the script for the button. There are multiple ways to access the script of an object. The most discoverable one is using the menus.

Accessing the object script

I’m going to try to mimic the script of the original post as much as possible. Be aware that LiveCode language has many more commands and expressions available for it than HyperCard did and the way I am building this demo is not the optimal way.

Editing the script for the button

Observe that just like HyperCard, you don’t need to compile a project to use it. On the top of the tools palette there are two different arrows. One is design mode and the other is interact mode. You can switch modes at any time you want. If you switch now and click the button three times, you’ll see the number 111 in the LCD field.

Now, we’re going to copy and paste enough buttons to build the number pad of the calculator. We’ll simply use CTRL+C and CTRL+V (or their CMD equivalents on a mac) to copy and paste them. I also took some time to move the objects around.

The number pad of the calculator

The next step is creating the operations buttons and the equal button. I just used copy and paste on the number buttons and gave them a name to match the math operation. The equal button was built by dragging and droping a new button from the tools palette into the stack.

Calculator with operations and equal button

Now, it is time to write the script for the equal button.

Script Editor showing the script for the equal button

Lets take our calculator for a spin.

The same math expression as the demo

And the result after pressing equal.

The same result

Now, lets deviate a bit from the demo and show something HyperCard never had. From the File menu I’ve accessed the Standalone Application Settings to configure how this stack will be deployed. I can from my windows machine deploy to macOS, Windows, Linux and Android. I can’t deploy for iOS for obvious (Apple argh) reasons. I will build only for Windows at this time.

Standalone Application Settings

And this is the Small Calulator running on windows as a standalone.

SmallCaltulator.exe

I hope you did enjoy this post and are curious to take LiveCode for a ride. Every couple months some post appears on HN or lobste.rs about HyperCard and I see a ton of people longing for it. I wonder how many of them are aware of LiveCode. I suspect many will love it as much as I do.

Loanwords, Agriculture & WebAssembly

Andre Garzia — Tue, 26 Mar 2019 09:37:08 +0000

😻💖📢🚀 Loanwords, Agriculture & WebAssembly 😻💖📢🚀

This is a little talk I've given at Mozilla as part of the TechSpeaker training program. I really enjoy it and plan to develop it further. In this talk I make a case for building more languages to target the front-end or client side as a way to keep our web ecosystem fertile. It is in part a cautionary tale against monocultures and how the deprive the environment from a sustainable future and a call to action to build little languages.

Playing with P2P protocols and Firefox

Andre Garzia — Wed, 19 Dec 2018 00:43:22 +0000

Old browsers can learn new tricks

It is important that we evolve the browser towards the future we want. As mentioned in the video, I am heavily invested in the decentralization space and I want a user agent that unlocks agency in me, that allows me to browse the platforms I want while remaining in control of my digital life.

We can augment our favorite independent browser by using Web Extensions (in Firefox they are called Add-ons) to add new features to the browser including supporting whole new protocols.

In this video I use the following Add-ons:

DAT P2P Protocol
- Source: https://github.com/sammacbeth/dat-fox/
IPFS Companion
- Source: https://github.com/ipfs-shipyard/ipfs-companion
Patchfox, which isn't ready yet, so this link is for the sources on Github.

Each of them take over different protocol schemas such as dat:// and ipfs:// and ssb:. I am the author of the patch that whitelisted those protocols for usage in Web Extensions, so I've been wanting to be able to use such add-ons since the day I made that patch. I think we should invest more in building these types of add-ons and molding our browser experience to support the peer-to-peer web instead of shipping many different electron-based Dapps each siloed in itself.

Towards a user agent that fosters decentralization

I briefly mention on the video the experimentation going on on Libdweb. This is a WebExtension that adds new APIs for other Web Extensions (aka WebExtension Experiment) and even though it is not on track for implementation or shipping, it is a wonderful toolkit that allows us to investigate what sort of experiences we can build inside the browser if the add-on authors have access to low level APIs.

Libdweb adds support for the following things:

TCP Sockets
UDP Datagrams
Filesystem access
Streams of data
Custom Protocols
mDNS

So, using those APIs a developer can build a full IPFS or DAT node inside Firefox (this has already happened and it is awesome). Recently, as a toy, I've built a little Web Server demo using those APIs. It is quite empowering to see your browser transforming into a server.

Final thoughts and request for feedback

So, I hope you people enjoyed this little video. I am still working on Patchfox and hope to have it in some beta state soon. Lets build the decentralized web together, all of us, inside the same user agent.

Please tell me what you thought about these ideas and the video. Reach out to me on:

Secure Scuttlebutt: @gaQw6z30GpfsW9k8V5ED4pHrg8zmrqku24zTSAINhRg=.ed25519
Mastodon: @soapdog@toot.cafe
Twitter: @soapdog

You can also subscribe to my RSS feed and be kept up to date with what I am up to and also subscribe to my YouTube channel to see more videos related to decentralization, programming languages and the web.