Глава 7. Интеграция SharePoint 2010 с офисными приложениями. Visio 2010 (продолжение)

Это статья серии “Введение в SharePoint 2010

Это продолжение руководства по интеграции Visio 2010 и SharePoint 2010. Первую часть можете найти здесь.

В этой части руководства рассматривается интеграция SharePoint 2010 и Visio 2010.

  • Соединенные веб-части
  • JavaScript API в службах Visio

Соединенные веб-части

В параметрах веб-части Visio Web Access в группе Отображение веб-документа зададим значение параметра Сделать следующие элементы данных фигуры доступными подключениям веб-частей, равным ИД (так для связывания объектов схемы Visio и элементов списка мы использовали это поле) и кликнем ОК.

Далее кликаем на меню веб-части Visio Web Access и видим нужный нам раздел Соединения (рис. 7.34). Доступны следующие типы подключений:

  • Отправить Данные фигуры – соединение позволяет отправить данные из объекта схемы в выбранную веб-часть в виде строки. По умолчанию отправляется имя и идентификатор объекта, адрес-веб документа и название страницы, на которой размещен объект. Если нужно отправлять дополнительные элементы, то нужно указать их названия в параметре Сделать следующие элементы данных фигуры доступными подключениям веб-частей (если элементов несколько, то в качестве разделителя используется запятая);
  • Получить Имя страницы и URL-адрес веб-документа из – отображается веб-документ с параметрами, полученными из другой веб-части. Если не указана страница, то в указанном документе отобразится страница по умолчанию; если же не указан адрес веб-документа, то отображается текущий документ;
  • Получить Фигуры для выделения из – можно выделить объекты на схеме. Доступны следующие параметры – имя объекта и цвет выделения;
  • Получить значения фильтров из – можно «фильтровать» диаграмму Visio, которая в качестве источника данных использует список SharePoint. Когда фильтруется список, на диаграмме выделяются объекты, которые связаны с отфильтрованными элементами списка;
  • Получить Фигуры для просмотра из – можно отобразить определенные объекты схемы, подключенной к веб-части Visio Web Access. Нужно указать имя объекта и уровень увеличения. Удобно использовать в больших схемах, показывая лишь их части.

Рис. 7.34. Способы соединения веб-частей

Для нашего файла выберем Отправить Данные фигуры в и кликнем на Задачи (напомню, что ранее мы добавили веб-часть Visio Web Access на страницу с задачами).

Рис. 7.35. Соединение веб-части Visio Web Access и списка Задачи

Далее появляется окно для настройки подключения. Можно выбрать один из двух типов соединения – Получить значения фильтров из или Получить параметры из. Выберем первый вариант и кликнем Настроить, или перейдем на другую вкладку (рис. 7.36)

Рис. 7.36. Настройка соединения списка и веб-части диаграммы

В нашем случае выберем в обоих случаях ИД, так как для связи списка SharePoint и объектов схемы мы использовали это поле, и кликаем на Готово. Обращаю ваше внимание, что поле ИД в Имени поля поставщика будет недоступно, если оно не указано в свойствах веб-части, что уже было проделано нами ранее.

Проверим, что же мы сделали. Откроем, например, страницу Распределение загрузки, и кликаем на любого пользователя (рис. 7.37), при этом в списке отображаются все задачи только для выбранного нами пользователя. Также можно выбрать задачи любого пользователя в зависимости от его статуса готовности.

Рис. 7.37. Отфильтрованный список по задачам для пользователя

Рассмотрим оставшиеся возможности, которые предоставляют службы Visio.

JavaScript API в службах Visio

JavaScript API позволяет разработчикам работать с веб-документами Visio, их страницами и объектами на страницах.

