Настройка окон и оконная callback-функция

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

При инициализации VcorpJS параметры по умолчанию для всех окон следующие:

  • Анимация прозрачности при появлении / исчезновении окна : 90 мс, шаг анимации 30 мс (это минимум, на самом деле немного больше).
  • Положение левого верхнего угла рассчитывается в момент инициализации (в дальнейшем всегда проводится авто-подстройка).
  • Ширина 500px, высота 300px;
  • Кнопки «скрыть» и «удалить» доступны.
  • Прозрачность opacity 1 (непрозрачные окна).

Оконная система использует обязательные CSS-классы .pb_win_panel (панель окон), .pb_win (все окна), .pb_alert (модальное окно сообщения), и обязательные CSS-классы для вложенных составляющих каждого окна. Если в CSS для окон не указано position: fixed;, то принудительно устанавливается absolute

Текущее положение любого окна зависит от настроек стиля position : fixed / absolute; и текущих размеров окна браузера. Любое окно (как скрытое, так и видимое) всегда автоматически перемещается в область видимой части веб-страницы в окне браузера, при этом заданные координаты могут не меняться, а только корректироваться для корректного показа. Принудительно меняются координаты окна только при его программном или пользовательском перемещении или изменении размера окна, а так же при скроллинге окна (если position:absolute;) или уменьшении окна браузера (если окно начинает выходить за пределы браузерного окна).

При программном удалении любого окна, анимацию прозрачности можно отменить (кроме пользовательского закрытия по кнопке «удалить»). Анимация прозрачности автоматически отменяется для IE8, сенсорных экранов, а так же - если в окне находится Grid с количеством ячеек более 1000 (для движка Chromium более 10000), так как может «подсадить» скорость отзывчивости веб-страницы.

Оконная система и её функции не имеют ничего общего с модальным диалоговым оком.

Ниже приведены функции настроек для окон и оконной системы. Остальные функции см. здесь: Функции работы с окнами.

Так же см. Блок с примерами использования функций

.wSetting( [ time ] , [ step ] , [ left ] , [ top ] , [ width ] , [ height ] , [ buttons ] , [ opacity ] )

Установка параметров по умолчанию для всех новых окон. Все параметры необязательные.

time - время анимации прозрачности для проявления или растворения окна, минимум 90мс.

step - шаг анимации прозрачности для проявления или растворения окна, минимум 30мс.

left, top, width, height - координаты и размеры для создаваемых новых окон. Минимальные размеры width - 100, height - 50.
(могут быть числами number или строками вида "100px").

buttons - числовой параметр для кнопок заголовка окна:
  0 - отображаются и работают кнопки скрыть и удалить (по умолчанию);
  1 - отображается и работает только кнопка удалить окно;
  2 - отображается и работает только кнопка скрыть окно;
  3 - невидимы и не работают обе кнопки. Скрытие и удаление окна только программно.
Для модального окна сообщения (дескриптор 1) допустимы значения 3 или любое другое (1).

opacity - максимальная прозрачность окна от 0 до 1 (для IE8 тоже), по умолчанию 1 - непрозрачно.

Функция возвращает true если параметры запомнены, или false если оконная система не инициализирована.

.wSet( descriptor , [ left ] , [ top ] , [ width ] , [ height ] , [ buttons ] , [ opacity ] )

Установка размеров и положения окна под номером descriptor (от 1 до 49, если 0 - панель окон), а так-же кнопок и прозрачности.

Работает аналогично функции .wSetting(), но задаёт параметры указанному существующему окну.
При этом статус (скрыто/видимо) и index перекрытия окна не меняется, активное окно не меняется.

Если какой-либо параметр не указан или указан некорректно, то используется соответствующий параметр по умолчанию.

Функция возвращает true если параметры применены, или false если окно descriptor не существует или оконная система не инициализирована.

Эта функция может управлять размером и положением панели окон (если descriptor не указан или 0), тогда параметры buttons и opacity игнорируются.
Автор не реализовал изменение прозрачности панели окон, чтобы не засорять стилевые свойства этого объекта, потому что панель окон может иметь любое позиционирование и находиться где угодно и как угодно, но возможно воздействовать на панель окон через свои CSS-темы.

Внимание! Не пытайтесь управлять свойствами HTML-элементов окон через свойства display и visibility - их работа оптимизирована для разных браузеров через помежуточные родительские блочные HTML-элементы. Разумеется, внутри окон можно размещать произвольный HTML-код и работать с ним как угодно.

.wMax( [ number ] )

Устанавливает и/или возвращает максимальное количество одновременно существующих «обычных» окон (1-48), без учёта модального.

