Очень часто в приложении необходимо передать данные, введенные пользователем, из одной формы в другую. В Palm WebOS для этих целей можно использовать Cookies. API для использования Cookies довольно прозрачно, как и многие другие вещи в WebOS, не требует особых умений.

В этот раз мы рассмотрим пример того, как различные сцены могут обмениваться данными.

Для начала создадим новое приложение, в нем новую сцену с названием Main и еще одну с названием Second. Как создать проект и сцену можно узнать из этой статьи.

Напишем HTML-шаблоны сцен:

views/main/main-scene.html

<div id="main" class="palm-hasheader">
<div class="palm-header">Main</div>
<div id="SecondSceneButton" x-mojo-element="Button"></div>
<div id="ExitButton" x-mojo-element="Button"></div>
<div id="counter" class="palm-body-text"></div>
</div>

views/second/second-scene.html

<div id="main" class="palm-hasheader">
     <div class="palm-header">Second Scene</div>
     <div id="CloseButton" x-mojo-element="Button"></div>
     <div id="valuetext" class="palm-body-text">Unknown value</div>
</div>

Главная сцена состоит из контейнера с заголовком, двух кнопок и текстового поля.
Вторая сцена состоит из контейнера с заголовком, кнопки и текстового поля.
Ничего сверхъестественного. 🙂

Перед тем, как написать логику, стоит ознакомиться со схемой, описывающей жизненный цикл сцены:

WebOS Scene Lifecycle

Из схемы можно узнать, что первым делом вызывается конструктор сцены, затем метод setup(), а когда сцена загрузилась, вызывается метод activate(). Также activate() вызывается при каждом появлении сцены на экране.

Что это нам даст? Посмотрим на пример кода ниже:

MainAssistant.prototype.setup = function() {
  this.controller.setupWidget("SecondSceneButton",
    {}, {label:"Second Scene"});
  this.controller.setupWidget("ExitButton",
    {}, {label:"Exit"});

  Mojo.Event.listen(this.controller.get("SecondSceneButton"),
    Mojo.Event.tap,
    this.handleSecondSceneButton.bind(this));
  Mojo.Event.listen(this.controller.get("ExitButton"),
    Mojo.Event.tap,
    this.handleExitButton.bind(this));

  this.counter = 0;
  this.counterCookie = new Mojo.Model.Cookie("counterCookie");
  this.counterCookie.put(this.counter);
}

MainAssistant.prototype.activate = function(event) {
  this.counter = this.counterCookie.get();
  this.controller.get("counter").update(this.counter);
}

MainAssistant.prototype.cleanup = function(event) {
  this.counterCookie.remove();
}

В методе setup() мы создали переменную counter, поместили ее в Cookie с названием counterCookie, а в методе activate() мы берем значение из Cookie и отображаем в текстовом поле. И каждый раз, когда форма будет активизироваться, в текстовом поле будет появляться актуальное значение из Cookie.
Метод cleanup() вызывается в конце жизненного цикла сцены и в нем мы удаляем созданную Cookie.

Теперь напишем обработчик нажатия кнопки SecondSceneButton:

MainAssistant.prototype.handleSecondSceneButton = function(event) {
  this.counter++;
  this.counterCookie.put(this.counter);
  this.controller.stageController.pushScene("second", 1);
}

В обработчике мы прибавляем единицу к переменной counter, записываем ее значение в Cookie и отображаем сцену Second.

Дальше нам необходимо получить значение в сцене Second и как-то там поиспользовать.

function SecondAssistant() {
}

SecondAssistant.prototype.setup = function() {
  this.controller.setupWidget("CloseButton",
    {}, {label:"Close"});

  Mojo.Event.listen(this.controller.get("CloseButton"),
    Mojo.Event.tap,
    this.handleCloseButton.bind(this));
  this.counterCookie = new Mojo.Model.Cookie("counterCookie");
  this.controller.get("valuetext").update(this.counterCookie.get());
}

SecondAssistant.prototype.handleCloseButton = function(event) {
  var value = this.counterCookie.get();
  value++;
  this.counterCookie.put(value);
  this.controller.stageController.popScene();
}

В методе setup() сцены мы создаем объект Cookie, получаем сохраненное значение и отображаем его в текстовом поле.

В обработчике нажатия кнопки мы берем значение Cookie, прибавляем к нему единицу и записываем обратно в Cookie. Затем закрываем сцену.

После закрытия сцены Second будет отображена главная сцена Main и при активации вызовется метод activate(), в котором измененное значение снова появится в текстовом поле.

После всего наше приложение будет выглядеть так:

WebOS Cookies Test GUI

Скачать исходный код примера.

Previous ArticleNext Article
Технический директор IT-Dimension, компании-разработчика кросс-платформенного программного обеспечения

Leave a Reply

Your email address will not be published. Required fields are marked *

К.

Как сделать телефонный звонок из приложения в Palm WebOS

Для того чтобы сделать телефонный звонок из приложения в Palm WebOS есть только один способ – вызвать приложение Phone (стандартную звонилку) с помощью Application Manager. Пользователь обязательно должен подтвердить выполнение звонка, нажав кнопку дозвона. Выполнить звонок без подтверждения, возможности нет.