API службы содержит только четыре объекта и их члены (рис. 7.38):

  • Класс Vwa.VwaControl – объект представляет собой экземпляр веб-части Visio Web Access. Используя методы данного объекта, можно получить доступ к информации о веб-части и диаграмме Visio, отображаемой в веб-части. Кроме этого, можно выполнять различные действия, такие как открытие документов Visio в веб-части, получение и установка отображаемой активной страницы, добавление и удаление обработчиков событий, а также отображение и скрытие настраиваемых сообщений. При необходимости узнайте о методах и событиях класса.
  • Класс Vwa.Page – объект представляет собой активную страницу веб-документа, отображаемую в текущий момент в веб-части Visio Web Access. Методы объекта можно использовать для выбора фигур на странице и доступа к сведениям о фигурах, включая идентификатор и положение фигуры, а также размер ограничивающего прямоугольника вокруг фигуры. При необходимости узнайте о методах класса.
  • Класс Vwa.ShapeCollection – объект представляет собой коллекцию объектов фигур на активной странице в веб-документе, который в настоящий момент отображается в веб-части Visio Web Access. При необходимости узнайте о методах класса.
  • Класс Vwa.Shape – объект представляет собой одну фигуру на активной странице веб-документа. Методы объекта позволяют получать сведения о конкретной фигуре и взаимодействовать с ней. При необходимости узнайте о методах класса.

Рис. 7.38. Неполная схема объектной модели JavaScript API в службах Visio

В дальнейшем примере будет использоваться веб-документ Visio, полученный нами ранее. Создадим новую страницу, добавим на нее веб-часть Visio Web Access и подключим к ней наш веб-документ (если вы забыли, как это делается, вернитесь немного назад).

Создадим файл Visio.js, который будет содержать скрипт для подсвечивания объекта веб-документа при наведении на него указателя мыши.

Присоединим наш обработчик к событию класса Sys.Application. В этом обработчике мы получим веб-документ Visio по идентификатору веб-части Visio Web Access. Идентификатор можно посмотреть в исходном коде страницы (ищем класс VisioWebAccess, в нем ищем строку вида WebPartWPQ#, где # — искомый числовой идентификатор), либо воспользуемся следующей функцией (рис. 7.39). Схема работы функции аналогична ручному поиску идентификатора.

Рис. 7.39. Функция для поиска идентификатора веб-части Visio Web Access

Объект класса VwaControl позволяет использовать метод openDiagram для открытия веб-документа. Асинхронный механизм выполнения метода не позволяет использовать этот объект снова, поэтому воспользуемся событием Vwa.diagramcomplete (возникает после окончания загрузки веб-документа Visio в веб-части) и напишем для него обработчик. В функцию добавим обработчики для подсветки выделенных объектов веб-документа при наведении на них указателя мыши (рис. 7.40).

Рис. 7.40. Скрипт для подсветки выделенных объектов

Остается добавить методы для обработки события наведения указателя мыши на объект (рис. 7.41). Методы вызываются с параметром args, содержащим идентификатор объекта веб-документа. В методе onShapeMouseEnter мы подсвечиваем объект, а в onShapeMouseLeave убираем подсветку, когда указатель мыши не указывает на подсвеченный ранее объект.

Рис. 7.41. Методы для подсветки объекта при наведении на него указателя мыши

Сохраним и загрузим скрипт в ту же библиотеку документов, что и веб-документ Visio.

На страницу с веб-частью для просмотра веб-документа добавим также веб-часть Редактор контента (находится в каталоге Среда и контент). В свойствах веб-части укажем ссылку на файл Visio.js (рис. 7.42) и кликнем на ОК.

Рис. 7.42. Свойства веб-части Редактор контента

Обновите страницу, и проверьте, что у вас получилось.

Таким образом, интеграция Visio и SharePoint позволяет предоставлять общий доступ к документам с возможностью просмотра содержимого в браузере. Возможность подключения документа к различным источникам данных позволяет обойтись без ручного внесения изменений. А с помощью JavaScript можно сделать документ еще более интерактивным!

В следующей части руководства рассмотрим службы автоматизации Word.

Реклама

Глава 7. Интеграция SharePoint 2010 с офисными приложениями. Visio 2010 (продолжение): 4 комментария

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

Заполните поля или щелкните по значку, чтобы оставить свой комментарий:

Логотип WordPress.com

Для комментария используется ваша учётная запись WordPress.com. Выход / Изменить )

Фотография Twitter

Для комментария используется ваша учётная запись Twitter. Выход / Изменить )

Фотография Facebook

Для комментария используется ваша учётная запись Facebook. Выход / Изменить )

Google+ photo

Для комментария используется ваша учётная запись Google+. Выход / Изменить )

Connecting to %s