U.Helper

Руководство для новичков можно найти на форуме техподдержки.

Создание AJAX окон:
Новое Ю.Окошко создается следующим кодом:

Где:

• name^string - уникальное имя окошка. Нигде не отображается, но исползуется при работе с такими окнами.
  
• title ^string - заголовок окошка. Отображается в шапке.
  
• width ^integer - ширина окошка.
  
• height ^integer - высота окошка.
  
• opts ^object - дополнительные параметры:
  
  
  • autosize ^boolean - автоопределение размеров.
    
  • autosizewidth ^boolean - автоопределение ширины.
    
  • autosizeonimages ^boolean - автоматически изменять размеры после загрузки картинок.
    
  • hideonresize ^boolean - прятать содержимое при изменении размеров окна.
    
  • waitimages ^boolean - ждать загрузки всех картинок.
    
  • markload ^string - текст загрузки.
    
  • align ^string - выравнивание.
    
  • shadow ^boolean - тень.
    
  • header ^boolean - отображать ли шапку.
    
  • min ^boolean - отображать ли кнопку Minimize (свернуть).
    
  • max ^boolean - отображать ли кнопку Maximize (развернуть).
    
  • design ^string - дизайн. Является ключем объекта _uWnd.designs.
    
  • close ^boolean - отображать ли кнопку Close (закрыть).
    
  • hidden ^boolean - скрытое окно.
    
  • modal ^boolean - модальное окно (все остальное пространство закрывается полупрозраным слоем).
    
  • alert ^boolean - окно будет отображаться выше модальных окон.
    
  • popup ^boolean - закрывать ли окно при клике на пространстве вне окна.
    
  • nomove ^boolean - запретить перемещение окна.
    
  • hideonmove ^boolean - скрывать содержимое окна при перемещении окна.
    
  • resize ^boolean - разрешить изменение размеров окна пользователем.
    
  • fixed ^boolean - фиксированное окно (прокручивается вместе со страницей).
    
  • minh ^integer - минимальная высота.
    
  • maxh ^integer - максимальная высота.
    
  • minw ^integer - минимальная ширина.
    
  • maxw ^integer - максимальная ширина.
    
  • icon ^string - иконка для окна. Отображается в заголовке.
    
  • oncontent ^function - функция, выполняющаяся после добавления контента в окно.
    
  • onclose ^function - функция, выполняющаяся после закрытия окна.
    
  • onbeforeclose ^function - функция, выполняющаяся до закрытия окна (после клика на кнопку закрытия).
    
  • oninit ^function - функция, выполняющаяся при открытии окна.
    
  • onmousemove ^function - функция, выполняющаяся движении мышью над контентом окошка.
    
  • onposchange ^function - функция, выполняющаяся при каждом изменении позиции окна.
    
  • onactivate ^function - функция, выполняющаяся при получении окошком фокуса.
    
  • ondeactivate ^function - функция, выполняющаяся при потере окошком фокуса.

  • closeonesc ^boolean - закрывать ли окно при нажатии клавиши Esc.
    
  • initstate ^'max'|'min' - состояние при открытии.
    
  • headerh ^integer - высота шапки.
    
  • headerc ^{string|object} - содержимое шапки. Строка или DOM-узел.
    
  • hideheader ^{boolean|object} - прятать шапку при загрузке.
    
  • footerh ^integer - высота футера.
    
  • footerс ^{string|object} - содержимое футера. Строка или DOM-узел.
    
  • hidefooter ^{boolean|object} - прятать футер при загрузке.
    
  • center ^boolean - по центру.
    
  • customButtons ^object - дополнительные кнопки. Каждому ключу name ассоциируется массив вида
    Code

    [init_visible,actionfunc,thispar,param]
    Здесь:
    
    
    • init_visible ^boolean - показывать ли кнопку при инициализации окна.
      
    • actionfunc ^function - функция, которая будет вызвана при клике на кнопку. Аргументы: [ссылка на окно, параметры]. Объект this будет указывать на thispar.
      
    • thispar ^mixed - второй аргумент для функции.
      
    • param ^mixed - параметр. Если не указан, используется имя окна.
    Классы кнопки: 'xt-name' - обычное состояние, 'xt-name-over' - при наведении, где name - ключ. Файл спрайтов кнопок.
    
  • havemenu ^boolean - наличие меню. Определяется автоматически, в зависимости от аргумента menuitems.
    
  • menuopts ^object - Опции меню.
  
  
