Окно упакованного приложения Google Chrome

Я создаю упакованное приложение Chrome с двумя страницами [пока]. А под страницами подразумеваются фактические файлы .html. Один называется login.html, а другой — index.html.

Теперь все, что связано с пользователем, хранится в chrome.storage.local.

Вот код для запуска страниц в chrome.js.

chrome.app.runtime.onLaunched.addListener(function () {
    var dimensions = getDimensions(screen),
        positions = getPositions(screen);

    chrome.storage.local.get('login', function (result) {
        if(result.login.status === "loggedOut") {
            chrome.app.window.create('login.html', {
                id: 'loginWindow',
                'bounds': {
                    'width':    400,
                    'height':   600
                },
                minWidth: 400,
                minHeight: 600,
                maxWidth: 400,
                maxHeight: 600,
                frame: 'none'
            });
        } else {
            chrome.app.window.create('index.html', {
                id: 'mainWindow',
                'bounds': {
                    'top':      positions.top,
                    'left':     positions.left,
                    'width':    dimensions.width,
                    'height':   dimensions.height
                },
                minWidth: dimensions.width,
                minHeight: dimensions.height,
                maxWidth: dimensions.width,
                maxHeight: dimensions.height,
                frame: 'none'
            });
        }
    });
});

Теперь, поскольку chrome.storage.local.get login.status === loggedOut открывает страницу входа с формой входа. Итак, что мне делать, когда пользователь вводит правильные учетные данные. Как закрыть окно входа в систему, а затем открыть файл main. Приведенный выше код просто открывает index.html в следующий раз и больше не показывает логин.

Я сделал код для проверки учетных данных, и это работает, но теперь я хочу закрыть окно формы входа и открыть новый index.html с теми же границами, максимальной, минимальной шириной и высотой, как вы можете видеть в коде выше.

Вот что я ищу: [теперь это находится в файле login.js, который вызывается внутри файла login.html]

if(login === success) {
    // close login window and goto mainWindow
} else {
    // Username or password is wrong
}

Заранее спасибо!


person Miro Rauhala    schedule 29.05.2014    source источник


Ответы (2)


Для этого вам нужно добавить это, чтобы проверить, происходят ли изменения внутри chrome.storage.local.

chrome.storage.onChanged.addListener(function(changes, namespace) {
    chrome.storage.local.get('login', function (result) {
        if (result.login.status === "loggedIn") {
            chrome.app.window.get('loginWindow').close();
            chrome.app.window.create('index.html', {
                id: 'mainWindow',
                'bounds': {
                    'top':      positions.top,
                    'left':     positions.left,
                    'width':    dimensions.width,
                    'height':   dimensions.height
                },
                minWidth: dimensions.width,
                minHeight: dimensions.height,
                maxWidth: dimensions.width,
                maxHeight: dimensions.height,
                frame: 'none'
            });
        }
    });
});

Конечно, вы могли бы использовать эти изменения и пространства имен, но я решил их не учитывать.

person Miro Rauhala    schedule 29.05.2014

MiroRauhala ответил на ваш прямой вопрос, но, возможно, вам следует переосмыслить структуру своего приложения.

В приложениях Chrome нет навигации, как на обычном сайте. У них есть окна, и каждое окно соответствует отдельной HTML-странице. Вместо того, чтобы закрывать одно окно и открывать новое с точно такими же границами, вы можете просто иметь разные div в одном документе, которые вы можете скрывать и показывать по мере необходимости.

Я думаю, что изменение вашей структуры в конечном итоге приведет к более простому приложению.

Если вы выберете подход с отдельным окном, вам нужно быть осторожным. Например, если вы добавляете идентификатор в окно и указываете границы, границы применяются только при первом отображении. После этого он запоминает границы. Вы можете обойти это, сделав его скрытым, затем переместив его, а затем отобразив. Вы можете столкнуться с другими подобными вещами, поскольку используете платформу приложений Chrome не так, как она предназначена.

person Ben Wells    schedule 30.05.2014
comment
Этот переключатель окна применяется только при входе в систему, и после того, как пользователь вошел в систему, он может делать все в этом окне (остальное содержимое будет вызываться ajax). И это все еще пре-пре-пре-альфа-бета-не-стабильный выпуск, так что не волнуйтесь, я просто хотел узнать больше о Chrome SDK и поиграться. Я могу оставить это в будущем. Если у вас установлен Spotify, вы можете видеть, чего я пытаюсь достичь. - person Miro Rauhala; 30.05.2014