Створення власних вузлів

Властивості вузла

Властивості вузла означуються об’єктом defaults у його HTML-оначенні. Це властивості, які передаються функції конструктора вузла, коли під час виконання створюється екземпляр вузла .

У прикладі з розділу створення вашого першого вузлу вузол мав єдину властивість під назвою name. У цьому розділі ми додамо до вузла нову властивість, яку називають prefix :

1.Добавлення нового запису до об’єкту defaults:

 defaults: {
     name: {value:""},
     prefix: {value:""}
 },

Запис включає value за замовчуванням, яке слід використовувати, коли новий вузол цього типу перетягується на робочу область.

2.Додайте запис до шаблону редагування для вузла

 <div class="form-row">
     <label for="node-input-prefix"><i class="icon-tag"></i> Prefix</label>
     <input type="text" id="node-input-prefix">
 </div>

Шаблон повинен містити елемент <input> з id, встановленим в node-input-<propertyname>.

3.Використання властивості у вузлі

 function LowerCaseNode(config) {
     RED.nodes.createNode(this,config);
     this.prefix = config.prefix;
     var node = this;
     this.on('input', function(msg) {
         msg.payload = node.prefix + msg.payload.toLowerCase();
         node.send(msg);
     });
 }

Означення властивості

Записи в об’єкті defaults повинні бути об’єктами і можуть мати такі атрибути:

value : (any type) значення за замовчуванням, яке приймає властивість
required : (boolean) необов’язково, вказує на обов’язковість властивості. Якщо встановлено значення true, властивість буде недійсною, якщо його значення є null або порожній рядок.
validate : (function) необов’язкова функція, яка може бути використана для перевірки значення властивості.
type : (string) необов’язково, якщо це властивість є вказівником на configuration node, це ідентифікує тип вузла .

Зарезервовані імена типів

Існує кілька зарезервованих імен для властивостей, які не можна використовувати. Це:

type`, `x`, `y`, `z`, `wires`, `outputs

If a node wants to allow the number of outputs it provides to be configurable then outputs may be included in the defaults array. The Function node is an example for how this works.

Якщо вузол хоче дозволити кілька виходів, які він надає, можна налаштувати на outputs можуть бути включені до масиву defaults . Вузол Function - приклад того, як це працює.

Валідація властивості

Редактор намагається перевірити всі властивості, щоб попередити користувача, якщо вказані недійсні значення.

Для вказівки того, що властивість має бути ненульовою та не порожньою може бути використаний атрибут required .

Якщо потрібна більш конкретна перевірка, може бути використаний атрибут validate , який вказує функцію, яка перевіряє значення на правильність. Функція передає значення і повинна повертати істинну або хибність. Вона викликається в контексті вузла, тому для доступу до інших властивостей вузла може використовуватися this. Це дозволяє перевірити залежність від інших значень властивості. Під час редагування вузла об’єкт this відображає поточну конфігурацію вузла а НЕ поточне значення елемента форми. Функція валідатора повинна намагатися отримати доступ до елемента конфігурації властивості та взяти об’єкт this як резервний, щоб досягти потрібного досвіду користувача.

Існує група загальних функцій перевірки.

RED.validators.number() - перевірка значення на числовий тип
RED.validators.regex(re) - перевірка відповідності значення заданому регулярному виразу

Обидва способи - атрибут required та атрибут validate - відображаються в інтерфейсі користувача однаково. І коли значення недійсне або відсутнє відповідний запис підсвічується червоним .

Наступний приклад показує, як можна застосувати кожен із цих валідаторів.

defaults: {
   minimumLength: { value:0, validate:RED.validators.number() },
   lowerCaseOnly: {value:"", validate:RED.validators.regex(/[a-z]+/) },
   custom: { value:"", validate:function(v) {
      var minimumLength=$("#node-input-minimumLength").length?$("#node-input-minimumLength").val():this.minimumLength;
      return v.length > minimumLength
   } }
},

Зверніть увагу, що властивість custom є дійсною лише в тому випадку, якщо її довжина перевищує поточне значення властивості minimalLength або значення елемента minimumLength форми.

Діалог редагування властивості

Коли діалогове вікно редагування відкрито, редактор заповнює діалог шаблоном редагування для вузла.

Для кожної з властивостей масиву defaults шукається елемент <input> з id, встановленим вnode-input-<propertyname>. Потім цей вклад автоматично заповнюється поточним значенням властивості. Коли діалогове вікно редагування буде змінено, властивість приймає будь-яке значення у вхідному документі.

Тип <input> може бути text для властивостей string/number, або checkbox для булевих властивостей. Альтернативно, може використовуватися елемент <select> , якщо є обмежений набір варіантів.

Поведінка користувацьких налаштувань

Поведінка за замовчуванням працює у багатьох випадках, але іноді потрібно означити деяку поведінку, характерну для вузла. Наприклад, якщо властивість не може бути належним чином відредагована як простий <input> або <select>, або якщо вміст діалогового вікна редагування повинен мати певну поведінку залежно від того, які параметри вибрані.

Означення вузла може включати дві функції для налаштування поведінки редагування.

oneditprepare викликається безпосередньо перед відображенням діалогового вікна.
oneditsave викликається, коли діалогове вікно редагування буде підтверджено ok.
oneditcancel викликається, коли діалогове вікно редагування буде відмінено cancel.
oneditdelete викликається при натисканні у діалоговому вікні редагування вузла конфігурації кнопки видалення
oneditresize викликається, коли діалогове розмір вікна редагування буде змінено .

Наприклад, коли вузол Inject налаштований на повтор, він зберігає конфігурацію у вигляді кроноподібної рядки: 1,2 * * * *. Вузол означує функцію oneditprepare, яка може проаналізувати цей рядок і представити більш зручний користувальницький інтерфейс. Він також має функцію oneditsave, яка компілює вибрані користувачем параметри назад у відповідну рядок cron.