Good Design Examples?

96 views
Skip to first unread message

John Anderson

unread,
Sep 19, 2012, 1:44:12 AM9/19/12
to pyjs-...@googlegroups.com
I was wondering if anyone using pyjamas has a "modern" example they have built that has been reasonably styled?  Maybe an example using twitter's bootstrap?

I love the idea of pyjs but the examples are not very pretty and was just wondering if its possible to achieve a good looking application using it.

Thanks,
John

Pepe Aracil

unread,
Sep 19, 2012, 5:46:32 AM9/19/12
to pyjs-...@googlegroups.com
You can interact with any JS library in raw  mode (you need be careful on dicts and lists as JS function params) I had done this example calling directly to ExtJS functions:
Or you can write a more pythonic wrapper.

Bye.

Vsevolod Fedorov

unread,
Sep 19, 2012, 6:13:29 AM9/19/12
to pyjs-...@googlegroups.com
On 09/19/12 09:44, John Anderson wrote:
> I was wondering if anyone using pyjamas has a "modern" example they
> have built that has been reasonably styled? Maybe an example using
> twitter's bootstrap?
>
>
Lex Berezhny once posted snapshot of his application in this mailing
list. It looks really good.

snapshot:
https://pyjamas-dev.googlegroups.com/attach/3492aa351dda3c26/Screenshot-3.png?view=1&part=2
thread:
https://groups.google.com/forum/?fromgroups=#!searchin/pyjamas-dev/beautiful/pyjamas-dev/Z6RFoSclB7k/4Nh4TUgiG2IJ

Seva

Jim Washington

unread,
Sep 19, 2012, 7:42:58 AM9/19/12
to pyjs-...@googlegroups.com
Using stylesheets from popular js libraries like twitter's bootstrap or
jQuery can be done. The main idea is to use the style names they
provide, after including their stylesheet in the head of your base
HTML.

.addStyleName('somestyle')
.removeStyleName('somestyle')

Sometimes, the js libraries use some javascript background searching to
do styling at runtime, but that can be coded fairly easily. You may need
to read their code to get an idea of how it is done.

Most times, these js libraries will want you to use a fairly sparse HTML
so that things like <ul><li> may be styled appropriately. In that case,
you may need to make a custom widget set that conforms to the selectors
in the css file. Descend from Widget for single-element items, or from
ComplexPanel for multiple-element items to make your widgets, and borrow
as needed from the code of similar pyjs widgets to obtain any special
behavior you want. In general, you should not use pyjs's table-based
widgets like VerticalPanel and HorizontalPanel, due to table component
elements poisoning the css selectors.

Of course, adapting their style sheet to accommodate pyjs's element
structure and/or style names is another option.

-- Jim Washington



Reply all
Reply to author
Forward
0 new messages