Settling onto decent python web technologies

here's my "htmldict" class, which wraps htmltmpl. the __access__ bit is so that mod_python can't get at any functions/classes in it.

you use this as:

content = HTMLdict('www/maincontent.tmpl')
content['name'] = 'fred'
page = HTMLdict("www/index.tmpl")
page['title'] = 'hello'
page['content'] = contentpage
return str(page)

on e.g. www/index.tmpl:

< html >
< title > < TMPL_VAR title > < /title >
< body > < TMPL_VAR content > < /body >
< /html >

 and e.g. www/content.tmpl:
< p >
  hurrah, welcome, < TMPL_VAR name >
< /p >
< /pre >


 __access__ = 0

 from htmltmpl import TemplateProcessor, TemplateManager

 class HTMLdict(dict, TemplateProcessor):

     def __init__(self, fname=None, htmlescape=0):

         self.tmpl_fname = fname
        dict.__init__(self)
        TemplateProcessor.__init__(self, html_escape=htmlescape)

     def __str__(self):

         if self.tmpl_fname is None:
            return ''

         for (k, val) in self.items():
            if type(val) != type([]) and type(val) != type('') and \
                val is not None:
                self.set(k, str(val))
            elif val is not None:
                self.set(k, val)

         template = TemplateManager().prepare(self.tmpl_fname)

         return self.process(template)

 

i just received word from someone who read this article, and they kindly pointed out a couple of things. the first one is that ZPT makes it incredibly easy to hand HTML to web designers: the syntax is < tal:table > and so the template macro stuff doesn't interfere, in any way, with the web designer's job - unlike dtml and htmltmpl.

i pointed out to him that if ZPT only supported if-true-false, variable substitution and loop-on-list-of-dictionaries, i would consider it to be ideal.

in situations where you put a "cool toy" in front of people whose job it is to "do", they will "do", and they will use every "cool toy" possible.

regardless of the consequences, because it's not their job to think of that.

hence, why i have such a problem with zope: so much _can_ be done with it that people _will_ do it - and get themselves into a mess.

Thanks for the article. Always interesting to read your output.

You're an interesting person to ask this: since you hate javascript, what do you do for those who turn it off? Do you write two versions of your site?

Personally, since I usually have javascript turned off in my main browser configuration, I feel morally obligated to write sites that are still usable that way. It wouldn't be right to force others to use javascript if I don't want to use it myself.

Not to mention the security side of things. It wouldn't be right to force my users to make their computers less secure just to use my site either.

Thoughts?

hiya cdfrey,

well, what i've done is written a simple javascript function which walks the DOM model, looking for "onclick". i then "overwrite" the href with a javascript "void" function. this stops double-linking, but also allows people to click on the href if they have javascript disabled.

then, i make sure that all hrefs are like this:

