albidochon

hi everybody,

I have some problems whith te size of the gadgets....when i make a test on the http://test.livegadgets.net/ platform, everythingh is ok with the size, the gadget is full screened showed. But when the gadget is approuved, and is loaded in my space for a real test, it sometimes sized ok, and sometimes cut so the height is truncated. In the js file, i've tried the real size in pixels and the relative size in 100%, but somethingh i miss i'm sure......

so, does that fonctiun clear the problem for the resizing of the gadget, and permit not to be truncated

m_module.resize();
if (window.parent != window.self) {
document.body.style.backgroundColor = "transparent";
}

thankyou for helping me, but foot by foot it goes better with the js file and the dom document's creation

thank to toddos for all

bidochon



Re: Web Gadget Development resize the gadgets by default

Shawn Clark - MSFT

What browser/os combination are you using I have seen some intermittent issues with IE7 and I know the dev team is also aware of the issue.

That code you have added has nothing to do with your resizing issues.

What I have done to combat this is to create a div inside of the gadget that I use as a container for everything else. You will have more control of the height of that div than you will of the gadget container. The gadget should do a better job of wrapping itself around your content. I believe a height of between 240px and 250px is a good size for Spaces gadgets as it will not force any gadgets below your gadget to jump down into the next row, depending on the user's layout of course. I would start there.





Re: Web Gadget Development resize the gadgets by default

Rodcet

If you are calling a webservice.. that fires off asynch..

So if you depend on that to create the content for your gadget you might need to move the resize command into the end of the callback procedure of the service..

But it's hard to guess without a link to your .js code. .





Re: Web Gadget Development resize the gadgets by default

ToddOs

In theory, you shouldn't need the resize() command at all. That's just a hint to the framework to manually look for any size changes in the embedded iframe and adjust the frame size appropriately. The framework should already that itself when it can (IE6/7), and will ignore it when it can't (Firefox, Opera), so calling it yourself is really just a placebo affect 9 times out of 10. It makes you feel good, like you proactively did something about your resizing gadget, but in actuality the frame was probably already correct sized well before you made the call to resize() (and if not, it would be correctly sized soon anyway).



Re: Web Gadget Development resize the gadgets by default

Rodcet

In theory, you're right. The issue comes in where IE resizes itself, then the callback from the WebService finishes processing after the main routine completes. The callback then finishes and expands or shrinks in some cases, the iframe. The sizing then becomes off and calling the .resize at the end of the callback method fixes it, It's repeatable and reproduceable everytime without failure (if there is a delay in the processing of the information from the webservice).





Re: Web Gadget Development resize the gadgets by default

Ben Walters - MSFT

We're seeing some gadgets resize incorrectly in IE6 in Spaces (the size change events don't always fire, so the resize logic never runs). Calling module.resize() explicitly after you draw content will now actually resize the frame in some cases where we lose that event. You should see a real change in behavior in those cases.





Re: Web Gadget Development resize the gadgets by default

Rodcet

Ben,

Can you explain why the behavior is different in live.com vs Spaces when calling the "resize" method.

In live.com it really resizes the iframe.. (Like it should).

In Spaces.. It resizes it right (Vertically), but it messes up the horizontal resizing of the gadget.. If you call the resize event over and over it will eventually shrink the horizontal width of the iframe to nothing (depending on the content in the gadget).

This is with IE 7..

This is how I test the behavior, I create a gadget in spaces.. and add a button to the form.. then on the onClick event, all I do is call the resize event.. everytime I click the button the gadget iframe width shrinks by around 5 pixels.

On live.com it just adjusts the screen (like it should).





Re: Web Gadget Development resize the gadgets by default

Rodcet

Just to give you a little more information Ben..

The p_elSource.clientWidth and the p_elSource.scrollWidth is reduced by 5 pixels when the onClick event fires of a button.

Then when I call the resize method it resizes, it to the clientWidth and clientHeight, correctly.

So in theory, the resize logic seems correct. The issue seems to be that when the event is fired clientWidth is reduced.

This is a spaces.live.com behavor (Only).

m_ResizeButton = document.createElement("input");

m_ResizeButton.type = "button"

m_ResizeButton.id = "Resize";

m_ResizeButton.value = "Resize"

m_ResizeButton.style.fontFamily ="Verdana"

m_ResizeButton.attachEvent("onclick", OnResizeClick);

p_elSource.appendChild(m_ResizeButton);

function OnResizeClick(e)

{

p_args.module.resize();

}





Re: Web Gadget Development resize the gadgets by default

Rodcet

Sorry about the spam,

But I figured out a solution to the issue above and I have more detail to provide about what causes it.

When a gadget is rendered, lets say the width is 284 pixels.. After it's rendered it "mysteriously" becomes 279px. Then you run a resize on it and adjust it accordingly to 279px.. therefore losing 5 pixels in width.

If you set the

p_elSource.style.width = '100%' this will initally set the clientWidth to 284px .. Then when it rendered and when you resized it.. 279px becomes the new 100%.

Now by setting the

p_elSource.style.width = p_elSource.scrollWidth;

After some content is created in your routines, It will set a hard pixel size of 284px, then when it's resized again.. it keeps the width the hard pixel size.





Re: Web Gadget Development resize the gadgets by default

albidochon

hi everybody,

my God, i'm french and the explanations are really difficult to translate for me, even if i use a dictionnary........tehcnicals words and usual frendly expressions are not my cup of tea.....

What I'm sure, is that sometimes, my gadget is full sized, correctly, and sometimes truncated, and it is just an oject/embed code, in the p_elSource.innerHTML .

so so

thank's a lot to all of you

bidochon





Re: Web Gadget Development resize the gadgets by default

daniele bonini

http://forums.microsoft.com/MSDN/ShowPost.aspx PostID=1175663 to add something to this thread




Re: Web Gadget Development resize the gadgets by default

OEIL2MOSCOU

Hello , Albidochon !

Also , i am french  and i think  there is a problem  in the display  of the gadgets in the spaces ; But  i know your gadget  and  your gadget code , and when you use  the test URL  (http://test.livegadgets.net ) , you test  in live com and not in the space !

Because  you have not  the good code  :author mode  and view mode  , in your JS file ;

Since  you use flash code , it is necessary to center   with  "div align=center" ; and not use "width=100%" : to use  the width of your display gadget (eg: 284 px ) ; more little that the frame window in the space !

This code in your JS file :

if (window.parent != window.self) {
            document.body.style.backgroundColor = "transparent";
        }

And in the side of your Flash code  : wmode= "transparent"

                                                   or      :allowtransparency="true"         (to try the both  ) 

A+++++@@@ ON the French forum : http://franc83.free.fr 






Re: Web Gadget Development resize the gadgets by default

nguyentanbao

I also suffered from the resizing. Not sure anybody has tried with this. I just came up with a 1 cent tip:

If you want to use 100% width, you can do like this:

var myDiv = p_leSource.appendChild(document.createElement("div"));

myDiv.style.width = p_elSource.clientWidth + "px";

p_args.module.resize();

However, there's one more issue, if myDiv has border, you have to substract the width of the border. Let's say, myDiv has left and right border with border-width is 2px each. We need to modify the red line a little bit:

myDiv.style.width = p_elSource.clientWidth - 4 + "px"; // 4 = 2 border * 2px each

The size, in general, in Firefox is so mess, I haven't got any idea yet. Scrollbars are always on and the height I cannot control. If anybody has some tip work with HEIGHT in Firefox, please share.

Hope that helps!






Re: Web Gadget Development resize the gadgets by default

ToddOs

Firefox shows the scrollbars because it doesn't interact with iframes like IE -- currently there's no way for Firefox to know that the inner contents of the iframe have changed so that the iframe can resize itself. There's nothing you can do about this.

As for width, I've found that if I don't specify a width at all, divs will use all available width without problems (as good block elements should). Now if you're floating bits or inlining elements, you'll have to set widths appropriately. Otherwise I'd rely on the correct behavior of block-displayed elements to Do the Right Thing(tm).





Re: Web Gadget Development resize the gadgets by default

nguyentanbao

Thanks ToddOs

I also did like that before, not specify the width, the p_elSource itself works fine.

However, there's situation you need to specify the width: like I want to have a box with border, occupies 100% the width of the gadget. Without setting width, I don't know how to do that. But if I set 100%, there's some messes in rendering.