Create Window

Get help with using Metro 4 components
Post Reply
brunogz
Posts: 13
Joined: Wed Oct 10, 2018 11:20 pm
Status: Offline

Create Window

Post by brunogz » Mon Oct 15, 2018 11:52 pm

Let's see if I can explain ...
I have a main page (index) and from it I created a window with an iFrame containing a second page.
Now, on the second page, I need to create a new window, calling a new page.

However, the div

Code: Select all

<div class = "desktop bg-grayWhite">
     <div class = "window-area"> </ div>
</ div>
is on the main page.

So when I try to call the function I get an error.
Any suggestion? Did I get it right?

Code: Select all

var DesktopModal = {
    options: {
        windowArea: ".window-area",
        windowAreaClass: "",
        taskBar: ".task-bar > .tasks",
        taskBarClass: ""
    },

    wins: {},

    setup: function(options){
        this.options = $.extend( {}, this.options, options );
        return this;
    },

    addToTaskBar: function(wnd){
        var icon = wnd.getIcon();
        var wID = wnd.win.attr("id");
        var item = $("<span>").addClass("task-bar-item started").html(icon);

        item.data("wID", wID);

        item.appendTo($(this.options.taskBar));
    },

    removeFromTaskBar: function(wnd){
        console.log(wnd);
        var wID = wnd.attr("id");
        var items = $(".task-bar-item");
        var that = this;
        $.each(items, function(){
            var item = $(this);
            if (item.data("wID") === wID) {
                delete that.wins[wID];
                item.remove();
            }
        })
    },

    createWindow: function(o){
        var that = this;

        o.onDragStart = function(pos, el){
            win = $(el);
            $(".window").css("z-index", 1);
            if (!win.hasClass("modal"))
                win.css("z-index", 3);
        };

        o.onDragStop = function(pos, el){
            win = $(el);
            if (!win.hasClass("modal"))
                win.css("z-index", 2);
        };

        o.onWindowDestroy = function(win){
            console.log(win);
            that.removeFromTaskBar(win);
        };

        var w = $("<div>").appendTo($(this.options.windowArea));
        var wnd = w.window(o).data("window");
        var win = wnd.win;
        var shift = Metro.utils.objectLength(this.wins) * 16;

        if (wnd.options.place === "auto" && wnd.options.top === "auto" && wnd.options.left === "auto") {
            win.css({
                top: shift,
                left: shift
            });
        }

        this.wins[win.attr("id")] = wnd;
        this.addToTaskBar(wnd);
        w.remove();
    }
};

DesktopModal.setup();

Post Reply