OK, here we go:
the HTML snippet contains an example for a table with variable size,
in this case with three columns.
In the code you will find the headline with three entries (name,
shortname, type), followed by two scrollbars and the table grid
(client-area) with three filled rows and three empty rows. I'm only
interested in the headline and the table content...
<div id="table" style="border-style: solid; border-color: rgb(167,
166, 170) rgb(255, 255, 255) rgb(255, 255, 255) rgb(167, 166, 170);
border-width: 2px; overflow: hidden; position: absolute; background-
color: rgb(242, 242, 242); -moz-user-focus: normal; z-index: 300;
outline-color: -moz-use-text-color; outline-style: none; outline-
width: medium; -moz-border-top-colors: rgb(167, 166, 170) rgb(133,
135, 140); -moz-border-right-colors: rgb(255, 255, 255) rgb(220, 223,
228); -moz-border-bottom-colors: rgb(255, 255, 255) rgb(220, 223,
228); -moz-border-left-colors: rgb(167, 166, 170) rgb(133, 135, 140);
width: 1262px; height: 565px; left: 2px; top: 38px;">
<div style="position: absolute; outline-color: -moz-use-text-
color; outline-style: none; outline-width: medium; width: 1242px;
height: 18px; left: 0px; top: 0px;">
<div id="name" style="border-style: solid; border-color: rgb
(150, 146, 131); border-width: 0px 1px 2px 0px; overflow: hidden;
position: absolute; cursor: default; opacity: 1; background-color: rgb
(218, 218, 218); z-index: 301; outline-color: -moz-use-text-color;
outline-style: none; outline-width: medium; width: 622px; height:
18px; left: 0px;">
<div style="position: absolute; -moz-user-select: none;
white-space: nowrap; color: rgb(0, 0, 0); font-family: Tahoma; font-
size: 12px; outline-color: -moz-use-text-color; outline-style: none;
outline-width: medium; left: 2px; top: 1px;">Data</div>
<div style="position: absolute; -moz-user-select: none;
outline-color: -moz-use-text-color; outline-style: none; outline-
width: medium; left: 77px; top: 3px;">
<img height="10" width="10" style="border: 0pt none ;
vertical-align: top;" alt="" title="" src="resource/themes/Custom_1/
widgets/table.column.sort.up"/>
</div>
</div>
<div id="shortname" style="border-style: solid; border-color:
rgb(150, 146, 131); border-width: 0px 1px 2px 0px; overflow: hidden;
position: absolute; cursor: default; opacity: 1; background-color: rgb
(218, 218, 218); z-index: 301; outline-color: -moz-use-text-color;
outline-style: none; outline-width: medium; width: 372px; height:
18px; left: 622px;">
<div style="position: absolute; -moz-user-select: none;
white-space: nowrap; color: rgb(0, 0, 0); font-family: Tahoma; font-
size: 12px; outline-color: -moz-use-text-color; outline-style: none;
outline-width: medium; left: 2px; top: 1px;">Bezeichnung</div>
<div style="position: absolute; -moz-user-select: none;
outline-color: -moz-use-text-color; outline-style: none; outline-
width: medium; left: 96px; top: 8px;">
<img height="0" width="0" style="border: 0pt none ;
vertical-align: top;" alt="" title="" src="./resource/static/image/
blank.gif"/>
</div>
</div>
<div id="type" style="border-style: solid; border-color: rgb
(150, 146, 131); border-width: 0px 1px 2px 0px; overflow: hidden;
position: absolute; cursor: default; opacity: 1; background-color: rgb
(218, 218, 218); z-index: 301; outline-color: -moz-use-text-color;
outline-style: none; outline-width: medium; width: 248px; height:
18px; left: 994px;">
<div style="position: absolute; -moz-user-select: none;
white-space: nowrap; color: rgb(0, 0, 0); font-family: Tahoma; font-
size: 12px; outline-color: -moz-use-text-color; outline-style: none;
outline-width: medium; left: 2px; top: 1px;">Typ</div>
<div style="position: absolute; -moz-user-select: none;
outline-color: -moz-use-text-color; outline-style: none; outline-
width: medium; left: 25px; top: 8px;">
<img height="0" width="0" style="border: 0pt none ;
vertical-align: top;" alt="" title="" src="./resource/static/image/
blank.gif"/>
</div>
</div>
</div>
<div style="position: absolute; outline-color: -moz-use-text-
color; outline-style: none; outline-width: medium; width: 1242px;
height: 16px; left: 0px; top: 545px;">
<div style="overflow-x: scroll; overflow-y: hidden; outline-
color: -moz-use-text-color; outline-style: none; outline-width:
medium; width: 1242px; height: 16px;">
<div style="outline-color: -moz-use-text-color; outline-
style: none; outline-width: medium; width: 1242px; height: 5px;"/>
</div>
</div>
<div style="position: absolute; outline-color: -moz-use-text-
color; outline-style: none; outline-width: medium; width: 16px;
height: 527px; left: 1242px; top: 18px;">
<div style="overflow-x: hidden; overflow-y: scroll; outline-
color: -moz-use-text-color; outline-style: none; outline-width:
medium; width: 16px; height: 527px;">
<div style="outline-color: -moz-use-text-color; outline-
style: none; outline-width: medium; width: 5px; height: 216px;"/>
</div>
</div>
<div id="client-area" style="overflow: hidden; position: absolute;
outline-color: -moz-use-text-color; outline-style: none; outline-
width: medium; width: 1242px; height: 527px; left: 0px; top: 18px;">
<div style="border-style: solid; border-color: rgb(232, 232,
232); border-width: 0px 0px 1px; position: absolute; cursor: default;
color: rgb(0, 0, 0); background-color: rgb(242, 242, 242); -moz-user-
select: none; font-family: Tahoma; font-size: 12px; width: 1242px;
height: 18px; left: 0px; top: 0px;">
<div style="overflow: hidden; position: absolute; vertical-
align: middle; white-space: nowrap; padding-left: 2px; top: 0px; left:
-1px; width: 620px; height: 18px; text-align: left;">Bildsystem</div>
<div style="border-left: 1px solid rgb(208, 208, 208);
overflow: hidden; position: absolute; vertical-align: middle; white-
space: nowrap; padding-left: 2px; top: 0px; left: 621px; width: 370px;
height: 18px; text-align: left;">Bildsystem</div>
<div style="border-left: 1px solid rgb(208, 208, 208);
overflow: hidden; position: absolute; vertical-align: middle; white-
space: nowrap; padding-left: 2px; top: 0px; left: 993px; width: 246px;
height: 18px; text-align: left;">Bildserver</div>
</div>
<div style="border-style: solid; border-color: rgb(232, 232,
232); border-width: 0px 0px 1px; position: absolute; cursor: default;
color: rgb(0, 0, 0); background-color: rgb(242, 242, 242); -moz-user-
select: none; font-family: Tahoma; font-size: 12px; width: 1242px;
height: 18px; left: 0px; top: 18px;">
<div style="overflow: hidden; position: absolute; vertical-
align: middle; white-space: nowrap; padding-left: 2px; top: 0px; left:
-1px; width: 620px; height: 18px; text-align: left;">Partner</div>
<div style="border-left: 1px solid rgb(208, 208, 208);
overflow: hidden; position: absolute; vertical-align: middle; white-
space: nowrap; padding-left: 2px; top: 0px; left: 621px; width: 370px;
height: 18px; text-align: left;">Partner</div>
<div style="border-left: 1px solid rgb(208, 208, 208);
overflow: hidden; position: absolute; vertical-align: middle; white-
space: nowrap; padding-left: 2px; top: 0px; left: 993px; width: 246px;
height: 18px; text-align: left;">Bestandssystem</div>
</div>
<div style="border-style: solid; border-color: rgb(232, 232,
232); border-width: 0px 0px 1px; position: absolute; cursor: default;
color: rgb(0, 0, 0); background-color: rgb(242, 242, 242); -moz-user-
select: none; font-family: Tahoma; font-size: 12px; width: 1242px;
height: 18px; left: 0px; top: 36px;">
<div style="overflow: hidden; position: absolute; vertical-
align: middle; white-space: nowrap; padding-left: 2px; top: 0px; left:
-1px; width: 620px; height: 18px; text-align: left;">MS</div>
<div style="border-left: 1px solid rgb(208, 208, 208);
overflow: hidden; position: absolute; vertical-align: middle; white-
space: nowrap; padding-left: 2px; top: 0px; left: 621px; width: 370px;
height: 18px; text-align: left;">MS</div>
<div style="border-left: 1px solid rgb(208, 208, 208);
overflow: hidden; position: absolute; vertical-align: middle; white-
space: nowrap; padding-left: 2px; top: 0px; left: 993px; width: 246px;
height: 18px; text-align: left;">MS</div>
</div>
<div style="border-style: solid; border-color: rgb(232, 232,
232); border-width: 0px 0px 1px; position: absolute; cursor: default;
color: rgb(0, 0, 0); background-color: rgb(242, 242, 242); -moz-user-
select: none; font-family: Tahoma; font-size: 12px; width: 1242px;
height: 18px; left: 0px; top: 198px;"/>
<div style="border-style: solid; border-color: rgb(232, 232,
232); border-width: 0px 0px 1px; position: absolute; cursor: default;
color: rgb(0, 0, 0); background-color: rgb(242, 242, 242); -moz-user-
select: none; font-family: Tahoma; font-size: 12px; width: 1242px;
height: 18px; left: 0px; top: 270px;"/>
<div style="border-style: solid; border-color: rgb(232, 232,
232); border-width: 0px 0px 1px; position: absolute; cursor: default;
color: rgb(0, 0, 0); background-color: rgb(242, 242, 242); -moz-user-
select: none; font-family: Tahoma; font-size: 12px; width: 1242px;
height: 18px; left: 0px; top: 288px;"/>
</div>
</div>
On 28 Aug., 16:20, Jian Fang <[email protected]> wrote:
> Hi Peter,
>
> Maybe I did not understand your question clearly. Could you show me some
> html source
> to help me to understand your question?
>
> Thanks,
>
> Jian
>
> On Fri, Aug 28, 2009 at 10:14 AM, Peter <[email protected]> wrote:
>
> > Hi Jian,
>
> > thank you for your quick answer!
>
> > No, Trump is not the problem... The problem is that I have to write my
> > own UI object, which can be used to define a UI template.
> > I know only three Tellurium objects that can define templates,
> > "StandardTable", "Table" and "List", and all these objects are not
> > suitable for the table mentioned above. Or did I get it completely
> > wrong?
>
> > So I need some hints how to write a new UI object and how to
> > incorporate it into tellurium...
>
> > Thanks!
> > Peter
>
> > On 28 Aug., 15:32, John <[email protected]> wrote:
> > > Hi Peter,
>
> > > You are talking about the UI modules generated by Trump, right?
> > > Trump 0.1.0 does not support UI module yet because it requires
> > > an inference engine. We have the plan to add the engine to Trump, but
> > > because of limited resources and time, we haven't worked on that
> > > yet. Most likely, that will be included in Trump 0.3.0.
>
> > > For the time being, please manually create the UI templates, which
> > > is really simple for web developers. More guides could be found here
>
> > >http://code.google.com/p/aost/wiki/UserGuide?tm=6#UI_Templates
>
> > > Thanks,
>
> > > Jian
>
> > > On Aug 28, 9:19 am, Peter <[email protected]> wrote:
>
> > > > Hi all,
>
> > > > has anybody an idea how to handle a dynamic table that uses HTML divs
> > > > to render its cells?
>
> > > > E.g. if the the table has <m> rows and <n> columns, the UI module
> > > > could look like this:
>
> > > > Container(uid: "Table", clocator: [tag: "div", id: "table"], group:
> > > > "true")
> > > > {
> > > > Container(uid: "Header", clocator: [tag: "div", direct: "true"])
> > > > {
> > > > Div(uid: "Head1", clocator: [tag: "div", direct: "true", id:
> > > > "name"])
> > > > Div(uid: "Head2", clocator: [tag: "div", direct: "true", id:
> > > > "shortname"])
> > > > Div(uid: "Head3", clocator: [tag: "div", direct: "true", id:
> > > > "type"])
> > > > ...
> > > > Div(uid: "Head<n>", clocator: [tag: "div", direct: "true", id:
> > > > "type"])
> > > > }
> > > > Container(uid: "Content", clocator: [tag: "div", id: "client-
> > > > area", direct: "true"])
> > > > {
> > > > Container(uid: "Row1", clocator: [tag: "div", direct: "true",
> > > > position: "1"])
> > > > {
> > > > Div(uid: "Value1", clocator: [tag: "div", position: "1",
> > > > direct: "true"])
> > > > Div(uid: "Value2", clocator: [tag: "div", position: "2",
> > > > direct: "true"])
> > > > Div(uid: "Value3", clocator: [tag: "div", position: "3",
> > > > direct: "true"])
> > > > ...
> > > > Div(uid: "Value<n>", clocator: [tag: "div", position:
> > > > "<n>", direct: "true"])
> > > > }
>
> > > > Container(uid: "Row2", clocator: [tag: "div", direct: "true",
> > > > position: "2"])
> > > > {
> > > > Div(uid: "Value1", clocator: [tag: "div", position: "1",
> > > > direct: "true"])
> > > > Div(uid: "Value2", clocator: [tag: "div", position: "2",
> > > > direct: "true"])
> > > > Div(uid: "Value3", clocator: [tag: "div", position: "3",
> > > > direct: "true"])
> > > > ...
> > > > Div(uid: "Value<n>", clocator: [tag: "div", position:
> > > > "<n>", direct: "true"])
> > > > }
> > > > ...
> > > > Container(uid: "Row<m>", clocator: [tag: "div", direct:
> > > > "true", position: "<m>"])
> > > > {
> > > > Div(uid: "Value1", clocator: [tag: "div", position: "1",
> > > > direct: "true"])
> > > > Div(uid: "Value2", clocator: [tag: "div", position: "2",
> > > > direct: "true"])
> > > > Div(uid: "Value3", clocator: [tag: "div", position: "3",
> > > > direct: "true"])
> > > > ...
> > > > Div(uid: "Value<n>", clocator: [tag: "div", position:
> > > > "<n>", direct: "true"])
> > > > }
> > > > }
>
> > > > }
>
> > > > But how to handle tables with variable size? The predefined UI Object
> > > > "Table" is not able to handle such special tables. So I have to create
> > > > a UI template, which can handle such tables in an easy way, e.g. with
> > > > the same methods like "Table" and the same way to access table
> > > > elements via indices.
>
> > > > Is anybody out there who already did such a job or who can give me
> > > > some advice?
>
> > > > Thanks in advance & best regards!
> > > > Peter
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"tellurium-users" group.
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to
[email protected]
For more options, visit this group at
http://groups.google.com/group/tellurium-users?hl=en
-~----------~----~----~----~------~----~------~--~---