• content ^{object | string | function} - контент. Может быть строкой, объектом или функцией, возвращающей строку. Объект может содержать следующие свойства и методы:
  
  
  • url ^string - ссылка на документ.
    
  • form ^string - ID формы, данные которой нужно отправить серверу.
    
  • xml ^boolean - обрабатывать полученный код как XML или нет.
    
  • type ^{'GET' | 'POST'} - тип запроса.
    
  • cache ^boolean - разрешить / запретить кеширование.
    
  • async ^boolean - устанвить режим запроса (синхронный / асинхронный).
    
  • success ^function - функция, срабатывающая после успешного получения данных. Принимает 2 аргумента:
    
    
    • data ^{string | object} - непосредственно запрошенный документ.
      
    • status ^integer - статус.
      
    
    
  • error ^function - функция обработки ошибок.
    
  • dataType ^string - тип данных. Нужен для функции success.
    
  
  

Так же есть следующие функции:

Создает всплывающее окошко-alert в правом нижнем углу, живущее 5 секунд.
Аргументы:

• txt ^{object | string | function} - контент, аналогично аргументу content функции _uWnd.
  
• title ^string - заголовок.
  
• opts ^object - дополнительные параметры:
  
  
  • w ^integer - ширина окна.
    
  • h ^integer - высота окна.
    
  • tm ^integer - "время жизни" окна. По прошествии указанного времени окно закроется.
    
  • close ^boolean - отображать ли кнопку "Закрыть".
    
  • align ^string - выравнивание текста.
    
  • icon ^string - иконка.
    
  • name ^string - имя окна.
    
  • pad ^string - padding. Записывается в style, единственное свойство, не фильтруется.
    
  
  

Создает всплывающее окошко-alert по центру, блокирует все остальное пространство.
Аргументы:

• txt ^{object | string | function} - контент, аналогично аргументу content функции _uWnd.
  
• title ^string - заголовок.
  
• b ^array - массив из строк с ID либо объектов со следующими ключами:
  
  
  • id ^string - ID.
    
  • t ^string - Текст кнопки. Если не указан, используется ID.
    
  • def ^1|2 - стандартное состояние. 1: фокус получен, 2: ???.
  
  
• opts ^object - опции.
  
• onselect ^function - функция, которая будет вызвана при выделении.
  

Работа с AJAX окнами:

Возвращает ссылку на объект окна с именем name (первый параметр при создании окна).
Закрывает окно с name="name" (первый аргумент при создании окна).
Аналог: метод close() самого окна.
Устанавливает содержимое шапки на content для окна с name="name" (первый аргумент при создании окна).
Аналог: метод header(content) самого окна.
Устанавливает контент content для окна с name="name" (первый аргумент при создании окна).
Аналог: метод content(content) самого окна.
Устанавливает содержимое футера на content для окна с name="name" (первый аргумент при создании окна).
Аналог: метод footer(content) самого окна.
Устанавливает высоту шапки в h пикселей для окна с name="name" (первый аргумент при создании окна).
Аналог: метод headerheight(content) самого окна.
Устанавливает высоту футера в h пикселей для окна с name="name" (первый аргумент при создании окна).
Аналог: метод footerheight(content) самого окна.
Переустанавливает контент content для окна с name="name" (первый аргумент при создании окна, для документов, полученных от сервера).
Аналог: метод reload(content) самого окна.
Устанавливает заголовок title для окна с name="name".
Аналог: метод setTitle(title) самого окна.
Этот метод запускает авторесайз окна.
Сворачивает окно.
Разворачивает окно на максимум.
Восстанавливает нормальные размеры окна.
Показывает или прячет (в зависимости от истинности isVisible) кнопку с именем name (ключ объекта custombuttons).

Еще полезные функции:

Возвращает объект {top:y, left:x} с координатами DOM-узла, переданного в аргументах.

