source: cows_wps/trunk/cows_wps/renderer/form_renderer.py @ 6117

import os

from genshi.template import TemplateLoader 
from genshi.builder import * 
from genshi import HTML


class FormRenderer(object):
    """
    A set of rendering methods for HTML forms.
    """

    def __init__(self):
        # Instantiate Genshi template loader
        self.templateLoader = TemplateLoader(
           os.path.join(os.getcwd(), 'cows_wps/templates'),
           auto_reload=True)

    def htmlify(self, html): return HTML(html)

    def renderRadioButton(self, name, is_boolean=True, values=None):
        """
        Returns HTML of radio button.
        """
        if is_boolean == True:
            values = ("true", "false")

        html = ""
        for value in values:
            html += """         <input type="radio" id="%s" name="%s" value="%s" />
                <label for="%s">%s</label><br />\n"""   

        return html

    def renderTextInput(self, name, dtype, optional=False, default=None):
        """
        Returns HTML for text input including onChange validator.
        optional is a boolean.

        Populates with default value if not None.
        """
        if default == None: default = ""

        allowed_dtypes = ("float", "int", "string", "datetime")
        js_opt = str(optional).lower()

        if dtype not in allowed_dtypes:
            raise Exception("Invalid type sent to FormRenderer.renderTextInput(): %s" % dtype)

        validators = {"int": ("/^[0-9]+$/", "The %s input must be an integer." % name), 
                      "float": ("/^[-+]?([0-9]*\.[0-9]+|[0-9]+)$/", "The %s input must be a decimal number." % name),
                      "string": ("/[0-9a-zA-Z]+/", "The %s input must include text characters." % name),
                      "datetime": ("/[0-9]{4}-[0-9]{2}-[0-9]{2}T[0-9]{2}:[0-9]{2}:[0-9]{2}/", "The %s input must be a date/time entry as follows YYYY-MM-DDThh:mm:ss (e.g. 2009-01-01T12:00:00)." % name)}

        (regex, msg) = validators[dtype]
 
        html = """<input type="text" name="%s" id="%s" value="%s" onChange="validateTextInput(this.value, %s, '%s', %s);" /><br />\n""" % (name, name, default, regex, msg, js_opt)
        html += """<script type="text/javascript">addValidator('%s', 'text', %s, '%s', %s);</script>\n""" % (name, regex, msg, js_opt)
        return html

    def renderSelectList(self, name, values, optional=False, multiple=False):
        """
        Returns HTML for select list.

        If optional is True then add an extra option called "-- Please select --".
        """
        if optional == True:
            values.insert(0, "-- Please select --")

        multiple_string = ""
        if multiple == True:
            multiple_string = 'multiple="multiple"'

        html = """<select %s name="%s" id="%s">\n""" % (multiple_string, name, name)
       
        selected = 'selected="selected"' 
        for value in values:
            html += """ <option %s value="%s">%s</option>\n""" % (selected, value, value)
            selected = ""

        return html

    def renderBBox(self, name, extent="90|-180|-90|180"):
        """
        Renders a bounding box and N/W/S/E/ selectors.
        """
        if extent == False: extent = "90|-180|-90|180"

        (n, w, s, e) = extent.split("|")

        html = """      <label for="_north">North:</label> <input type="text" id="_north" name="_north" value="%s" onChange="updateBBox('%s');" /><br>
        <label for="_west">West:</label> <input type="text" id="_west" name="_west" value="%s" onChange="updateBBox('%s');" /><br>
        <label for="_south">South:</label> <input type="text" id="_south" name="_south" value="%s" onChange="updateBBox('%s');" /><br>
        <label for="_east">East:</label> <input type="text" id="_east" name="_east" value="%s" onChange="updateBBox('%s');" /><br>
        <input type="hidden" id="%s" name="%s" value="%s" />
        """ % (n, name, w, name, s, name, e, name, name, name, extent)

        return html


    def renderBBoxOLD(self, name, extent):
        """
        Renders a bounding box and N/W/S/E selectors.
        """
        html = """      <script type="text/javascript" src="/js/ext/jquery-1.3.2/jquery-1.3.2.js"></script>
        <script type="text/javascript" src="http://openlayers.org/api/OpenLayers.js"></script>
        <script type="text/javascript" src="/js/ui/openlayers-x.js"></script>
        <script type="text/javascript" src="/js/ui/boundingBoxMapSelect.js"></script>
        <script type="text/javascript">
                var layers = new Array();
                var layer_data = false;
                var bboxSelect = false;

                $(document).ready(function() {
                        var layer_data = new OpenLayers.Layer.WMS( "World Map", "http://labs.metacarta.com/wms-c/Basic.py?", {layers: 'basic', format: 'image/png' } );
                        layers.push(layer_data);
                        var bboxSelect = new BoundingBoxMapSelect('map', 'bounds_control_container', layers,  'bbox_hidden_input', null);
                });
        </script>

        <div id="bounding_container">
                <div id="bounds_control_container"></div>       
                <div id="map_container">
                        <div id='map'></div>
                </div>
                <input type="hidden" name="bbox" id="bbox_hidden_input" value="" />
        </div>
        """
        return html     

    def renderTypeAheadDirList(self, name, base_dir):
        """
        Renders type-ahead widget for directory listing.
        """
        html = """      <script type="text/javascript" src="/js/ext/jquery-1.3.2/jquery-1.3.2.js"></script>
        <script type="text/javascript" src="/js/ui/type_ahead_dirs.js"></script>
        <script type="text/javascript">
                var current_list = false;
                var abs_pos_%s = null;

                $(document).ready(function(){
                        initTypeAhead("%s", "type_ahead_for_%s", "%s");
                        abs_pos_%s = type_ahead_div.offset();   
                        positionRespDiv(abs_pos_%s);
                });
        </script>

        <p>Press down button to fill with text...</p>
        <div style="z-index: 1;">
                <input type="text" id="%s" name="%s" value="" style="width: 505px; height: 25px;" onBlur="hideSuggestions();" onFocus="showSuggestions();" />
        </div>
        <!--<span id="resp_container">
<div id="type_ahead_for_%s" style="width: 500px; background-color: yellow; border-style: solid; border-width: 1px; position: relative;"></div>
        </span>-->
        <div id="type_ahead_for_%s" style="width: 500px; background-color: yellow; border-style: solid; border-width: 1px; position: statis;"></div>
""" % (name, name, name, base_dir, name, name, name, name, name, name)
        return html