PixelGraphics Experimentation Area

This page provides a possibility for interactive experiments with the "PixelGraphics" package - assuming that your browser supports JavaScript and that you did not disable this feature! (If you are just looking for a possibility to experiment with JavaScript itself (i.e., without "PixelGraphics"), you should prefer the JavaScript Experimentation Area instead)

While this page may be risklessly displayed with any browser and even on computer systems with only moderate processor and memory capacity, visiting the actual Experimentation Area page may occupy your computer for several dozens of seconds and - probably - crash browser and/or operating system! (The author recommends Opera 5.12 (or newer) for a good performance!)

Please, also consider my "Hints for Reading" and the "List of Recent Changes".

Instructions

On the separate Experimentation Area page you will find an input area, a pixel display, an output area and a number of buttons:

Source Area

You may type any number of (syntactically correct) JavaScript statements into this area - they will be executed ("evaluated") as soon as you press the "Evaluate" button. Pressing "Clear" will remove any contents from the source area.
 
You may also use your local clipboard to transfer JavaScript code snippets to or from a text editor or any other application. Just use the common key sequences for your platform (e.g. Ctrl-X, Ctrl-C and Ctrl-V under Windows);

Display Area

Upon initialization, a graphics display with a dimension of 80x60 pixels has been created which may be manipulated using any "PixelGraphics" function (except createDisplay). Pressing the "Clear" button will fill the whole display with white pixels;

Output Area

Any output produced by your JavaScript code using the print() and println() functions will be shown in the output area. If desired, you may select any portion of the displayed text and copy it into the local clipboard for a later transfer into a text editor or any other program;

Apart from "common" JavaScript functions and objects (even those provided by your browser!) and any function from the "PixelGraphics" package, the code may use the following functions:

cls()

allows your code to explicitly clear the output area. The function does not yield any result;

input (Message[, Preset]) -> string

opens an input dialog and displays the given Message. The user may now enter the requested information and complete or cancel the input by pressing the appropriate button. If provided, the input field will be loaded with the given Preset before opening the dialog. Upon pressing "Ok", the function yields a string containing the given input - otherwise, it yields null indicating that the input has been aborted;

print (...)

converts any given arguments to string values and writes them into the output area. The function does not yield any result;

println (...)

converts any given arguments to string values, writes them into the output area and terminates the whole output with a newline character. The function does not yield any result;

Experimentation Area

For safety reasons, the actual experimentation area has been realized on a separate page. If you are aware of the potential problems you may proceed to the Experimentation Area now.

Caveats

Due to its implementation, the "Pixelgraphics Experimentation Area" has a few drawbacks:

• syntax errors within the user-defined JavaScript code may cause any kind of error message (or simply stop script execution without further notice) rather than being indicated as such. The situation becomes even more complicated as "PixelGraphics" functions usually need some time to complete and Browser displays will not reflect the progress of these functions immediately. For that reason, you should always enter a few lines of code only - this should simplify the location of potential errors within your script;

• user-defined JavaScript code does not run within a "sandbox" but within an environment provided by the actual web browser - with full access to its document object model (DOM). While this detail additionally allows to experiment with DOM features, it also holds the danger of potential side effects in case of errors within the evaluated macro;

• end-less loops within the JavaScript code may block your browser. You may have to close the browser's window (showing the HTML document with the "PixelGraphics" Experimentation area) in order to stop the script;

• because of this integration into the browser's document object model, the document object may be used to store any information which should "survive" a single evaluation run. Example:
    document.myVariable = "here I am"; (first run)
    print(document.myVariable);        (second run)
  But note: you should use this "feature" with great care only! Any misuse may affect the HTML page or even crash your browser - in such a case, you should better restart the browser before proceeding;

• the amount of source code to be evaluated in a single run and the amount of text to be shown within the output area is limited by the capacity of the respective textarea element;

• for performance reasons, "PixelGraphics" functions perform only very limited argument checking. While pixel coordinates outside the visible area will be clipped and non-existing colors replace by "Black", severe misuse may just result in a "crash";

Despite these problems, the author hopes that this page helps to become familiar with the "PixelGraphics" package!