Отправка формы. Где:

• formid^{string | object} - ID, DOM-узел или jQuery-объект формы. Может отсутствовать при условии наличия options.url.
  
• options ^object - параметры:
  
  
  • url ^string - адрес запроса. По-умолчанию значение атрибута action формы или адрес текущей страницы.
    
  • type ^string - метод запроса. По-умолчанию значение атрибута method формы или GET.
    
  • error ^function - функция, вызывающаяся при ошибке.
    
  • success ^function - функция, вызывающаяся при успешном выполнении запроса.
    
  • dataType ^string - тип документа.
    
  • target ^{string | object} - элемент (или его селектор), куда будет вставлен результат запроса. После вставки будет выполнено событие success.
    
  • iframe ^boolean - использовать ли фреймы вместо обычного XMLHttpRequest. Если в форме используется отправка файлов, то этот режим выбирается автоматически.
    
  • data ^object - параметры запроса.
    
  
  

Создает палитру для выбора цвета.
Аргументы:

• did ^string - глагол прошедшего времени в английском языке id элемента, куда будет помещен выбор цвета.
  
• fid ^string - id элемента (допускаются только элементы форм, т.е. имеющие аттрибут value), куда будет записан HEX код цвета. К слову: не разрешается использовать символ кавычки ".
  

Вставляет видеоплеер в элемент с id="id".
Аргументы:

• opts ^object - опции:
  
  
  • url ^string - адрес видеофайла.
    
  • width ^integer - адрес видеофайла.
    
  • height ^integer - адрес видеофайла.
    
  
  
• id ^string - id элемента.
  

Вставляет аудиоплеер в элемент с id="id".
Аргументы:

• opts ^object - опции:
  
  
  • url ^string - адрес видеофайла.
    
  • autoplay ^boolean - автовоспроизведение.
    
  • loop ^boolean - зациклить воспроизведение.
    
  
  
• id ^string - id элемента.
  

Останавливает воспроизведение аудио во всех аудиоплеерах.
Создает слой-блокатор.

• id ^string - id, который будет назначен слою.
  
• opacity ^float - дробное число от 0 до 1, регулирующее непрозрачность слоя.
  
• backgroundColor ^string - цвет слоя.
  
• fadeDuration ^integer - время появления.
  
• zIndex ^integer - z-index.
  

Устанавливает куку.
Аргументы:

• opts ^object - опции:
  
  
  • name ^string - имя куки.
    
  • value ^string - значение куки.
    
  • days ^integer - время жизни куки в днях.
    
  • path ^string - путь.
    
  • domain ^string - домен.
    
  
  

Подключает внешний .js файл и помещает его в head документа.
Аргументы:

• src ^string - URL.
  
• id ^string - ID, который будет присвоен созданному элементу script.
  

Возвращает строку, где символы '"<&> заменены на соответствующие им HTML-сущности.
Рекурсивный дамп простых обьектов (Не используйте с DOM элементами - это грозит бесконечным циклом). Не работает с функциями.
Создает кнопку в U.Стиле.
Аргументы:

• frm ^string - ID формы. Для submit кнопки нужно для запуска submit-кнопки формы с аттрибутом id="submfrm"
  
• type ^{'s' | 'b' | 'r'} - тип создаваемой кнопки. Submit, Button, Reset.
  
• opts ^object - обьект с настройками:
  
  
  • text ^string - текст кнопки
    
  • content ^string - дополнительные аттрибуты. Например, 'onclick="alert('clicked!')"'
    
  • style ^integer - Определяет вид кнопки
    

Делает кнопку с id="id" активной / неактивной.

• id ^{string|object} - ID кнпоки или DOM-узел.
  

Возвращает HTML-код невидимой кнопки sumbit для формы с id="frm".

• frm ^string - ID формы.
  

Класс _uSlider
Используется для создания ползунка.
Вид вызова:

Где:

• moverID ^{string | object} - ID элемента ил сам элемент, который станет ползунком.
  
• type ^string - тип ползунка. Принимает значения 'v' или 'h' (Для вертикального и горизонтального, соответственно).
  
• minV ^intger - начальное значение.
  
