Resizing Gadgets using the Larger Size/Smaller Size Button


  1. Posts : 5
    W7 Enterprise x64
       #1

    Resizing Gadgets using the Larger Size/Smaller Size Button


    I'm wanting to resize my gadget I developed with the Larger Size/Smaller button. Currently, I have two separate main gadget html files. The only difference between them is the background image, size, and the orientation of the icons.

    I noticed other built-in gadgets like Weather and CPU meter have this option, but I do not know how to adapt that to my gadget

    I attached screen shots of my gadget (both have the flyout showing) so you can see the size difference.
    Attached Thumbnails Attached Thumbnails Resizing Gadgets using the Larger Size/Smaller Size Button-largetsizebutton.png   Resizing Gadgets using the Larger Size/Smaller Size Button-imonscreenshot.png   Resizing Gadgets using the Larger Size/Smaller Size Button-bigimonscreenshot.png  
      My Computer


  2. Posts : 18,404
    Windows 7 Ultimate x64 SP1
       #2

    Referring to the docked and floating states?

    This might give you some idea to start with.

    System.Gadget.onDock Event (Windows)
    System.Gadget.onUndock Event (Windows)
    System.Gadget Object (Windows)
      My Computer


  3. Posts : 5
    W7 Enterprise x64
    Thread Starter
       #3

    Code:
    $(document).ready(function(){
     System.Gadget.onUndock = checkState;
     System.Gadget.onDock = checkState;
     checkState();
    });
    I have this in my js file to execute when the gadget opens, but I'm not sure this is working.

    Code:
    function checkState(){
     if (!System.Gadget.docked){ 
     
      with (document.body.style)
     {
      width = "200px";
      height = "255px";
     }
     background.style.width = "200px";
     background.style.height = "255px";
     background.src = "url(img/iMonBackground200.png.png)";
     }
     
     else if(System.Gadget.docked){
      with (document.body.style)
     {
      width = "130px";
      height = "166px";
     }
     background.style.width = "130px";
     background.style.height = "166px";
     background.src = "url(img/iMonBG.png)";
     }
    }

    This is the rest of the code in my js file. What do I need to do in my HTML file? Do I need to get rid of the background path and let the js file assign it?


    EDIT: It is working now, I had the line

    Code:
    System.Gadget.visibilityChanged = checkVisibility;
    but no function associated with it. Got rid of the line, and it works!
      My Computer


 

  Related Discussions
Our Sites
Site Links
About Us
Windows 7 Forums is an independent web site and has not been authorized, sponsored, or otherwise approved by Microsoft Corporation. "Windows 7" and related materials are trademarks of Microsoft Corp.

© Designer Media Ltd
All times are GMT -5. The time now is 02:59.
Find Us