< a href="< TMPL_VAR thelink > onclick="ajax_dlink('thedivtagid', '< TMPL_VAR thelink >'"> click here < /a >

function set_hrefs()
{
        //var oAs = document.getElementsByTagName("a");
        var oAs = document.links;
        var LC;
        for (LC = 0; LC < oAs.length; LC++)
        {
                if (oAs[LC].onclick)
                {
                        oAs[LC].href = "javascript:void(0)";
                       //oAs[LC].href="javascript:"+oAs[LC].onclick+";";
                        //oAs[LC].onclick='';
                }
        }
}

 

the maintenance effort of having two sites really would be a nightmare. so i hope to come up with some tricks where, with ease, i can switch between frames, non-javascript, iframes, ajax... we'll see what happens :)

the syntax of ZPT (tal) is like this:

< td tal:content="here/now" > < /td >

which means of course that the "unrecognised" attributes simply get ignored by "industry-standard" web design tools.

and i was very interested to hear (from matthew hamilton, of netsight) that a lot of people who are using ZPT are advocating the same things that i am - namely that ZPT should be restricted to if-true-false, loop-on-list-of-dictionaries, and text-substitution.

btw, also, it's worth pointing out: ZPT doesn't have to be used exclusively in zope.

< noscript > do something here like put in an href to a different style menu < /noscript>

according to the above article, what i am apparently _supposed_ to do is return "true" from the "onclick" function and then the href won't be actioned. hm. oh well!

Just now I posted a diary about how I'm learning C# ASP.Net so I can put those two all-important buzzwords in my resume. It seems the the once proud and independent nation of Canada is now completely within the grip of the Evil Empire.

To prove I can do it, and hopefully make a little coin on my own, I'm using them to write a web application that will run on Mono, Apache and Linux rather than Windoze and IIS.

From what I've seen of C# so far, it looks like a well-designed language, and I hear good things about it all the time.

I personally am a big fan of Python, and would prefer to code my new web app in it, if it weren't for the fact that there seem to be no Python jobs to be found anywhere in Canada. I need the website to give me a foot in the door for C# contracts, as I don't have any paid experience using it.

this may come as a surprise, but i actually really like mono and .net and what it promises - but then, i was privileged to hear what the designers had in mind for it - namely that it should be a common binding for _all_ the possible languages that ms could get their hands on.

to that end, they hired the guy who wrote ironpython, which if you have the time and love python, i do recommend that you investigate it. it's basically .net (mono) with a python syntax. you CANNOT get access to the standard python librariey: ironpython is actually a compiler that happens to have a python syntax, it really DOES have absolutely nothing to do with python2.X, so you have all of the .net and mono libraries available to you instead.

okay.

here's what i would like to see happen, wrt mono.

namely, that they go get libwine, and then add a COMPLETE set of bindings into mono, for Win32.

this would truly make it possible for .net applications to run cross-platform.

already, from what i can gather, it's possible to run applications written for ASP/.NET under apache2 - it would be absolutely perfect if you could run win32 graphical applications, too.

lovely syntax (right up to the ${fruit} bit).

love the < ul py:xxx > bit: like tal that makes it possible to hand the html to a specialist html designer without them needing to know about "code".

... but evaluation of functions? NNOOOOO! template-based functions/macros? NOOOO!

... y'know... i really should set up an example site of what i've been using... i'd love to see how it compares against e.g. cherrypy.

might as well dump the javascript i use at you - it's a mish-mash of various examples i've found online, some of which needed work.

one little "trick" that i do is, if you download an HTTP fragment which contains < script >, then i execute its content!

this is an unbelievably incredibly useful trick, because what you can use it for is to put in further ajax calls in to update other < div > tags.

for example, my "congratulations you logged in" welcome message appears in my "centrepage" div, and that div tag is the target of the AJAX POST of the login form. being greeted by "congratulations you logged in" is friggin boring, so i added < script > ajax_dlink('leftcontext, './usercontext.html'); ajax_dlink('banner', 'usermenu.html'); < /script > and that of course gets executed by the "activate_javascript()" function...

neat, huh? :)

btw - watch out for using the timeout-based ajax_dlink_refresh() function: it's a bit weird, it's not perfect, and that's probably because i need to call clearTimeout() from the AJAX POSTing function as well and then restart the timer... oh well :)

 function createHttpRequest(){

         if(window.ActiveXObject){
                try {
                        return new ActiveXObject("Msxml2.XMLHTTP");
                } catch (e) {
                        try {
                                return new ActiveXObject("Microsoft.XMLHTTP");
                        } catch (e2) {
                                return null;
                        }
                }
        } else if(window.XMLHttpRequest){
                return new XMLHttpRequest();
        } else {
                return null;
        }
}

 function set_hrefs()
{
        //var oAs = document.getElementsByTagName("a");
        var oAs = document.links;
        var LC;
        for (LC = 0; LC < oAs.length; LC++)
        {
                if (oAs[LC].onclick)
                {
                        oAs[LC].href = "javascript:void(0)";
                        //oAs[LC].href="javascript:"+oAs[LC].onclick+";";
                        //oAs[LC].onclick='';
                }
        }
}

 /**
 * activate_javascript(str)
 *
 * looks for any script and runs it (using eval)
 *
 */

 function activate_javascript(targetnode)
{
        var scriptnodes = targetnode.getElementsByTagName('script')
        var LC;
        for (LC = 0; LC < scriptnodes.length; LC++)
        {
                var sn = scriptnodes[LC];

                 var nd = document.getElementById('centercontent');
                if (sn.src)
                {
                        ajax_eval(sn.src);
                }
                else
                {
                        eval(sn.innerHTML);
                }
        }
}

 /**
 * ajax_eval(url)
 *
 * @param url   load and activate url
 * @returns             readyState
 */

 function ajax_eval(url)
{
        var xhtoj = createHttpRequest()

         xhtoj.open("GET", url , true );

         xhtoj.onreadystatechange = function()
        {
                if ((xhtoj.readyState==4) && (xhtoj.status == 200) )
                {
                        str = xhtoj.responseText;

                         eval(str);
                }
        }

         xhtoj.send("")
}

 /**
 * ajax_dlink_refresh(oj,url)
 *
 * @param id    id of element for insert
 * @param url   load url
 * @param timeout       refresh timeout period, ms
 * @returns             readyState
 */

 /* use these to overrun an existing timeout, so that
   we don't end up with several of them!
 */
var running_timeout = 0;
var timeout_idname;
var timeout_url;
                                                    
function ajax_dlink_refresh(idname, url, timeout)
{
        timeout_idname = idname;
        timeout_url = url;
        redo_timeout = timeout;
        if (running_timeout)
                return;
        setTimeout("do_ajax_dlink_refresh()", timeout);
        running_timeout = 1;
}

 function do_ajax_dlink_refresh()
{
        if (ajax_dlink(timeout_idname, timeout_url) == 0)
        {
                running_timeout = 0;
                return;
        }
        running_timeout = 0;
        ajax_dlink_refresh(timeout_idname, timeout_url, redo_timeout);
}

 /**
 * ajax_dlink(oj,url)
 *
 * @param id    id of element for insert
 * @param url   load url
 * @returns             readyState
 */

 function ajax_dlink(idname,url)
{
        clearTimeout(); /* really important - get into a mess otherwise */
        var xhtoj = createHttpRequest()
        xhtoj.open("GET", url , true );
        xhtoj.send("");

         var jsnode = 0;
        xhtoj.onreadystatechange = function()
        {
                if ((xhtoj.readyState==4) && (xhtoj.status == 200) )
                {
                        if (chk_browser('konqueror'))
                                        str = utf8to16(xhtoj.responseText);
                        else if(chk_browser('safari'))
                                        str = utf8to16(xhtoj.responseText);//dame
                        else    str =  xhtoj.responseText;

                         jsnode = document.getElementById(idname);

                         if (jsnode)
                        {
                                jsnode.innerHTML=str;
                                activate_javascript(jsnode);

                                 /* remove all hrefs from onlick links */
                                set_hrefs();

                                 return 1;
                        }
                }
        }

         return 0;
}

 /**
 * chk_browser()
 *
 * @param browserName   browser name
 */

 function chk_browser(browserName)
{
        var ua = navigator.userAgent

         switch (browserName)
        {
                case 'konqueror' :
                         return  ua.indexOf("Konqueror") != -1 ; break ;
                case 'safari' :
                         return  ua.indexOf("Safari") != -1 ; break ;

                 dafault :
                        return null ; break ;
        }
}


 /* utf.js - UTF-8 <=> UTF-16 convertion
 *
 * Copyright (C) 1999 Masanao Izumo <mo@goice.co.jp>
 * Version: 1.0
 * LastModified: Dec 25 1999
 * This library is free.  You can redistribute it and/or modify it.
 */

 /*
 * Interfaces:
 * utf8 = utf16to8(utf16);
 * utf16 = utf16to8(utf8);
 */

 function utf16to8(str) {
    var out, i, len, c;

     out = "";
    len = str.length;
    for(i = 0; i < len; i++) {
        c = str.charCodeAt(i);
        if ((c >= 0x0001) && (c <= 0x007F)) {
            out += str.charAt(i);
        } else if (c > 0x07FF) {
            out += String.fromCharCode(0xE0 | ((c >> 12) & 0x0F));
            out += String.fromCharCode(0x80 | ((c >>  6) & 0x3F));
            out += String.fromCharCode(0x80 | ((c >>  0) & 0x3F));
        } else {
            out += String.fromCharCode(0xC0 | ((c >>  6) & 0x1F));
            out += String.fromCharCode(0x80 | ((c >>  0) & 0x3F));
        }
    }
    return out;
}

 function utf8to16(str) {
    var out, i, len, c;
    var char2, char3;

     out = "";
    len = str.length;
    i = 0;
    while(i < len) {
                c = str.charCodeAt(i++);
                switch(c >> 4)
                {
                  case 0: case 1: case 2: case 3: case 4: case 5: case 6: case 7:
                    // 0xxxxxxx
                    out += str.charAt(i-1);
                    break;
                  case 12: case 13:
                    // 110x xxxx   10xx xxxx
                    char2 = str.charCodeAt(i++);
                    out += String.fromCharCode(((c & 0x1F) << 6) | (char2 & 0x3F));
                    break;
                  case 14:
                    // 1110 xxxx  10xx xxxx  10xx xxxx
                    char2 = str.charCodeAt(i++);
                    char3 = str.charCodeAt(i++);
                    out += String.fromCharCode(((c & 0x0F) << 12) |
                                                   ((char2 & 0x3F) << 6) |
                                                   ((char3 & 0x3F) << 0));
                    break;
                }
    }

     return out;
}

 function ajax_post(idname, file, fobj)
{
        var str = getFormValues(fobj, null);
        var xhtoj = createHttpRequest();

         var jsnode = document.getElementById(idname);
        xhtoj.open( "POST", file, true );
        xhtoj.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
        xhtoj.setRequestHeader("Content-length", str.length);
        xhtoj.setRequestHeader("Connection", "close");
        xhtoj.send(str);

         xhtoj.onreadystatechange = function()
        {
                if ((xhtoj.readyState==4) && (xhtoj.status == 200) )
                {
                        if (chk_browser('konqueror'))
                                        str = utf8to16(xhtoj.responseText);
                        else if(chk_browser('safari'))
                                        str = utf8to16(xhtoj.responseText);//dame
                        else    str =  xhtoj.responseText;

                         jsnode = document.getElementById(idname);
                        jsnode.innerHTML = str;
                        activate_javascript(jsnode);

                         /* remove all hrefs from onlick links */
                        set_hrefs();
                }
        }
}

 function getFormValues(fobj)
{
   var str = "";
   var val = "";
   var cmd = "";
   var valFunc = null;

    for (var i = 0;i < fobj.elements.length; i++)
   {
           switch (fobj.elements[i].type)
           {
                   case "checkbox":
                   case "radio":
                   {
                        if (fobj.elements[i].checked)
                        {
                                str += fobj.elements[i].name + "=" + fobj.elements[i].value + "&";
                        } else {
                                str += fobj.elements[i].name + "=&";
                        }
                        break;
                   }
                   case "text":
                   case "hiddentext":
                   case "hidden":
                   case "password":
                   case "textarea":
                   case "button":
                                if(valFunc)
                                {
                                        //use single quotes for argument so that the value of
                                        //fobj.elements[i].value is treated as a string not a literal
                                        cmd = valFunc + "(" + 'fobj.elements[i].value' + ")";
                                        val = eval(cmd)
                                }
                                str += fobj.elements[i].name + "=" + escape(fobj.elements[i].value) + "&";
                                 break;
                   case "select-one":
                                str += fobj.elements[i].name + "=" + fobj.elements[i].options[fobj.elements[i].selectedIndex].value + "&";
                                break;
           }
   }
   str = str.substr(0,(str.length - 1));
   return str;
}

http://freespace.virgin.net/hamish.sanderson/htmltemplate.html

and

http://www.dscpl.com.au/projects/vampire/

htmltemplate looks a _hell_ of a lot better than anything i've previously encountered. you indicate what you want to "tag", by using the syntax "node=somename" and then you can reference anything with somename as a python variable.

the syntax could use a little work. e.g. to access (and replace) the inner-html, you do template.somename.content = "the new content", and to add (or delete?) an attribute, you do template.somename.atts['href'] = "http://fred.com"

with proper overloading, this could be template.somename = "the new content" and template.somename['href'] = "http://fred.com".

and yes you can do template.somename = "the new content" - in the template class you overload __setattr__ i believe.

the way that HTMLTemplate works is _very_ obscure. i love the convenience behind the HTMLdict concept, so here's a simple wrapper which provides the same functionality - for HTMLTemplate:

from HTMLTemplate import Template

 class HTMLdict2(dict):

     def __init__(self, fname=None, content=None):

         dict.__init__(self)
        if fname:
            f = open(fname, "r")
            content = f.read()
            f.close()
        self.t = Template(self.render, content)

     def render(self, node, kvs):

         for (k, val) in kvs.items():
            a = getattr(node, k)
            if isinstance(val, type([])):
                a.repeat(self.render, val)
            else:
                a.content = val

     def __str__(self):

         return self.t.render(self)

 def test():

     html = """
<div node="rep:section">
    <h2 node="con:title">section title</h2>
    <p node="con:desc">section description</p>
</div>
"""
    x = HTMLdict2(content=html)
    d = [{'title': 'title1', 'desc': 'desc1'}]
    x['section'] = d
    print str(x)

test embedded greeting card (1600x1200pix) from Jones Farm, West Trenton NJ.

look at her through this lens. what you see ain't what you get.

the author calls this "advanced ajax". basically it's very similar to the ajax.js i posted, above. the key thing that i can notice (and understand, with 1mins' scanning) is that it copes with select-multiple on HTTP POST.

