Sheerpower Logo

Browser Scripting


Dynamic Web Development

Sheerpower can be using as a browser scripting language. The first step is to activate the Sheerpower InterNet Services Web Server SPINS_WEBSERVER, also referred to as the spins webserver:
C:>spins_webserver Sheerpower InterNet Services Web Server SPINS_WEBSERVER V10.135 Copyright (c) 2005-2022 Touch Technologies, Inc. - Thu, 20 Jun 2024 21:19:50 Listening IP address is 0.0.0.0 Spoofed>> "Server: Apache/2.4.52 (Ubuntu)" Port 4, wwwroot is C:\Sheerpower\sphandlers\wwwroot\ Port 80, wwwroot is C:\Sheerpower\sphandlers\wwwroot\
The spins webserver has a lot of startup options. They can be seen by:
spins_webserver -?

On some systems, Windows might ask if it is okay if the spins_webserver accesses the network. Choose yes to continue.

To test that spins is working, type this url into your browser's address bar:
http://localhost/

The browser will respond with:
You made it to the SPINS_WEBSERVER index.html To change the default root folder (for example to c:\inetpub\wwwroot) c:> \Sheerpower\sphandlers\spins_webserver -wwwroot c:\inetpub\wwwroot

Let's run our first Sheerpower script. The source code is in C:\Sheerpower\sphandlers\scripts\sp4gl,
and the program is called:
matrix.spsrc. To run it, use this url:
localhost/matrix.spsrc
When Sheerpower code is run as a script, anything between double brackets is code, all else is html.
Note: Inside a Sheerpower script, %include files are treated in a specific way:
  • If the first line of the file contains an HTML tag, the entire content of the file is treated as HTML code and output directly to the browser.
  • If the first line does not contain an HTML tag, the file is processed and executed as Sheerpower code.
This distinction allows developers to easily integrate both HTML and Sheerpower code within the same application.

Seamless Collaboration

  • Designers create and edit .html layout files
  • Developers include them using #include
  • Sheerpower decides at compile time whether to treat the file as HTML or as executable code

This feature bridges the gap between front-end design and back-end logic, enabling clean separation of roles and faster development.

Explanation of [[ ]] Syntax in Sheerpower

The [[ ]] syntax in Sheerpower is used to embed Sheerpower code within an HTML document. This allows you to mix server-side logic with client-side HTML seamlessly.

How it Works

  • Opening and Closing [[ ]]:

    Code enclosed within [[ ]] is interpreted and executed as Sheerpower code. This syntax helps distinguish between static HTML and dynamic logic.

  • Usage in HTML:

    You can use [[ ]] to include loops, conditionals, and variable substitutions directly within your HTML. This makes it easy to generate dynamic pages based on server-side logic.

  • HTML Blocks Inside Code — [[%spscript]] and [[/%spscript]]:

    When writing Sheerpower scripts, you can embed blocks of HTML output inside your code using this special tag pair. Everything between [[%spscript]] and [[/%spscript]] is treated as raw HTML and sent directly to the browser.

    [[for i = 1 to 3]] [[%spscript]] <p>This is row [[=i]]</p> [[/%spscript]] [[next i]]

    This feature is especially helpful when generating large HTML sections from within Sheerpower code. It keeps the output readable and avoids complex print statements.


Benefits

  • Dynamic Content: Easily generate dynamic content based on server-side processing.
  • Seamless Integration: Mix HTML and Sheerpower code without switching contexts.
  • Flexibility: Use loops, conditionals, and other logic within HTML to create flexible and powerful web pages.

This feature is particularly useful in creating dynamic and interactive web applications, where the content can be generated and manipulated server-side before being sent to the client.

Summary: Sheerpower's unique handling of %include files bridges the gap between web design and software development. By automatically distinguishing between HTML and code content, it allows webpage designers to focus on creating and maintaining HTML independently, while code developers work on the backend logic. This loose coordination minimizes dependency, enabling both teams to contribute their expertise without requiring detailed knowledge of each other's domain. This feature simplifies collaboration, streamlines development, and ensures seamless integration of design and functionality within a single application.
Below is the HTML code mixed with Sheerpower code.
Note: This code for matrix.spsrc is only runnable from your local computer, inside of your browser.
Hide Description

    

       


      

Enter or modify the code below, and then click on RUN

Looking for the full power of Sheerpower?
Check out the Sheerpower website. Free to download. Free to use.