В API предусмотрена возможность запуска приложения дозвона с предварительной установкой телефонного номера, а также возможность запуска без установки параметров. Как использовать это API – смотрим ниже:

Для начала создадим приложение и в нем сцену с названием Call. Как создать приложение и сцену в нем, можно узнать здесь.

app/views/call/call-scene.html

<div class="palm-group">
  <div class="palm-group-title">Phone number</div>
  <div class="palm-row">
    <div class="palm-row-wrapper textfield-group" x-mojo-focus-highlight="true">
      <div class="title">
        <div class="label">Number</div>
        <div id="PhoneNumber" x-mojo-element="TextField"></div>
      </div>
    </div>
  </div>
</div>
<div id="DialerButton" x-mojo-element="Button"></div>
<div id="CallButton" x-mojo-element="Button"></div>
<div id="ExitButton" x-mojo-element="Button"></div>

Наша сцена содержит группу, в которой находится текстовое поле, а также три кнопки:

  • Кнопку запуска приложения дозвона без параметров
  • Кнопку запуска приложения дозвона с предустановленным номером (для завершения звонка необходимо нажать кнопку дозвона)
  • Кнопку для выхода из приложения.

app/assistants/call-assistant.js

function CallAssistant() {
}

CallAssistant.prototype.setup = function() {
    this.controller.setupWidget("PhoneNumber",
    {
        modelProperty: 'originalValue'
    },
    this.phoneNumberTextModel =
    {
        originalValue: ''
    });
    this.controller.setupWidget("DialerButton", {}, {label:"Launch dialer"});
    this.controller.setupWidget("CallButton", {}, {label:"Call"});
    this.controller.setupWidget("ExitButton", {}, {label:"Exit"});
}

После запуска приложение у нас должно получиться что-то подобное:
WebOS Dialer Sample

Теперь посмотрим как можно запустить приложение дозвона без параметров:

CallAssistant.prototype.handleDialerButton = function(event) {
    this.controller.serviceRequest('palm://com.palm.applicationManager',
    {
        method:'launch',
        parameters:
        {
            id:"com.palm.app.phone"
        }
    });
}

Мы вызываем метод launch сервиса Application Manager и указываем ему уникальный идентификатор приложения дозвона.

Теперь посмотрим как при запуске приложения дозвона можно указать телефонный номер:

CallAssistant.prototype.handleCallButton = function(event) {
    if (this.phoneNumberTextModel.originalValue.length < 7) {
        this.controller.showAlertDialog(
        {
            onChoose: function(value){},
            title: 'Error',
            message: 'Phone number should contain at least 7 digits',
            choices: [{label:'OK'}]
        });
        return;
    }
    this.controller.serviceRequest("palm://com.palm.applicationManager",
    {
        method : 'open',
        parameters:
        {
            target: "tel://" + this.phoneNumberTextModel.originalValue
        }
    });
}

Для начала, перед запуском мы проверяем длину значения в текстовом поле. Если она меньше 7ми символов, то выводим уведомление об ошибке.
Для запуска приложения дозвона мы используем метод open сервиса Application Manager и в качестве параметра скармливаем ему объект, свойство target которого содержит телефонный номер и префикс “tel://”.

Не забываем, также, что для всех кнопок нужно регистрировать обработчики в методе setup() и отключать их в методе сleanup().

CallAssistant.prototype.setup = function() {
...
    Mojo.Event.listen(this.controller.get("DialerButton"),
        Mojo.Event.tap, this.handleDialerButton.bind(this));
    Mojo.Event.listen(this.controller.get("CallButton"),
        Mojo.Event.tap, this.handleCallButton.bind(this));
    Mojo.Event.listen(this.controller.get("ExitButton"),
        Mojo.Event.tap, this.handleExitButton.bind(this));
}

CallAssistant.prototype.handleExitButton = function(event) {
    this.controller.stageController.getAppController().closeAllStages();
    window.close();
}

CallAssistant.prototype.cleanup = function(event) {
    Mojo.Event.stopListening(this.controller.get("DialerButton"),
        Mojo.Event.tap, this.handleDialerButton.bind(this));
    Mojo.Event.stopListening(this.controller.get("CallButton"),
        Mojo.Event.tap, this.handleCallButton.bind(this));
    Mojo.Event.stopListening(this.controller.get("ExitButton"),
        Mojo.Event.tap, this.handleExitButton.bind(this));
}

После всех проделанных действий, после нажатия на кнопку Call, получим что-то вроде этого:

WebOS Phone Application GUI

На этом все.

Скачать исходный код приложения.

Д.

Доступна вторая глава книги о разработке для Palm webOS

Сегодня в блоге разработчиков Palm webOS была анонсирована вторая глава книги “Palm webOS: Developing Applications in JavaScript using the Palm Mojo™ Framework“.

Вторая глава доступна читателям в Safari Books Online (доступ к этой главе платный, а жаль).

Первую главу книги можно скачать здесь или на Palm Developer Network.