Напишите свои собственные гаджеты

Основные шаги
Анатомия Гаджета
Определение контента
Указание DOCTYPE
Определение пользовательских настроек
Переменные замены предпочтений пользователя
Определение настроек гаджета
Куда пойти отсюда

Начиная знакомит вас с гаджетами. Следующий шаг - создание собственных гаджетов. Этот документ рассказывает вам, как.

Основные шаги

Вот основные шаги, которые вы выполняете для создания и развертывания гаджета:

Используйте любой текстовый редактор, чтобы написать свою спецификацию гаджета, и разместите ее на общедоступном веб-сервере.
Добавьте свой гаджет на сайт, на котором можно запускать гаджеты.

Анатомия Гаджета

Как только вы поймете, как редактировать и публиковать гаджеты, вы готовы включить более сложные функции в спецификации гаджетов. Спецификация гаджета XML состоит из 3 основных частей:

Раздел контента. <Содержание> раздел, где происходит настоящая работа вашего гаджета. Здесь вы указываете тип гаджета, логику программирования и часто элементы HTML, которые определяют внешний вид вашего гаджета.
Пользовательские настройки. <UserPrefs> В разделе определяются элементы управления, которые позволяют пользователям указывать настройки для гаджета. Например, персонализированный гаджет приветствия может предоставить пользователям текстовое поле для указания их имен.
Настройки гаджета. <ModulePrefs> В разделе XML-файла указываются такие характеристики гаджета, как заголовок, автор, предпочтительный размер и т. д.

Примечание. Внутри атрибутов XML в спецификации гаджета необходимо «экранировать» (то есть правильно кодировать) определенные символы, чтобы они правильно интерпретировались. Для получения дополнительной информации см. Экранирование специальных персонажей ,

При написании гаджета вы должны начать с раздела <Content>.

Определение контента

Раздел <Content> представляет «мозги» гаджета. Раздел <Content> определяет тип контента и либо содержит сам контент, либо имеет ссылку на внешний контент. В разделе <Content> атрибуты гаджета и пользовательские настройки объединяются с логикой программирования и информацией о форматировании, чтобы стать работающим гаджетом.

Самый простой способ создать гаджет - просто поместить HTML (и, необязательно, JavaScript или Flash) в раздел <Content>. Опытные веб-разработчики могут читать Выбор типа контента другие параметры, относящиеся к управлению доступом, удаленному хостингу, использованию альтернативных языков сценариев и другим темам. Вот простой пример гаджета. Этот гаджет отображает активную фотографию, которая открывает фотоальбом на новой HTML-странице:

<? xml version = "1.0" encoding = "UTF-8"?> <Module> <ModulePrefs title = "Перейти в фотоальбом" height = "250" scaling = "false" /> <Content type = "html"> <! [CDATA [<div style = "text-align: center"> <a id = "Riggs" title = "Мой фотоальбом" target = "_ blank" href = "http://picasaweb.google.com/doc .examples / ShelfBoy ">
<img border = "0" alt = "Фотография" src = "http://doc.examples.googlepages.com/Riggsie-OP.jpg"
title = "Нажмите здесь."> </a>
</ div>]]> </ Content> </ Module>

Указание DOCTYPE

Вы можете включить произвольный DOCTYPE в вашем гаджете спец. Гаджеты, в которых не указан DOCTYPE, отображаются в режим причуд по умолчанию.

Определение пользовательских настроек

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

Примечание: Для более общего механизма сохранения, который не привязан к userprefs, см. OpenSocial постоянство API ,

Например, этот гаджет отображает личное приветствие в зависимости от времени суток. Это позволяет пользователям указывать следующее:

Имя для использования в приветствии. Имя также отображается в строке заголовка.
Цвет фона.
Независимо от того, чтобы отобразить фотографию.

Вот как гаджет выглядит, когда пользователь нажимает кнопку " Изменить", чтобы изменить его настройки:

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

<? xml version = "1.0" encoding = "UTF-8"?> <Module> <ModulePrefs title = "Предпочтения для __UP_myname__" height = "250" />
<UserPref name = "myname" display_name = "Name" обязательно = "true" />
<UserPref name = "myphoto" display_name = "Photo" default_value = "http://doc.examples.googlepages.com/rowan-headshot.jpg" />
<UserPref name = "mychoice" display_name = "Показать фотографию?" datatype = "bool" default_value = "true" />
<UserPref name = "mycolor" display_name = "Color" default_value = "Yellow" datatype = "enum"> <EnumValue value = "Red" /> <EnumValue value = "Aqua" /> <EnumValue value = "Lime" /> <EnumValue value = "Yellow" /> <EnumValue value = "Pink" /> <EnumValue value = "Orange" /> <EnumValue value = "White" /> </ UserPref>

