dojo.lfx.rounded

[Evrim ULU]

Hi,

I'm having little problem with magnificent dojo.lfx.rounded. In IE, i
get, invalid property value when dojo.lfx.rounded._fns.draw() is called
with third argument as "#NaNfbNan". I think somewhere in IE, the color
cannot be gathered and passed as NaN which is invalid.

Are there any fixes for this bug? I'm using daily svn.

thanks.
evrim.

Here is the CSS:
.header {  
    color:#FFFFFF;
    font-weight:bold;
    background-color:#031C3E;
    width: 100%;
    height: 60px;
    border:1px solid black;
}

Some HTML:
<div class="header" ../>

Backtrack:
        draw:function(x, y, color, opac, height, corner, image, radius, top, format){
                var px=document.createElement("div");
                px.style.height=height+"px"
                px.style.width="1px";
                px.style.position="absolute";
                px.style.fontSize="1px";
                px.style.overflow="hidden";
                if(image==-1 && format.bgImage!=""){
                        px.style.backgroundImage=format.bgImage;
                        px.style.backgroundPosition="-"+(format.width-(radius-x)+format.borderWidth) +"px-"+((format.height+top+y)-format.borderWidth)+"px";
                } else {
        px.style.backgroundColor=color;  <--- ***DEBUGGER enters here***
                }
                if(opac!=100){ dojo.html.setOpacity(px, (opac/100)); }
                px.style.top=y+"px";
                px.style.left=x+"px";
                corner.appendChild(px);
        },

_______________________________________________
Dojo FAQ: http://dojo.jot.com/FAQ
Dojo Book: http://manual.dojotoolkit.org/DojoDotBook
Dojo-interest@...
http://dojotoolkit.org/mailman/listinfo/dojo-interest

[Evrim ULU]

Evrim ULU wrote:

>Here is the CSS:
>.header {  
>    color:#FFFFFF;
>    font-weight:bold;
>    background-color:#031C3E;
>    width: 100%;
>    height: 60px;
>    border:1px solid black;
>}
>

replacing border statment with 1px solid #000000; did what it is
supposed to be.

thnx.evrim.

_______________________________________________
Dojo FAQ: http://dojo.jot.com/FAQ
Dojo Book: http://manual.dojotoolkit.org/DojoDotBook
Dojo-interest@...
http://dojotoolkit.org/mailman/listinfo/dojo-interest

[Jeremy Quinn]

Hi All

I tried using dojo.lfx.rounded on a div inside a dojo.widget.Dialog :

     rounded: { tl:{radius:15},tr:{radius:15},bl:{radius:15},br:
{radius:15} },

     fillInTemplate: function(args, frag) {
         dojo.html.hide(this.logInNode);
         dojo.html.hide(this.logOutNode);
         this.loginAuthDialogWidget =
             dojo.widget.createWidget("dojo:Dialog", { toggle:"fade",  
toggleDuration:250}, this.logInAuthDialogNode);
         dojo.lfx.rounded(this.rounded, "rounded");
         this.loginAuthDialogWidget.setCloseControl(dojo.byId
("userWidgetLoginAuthCancel"));
     },

The template :

<div class="userWidget" dojoAttachPoint="containerNode">
     <div class="login" dojoAttachPoint="logInNode" style="text-
align:right;"><span class="link" dojoOnClick="login"  
title="authenticate with your account">Login</span><br/><span  
class="name">you are not not logged in.</span></div>
     <div class="logout" dojoAttachPoint="logOutNode" style="text-
align:right;"><span class="link" dojoOnClick="logout"  
title="logout">Logout</span><br/><span class="name"  
dojoAttachPoint="logInNameNode"> </span></div>
     <div class="loginAuthDialog"  
dojoAttachPoint="logInAuthDialogNode" style="background:white;">
         <div style="background:white;padding:10px;border:2px solid  
black;" class="rounded">
             <p style="text-align:center;font-
weight:bold;">Authenticating</p>
             <p>Complete the authentication in this page, then click  
this OK button to continue.</p>
             <p style="text-align:center;">
                 <span dojoOnClick="loginStep2" title="I have  
authenticated" style="background:#aaa;padding:5px;">OK</span>
                  
                 <span id="userWidgetLoginAuthCancel" title="Cancel  
the login" style="background:#aaa;padding:5px;">Cancel</span>
             </p>
             <div dojoAttachPoint="logInAuthDialogNode"> </div>
         </div>
     </div>
</div>

What happens when I add the rounding using dojo.lfx.rounded
(this.rounded, "rounded"); is that all of the buttons in the dialog  
stop working.

This includes buttons that use @dojoOnClick and dialog.setCloseControl.

