Difference between revisions of "S2 Cookbook: A Testbed Layout"

From Dreamwidth Notes
Jump to: navigation, search
m (→‎S2 Testbed Layout)
(add an example of using this testbed layout to code)
 
(One intermediate revision by the same user not shown)
Line 1: Line 1:
−
This layout is meant to give you a clean testbed to explore examples with.  It gives ONLY the barest basics to get a blank HTML page to load, ensuring your test code is at the forefront of attention.  It is NOT a good start to creating a new layout--it's missing key information a functional layout needs.  For examples about making layouts, please see [[S2 Cookbook: Converting a CSS design to a layout]].
+
This layout is meant to give you a clean testbed to explore S2 examples with.  It gives ONLY the barest basics to get a blank HTML page to load, ensuring your test code is at the forefront of attention.  It is NOT a good start to creating a new layout--it's missing key information a functional layout needs.  For examples about making layouts, please see [[S2 Cookbook: Converting a CSS design to a layout]].
  
 
To use it, make a new layout layer containing the code below, and then a style that uses that layout.  If you need more information on how to do that, please see [[S2_Guide:_Style_System_Overview#Creating_and_managing_layers| S2 Guide: Style System Overview: Creating and managing layers]], as well as the section on creating and managing styles.
 
To use it, make a new layout layer containing the code below, and then a style that uses that layout.  If you need more information on how to do that, please see [[S2_Guide:_Style_System_Overview#Creating_and_managing_layers| S2 Guide: Style System Overview: Creating and managing layers]], as well as the section on creating and managing styles.
Line 21: Line 21:
 
     # Code you want to test goes here
 
     # Code you want to test goes here
 
      
 
      
 +
    """</body>\n""";
 +
    """</html>\n""";
 +
}
 +
</syntaxhighlight>
 +
 +
== Examples ==
 +
 +
Here are some simple examples of how to use this testbed layout to test out code:
 +
 +
=== Hello world ===
 +
 +
<syntaxhighlight lang="s2">layerinfo "type" = "layout";
 +
layerinfo "name" = "S2 Testbed Layout";
 +
 +
function Page::print()
 +
"This is a skeleton page function, for testing."
 +
{
 +
    """<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" """;
 +
    """"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">\n""";
 +
    """<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">\n""";
 +
    """<head>\n""";
 +
    """<title>S2 Testbed Layout</title>\n""";
 +
    """</head>\n""";
 +
    """<body>\n""";
 +
 +
    # Code you want to test goes here
 +
    """Hello world!""";   
 +
 +
    """</body>\n""";
 +
    """</html>\n""";
 +
}
 +
</syntaxhighlight>
 +
 +
 +
=== Print out all items in an array ===
 +
 +
<syntaxhighlight lang="s2">layerinfo "type" = "layout";
 +
layerinfo "name" = "S2 Testbed Layout";
 +
 +
function Page::print()
 +
"This is a skeleton page function, for testing."
 +
{
 +
    """<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" """;
 +
    """"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">\n""";
 +
    """<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">\n""";
 +
    """<head>\n""";
 +
    """<title>S2 Testbed Layout</title>\n""";
 +
    """</head>\n""";
 +
    """<body>\n""";
 +
 +
    # Code you want to test goes here
 +
    """<pre>""";  # useful to make newlines show on HTML
 +
    var string[] colors = ["blue", "red", "yellow", "purple", "orange", "green"];
 +
 +
    foreach var string color ( $colors ) {
 +
        print $color + "\n";
 +
    }
 +
 +
    """</pre>""";   
 +
 
     """</body>\n""";
 
     """</body>\n""";
 
     """</html>\n""";
 
     """</html>\n""";

Latest revision as of 19:26, 6 June 2011

This layout is meant to give you a clean testbed to explore S2 examples with. It gives ONLY the barest basics to get a blank HTML page to load, ensuring your test code is at the forefront of attention. It is NOT a good start to creating a new layout--it's missing key information a functional layout needs. For examples about making layouts, please see S2 Cookbook: Converting a CSS design to a layout.

To use it, make a new layout layer containing the code below, and then a style that uses that layout. If you need more information on how to do that, please see S2 Guide: Style System Overview: Creating and managing layers, as well as the section on creating and managing styles.

S2 Testbed Layout

layerinfo "type" = "layout";
layerinfo "name" = "S2 Testbed Layout";
 
function Page::print()
"This is a skeleton page function, for testing."
{
    """<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" """;
    """"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">\n""";
    """<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">\n""";
    """<head>\n""";
    """<title>S2 Testbed Layout</title>\n""";
    """</head>\n""";
    """<body>\n""";
 
    # Code you want to test goes here
    
    """</body>\n""";
    """</html>\n""";
}

Examples

Here are some simple examples of how to use this testbed layout to test out code:

Hello world

layerinfo "type" = "layout";
layerinfo "name" = "S2 Testbed Layout";
 
function Page::print()
"This is a skeleton page function, for testing."
{
    """<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" """;
    """"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">\n""";
    """<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">\n""";
    """<head>\n""";
    """<title>S2 Testbed Layout</title>\n""";
    """</head>\n""";
    """<body>\n""";
 
    # Code you want to test goes here
    """Hello world!""";     
 
    """</body>\n""";
    """</html>\n""";
}


Print out all items in an array

layerinfo "type" = "layout";
layerinfo "name" = "S2 Testbed Layout";
 
function Page::print()
"This is a skeleton page function, for testing."
{
    """<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" """;
    """"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">\n""";
    """<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">\n""";
    """<head>\n""";
    """<title>S2 Testbed Layout</title>\n""";
    """</head>\n""";
    """<body>\n""";
 
    # Code you want to test goes here
    """<pre>""";  # useful to make newlines show on HTML
    var string[] colors = ["blue", "red", "yellow", "purple", "orange", "green"];
 
    foreach var string color ( $colors ) {
        print $color + "\n";
    }
 
    """</pre>""";     
 
    """</body>\n""";
    """</html>\n""";
}
Retrieved from "http://wiki.dreamwidth.net/wiki/index.php?title=S2_Cookbook:_A_Testbed_Layout&oldid=9854"