[rhmessaging-commits] rhmessaging commits: r3215 - mgmt/trunk/notes.
rhmessaging-commits at lists.jboss.org
rhmessaging-commits at lists.jboss.org
Thu Mar 26 10:32:55 EDT 2009
Author: eallen
Date: 2009-03-26 10:32:55 -0400 (Thu, 26 Mar 2009)
New Revision: 3215
Added:
mgmt/trunk/notes/fullpage widgets.txt
Log:
Notes on how to make a block of HTML full page.
Added: mgmt/trunk/notes/fullpage widgets.txt
===================================================================
--- mgmt/trunk/notes/fullpage widgets.txt (rev 0)
+++ mgmt/trunk/notes/fullpage widgets.txt 2009-03-26 14:32:55 UTC (rev 3215)
@@ -0,0 +1,53 @@
+How to implement a full page widget
+
+Any block of HTML can be made full page in cumin. By full page, I mean it can be displayed using most of the browser windows width and height.
+
+To do this, you need to add the class "fullpageable" to the block of HTML. If there is no surrounding block, you'll need to add one.
+For example, to make the following HTML fullpage-able:
+ <h2>This is a cool widget</h2>
+ {cool_widget}
+
+you'll need to surround the HTML with an element that has a class of "fullpageable" like this:
+ <div class="fullpageable">
+ <h2>This is a coll widget</h2>
+ {cool_widget}
+ </div>
+
+If the HTML already has a surrounding block, you can just add the "fullpageable" class:
+ <p class="explain">
+ {important_stuff}
+ </p>
+
+ can be made fullpageable like this:
+
+ <p class="explain fullpageable">
+ {important_stuff}
+ </p>
+
+How it looks:
+ A block of HTML that is fullpageable will have a special mouseover style.
+ When the mouse if over any part of the HTML, there will be a light purple bar at the top of the HTML with a
+ small icon in the upper right corner.
+ Clicking on the icon will display the HTML in a block that is about 95% of the page's width and height.
+ If the contents of the HTML automatically sizes to it's container, it should expand to the full page.
+
+ If however, the HTML is a fixed size, it won't expand. Instead, you may want to use the background
+ update ability of cumin to re-render the widget using it's new container size.
+
+Under the kimono:
+ When the page first loads, there is a script that runs and finds all elements containing the class "fullpageable".
+ It then surrounds each of those elements with some divs and wires in some mouseover and click behaviors.
+ When the fullpage icon is clicked, the handler will "promote" the fullpageable HTML to be a direct child
+ of the document.body. This allows the HTML to be positioned and sized to the full window. Clicking the
+ icon again will restore the HTML to it's original position in the DOM.
+
+ Additionally, when any block of HTML is made fullpage, the current background update url is modified to
+ indicate that cumin is in fullpage mode. This allows any widgets contained in the fullpaged HTML to modify
+ how they are rendered to take advantage of the extra screen space. During render, widgets can optionally call the
+ self.page.get_fullpage(session) method to determine if they should render normally, or full page.
+ If the return of self.page.get_fullpage(session) is not None, the widget can render full page.
+ The value returned by self.page.get_fullpage(session) is the new width the widget can occupy.
+
+
+
+
\ No newline at end of file
More information about the rhmessaging-commits
mailing list