From 6971a5808b090de1dd749653441e0b9e370360e3 Mon Sep 17 00:00:00 2001 From: Dusty Phillips Date: Tue, 27 Dec 2011 16:53:53 -0600 Subject: [PATCH] Create a pyjaco example that utilizes jQuery. This example uses the pyjs.py script to compile a single javascript file. --- examples/jquery/README | 16 ++++++++++++++++ examples/jquery/clicker.py | 16 ++++++++++++++++ examples/jquery/index.html | 12 ++++++++++++ 3 files changed, 44 insertions(+) create mode 100644 examples/jquery/README create mode 100644 examples/jquery/clicker.py create mode 100644 examples/jquery/index.html diff --git a/examples/jquery/README b/examples/jquery/README new file mode 100644 index 0000000..6803dd4 --- /dev/null +++ b/examples/jquery/README @@ -0,0 +1,16 @@ +An example of using pyjaco to build a stand-alone javascript file that can be +included with HTML. I like this method as it allows separating javascript from +HTML and can therefore be used with a variety of backend setups. + +First run the following command in the main pyjaco directory: + +# python generate_library.py + +This will create the py-builtins.js that is included in the index.html file + +Next, generate the clicker.js javascript from clicker.py: + +python pyjs.py -N --output clicker.js + +Now you can load index.html in a browser and click the heading for a simple +jQuery interaction. diff --git a/examples/jquery/clicker.py b/examples/jquery/clicker.py new file mode 100644 index 0000000..c16d5d6 --- /dev/null +++ b/examples/jquery/clicker.py @@ -0,0 +1,16 @@ +@JSVar("jQuery") +def ready(): + jQuery('h1').click(on_click) + +@JSVar("jQuery", "Math.random", "Math.floor") +def on_click(): + if jQuery('#when_clicked').html(): + r = Math.floor(Math.random() * 255) + g = Math.floor(Math.random() * 255) + b = Math.floor(Math.random() * 255) + color = "rgb(%d, %d, %d)" %(r,g,b) + jQuery('#when_clicked').attr('style', 'background-color: ' + color) + else: + jQuery('#when_clicked').html("you clicked it!") + +jQuery(ready) diff --git a/examples/jquery/index.html b/examples/jquery/index.html new file mode 100644 index 0000000..924a76e --- /dev/null +++ b/examples/jquery/index.html @@ -0,0 +1,12 @@ + + + + + + + + +

Click me

+

+ +