also it looks like it has some auto-refresh stuff, whoopeee.

http://developers.slashdot.org/developers/06/06/06/0451239.shtml

a slashdot article which highlights why PHP and MySQL are so horrendous: maintenance. although the author on his blog mentions that PHP is "bad" because it encourages people to mix-code-with-markup, he then goes on to recommend Zope - without then advocating that people avoid ZPT/TAL's mix-code-with-markup features, or dtml's mix-code-and-namespaces-with-markup.

lucky he doesn't know about mod_python's "PSP" in order to recommend that, then :)

i've just started adding in support for no javascript, with a view to "if things go wrong with ajax..." :)

the principle is quite straightforward, and has two aspects. the first is to "construct" the web page, from multiple functions, or to set up ajax calls to "populate" the web page; the second is to "remember" previous AJAX calls and to add them to the "populating" bit; or to reconstruct the page again using the new

and the key to doing this is to subdivide the web site into sections using < div id="centercontent" /> < div id="banner /> etc.

"remembering" the history basically revolves around "recording", on a per-div-id-basis, the last location where an AJAX call overwrote the DOM model. to that end, it is necessary to record the href which was clicked on and associate it with the div "id" - using the div "id" as a key into a dictionary and recording the entire href clicked on as the key.

the trick is to distinguish between those AJAX calls which are to be "remembered" and those which are not - at the server-end. i do this by adding in an extra parameter onto the href - "&source=centercontent". BEFORE the python function which constructs the response page is returned, this argument is REMOVED, then the rest of the URL is recorded under the divid (in this example, centercontent) in a dictionary.