Is this a known issue, or an I doing something wrong ?

thanks for any suggestions

regards Jeremy

On 12 Jan 2007, at 18:53, Evrim ULU wrote:

> Evrim ULU wrote:
>
>> Here is the CSS:
>> .header {
>>    color:#FFFFFF;
>>    font-weight:bold;
>>    background-color:#031C3E;
>>    width: 100%;
>>    height: 60px;
>>    border:1px solid black;
>> }
>>
> replacing border statment with 1px solid #000000; did what it is
> supposed to be.
>
> thnx.evrim.
>
> _______________________________________________
> Dojo FAQ: http://dojo.jot.com/FAQ
> Dojo Book: http://manual.dojotoolkit.org/DojoDotBook
> Dojo-interest@...
> http://dojotoolkit.org/mailman/listinfo/dojo-interest

_______________________________________________
Dojo FAQ: http://dojo.jot.com/FAQ
Dojo Book: http://manual.dojotoolkit.org/DojoDotBook
Dojo-interest@...
http://dojotoolkit.org/mailman/listinfo/dojo-interest

[Tom Trenka]

It's a known issue; the port of the original I did uses innerHTML to move the contents of the original container into the auto-padded one.

trt

Jeremy Quinn wrote:

Hi All

I tried using dojo.lfx.rounded on a div inside a dojo.widget.Dialog :

     rounded: { tl:{radius:15},tr:{radius:15},bl:{radius:15},br:
{radius:15} },

     fillInTemplate: function(args, frag) {
         dojo.html.hide(this.logInNode);
         dojo.html.hide(this.logOutNode);
         this.loginAuthDialogWidget =
             dojo.widget.createWidget("dojo:Dialog", { toggle:"fade",  
toggleDuration:250}, this.logInAuthDialogNode);
         dojo.lfx.rounded(this.rounded, "rounded");
         this.loginAuthDialogWidget.setCloseControl(dojo.byId
("userWidgetLoginAuthCancel"));
     },

The template :

<div class="userWidget" dojoAttachPoint="containerNode">
     <div class="login" dojoAttachPoint="logInNode" style="text-
align:right;">Login<br/>you are not not logged in.</div>
     <div class="logout" dojoAttachPoint="logOutNode" style="text-
align:right;">Logout<br/> </div>
     <div class="loginAuthDialog"  
dojoAttachPoint="logInAuthDialogNode" style="background:white;">
         <div style="background:white;padding:10px;border:2px solid  
black;" class="rounded">
             <p style="text-align:center;font-
weight:bold;">Authenticating</p>
             <p>Complete the authentication in this page, then click  
this OK button to continue.</p>
             <p style="text-align:center;">
                 OK
                  
                 Cancel
             </p>
             <div dojoAttachPoint="logInAuthDialogNode"> </div>
         </div>
     </div>
</div>

What happens when I add the rounding using dojo.lfx.rounded
(this.rounded, "rounded"); is that all of the buttons in the dialog  
stop working.

This includes buttons that use @dojoOnClick and dialog.setCloseControl.

Is this a known issue, or an I doing something wrong ?

thanks for any suggestions

regards Jeremy

On 12 Jan 2007, at 18:53, Evrim ULU wrote:

> Evrim ULU wrote:
>
>> Here is the CSS:
>> .header {
>>    color:#FFFFFF;
>>    font-weight:bold;
>>    background-color:#031C3E;
>>    width: 100%;
>>    height: 60px;
>>    border:1px solid black;
>> }
>>
> replacing border statment with 1px solid #000000; did what it is
> supposed to be.
>
> thnx.evrim.
>
> _______________________________________________
> Dojo FAQ: http://dojo.jot.com/FAQ
> Dojo Book: http://manual.dojotoolkit.org/DojoDotBook
> [e-mail]
> http://dojotoolkit.org/mailman/listinfo/dojo-interest


 
_______________________________________________
Dojo FAQ: http://dojo.jot.com/FAQ
Dojo Book: http://manual.dojotoolkit.org/DojoDotBook
[e-mail]
http://dojotoolkit.org/mailman/listinfo/dojo-interest

[Jeremy Quinn]

Many thanks Tom,

Yes, I can confirm that if you turn off autopad :

rounded: { tl:{radius:15},tr:{radius:15},bl:{radius:15},br:{radius:
15}, autoPad:false }
. . .
dojo.lfx.rounded(this.rounded, "rounded");

I do not loose clicks in the content.

regards Jeremy

On 15 Jan 2007, at 18:59, Tom Trenka wrote:

