PDA

View Full Version : hebrew in ext


elmo
17 Apr 2007, 5:29 AM
I am building a Hebrew page using Unicode encoding.
The problem is that the page direction is right-to-left ( <body dir="rtl"> ), and that completely disforms all the ext-elements such as dialog-boxes and menus, not just their texst alignment but also their appearance.
Since I am new to ext, I don't know where in these elements' code should I look for.
Can you show me the part of the code in, for example, a menu, that needs to be changed?
What is the general principles of converting these elements to work in a right-to-left page?
tryanDLS
17 Apr 2007, 6:58 AM
Take a look at this thread http://extjs.com/forum/showthread.php?t=4323 which outlines the steps to build a translation file.
elmo
17 Apr 2007, 7:44 AM
Thanks. Still, as far as I can see it doesn't help solving the basic problem of a rtl orientation (though it may be the place where one can put the code for that?)
etal
19 Apr 2007, 1:55 AM
I too am building a right-to-left hebrew unicode application but I'm having different results.
For me most things appear to be ok, there are some quirks with some of the elements , dragraggable stuff definitly misbehaves but i'd say 90% of the stuff works fine even when the page is defined as RTL.
elmo
21 Apr 2007, 1:05 PM
I am building a page using Ext.BorderLayout, based on the example of simple.html.
I add "direction:rtl" to .x-layout-panel on ext-all.css and it takes care of things like tabs and text direction.
But I have a problem with the regions titlebars: Their text is now on the right, but the tools (such as the collapse button) didn't switch to the left so they all mix with each other.
I tryed changing x-layout-panel-hd-tools to "left:0" instead of "right:0", but then the tools jump to the right of the screen. No matter what I did, I couldn't find a way of placing the text to the right of the toolbar, and the tools to the left! Is there a solution for this???
trbs
21 Apr 2007, 7:26 PM
maybe some working public example (in english?) of your problems will help u guys.

would make it easier for the ext team and contributors of the forum to see/understand and help solve any problems that ext may have with rtl pages.

just my $0.02
etal
22 Apr 2007, 12:48 AM
elmo: Try adding

.x-layout-tools-button{
float:left;
}
to the css, this solved the problem for me. The buttons now are not all the way over to the left but at least they clear the text and everything look ok.

trbs: I will try putting up a public example but it might take a while until I get round to it.
elmo
22 Apr 2007, 1:34 AM
Thanks for all the help! I solved the problems I had with the simple layout, toolbars and buttons - I will now continue looking for solutions for the more complex things, such as draggable objects etc.
for now I have created "ext-hebrew.css" which is loaded after "ext-all.css" and overrides specific parts of it:

.x-btn{
direction:rtl; /*new*/
}

.x-btn-text-icon .x-btn-center .x-btn-text{
direction:rtl; /*new*/
background-position: 100% 2px; /*was: 0 2px */
padding-right:18px; /*was: padding-left*/
padding-left:0; /*was: padding-right*/
}

.x-layout-panel{
direction:rtl; /*new*/
}

.x-layout-panel-hd-text{
width:100%; /*new*/
}

.x-layout-panel-hd-tools{
left:0; /*was: right*/
}

.x-layout-tools-button{
float:left; /*was: right */
}

I hope it helps. I would be happy to hear any more suggestions!
maya
23 Nov 2007, 2:27 AM
Hi Elmo,

I struggle with the same problem. When I try to expand the east region in a simple layout, the entire app. stops responding. Did it happen to you? if yes - how did you solve it?

In general - did you make additional css changes for Hebrew compatibility?

Thanks,
Maya