Intersoft Community - WebDesktop - Resize Iframe based on loaded page.

Resize Iframe based on loaded page.

yudi — Thu, 12 May 2016 09:40:32 GMT

Sorry for the delay in sending this.

Here is what I created based on your scenario: JavaScript function is be used to create and show WebDesktopWindow. The WebDesktopWindow will load an image and use iFrame as its ContentMode. The snippet is as follow:

function AddWindow()
{
    var dm = ISGetDesktopManager();
    var wnd = dm.GetWindow("wndAboutDM");

    if (wnd == null)
    {
        wnd = new WebDesktopWindow();
        wnd.Name = "wndHTMLPage";
        wnd.ContentURL = "../Images/coverflow_images/timesquare.jpg";
        wnd.ContentMode = "UseIFrame";
        wnd.AllowMinimize = "No";
        wnd.AllowMaximize = "No";

        dm.Windows.Add(wnd);
        wnd.Show();
    }
    else
    {
        wnd.Activate();
    }
}

Next, in order to get the dimension of the image (ContentURL of WebDesktopWindow), the image will be appended to a dummy element.

function ResizeWebDesktopWindow(imgSrc, wnd)
{
    var element = document.getElementById("dummyElement");
    var elem = document.createElement("img");

    elem.src = imgSrc;
    elem.setAttribute("style", "visibility: collapse;");
    elem.addEventListener('load', function ()
    {
        var imgWidth = this.naturalWidth;
        var imgHeight = this.naturalHeight;
        wnd.ResizeTo(imgWidth, imgHeight);
               
    });

    element.appendChild(elem);
}

As you may see, the WebDesktopWindow is now resized based on the size of its content. In this simple case, is an image. Call ResizeWebDesktopWindow function after invoking Show() method, so the AddWindow() function will look like below after modified:

function AddWindow()
{
    var dm = ISGetDesktopManager();
    var wnd = dm.GetWindow("wndAboutDM");

    if (wnd == null)
    {
        wnd = new WebDesktopWindow();
        wnd.Text = "HTML Page";
        wnd.Name = "wndHTMLPage";
        wnd.ControlBoxImage = "is_webdesktop-16.gif";
        wnd.ContentURL = "../Images/coverflow_images/timesquare.jpg";
        wnd.ContentMode = "UseIFrame";
        wnd.AllowMinimize = "No";
        wnd.AllowMaximize = "No";
               
        dm.Windows.Add(wnd);
        wnd.Show();
        ResizeWebDesktopWindow("http://mywebsite/Images/coverflow_images/timesquare.jpg", wnd)
    }
    else
    {
        wnd.Activate();
    }

}

Hope this helps.

Resize Iframe based on loaded page.

stevieg — Tue, 26 Apr 2016 12:19:10 GMT

No, I am trying to create a frame that wraps around the content page it is bringing in.

I cannot change the size of the content page that the frame is loading.

Resize Iframe based on loaded page.

erwinintersoft — Tue, 26 Apr 2016 02:27:09 GMT

Hello Steve,

Based on your explanation, are you trying to have a fluid behavior of the ClaimSearch.aspx so it always fills up the window? If so, may I suggest you to fix all of the ClaimSearch content to have width and height that is 100%? Hope this helps.

Best Regards,
Erwin Sanders

Resize Iframe based on loaded page.

stevieg — Fri, 22 Apr 2016 12:30:27 GMT

Thanks Yudi, But that is not what I am asking for.

Here is what I am trying to do:

I create a new IFrame window:
var wnd = dm.GetWindow("wndClaimSearch");
wnd = new WebDesktopWindow();
I set all the valid properties of the window: wnd = new WebDesktopWindow();
wnd.Text = "Claim Search";
wnd.Name = "wndClaimSearch";
wnd.TaskBarImage = "is_webdesktop-16.gif";
wnd.ControlBoxImage = "is_webdesktop-16.gif";
wnd.ContentURL = "ClaimSearch.aspx"; (Want to set iframe to this size)
wnd.ContentMode = "UseIFrame";
wnd.AllowMinimize = "Yes";
wnd.AllowMaximize = "No";
dm.Windows.Add(wnd);
Now I would like to Size or Resize the IFrame window to match the size of ClaimSearch.aspx

wnd.ResizeTo(width of ClaimSearch.aspx, height of ClaimSearch.aspx);

I do not want to set the size manually, I want it to look at the content page and adjust the IFrame to that size.

Thanks.

Resize Iframe based on loaded page.

yudi — Fri, 22 Apr 2016 08:57:36 GMT

I have a WebDesktop project and I am trying to figure out how to programmatically set the size of the Ifram that loads the aspx page.
...

Following snippet code shows how set the width of iframe element of WebDesktopWindow.

function Debug()
{
    var dm = ISGetObject("WebDesktopManager1");
    var wnd = dm.GetWindow("myWindow");

    if (wnd == null)
    {
        var wndIframeElement = wnd.GetWindowIFrameElement();

        wndIframeElement.style.width = "500px";
    }
}

This should helps.

Resize Iframe based on loaded page.

stevieg — Thu, 21 Apr 2016 15:34:46 GMT

I have a WebDesktop project and I am trying to figure out how to programmatically set the size of the Ifram that loads the aspx page.

I want to change the wnd.resize to something that will look at the size of the page it is loading and resize the iframe to that size

Her is my code to create and load the window:

if (wnd == null && shortcut.Name == "ClaimSearch") {

wnd = new WebDesktopWindow();

wnd.Text = "Claim Search";

wnd.Name = "wndClaimSearch";

wnd.TaskBarImage = "is_webdesktop-16.gif";

wnd.ControlBoxImage = "is_webdesktop-16.gif";

wnd.ContentURL = "ClaimSearch.aspx";

wnd.ContentMode = "UseIFrame";

wnd.AllowMinimize = "Yes";

wnd.AllowMaximize = "No";

dm.Windows.Add(wnd);

wnd.ResizeTo(830, 840);

wnd.Show();

wnd.MoveToCenterDesktop();

}

Thanks.