Web View

CardStock lets you embed a basic web browser in your stack. Using the globe icon (the fourth button from the left in the Designer property editor toolbar), you can create a Web View. A Web View can render local pages (i.e., HTML code that you assign to the HTML property) or load the actual web page designated in the URL property (Figure 8).

Figure 8: CardStock applications can even browse the Internet!

Web Views don't compare with Firefox or Chrome due to speed, but Web Views function as actual browsers and can greatly extend your CardStock program's use cases. In Figure 9, for example, I used the search function of the Linux Magazine website in my CardStock stack to search for my articles.

Figure 9: A CardStock Web View offers all the essential functionality of a real web browser.

If needed, you can even limit browsing to certain domains. You do this by explicitly listing the domains in the allowed_hosts property. Optionally, you can run the following JavaScript code on the web page you load:

webview_1.run_java_script("YOUR JavaScript CODE HERE")

Testing and Debugging

Once you've built a stack, you can export it as a desktop or web application by saving your stack with all the images, audio files, and Python modules it needs. For web applications, CardStock uploads your program to www.cardstock.run. If you don't already have an account, it can help you set one up. After the upload, your web application will get a unique URL that anybody can load in their browser and run.

Before exporting, however, you first need to ensure that your application works as intended. To do this, you can check if your stack is working at any time by clicking the Run Stack button in the toolbar or choosing the same option in the File menu. Alternatively, you can select Run From Current Card and run the stack from that point.

For complete debugging, selecting Show Console in the menu opens a console where you can enter Python commands and check the values of some variables and read error messages, as well as anything your stack prints with the print() function. Indeed, if your stack contains any call to print(), the Console will open by itself the first time print() is used.

A better option is to use the Variable Inspector and the Error List for variables and error messages, respectively. The Variable Inspector (Show | Hide Variables) provides a compact, interactive view of all the variables in the stack and lets you change them while the stack is running.

The Error List, available from the Help menu, shows each error as a clickable link to the line of code that produced it. Finally, Help | All Code shows all of your stack's code.

Conclusions

Now that you know the basics, the most efficient way to learn programming with CardStock is to study and hack the many examples available from the CardStock File menu.

In my opinon, the most intriguing part of CardStock is that its executable .cds files are not binary files; they are plain text files. If you compare the portion of the .cds file shown in Figure 10 with Figure 3, you will immediately see that image settings and event definition in Figure 3 make up the source code shown in Figure 10!

Figure 10: The CardStock source code shown here corresponds to the image settings and event definition shown in Figure 3.

Much like shell scripts, .cds files are just plain text files that tell the CardStock viewer what it should draw and do. This means that you can copy, paste, mix, or even generate CardStock programs automatically by having other software write .cds files.

Even ignoring this feature, I recommend CardStock as a fun, efficient, and well-documented way to start learning Python programming, which may have very practical applications in schools and small businesses.

The Author

Marco Fioretti (http://mfioretti.substack.com) is a freelance author, trainer, and researcher based in Rome, Italy, who has been working with free/open source software since 1995 and on open digital standards since 2005. Marco also is a board member of the Free Knowledge Institute (http://freeknowledge.eu).