Обратите внимание на следующее:

Строка 3 файла содержит текст title = "Настройки для __UP_myname__". Когда вы запускаете гаджет, значение, указанное для предпочтения пользователя myname, равно динамически замещенный для __UP_myname__.
Предпочтения пользователя myname помечены как «обязательные». Если пользователь пытается запустить гаджет без указания значения для этого поля, окно редактирования пользовательских настроек остается открытым до тех пор, пока не будет предоставлено значение.
Пользовательские настройки mychoice имеют тип данных bool. Это отображается в пользовательском интерфейсе как флажок.
Пользовательские настройки mycolor имеют тип данных enum. Список EnumValues определяет варианты, которые появляются в раскрывающемся меню в окне редактирования пользовательских настроек.

Вот полный гаджет, включая JavaScript, который отображает приветствие для гаджета:

<? xml version = "1.0" encoding = "UTF-8"?> <Module> <ModulePrefs title = "Предпочтения для __UP_myname__" height = "400" /> <UserPref name = "myname" display_name = "Name" default_value = "Rowan" /> <UserPref name = "myphoto" display_name = "Photo" default_value = "http://doc.examples.googlepages.com/rowan-headshot.jpg" /> <UserPref name = "mychoice" display_name = " Показать фото? datatype = "bool" default_value = "true" /> <UserPref name = "mycolor" display_name = "Color" default_value = "Yellow" datatype = "enum"> <EnumValue value = "Red" /> <EnumValue value = "Aqua "/> <EnumValue value =" Lime "/> <EnumValue value =" Yellow "/> <EnumValue value =" Pink "/> <EnumValue value =" Orange "/> <EnumValue value =" White "/> </ UserPref> <Content type = "html"> <! [CDATA [<div id = "content_div"> </ div> <script type = "text / javascript"> // Получить userprefs var prefs = new gadgets.Prefs () ; function displayGreeting () {// Получить текущее время var today = new Date (); var time = today.getTime (); var html = ""; // На основе времени суток отображаем соответствующее приветствие var hour = today.getHours (); var salutation = "День"; if (час <12) {salutation = "Утро"; } else if (час> 17) {salutation = "Вечер"; } // Установить цвет фона в соответствии с mycolor userpref var element = document.getElementById ('content_div'); element.style.height = 250; // Установить цвет фона в соответствии с mycolor userpref element.style.backgroundColor = prefs.getString ("mycolor"); // Отображение приветствия на основе myname userpref html + = "<br> <FONT SIZE = 6> Good" + salutation + "," + prefs.getString ("myname") + "!!! <br> <br > </ FONT> "; // Если "Показать фото?" флажок установлен, показывать фото. if (prefs.getBool ("mychoice") == true) {html + = '<img src = "' + prefs.getString (" myphoto ") + '">'; } element.innerHTML = html; } // Передаем userprefs для этого экземпляра модуля в функцию // (позволяет пользователям включать несколько экземпляров модуля на свою страницу) gadgets.util.registerOnLoadHandler (displayGreeting); </ script>]]> </ Content> </ Module>

Список всех атрибутов <UserPref> см. В Ссылка ,

Пользовательские настройки доступны из вашего гаджета с помощью пользовательского интерфейса JavaScript API, например:

Список всех функций JavaScript см. В Справочник по JavaScript ,

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

Переменные замены предпочтений пользователя

Вы можете использовать переменную подстановки в формате __UP_ userpref __ в разделах <ModulePrefs> или <UserPref>, где userpref соответствует атрибуту имени пользовательской настройки. Когда гаджет запускается, строковое значение соответствующего пользовательского предпочтения подставляется вместо переменной unescaped. Например, в этом отрывке значение, предоставляемое пользователем во время выполнения для пользовательских настроек проектов , заменяется на __UP_projects__ в строке title_url :

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

Вот общие рекомендации по использованию пользовательских переменных подстановки:

Для атрибута заголовка <ModulePrefs> используйте __UP_ name __. Это HTML маскирование ,
Для атрибута <ModulePrefs> title_url используйте __UP_ name __. Это URL маскирование ,
В HTML в разделе <Content> используйте __UP_ name __. Это HTML-экранирование.
В коде JavaScript в разделе <Content> используйте функцию gadgets.Prefs ().