also, i don't set up links to web pages by shoving in an < a href="..." /> into the HTML template - that's boring :) what i do is pass a list of dictionaries containing the link information to a function, which creates the actual a href - _including_ automatically adding "&source=xxxx" and _including_ setting it up to do the javascript "onclick=ajax_dlink('./thewebpage?source=xxxx','xxxx')" stuff.

i haven't quite got round to it yet but in "non-ajax" mode, there will be only one target page - the index page. and the link-targets will get "munged" so that what _was_ the target page (e.g. "./profile?user=fred" in the menu) will become an argument passed to the index page (e.g. "./index?source=xxxx&actualtarget=profile%2Euser%3Cfred" - i don't really know yet.

ultimately, i should also be able to add in a "frames" mode, where i construct framesets, too.

at that point, when i have it all working, i'll try to get it all documented and package it up because it's pretty cool :)

very good article explaining how to set up apache, mod_python, mysql - and recommending the use of sqlobject and explaining it. code fragment examples, config file examples - all in one. hurrah.

damn xxxxing advogato seriously needs some arse-kicking. oh. and an edit mode.

and it may not be a bad thing. Natural simplying process. Mandatory evaculation means ' if you walk freely in that zone, authority may put you behind the bar.' Here's latest snap shot. Water under the Washington Crossing bridge. Last time when i walked on the bridge sidewalk, water might be more than 20 feet below...

what on _earth_ are you wittering about? :)

hardly can gather any strength for anything. heartless to link my name with 'wittering'.

NJ Politics is the funniest and cruelest. 'Everybody wants to be gay. Everybody wants to be happy." Former governor James McGreavy has a book out. He lives in my old neighborhood, hillside historical Queen City now.

hmm, there appears to be a lot of ruby-ajax-integration - haven't found _anything_ like it for python.