>
> It's a known issue; the port of the original I did uses innerHTML  
> to move the
> contents of the original container into the auto-padded one.
>
> trt
>
>
> Jeremy Quinn wrote:
>>
>> Hi All
>>
>> I tried using dojo.lfx.rounded on a div inside a dojo.widget.Dialog :
>>
>>      rounded: { tl:{radius:15},tr:{radius:15},bl:{radius:15},br:
>> {radius:15} },
>>
>>      fillInTemplate: function(args, frag) {
>>          dojo.html.hide(this.logInNode);
>>          dojo.html.hide(this.logOutNode);
>>          this.loginAuthDialogWidget =
>>              dojo.widget.createWidget("dojo:Dialog", { toggle:"fade",
>> toggleDuration:250}, this.logInAuthDialogNode);
>>          dojo.lfx.rounded(this.rounded, "rounded");
>>          this.loginAuthDialogWidget.setCloseControl(dojo.byId
>> ("userWidgetLoginAuthCancel"));
>>      },
>>
>> The template :
>>
>> <div class="userWidget" dojoAttachPoint="containerNode">
>>      <div class="login" dojoAttachPoint="logInNode" style="text-
>> align:right;"><span class="link" dojoOnClick="login"
>> title="authenticate with your account">Login</span><br/><span
>> class="name">you are not not logged in.</span></div>
>>      <div class="logout" dojoAttachPoint="logOutNode" style="text-
>> align:right;"><span class="link" dojoOnClick="logout"
>> title="logout">Logout</span><br/><span class="name"
>> dojoAttachPoint="logInNameNode"> </span></div>
>>      <div class="loginAuthDialog"
>> dojoAttachPoint="logInAuthDialogNode" style="background:white;">
>>          <div style="background:white;padding:10px;border:2px solid
>> black;" class="rounded">
>>              <p style="text-align:center;font-
>> weight:bold;">Authenticating</p>
>>              <p>Complete the authentication in this page, then click
>> this OK button to continue.</p>
>>              <p style="text-align:center;">
>>                  <span dojoOnClick="loginStep2" title="I have
>> authenticated" style="background:#aaa;padding:5px;">OK</span>
>>                   
>>                  <span id="userWidgetLoginAuthCancel" title="Cancel
>> the login" style="background:#aaa;padding:5px;">Cancel</span>
>>              </p>
>>              <div dojoAttachPoint="logInAuthDialogNode"> </div>
>>          </div>
>>      </div>
>> </div>
>>
>> What happens when I add the rounding using dojo.lfx.rounded
>> (this.rounded, "rounded"); is that all of the buttons in the dialog
>> stop working.
>>
>> This includes buttons that use @dojoOnClick and  
>> dialog.setCloseControl.
>>
>> Is this a known issue, or an I doing something wrong ?
>>
>> thanks for any suggestions
>>
>> regards Jeremy
>>
>> On 12 Jan 2007, at 18:53, Evrim ULU wrote:
>>
>>> Evrim ULU wrote:
>>>
>>>> Here is the CSS:
>>>> .header {
>>>>    color:#FFFFFF;
>>>>    font-weight:bold;
>>>>    background-color:#031C3E;
>>>>    width: 100%;
>>>>    height: 60px;
>>>>    border:1px solid black;
>>>> }
>>>>
>>> replacing border statment with 1px solid #000000; did what it is
>>> supposed to be.
>>>
>>> thnx.evrim.
>>>
>>> _______________________________________________
>>> Dojo FAQ: http://dojo.jot.com/FAQ
>>> Dojo Book: http://manual.dojotoolkit.org/DojoDotBook
>>> Dojo-interest@...
>>> http://dojotoolkit.org/mailman/listinfo/dojo-interest
>>
>>
>>
>> _______________________________________________
>> Dojo FAQ: http://dojo.jot.com/FAQ
>> Dojo Book: http://manual.dojotoolkit.org/DojoDotBook
>> Dojo-interest@...
>> http://dojotoolkit.org/mailman/listinfo/dojo-interest
>>
>>
>
> --
> View this message in context: http://www.nabble.com/ 
> dojo.lfx.rounded-tf2967591.html#a8376420
> Sent from the Dojo mailing list archive at Nabble.com.
>
> _______________________________________________
> Dojo FAQ: http://dojo.jot.com/FAQ
> Dojo Book: http://manual.dojotoolkit.org/DojoDotBook
> Dojo-interest@...
> http://dojotoolkit.org/mailman/listinfo/dojo-interest

_______________________________________________
Dojo FAQ: http://dojo.jot.com/FAQ
Dojo Book: http://manual.dojotoolkit.org/DojoDotBook
Dojo-interest@...
http://dojotoolkit.org/mailman/listinfo/dojo-interest