• maxV ^intger - конечное значение.
  
• opts ^object - дополнительные параметры:
  
  
  • step ^intger - шаг изменения значения (По-умолчанию 0).
    
  • initval ^intger - значение при инициализации (По-умолчанию среднее между начальным и конечным значениями).
    
  • disabled ^boolean - отключен ли ползунок при инициализации.
    
  • minpos ^integer - значение в пикселях, соответствующее начальному значению.
    
  • maxpos ^integer - значение в пикселях, соответствующее конечному значению.
    
  • hotspot ^integer - значение в пикселях, соответствующее значению при инициализации.
    
  • thispar ^object - объект this для обработчиков событий.
    
  • onchange ^function - функиця, вызывающаяся при изменении значения (передвижении ползунка). Принимает следующие значения:
    
    
    • newvalue ^integer - значение.
      
    • user_param ^mixed - Пользовательский параметр (см. ниже).
      
    • sliderobj ^object - Сам ползунок.
      
    
    
  • param ^mixed - объект this для обработчиков событий.
    

Дополнительные методы класса:
Устанавливает ползунку (в переменной uSlider) значение newVal.

Класс _uSuggestList
Используется для создания автозаполнения для полей ввода.
Вид вызова:

Где:

• name ^string - уникальное имя.
  
• inputId ^{string | object} - задает целевой input. Принимается либо DOM-объект, либо строка с ID.
  
• opts ^object - объект с опциями:
  
  
  • design ^string - дизайн. Является ключем объекта _uSuggestList.designs. Пример такого объекта:
    Code

    std : {
    suggest_init: function (o) {
    var p = {};
    $(o.obj).attr("class", "x-selectable u-suggedit " + $(o.obj).attr("class"));
    $(o.top).append('<div class="u-sugglist" style="zoom:1"><div style="zoom:1"><table border="0" cellspacing="0" class="x-unselectable u-suggcont" width="100%"></table></div></div>');
    p.list = $(o.top).find(".u-sugglist")[0];
    p.content = $(o.top).find(".u-suggcont")[0];
    $(o.top).find("div,span,table").andSelf().attr("unselectable", "on");
    return p
    },
    append_row: function (o, a, b, c) {
    var d = o.parts.content.insertRow( - 1);
    $(d).bind("mousedown", o, o._onrowmousedown).bind("mousemove", o, o._onrowmousemove).bind("mouseover", o, o._onrowmouseover).addClass('u-suggrow').attr("usuggeststr", a[0]);
    var v = String(a[0]);
    if (v.toLowerCase().substr(0, c.length) == c.toLowerCase()) v = '<span class="u-suggmark">' + v.substr(0, c.length) + '</span>' + v.substr(c.length);
    for (var j = 0; j < b; j++) {
    $(d).append("<td unselectable='on' class='u-suggcell" + j + "'>" + (j == 0 ? v: a[j]) + "</td>")
    }
    },
    _select: function (o, a) {
    $(a).addClass("u-suggrowhl")
    },
    _deselect: function (o, a) {
    $(a).removeClass("u-suggrowhl")
    }
    }
    
    
  • maxlistheight ^{'auto' | integer} - максимальная высота окошка.
    
  • colwidth ^array - ?
    
  • minlen ^integer - минимальная длина введенного значения (в input).
    
  • url ^string - адрес для подгрузки содержимого.
    
  • separator ^string - символ разделителя значений в input.
  
  
• vals^array - уже полученные значения для автозаполнения (будут помещены в кеш).

Как работает _uSuggestList
На input вешаются обработчики событий onblur, onkeydown, onkeyup. Причем, только последний инициализует запрос (кому интересно - смотрим _uSuggestList.prototype.onblur, _uSuggestList.prototype.onkeydown и _uSuggestList.prototype.onkeyup). Скрипт обращается по адресу opts.url + '&tag=' + tag, где tag - набираемое значение. В ответ получает JSON массив вроде

Где элементы массива:

• 0 - запрошеный текст.
  
• 1 - некоторое значение, определяющее шаг в цикле (может быть от 1 до 10 включительно).
  
• 2, 3, 4, ... - значения, которые будут показаны пользователю.