Определение настроек гаджета

В разделе <ModulePrefs> в файле XML указываются такие характеристики гаджета, как заголовок, автор, предпочтительный размер и т. Д. Например:

<Модуль>
<ModulePrefs title = "Сегодняшний сетевой трафик" title_url = "http: // www / ~ rowan / gadgets / stats /"
height = "200" author = "Джейн Смит" author_email = "[email protected]" />
<Содержание ...>
... содержание ...
</ Content>
</ Module>

Пользователи вашего гаджета не могут изменять эти атрибуты.

Полный список атрибутов <ModulePrefs> см. В Ссылка ,

Куда пойти отсюда

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

Вернуться к началу

Похожие

Будут внесены изменения в закон о техническом надзоре
Мы хвалим вас! Большинство наших клиентов - послы образовательного портала Мы представляем результаты теста удовлетворенности, рекомендаций и рекомендаций для клиентов знаний и практики и образовательного портала, проведенного компанией «Маркетинговые отношения». Опрос

Международные склады в глобальной электронной коммерции: руководство по расширению
«В любой конкретный день, - писал Томас Л. Фридман в « Мире плоском » , - 2% мирового ВВП можно найти в грузовиках, доставляющих UPS, или в пакетных автомобилях». Еще в 2005 году, когда книга была впервые опубликована, ее стоимость составила бы 1,16 триллиона долларов. Сегодня это число составляет около 2,32 триллиона долларов. Коммерция вышла на международный уровень. И так же, как Фридман был в 2005 году, он еще более прав сегодня: мир плоский. Это значит одно

Работа с удаленным контентом
В этом документе описывается, как извлекать и обрабатывать удаленные текстовые (обычно HTML), XML и JSON данные с помощью функции makeRequest (). Функция makeRequest () - это всего лишь один из методов получения удаленных данных. Для обзора различных подходов, которые вы можете использовать, см. Руководство для разработчиков удаленных запросов данных , Вступление Для обзора

Презентация репетитора с использованием видео CV
Репетиторство давно ассоциируется не только с подготовкой к школе или зрелости. Каждый день в польском Интернете появляются сотни тысяч новых репетиторских объявлений по различным предметам. Вы можете видеть рекламу от нешкольных предметов все чаще и чаще. Широкий спектр репетиторства привел к тому, что конкуренция среди репетиторов возросла, поэтому необходимо использовать наиболее эффективные методы продвижения их репетиторской работы. Одним из таких способов, который привлекает трафик

Adobe Reader для Mac: обзор, функции и лучшие альтернативы
Впервые выпущенный в 1993 году Adobe Reader можно найти на бесчисленных домашних, школьных и корпоративных компьютерах по всему миру. Это бесплатное средство просмотра PDF доступно на большинстве основных языков, а его всесторонняя поддержка формата файла PDF часто используется в качестве ориентира для встреч других приложений PDF. Но только потому, что Adobe Reader является наиболее распространенным средством просмотра PDF на Mac и других операционных системах, не обязательно означает, что

Объектив Canon EF 24-70мм f4 L IS USM
Вернуться к началу Объектив Canon EF 24-70 мм f / 4 L IS представляет собой высокопроизводительный зум-объектив со стабилизацией изображения (IS) и встроенным ультразвуковым мотором (USM), который обеспечивает быструю почти бесшумную фокусировку. Этот объектив состоит из 2 ультранизких дисперсий (UD) и 2 асферических элементов, обеспечивающих превосходное качество изображения. Диафрагма с 9 лопастями обеспечивает привлекательную мягкую размытость вне зон фокусировки.

политика конфиденциальности
Мы очень серьезно относимся к вашей конфиденциальности и стремимся обеспечить защиту вашей личной информации в соответствии со всеми применимыми законами Новой Зеландии. В этой политике описывается, что, почему и как мы собираем и используем вашу личную информацию, как мы ее защищаем и как вы можете с нами связаться. Sony New Zealand Limited ( Sony New Zealand ) (NZBN 9429039024756) - компания Sony Group, ответственная за потребительскую и профессиональную электронику, услуги и

Quot; encoding = "UTF-8"?
Quot; encoding = "UTF-8"?
Quot; encoding = "UTF-8"?
Jpg" /> <UserPref name = "mychoice" display_name = " Показать фото?
Lt;br> <br > </ FONT> "; // Если "Показать фото?
Php?

Статьи