Антон Орлов - Тайны и секреты компьютера
Рис. 18.2. Панель Toolbox редактора Script Editor. Кликнув на названии любого элемента на этой панели, вы вставите на web-страницу код, ему соответствующий, независимо от того, в каком режиме вы работаете — создания кода или визуальной разработки.
Есть даже возможность самому создавать такие элементы — скопируйте в буфер обмена нужный текст, можно с html-тэгами, поставьте мышь на панель Toolbox и выберите из контекстного меню правой кнопки мыши пункт «Paste». После этого двойной клик мыши на этом элементе приведет к вставке в позицию курсора запомненного таким образом текста.
Вы можете даже создать свой раздел на панели Toolbox из нужных именно вам фрагментов кода. Скажем, вставляете вы на страницы форму для быстрой подписки на рассылку — запомните ее код на панели, и затем вставляйте код формы парой кликов мыши.
Для того, чтобы добавить на страницу многоколоночную таблицу, не нужно долго и упорно прописывать тэги <tr>, <td> и др. — можно вызвать диалоговое окно "Table"-"Insert Table", указать там нужные параметры таблицы, и ее пустая заготовка будет вставлена в документ, — останется только разместить рисунки и текст. Кликнув правой кнопкой мыши на каком-либо тэге и выбрав пункт Properties, можно задать параметры тэга в специальном диалоговом окне, и они будут правильно и корректно переведены на язык HTML и помещены в код.
Если в стандартном HTML не окажется средств для задания какому-либо элементу нужных свойств, то будет использован язык таблиц стилей — CSS. Тогда при выборе из контекстного меню пункта Properties отобразится не окно задания свойств тэга, а большая панель свойств Properties (рис. 18.3), где можно задать огромное количество параметров тэга. Однако следует помнить, что не все браузеры смогут эти параметры правильно проинтерпретировать. Эту панель можно вызвать и из меню View, выбрав пункт "Properties Window".
Рис. 18.3. Панель Properties редактора Script Editor.
В принципе можно везде использовать лишь средства панели Properties — тогда все без исключения тэги будут обрамлены на CSS, причем для создания страницы знать этот язык вовсе не обязательно, так как названия почти всех параметров вполне понятны даже по-английски.[50]
Чтобы вставить на страницу рисунок, достаточно перетащить его иконку из «Проводника» в окно Script Editor на нужное место, а потом слегка откорректировать его имя, если он находился на локальном диске.
Превосходные средства работы с Html-кодом — это лишь очень малая часть возможностей Script Editor (хотя и их вполне бы хватило на небольшой web-редактор, причем очень даже неплохой для своего класса)! Вкладка Design основного окна этой программы представляет собой полноценный WYSIWYG-редактор Web-страницы (рис. 18.4), многократно превосходящий по своим возможностям большинство других аналогов.
Рис. 18.4.Вкладка Design окна программы Script Editor. Включен режим отображения границ таблиц и непечатаемых символов.
Система генерации кода в режиме визуальной разработки в Script Editor построена очень разумно. Фактически она ничем не отличается от такой же генерации в режиме Source, когда в текст страницы попросту помещаются заранее приготовленные шаблоны из тэгов. Поэтому фрагменты кода, генерируемые Script Editor при помещении на страницу какого-либо обьекта в режиме Design, совпадают с кодом, вставляемым в документ в режиме отображения HTML-текста, что делает работу Script Editor очень корректной.
В то время как количество лишних тэгов, «мусора» у многих WYSIWYG-редакторов вроде FrontPage Express или Microsoft Word 97 достигает порой астрономической величины, а уборка их становится долгим и неприятным занятием, код, генерируемый Script Editor в режиме Design, является настолько компактным и правильным, что практически не требует последующей коррекции (разве что адреса рисунков придется подправить, так как по умолчанию указывается полный путь к ним на локальном диске). Все диалоги задания свойств элементов страницы и панель свойств элементов в режиме Design работают точно так же, как и в режиме Source. Возможности вставления таблиц, указания параметров тэгов работают как в режиме написания кода, так и в режиме визуальной разработки, просто в первом случае вы увидите, как вставляется собственно код, а во втором — соответствующий ему элемент.
При работе в режиме Design разработчику доступно огромное количество возможностей сделать свою работу максимально удобной. О таких вещах, как выпадающий список для задания вида и размера шрифта для текста или его стиля, кнопки для установки выравнивания по центру или по одной из сторон, кнопки создания нумерованных списков можно даже не упоминать — они само собой разумеются. Очень большую помощь при создании или правке макета страницы могут оказать кнопки "Отобразить границы" и "Отобразить непечатаемые символы" (см. также на рис. 18.4), расположенные с левого краю панели инструментов Design. Достаточно их нажать, чтобы вся структура страницы, сколь бы сложной она ни была, оказалась видна как на ладони.
Кнопка Absolute Mode позволит располагать новые элементы в произвольном месте страницы — их расположение будет задаваться растояниями от верхнего и левого краев документа. Реализуется такое расположение посредством использования языка CSS. Если же эта кнопка не нажата, то новый элемент будет вставлен на страницу с использованием стандартных средств Html и с учетом их ограничений.
Кнопки Foreground Color (цвет шрифта) и Background Color (цвет фона) панели инструментов Html в режиме Design вызывают очень удобные диалоговые окна задания цвета выделенного элемента или набираемого текста. Три вкладки каждого из этих окон предоставляют разработчику все возможные способы задания цвета — от непосредственного ввода значений отдельных компонентов цветов до выбора нужного цвета в "безопасной палитре" (все цвета из этого набора отображаются одинаково на любом мониторе, в любом браузере, в любой стране) или названия желаемого цвета.
Третья вкладка окна Script Editor из пакета программ Microsoft Office 2000 — Quick View — позволяет посмотреть, как будет выглядеть страница в браузере. Нет необходимости специально загружать браузер и постоянно нажимать Refresh, чтобы увидеть страницу так, как она в нем отображается. Страница в Quick View за очень небольшими отличиями (касающимися только работы скриптов) отображается так же, как и в браузере Microsoft Internet Explorer 5.0 и более старших его версиях. (В Script Editor'е из Microsoft Office XP данная вкладка отсутствует.)
Все панели инструментов Script Editor являются свободно настраиваемыми — такими же, как и в Microsoft Word. Можно свободно размещать кнопки, вызывающие те или иные команды, создавать новые панели инструментов, настраивать рабочую среду под свои требования.
Возможность многократной отмены произведенных действий и возврата отмененных реализована очень удобно (то, что она есть, само собой разумеется для web-редакторов такого класса) — в небольшом окне отображается краткое описание действий, которые можно выделить для отмены или возврата.
К сожалению, список отменяемых действий очищается при переключении в режим Quick View — по всей видимости, это вызвано ошибкой в самой программе. Будем надеяться, что в будущих версиях этот досадный недостаток будет исправлен.
Система поиска фрагментов текста тоже весьма эргономична — поле ввода текста на панели инструментов Standart (рис. 18.5). Вводишь туда нужное слово и жмешь Enter, а Script Editor сама путешествует по документу, подсвечивая найденные вхождения. И не надо никакого диалогового окна вызывать, жать комбинации клавиш или мышью двигать… Все слова, по которым проводился поиск, сохраняются, и впоследствии отображаются в выпадающем списке. Почему до этого не додумались разработчики Microsoft Word — непонятно: а ведь как бы было удобно…
Рис. 18.5. Искать в документе, открытом в Script Editor, просто. Просто введите текст в поле ввода вверху окна.
В Script Editor из Microsoft Office 2000 поиск можно вести и во всех файлах в папке, где находится открытый документ, а также в любой другой произвольной папке, включая вложенные, и даже в нескольких папках одновременно. Результат поиска выводится в виде списка файлов, рядом с именами которых показывается строка первого вхождения искомого текста, а также фрагмент файла, содержащий его. Для загрузки нужного файла в редактор достаточно кликнуть пару раз на его названии в этом списке. (Внимательнее работайте с окном «Browse» при указании директорий для поиска — не забудьте нажать кнопку "Add to list", чтобы Script Editor стал искать текст и в этой папке.) К сожалению, при разработке Microsoft Office XP эти расширенные возможности поиска из Script Editor'а были удалены.
Если страница большая, со множеством элементов, то ориентироваться в ней непросто. Желательно было бы представить ее в виде некоей структуры, «карты». И это позволяет делать Script Editor! Открыв окно "View-OtherWindow-DocumentOutline", можно получить подробнейшую схему страницы (рис. 18.6), со всеми ее иерархическими связями и компонентами. И если надо быстро перейти к какому-либо компоненту страницы, то рыться в тоннах кода нет необходимости — пара кликов на его имени в схеме, и курсор — уже на этом элементе.