Существующие окна никак не затрагиваются, но создавать новые возможно только в том случае, если их максимальное количество находится в указанных пределах.

.wPanelMove( [ boolean ] )

Возвращает и устанавливает разрешение перемещать панель окон (0 или false или 1 или true).

Возвращает число 0 или 1

Оконная callback-функция

.wCallback( handler )

Задаёт callback - функцию handler в качестве обработчика операций с окнами. Вызывается как function( status, desc, left, top, width, height ), где:

  • status - текущее действие ("hide", "del", "show", "resize", "move")
  • desc - дескриптор окна (1-49)
  • left, top, width, height - текущие координаты и размеры окна.

callback - функция может быть текстовой строкой с JavaScript-кодом, в таком случае имена параметров внутри функции таковы: status, desc, left, top, width, height
(см. правила для callback - функций).

callback - функция вызывается оконной системой ТОЛЬКО при действиях пользователя, за одним исключением - когда автоматически меняется индекс перекрытия видимых окон (активным становится другое видимое/открытое окно ("show")). Активация другого окна может произойти, если было скрыто или удалено активное окно.

  • при попытке скрыть окно (status == "hide") - требуется подтверждение
  • при попытке удалить окно (status == "del") - требуется подтверждение
  • после активации окна (status == "show") - по факту
  • после смены размеров окна (status == "resize") - по факту
  • в момент окончания перемещения окна (status == "move") - по факту

callback - функция должна вернуть true для подтверждения пользовательского действия "hide" или "del", иначе это событие не происходит.

Не рекомендуется во время работы callback-функции скрывать или удалять активное окно, меняя таким образом индекс перекрытия (активным автоматически может стать другое окно - если есть открытые окна, что повлечёт за собой рекурсивный вызов). Если нужно скрыть/удалить активное окно из callback-функции, нужно предварительно сделать активным другое окно, или оформить отложенное удаление/скрытие (не в рамках текущего события), например через setInterval()

Для навигации по всем страницам этого раздела сайта используйте пиктограмму или ссылку Навигация в верхней строке навигации.

Демо - блок с примерами использования функций

Визуальный пример использования ряда плагинов (отдельная веб-страница), в котором продемонстрированы следующие возможности:

  • объект управления событиями
  • комбинированные списки выбора (combobox)
  • анимационные меню
  • вывод модального окна сообщения
  • работа с окнами и панелью окон
  • работа с Гридами (в статичном блоке и в окнах)
  • работа плагина анимации
  • возможно, что-то ещё...

См. исходный код страницы. На странице находятся базовые CSS-стили и JavaScript-код управления страницей с комментариями
(на всякий случай, сорри за оформление кода страницы - страница предназначена для теста Гридов и скорости браузеров, а не для красоты кода).

Ссылка на страницу: Визуальный пример некоторых плагинов

  • «VcorpJS» - Главная страница раздела
  • Основные сведения
  • Подключение и инициализация VcorpJS
  • Типовой CSS-файл
  • Краткий обзор и правила, список всех функций.
  • Работа с функциями различного назначения
  • Функции общего назначения
  • Работа с классами и стилями
  • Работа с coockie
  • Работа со слоями (layers)
  • Управление событиями, спец-объект и обработчики
  • Работа со встроенными плагинами
  • Плагины VcorpJS - краткий обзор и правила
  • Перетаскивание объектов
  • Многоуровневые анимационные меню
  • Галереи изображений
  • Блоки ротации изображений
  • Модальное диалоговое окно
  • Модальное окно сообщения
  • Переключатели-флажки checkbox
  • Форматированный ввод данных
  • Поля ввода со списком выбора - combobox
  • Календарь (datepicker)
  • Оконная система
  • Оконная система - краткий обзор и правила
  • Настройка окон и оконная callback-функция
  • Функции работы с окнами
  • Работа с панелью окон
  • Табличный вывод данных Grid
  • Grid - краткий обзор и правила
  • Функции работы с Grid
  • Анимация объектов
  • Краткий обзор и правила анимации
  • Базовая функция анимации
  • Функции - обёртки анимации
  • POST запросы VcorpJS
  • POST запросы VcorpJS
  • Canvas и SVG - графика
  • Canvas - краткий обзор и правила
  • SVG - графики (charts)
  • Скачать vcorp_js_00_80.zip (35 Kb - js и css файлы)
  •  
  • Vcorp.ru - Главная страница сайта
  • Тест больших гридов в перемещаемых окнах
  • Тестирование 3D графики в браузерах
  • «Vcorp Generator» - Главная страница раздела
  • «Lazarus fpCEF3» - Главная страница раздела
  • Открывать окно навигации
    <<<
    Изменить высоту >>