Web Intents

В хорошей статье Web Intents in Chrome описано, как написать веб приложение, взаимодействующее с другими веб-приложениями с использованием веб интентов. 

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

В дополнение к этой статье, расскажу, как сделать веб-приложение с веб интентами, взаимодействующее с приложением- расширением браузера Chrome.

Механизм веб интентов, в первую очередь призван связывать веб-приложения, но это можно делать и с не-веб приложениями.

Напишем .crx плагин Chome, позволяющий вести офлайновый список дел (ToDo list).

Сначала надо в отдельном каталоге создать файл manifest.json:

 { 'default_locale' : 'en', 'name' : '__MSG_name__', 'description' : '__MSG_desc__', 'version' : '1.0.0.0', 'icons' : { '16' : 'i/16.png', '24' : 'i/24.png', '128' : 'i/128.png' }, 'app' : { 'launch' : { 'local_path' : 'index.html' } }, 'permissions' : [ 'unlimited_storage', 'notifications' ], 'intents' : { 'http://webintents.org/subscribe' : [{ 'type' : ['text/calendar'], 'title' : '__MSG_desc__', 'local_path' : 'index.html' }] } } 

В нем указываем, что плагин с начальным экраном index.html будет воспринимать действие subscribe с MIME интент, воспринимающий MIME тип календаря ICS Создадим каталог _locales, в ней- покаталоги en и ru для файла локализации messages.json:

 { 'desc': { 'message': 'Offline To Do List' }, 'name': { 'message': 'To Do List' }, 'title': { 'message': 'Add to my offline To Do List' }, 'error': ... } 

Из манифеста слова __MSG_name__ и __MSG_desc__подставляются из файла локализации.

Создадим простую страницу плагина index.html:

 ...<script type='text/javascript'>// <![CDATA[ var intent = window.webkitIntent; var ev_in = intent.data; var ev_out = ev_in; function onAdd() { intent.postResult(ev_out); } // ]]></script> ... <button id='badd' onclick='onAdd();'>Добавить</button> ... 

В ней мы создаем объект веб интента c интерфейсом Intent и читаем переданные данные из свойства data. Кнопка отправляет запрашивающему приложению ответ.

Теперь в Chrome chrome://chrome/extensions/ в режиме разработчика нажимаем кнопку «Загрузить распакованное приложение» (потом для отправки в вебстор соседней кнопкой надо будет зазиповать в .crx архив).

Для тестирования создадим веб-страницу:

 <html> <head> <title>Добавить событие в календарь</title> <meta charset='UTF-8' /> <script src='js/jquery.min.js'></script> <script src='js/webintents.min.js'></script> <script src='js/fical.js'></script> <script src='js/jquery.icalendar.min.js'></script> <script> var ev = createEvent( 'http://commandus.com/blog', new Date(2012, 1-1, 26, 11, 30, 00), new Date(2012, 1-1, 26, 12, 45, 00), 'Yakutsk', 'Title', 'Some summary', 'Some description', 'Somebody' ); function doSubscribe() { // alert(makeICalendar(event)); var intent = new WebKitIntent('http://webintents.org/subscribe', 'text/calendar', ev.toICS()); window.navigator.webkitStartActivity(intent, onSubscribe, onError); } function onSubscribe(data) { alert('Subscribe ' + data); } function onError(e) { alert('Error ' + e); } </script> </head> <body><h1>Добавить событие в календарь</h1> <div id='event'> <button id='bsubscribe'>Подписаться</button> </div> <div> </div> </body> <script> var bsubscribe = document.getElementById('bsubscribe'); bsubscribe.addEventListener('click', doSubscribe, false); </script> </html> 

и проверяем, как это работает.

Скачать архив примера 

Имя *
e-mail *

 

Comments

comments

Powered by Facebook Comments

Web Intents: 1 комментарий

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *