Making widjets - inserting dialogs into HTML page. Step by Step experiments.

For code: HTML-source: try Ctrl+U and find reference to dialog.js like pages. Pick them up.

1 - creates dialog box, hides or shows it ... 
2 - add style and button to control ...
3 - attempt to make script widget-like: putt all in one file and add a link to this file before </body> tag ...
    attempt fails on FF and works Chrome 5.0.375.55 beta. Both are in Ubunty.
    FF is: Mozilla/5.0 (X11; U; Linux i686; en-US; rv:1.9.2.3) Gecko/20100423 Ubuntu/10.04 (lucid) Firefox/3.6.3
    
    Notably, the word "this" fails in object (see substep).
    Notably, puting script before <body> tag leads to document.body.onload event undefined and task fails ...
4 - instead of generating <input value="toggle ... , writing it via document.write ...
    this works nice, but bound to specific position in Web page ... 
    any way, invoke button must be at some place ....

    substep "no_this" uses "Dialog".

5 - apparently fixes problem of step 3 by replacing document.body.onload with windows.onload.
    Works even, when link is injected before <body>.
    substep is not researched.

Step 6 works on our PC. From both locations remote: landkey.net and localhost:3000. Look at x.src property to see how this is done
and adjust to your environment:

6 - cross site
6 - cross site

Apparently, browsers do not care that link calls for script from another server than host server.


Copyright (c) 2010 Konstantin Kirillov.
License: MIT (X11).