Skip to content
Browse files

add css messer example

  • Loading branch information...
1 parent 5cafbc2 commit 142d0947443e40feea287997e963673a013a33cf Luke Kenneth Casson Leighton committed Jun 26, 2010
View
93 examples/cssmesser/CSSMess.py
@@ -0,0 +1,93 @@
+import pyjd # this is dummy in pyjs.
+from pyjamas.ui.RootPanel import RootPanel
+from pyjamas.ui.Button import Button
+from pyjamas.ui.HTML import HTML
+from pyjamas.ui.Label import Label
+from pyjamas import Window
+
+import pygwt
+
+from __pyjamas__ import doc
+from pyjamas import DOM
+
+class StyleSheetCssFileChanger:
+
+ def __init__(self, cssFile=''):
+ self._e = DOM.createElement('link')
+ self._e.setAttribute('rel', 'stylesheet')
+ self._e.setAttribute('type', 'text/css')
+ self._e.setAttribute('href', cssFile);
+
+ print "css file", cssFile
+ doc().getElementsByTagName("head").item(0).appendChild(self._e)
+
+ def remove(self):
+ parent = DOM.getParent(self._e)
+ DOM.removeChild(parent, self._e)
+
+class StyleSheetCssChanger:
+
+ def __init__(self, text=''):
+ self._e = DOM.createElement('style')
+ self._e.setAttribute('type', 'text/css')
+ DOM.appendChild(self._e, doc().createTextNode(text))
+
+ doc().getElementsByTagName("head").item(0).appendChild(self._e)
+
+ def remove(self):
+ parent = DOM.getParent(self._e)
+ DOM.removeChild(parent, self._e)
+
+newcolours = """
+<!--
+.teststyle {
+ font-size: 100%;
+ margin: 20px;
+ padding: 20px;
+ background-color: #8080ff;
+}
+-->
+"""
+
+morenewcolours = """
+<!--
+.teststyle {
+ font-size: 200%;
+ margin: 20px;
+ padding: 20px;
+ background-color: #ff80ff;
+}
+-->
+"""
+
+global sc
+sc = None
+def greet(fred):
+ global sc
+ txt = fred.getText()
+ if txt == "Click me lots":
+ sc = StyleSheetCssChanger(newcolours)
+ fred.setText("Did it work?")
+ elif txt == "Did it work?":
+ sc.remove()
+ fred.setText("It did!")
+ elif txt == "It did!":
+ sc = StyleSheetCssChanger(morenewcolours)
+ fred.setText("Play again!")
+ elif txt != "Ok enough now":
+ fred.setText("Ok enough now")
+ sc.remove()
+
+if __name__ == '__main__':
+ pyjd.setup("public/CSSMess.html?fred=foo#me")
+ b = Button("Click me lots", greet, StyleName='teststyle')
+ h = HTML("<b>CSSMess World</b> (html)", StyleName='teststyle')
+ l = Label("CSSMess World (label)", StyleName='teststyle')
+ base = HTML("CSSMess from %s" % pygwt.getModuleBaseURL(),
+ StyleName='teststyle')
+ RootPanel().add(b)
+ RootPanel().add(h)
+ RootPanel().add(l)
+ RootPanel().add(base)
+ StyleSheetCssFileChanger("./CSSMess.css")
+ pyjd.run()
View
9 examples/cssmesser/README
@@ -0,0 +1,9 @@
+This is a port of Google's CSSMess example.
+
+To build, first read the top-level README (run boostrap and buildout)
+
+Then, run ./build.sh or:
+
+ ../../bin/pyjsbuild CSSMess.py
+
+and then open output/CSSMess.html in a web browser.
View
7 examples/cssmesser/build.sh
@@ -0,0 +1,7 @@
+#!/bin/sh
+# you will need to read the top level README, and run boostrap.py
+# and buildout in order to make pyjsbuild
+
+options="$*"
+#if [ -z $options ] ; then options="-O";fi
+../../bin/pyjsbuild --print-statements $options CSSMess
View
7 examples/cssmesser/public/CSSMess.css
@@ -0,0 +1,7 @@
+.teststyle {
+ font-size: 200%;
+ margin: 20px;
+ padding: 20px;
+ background-color: #00ff00;
+}
+
View
15 examples/cssmesser/public/CSSMess.html
@@ -0,0 +1,15 @@
+<html>
+ <!-- auto-generated html - you should consider editing and
+ adapting this to suit your requirements
+ -->
+ <head>
+ <meta name="pygwt:module" content="CSSMess">
+ <title>my titlePyJamas Auto-Generated HTML file CSSMess</title>
+ </head>
+ <body bgcolor="white">
+ <pre>
+ some text demonstrating static HTML here.
+ </pre>
+ <script language="javascript" src="bootstrap.js"></script>
+ </body>
+</html>

0 comments on commit 142d094

Please sign in to comment.
Something went wrong with that request. Please try again.