Закреплённые сайты: создание и управление из сценариев (ч.2)
14779
3. Программное закрепление веб-сайта
Но самое интересное в плане поддержки закреплённых веб-сайтов открывается только веб-программистам. Остальная часть статьи будет посвящена работе с закреплёнными веб-сайтами, командами в списке переходов и пр. из веб-сценариев. И первое, чем мы займёмся, - программное закрепление веб-сайтов.
Каждый браузер поддерживает объект Window, представляющий его отдельное окно или вкладку. Экземпляр данного объекта, представляющий текущее окно (вкладку), создаётся самим браузером и хранится в переменной window, которая доступна в любом веб-сценарии.
В реализации Internet Explorer объект Window поддерживает свойство external. В этом свойстве хранится экземпляр объекта External, представляющий дополнительные возможности данного окна (вкладки) браузера.
var oExternal = window.external;
Отметим, что объект External не определён в стандартах HTML, выпускаемых комитетом W3C, а является инициативой Microsoft по расширению возможностей Internet Explorer.
А в реализации Internet Explorer 9 объект External поддерживает метод msAddSiteMode, вызов которого выполняет закрепление веб-сайта. Этот метод не принимает параметров и не возвращает результата.
window.external.msAddSiteMode();
Перед тем как использовать метод msAddSiteMode, уясним две важные вещи.
Во-первых, метод msAddSiteMode выполняет закрепление веб-сайта в меню Пуск, но не на панели задач и не на рабочем столе. Пользователь может перетащить созданный в результате закрепления ярлык на панель задач или на рабочий стол, а может и не делать этого.
Во-вторых, при вызове метода msAddSiteMode на экране появится диалоговое окно, спрашивающее пользователя, действительно ли хочет он закрепить этот веб-сайт. Если пользователь ответит положительно, сайт будет закреплён, если же он ответит отрицательно, закрепления сайта не произойдёт. При этом нет никакого способа выяснить, какой именно ответ дал пользователь.
Далее приведён HTML-код страницы с кнопкой, при нажатии которой эта страница будет закреплена в меню Пуск.
<!DOCTYPE html>
<HTML>
<HEAD>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=utf-8">
<TITLE>Закреплённый веб-сайт</TITLE>
</HEAD>
<BODY>
<FORM>
<INPUT TYPE="button" ID="btnPin" VALUE="Закрепить">
</FORM>
<SCRIPT>
var oBtnPin = document.getElementById("btnPin");
oBtnPin.addEventListener("click",
function ()
{
window.external.msAddSiteMode();
}, false);
</SCRIPT>
</BODY>
</HTML>
lt;/HTML>[/code]
Событие click возникает в элементе веб-страницы, в том числе и кнопке, при щелчке на нём. Остальной код пояснений не требует.
Чтобы запустить данный пример, нам понадобится какой-либо веб-сервер, скажем, стандартно поставляющийся в составе Windows пакет Internet Information Services. Установим его, если ещё этого не сделали, и запустим.
Сохраним страницу в файле, скопируем этот файл в корневую папку веб-сайта, созданного при установке веб-сервера, и откроем его в браузере, набрав в его строке адреса http://localhost/<имя файла нашей веб-страницы>. Когда страница загрузится, мы сможем проверить её в действии.
4. Как выяснить, является ли данный веб-сайт закреплённым
Ранее говорилось, что при вызове метода msAddSiteMode браузер выводит на экран диалоговое окно, спрашивающее пользователя, хочет ли он закрепить данный веб-сайт. При этом пользователь может как подтвердить закрепление сайта, так и отказаться от этого.
Но как проверить, закрепил ли пользователь данный сайт или нет? Ведь метод msAddSiteMode в любом случае не возвращает никакого значения и не генерирует исключений.
К сожалению, мы можем выяснить только, был ли данный сайт открыт щелчком на закреплённом ярлыке. Для этого применяется метод msIsSiteMode объекта External. Он не принимает параметров и возвращает true, если сайт был открыт из закреплённого ярлыка, и false в противном случае.
[code]if (window.external.msIsSiteMode()) {
//Веб-сайт закреплён
} else {
//Веб-сайт не закреплён
}[/code]
В качестве примера возьмём HTML-код страницы из параграфа 3 и исправим его таким образом, чтобы в случае, если веб-сайт был открыт из закреплённого ярлыка, он делал кнопку Закрепить недоступной. Исправленный HTML-код приведен ниже.
[code]<!DOCTYPE html>
<HTML>
<HEAD>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=utf-8">
<TITLE>Закреплённый веб-сайт</TITLE>
</HEAD>
<BODY>
<FORM>
<INPUT TYPE="button" ID="btnPin" VALUE="Закрепить">
</FORM>
<SCRIPT>
var oBtnPin = document.getElementById("btnPin");
if (window.external.msIsSiteMode())
oBtnPin.disabled = true
else
oBtnPin.addEventListener("click",
function ()
{
window.external.msAddSiteMode();
}, false);
</SCRIPT>
</BODY>
</HTML>[/code]
Свойство disabled поддерживается всеми объектами, представляющими элементы управления, и задаёт доступность данного элемента для посетителя. Значение false этого свойства делает элемент управления доступным, а значение true - недоступным. Остальной код не нуждается в пояснениях.
Чтобы проверить этот пример в действии, нам также понадобится веб-сервер. Процедура проверки описана в параграфе 3.
Сразу после успешного закрепления сайта браузер закроет окно или вкладку, где он был открыт, откроет новое окно и загрузит в него начальную веб-страницу этого сайта. При этом говорят, что был выполнен так называемый первый запуск (first run) веб-сайта.
Метод msIsSiteModeFirstRun объекта External позволяет выяснить, является ли данный запуск закреплённого веб-сайта первым, и даже узнать, каким способом был закреплён сайт. Возможно, в некоторых случаях это нам пригодится.
Метод msIsSiteModeFirstRun возвращает одно из трёх следующих целочисленных значений:
- 0 - либо это не первый запуск закреплённого веб-сайта, либо сайт вообще не был закреплён;
- 1 - это первый запуск закреплённого веб-сайта, причём закрепление было выполнено вручную, самим пользователем;
- 2 - это первый запуск закреплённого веб-сайта, причём закрепление было выполнено программно, вызовом метода msAddSiteMode объекта External.
Теперь поговорим о единственном параметре, принимаемом методом msIsSiteModeFirstRun. Он должен представлять собой логическую величину.
- false - первый запуск выполняется только для начальной веб-страницы закреплённого сайта; последующие страницы открываются в обычном режиме. Предположим, что мы закрепили сайт вручную. После этого вызов метода msIsSiteModeFirstRun с параметром false на начальной странице этого сайта вернёт значение 1 (первый запуск, закрепление было выполнено вручную). На всех последующих страницах этот же вызов метода msIsSiteModeFirstRun вернёт уже значение 0 (не первый запуск).
- true - первый запуск будет выполнен для всех страниц данного веб-сайта. Это положение будет сохраняться до тех пор, пока мы не закроем окно браузера, в котором был открыт закреплённый веб-сайт.
В ситуации, рассмотренной ранее, вызов метода msIsSiteModeFirstRun с параметром true и на начальной странице этого сайта, и на всех последующих будет возвращать значение 1. И только после того, как мы закроем этот сайт и откроем его снова, вызов метода msIsSiteModeFirstRun с любым параметром вернёт 0.
Мы можем использовать метод msIsSiteModeFirstRun, чтобы сразу же после закрепления сайта сообщить пользователю о чём-то. Например, если закрепление было выполнено программно, мы можем сигнализировать, что пользователь может поместить данный сайт на панель задач (как мы знаем, программно веб-сайт можно закрепить только в меню Пуск). Для этого мы применим такой код:
[code]if (window.external.msIsSiteModeFirstRun(false) > 0) {
//Был выполнен первый запуск закреплённого веб-сайта.
//Выводим на экран соответствующее сообщение для пользователя.
} else {
//Веб-сайт не был закреплён, а был открыт обычным образом.
//Делаем что-то другое.
}[/code]
Использовав этот код, мы можем вывести упомянутое выше сообщение на начальной странице закреплённого сайта. А если мы изменим значение параметра метода msIsSiteModeFirstRun на true, то данное сообщение будет появляться на всех страницах этого сайта, пока мы не закроем окно браузера, где он был открыт.
5. Динамические команды в списке переходов и работа с ними
В параграфе 2.3 мы узнали, как создать набор статических команд в списке переходов. Такие команды создаются при загрузке страницы закреплённого сайта и в любом случае остаются неизменными; изменять их состав из сценариев мы не можем. Статические задачи помещаются в категорию Задачи контекстного меню ярлыка.
Динамические же команды имеют следующие отличия от статических:
- Они создаются из веб-сценариев, а не с помощью тегов <META>.
- Они помещаются в отдельную категорию контекстного меню. Надпись для этой категории мы можем задать сами.
- Мы можем менять их набор, в зависимости от действий пользователя. Выполняется это также с помощью веб-сценариев.
- Мы можем создать до 20 динамических команд (статических, как мы уже знаем, можно создать только 5). Однако на экране реально будут присутствовать только 10 команд, что мы добавили последними. Впрочем, мы можем изменить это поведение панели задач в её настройках.
Как и статические, динамические команды остаются в контекстном меню ярлыка даже после закрытия закреплённого веб-сайта.
Примечание:
Перед созданием динамических команд обязательно следует проверить, был ли сайт закреплён. Для этого можно использовать уже знакомый нам метод msIsSiteMode.
Первое, что нам нужно сделать, - создать саму категорию контекстного меню ярлыка, где будут находиться динамические команды. Это выполняется вызовом метода msSiteModeCreateJumpList объекта External. В качестве единственного параметра он принимает текст надписи создаваемой категории в виде строки. Результата этот метод не возвращает.
[code]window.external.msSiteModeCreateJumpList("Самые популярные товары");[/code]
Здесь мы создаём категорию для динамических команд и даём её надпись "Самые популярные товары".
Здесь нужно иметь в виду вот что. В контекстном меню ярлыка закреплённого веб-сайта может присутствовать только одна категория с динамическими командами. Это ограничение текущей реализации панели задач Windows 7 и технологии закреплённых веб-сайтов.
Но что случится, если на момент вызова метода msSiteModeCreateJumpList там уже имеется такая категория (например, созданная ранее открытой веб-страницей)?
- Если надпись уже присутствующей в контекстном меню категории совпадает с надписью категории, что мы создаём вызовом метода msSiteModeCreateJumpList, то старая категория со всеми имеющимися в ней динамическими командами останется неизменной, а все команды, что мы создадим, будут добавлены в неё.
- Если же надпись уже присутствующей в контекстном меню категории отлична от надписи категории, что мы создаём вызовом метода msSiteModeCreateJumpList, то старая категория со всеми имеющимися в ней динамическими командами будет удалена.
Подготовив категорию для динамических команд, мы можем начать создание самих команд. Метод msSiteModeAddJumpListItem объекта External при вызове создаёт одну динамическую команду и помещает её в созданную ранее категорию. Формат вызова данного метода приведён ниже.
[code]window.external.msSiteModeAddJumpListItem(
<текст надписи пункта контекстного меню, соответствующего команде>,
<интернет-адрес веб-страницы, на которую будет выполнен переход>,
<интернет-адрес иконки, которая будет отображаться в пункте
контекстного меню, левее его надписи>[,
<цель>]
);[/code]
В качестве параметров этого метода указываются те же данные, что и в теге <META>, создающего статическую команду в списке переходов (см. параграф 2.3). Значения всех этих параметров должны представлять собой строки.
Как и в случае статических команд, динамические команды должны иметь уникальные надписи. В противном случае браузер их не создаст.
Результата метод msSiteModeAddJumpListItem не возвращает.
Примечание:
Динамические команды будут присутствовать в контекстном меню ярлыка в порядке, обратном тому, в котором в коде веб-сценария находятся выражения, их создающие. Говоря другими словами, динамические команды как бы "заталкиваются" в контекстное меню сверху, сдвигая вниз команды, уже находящиеся там.
[code]window.external.msSiteModeAddJumpListItem("Войти",
"/login.aspx", "/icons/login-icon.ico", "self");
window.external.msSiteModeAddJumpListItem("Список товаров",
"/goods.aspx", "/icons/goods-icon.ico", "self");
window.external.msSiteModeAddJumpListItem("Корзина",
"/basket.aspx", "/icons/basket-icon.ico", "tab");
window.external.msSiteModeAddJumpListItem("Купить",
"/buy.aspx", "/icons/buy-icon.ico", "tab");
window.external.msSiteModeAddJumpListItem("Выйти",
"/logout.aspx", "/icons/logout-icon.ico", "self");[/code]
Здесь мы создали пять динамических команд, ведущих на разные веб-страницы сайта нашего гипотетического интернет-магазина.
После создания всех нужных нам динамических команд мы вызовем метод msSiteModeShowJumpList объекта External. Тем самым мы, во-первых, сигнализируем браузеру, что процесс создания команд закончен, а во-вторых, укажем Windows поместить созданные нами категорию с динамическими командами в контекстное меню ярлыка. Метод msSiteModeShowJumpList не принимает параметров и не возвращает результата.
[code]window.external.msSiteModeShowJumpList();[/code]
Ранее уже говорилось, что состав динамических команд, присутствующих в контекстном меню ярлыка, может быть изменён из веб-сценариев, например, как реакция на выбор пользователя. Для этого достаточно снова создать категорию, поместить в неё новые динамические команды и указать Windows, чтобы она поместила их в контекстное меню. Всё это нам уже знакомо.
Если созданная нами категория имеет надпись, отличную от надписи категории, что была создана ранее, проблем нет - старая категория со всеми присутствующими в ней командами будет удалена, и мы, таким образом, начнём с чистого листа. Но, скорее всего, новая категория будет иметь ту же надпись, что и старая, - мы ведь не хотим запутывать посетителя? В этом случае старая категория сохранится, а новые команды будут добавлены в неё и появятся в контекстном меню ярлыка вместе со старыми. А нам это совсем не нужно!
Могут возникнуть и другие ситуации, когда нам понадобится удалить все созданные ранее динамические команды. Так как это сделать?
Вызвать метод msSiteModeClearJumpList объекта External. Он выполняет удаление созданной ранее категории со всеми динамическими командами. Параметров этот метод не принимает и результата не возвращает.
[code]window.external.msSiteModeClearJumpList();[/code]
Для примера возьмём страницу, рассмотренную в параграфе 4, и дополним её двумя кнопками, первая из которых при нажатии добавит в контекстное меню ярлыка закреплённого веб-сайта пару динамических команд, а вторая - удалит их. Исправленный HTML-код этой страницы приведён ниже.
[code]<!DOCTYPE html>
<HTML>
<HEAD>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=utf-8">
<TITLE>Закреплённый веб-сайт</TITLE>
</HEAD>
<BODY>
<FORM>
<INPUT TYPE="button" ID="btnPin" VALUE="Закрепить веб-сайт">
<INPUT TYPE="button" ID="btnAdd" VALUE="Добавить команды" DISABLED>
<INPUT TYPE="button" ID="btnRemove" VALUE="Удалить команды" DISABLED>
</FORM>
<SCRIPT>
var oBtnPin = document.getElementById("btnPin");
var oBtnAdd = document.getElementById("btnAdd");
var oBtnRemove = document.getElementById("btnRemove");
if (window.external.msIsSiteMode()) {
oBtnPin.disabled = true;
oBtnAdd.disabled = false;
oBtnAdd.addEventListener("click",
function ()
{
window.external.msSiteModeCreateJumpList("Команды");
window.external.msSiteModeAddJumpListItem("Команда 1",
"4.html", "icon.ico");
window.external.msSiteModeAddJumpListItem("Команда 2",
"4.html", "icon.ico");
window.external.msSiteModeShowJumpList();
}, false);
oBtnRemove.disabled = false;
oBtnRemove.addEventListener("click",
function ()
{
window.external.msSiteModeClearJumpList();
}, false);
} else
oBtnPin.addEventListener("click",
function ()
{
window.external.msAddSiteMode();
}, false);
</SCRIPT>
</BODY>
</HTML>[/code]
Кнопки Добавить команды и Удалить команды мы сделали изначально недоступными, вставив в создающие их теги <INPUT> атрибуты DISABLED. Это нужно для того, чтобы пользователь не смог выполнить добавление или удаление команд до того, как данная веб-страница будет закреплёна. Вспомним, что говорилось в начале этого параграфа: операции по созданию динамических команд доступны только в том случае, если веб-сайт уже закреплён.
Веб-сценарий, присутствующий в коде, сначала проверяет, закреплена ли данная страница, с помощью вызова давно знакомого нам метода msIsSiteMode. Если она не закреплена, к событию click кнопки Закрепить веб-сайт привязывается обработчик, который выполняет закрепление страницы. Таким образом, пользователь сразу же после открытия этой страницы сможет закрепить её.
Если же данная страница закреплена, кнопка Закрепить веб-сайт делается недоступной, чтобы пользователь не смог выполнить закрепление повторно. Кнопки Добавить команды и Удалить команды, наоборот, делаются доступными; теперь пользователь может создать либо удалить динамические команды.
Далее к событию click кнопки Добавить команды привязывается обработчик, который создаёт категорию Команды, добавляет в неё две динамические команды и выводит их в контекстное меню ярлыка. Обе созданные команды выполняют переход на эту же самую веб-страницу (автор сохранил её в файле под именем 4.html).
Напоследок к событию click кнопки Удалить команды привязывается обработчик, который удаляет все созданные ранее динамические команды.
Чтобы проверить этот пример в действии, нам понадобится веб-сервер. Процедура проверки описана в параграфе 3.
Дополнительные материалы
Продолжение следует...
Март 2011
Комментарии
