Что-то такой длительный перерыв получился со скринкастами.

В этот раз видео будет о разработке для Palm webOS.

Что из видео можно узнать

  • Как установить все необходимое ПО для разработки
  • Настроить Eclipse для разработки webOS приложений
  • Создать минимальное приложение
  • Добавить новую форму в приложение
  • Написать обработчик нажатия кнопки

Описание последовательности действий:

  • Устанавливаем Apple Safari
  • Устанавливаем VirtualBox
  • Устанавливаем Java Runtime Environment
  • Устанавливаем webOS SDK
  • Распаковываем Eclipse
  • Запускаем Eclipse
  • В Help -> Install New Software добавляем URL для загрузки плагина, необходимого для разработки webOS приложений ( https://cdn.downloads.palm.com/sdkdownloads/1.1/eclipse-plugin/eclipse-3.4/site.xml )
  • Устанавливаем плагин
  • Создаем минимальное приложение
  • Запускаем webOS эмулятор
  • С помощью меню Run As… запускаем приложение в эмуляторе
  • Командой “palm-generate -t new_scene -p "name:First" HelloWorld” создаем новый view в приложении
  • Меняем шаблон нового view’а
  • Делаем так, чтобы новый view запускался при старте приложения
  • Дописываем обработчик нажатия кнопки
  • Дописываем метод инициализации view’а и привязываем в нем обработчик кнопки

Загрузки:

Внимание!!! Видео в разрешении 1280×800 – Смотреть лучше в полноэкранном режиме.

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

Leave a Reply

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

Д.

Доступ к базам данных MySQL из приложений для Palm WebOS

Доступ к базам данных – очень востребованный функционал приложений. И в этот раз мы рассмотрим способ для WebOS приложений получить данные из базы данных MySQL, находящейся на удаленном сервере.

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

Затем добавим в созданную сцену список:

views/main/main-scene.html

<div class="palm-group">
  <div class="palm-group-title" id="sample-toggle">
  	<span x-mojo-loc="">Database Content</span></div>
    <div class="palm-list">
       <div id="dbList" x-mojo-element='List'></div>
    </div>
  </div>
</div>

Для нашего списка нам необходимо определить HTML-шаблон элементов списка:
views/main/dbItemTemplate.html

<div class="palm-row" x-mojo-tap-highlight="momentary">
  <div id="nameField">#{Name} (#{Year})</div>
</div>

В шаблоне указано, что если в элементе списка есть свойства Name и Year, то они должны быть отображены.

Теперь в assistants/main-assistant.js внесем необходимые изменения для того, чтобы виджет-список создался при запуске:

function MainAssistant() {
}

MainAssistant.prototype.setup = function() {
this.count = 0;
this.dbListModel = {};
this.controller.setupWidget("dbList",
        {
            itemTemplate: "main/dbItemTemplate"
        },
        this.dbListModel);
}

Как видно из кода, в атрибутах виджета мы указываем шаблон элементов main/dbItemTemplate. Название должно совпадать с названием ранее созданного HTML-файла с описанием шаблона элементов.

После всех манипуляций, описанных выше, у нас должно получиться что-то подобное:

WebOS Empty List

Отлично, с GUI мы закончили, теперь займемся получением данных с сервера.

Для начала создадим базу данных и в ней таблицу, из которой мы будем получать записи и отображать их на форме:

CREATE TABLE remote_data(
 ID INTEGER NOT NULL AUTO_INCREMENT ,
 Name VARCHAR( 32 ) NOT NULL ,
 Year SMALLINT NOT NULL ,
 PRIMARY KEY ( ID )
);

Затем создадим PHP-скрипт, который будет получать данные из таблицы и выдавать их в формате JSON:

<?php
header('Content-type: application/json');
$dbhost = "localhost";
$dbuser = "root";
$dbpass = "";
$dbname = "webos_test";
$link = mysql_connect($dbhost, $dbuser, $dbpass)
    or die('Could not connect: ' . mysql_error());
mysql_select_db($dbname) or die('Could not select database');

switch($_POST['operation'])
{
 case 'getResults':
 {
  $table = $_POST['table'];
  $query = sprintf("SELECT * FROM %s", mysql_real_escape_string($table));
  $result = mysql_query($query) or die('Query failed: ' . mysql_error());
  $all_recs = array();
  while ($line = mysql_fetch_array($result, MYSQL_ASSOC))
  {
   $all_recs[] = $line;
  }
  break;
 }
}
echo json_encode($all_recs);
mysql_free_result($result);
mysql_close($link);
?>

Что делает этот скрипт:

  • Получает из POST-параметров название операции, непример getResults.
  • Если операция поддерживается, то получает из POST-параметров имя таблицы
  • Получает записи из таблицы в массив
  • Конвертирует в JSON и отдает клиенту

В результате у нас в выдаче должно получиться что-то подобное:

[
 {"ID":"1","Name":"Test 1","Year":"2008"},
 {"ID":"2","Name":"Test 2","Year":"2009"},
 {"ID":"3","Name":"Test 3","Year":"2010"}
]

Теперь нам надо научить наше WebOS приложение получать эти данные с сервера.

Для получения данных в приложении нам необходимо выполнить AJAX-запрос на сервер. Для этого используется метода Ajax.Request():

MainAssistant.prototype.getRemoteData = function(table) {
    var url = 'http://192.168.0.1/remote-data.php';
    try
    {
        if(!table)
        {
            throw('getRemoteData(): You should specify database table name');
        }
        var request = new Ajax.Request(url,
        	{
            	method: 'post',
            	parameters: {'operation': 'getResults', 'table': table},
            	evalJSON: 'true',
            	onSuccess: this.getRemoteDataSuccess.bind(this),
            	onFailure: function()
            	{
                	Mojo.Log.error('Failed to get Ajax response');
            	}
        	});
    }
    catch(e)
    {
        Mojo.log.error(e);
    }
}

В исходном коде указан IP адрес машины в локальной сети. Если вы тестируете приложение на эмуляторе, а сервер со скриптом и базой данных находится в Internet, то, скорее всего, доступа к серверу у вас по умолчанию не будет. Для того, чтобы разрешить эмулятору ходить в сеть, надо в настройках LAN-соединения разрешить доступ из подсети VirtualBox:
Share Internet with WebOS Emulator

Итак, в приведенном выше коде указано, что при успешном завершении запроса необходимо вызвать метод getRemoteDataSuccess(). В этом методе мы должны преобразовать полученный ответ от сервера в массив и обновить список. Делается это следующим образом:

MainAssistant.prototype.getRemoteDataSuccess = function(response) {

 	try
 	{
 		this.dbListModel.items = response.responseText.evalJSON();
 		this.controller.modelChanged(this.dbListModel);
 	}
 	catch(e)
 	{
 		Mojo.log.error(e);
 	}
}

Для преобразования JSON-строки в массив мы использовали метод evalJSON(), а для того чтобы виджет обновил список элементов мы вызвали метод modelChanged() объекта-контроллера.

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

Вызвать этот метод можно при запуске приложения. У класса сцены есть метод, который отрабатывает, когда сцена загружена. Это метод ready(). Вот в нем мы и запустим выполнение AJAX-запроса:

MainAssistant.prototype.ready = function() {
this.getRemoteData('remote_data');
}

И вот, после запуска увидим такое:

WebOS List Loaded from MySQL Database

На этом все.

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

К.

Как создать базу данных Microsoft SQL Server CE

Сделал видео-урок о том как создать базу данных для SQL Server CE (Compact Edition) с помощью бесплатной SQL Server Management Studio Express. Хочу отметить что для того чтобы иметь возможность создавать базы данных SQL Server CE необходимо установить SQL Server Management Studio Express SP2. Версия без SP2 не имеет такой возможности.
Скачать видео-урок можно здесь и здесь.

Еще можно посмотреть на YouTube, но качество получилось не очень %)