Module developer - Вклад участника [ru]

DevManual/en

2017-04-17T05:27:32Z

Ildar: Новая страница: «Example of processing new module settings»

<languages/>
=Module development guide=
==Definitions==

'''Module''' - is a component that allows you to control one type of equipment by its unique ID. The module is located in the store of modules.

'''Control panel (mobile device)''' - is a device from which the project i3 lite is launched (tablet, smartphone).

'''Store of modules''' - is a cloud server for uploading ready-made modules. The module store is available from the i3 lite application or on our[http://www.iridiummobile.ru/store/ site]

'''iRidium Studio''' - is a editor that allows to create the module to control device for i3 lite application. You need to use a special editor build for [http://www.iridiummobile.net/redirects/?go=iRidium_SETUP_LITE module developers] to develop the module

'''i3 lite''' - is an application to create, set and use i3 lite projects.

'''i3 lite project''' – is an automation project made up of ready equipment control modules. i3 lite projects differ from i2 Control projects: i3 lite projects can be edited dynamically without prior editing in iRidium Studio. i3 lite project consists of several small parts that can be put together into a single whole in i3 lite app with the help of the built-in constructor. It can also be easily edited in the app. As a result, a big number of intermediate processes are no longer necessary, such as installing software on PC, uploading projects on contol panels. All is done in one place - a control panel.

'''SubDevice''' - This is a virtual representation of the working area of the physical device. If we take as an example a 6-channel dimmer it has 6 sub-devices, because each independent device requires a separate control interface and connects to one channel.

'''Room (in i3 lite)''' - The visual part of i3 lite containing hardware management widgets. The project in i3 lite consists of rooms located on the floors

'''Widget''' - is a visual module component located in the room. It has limitations in size and fixed position in the room interface. It contains the main module functionality. For additional functions Remote is used.

'''Remote''' - is a visual module component which is hidden by default. It opens only when clicking on the corresponding item of the widget. It does not have size limitations (not more than the panel display size) and can be located in any part of the room interface (it is usually located in the middle of the panel display). It contains additional functionality of the module.

'''Macros''' - is a sequence of commands of various modules, which is activated by pressing. Contains "Action" and "Condition". For example, the macros "turn off all the lights in the house" will send the shutdown command to all devices responsible for lighting.

'''Routine''' - is a sequence of commands of various modules, which is activated automatically when a certain event occurs. Contains "Event", "Action" and "Condition". For example, "turn on the light if the motion sensor is triggered"

'''Event''' - is a routine component that describes the control command and the value range. If the value is sent in the indicated range, the routine is executed. For example, the event "Motion appeared" is activated if the motion sensor is triggered.

'''Action''' - is a component of macros and routines. It describes the control command and value that must be sent to the command. For example, "turn on the light". There are 2 types of Action: Simple Action and Advanced Action.

'''Simple Action''' - Simple Action is used when the command and Action value are known in advance.

'''Advanced Action''' - Advanced Action is used when the command is known but the value is unknown. The value is set dynamically when Action is used in i3 lite (but not when creating in iRidium studio).

'''Condition''' - is a component of macros and scenes. It describes the control command and value range. When a value from the value range is sent Action is executed.

'''Scanner''' - is a software part, that analyzes any bus looking for connected devices. Found connected devices are displayed in a list. Modules for the found devices are downloaded from iRidium store and the devices become available to control in i3 lite.
==Module concept==
The module is an independent subroutine of the i3 lite application which is built in the project and has an independent interface, driver and logic. Modules are developed in the [http://www.iridiummobile.net/redirects/?go=iRidium_SETUP_LITE iRidium Studio] editor and located in the module store [http://www.iridiummobile.ru/store/ iRidium Store]. Integrator downloads the module from the module store for each individual project.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ModuleInScheme.png]]</div></div>
</div>

There are two types of modules:
*Control module - module for hardware control
*Scanner - module for searching hardware in the local network and loading modules for found devices
== How to start developing the module ==
----

{{i}} Before starting your work, it is recommended to read [http://dev.iridiummobile.net/How_to_begin iRidium documentation]. It describes the basics of working with iRidium. The i3 lite documentation describes how to develop modules for the i3 lite platform for users, who already know iRidium. If you want to write script use [[Special:MyLanguage/Developers_API | i3 lite API]].
----

The module life cycle consists of:
* Developing the graphic part in iRidium studio
* Developing the driver part (scripts, devices)
* Testing
* Publishing in iRidium store
* Using (module download via the i3 lite application from the cloud and adding to automation projects)
<br/>
==Module structure ==
Each module must consist of subdevices. The subdevice is a virtual representation of the working area of a physical device. Many devices support multiple workgroups with the same functionality. Each workgroup may be in a separate zone. To fully control the zone, you need to create a subdevice for each workgroup of the device. For example, a 6-channel HDL dimmer contains 6 dimmable channels, through which 6 working groups can be controlled. Therefore, it is advisable to select in the module 6 subdevices for the possibility of creating actions, events and conditions for each workgroup separately. The presence of subdevice in the i3 lite module is obligatory. The number of sub-devices can be from one to many. Usually the number of subdevice is equal to the number of channels of the controller, the number of its work areas or logical devices.

Subdevice consists of:
* Conditions
* Actions
* Events
* Widgets

Conditions, actions and events are logical elements of the subdevice, on their basis macros and routines are created. Widget is a graphical element, through which the user will control subdevice. Usually one subdevice contains one widget, but the number of conditions, actions and events varies (from zero to many). The number of subdevices in the module can be either fixed or not. For example, you can develop a module only for a 6-channel dimmer, and you can make a module that will request the hardware for the number of subdevices and create the required number of subdevices.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ModuleStruct.png]]</div></div>
</div>
==Creating the module interface ==
The interface part of the midule consists of:
* widgets - interface part of the subdevice, which is located in the rooms and has basic control functions
* Remote - interface part of the module, which has a set of device functions and opens to the full screen, when you click on the widget button
* Authorization window - Authorization is required to work with some devices. To do this, the developer can create a special authorization window that is available in the module settings
* The module settings window is a window where you need to enter the parameters for the module operation
картинка окна настроек модуля и кнопки открытия
The whole graphic part is drawn in the graphical interface of the iRidium studio editor. In contradistinction to i3 pro, the module's interface should be made up of ready-made graphic components located in the gallery.

==== Widget ====

Widget is a visual component of the module, a kind of Popup that will be displayed in the room. The main task of the widget is to display the basic controls of the subdevice and to provide a module transition to the Remote control of the subdevice. For example, to control a media player, you can place a volume slider or Mute button for quick access to adjusting the volume. The weather widget can display the current weather, and the control panel will contain the weather forecast for all 5 days.<br />
The module does not make sense without widget, because it will not have a graphical representation in the i3 lite project.

Widget has a limited size
# Width '''640'''
# Height can not exceed '''1200'''

[[Файл:Пример виджета.png|center|thumb|Рис. Widget example]]

To create a widget, click the Add pop-up button in the Project overview panel and in the appeared menu select popup type: "Widget", set the name and properties:
[[Файл:ПанельПопап.png|thumb|center]]

Properties of a created widget can be changed with the help of '''Object Properties'''.<br />
Graphic items are assigned to channels like in popups:
[[Файл:Связывание_канала_команды_и_графического_элемента.png|center|thumb|Рис. Связывание канала команды и графического элемента]]
Widget will be displayed:
* In the room when a client uses the project
[[Файл:В_комнате_при_использовании_пользователем_проекта.png|center|thumb|]]
* In the module settings when it is added to the project:
[[Файл:И_в_настройках_модуля_при_добавлении_его_в_проект.png ‎|center|thumb|]]
====Remote and other graphic windows====

Remote (a remote control) is a graphical area to control SubDevices. Unlike wigets, it can have free size and position. And it is displayed on call. Remote is displayed when a button to go to the remote control is pressed on a widget.
Items to control equipment are placed on Remote (buttons, lists, switches, levels). There can be from 0 to several remote controls. Example of Remote:<br />
[[Файл:Пульт_управления.png ‎|center|thumb|]]<br />

Remote is created like a Widget. The only difference is to select "Remote" when you click "Add Popup Page" in the "Device Type" property.
==Interface design standard==
For the convenience of interface design, a standard was developed in which graphic windows should be developed in the module so that the modules of different developers looked uniformly within the framework of one project.
===Basic principles===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:GeneralUI.png]]</div></div>
<div class="col-sm-12 col-md-6">
Виджет состоит из «Header» и дополнительных модулей основного функционала. <br/>
«Header» — верхний модуль виджета.<br/>
«Header» содержит:<br/>
- наименование виджета;
- наименование устройства, которым<br/>
управляет виджет;<br/>
- иконка категории устройства.<br/>
<br/>
Дополнительные модули содержат элементы управления устройством.
</div>
</div>
===Module grid and blocks===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka1.png]]</div></div>
<div class="col-sm-12 col-md-6">
Module grid widget is a block 640 pt wide
And 120 pt in height. Each block has a grid of 8x8 pt.
The rounding of the corners is 12.5 ut. (Circle 25)
</div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka2.png]]</div></div>
<div class="col-sm-12 col-md-6">
The principle of constructing a widget block is a constructor from
Controls (buttons, switches, labels) from smaller to larger.
</div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka3.png]]</div></div>
<div class="col-sm-12 col-md-6">
Control items are combined and united in a block, blocks are united into a control panel.
</div>
</div>
===Buttons===
<big>'''Toggle'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Toggle.png]]</div></div>
<div class="col-sm-12 col-md-6">
Кнопка изменения значения «вкл/выкл». Применяется для отправки команды на устройство, вне зависимости от его текущего состояния.
</div>
</div>
<big>'''Switch'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Switch.png]]</div></div>
<div class="col-sm-12 col-md-6">
«On/off» switch. It is used only when the currect device status is known.
</div>
</div>
<big>'''Multistate'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Multistate.png]]</div></div>
<div class="col-sm-12 col-md-6">
Multistate button is used only when the current device status is known.
</div>
</div>
===Arrow-button===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:arrow1.png]]</div></div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:arrow2.png]]</div></div>
</div>
'''Действие кнопки'''<br/>
При нажатии на кнопку происходит вызов «PopUp».<br/>
'''Содержимое «PopUp»'''<br/>
«Input field», «Single selection», «Multiple selection».
===Sliders===
<div class="row">
<div class="col-sm-12 col-md-6">
Standart
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:StandartSlider.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
Value
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ValueSlider.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
Progress
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ProgressSlider.png]]</div></div>
</div>
===Description===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Description.png]]</div></div>
===Icons===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Icons1.png]]</div></div>
All icons are devided by their spheres of use, their main differene is the size.
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Icons2.png]]</div></div>
===«Header» widget===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:WidgetHeader.png]]</div></div>
===Icon location===
<div class="row">
<div class="col-sm-12 col-md-6">
The standard is 128х120 pt
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:FormFactor.png]]</div></div>
</div>
All buttons have two states - active and inactive
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:OFFicon.png]]</div></div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ONicon.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
When the button in inactive the color is always # 848484 or RGB 132
</div>
<div class="col-sm-12 col-md-6">
The state of a button is considered active, when the action received feedback and is short or instant (e.g. «Play» in a media player) or an acrion that is active for a long time and demands another activity to switch off the active state (e.g. «Repeat» in a media player).
</div>
</div>
==Basics of working with scripts==

To design an interface and to add a driver, you are to develop the logics of module work via script. The script part of developing i3 lite modules has a number of special features. Before developing the script part of i3 lite modules, please, read [http://dev.iridiummobile.net/JS_Guide iRidium Pro API] and [[Special:MyLanguage/Developers_API | i3 lite API]]. <br />

A module can contain any number of scripts. There are several types of scripts for modules:
* Driver - script files of this type contain script, responsible for working with a driver
* GUI - script files of this type contain script, responsible for working with graphics
* Common - script files of this type must contain general scripts, such as a set of additional functions or a description of classes of secondary importance
* Setup - a special script file that contains information about module setting, a list of fields that are obligatory to fill in, types of these fields and functions that check the correctness of entered data.

Devision into types is necessary for the module correct work on the server. Only logics and the driver part work on the server, but the server knows nothing about the graphic part. That's why a module developer has to devide scripts into types. The server does not notice files for working with the graphic part. <br />

When modules are developed module names have to be used instead of IR. Thus, a listener looks this way module.AddListener… <br />

Каждый скриптовой файл должен начинаться со слушателя
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_MODULE_START, 0, function(){});
</syntaxhighlight>
Это новый вид события, предназначенный специально для разработки модуля. При разработке модуля следует учитывать что скриптовой файл стал закрыт для других скриптовых файлов. Это хзначить что теперь можно использовать одноименные переменные и названия функций в разных скриптовых файлах и они не будут перезаписываться, но это накладывает ограничение: нельзя получить доступ к функции из другого скриптового файла простым способом. Для получения доступа к функции из другого скриптового файла, следует импортировать скриптовый файл с помощью команды module.Import("FileName.js"). <br />
Example:<br/>
<syntaxhighlight lang="javascript">
//Name_1.js - first js file
this.Text = "Hello, world!"; //Pointer to a text variable
//Name_2.js - second js file
var Text = module.Import("Name_1.js").Text; //Importing an object with a pointer to a text variable from the first js file
IR.Log(Text); //"Hello, world!" //log the text variable
</syntaxhighlight>
==Creating a subdevice==
The basis of every module is subdevices. The task of every module developer is to define how many subdevices a module has and to develop the logics of subdevice work. Each subdevice may contain a widget, a remote control, a set of actions, events and states. All contents of a subdevice have to be indicated when a subdevice is created. Subdevice contents can't be changed during module work. The following command is used to create a subdevice:<br/>
<syntaxhighlight lang="javascript">
module.AddSubDevice(SystemName, [Device], [System], [Type], [Tags], [Name], [Callback]);
</syntaxhighlight>
where<br/>
'''SystemName''' - subdevice system name<br/>
'''Device''' - a driver to which a subdevice will be assigned<br/>
'''System''' - old parameter, "false" is to be used<br/>
'''Type''' - type of smart device. Parameter is under development<br/>
'''Tags''' - Array of virtual tag objects<br/>
'''Name''' - subdevice name that is displayed to the user<br/>
'''Callback function(){do somethings}''' - a function that is on till the IR.EVENT_ADD_SUBDEVICE event happens.<br/>
As a reply the function returns a link to a subdevice, that can be used to address it.<br/>
An example of creating subdevices for HDL Relay devices. The script checks th number of devices in the bus and creates subdevices.<br/>
<syntaxhighlight lang="javascript">
for (var count = 1; count <= COUNT_CHANNEL; count++) {
// Creating a subdevice
l_oSubDevice = module.AddSubDevice("Relay " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_RELAY);
// Creating StatusOnStart command
if (count == 1)
l_oSubDevice.AddChannel("Relay:statusOnStart", [ChannelData]);
var l_sChannelName = "Relay:channel" + count;
// Adding channels
l_oSubDevice.AddChannel(l_sChannelName, [ChannelData]);
l_oSubDevice.AddTag(l_sChannelName, [ChannelData]);
// Add a virtual tag
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_TAG_POWER, true);
};</syntaxhighlight><br/>
Everything that is required can be added to a subdevice this way. An event is activated when a subdevice is created.<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function, [pointer]);
</syntaxhighlight><br/>
A link to a subdevice that was created is sent to a function. Different components can be added to subdevice in this event, such as, actions, events, states, widgets, chanels, tags. For example,<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function(in_oSubDevice){
Creating actions
in_oSubDevice.AddAction("On", false, in_oSubDevice.SystemName + "_Power", lightID + "_1", IR.SUB_DEVICE_COMMAND_POWER_ON);
in_oSubDevice.AddAction("Off", false, in_oSubDevice.SystemName + "_Power", lightID + "_0", IR.SUB_DEVICE_COMMAND_POWER_OFF);
Creating events
in_oSubDevice.AddEvent("On", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "1");
in_oSubDevice.AddEvent("Off", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "0");
Creating states
in_oSubDevice.AddCondition("On", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "1");
in_oSubDevice.AddCondition("Off", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "0");
});</syntaxhighlight><br/>
Thus, a developer can create the required number of subdevices when a module is installed or when new subdevices are added manually.
==Adding a widget to a subdevice==

After an interface is created in the studio and a function to add subdevices is added, create a copy of a widget for each subdevice and assign it to the subdevice. To assign a widget to a subdevice the following method is used.<br/>
<syntaxhighlight lang="javascript">SubDevice.addWidget(in_Widget)</syntaxhighlight><br/>


The input parameter of the method is '''in_Widget''' - an object, a widget, created in the studio beforehand.<br />
The output parameter of the method is '''True''' or '''False''' (successful or not).<br />
For example, we have 3 lamps. Not to create a separate wiget for each lamp, use a ready template and clone it. Here is an example of creating widgets with the help of a code using the existing template .<br />

Clone method allows to clone an existing popup.<br/>
<syntaxhighlight lang="javascript">Module.ClonePopup (in_Popup, in_Name)</syntaxhighlight><br/>
Входные параметры метода:
*'''in_Name''' - имя нового виджета.<br/>
*'''in_Popup''' - ссылка на всплывающее окно.<br/>
Выходным параметром метода является: успешно или нет ('''True''', '''False''').<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function(in_oSubDevice){
var popup = module.GetPopup("Dimmer"); // Calling a widget that we want to clone
// Creating a widget using cloning method
var widget = in_oSubDevice.addWidget(module.ClonePopup(popup, "Dimmer"+ in_oSubDevice.Name));
});</syntaxhighlight><br/>
----
{{i}} Names of new widgets must not be repeated
----
When a complete remote control is opened it is necessary to remmeber that a user will use the module both on a tablet and on a smart phone. The difference betwen the screen sizes makes a developer design 2 types of windows: a version for smart phones and a version for tablets. In addition a method must be added to the script that asks the system about the type of device where a module is launched and open the required window.
<syntaxhighlight lang="javascript">
if (IR.DisplayType == IR.DISPLAY_TYPE_PHONE) { //If a module is opened on a smart phone
var l_oPopupScanner = module.GetPopup("Phone"); //show a popup created for a smart phone
}
else {
var l_oPopupScanner = module.GetPopup("Tablet");//If a module is opened on a tablet, show a popup for a tablet
}
</syntaxhighlight><br/>
==Work with channels and tags==
After creating a subdevice and adding a widget you must add to the subevice channels and tags required for its work. Like in i3 pro version, a driver can be added in the studio or via script. Each subdevice requires a personal set of channels and tags for the selected driver. You may work with the following three components:<br/>
*Channel. The following method is used to create a channel<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddChannel(Name, DataArray)
</syntaxhighlight>where<br/>
'''Name''' - channel name<br/>
'''DataArray''' - data array (specific for every driver)<br/>
*Tag The following method is used to create a tag<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddTag(Name, DataArray)
</syntaxhighlight>where<br/>
'''Name''' - tag name<br/>
'''DataArray''' - data array, specific for every driver<br/>
*Virtual tag. The following method if used to create a virtual tag<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddVirtualTag(Name, Value, [Edit], [smartID], [Hidden])
</syntaxhighlight>where<br/>
'''Name'''- name of a subdevice virtual tag<br/>
'''Value''' - Tag value<br/>
'''Edit''' - Permission to edit a tag<br/>
'''smartID''' - Parameter is under development! Set "false"<br/>
'''Hidden''' - Feature of a hidden tag<br/>
===An example of creating channels and tags when creating a subdevice===
<syntaxhighlight lang="javascript">
l_oSubDevice = module.AddSubDevice("Light " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_DIMMER);

// Adding channel StatusOnStart
if (count == 1)
l_oSubDevice.AddChannel("Dimmer:statusOnStart", [ChannelData]);

// Assigned to the variable name of the channel
var l_sChannelName = "Dimmer:channel" + count;

// Adding channels
l_oSubDevice.AddChannel(l_sChannelName, [ChannelData]);
l_oSubDevice.AddTag(l_sChannelName, [TagData]);

// Adding smart virtual tag
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_COMMAND_POWER, true);
l_oSubDevice.AddVirtualTag("Power On", 0, false, IR.SUB_DEVICE_COMMAND_POWER_ON, true);
l_oSubDevice.AddVirtualTag("Power Off", 0, false, IR.SUB_DEVICE_COMMAND_POWER_OFF, true);
l_oSubDevice.AddVirtualTag("Level", 0, false, IR.SUB_DEVICE_COMMAND_LEVEL, true);
</syntaxhighlight>
==Setting a module in the app==
Modules are stored in iRidium store and can be installed in the app using one of the following ways:<br/>
*With the help of a scanner<br/>
*Manually<br/>
===Developing the Setup file===
The Setup file must be developed for each variant. It's a special script file with fields that are required for module work. These fields can be device IP address, port, city name, etc. To develop a Setup file, create a new script file and select its type - "Setup". Eacn field is a tag and can be accessed from the script, and the input value can be received.
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:СетапБонго.png]]</div></div>
The Setup file consists of 2 parts. Part 1 is the driver settings. The settings must require IP addresses, ports and logins to connect the driver to a device. Part 2 is the module general settings, such as number of outputs, access keys.
To set fields in the Setip file set the following fields in the script:
* Field type - indicate what field must be shown to a user (text field, data array, etc. Detailed description is given in API)
* Field name - name of field that a user sees when setting a module
* Default value - what value must be put by default
* Check function - a function to validate value in the field. A function must be written that checks the correctness of the entered data.
For example,"Setup" script for HDL module looks this way:
<syntaxhighlight lang="javascript">
{
// Data to connect drivers, created in Project Device Panel
Drivers:
[
{
Name: "HDL-BUS Pro Network (UDP)",
Properties:
[
{
Type: "textfield",
Name: "Host",
DefaultValue: "255.255.255.255",
Validation: function(in_sValue) {
var l_aValueHost = in_sValue.split(".");
if (l_aValueHost.length != 4) {
return "Please input correct Host";
} else
if (parseInt(l_aValueHost[0], 10)>=0
&& parseInt(l_aValueHost[0], 10)<=255
&& parseInt(l_aValueHost[1], 10)>=0
&& parseInt(l_aValueHost[1], 10)<=255
&& parseInt(l_aValueHost[2], 10)>=0
&& parseInt(l_aValueHost[2], 10)<=255
&& parseInt(l_aValueHost[3], 10)>=0
&& parseInt(l_aValueHost[3], 10)<=255
)
return 0
else
return "Please input correct Host";
}
},
{
Type: "textfield",
Name: "Port",
DefaultValue: "6000",
Validation: function(in_sValue) {
if(parseInt(in_sValue, 10)>=0)
return 0
else
return "Please input correct Port";
}
}
]
}
],

// General information for the module (driver and generated by script)
Module: [{
Name: "Channels Count",
Validation: function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input Count";
}
},
{
Type: "textfield",
Name : "SubnetID",
Validation : function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input SubnetID";
}
},
{
Type: "textfield",
Name : "DeviceID",
Validation : function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input DeviceID";
}
}

]
}
</syntaxhighlight>
To get data from Setup fields use the following function
<syntaxhighlight lang="javascript">
module.GetProperty("Field name")
</syntaxhighlight>
<br />
Besides standard parameters, any parameters required for module inizialization can be asked. Driver parameters are set in the driver automatically. The other parameters are to be asked and used manually.<br />
An example of work with Setup parameters
<syntaxhighlight lang="javascript">
var COUNT_CHANNEL = parseInt(module.GetProperty("Channel count")); // Getting count channel
var SubNetID = parseInt(module.GetProperty("SubnetID")); // Getting subnet id
var DeviceID = parseInt(module.GetProperty("DeviceID")); // Getting device id
</syntaxhighlight>
===Installing a module manually===
To install a module manually no additional script development is required. A user must go to iRidium store from the app, find a module, download it and enter date in the fields indicated in the Setup file. After it the app installs the module in the system with parameters entered by a user.
===Installing a module with the help of a scanner===
'''Scanner (сканер)''' - это модуль, который анализирует какую-либо шину на подключённые устройства либо ищет устройства в локальной сети. Найденные устройства формируются в список, для выбранного устройства качается модуль и становится доступен в i3 lite. <br/>
Схема работы сканера:
# Сканер загружается из магазина;
# Пользователь вводит параметры сканера (IP, Port и т.д) и эти параметры передаются в скрипт сканера;
# Сканер, обработав введенные параметры, опрашивает шину на устройства или ищет устройства в локальной сети;
# Из полученных устройств формируется список;
# При выборе определенного устройства в списке, сканер передаёт параметры выбранного устройства в модуль.
<br/>
При разработке сканера нужно учесть:
* Параметры сканера, при добавлении из магазина;
* Логику сканера;
* Передачу параметров выбранного устройства в модуль;
* Логику модуля, с учётом переданных от сканера параметров.
<br/>
Процесс разработки сканера ничем не отличается от разработки модуля. Точно также сканеру необходимо нарисовать визуальную часть, создать драйвер и написать скрипт с логикой. Основным отличием является то, что сканер может работать только на панели управления и сканер никогда не будет запущен на сервере, поэтому, при разработке скриптов, нет необходимости разделять скрипты на драйверные и интерфейсные.
<br/>
Также при разработке сканера появляется новая логика работы. Первым делом необходимо сделать модуль для управления устройством, далее надо загрузить модуль в магазин модулей. При загрузке модуля, вы увидите уникальный идентификатор вашего модуля. Когда вы будете разрабатывать сканер, вам необходимо написать скрипт со следующей логикой:
# Создание драйвера
# Поиск оборудования
# Если оборудование найдено, надо определить что это за оборудование
# При помощи команды ModuleSetupFinish (ID модуля, js объект с настройками setup данного модуля)
После этого приложение скачет модуль из магазина модулей и установит его.<br/>
The distinctive feature of developing a scanner is the event that lauches the driver work. When developing a scanner use the following event
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_OPEN_SCANNER, 0, function (){});
</syntaxhighlight>
A scanner must be developed after modules are developed. The developed modules are registered in the store of modules and are given a unique ID. After a scanner finds devices in the local net, the script must download a module for the found equipment by the indicated ID. To download a module use the following function
<syntaxhighlight lang="javascript">
IR.ModuleSetupFinish(StoreID, ModuleData, [Callback])
</syntaxhighlight>
where
* StoreID - module ID in the store of modules
* ModuleData - data required for installing a module (fields in Setup)
* Callback - a function to process errors that happened in the installation process (optional)
An example of a developed scanner for HDL modules. To install any module the following parameters are required: Type,SubNet id, Device id, module name, bus IP address, port.
<syntaxhighlight lang="javascript">
//Example of installing HDL Dimmer with a scanner
var l_nStoreID = 82;
var l_oModuleData = {
Module: {
//Data required for module work
Type: "Dimmer",
SubnetID: 3,
DeviceID: 6
Name: "HDL Dimmer"
}
Drivers: {
//Data for the driver
"HDL-BUS Pro Network (UDP)": {
Host: "255.255.255.255", //installing a host for the driver
Port: "6000" //installing a port for the driver
},
}
}

IR.ModuleSetupFinish(l_nStoreID, l_oModuleData, function(in_error){
if (!in_error){
...
} else {
...
}
});
</syntaxhighlight>
===Adding subdevices manually===
After adding the subdevices via the scanner or Setup, the user may have a need to add other subdevices. To ensure this, module developer has to assign the system variable
<syntaxhighlight lang="javascript">
SettingsPopupName = module.GetPopup('AddSubDevicePopup');
</syntaxhighlight >
You have to assign a window with the results of the scanner operation or a popup in which the user can configure a new subdevice or add this subdevice. This popup should be developed by the developer himself.<br/>
If the popup is assigned to the specified system variable, the user will see a "+" button in the module settings section. This button opens the specified popup
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:AddSubdeviceBtn.png]]</div></div>
</div>
Example of specifying the adding subdevices window. When developing, you need to create an adding window in the tablet resolution and a separate window in the smartphone resolution
<syntaxhighlight lang="javascript">
module.SettingsPopupName = IR.DisplayType != IR.DISPLAY_TYPE_TABLET? module.GetPopup("phone:NoAuthorize").Name: module.GetPopup("NoAuthorize").Name;
</syntaxhighlight >
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:AddSubdeviceWindow.png]]</div></div>
</div>
===Authorization===
To work with certain devices a user's authorization in a third-party system is required. i 3lite app has a special authorization mechanism for this purpose.<br/>
To authorize a user has to enter his access data in a special window. This window is unique for every device and a module developer must create it. A window to enter data is a popup with fields to enter data. The popup is created with the help of standard means of the studio and it may be unassigned to any subdevices. When access data are entered, the script must authorize in a third-party system and close the authorization window. After creating an authorization popup, a developer must call the authorization system variable in the script and assign the created popup in the variable.
<syntaxhighlight lang="javascript">
AuthorizationPopupName = module.GetPopup("AutorisationPopup");
</syntaxhighlight ><br/>
After an authorization popup is assigned to a variable, "Authorize" button appears in the module settings.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:NeedAuthorization1.png]]</div></div>
</div>
When this button is pressed, the app opens the authorization popup, assigned in the script. The next task for a module developer is to display a user's status (Authorized or not). There is a system variable to solve this task.
<syntaxhighlight lang="javascript">
AuthorizationStatus = true;
</syntaxhighlight ><br/>
If a user is authorized in the system, true value is assigned to the variable and the app changes the status of the authorization button into:
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Logout1.png]]</div></div>
</div>
A module devloper must also think about the mechanism of deauthorization. It is done on the authorization popup.<br/>
An example of the authorization script
<syntaxhighlight lang="javascript">
if (module.AuthorizationStatus == false) { //If a user is not authorized
module.AuthorizationPopupName = WindowSettings.Window.Name;//Assigning the authorization popup created earlier
} else if (module.AuthorizationStatus) //If a user is authorized
{
module.AuthorizationPopupName = IR.DisplayType != IR.DISPLAY_TYPE_TABLET? module.GetPopup("phone:deAuth").Name: module.GetPopup("deAuth").Name;//Showing the deauthorization popup
}
</syntaxhighlight ><br/>
Note. Remember to create a separate authorization/deauthorization popup for a smart phone and for a tablet.
===Changing settigns===
While working with the application, there may be a need to change the settings of the module. To provide such an opportunity, the module developer must create a function to change the module settings and assign it to the system method
<syntaxhighlight lang="javascript">
module.ChangeProperties = function (in_oSetup)
{
Processing of new module parameters
}
</syntaxhighlight>
When declaring this function, the application will add an edit settings button in the module.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ChangeBtn.png]]</div></div>
</div>
When the user clicks on this button, the application opens the Setup window that was used to install the module. In this window, the user enters new settings and presses the "Done" button. After that, the application runs the above function. The driver settings can be changed by the application itself, other module settings developer must change manually. New settings are written to the input parameter in_oSetup as a JSON line.<br/>
Also in this function you need to process the success of changing settings. The flag is responsible for this.
<syntaxhighlight lang="javascript">
module.FinishUpdateSettings = true;
</syntaxhighlight>
If the installation of new parameters was successful, then the value of the flag should be set to "true", and the opposite case should be "false". This allows the application to understand that the parameter change failed (if the status of the variable is "false") and the application will cancel the driver settings change, returning the old settings<br/>
Example of processing new module settings
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_MODULE_START, 0, function(){
module.ChangeProperties = function (in_oSetup, in_oModule) {
if (typeof (in_oSetup) == "string")
in_oSetup = JSON.Parse(in_oSetup);
var l_nChannel = in_oSetup.Module["Channel count"];
if (l_nChannel >= COUNT_CHANNEL) {
module.FinishUpdateSettings = true;
// Recreating element on cycle
for (var count = 1; count <= in_nChannel; count++) {

// Creating subDevice
l_oSubDevice = module.AddSubDevice("Relay " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_RELAY);

// Create revers
if (!l_oSubDevice.GetProperty("Reverse"))
l_oSubDevice.SetProperty("Reverse", 0);

// Assigned to the variable name of the channel
var l_sChannelName = "Relay:channel" + count;

// Adding channels
l_oSubDevice.AddChannel(l_sChannelName, Data);
l_oSubDevice.AddTag(l_sChannelName, Data);

// Adding smart virtual tag
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_TAG_POWER, true);
};
}
else {
for (var count = 1; count <= COUNT_CHANNEL; count++)
if (l_nChannel < count) {
var l_oDeleteSubDevice = module.GetSubDevice("Relay " + count);
module.DeleteSubDevice (l_oDeleteSubDevice.ID);
};
};
};
});
</syntaxhighlight>

Translations:DevManual/210/en

2017-04-17T05:27:31Z

Ildar: Новая страница: «Example of processing new module settings»

Example of processing new module settings

DevManual/en

2017-04-17T05:26:21Z

Ildar: Новая страница: «If the installation of new parameters was successful, then the value of the flag should be set to "true", and the opposite case should be "false". This allows the…»

<languages/>
=Module development guide=
==Definitions==

'''Module''' - is a component that allows you to control one type of equipment by its unique ID. The module is located in the store of modules.

'''Control panel (mobile device)''' - is a device from which the project i3 lite is launched (tablet, smartphone).

'''Store of modules''' - is a cloud server for uploading ready-made modules. The module store is available from the i3 lite application or on our[http://www.iridiummobile.ru/store/ site]

'''iRidium Studio''' - is a editor that allows to create the module to control device for i3 lite application. You need to use a special editor build for [http://www.iridiummobile.net/redirects/?go=iRidium_SETUP_LITE module developers] to develop the module

'''i3 lite''' - is an application to create, set and use i3 lite projects.

'''i3 lite project''' – is an automation project made up of ready equipment control modules. i3 lite projects differ from i2 Control projects: i3 lite projects can be edited dynamically without prior editing in iRidium Studio. i3 lite project consists of several small parts that can be put together into a single whole in i3 lite app with the help of the built-in constructor. It can also be easily edited in the app. As a result, a big number of intermediate processes are no longer necessary, such as installing software on PC, uploading projects on contol panels. All is done in one place - a control panel.

'''SubDevice''' - This is a virtual representation of the working area of the physical device. If we take as an example a 6-channel dimmer it has 6 sub-devices, because each independent device requires a separate control interface and connects to one channel.

'''Room (in i3 lite)''' - The visual part of i3 lite containing hardware management widgets. The project in i3 lite consists of rooms located on the floors

'''Widget''' - is a visual module component located in the room. It has limitations in size and fixed position in the room interface. It contains the main module functionality. For additional functions Remote is used.

'''Remote''' - is a visual module component which is hidden by default. It opens only when clicking on the corresponding item of the widget. It does not have size limitations (not more than the panel display size) and can be located in any part of the room interface (it is usually located in the middle of the panel display). It contains additional functionality of the module.

'''Macros''' - is a sequence of commands of various modules, which is activated by pressing. Contains "Action" and "Condition". For example, the macros "turn off all the lights in the house" will send the shutdown command to all devices responsible for lighting.

'''Routine''' - is a sequence of commands of various modules, which is activated automatically when a certain event occurs. Contains "Event", "Action" and "Condition". For example, "turn on the light if the motion sensor is triggered"

'''Event''' - is a routine component that describes the control command and the value range. If the value is sent in the indicated range, the routine is executed. For example, the event "Motion appeared" is activated if the motion sensor is triggered.

'''Action''' - is a component of macros and routines. It describes the control command and value that must be sent to the command. For example, "turn on the light". There are 2 types of Action: Simple Action and Advanced Action.

'''Simple Action''' - Simple Action is used when the command and Action value are known in advance.

'''Advanced Action''' - Advanced Action is used when the command is known but the value is unknown. The value is set dynamically when Action is used in i3 lite (but not when creating in iRidium studio).

'''Condition''' - is a component of macros and scenes. It describes the control command and value range. When a value from the value range is sent Action is executed.

'''Scanner''' - is a software part, that analyzes any bus looking for connected devices. Found connected devices are displayed in a list. Modules for the found devices are downloaded from iRidium store and the devices become available to control in i3 lite.
==Module concept==
The module is an independent subroutine of the i3 lite application which is built in the project and has an independent interface, driver and logic. Modules are developed in the [http://www.iridiummobile.net/redirects/?go=iRidium_SETUP_LITE iRidium Studio] editor and located in the module store [http://www.iridiummobile.ru/store/ iRidium Store]. Integrator downloads the module from the module store for each individual project.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ModuleInScheme.png]]</div></div>
</div>

There are two types of modules:
*Control module - module for hardware control
*Scanner - module for searching hardware in the local network and loading modules for found devices
== How to start developing the module ==
----

{{i}} Before starting your work, it is recommended to read [http://dev.iridiummobile.net/How_to_begin iRidium documentation]. It describes the basics of working with iRidium. The i3 lite documentation describes how to develop modules for the i3 lite platform for users, who already know iRidium. If you want to write script use [[Special:MyLanguage/Developers_API | i3 lite API]].
----

The module life cycle consists of:
* Developing the graphic part in iRidium studio
* Developing the driver part (scripts, devices)
* Testing
* Publishing in iRidium store
* Using (module download via the i3 lite application from the cloud and adding to automation projects)
<br/>
==Module structure ==
Each module must consist of subdevices. The subdevice is a virtual representation of the working area of a physical device. Many devices support multiple workgroups with the same functionality. Each workgroup may be in a separate zone. To fully control the zone, you need to create a subdevice for each workgroup of the device. For example, a 6-channel HDL dimmer contains 6 dimmable channels, through which 6 working groups can be controlled. Therefore, it is advisable to select in the module 6 subdevices for the possibility of creating actions, events and conditions for each workgroup separately. The presence of subdevice in the i3 lite module is obligatory. The number of sub-devices can be from one to many. Usually the number of subdevice is equal to the number of channels of the controller, the number of its work areas or logical devices.

Subdevice consists of:
* Conditions
* Actions
* Events
* Widgets

Conditions, actions and events are logical elements of the subdevice, on their basis macros and routines are created. Widget is a graphical element, through which the user will control subdevice. Usually one subdevice contains one widget, but the number of conditions, actions and events varies (from zero to many). The number of subdevices in the module can be either fixed or not. For example, you can develop a module only for a 6-channel dimmer, and you can make a module that will request the hardware for the number of subdevices and create the required number of subdevices.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ModuleStruct.png]]</div></div>
</div>
==Creating the module interface ==
The interface part of the midule consists of:
* widgets - interface part of the subdevice, which is located in the rooms and has basic control functions
* Remote - interface part of the module, which has a set of device functions and opens to the full screen, when you click on the widget button
* Authorization window - Authorization is required to work with some devices. To do this, the developer can create a special authorization window that is available in the module settings
* The module settings window is a window where you need to enter the parameters for the module operation
картинка окна настроек модуля и кнопки открытия
The whole graphic part is drawn in the graphical interface of the iRidium studio editor. In contradistinction to i3 pro, the module's interface should be made up of ready-made graphic components located in the gallery.

==== Widget ====

Widget is a visual component of the module, a kind of Popup that will be displayed in the room. The main task of the widget is to display the basic controls of the subdevice and to provide a module transition to the Remote control of the subdevice. For example, to control a media player, you can place a volume slider or Mute button for quick access to adjusting the volume. The weather widget can display the current weather, and the control panel will contain the weather forecast for all 5 days.<br />
The module does not make sense without widget, because it will not have a graphical representation in the i3 lite project.

Widget has a limited size
# Width '''640'''
# Height can not exceed '''1200'''

[[Файл:Пример виджета.png|center|thumb|Рис. Widget example]]

To create a widget, click the Add pop-up button in the Project overview panel and in the appeared menu select popup type: "Widget", set the name and properties:
[[Файл:ПанельПопап.png|thumb|center]]

Properties of a created widget can be changed with the help of '''Object Properties'''.<br />
Graphic items are assigned to channels like in popups:
[[Файл:Связывание_канала_команды_и_графического_элемента.png|center|thumb|Рис. Связывание канала команды и графического элемента]]
Widget will be displayed:
* In the room when a client uses the project
[[Файл:В_комнате_при_использовании_пользователем_проекта.png|center|thumb|]]
* In the module settings when it is added to the project:
[[Файл:И_в_настройках_модуля_при_добавлении_его_в_проект.png ‎|center|thumb|]]
====Remote and other graphic windows====

Remote (a remote control) is a graphical area to control SubDevices. Unlike wigets, it can have free size and position. And it is displayed on call. Remote is displayed when a button to go to the remote control is pressed on a widget.
Items to control equipment are placed on Remote (buttons, lists, switches, levels). There can be from 0 to several remote controls. Example of Remote:<br />
[[Файл:Пульт_управления.png ‎|center|thumb|]]<br />

Remote is created like a Widget. The only difference is to select "Remote" when you click "Add Popup Page" in the "Device Type" property.
==Interface design standard==
For the convenience of interface design, a standard was developed in which graphic windows should be developed in the module so that the modules of different developers looked uniformly within the framework of one project.
===Basic principles===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:GeneralUI.png]]</div></div>
<div class="col-sm-12 col-md-6">
Виджет состоит из «Header» и дополнительных модулей основного функционала. <br/>
«Header» — верхний модуль виджета.<br/>
«Header» содержит:<br/>
- наименование виджета;
- наименование устройства, которым<br/>
управляет виджет;<br/>
- иконка категории устройства.<br/>
<br/>
Дополнительные модули содержат элементы управления устройством.
</div>
</div>
===Module grid and blocks===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka1.png]]</div></div>
<div class="col-sm-12 col-md-6">
Module grid widget is a block 640 pt wide
And 120 pt in height. Each block has a grid of 8x8 pt.
The rounding of the corners is 12.5 ut. (Circle 25)
</div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka2.png]]</div></div>
<div class="col-sm-12 col-md-6">
The principle of constructing a widget block is a constructor from
Controls (buttons, switches, labels) from smaller to larger.
</div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka3.png]]</div></div>
<div class="col-sm-12 col-md-6">
Control items are combined and united in a block, blocks are united into a control panel.
</div>
</div>
===Buttons===
<big>'''Toggle'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Toggle.png]]</div></div>
<div class="col-sm-12 col-md-6">
Кнопка изменения значения «вкл/выкл». Применяется для отправки команды на устройство, вне зависимости от его текущего состояния.
</div>
</div>
<big>'''Switch'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Switch.png]]</div></div>
<div class="col-sm-12 col-md-6">
«On/off» switch. It is used only when the currect device status is known.
</div>
</div>
<big>'''Multistate'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Multistate.png]]</div></div>
<div class="col-sm-12 col-md-6">
Multistate button is used only when the current device status is known.
</div>
</div>
===Arrow-button===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:arrow1.png]]</div></div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:arrow2.png]]</div></div>
</div>
'''Действие кнопки'''<br/>
При нажатии на кнопку происходит вызов «PopUp».<br/>
'''Содержимое «PopUp»'''<br/>
«Input field», «Single selection», «Multiple selection».
===Sliders===
<div class="row">
<div class="col-sm-12 col-md-6">
Standart
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:StandartSlider.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
Value
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ValueSlider.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
Progress
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ProgressSlider.png]]</div></div>
</div>
===Description===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Description.png]]</div></div>
===Icons===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Icons1.png]]</div></div>
All icons are devided by their spheres of use, their main differene is the size.
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Icons2.png]]</div></div>
===«Header» widget===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:WidgetHeader.png]]</div></div>
===Icon location===
<div class="row">
<div class="col-sm-12 col-md-6">
The standard is 128х120 pt
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:FormFactor.png]]</div></div>
</div>
All buttons have two states - active and inactive
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:OFFicon.png]]</div></div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ONicon.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
When the button in inactive the color is always # 848484 or RGB 132
</div>
<div class="col-sm-12 col-md-6">
The state of a button is considered active, when the action received feedback and is short or instant (e.g. «Play» in a media player) or an acrion that is active for a long time and demands another activity to switch off the active state (e.g. «Repeat» in a media player).
</div>
</div>
==Basics of working with scripts==

To design an interface and to add a driver, you are to develop the logics of module work via script. The script part of developing i3 lite modules has a number of special features. Before developing the script part of i3 lite modules, please, read [http://dev.iridiummobile.net/JS_Guide iRidium Pro API] and [[Special:MyLanguage/Developers_API | i3 lite API]]. <br />

A module can contain any number of scripts. There are several types of scripts for modules:
* Driver - script files of this type contain script, responsible for working with a driver
* GUI - script files of this type contain script, responsible for working with graphics
* Common - script files of this type must contain general scripts, such as a set of additional functions or a description of classes of secondary importance
* Setup - a special script file that contains information about module setting, a list of fields that are obligatory to fill in, types of these fields and functions that check the correctness of entered data.

Devision into types is necessary for the module correct work on the server. Only logics and the driver part work on the server, but the server knows nothing about the graphic part. That's why a module developer has to devide scripts into types. The server does not notice files for working with the graphic part. <br />

When modules are developed module names have to be used instead of IR. Thus, a listener looks this way module.AddListener… <br />

Каждый скриптовой файл должен начинаться со слушателя
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_MODULE_START, 0, function(){});
</syntaxhighlight>
Это новый вид события, предназначенный специально для разработки модуля. При разработке модуля следует учитывать что скриптовой файл стал закрыт для других скриптовых файлов. Это хзначить что теперь можно использовать одноименные переменные и названия функций в разных скриптовых файлах и они не будут перезаписываться, но это накладывает ограничение: нельзя получить доступ к функции из другого скриптового файла простым способом. Для получения доступа к функции из другого скриптового файла, следует импортировать скриптовый файл с помощью команды module.Import("FileName.js"). <br />
Example:<br/>
<syntaxhighlight lang="javascript">
//Name_1.js - first js file
this.Text = "Hello, world!"; //Pointer to a text variable
//Name_2.js - second js file
var Text = module.Import("Name_1.js").Text; //Importing an object with a pointer to a text variable from the first js file
IR.Log(Text); //"Hello, world!" //log the text variable
</syntaxhighlight>
==Creating a subdevice==
The basis of every module is subdevices. The task of every module developer is to define how many subdevices a module has and to develop the logics of subdevice work. Each subdevice may contain a widget, a remote control, a set of actions, events and states. All contents of a subdevice have to be indicated when a subdevice is created. Subdevice contents can't be changed during module work. The following command is used to create a subdevice:<br/>
<syntaxhighlight lang="javascript">
module.AddSubDevice(SystemName, [Device], [System], [Type], [Tags], [Name], [Callback]);
</syntaxhighlight>
where<br/>
'''SystemName''' - subdevice system name<br/>
'''Device''' - a driver to which a subdevice will be assigned<br/>
'''System''' - old parameter, "false" is to be used<br/>
'''Type''' - type of smart device. Parameter is under development<br/>
'''Tags''' - Array of virtual tag objects<br/>
'''Name''' - subdevice name that is displayed to the user<br/>
'''Callback function(){do somethings}''' - a function that is on till the IR.EVENT_ADD_SUBDEVICE event happens.<br/>
As a reply the function returns a link to a subdevice, that can be used to address it.<br/>
An example of creating subdevices for HDL Relay devices. The script checks th number of devices in the bus and creates subdevices.<br/>
<syntaxhighlight lang="javascript">
for (var count = 1; count <= COUNT_CHANNEL; count++) {
// Creating a subdevice
l_oSubDevice = module.AddSubDevice("Relay " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_RELAY);
// Creating StatusOnStart command
if (count == 1)
l_oSubDevice.AddChannel("Relay:statusOnStart", [ChannelData]);
var l_sChannelName = "Relay:channel" + count;
// Adding channels
l_oSubDevice.AddChannel(l_sChannelName, [ChannelData]);
l_oSubDevice.AddTag(l_sChannelName, [ChannelData]);
// Add a virtual tag
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_TAG_POWER, true);
};</syntaxhighlight><br/>
Everything that is required can be added to a subdevice this way. An event is activated when a subdevice is created.<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function, [pointer]);
</syntaxhighlight><br/>
A link to a subdevice that was created is sent to a function. Different components can be added to subdevice in this event, such as, actions, events, states, widgets, chanels, tags. For example,<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function(in_oSubDevice){
Creating actions
in_oSubDevice.AddAction("On", false, in_oSubDevice.SystemName + "_Power", lightID + "_1", IR.SUB_DEVICE_COMMAND_POWER_ON);
in_oSubDevice.AddAction("Off", false, in_oSubDevice.SystemName + "_Power", lightID + "_0", IR.SUB_DEVICE_COMMAND_POWER_OFF);
Creating events
in_oSubDevice.AddEvent("On", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "1");
in_oSubDevice.AddEvent("Off", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "0");
Creating states
in_oSubDevice.AddCondition("On", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "1");
in_oSubDevice.AddCondition("Off", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "0");
});</syntaxhighlight><br/>
Thus, a developer can create the required number of subdevices when a module is installed or when new subdevices are added manually.
==Adding a widget to a subdevice==

After an interface is created in the studio and a function to add subdevices is added, create a copy of a widget for each subdevice and assign it to the subdevice. To assign a widget to a subdevice the following method is used.<br/>
<syntaxhighlight lang="javascript">SubDevice.addWidget(in_Widget)</syntaxhighlight><br/>


The input parameter of the method is '''in_Widget''' - an object, a widget, created in the studio beforehand.<br />
The output parameter of the method is '''True''' or '''False''' (successful or not).<br />
For example, we have 3 lamps. Not to create a separate wiget for each lamp, use a ready template and clone it. Here is an example of creating widgets with the help of a code using the existing template .<br />

Clone method allows to clone an existing popup.<br/>
<syntaxhighlight lang="javascript">Module.ClonePopup (in_Popup, in_Name)</syntaxhighlight><br/>
Входные параметры метода:
*'''in_Name''' - имя нового виджета.<br/>
*'''in_Popup''' - ссылка на всплывающее окно.<br/>
Выходным параметром метода является: успешно или нет ('''True''', '''False''').<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function(in_oSubDevice){
var popup = module.GetPopup("Dimmer"); // Calling a widget that we want to clone
// Creating a widget using cloning method
var widget = in_oSubDevice.addWidget(module.ClonePopup(popup, "Dimmer"+ in_oSubDevice.Name));
});</syntaxhighlight><br/>
----
{{i}} Names of new widgets must not be repeated
----
When a complete remote control is opened it is necessary to remmeber that a user will use the module both on a tablet and on a smart phone. The difference betwen the screen sizes makes a developer design 2 types of windows: a version for smart phones and a version for tablets. In addition a method must be added to the script that asks the system about the type of device where a module is launched and open the required window.
<syntaxhighlight lang="javascript">
if (IR.DisplayType == IR.DISPLAY_TYPE_PHONE) { //If a module is opened on a smart phone
var l_oPopupScanner = module.GetPopup("Phone"); //show a popup created for a smart phone
}
else {
var l_oPopupScanner = module.GetPopup("Tablet");//If a module is opened on a tablet, show a popup for a tablet
}
</syntaxhighlight><br/>
==Work with channels and tags==
After creating a subdevice and adding a widget you must add to the subevice channels and tags required for its work. Like in i3 pro version, a driver can be added in the studio or via script. Each subdevice requires a personal set of channels and tags for the selected driver. You may work with the following three components:<br/>
*Channel. The following method is used to create a channel<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddChannel(Name, DataArray)
</syntaxhighlight>where<br/>
'''Name''' - channel name<br/>
'''DataArray''' - data array (specific for every driver)<br/>
*Tag The following method is used to create a tag<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddTag(Name, DataArray)
</syntaxhighlight>where<br/>
'''Name''' - tag name<br/>
'''DataArray''' - data array, specific for every driver<br/>
*Virtual tag. The following method if used to create a virtual tag<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddVirtualTag(Name, Value, [Edit], [smartID], [Hidden])
</syntaxhighlight>where<br/>
'''Name'''- name of a subdevice virtual tag<br/>
'''Value''' - Tag value<br/>
'''Edit''' - Permission to edit a tag<br/>
'''smartID''' - Parameter is under development! Set "false"<br/>
'''Hidden''' - Feature of a hidden tag<br/>
===An example of creating channels and tags when creating a subdevice===
<syntaxhighlight lang="javascript">
l_oSubDevice = module.AddSubDevice("Light " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_DIMMER);

// Adding channel StatusOnStart
if (count == 1)
l_oSubDevice.AddChannel("Dimmer:statusOnStart", [ChannelData]);

// Assigned to the variable name of the channel
var l_sChannelName = "Dimmer:channel" + count;

// Adding channels
l_oSubDevice.AddChannel(l_sChannelName, [ChannelData]);
l_oSubDevice.AddTag(l_sChannelName, [TagData]);

// Adding smart virtual tag
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_COMMAND_POWER, true);
l_oSubDevice.AddVirtualTag("Power On", 0, false, IR.SUB_DEVICE_COMMAND_POWER_ON, true);
l_oSubDevice.AddVirtualTag("Power Off", 0, false, IR.SUB_DEVICE_COMMAND_POWER_OFF, true);
l_oSubDevice.AddVirtualTag("Level", 0, false, IR.SUB_DEVICE_COMMAND_LEVEL, true);
</syntaxhighlight>
==Setting a module in the app==
Modules are stored in iRidium store and can be installed in the app using one of the following ways:<br/>
*With the help of a scanner<br/>
*Manually<br/>
===Developing the Setup file===
The Setup file must be developed for each variant. It's a special script file with fields that are required for module work. These fields can be device IP address, port, city name, etc. To develop a Setup file, create a new script file and select its type - "Setup". Eacn field is a tag and can be accessed from the script, and the input value can be received.
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:СетапБонго.png]]</div></div>
The Setup file consists of 2 parts. Part 1 is the driver settings. The settings must require IP addresses, ports and logins to connect the driver to a device. Part 2 is the module general settings, such as number of outputs, access keys.
To set fields in the Setip file set the following fields in the script:
* Field type - indicate what field must be shown to a user (text field, data array, etc. Detailed description is given in API)
* Field name - name of field that a user sees when setting a module
* Default value - what value must be put by default
* Check function - a function to validate value in the field. A function must be written that checks the correctness of the entered data.
For example,"Setup" script for HDL module looks this way:
<syntaxhighlight lang="javascript">
{
// Data to connect drivers, created in Project Device Panel
Drivers:
[
{
Name: "HDL-BUS Pro Network (UDP)",
Properties:
[
{
Type: "textfield",
Name: "Host",
DefaultValue: "255.255.255.255",
Validation: function(in_sValue) {
var l_aValueHost = in_sValue.split(".");
if (l_aValueHost.length != 4) {
return "Please input correct Host";
} else
if (parseInt(l_aValueHost[0], 10)>=0
&& parseInt(l_aValueHost[0], 10)<=255
&& parseInt(l_aValueHost[1], 10)>=0
&& parseInt(l_aValueHost[1], 10)<=255
&& parseInt(l_aValueHost[2], 10)>=0
&& parseInt(l_aValueHost[2], 10)<=255
&& parseInt(l_aValueHost[3], 10)>=0
&& parseInt(l_aValueHost[3], 10)<=255
)
return 0
else
return "Please input correct Host";
}
},
{
Type: "textfield",
Name: "Port",
DefaultValue: "6000",
Validation: function(in_sValue) {
if(parseInt(in_sValue, 10)>=0)
return 0
else
return "Please input correct Port";
}
}
]
}
],

// General information for the module (driver and generated by script)
Module: [{
Name: "Channels Count",
Validation: function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input Count";
}
},
{
Type: "textfield",
Name : "SubnetID",
Validation : function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input SubnetID";
}
},
{
Type: "textfield",
Name : "DeviceID",
Validation : function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input DeviceID";
}
}

]
}
</syntaxhighlight>
To get data from Setup fields use the following function
<syntaxhighlight lang="javascript">
module.GetProperty("Field name")
</syntaxhighlight>
<br />
Besides standard parameters, any parameters required for module inizialization can be asked. Driver parameters are set in the driver automatically. The other parameters are to be asked and used manually.<br />
An example of work with Setup parameters
<syntaxhighlight lang="javascript">
var COUNT_CHANNEL = parseInt(module.GetProperty("Channel count")); // Getting count channel
var SubNetID = parseInt(module.GetProperty("SubnetID")); // Getting subnet id
var DeviceID = parseInt(module.GetProperty("DeviceID")); // Getting device id
</syntaxhighlight>
===Installing a module manually===
To install a module manually no additional script development is required. A user must go to iRidium store from the app, find a module, download it and enter date in the fields indicated in the Setup file. After it the app installs the module in the system with parameters entered by a user.
===Installing a module with the help of a scanner===
'''Scanner (сканер)''' - это модуль, который анализирует какую-либо шину на подключённые устройства либо ищет устройства в локальной сети. Найденные устройства формируются в список, для выбранного устройства качается модуль и становится доступен в i3 lite. <br/>
Схема работы сканера:
# Сканер загружается из магазина;
# Пользователь вводит параметры сканера (IP, Port и т.д) и эти параметры передаются в скрипт сканера;
# Сканер, обработав введенные параметры, опрашивает шину на устройства или ищет устройства в локальной сети;
# Из полученных устройств формируется список;
# При выборе определенного устройства в списке, сканер передаёт параметры выбранного устройства в модуль.
<br/>
При разработке сканера нужно учесть:
* Параметры сканера, при добавлении из магазина;
* Логику сканера;
* Передачу параметров выбранного устройства в модуль;
* Логику модуля, с учётом переданных от сканера параметров.
<br/>
Процесс разработки сканера ничем не отличается от разработки модуля. Точно также сканеру необходимо нарисовать визуальную часть, создать драйвер и написать скрипт с логикой. Основным отличием является то, что сканер может работать только на панели управления и сканер никогда не будет запущен на сервере, поэтому, при разработке скриптов, нет необходимости разделять скрипты на драйверные и интерфейсные.
<br/>
Также при разработке сканера появляется новая логика работы. Первым делом необходимо сделать модуль для управления устройством, далее надо загрузить модуль в магазин модулей. При загрузке модуля, вы увидите уникальный идентификатор вашего модуля. Когда вы будете разрабатывать сканер, вам необходимо написать скрипт со следующей логикой:
# Создание драйвера
# Поиск оборудования
# Если оборудование найдено, надо определить что это за оборудование
# При помощи команды ModuleSetupFinish (ID модуля, js объект с настройками setup данного модуля)
После этого приложение скачет модуль из магазина модулей и установит его.<br/>
The distinctive feature of developing a scanner is the event that lauches the driver work. When developing a scanner use the following event
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_OPEN_SCANNER, 0, function (){});
</syntaxhighlight>
A scanner must be developed after modules are developed. The developed modules are registered in the store of modules and are given a unique ID. After a scanner finds devices in the local net, the script must download a module for the found equipment by the indicated ID. To download a module use the following function
<syntaxhighlight lang="javascript">
IR.ModuleSetupFinish(StoreID, ModuleData, [Callback])
</syntaxhighlight>
where
* StoreID - module ID in the store of modules
* ModuleData - data required for installing a module (fields in Setup)
* Callback - a function to process errors that happened in the installation process (optional)
An example of a developed scanner for HDL modules. To install any module the following parameters are required: Type,SubNet id, Device id, module name, bus IP address, port.
<syntaxhighlight lang="javascript">
//Example of installing HDL Dimmer with a scanner
var l_nStoreID = 82;
var l_oModuleData = {
Module: {
//Data required for module work
Type: "Dimmer",
SubnetID: 3,
DeviceID: 6
Name: "HDL Dimmer"
}
Drivers: {
//Data for the driver
"HDL-BUS Pro Network (UDP)": {
Host: "255.255.255.255", //installing a host for the driver
Port: "6000" //installing a port for the driver
},
}
}

IR.ModuleSetupFinish(l_nStoreID, l_oModuleData, function(in_error){
if (!in_error){
...
} else {
...
}
});
</syntaxhighlight>
===Adding subdevices manually===
After adding the subdevices via the scanner or Setup, the user may have a need to add other subdevices. To ensure this, module developer has to assign the system variable
<syntaxhighlight lang="javascript">
SettingsPopupName = module.GetPopup('AddSubDevicePopup');
</syntaxhighlight >
You have to assign a window with the results of the scanner operation or a popup in which the user can configure a new subdevice or add this subdevice. This popup should be developed by the developer himself.<br/>
If the popup is assigned to the specified system variable, the user will see a "+" button in the module settings section. This button opens the specified popup
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:AddSubdeviceBtn.png]]</div></div>
</div>
Example of specifying the adding subdevices window. When developing, you need to create an adding window in the tablet resolution and a separate window in the smartphone resolution
<syntaxhighlight lang="javascript">
module.SettingsPopupName = IR.DisplayType != IR.DISPLAY_TYPE_TABLET? module.GetPopup("phone:NoAuthorize").Name: module.GetPopup("NoAuthorize").Name;
</syntaxhighlight >
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:AddSubdeviceWindow.png]]</div></div>
</div>
===Authorization===
To work with certain devices a user's authorization in a third-party system is required. i 3lite app has a special authorization mechanism for this purpose.<br/>
To authorize a user has to enter his access data in a special window. This window is unique for every device and a module developer must create it. A window to enter data is a popup with fields to enter data. The popup is created with the help of standard means of the studio and it may be unassigned to any subdevices. When access data are entered, the script must authorize in a third-party system and close the authorization window. After creating an authorization popup, a developer must call the authorization system variable in the script and assign the created popup in the variable.
<syntaxhighlight lang="javascript">
AuthorizationPopupName = module.GetPopup("AutorisationPopup");
</syntaxhighlight ><br/>
After an authorization popup is assigned to a variable, "Authorize" button appears in the module settings.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:NeedAuthorization1.png]]</div></div>
</div>
When this button is pressed, the app opens the authorization popup, assigned in the script. The next task for a module developer is to display a user's status (Authorized or not). There is a system variable to solve this task.
<syntaxhighlight lang="javascript">
AuthorizationStatus = true;
</syntaxhighlight ><br/>
If a user is authorized in the system, true value is assigned to the variable and the app changes the status of the authorization button into:
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Logout1.png]]</div></div>
</div>
A module devloper must also think about the mechanism of deauthorization. It is done on the authorization popup.<br/>
An example of the authorization script
<syntaxhighlight lang="javascript">
if (module.AuthorizationStatus == false) { //If a user is not authorized
module.AuthorizationPopupName = WindowSettings.Window.Name;//Assigning the authorization popup created earlier
} else if (module.AuthorizationStatus) //If a user is authorized
{
module.AuthorizationPopupName = IR.DisplayType != IR.DISPLAY_TYPE_TABLET? module.GetPopup("phone:deAuth").Name: module.GetPopup("deAuth").Name;//Showing the deauthorization popup
}
</syntaxhighlight ><br/>
Note. Remember to create a separate authorization/deauthorization popup for a smart phone and for a tablet.
===Changing settigns===
While working with the application, there may be a need to change the settings of the module. To provide such an opportunity, the module developer must create a function to change the module settings and assign it to the system method
<syntaxhighlight lang="javascript">
module.ChangeProperties = function (in_oSetup)
{
Processing of new module parameters
}
</syntaxhighlight>
When declaring this function, the application will add an edit settings button in the module.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ChangeBtn.png]]</div></div>
</div>
When the user clicks on this button, the application opens the Setup window that was used to install the module. In this window, the user enters new settings and presses the "Done" button. After that, the application runs the above function. The driver settings can be changed by the application itself, other module settings developer must change manually. New settings are written to the input parameter in_oSetup as a JSON line.<br/>
Also in this function you need to process the success of changing settings. The flag is responsible for this.
<syntaxhighlight lang="javascript">
module.FinishUpdateSettings = true;
</syntaxhighlight>
If the installation of new parameters was successful, then the value of the flag should be set to "true", and the opposite case should be "false". This allows the application to understand that the parameter change failed (if the status of the variable is "false") and the application will cancel the driver settings change, returning the old settings<br/>
Пример обработки новых настроек модуля
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_MODULE_START, 0, function(){
module.ChangeProperties = function (in_oSetup, in_oModule) {
if (typeof (in_oSetup) == "string")
in_oSetup = JSON.Parse(in_oSetup);
var l_nChannel = in_oSetup.Module["Channel count"];
if (l_nChannel >= COUNT_CHANNEL) {
module.FinishUpdateSettings = true;
// Recreating element on cycle
for (var count = 1; count <= in_nChannel; count++) {

// Creating subDevice
l_oSubDevice = module.AddSubDevice("Relay " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_RELAY);

// Create revers
if (!l_oSubDevice.GetProperty("Reverse"))
l_oSubDevice.SetProperty("Reverse", 0);

// Assigned to the variable name of the channel
var l_sChannelName = "Relay:channel" + count;

// Adding channels
l_oSubDevice.AddChannel(l_sChannelName, Data);
l_oSubDevice.AddTag(l_sChannelName, Data);

// Adding smart virtual tag
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_TAG_POWER, true);
};
}
else {
for (var count = 1; count <= COUNT_CHANNEL; count++)
if (l_nChannel < count) {
var l_oDeleteSubDevice = module.GetSubDevice("Relay " + count);
module.DeleteSubDevice (l_oDeleteSubDevice.ID);
};
};
};
});
</syntaxhighlight>

Translations:DevManual/209/en

2017-04-17T05:26:20Z

If the installation of new parameters was successful, then the value of the flag should be set to "true", and the opposite case should be "false". This allows the application to understand that the parameter change failed (if the status of the variable is "false") and the application will cancel the driver settings change, returning the old settings

DevManual/en

2017-04-17T05:18:56Z

Ildar:

<languages/>
=Module development guide=
==Definitions==

'''Module''' - is a component that allows you to control one type of equipment by its unique ID. The module is located in the store of modules.

'''Control panel (mobile device)''' - is a device from which the project i3 lite is launched (tablet, smartphone).

'''Store of modules''' - is a cloud server for uploading ready-made modules. The module store is available from the i3 lite application or on our[http://www.iridiummobile.ru/store/ site]

'''iRidium Studio''' - is a editor that allows to create the module to control device for i3 lite application. You need to use a special editor build for [http://www.iridiummobile.net/redirects/?go=iRidium_SETUP_LITE module developers] to develop the module

'''i3 lite''' - is an application to create, set and use i3 lite projects.

'''i3 lite project''' – is an automation project made up of ready equipment control modules. i3 lite projects differ from i2 Control projects: i3 lite projects can be edited dynamically without prior editing in iRidium Studio. i3 lite project consists of several small parts that can be put together into a single whole in i3 lite app with the help of the built-in constructor. It can also be easily edited in the app. As a result, a big number of intermediate processes are no longer necessary, such as installing software on PC, uploading projects on contol panels. All is done in one place - a control panel.

'''SubDevice''' - This is a virtual representation of the working area of the physical device. If we take as an example a 6-channel dimmer it has 6 sub-devices, because each independent device requires a separate control interface and connects to one channel.

'''Room (in i3 lite)''' - The visual part of i3 lite containing hardware management widgets. The project in i3 lite consists of rooms located on the floors

'''Widget''' - is a visual module component located in the room. It has limitations in size and fixed position in the room interface. It contains the main module functionality. For additional functions Remote is used.

'''Remote''' - is a visual module component which is hidden by default. It opens only when clicking on the corresponding item of the widget. It does not have size limitations (not more than the panel display size) and can be located in any part of the room interface (it is usually located in the middle of the panel display). It contains additional functionality of the module.

'''Macros''' - is a sequence of commands of various modules, which is activated by pressing. Contains "Action" and "Condition". For example, the macros "turn off all the lights in the house" will send the shutdown command to all devices responsible for lighting.

'''Routine''' - is a sequence of commands of various modules, which is activated automatically when a certain event occurs. Contains "Event", "Action" and "Condition". For example, "turn on the light if the motion sensor is triggered"

'''Event''' - is a routine component that describes the control command and the value range. If the value is sent in the indicated range, the routine is executed. For example, the event "Motion appeared" is activated if the motion sensor is triggered.

'''Action''' - is a component of macros and routines. It describes the control command and value that must be sent to the command. For example, "turn on the light". There are 2 types of Action: Simple Action and Advanced Action.

'''Simple Action''' - Simple Action is used when the command and Action value are known in advance.

'''Advanced Action''' - Advanced Action is used when the command is known but the value is unknown. The value is set dynamically when Action is used in i3 lite (but not when creating in iRidium studio).

'''Condition''' - is a component of macros and scenes. It describes the control command and value range. When a value from the value range is sent Action is executed.

'''Scanner''' - is a software part, that analyzes any bus looking for connected devices. Found connected devices are displayed in a list. Modules for the found devices are downloaded from iRidium store and the devices become available to control in i3 lite.
==Module concept==
The module is an independent subroutine of the i3 lite application which is built in the project and has an independent interface, driver and logic. Modules are developed in the [http://www.iridiummobile.net/redirects/?go=iRidium_SETUP_LITE iRidium Studio] editor and located in the module store [http://www.iridiummobile.ru/store/ iRidium Store]. Integrator downloads the module from the module store for each individual project.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ModuleInScheme.png]]</div></div>
</div>

There are two types of modules:
*Control module - module for hardware control
*Scanner - module for searching hardware in the local network and loading modules for found devices
== How to start developing the module ==
----

{{i}} Before starting your work, it is recommended to read [http://dev.iridiummobile.net/How_to_begin iRidium documentation]. It describes the basics of working with iRidium. The i3 lite documentation describes how to develop modules for the i3 lite platform for users, who already know iRidium. If you want to write script use [[Special:MyLanguage/Developers_API | i3 lite API]].
----

The module life cycle consists of:
* Developing the graphic part in iRidium studio
* Developing the driver part (scripts, devices)
* Testing
* Publishing in iRidium store
* Using (module download via the i3 lite application from the cloud and adding to automation projects)
<br/>
==Module structure ==
Each module must consist of subdevices. The subdevice is a virtual representation of the working area of a physical device. Many devices support multiple workgroups with the same functionality. Each workgroup may be in a separate zone. To fully control the zone, you need to create a subdevice for each workgroup of the device. For example, a 6-channel HDL dimmer contains 6 dimmable channels, through which 6 working groups can be controlled. Therefore, it is advisable to select in the module 6 subdevices for the possibility of creating actions, events and conditions for each workgroup separately. The presence of subdevice in the i3 lite module is obligatory. The number of sub-devices can be from one to many. Usually the number of subdevice is equal to the number of channels of the controller, the number of its work areas or logical devices.

Subdevice consists of:
* Conditions
* Actions
* Events
* Widgets

Conditions, actions and events are logical elements of the subdevice, on their basis macros and routines are created. Widget is a graphical element, through which the user will control subdevice. Usually one subdevice contains one widget, but the number of conditions, actions and events varies (from zero to many). The number of subdevices in the module can be either fixed or not. For example, you can develop a module only for a 6-channel dimmer, and you can make a module that will request the hardware for the number of subdevices and create the required number of subdevices.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ModuleStruct.png]]</div></div>
</div>
==Creating the module interface ==
The interface part of the midule consists of:
* widgets - interface part of the subdevice, which is located in the rooms and has basic control functions
* Remote - interface part of the module, which has a set of device functions and opens to the full screen, when you click on the widget button
* Authorization window - Authorization is required to work with some devices. To do this, the developer can create a special authorization window that is available in the module settings
* The module settings window is a window where you need to enter the parameters for the module operation
картинка окна настроек модуля и кнопки открытия
The whole graphic part is drawn in the graphical interface of the iRidium studio editor. In contradistinction to i3 pro, the module's interface should be made up of ready-made graphic components located in the gallery.

==== Widget ====

Widget is a visual component of the module, a kind of Popup that will be displayed in the room. The main task of the widget is to display the basic controls of the subdevice and to provide a module transition to the Remote control of the subdevice. For example, to control a media player, you can place a volume slider or Mute button for quick access to adjusting the volume. The weather widget can display the current weather, and the control panel will contain the weather forecast for all 5 days.<br />
The module does not make sense without widget, because it will not have a graphical representation in the i3 lite project.

Widget has a limited size
# Width '''640'''
# Height can not exceed '''1200'''

[[Файл:Пример виджета.png|center|thumb|Рис. Widget example]]

To create a widget, click the Add pop-up button in the Project overview panel and in the appeared menu select popup type: "Widget", set the name and properties:
[[Файл:ПанельПопап.png|thumb|center]]

Properties of a created widget can be changed with the help of '''Object Properties'''.<br />
Graphic items are assigned to channels like in popups:
[[Файл:Связывание_канала_команды_и_графического_элемента.png|center|thumb|Рис. Связывание канала команды и графического элемента]]
Widget will be displayed:
* In the room when a client uses the project
[[Файл:В_комнате_при_использовании_пользователем_проекта.png|center|thumb|]]
* In the module settings when it is added to the project:
[[Файл:И_в_настройках_модуля_при_добавлении_его_в_проект.png ‎|center|thumb|]]
====Remote and other graphic windows====

Remote (a remote control) is a graphical area to control SubDevices. Unlike wigets, it can have free size and position. And it is displayed on call. Remote is displayed when a button to go to the remote control is pressed on a widget.
Items to control equipment are placed on Remote (buttons, lists, switches, levels). There can be from 0 to several remote controls. Example of Remote:<br />
[[Файл:Пульт_управления.png ‎|center|thumb|]]<br />

Remote is created like a Widget. The only difference is to select "Remote" when you click "Add Popup Page" in the "Device Type" property.
==Interface design standard==
For the convenience of interface design, a standard was developed in which graphic windows should be developed in the module so that the modules of different developers looked uniformly within the framework of one project.
===Basic principles===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:GeneralUI.png]]</div></div>
<div class="col-sm-12 col-md-6">
Виджет состоит из «Header» и дополнительных модулей основного функционала. <br/>
«Header» — верхний модуль виджета.<br/>
«Header» содержит:<br/>
- наименование виджета;
- наименование устройства, которым<br/>
управляет виджет;<br/>
- иконка категории устройства.<br/>
<br/>
Дополнительные модули содержат элементы управления устройством.
</div>
</div>
===Module grid and blocks===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka1.png]]</div></div>
<div class="col-sm-12 col-md-6">
Module grid widget is a block 640 pt wide
And 120 pt in height. Each block has a grid of 8x8 pt.
The rounding of the corners is 12.5 ut. (Circle 25)
</div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka2.png]]</div></div>
<div class="col-sm-12 col-md-6">
The principle of constructing a widget block is a constructor from
Controls (buttons, switches, labels) from smaller to larger.
</div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka3.png]]</div></div>
<div class="col-sm-12 col-md-6">
Control items are combined and united in a block, blocks are united into a control panel.
</div>
</div>
===Buttons===
<big>'''Toggle'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Toggle.png]]</div></div>
<div class="col-sm-12 col-md-6">
Кнопка изменения значения «вкл/выкл». Применяется для отправки команды на устройство, вне зависимости от его текущего состояния.
</div>
</div>
<big>'''Switch'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Switch.png]]</div></div>
<div class="col-sm-12 col-md-6">
«On/off» switch. It is used only when the currect device status is known.
</div>
</div>
<big>'''Multistate'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Multistate.png]]</div></div>
<div class="col-sm-12 col-md-6">
Multistate button is used only when the current device status is known.
</div>
</div>
===Arrow-button===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:arrow1.png]]</div></div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:arrow2.png]]</div></div>
</div>
'''Действие кнопки'''<br/>
При нажатии на кнопку происходит вызов «PopUp».<br/>
'''Содержимое «PopUp»'''<br/>
«Input field», «Single selection», «Multiple selection».
===Sliders===
<div class="row">
<div class="col-sm-12 col-md-6">
Standart
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:StandartSlider.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
Value
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ValueSlider.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
Progress
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ProgressSlider.png]]</div></div>
</div>
===Description===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Description.png]]</div></div>
===Icons===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Icons1.png]]</div></div>
All icons are devided by their spheres of use, their main differene is the size.
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Icons2.png]]</div></div>
===«Header» widget===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:WidgetHeader.png]]</div></div>
===Icon location===
<div class="row">
<div class="col-sm-12 col-md-6">
The standard is 128х120 pt
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:FormFactor.png]]</div></div>
</div>
All buttons have two states - active and inactive
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:OFFicon.png]]</div></div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ONicon.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
When the button in inactive the color is always # 848484 or RGB 132
</div>
<div class="col-sm-12 col-md-6">
The state of a button is considered active, when the action received feedback and is short or instant (e.g. «Play» in a media player) or an acrion that is active for a long time and demands another activity to switch off the active state (e.g. «Repeat» in a media player).
</div>
</div>
==Basics of working with scripts==

To design an interface and to add a driver, you are to develop the logics of module work via script. The script part of developing i3 lite modules has a number of special features. Before developing the script part of i3 lite modules, please, read [http://dev.iridiummobile.net/JS_Guide iRidium Pro API] and [[Special:MyLanguage/Developers_API | i3 lite API]]. <br />

A module can contain any number of scripts. There are several types of scripts for modules:
* Driver - script files of this type contain script, responsible for working with a driver
* GUI - script files of this type contain script, responsible for working with graphics
* Common - script files of this type must contain general scripts, such as a set of additional functions or a description of classes of secondary importance
* Setup - a special script file that contains information about module setting, a list of fields that are obligatory to fill in, types of these fields and functions that check the correctness of entered data.

Devision into types is necessary for the module correct work on the server. Only logics and the driver part work on the server, but the server knows nothing about the graphic part. That's why a module developer has to devide scripts into types. The server does not notice files for working with the graphic part. <br />

When modules are developed module names have to be used instead of IR. Thus, a listener looks this way module.AddListener… <br />

Каждый скриптовой файл должен начинаться со слушателя
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_MODULE_START, 0, function(){});
</syntaxhighlight>
Это новый вид события, предназначенный специально для разработки модуля. При разработке модуля следует учитывать что скриптовой файл стал закрыт для других скриптовых файлов. Это хзначить что теперь можно использовать одноименные переменные и названия функций в разных скриптовых файлах и они не будут перезаписываться, но это накладывает ограничение: нельзя получить доступ к функции из другого скриптового файла простым способом. Для получения доступа к функции из другого скриптового файла, следует импортировать скриптовый файл с помощью команды module.Import("FileName.js"). <br />
Example:<br/>
<syntaxhighlight lang="javascript">
//Name_1.js - first js file
this.Text = "Hello, world!"; //Pointer to a text variable
//Name_2.js - second js file
var Text = module.Import("Name_1.js").Text; //Importing an object with a pointer to a text variable from the first js file
IR.Log(Text); //"Hello, world!" //log the text variable
</syntaxhighlight>
==Creating a subdevice==
The basis of every module is subdevices. The task of every module developer is to define how many subdevices a module has and to develop the logics of subdevice work. Each subdevice may contain a widget, a remote control, a set of actions, events and states. All contents of a subdevice have to be indicated when a subdevice is created. Subdevice contents can't be changed during module work. The following command is used to create a subdevice:<br/>
<syntaxhighlight lang="javascript">
module.AddSubDevice(SystemName, [Device], [System], [Type], [Tags], [Name], [Callback]);
</syntaxhighlight>
where<br/>
'''SystemName''' - subdevice system name<br/>
'''Device''' - a driver to which a subdevice will be assigned<br/>
'''System''' - old parameter, "false" is to be used<br/>
'''Type''' - type of smart device. Parameter is under development<br/>
'''Tags''' - Array of virtual tag objects<br/>
'''Name''' - subdevice name that is displayed to the user<br/>
'''Callback function(){do somethings}''' - a function that is on till the IR.EVENT_ADD_SUBDEVICE event happens.<br/>
As a reply the function returns a link to a subdevice, that can be used to address it.<br/>
An example of creating subdevices for HDL Relay devices. The script checks th number of devices in the bus and creates subdevices.<br/>
<syntaxhighlight lang="javascript">
for (var count = 1; count <= COUNT_CHANNEL; count++) {
// Creating a subdevice
l_oSubDevice = module.AddSubDevice("Relay " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_RELAY);
// Creating StatusOnStart command
if (count == 1)
l_oSubDevice.AddChannel("Relay:statusOnStart", [ChannelData]);
var l_sChannelName = "Relay:channel" + count;
// Adding channels
l_oSubDevice.AddChannel(l_sChannelName, [ChannelData]);
l_oSubDevice.AddTag(l_sChannelName, [ChannelData]);
// Add a virtual tag
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_TAG_POWER, true);
};</syntaxhighlight><br/>
Everything that is required can be added to a subdevice this way. An event is activated when a subdevice is created.<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function, [pointer]);
</syntaxhighlight><br/>
A link to a subdevice that was created is sent to a function. Different components can be added to subdevice in this event, such as, actions, events, states, widgets, chanels, tags. For example,<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function(in_oSubDevice){
Creating actions
in_oSubDevice.AddAction("On", false, in_oSubDevice.SystemName + "_Power", lightID + "_1", IR.SUB_DEVICE_COMMAND_POWER_ON);
in_oSubDevice.AddAction("Off", false, in_oSubDevice.SystemName + "_Power", lightID + "_0", IR.SUB_DEVICE_COMMAND_POWER_OFF);
Creating events
in_oSubDevice.AddEvent("On", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "1");
in_oSubDevice.AddEvent("Off", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "0");
Creating states
in_oSubDevice.AddCondition("On", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "1");
in_oSubDevice.AddCondition("Off", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "0");
});</syntaxhighlight><br/>
Thus, a developer can create the required number of subdevices when a module is installed or when new subdevices are added manually.
==Adding a widget to a subdevice==

After an interface is created in the studio and a function to add subdevices is added, create a copy of a widget for each subdevice and assign it to the subdevice. To assign a widget to a subdevice the following method is used.<br/>
<syntaxhighlight lang="javascript">SubDevice.addWidget(in_Widget)</syntaxhighlight><br/>


The input parameter of the method is '''in_Widget''' - an object, a widget, created in the studio beforehand.<br />
The output parameter of the method is '''True''' or '''False''' (successful or not).<br />
For example, we have 3 lamps. Not to create a separate wiget for each lamp, use a ready template and clone it. Here is an example of creating widgets with the help of a code using the existing template .<br />

Clone method allows to clone an existing popup.<br/>
<syntaxhighlight lang="javascript">Module.ClonePopup (in_Popup, in_Name)</syntaxhighlight><br/>
Входные параметры метода:
*'''in_Name''' - имя нового виджета.<br/>
*'''in_Popup''' - ссылка на всплывающее окно.<br/>
Выходным параметром метода является: успешно или нет ('''True''', '''False''').<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function(in_oSubDevice){
var popup = module.GetPopup("Dimmer"); // Calling a widget that we want to clone
// Creating a widget using cloning method
var widget = in_oSubDevice.addWidget(module.ClonePopup(popup, "Dimmer"+ in_oSubDevice.Name));
});</syntaxhighlight><br/>
----
{{i}} Names of new widgets must not be repeated
----
When a complete remote control is opened it is necessary to remmeber that a user will use the module both on a tablet and on a smart phone. The difference betwen the screen sizes makes a developer design 2 types of windows: a version for smart phones and a version for tablets. In addition a method must be added to the script that asks the system about the type of device where a module is launched and open the required window.
<syntaxhighlight lang="javascript">
if (IR.DisplayType == IR.DISPLAY_TYPE_PHONE) { //If a module is opened on a smart phone
var l_oPopupScanner = module.GetPopup("Phone"); //show a popup created for a smart phone
}
else {
var l_oPopupScanner = module.GetPopup("Tablet");//If a module is opened on a tablet, show a popup for a tablet
}
</syntaxhighlight><br/>
==Work with channels and tags==
After creating a subdevice and adding a widget you must add to the subevice channels and tags required for its work. Like in i3 pro version, a driver can be added in the studio or via script. Each subdevice requires a personal set of channels and tags for the selected driver. You may work with the following three components:<br/>
*Channel. The following method is used to create a channel<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddChannel(Name, DataArray)
</syntaxhighlight>where<br/>
'''Name''' - channel name<br/>
'''DataArray''' - data array (specific for every driver)<br/>
*Tag The following method is used to create a tag<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddTag(Name, DataArray)
</syntaxhighlight>where<br/>
'''Name''' - tag name<br/>
'''DataArray''' - data array, specific for every driver<br/>
*Virtual tag. The following method if used to create a virtual tag<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddVirtualTag(Name, Value, [Edit], [smartID], [Hidden])
</syntaxhighlight>where<br/>
'''Name'''- name of a subdevice virtual tag<br/>
'''Value''' - Tag value<br/>
'''Edit''' - Permission to edit a tag<br/>
'''smartID''' - Parameter is under development! Set "false"<br/>
'''Hidden''' - Feature of a hidden tag<br/>
===An example of creating channels and tags when creating a subdevice===
<syntaxhighlight lang="javascript">
l_oSubDevice = module.AddSubDevice("Light " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_DIMMER);

// Adding channel StatusOnStart
if (count == 1)
l_oSubDevice.AddChannel("Dimmer:statusOnStart", [ChannelData]);

// Assigned to the variable name of the channel
var l_sChannelName = "Dimmer:channel" + count;

// Adding channels
l_oSubDevice.AddChannel(l_sChannelName, [ChannelData]);
l_oSubDevice.AddTag(l_sChannelName, [TagData]);

// Adding smart virtual tag
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_COMMAND_POWER, true);
l_oSubDevice.AddVirtualTag("Power On", 0, false, IR.SUB_DEVICE_COMMAND_POWER_ON, true);
l_oSubDevice.AddVirtualTag("Power Off", 0, false, IR.SUB_DEVICE_COMMAND_POWER_OFF, true);
l_oSubDevice.AddVirtualTag("Level", 0, false, IR.SUB_DEVICE_COMMAND_LEVEL, true);
</syntaxhighlight>
==Setting a module in the app==
Modules are stored in iRidium store and can be installed in the app using one of the following ways:<br/>
*With the help of a scanner<br/>
*Manually<br/>
===Developing the Setup file===
The Setup file must be developed for each variant. It's a special script file with fields that are required for module work. These fields can be device IP address, port, city name, etc. To develop a Setup file, create a new script file and select its type - "Setup". Eacn field is a tag and can be accessed from the script, and the input value can be received.
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:СетапБонго.png]]</div></div>
The Setup file consists of 2 parts. Part 1 is the driver settings. The settings must require IP addresses, ports and logins to connect the driver to a device. Part 2 is the module general settings, such as number of outputs, access keys.
To set fields in the Setip file set the following fields in the script:
* Field type - indicate what field must be shown to a user (text field, data array, etc. Detailed description is given in API)
* Field name - name of field that a user sees when setting a module
* Default value - what value must be put by default
* Check function - a function to validate value in the field. A function must be written that checks the correctness of the entered data.
For example,"Setup" script for HDL module looks this way:
<syntaxhighlight lang="javascript">
{
// Data to connect drivers, created in Project Device Panel
Drivers:
[
{
Name: "HDL-BUS Pro Network (UDP)",
Properties:
[
{
Type: "textfield",
Name: "Host",
DefaultValue: "255.255.255.255",
Validation: function(in_sValue) {
var l_aValueHost = in_sValue.split(".");
if (l_aValueHost.length != 4) {
return "Please input correct Host";
} else
if (parseInt(l_aValueHost[0], 10)>=0
&& parseInt(l_aValueHost[0], 10)<=255
&& parseInt(l_aValueHost[1], 10)>=0
&& parseInt(l_aValueHost[1], 10)<=255
&& parseInt(l_aValueHost[2], 10)>=0
&& parseInt(l_aValueHost[2], 10)<=255
&& parseInt(l_aValueHost[3], 10)>=0
&& parseInt(l_aValueHost[3], 10)<=255
)
return 0
else
return "Please input correct Host";
}
},
{
Type: "textfield",
Name: "Port",
DefaultValue: "6000",
Validation: function(in_sValue) {
if(parseInt(in_sValue, 10)>=0)
return 0
else
return "Please input correct Port";
}
}
]
}
],

// General information for the module (driver and generated by script)
Module: [{
Name: "Channels Count",
Validation: function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input Count";
}
},
{
Type: "textfield",
Name : "SubnetID",
Validation : function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input SubnetID";
}
},
{
Type: "textfield",
Name : "DeviceID",
Validation : function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input DeviceID";
}
}

]
}
</syntaxhighlight>
To get data from Setup fields use the following function
<syntaxhighlight lang="javascript">
module.GetProperty("Field name")
</syntaxhighlight>
<br />
Besides standard parameters, any parameters required for module inizialization can be asked. Driver parameters are set in the driver automatically. The other parameters are to be asked and used manually.<br />
An example of work with Setup parameters
<syntaxhighlight lang="javascript">
var COUNT_CHANNEL = parseInt(module.GetProperty("Channel count")); // Getting count channel
var SubNetID = parseInt(module.GetProperty("SubnetID")); // Getting subnet id
var DeviceID = parseInt(module.GetProperty("DeviceID")); // Getting device id
</syntaxhighlight>
===Installing a module manually===
To install a module manually no additional script development is required. A user must go to iRidium store from the app, find a module, download it and enter date in the fields indicated in the Setup file. After it the app installs the module in the system with parameters entered by a user.
===Installing a module with the help of a scanner===
'''Scanner (сканер)''' - это модуль, который анализирует какую-либо шину на подключённые устройства либо ищет устройства в локальной сети. Найденные устройства формируются в список, для выбранного устройства качается модуль и становится доступен в i3 lite. <br/>
Схема работы сканера:
# Сканер загружается из магазина;
# Пользователь вводит параметры сканера (IP, Port и т.д) и эти параметры передаются в скрипт сканера;
# Сканер, обработав введенные параметры, опрашивает шину на устройства или ищет устройства в локальной сети;
# Из полученных устройств формируется список;
# При выборе определенного устройства в списке, сканер передаёт параметры выбранного устройства в модуль.
<br/>
При разработке сканера нужно учесть:
* Параметры сканера, при добавлении из магазина;
* Логику сканера;
* Передачу параметров выбранного устройства в модуль;
* Логику модуля, с учётом переданных от сканера параметров.
<br/>
Процесс разработки сканера ничем не отличается от разработки модуля. Точно также сканеру необходимо нарисовать визуальную часть, создать драйвер и написать скрипт с логикой. Основным отличием является то, что сканер может работать только на панели управления и сканер никогда не будет запущен на сервере, поэтому, при разработке скриптов, нет необходимости разделять скрипты на драйверные и интерфейсные.
<br/>
Также при разработке сканера появляется новая логика работы. Первым делом необходимо сделать модуль для управления устройством, далее надо загрузить модуль в магазин модулей. При загрузке модуля, вы увидите уникальный идентификатор вашего модуля. Когда вы будете разрабатывать сканер, вам необходимо написать скрипт со следующей логикой:
# Создание драйвера
# Поиск оборудования
# Если оборудование найдено, надо определить что это за оборудование
# При помощи команды ModuleSetupFinish (ID модуля, js объект с настройками setup данного модуля)
После этого приложение скачет модуль из магазина модулей и установит его.<br/>
The distinctive feature of developing a scanner is the event that lauches the driver work. When developing a scanner use the following event
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_OPEN_SCANNER, 0, function (){});
</syntaxhighlight>
A scanner must be developed after modules are developed. The developed modules are registered in the store of modules and are given a unique ID. After a scanner finds devices in the local net, the script must download a module for the found equipment by the indicated ID. To download a module use the following function
<syntaxhighlight lang="javascript">
IR.ModuleSetupFinish(StoreID, ModuleData, [Callback])
</syntaxhighlight>
where
* StoreID - module ID in the store of modules
* ModuleData - data required for installing a module (fields in Setup)
* Callback - a function to process errors that happened in the installation process (optional)
An example of a developed scanner for HDL modules. To install any module the following parameters are required: Type,SubNet id, Device id, module name, bus IP address, port.
<syntaxhighlight lang="javascript">
//Example of installing HDL Dimmer with a scanner
var l_nStoreID = 82;
var l_oModuleData = {
Module: {
//Data required for module work
Type: "Dimmer",
SubnetID: 3,
DeviceID: 6
Name: "HDL Dimmer"
}
Drivers: {
//Data for the driver
"HDL-BUS Pro Network (UDP)": {
Host: "255.255.255.255", //installing a host for the driver
Port: "6000" //installing a port for the driver
},
}
}

IR.ModuleSetupFinish(l_nStoreID, l_oModuleData, function(in_error){
if (!in_error){
...
} else {
...
}
});
</syntaxhighlight>
===Adding subdevices manually===
After adding the subdevices via the scanner or Setup, the user may have a need to add other subdevices. To ensure this, module developer has to assign the system variable
<syntaxhighlight lang="javascript">
SettingsPopupName = module.GetPopup('AddSubDevicePopup');
</syntaxhighlight >
You have to assign a window with the results of the scanner operation or a popup in which the user can configure a new subdevice or add this subdevice. This popup should be developed by the developer himself.<br/>
If the popup is assigned to the specified system variable, the user will see a "+" button in the module settings section. This button opens the specified popup
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:AddSubdeviceBtn.png]]</div></div>
</div>
Example of specifying the adding subdevices window. When developing, you need to create an adding window in the tablet resolution and a separate window in the smartphone resolution
<syntaxhighlight lang="javascript">
module.SettingsPopupName = IR.DisplayType != IR.DISPLAY_TYPE_TABLET? module.GetPopup("phone:NoAuthorize").Name: module.GetPopup("NoAuthorize").Name;
</syntaxhighlight >
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:AddSubdeviceWindow.png]]</div></div>
</div>
===Authorization===
To work with certain devices a user's authorization in a third-party system is required. i 3lite app has a special authorization mechanism for this purpose.<br/>
To authorize a user has to enter his access data in a special window. This window is unique for every device and a module developer must create it. A window to enter data is a popup with fields to enter data. The popup is created with the help of standard means of the studio and it may be unassigned to any subdevices. When access data are entered, the script must authorize in a third-party system and close the authorization window. After creating an authorization popup, a developer must call the authorization system variable in the script and assign the created popup in the variable.
<syntaxhighlight lang="javascript">
AuthorizationPopupName = module.GetPopup("AutorisationPopup");
</syntaxhighlight ><br/>
After an authorization popup is assigned to a variable, "Authorize" button appears in the module settings.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:NeedAuthorization1.png]]</div></div>
</div>
When this button is pressed, the app opens the authorization popup, assigned in the script. The next task for a module developer is to display a user's status (Authorized or not). There is a system variable to solve this task.
<syntaxhighlight lang="javascript">
AuthorizationStatus = true;
</syntaxhighlight ><br/>
If a user is authorized in the system, true value is assigned to the variable and the app changes the status of the authorization button into:
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Logout1.png]]</div></div>
</div>
A module devloper must also think about the mechanism of deauthorization. It is done on the authorization popup.<br/>
An example of the authorization script
<syntaxhighlight lang="javascript">
if (module.AuthorizationStatus == false) { //If a user is not authorized
module.AuthorizationPopupName = WindowSettings.Window.Name;//Assigning the authorization popup created earlier
} else if (module.AuthorizationStatus) //If a user is authorized
{
module.AuthorizationPopupName = IR.DisplayType != IR.DISPLAY_TYPE_TABLET? module.GetPopup("phone:deAuth").Name: module.GetPopup("deAuth").Name;//Showing the deauthorization popup
}
</syntaxhighlight ><br/>
Note. Remember to create a separate authorization/deauthorization popup for a smart phone and for a tablet.
===Changing settigns===
While working with the application, there may be a need to change the settings of the module. To provide such an opportunity, the module developer must create a function to change the module settings and assign it to the system method
<syntaxhighlight lang="javascript">
module.ChangeProperties = function (in_oSetup)
{
Processing of new module parameters
}
</syntaxhighlight>
When declaring this function, the application will add an edit settings button in the module.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ChangeBtn.png]]</div></div>
</div>
When the user clicks on this button, the application opens the Setup window that was used to install the module. In this window, the user enters new settings and presses the "Done" button. After that, the application runs the above function. The driver settings can be changed by the application itself, other module settings developer must change manually. New settings are written to the input parameter in_oSetup as a JSON line.<br/>
Also in this function you need to process the success of changing settings. The flag is responsible for this.
<syntaxhighlight lang="javascript">
module.FinishUpdateSettings = true;
</syntaxhighlight>
Если установка новых параметров прошла успешно, то надо выставить значение флага true, а обратном случае флаг должен принять значение false. Это позволяет приложению понять что смена параметров не удалась(если статус переменной будет false) и приложение отменит изменение настроек драйвера, вернув старые настройки<br/>
Пример обработки новых настроек модуля
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_MODULE_START, 0, function(){
module.ChangeProperties = function (in_oSetup, in_oModule) {
if (typeof (in_oSetup) == "string")
in_oSetup = JSON.Parse(in_oSetup);
var l_nChannel = in_oSetup.Module["Channel count"];
if (l_nChannel >= COUNT_CHANNEL) {
module.FinishUpdateSettings = true;
// Recreating element on cycle
for (var count = 1; count <= in_nChannel; count++) {

// Creating subDevice
l_oSubDevice = module.AddSubDevice("Relay " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_RELAY);

// Create revers
if (!l_oSubDevice.GetProperty("Reverse"))
l_oSubDevice.SetProperty("Reverse", 0);

// Assigned to the variable name of the channel
var l_sChannelName = "Relay:channel" + count;

// Adding channels
l_oSubDevice.AddChannel(l_sChannelName, Data);
l_oSubDevice.AddTag(l_sChannelName, Data);

// Adding smart virtual tag
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_TAG_POWER, true);
};
}
else {
for (var count = 1; count <= COUNT_CHANNEL; count++)
if (l_nChannel < count) {
var l_oDeleteSubDevice = module.GetSubDevice("Relay " + count);
module.DeleteSubDevice (l_oDeleteSubDevice.ID);
};
};
};
});
</syntaxhighlight>

Translations:DevManual/207/en

2017-04-17T05:18:55Z

Ildar:

When the user clicks on this button, the application opens the Setup window that was used to install the module. In this window, the user enters new settings and presses the "Done" button. After that, the application runs the above function. The driver settings can be changed by the application itself, other module settings developer must change manually. New settings are written to the input parameter in_oSetup as a JSON line.

Translations:DevManual/208/en

2017-04-17T05:18:26Z

Ildar: Новая страница: «Also in this function you need to process the success of changing settings. The flag is responsible for this.»

Also in this function you need to process the success of changing settings. The flag is responsible for this.

DevManual/en

2017-04-17T05:18:26Z

Ildar: Новая страница: «Also in this function you need to process the success of changing settings. The flag is responsible for this.»

<languages/>
=Module development guide=
==Definitions==

'''Module''' - is a component that allows you to control one type of equipment by its unique ID. The module is located in the store of modules.

'''Control panel (mobile device)''' - is a device from which the project i3 lite is launched (tablet, smartphone).

'''Store of modules''' - is a cloud server for uploading ready-made modules. The module store is available from the i3 lite application or on our[http://www.iridiummobile.ru/store/ site]

'''iRidium Studio''' - is a editor that allows to create the module to control device for i3 lite application. You need to use a special editor build for [http://www.iridiummobile.net/redirects/?go=iRidium_SETUP_LITE module developers] to develop the module

'''i3 lite''' - is an application to create, set and use i3 lite projects.

'''i3 lite project''' – is an automation project made up of ready equipment control modules. i3 lite projects differ from i2 Control projects: i3 lite projects can be edited dynamically without prior editing in iRidium Studio. i3 lite project consists of several small parts that can be put together into a single whole in i3 lite app with the help of the built-in constructor. It can also be easily edited in the app. As a result, a big number of intermediate processes are no longer necessary, such as installing software on PC, uploading projects on contol panels. All is done in one place - a control panel.

'''SubDevice''' - This is a virtual representation of the working area of the physical device. If we take as an example a 6-channel dimmer it has 6 sub-devices, because each independent device requires a separate control interface and connects to one channel.

'''Room (in i3 lite)''' - The visual part of i3 lite containing hardware management widgets. The project in i3 lite consists of rooms located on the floors

'''Widget''' - is a visual module component located in the room. It has limitations in size and fixed position in the room interface. It contains the main module functionality. For additional functions Remote is used.

'''Remote''' - is a visual module component which is hidden by default. It opens only when clicking on the corresponding item of the widget. It does not have size limitations (not more than the panel display size) and can be located in any part of the room interface (it is usually located in the middle of the panel display). It contains additional functionality of the module.

'''Macros''' - is a sequence of commands of various modules, which is activated by pressing. Contains "Action" and "Condition". For example, the macros "turn off all the lights in the house" will send the shutdown command to all devices responsible for lighting.

'''Routine''' - is a sequence of commands of various modules, which is activated automatically when a certain event occurs. Contains "Event", "Action" and "Condition". For example, "turn on the light if the motion sensor is triggered"

'''Event''' - is a routine component that describes the control command and the value range. If the value is sent in the indicated range, the routine is executed. For example, the event "Motion appeared" is activated if the motion sensor is triggered.

'''Action''' - is a component of macros and routines. It describes the control command and value that must be sent to the command. For example, "turn on the light". There are 2 types of Action: Simple Action and Advanced Action.

'''Simple Action''' - Simple Action is used when the command and Action value are known in advance.

'''Advanced Action''' - Advanced Action is used when the command is known but the value is unknown. The value is set dynamically when Action is used in i3 lite (but not when creating in iRidium studio).

'''Condition''' - is a component of macros and scenes. It describes the control command and value range. When a value from the value range is sent Action is executed.

'''Scanner''' - is a software part, that analyzes any bus looking for connected devices. Found connected devices are displayed in a list. Modules for the found devices are downloaded from iRidium store and the devices become available to control in i3 lite.
==Module concept==
The module is an independent subroutine of the i3 lite application which is built in the project and has an independent interface, driver and logic. Modules are developed in the [http://www.iridiummobile.net/redirects/?go=iRidium_SETUP_LITE iRidium Studio] editor and located in the module store [http://www.iridiummobile.ru/store/ iRidium Store]. Integrator downloads the module from the module store for each individual project.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ModuleInScheme.png]]</div></div>
</div>

There are two types of modules:
*Control module - module for hardware control
*Scanner - module for searching hardware in the local network and loading modules for found devices
== How to start developing the module ==
----

{{i}} Before starting your work, it is recommended to read [http://dev.iridiummobile.net/How_to_begin iRidium documentation]. It describes the basics of working with iRidium. The i3 lite documentation describes how to develop modules for the i3 lite platform for users, who already know iRidium. If you want to write script use [[Special:MyLanguage/Developers_API | i3 lite API]].
----

The module life cycle consists of:
* Developing the graphic part in iRidium studio
* Developing the driver part (scripts, devices)
* Testing
* Publishing in iRidium store
* Using (module download via the i3 lite application from the cloud and adding to automation projects)
<br/>
==Module structure ==
Each module must consist of subdevices. The subdevice is a virtual representation of the working area of a physical device. Many devices support multiple workgroups with the same functionality. Each workgroup may be in a separate zone. To fully control the zone, you need to create a subdevice for each workgroup of the device. For example, a 6-channel HDL dimmer contains 6 dimmable channels, through which 6 working groups can be controlled. Therefore, it is advisable to select in the module 6 subdevices for the possibility of creating actions, events and conditions for each workgroup separately. The presence of subdevice in the i3 lite module is obligatory. The number of sub-devices can be from one to many. Usually the number of subdevice is equal to the number of channels of the controller, the number of its work areas or logical devices.

Subdevice consists of:
* Conditions
* Actions
* Events
* Widgets

Conditions, actions and events are logical elements of the subdevice, on their basis macros and routines are created. Widget is a graphical element, through which the user will control subdevice. Usually one subdevice contains one widget, but the number of conditions, actions and events varies (from zero to many). The number of subdevices in the module can be either fixed or not. For example, you can develop a module only for a 6-channel dimmer, and you can make a module that will request the hardware for the number of subdevices and create the required number of subdevices.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ModuleStruct.png]]</div></div>
</div>
==Creating the module interface ==
The interface part of the midule consists of:
* widgets - interface part of the subdevice, which is located in the rooms and has basic control functions
* Remote - interface part of the module, which has a set of device functions and opens to the full screen, when you click on the widget button
* Authorization window - Authorization is required to work with some devices. To do this, the developer can create a special authorization window that is available in the module settings
* The module settings window is a window where you need to enter the parameters for the module operation
картинка окна настроек модуля и кнопки открытия
The whole graphic part is drawn in the graphical interface of the iRidium studio editor. In contradistinction to i3 pro, the module's interface should be made up of ready-made graphic components located in the gallery.

==== Widget ====

Widget is a visual component of the module, a kind of Popup that will be displayed in the room. The main task of the widget is to display the basic controls of the subdevice and to provide a module transition to the Remote control of the subdevice. For example, to control a media player, you can place a volume slider or Mute button for quick access to adjusting the volume. The weather widget can display the current weather, and the control panel will contain the weather forecast for all 5 days.<br />
The module does not make sense without widget, because it will not have a graphical representation in the i3 lite project.

Widget has a limited size
# Width '''640'''
# Height can not exceed '''1200'''

[[Файл:Пример виджета.png|center|thumb|Рис. Widget example]]

To create a widget, click the Add pop-up button in the Project overview panel and in the appeared menu select popup type: "Widget", set the name and properties:
[[Файл:ПанельПопап.png|thumb|center]]

Properties of a created widget can be changed with the help of '''Object Properties'''.<br />
Graphic items are assigned to channels like in popups:
[[Файл:Связывание_канала_команды_и_графического_элемента.png|center|thumb|Рис. Связывание канала команды и графического элемента]]
Widget will be displayed:
* In the room when a client uses the project
[[Файл:В_комнате_при_использовании_пользователем_проекта.png|center|thumb|]]
* In the module settings when it is added to the project:
[[Файл:И_в_настройках_модуля_при_добавлении_его_в_проект.png ‎|center|thumb|]]
====Remote and other graphic windows====

Remote (a remote control) is a graphical area to control SubDevices. Unlike wigets, it can have free size and position. And it is displayed on call. Remote is displayed when a button to go to the remote control is pressed on a widget.
Items to control equipment are placed on Remote (buttons, lists, switches, levels). There can be from 0 to several remote controls. Example of Remote:<br />
[[Файл:Пульт_управления.png ‎|center|thumb|]]<br />

Remote is created like a Widget. The only difference is to select "Remote" when you click "Add Popup Page" in the "Device Type" property.
==Interface design standard==
For the convenience of interface design, a standard was developed in which graphic windows should be developed in the module so that the modules of different developers looked uniformly within the framework of one project.
===Basic principles===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:GeneralUI.png]]</div></div>
<div class="col-sm-12 col-md-6">
Виджет состоит из «Header» и дополнительных модулей основного функционала. <br/>
«Header» — верхний модуль виджета.<br/>
«Header» содержит:<br/>
- наименование виджета;
- наименование устройства, которым<br/>
управляет виджет;<br/>
- иконка категории устройства.<br/>
<br/>
Дополнительные модули содержат элементы управления устройством.
</div>
</div>
===Module grid and blocks===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka1.png]]</div></div>
<div class="col-sm-12 col-md-6">
Module grid widget is a block 640 pt wide
And 120 pt in height. Each block has a grid of 8x8 pt.
The rounding of the corners is 12.5 ut. (Circle 25)
</div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka2.png]]</div></div>
<div class="col-sm-12 col-md-6">
The principle of constructing a widget block is a constructor from
Controls (buttons, switches, labels) from smaller to larger.
</div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka3.png]]</div></div>
<div class="col-sm-12 col-md-6">
Control items are combined and united in a block, blocks are united into a control panel.
</div>
</div>
===Buttons===
<big>'''Toggle'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Toggle.png]]</div></div>
<div class="col-sm-12 col-md-6">
Кнопка изменения значения «вкл/выкл». Применяется для отправки команды на устройство, вне зависимости от его текущего состояния.
</div>
</div>
<big>'''Switch'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Switch.png]]</div></div>
<div class="col-sm-12 col-md-6">
«On/off» switch. It is used only when the currect device status is known.
</div>
</div>
<big>'''Multistate'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Multistate.png]]</div></div>
<div class="col-sm-12 col-md-6">
Multistate button is used only when the current device status is known.
</div>
</div>
===Arrow-button===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:arrow1.png]]</div></div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:arrow2.png]]</div></div>
</div>
'''Действие кнопки'''<br/>
При нажатии на кнопку происходит вызов «PopUp».<br/>
'''Содержимое «PopUp»'''<br/>
«Input field», «Single selection», «Multiple selection».
===Sliders===
<div class="row">
<div class="col-sm-12 col-md-6">
Standart
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:StandartSlider.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
Value
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ValueSlider.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
Progress
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ProgressSlider.png]]</div></div>
</div>
===Description===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Description.png]]</div></div>
===Icons===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Icons1.png]]</div></div>
All icons are devided by their spheres of use, their main differene is the size.
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Icons2.png]]</div></div>
===«Header» widget===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:WidgetHeader.png]]</div></div>
===Icon location===
<div class="row">
<div class="col-sm-12 col-md-6">
The standard is 128х120 pt
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:FormFactor.png]]</div></div>
</div>
All buttons have two states - active and inactive
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:OFFicon.png]]</div></div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ONicon.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
When the button in inactive the color is always # 848484 or RGB 132
</div>
<div class="col-sm-12 col-md-6">
The state of a button is considered active, when the action received feedback and is short or instant (e.g. «Play» in a media player) or an acrion that is active for a long time and demands another activity to switch off the active state (e.g. «Repeat» in a media player).
</div>
</div>
==Basics of working with scripts==

To design an interface and to add a driver, you are to develop the logics of module work via script. The script part of developing i3 lite modules has a number of special features. Before developing the script part of i3 lite modules, please, read [http://dev.iridiummobile.net/JS_Guide iRidium Pro API] and [[Special:MyLanguage/Developers_API | i3 lite API]]. <br />

A module can contain any number of scripts. There are several types of scripts for modules:
* Driver - script files of this type contain script, responsible for working with a driver
* GUI - script files of this type contain script, responsible for working with graphics
* Common - script files of this type must contain general scripts, such as a set of additional functions or a description of classes of secondary importance
* Setup - a special script file that contains information about module setting, a list of fields that are obligatory to fill in, types of these fields and functions that check the correctness of entered data.

Devision into types is necessary for the module correct work on the server. Only logics and the driver part work on the server, but the server knows nothing about the graphic part. That's why a module developer has to devide scripts into types. The server does not notice files for working with the graphic part. <br />

When modules are developed module names have to be used instead of IR. Thus, a listener looks this way module.AddListener… <br />

Каждый скриптовой файл должен начинаться со слушателя
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_MODULE_START, 0, function(){});
</syntaxhighlight>
Это новый вид события, предназначенный специально для разработки модуля. При разработке модуля следует учитывать что скриптовой файл стал закрыт для других скриптовых файлов. Это хзначить что теперь можно использовать одноименные переменные и названия функций в разных скриптовых файлах и они не будут перезаписываться, но это накладывает ограничение: нельзя получить доступ к функции из другого скриптового файла простым способом. Для получения доступа к функции из другого скриптового файла, следует импортировать скриптовый файл с помощью команды module.Import("FileName.js"). <br />
Example:<br/>
<syntaxhighlight lang="javascript">
//Name_1.js - first js file
this.Text = "Hello, world!"; //Pointer to a text variable
//Name_2.js - second js file
var Text = module.Import("Name_1.js").Text; //Importing an object with a pointer to a text variable from the first js file
IR.Log(Text); //"Hello, world!" //log the text variable
</syntaxhighlight>
==Creating a subdevice==
The basis of every module is subdevices. The task of every module developer is to define how many subdevices a module has and to develop the logics of subdevice work. Each subdevice may contain a widget, a remote control, a set of actions, events and states. All contents of a subdevice have to be indicated when a subdevice is created. Subdevice contents can't be changed during module work. The following command is used to create a subdevice:<br/>
<syntaxhighlight lang="javascript">
module.AddSubDevice(SystemName, [Device], [System], [Type], [Tags], [Name], [Callback]);
</syntaxhighlight>
where<br/>
'''SystemName''' - subdevice system name<br/>
'''Device''' - a driver to which a subdevice will be assigned<br/>
'''System''' - old parameter, "false" is to be used<br/>
'''Type''' - type of smart device. Parameter is under development<br/>
'''Tags''' - Array of virtual tag objects<br/>
'''Name''' - subdevice name that is displayed to the user<br/>
'''Callback function(){do somethings}''' - a function that is on till the IR.EVENT_ADD_SUBDEVICE event happens.<br/>
As a reply the function returns a link to a subdevice, that can be used to address it.<br/>
An example of creating subdevices for HDL Relay devices. The script checks th number of devices in the bus and creates subdevices.<br/>
<syntaxhighlight lang="javascript">
for (var count = 1; count <= COUNT_CHANNEL; count++) {
// Creating a subdevice
l_oSubDevice = module.AddSubDevice("Relay " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_RELAY);
// Creating StatusOnStart command
if (count == 1)
l_oSubDevice.AddChannel("Relay:statusOnStart", [ChannelData]);
var l_sChannelName = "Relay:channel" + count;
// Adding channels
l_oSubDevice.AddChannel(l_sChannelName, [ChannelData]);
l_oSubDevice.AddTag(l_sChannelName, [ChannelData]);
// Add a virtual tag
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_TAG_POWER, true);
};</syntaxhighlight><br/>
Everything that is required can be added to a subdevice this way. An event is activated when a subdevice is created.<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function, [pointer]);
</syntaxhighlight><br/>
A link to a subdevice that was created is sent to a function. Different components can be added to subdevice in this event, such as, actions, events, states, widgets, chanels, tags. For example,<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function(in_oSubDevice){
Creating actions
in_oSubDevice.AddAction("On", false, in_oSubDevice.SystemName + "_Power", lightID + "_1", IR.SUB_DEVICE_COMMAND_POWER_ON);
in_oSubDevice.AddAction("Off", false, in_oSubDevice.SystemName + "_Power", lightID + "_0", IR.SUB_DEVICE_COMMAND_POWER_OFF);
Creating events
in_oSubDevice.AddEvent("On", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "1");
in_oSubDevice.AddEvent("Off", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "0");
Creating states
in_oSubDevice.AddCondition("On", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "1");
in_oSubDevice.AddCondition("Off", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "0");
});</syntaxhighlight><br/>
Thus, a developer can create the required number of subdevices when a module is installed or when new subdevices are added manually.
==Adding a widget to a subdevice==

After an interface is created in the studio and a function to add subdevices is added, create a copy of a widget for each subdevice and assign it to the subdevice. To assign a widget to a subdevice the following method is used.<br/>
<syntaxhighlight lang="javascript">SubDevice.addWidget(in_Widget)</syntaxhighlight><br/>


The input parameter of the method is '''in_Widget''' - an object, a widget, created in the studio beforehand.<br />
The output parameter of the method is '''True''' or '''False''' (successful or not).<br />
For example, we have 3 lamps. Not to create a separate wiget for each lamp, use a ready template and clone it. Here is an example of creating widgets with the help of a code using the existing template .<br />

Clone method allows to clone an existing popup.<br/>
<syntaxhighlight lang="javascript">Module.ClonePopup (in_Popup, in_Name)</syntaxhighlight><br/>
Входные параметры метода:
*'''in_Name''' - имя нового виджета.<br/>
*'''in_Popup''' - ссылка на всплывающее окно.<br/>
Выходным параметром метода является: успешно или нет ('''True''', '''False''').<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function(in_oSubDevice){
var popup = module.GetPopup("Dimmer"); // Calling a widget that we want to clone
// Creating a widget using cloning method
var widget = in_oSubDevice.addWidget(module.ClonePopup(popup, "Dimmer"+ in_oSubDevice.Name));
});</syntaxhighlight><br/>
----
{{i}} Names of new widgets must not be repeated
----
When a complete remote control is opened it is necessary to remmeber that a user will use the module both on a tablet and on a smart phone. The difference betwen the screen sizes makes a developer design 2 types of windows: a version for smart phones and a version for tablets. In addition a method must be added to the script that asks the system about the type of device where a module is launched and open the required window.
<syntaxhighlight lang="javascript">
if (IR.DisplayType == IR.DISPLAY_TYPE_PHONE) { //If a module is opened on a smart phone
var l_oPopupScanner = module.GetPopup("Phone"); //show a popup created for a smart phone
}
else {
var l_oPopupScanner = module.GetPopup("Tablet");//If a module is opened on a tablet, show a popup for a tablet
}
</syntaxhighlight><br/>
==Work with channels and tags==
After creating a subdevice and adding a widget you must add to the subevice channels and tags required for its work. Like in i3 pro version, a driver can be added in the studio or via script. Each subdevice requires a personal set of channels and tags for the selected driver. You may work with the following three components:<br/>
*Channel. The following method is used to create a channel<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddChannel(Name, DataArray)
</syntaxhighlight>where<br/>
'''Name''' - channel name<br/>
'''DataArray''' - data array (specific for every driver)<br/>
*Tag The following method is used to create a tag<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddTag(Name, DataArray)
</syntaxhighlight>where<br/>
'''Name''' - tag name<br/>
'''DataArray''' - data array, specific for every driver<br/>
*Virtual tag. The following method if used to create a virtual tag<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddVirtualTag(Name, Value, [Edit], [smartID], [Hidden])
</syntaxhighlight>where<br/>
'''Name'''- name of a subdevice virtual tag<br/>
'''Value''' - Tag value<br/>
'''Edit''' - Permission to edit a tag<br/>
'''smartID''' - Parameter is under development! Set "false"<br/>
'''Hidden''' - Feature of a hidden tag<br/>
===An example of creating channels and tags when creating a subdevice===
<syntaxhighlight lang="javascript">
l_oSubDevice = module.AddSubDevice("Light " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_DIMMER);

// Adding channel StatusOnStart
if (count == 1)
l_oSubDevice.AddChannel("Dimmer:statusOnStart", [ChannelData]);

// Assigned to the variable name of the channel
var l_sChannelName = "Dimmer:channel" + count;

// Adding channels
l_oSubDevice.AddChannel(l_sChannelName, [ChannelData]);
l_oSubDevice.AddTag(l_sChannelName, [TagData]);

// Adding smart virtual tag
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_COMMAND_POWER, true);
l_oSubDevice.AddVirtualTag("Power On", 0, false, IR.SUB_DEVICE_COMMAND_POWER_ON, true);
l_oSubDevice.AddVirtualTag("Power Off", 0, false, IR.SUB_DEVICE_COMMAND_POWER_OFF, true);
l_oSubDevice.AddVirtualTag("Level", 0, false, IR.SUB_DEVICE_COMMAND_LEVEL, true);
</syntaxhighlight>
==Setting a module in the app==
Modules are stored in iRidium store and can be installed in the app using one of the following ways:<br/>
*With the help of a scanner<br/>
*Manually<br/>
===Developing the Setup file===
The Setup file must be developed for each variant. It's a special script file with fields that are required for module work. These fields can be device IP address, port, city name, etc. To develop a Setup file, create a new script file and select its type - "Setup". Eacn field is a tag and can be accessed from the script, and the input value can be received.
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:СетапБонго.png]]</div></div>
The Setup file consists of 2 parts. Part 1 is the driver settings. The settings must require IP addresses, ports and logins to connect the driver to a device. Part 2 is the module general settings, such as number of outputs, access keys.
To set fields in the Setip file set the following fields in the script:
* Field type - indicate what field must be shown to a user (text field, data array, etc. Detailed description is given in API)
* Field name - name of field that a user sees when setting a module
* Default value - what value must be put by default
* Check function - a function to validate value in the field. A function must be written that checks the correctness of the entered data.
For example,"Setup" script for HDL module looks this way:
<syntaxhighlight lang="javascript">
{
// Data to connect drivers, created in Project Device Panel
Drivers:
[
{
Name: "HDL-BUS Pro Network (UDP)",
Properties:
[
{
Type: "textfield",
Name: "Host",
DefaultValue: "255.255.255.255",
Validation: function(in_sValue) {
var l_aValueHost = in_sValue.split(".");
if (l_aValueHost.length != 4) {
return "Please input correct Host";
} else
if (parseInt(l_aValueHost[0], 10)>=0
&& parseInt(l_aValueHost[0], 10)<=255
&& parseInt(l_aValueHost[1], 10)>=0
&& parseInt(l_aValueHost[1], 10)<=255
&& parseInt(l_aValueHost[2], 10)>=0
&& parseInt(l_aValueHost[2], 10)<=255
&& parseInt(l_aValueHost[3], 10)>=0
&& parseInt(l_aValueHost[3], 10)<=255
)
return 0
else
return "Please input correct Host";
}
},
{
Type: "textfield",
Name: "Port",
DefaultValue: "6000",
Validation: function(in_sValue) {
if(parseInt(in_sValue, 10)>=0)
return 0
else
return "Please input correct Port";
}
}
]
}
],

// General information for the module (driver and generated by script)
Module: [{
Name: "Channels Count",
Validation: function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input Count";
}
},
{
Type: "textfield",
Name : "SubnetID",
Validation : function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input SubnetID";
}
},
{
Type: "textfield",
Name : "DeviceID",
Validation : function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input DeviceID";
}
}

]
}
</syntaxhighlight>
To get data from Setup fields use the following function
<syntaxhighlight lang="javascript">
module.GetProperty("Field name")
</syntaxhighlight>
<br />
Besides standard parameters, any parameters required for module inizialization can be asked. Driver parameters are set in the driver automatically. The other parameters are to be asked and used manually.<br />
An example of work with Setup parameters
<syntaxhighlight lang="javascript">
var COUNT_CHANNEL = parseInt(module.GetProperty("Channel count")); // Getting count channel
var SubNetID = parseInt(module.GetProperty("SubnetID")); // Getting subnet id
var DeviceID = parseInt(module.GetProperty("DeviceID")); // Getting device id
</syntaxhighlight>
===Installing a module manually===
To install a module manually no additional script development is required. A user must go to iRidium store from the app, find a module, download it and enter date in the fields indicated in the Setup file. After it the app installs the module in the system with parameters entered by a user.
===Installing a module with the help of a scanner===
'''Scanner (сканер)''' - это модуль, который анализирует какую-либо шину на подключённые устройства либо ищет устройства в локальной сети. Найденные устройства формируются в список, для выбранного устройства качается модуль и становится доступен в i3 lite. <br/>
Схема работы сканера:
# Сканер загружается из магазина;
# Пользователь вводит параметры сканера (IP, Port и т.д) и эти параметры передаются в скрипт сканера;
# Сканер, обработав введенные параметры, опрашивает шину на устройства или ищет устройства в локальной сети;
# Из полученных устройств формируется список;
# При выборе определенного устройства в списке, сканер передаёт параметры выбранного устройства в модуль.
<br/>
При разработке сканера нужно учесть:
* Параметры сканера, при добавлении из магазина;
* Логику сканера;
* Передачу параметров выбранного устройства в модуль;
* Логику модуля, с учётом переданных от сканера параметров.
<br/>
Процесс разработки сканера ничем не отличается от разработки модуля. Точно также сканеру необходимо нарисовать визуальную часть, создать драйвер и написать скрипт с логикой. Основным отличием является то, что сканер может работать только на панели управления и сканер никогда не будет запущен на сервере, поэтому, при разработке скриптов, нет необходимости разделять скрипты на драйверные и интерфейсные.
<br/>
Также при разработке сканера появляется новая логика работы. Первым делом необходимо сделать модуль для управления устройством, далее надо загрузить модуль в магазин модулей. При загрузке модуля, вы увидите уникальный идентификатор вашего модуля. Когда вы будете разрабатывать сканер, вам необходимо написать скрипт со следующей логикой:
# Создание драйвера
# Поиск оборудования
# Если оборудование найдено, надо определить что это за оборудование
# При помощи команды ModuleSetupFinish (ID модуля, js объект с настройками setup данного модуля)
После этого приложение скачет модуль из магазина модулей и установит его.<br/>
The distinctive feature of developing a scanner is the event that lauches the driver work. When developing a scanner use the following event
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_OPEN_SCANNER, 0, function (){});
</syntaxhighlight>
A scanner must be developed after modules are developed. The developed modules are registered in the store of modules and are given a unique ID. After a scanner finds devices in the local net, the script must download a module for the found equipment by the indicated ID. To download a module use the following function
<syntaxhighlight lang="javascript">
IR.ModuleSetupFinish(StoreID, ModuleData, [Callback])
</syntaxhighlight>
where
* StoreID - module ID in the store of modules
* ModuleData - data required for installing a module (fields in Setup)
* Callback - a function to process errors that happened in the installation process (optional)
An example of a developed scanner for HDL modules. To install any module the following parameters are required: Type,SubNet id, Device id, module name, bus IP address, port.
<syntaxhighlight lang="javascript">
//Example of installing HDL Dimmer with a scanner
var l_nStoreID = 82;
var l_oModuleData = {
Module: {
//Data required for module work
Type: "Dimmer",
SubnetID: 3,
DeviceID: 6
Name: "HDL Dimmer"
}
Drivers: {
//Data for the driver
"HDL-BUS Pro Network (UDP)": {
Host: "255.255.255.255", //installing a host for the driver
Port: "6000" //installing a port for the driver
},
}
}

IR.ModuleSetupFinish(l_nStoreID, l_oModuleData, function(in_error){
if (!in_error){
...
} else {
...
}
});
</syntaxhighlight>
===Adding subdevices manually===
After adding the subdevices via the scanner or Setup, the user may have a need to add other subdevices. To ensure this, module developer has to assign the system variable
<syntaxhighlight lang="javascript">
SettingsPopupName = module.GetPopup('AddSubDevicePopup');
</syntaxhighlight >
You have to assign a window with the results of the scanner operation or a popup in which the user can configure a new subdevice or add this subdevice. This popup should be developed by the developer himself.<br/>
If the popup is assigned to the specified system variable, the user will see a "+" button in the module settings section. This button opens the specified popup
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:AddSubdeviceBtn.png]]</div></div>
</div>
Example of specifying the adding subdevices window. When developing, you need to create an adding window in the tablet resolution and a separate window in the smartphone resolution
<syntaxhighlight lang="javascript">
module.SettingsPopupName = IR.DisplayType != IR.DISPLAY_TYPE_TABLET? module.GetPopup("phone:NoAuthorize").Name: module.GetPopup("NoAuthorize").Name;
</syntaxhighlight >
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:AddSubdeviceWindow.png]]</div></div>
</div>
===Authorization===
To work with certain devices a user's authorization in a third-party system is required. i 3lite app has a special authorization mechanism for this purpose.<br/>
To authorize a user has to enter his access data in a special window. This window is unique for every device and a module developer must create it. A window to enter data is a popup with fields to enter data. The popup is created with the help of standard means of the studio and it may be unassigned to any subdevices. When access data are entered, the script must authorize in a third-party system and close the authorization window. After creating an authorization popup, a developer must call the authorization system variable in the script and assign the created popup in the variable.
<syntaxhighlight lang="javascript">
AuthorizationPopupName = module.GetPopup("AutorisationPopup");
</syntaxhighlight ><br/>
After an authorization popup is assigned to a variable, "Authorize" button appears in the module settings.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:NeedAuthorization1.png]]</div></div>
</div>
When this button is pressed, the app opens the authorization popup, assigned in the script. The next task for a module developer is to display a user's status (Authorized or not). There is a system variable to solve this task.
<syntaxhighlight lang="javascript">
AuthorizationStatus = true;
</syntaxhighlight ><br/>
If a user is authorized in the system, true value is assigned to the variable and the app changes the status of the authorization button into:
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Logout1.png]]</div></div>
</div>
A module devloper must also think about the mechanism of deauthorization. It is done on the authorization popup.<br/>
An example of the authorization script
<syntaxhighlight lang="javascript">
if (module.AuthorizationStatus == false) { //If a user is not authorized
module.AuthorizationPopupName = WindowSettings.Window.Name;//Assigning the authorization popup created earlier
} else if (module.AuthorizationStatus) //If a user is authorized
{
module.AuthorizationPopupName = IR.DisplayType != IR.DISPLAY_TYPE_TABLET? module.GetPopup("phone:deAuth").Name: module.GetPopup("deAuth").Name;//Showing the deauthorization popup
}
</syntaxhighlight ><br/>
Note. Remember to create a separate authorization/deauthorization popup for a smart phone and for a tablet.
===Changing settigns===
While working with the application, there may be a need to change the settings of the module. To provide such an opportunity, the module developer must create a function to change the module settings and assign it to the system method
<syntaxhighlight lang="javascript">
module.ChangeProperties = function (in_oSetup)
{
Processing of new module parameters
}
</syntaxhighlight>
When declaring this function, the application will add an edit settings button in the module.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ChangeBtn.png]]</div></div>
</div>
When the user clicks on this button, the application opens the Setup window that was used to install the module. In this window, the user enters new settings and presses the "ready" button. After that, the application runs the above function. The driver settings can be changed by the application itself, other module settings developer must change manually. New settings are written to the input parameter in_oSetup as a JSON line.<br/>
Also in this function you need to process the success of changing settings. The flag is responsible for this.
<syntaxhighlight lang="javascript">
module.FinishUpdateSettings = true;
</syntaxhighlight>
Если установка новых параметров прошла успешно, то надо выставить значение флага true, а обратном случае флаг должен принять значение false. Это позволяет приложению понять что смена параметров не удалась(если статус переменной будет false) и приложение отменит изменение настроек драйвера, вернув старые настройки<br/>
Пример обработки новых настроек модуля
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_MODULE_START, 0, function(){
module.ChangeProperties = function (in_oSetup, in_oModule) {
if (typeof (in_oSetup) == "string")
in_oSetup = JSON.Parse(in_oSetup);
var l_nChannel = in_oSetup.Module["Channel count"];
if (l_nChannel >= COUNT_CHANNEL) {
module.FinishUpdateSettings = true;
// Recreating element on cycle
for (var count = 1; count <= in_nChannel; count++) {

// Creating subDevice
l_oSubDevice = module.AddSubDevice("Relay " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_RELAY);

// Create revers
if (!l_oSubDevice.GetProperty("Reverse"))
l_oSubDevice.SetProperty("Reverse", 0);

// Assigned to the variable name of the channel
var l_sChannelName = "Relay:channel" + count;

// Adding channels
l_oSubDevice.AddChannel(l_sChannelName, Data);
l_oSubDevice.AddTag(l_sChannelName, Data);

// Adding smart virtual tag
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_TAG_POWER, true);
};
}
else {
for (var count = 1; count <= COUNT_CHANNEL; count++)
if (l_nChannel < count) {
var l_oDeleteSubDevice = module.GetSubDevice("Relay " + count);
module.DeleteSubDevice (l_oDeleteSubDevice.ID);
};
};
};
});
</syntaxhighlight>

DevManual/en

2017-04-17T05:17:25Z

Ildar: Новая страница: «When the user clicks on this button, the application opens the Setup window that was used to install the module. In this window, the user enters new settings and…»

<languages/>
=Module development guide=
==Definitions==

'''Module''' - is a component that allows you to control one type of equipment by its unique ID. The module is located in the store of modules.

'''Control panel (mobile device)''' - is a device from which the project i3 lite is launched (tablet, smartphone).

'''Store of modules''' - is a cloud server for uploading ready-made modules. The module store is available from the i3 lite application or on our[http://www.iridiummobile.ru/store/ site]

'''iRidium Studio''' - is a editor that allows to create the module to control device for i3 lite application. You need to use a special editor build for [http://www.iridiummobile.net/redirects/?go=iRidium_SETUP_LITE module developers] to develop the module

'''i3 lite''' - is an application to create, set and use i3 lite projects.

'''i3 lite project''' – is an automation project made up of ready equipment control modules. i3 lite projects differ from i2 Control projects: i3 lite projects can be edited dynamically without prior editing in iRidium Studio. i3 lite project consists of several small parts that can be put together into a single whole in i3 lite app with the help of the built-in constructor. It can also be easily edited in the app. As a result, a big number of intermediate processes are no longer necessary, such as installing software on PC, uploading projects on contol panels. All is done in one place - a control panel.

'''SubDevice''' - This is a virtual representation of the working area of the physical device. If we take as an example a 6-channel dimmer it has 6 sub-devices, because each independent device requires a separate control interface and connects to one channel.

'''Room (in i3 lite)''' - The visual part of i3 lite containing hardware management widgets. The project in i3 lite consists of rooms located on the floors

'''Widget''' - is a visual module component located in the room. It has limitations in size and fixed position in the room interface. It contains the main module functionality. For additional functions Remote is used.

'''Remote''' - is a visual module component which is hidden by default. It opens only when clicking on the corresponding item of the widget. It does not have size limitations (not more than the panel display size) and can be located in any part of the room interface (it is usually located in the middle of the panel display). It contains additional functionality of the module.

'''Macros''' - is a sequence of commands of various modules, which is activated by pressing. Contains "Action" and "Condition". For example, the macros "turn off all the lights in the house" will send the shutdown command to all devices responsible for lighting.

'''Routine''' - is a sequence of commands of various modules, which is activated automatically when a certain event occurs. Contains "Event", "Action" and "Condition". For example, "turn on the light if the motion sensor is triggered"

'''Event''' - is a routine component that describes the control command and the value range. If the value is sent in the indicated range, the routine is executed. For example, the event "Motion appeared" is activated if the motion sensor is triggered.

'''Action''' - is a component of macros and routines. It describes the control command and value that must be sent to the command. For example, "turn on the light". There are 2 types of Action: Simple Action and Advanced Action.

'''Simple Action''' - Simple Action is used when the command and Action value are known in advance.

'''Advanced Action''' - Advanced Action is used when the command is known but the value is unknown. The value is set dynamically when Action is used in i3 lite (but not when creating in iRidium studio).

'''Condition''' - is a component of macros and scenes. It describes the control command and value range. When a value from the value range is sent Action is executed.

'''Scanner''' - is a software part, that analyzes any bus looking for connected devices. Found connected devices are displayed in a list. Modules for the found devices are downloaded from iRidium store and the devices become available to control in i3 lite.
==Module concept==
The module is an independent subroutine of the i3 lite application which is built in the project and has an independent interface, driver and logic. Modules are developed in the [http://www.iridiummobile.net/redirects/?go=iRidium_SETUP_LITE iRidium Studio] editor and located in the module store [http://www.iridiummobile.ru/store/ iRidium Store]. Integrator downloads the module from the module store for each individual project.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ModuleInScheme.png]]</div></div>
</div>

There are two types of modules:
*Control module - module for hardware control
*Scanner - module for searching hardware in the local network and loading modules for found devices
== How to start developing the module ==
----

{{i}} Before starting your work, it is recommended to read [http://dev.iridiummobile.net/How_to_begin iRidium documentation]. It describes the basics of working with iRidium. The i3 lite documentation describes how to develop modules for the i3 lite platform for users, who already know iRidium. If you want to write script use [[Special:MyLanguage/Developers_API | i3 lite API]].
----

The module life cycle consists of:
* Developing the graphic part in iRidium studio
* Developing the driver part (scripts, devices)
* Testing
* Publishing in iRidium store
* Using (module download via the i3 lite application from the cloud and adding to automation projects)
<br/>
==Module structure ==
Each module must consist of subdevices. The subdevice is a virtual representation of the working area of a physical device. Many devices support multiple workgroups with the same functionality. Each workgroup may be in a separate zone. To fully control the zone, you need to create a subdevice for each workgroup of the device. For example, a 6-channel HDL dimmer contains 6 dimmable channels, through which 6 working groups can be controlled. Therefore, it is advisable to select in the module 6 subdevices for the possibility of creating actions, events and conditions for each workgroup separately. The presence of subdevice in the i3 lite module is obligatory. The number of sub-devices can be from one to many. Usually the number of subdevice is equal to the number of channels of the controller, the number of its work areas or logical devices.

Subdevice consists of:
* Conditions
* Actions
* Events
* Widgets

Conditions, actions and events are logical elements of the subdevice, on their basis macros and routines are created. Widget is a graphical element, through which the user will control subdevice. Usually one subdevice contains one widget, but the number of conditions, actions and events varies (from zero to many). The number of subdevices in the module can be either fixed or not. For example, you can develop a module only for a 6-channel dimmer, and you can make a module that will request the hardware for the number of subdevices and create the required number of subdevices.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ModuleStruct.png]]</div></div>
</div>
==Creating the module interface ==
The interface part of the midule consists of:
* widgets - interface part of the subdevice, which is located in the rooms and has basic control functions
* Remote - interface part of the module, which has a set of device functions and opens to the full screen, when you click on the widget button
* Authorization window - Authorization is required to work with some devices. To do this, the developer can create a special authorization window that is available in the module settings
* The module settings window is a window where you need to enter the parameters for the module operation
картинка окна настроек модуля и кнопки открытия
The whole graphic part is drawn in the graphical interface of the iRidium studio editor. In contradistinction to i3 pro, the module's interface should be made up of ready-made graphic components located in the gallery.

==== Widget ====

Widget is a visual component of the module, a kind of Popup that will be displayed in the room. The main task of the widget is to display the basic controls of the subdevice and to provide a module transition to the Remote control of the subdevice. For example, to control a media player, you can place a volume slider or Mute button for quick access to adjusting the volume. The weather widget can display the current weather, and the control panel will contain the weather forecast for all 5 days.<br />
The module does not make sense without widget, because it will not have a graphical representation in the i3 lite project.

Widget has a limited size
# Width '''640'''
# Height can not exceed '''1200'''

[[Файл:Пример виджета.png|center|thumb|Рис. Widget example]]

To create a widget, click the Add pop-up button in the Project overview panel and in the appeared menu select popup type: "Widget", set the name and properties:
[[Файл:ПанельПопап.png|thumb|center]]

Properties of a created widget can be changed with the help of '''Object Properties'''.<br />
Graphic items are assigned to channels like in popups:
[[Файл:Связывание_канала_команды_и_графического_элемента.png|center|thumb|Рис. Связывание канала команды и графического элемента]]
Widget will be displayed:
* In the room when a client uses the project
[[Файл:В_комнате_при_использовании_пользователем_проекта.png|center|thumb|]]
* In the module settings when it is added to the project:
[[Файл:И_в_настройках_модуля_при_добавлении_его_в_проект.png ‎|center|thumb|]]
====Remote and other graphic windows====

Remote (a remote control) is a graphical area to control SubDevices. Unlike wigets, it can have free size and position. And it is displayed on call. Remote is displayed when a button to go to the remote control is pressed on a widget.
Items to control equipment are placed on Remote (buttons, lists, switches, levels). There can be from 0 to several remote controls. Example of Remote:<br />
[[Файл:Пульт_управления.png ‎|center|thumb|]]<br />

Remote is created like a Widget. The only difference is to select "Remote" when you click "Add Popup Page" in the "Device Type" property.
==Interface design standard==
For the convenience of interface design, a standard was developed in which graphic windows should be developed in the module so that the modules of different developers looked uniformly within the framework of one project.
===Basic principles===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:GeneralUI.png]]</div></div>
<div class="col-sm-12 col-md-6">
Виджет состоит из «Header» и дополнительных модулей основного функционала. <br/>
«Header» — верхний модуль виджета.<br/>
«Header» содержит:<br/>
- наименование виджета;
- наименование устройства, которым<br/>
управляет виджет;<br/>
- иконка категории устройства.<br/>
<br/>
Дополнительные модули содержат элементы управления устройством.
</div>
</div>
===Module grid and blocks===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka1.png]]</div></div>
<div class="col-sm-12 col-md-6">
Module grid widget is a block 640 pt wide
And 120 pt in height. Each block has a grid of 8x8 pt.
The rounding of the corners is 12.5 ut. (Circle 25)
</div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka2.png]]</div></div>
<div class="col-sm-12 col-md-6">
The principle of constructing a widget block is a constructor from
Controls (buttons, switches, labels) from smaller to larger.
</div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka3.png]]</div></div>
<div class="col-sm-12 col-md-6">
Control items are combined and united in a block, blocks are united into a control panel.
</div>
</div>
===Buttons===
<big>'''Toggle'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Toggle.png]]</div></div>
<div class="col-sm-12 col-md-6">
Кнопка изменения значения «вкл/выкл». Применяется для отправки команды на устройство, вне зависимости от его текущего состояния.
</div>
</div>
<big>'''Switch'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Switch.png]]</div></div>
<div class="col-sm-12 col-md-6">
«On/off» switch. It is used only when the currect device status is known.
</div>
</div>
<big>'''Multistate'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Multistate.png]]</div></div>
<div class="col-sm-12 col-md-6">
Multistate button is used only when the current device status is known.
</div>
</div>
===Arrow-button===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:arrow1.png]]</div></div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:arrow2.png]]</div></div>
</div>
'''Действие кнопки'''<br/>
При нажатии на кнопку происходит вызов «PopUp».<br/>
'''Содержимое «PopUp»'''<br/>
«Input field», «Single selection», «Multiple selection».
===Sliders===
<div class="row">
<div class="col-sm-12 col-md-6">
Standart
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:StandartSlider.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
Value
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ValueSlider.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
Progress
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ProgressSlider.png]]</div></div>
</div>
===Description===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Description.png]]</div></div>
===Icons===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Icons1.png]]</div></div>
All icons are devided by their spheres of use, their main differene is the size.
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Icons2.png]]</div></div>
===«Header» widget===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:WidgetHeader.png]]</div></div>
===Icon location===
<div class="row">
<div class="col-sm-12 col-md-6">
The standard is 128х120 pt
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:FormFactor.png]]</div></div>
</div>
All buttons have two states - active and inactive
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:OFFicon.png]]</div></div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ONicon.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
When the button in inactive the color is always # 848484 or RGB 132
</div>
<div class="col-sm-12 col-md-6">
The state of a button is considered active, when the action received feedback and is short or instant (e.g. «Play» in a media player) or an acrion that is active for a long time and demands another activity to switch off the active state (e.g. «Repeat» in a media player).
</div>
</div>
==Basics of working with scripts==

To design an interface and to add a driver, you are to develop the logics of module work via script. The script part of developing i3 lite modules has a number of special features. Before developing the script part of i3 lite modules, please, read [http://dev.iridiummobile.net/JS_Guide iRidium Pro API] and [[Special:MyLanguage/Developers_API | i3 lite API]]. <br />

A module can contain any number of scripts. There are several types of scripts for modules:
* Driver - script files of this type contain script, responsible for working with a driver
* GUI - script files of this type contain script, responsible for working with graphics
* Common - script files of this type must contain general scripts, such as a set of additional functions or a description of classes of secondary importance
* Setup - a special script file that contains information about module setting, a list of fields that are obligatory to fill in, types of these fields and functions that check the correctness of entered data.

Devision into types is necessary for the module correct work on the server. Only logics and the driver part work on the server, but the server knows nothing about the graphic part. That's why a module developer has to devide scripts into types. The server does not notice files for working with the graphic part. <br />

When modules are developed module names have to be used instead of IR. Thus, a listener looks this way module.AddListener… <br />

Каждый скриптовой файл должен начинаться со слушателя
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_MODULE_START, 0, function(){});
</syntaxhighlight>
Это новый вид события, предназначенный специально для разработки модуля. При разработке модуля следует учитывать что скриптовой файл стал закрыт для других скриптовых файлов. Это хзначить что теперь можно использовать одноименные переменные и названия функций в разных скриптовых файлах и они не будут перезаписываться, но это накладывает ограничение: нельзя получить доступ к функции из другого скриптового файла простым способом. Для получения доступа к функции из другого скриптового файла, следует импортировать скриптовый файл с помощью команды module.Import("FileName.js"). <br />
Example:<br/>
<syntaxhighlight lang="javascript">
//Name_1.js - first js file
this.Text = "Hello, world!"; //Pointer to a text variable
//Name_2.js - second js file
var Text = module.Import("Name_1.js").Text; //Importing an object with a pointer to a text variable from the first js file
IR.Log(Text); //"Hello, world!" //log the text variable
</syntaxhighlight>
==Creating a subdevice==
The basis of every module is subdevices. The task of every module developer is to define how many subdevices a module has and to develop the logics of subdevice work. Each subdevice may contain a widget, a remote control, a set of actions, events and states. All contents of a subdevice have to be indicated when a subdevice is created. Subdevice contents can't be changed during module work. The following command is used to create a subdevice:<br/>
<syntaxhighlight lang="javascript">
module.AddSubDevice(SystemName, [Device], [System], [Type], [Tags], [Name], [Callback]);
</syntaxhighlight>
where<br/>
'''SystemName''' - subdevice system name<br/>
'''Device''' - a driver to which a subdevice will be assigned<br/>
'''System''' - old parameter, "false" is to be used<br/>
'''Type''' - type of smart device. Parameter is under development<br/>
'''Tags''' - Array of virtual tag objects<br/>
'''Name''' - subdevice name that is displayed to the user<br/>
'''Callback function(){do somethings}''' - a function that is on till the IR.EVENT_ADD_SUBDEVICE event happens.<br/>
As a reply the function returns a link to a subdevice, that can be used to address it.<br/>
An example of creating subdevices for HDL Relay devices. The script checks th number of devices in the bus and creates subdevices.<br/>
<syntaxhighlight lang="javascript">
for (var count = 1; count <= COUNT_CHANNEL; count++) {
// Creating a subdevice
l_oSubDevice = module.AddSubDevice("Relay " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_RELAY);
// Creating StatusOnStart command
if (count == 1)
l_oSubDevice.AddChannel("Relay:statusOnStart", [ChannelData]);
var l_sChannelName = "Relay:channel" + count;
// Adding channels
l_oSubDevice.AddChannel(l_sChannelName, [ChannelData]);
l_oSubDevice.AddTag(l_sChannelName, [ChannelData]);
// Add a virtual tag
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_TAG_POWER, true);
};</syntaxhighlight><br/>
Everything that is required can be added to a subdevice this way. An event is activated when a subdevice is created.<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function, [pointer]);
</syntaxhighlight><br/>
A link to a subdevice that was created is sent to a function. Different components can be added to subdevice in this event, such as, actions, events, states, widgets, chanels, tags. For example,<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function(in_oSubDevice){
Creating actions
in_oSubDevice.AddAction("On", false, in_oSubDevice.SystemName + "_Power", lightID + "_1", IR.SUB_DEVICE_COMMAND_POWER_ON);
in_oSubDevice.AddAction("Off", false, in_oSubDevice.SystemName + "_Power", lightID + "_0", IR.SUB_DEVICE_COMMAND_POWER_OFF);
Creating events
in_oSubDevice.AddEvent("On", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "1");
in_oSubDevice.AddEvent("Off", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "0");
Creating states
in_oSubDevice.AddCondition("On", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "1");
in_oSubDevice.AddCondition("Off", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "0");
});</syntaxhighlight><br/>
Thus, a developer can create the required number of subdevices when a module is installed or when new subdevices are added manually.
==Adding a widget to a subdevice==

After an interface is created in the studio and a function to add subdevices is added, create a copy of a widget for each subdevice and assign it to the subdevice. To assign a widget to a subdevice the following method is used.<br/>
<syntaxhighlight lang="javascript">SubDevice.addWidget(in_Widget)</syntaxhighlight><br/>


The input parameter of the method is '''in_Widget''' - an object, a widget, created in the studio beforehand.<br />
The output parameter of the method is '''True''' or '''False''' (successful or not).<br />
For example, we have 3 lamps. Not to create a separate wiget for each lamp, use a ready template and clone it. Here is an example of creating widgets with the help of a code using the existing template .<br />

Clone method allows to clone an existing popup.<br/>
<syntaxhighlight lang="javascript">Module.ClonePopup (in_Popup, in_Name)</syntaxhighlight><br/>
Входные параметры метода:
*'''in_Name''' - имя нового виджета.<br/>
*'''in_Popup''' - ссылка на всплывающее окно.<br/>
Выходным параметром метода является: успешно или нет ('''True''', '''False''').<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function(in_oSubDevice){
var popup = module.GetPopup("Dimmer"); // Calling a widget that we want to clone
// Creating a widget using cloning method
var widget = in_oSubDevice.addWidget(module.ClonePopup(popup, "Dimmer"+ in_oSubDevice.Name));
});</syntaxhighlight><br/>
----
{{i}} Names of new widgets must not be repeated
----
When a complete remote control is opened it is necessary to remmeber that a user will use the module both on a tablet and on a smart phone. The difference betwen the screen sizes makes a developer design 2 types of windows: a version for smart phones and a version for tablets. In addition a method must be added to the script that asks the system about the type of device where a module is launched and open the required window.
<syntaxhighlight lang="javascript">
if (IR.DisplayType == IR.DISPLAY_TYPE_PHONE) { //If a module is opened on a smart phone
var l_oPopupScanner = module.GetPopup("Phone"); //show a popup created for a smart phone
}
else {
var l_oPopupScanner = module.GetPopup("Tablet");//If a module is opened on a tablet, show a popup for a tablet
}
</syntaxhighlight><br/>
==Work with channels and tags==
After creating a subdevice and adding a widget you must add to the subevice channels and tags required for its work. Like in i3 pro version, a driver can be added in the studio or via script. Each subdevice requires a personal set of channels and tags for the selected driver. You may work with the following three components:<br/>
*Channel. The following method is used to create a channel<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddChannel(Name, DataArray)
</syntaxhighlight>where<br/>
'''Name''' - channel name<br/>
'''DataArray''' - data array (specific for every driver)<br/>
*Tag The following method is used to create a tag<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddTag(Name, DataArray)
</syntaxhighlight>where<br/>
'''Name''' - tag name<br/>
'''DataArray''' - data array, specific for every driver<br/>
*Virtual tag. The following method if used to create a virtual tag<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddVirtualTag(Name, Value, [Edit], [smartID], [Hidden])
</syntaxhighlight>where<br/>
'''Name'''- name of a subdevice virtual tag<br/>
'''Value''' - Tag value<br/>
'''Edit''' - Permission to edit a tag<br/>
'''smartID''' - Parameter is under development! Set "false"<br/>
'''Hidden''' - Feature of a hidden tag<br/>
===An example of creating channels and tags when creating a subdevice===
<syntaxhighlight lang="javascript">
l_oSubDevice = module.AddSubDevice("Light " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_DIMMER);

// Adding channel StatusOnStart
if (count == 1)
l_oSubDevice.AddChannel("Dimmer:statusOnStart", [ChannelData]);

// Assigned to the variable name of the channel
var l_sChannelName = "Dimmer:channel" + count;

// Adding channels
l_oSubDevice.AddChannel(l_sChannelName, [ChannelData]);
l_oSubDevice.AddTag(l_sChannelName, [TagData]);

// Adding smart virtual tag
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_COMMAND_POWER, true);
l_oSubDevice.AddVirtualTag("Power On", 0, false, IR.SUB_DEVICE_COMMAND_POWER_ON, true);
l_oSubDevice.AddVirtualTag("Power Off", 0, false, IR.SUB_DEVICE_COMMAND_POWER_OFF, true);
l_oSubDevice.AddVirtualTag("Level", 0, false, IR.SUB_DEVICE_COMMAND_LEVEL, true);
</syntaxhighlight>
==Setting a module in the app==
Modules are stored in iRidium store and can be installed in the app using one of the following ways:<br/>
*With the help of a scanner<br/>
*Manually<br/>
===Developing the Setup file===
The Setup file must be developed for each variant. It's a special script file with fields that are required for module work. These fields can be device IP address, port, city name, etc. To develop a Setup file, create a new script file and select its type - "Setup". Eacn field is a tag and can be accessed from the script, and the input value can be received.
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:СетапБонго.png]]</div></div>
The Setup file consists of 2 parts. Part 1 is the driver settings. The settings must require IP addresses, ports and logins to connect the driver to a device. Part 2 is the module general settings, such as number of outputs, access keys.
To set fields in the Setip file set the following fields in the script:
* Field type - indicate what field must be shown to a user (text field, data array, etc. Detailed description is given in API)
* Field name - name of field that a user sees when setting a module
* Default value - what value must be put by default
* Check function - a function to validate value in the field. A function must be written that checks the correctness of the entered data.
For example,"Setup" script for HDL module looks this way:
<syntaxhighlight lang="javascript">
{
// Data to connect drivers, created in Project Device Panel
Drivers:
[
{
Name: "HDL-BUS Pro Network (UDP)",
Properties:
[
{
Type: "textfield",
Name: "Host",
DefaultValue: "255.255.255.255",
Validation: function(in_sValue) {
var l_aValueHost = in_sValue.split(".");
if (l_aValueHost.length != 4) {
return "Please input correct Host";
} else
if (parseInt(l_aValueHost[0], 10)>=0
&& parseInt(l_aValueHost[0], 10)<=255
&& parseInt(l_aValueHost[1], 10)>=0
&& parseInt(l_aValueHost[1], 10)<=255
&& parseInt(l_aValueHost[2], 10)>=0
&& parseInt(l_aValueHost[2], 10)<=255
&& parseInt(l_aValueHost[3], 10)>=0
&& parseInt(l_aValueHost[3], 10)<=255
)
return 0
else
return "Please input correct Host";
}
},
{
Type: "textfield",
Name: "Port",
DefaultValue: "6000",
Validation: function(in_sValue) {
if(parseInt(in_sValue, 10)>=0)
return 0
else
return "Please input correct Port";
}
}
]
}
],

// General information for the module (driver and generated by script)
Module: [{
Name: "Channels Count",
Validation: function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input Count";
}
},
{
Type: "textfield",
Name : "SubnetID",
Validation : function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input SubnetID";
}
},
{
Type: "textfield",
Name : "DeviceID",
Validation : function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input DeviceID";
}
}

]
}
</syntaxhighlight>
To get data from Setup fields use the following function
<syntaxhighlight lang="javascript">
module.GetProperty("Field name")
</syntaxhighlight>
<br />
Besides standard parameters, any parameters required for module inizialization can be asked. Driver parameters are set in the driver automatically. The other parameters are to be asked and used manually.<br />
An example of work with Setup parameters
<syntaxhighlight lang="javascript">
var COUNT_CHANNEL = parseInt(module.GetProperty("Channel count")); // Getting count channel
var SubNetID = parseInt(module.GetProperty("SubnetID")); // Getting subnet id
var DeviceID = parseInt(module.GetProperty("DeviceID")); // Getting device id
</syntaxhighlight>
===Installing a module manually===
To install a module manually no additional script development is required. A user must go to iRidium store from the app, find a module, download it and enter date in the fields indicated in the Setup file. After it the app installs the module in the system with parameters entered by a user.
===Installing a module with the help of a scanner===
'''Scanner (сканер)''' - это модуль, который анализирует какую-либо шину на подключённые устройства либо ищет устройства в локальной сети. Найденные устройства формируются в список, для выбранного устройства качается модуль и становится доступен в i3 lite. <br/>
Схема работы сканера:
# Сканер загружается из магазина;
# Пользователь вводит параметры сканера (IP, Port и т.д) и эти параметры передаются в скрипт сканера;
# Сканер, обработав введенные параметры, опрашивает шину на устройства или ищет устройства в локальной сети;
# Из полученных устройств формируется список;
# При выборе определенного устройства в списке, сканер передаёт параметры выбранного устройства в модуль.
<br/>
При разработке сканера нужно учесть:
* Параметры сканера, при добавлении из магазина;
* Логику сканера;
* Передачу параметров выбранного устройства в модуль;
* Логику модуля, с учётом переданных от сканера параметров.
<br/>
Процесс разработки сканера ничем не отличается от разработки модуля. Точно также сканеру необходимо нарисовать визуальную часть, создать драйвер и написать скрипт с логикой. Основным отличием является то, что сканер может работать только на панели управления и сканер никогда не будет запущен на сервере, поэтому, при разработке скриптов, нет необходимости разделять скрипты на драйверные и интерфейсные.
<br/>
Также при разработке сканера появляется новая логика работы. Первым делом необходимо сделать модуль для управления устройством, далее надо загрузить модуль в магазин модулей. При загрузке модуля, вы увидите уникальный идентификатор вашего модуля. Когда вы будете разрабатывать сканер, вам необходимо написать скрипт со следующей логикой:
# Создание драйвера
# Поиск оборудования
# Если оборудование найдено, надо определить что это за оборудование
# При помощи команды ModuleSetupFinish (ID модуля, js объект с настройками setup данного модуля)
После этого приложение скачет модуль из магазина модулей и установит его.<br/>
The distinctive feature of developing a scanner is the event that lauches the driver work. When developing a scanner use the following event
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_OPEN_SCANNER, 0, function (){});
</syntaxhighlight>
A scanner must be developed after modules are developed. The developed modules are registered in the store of modules and are given a unique ID. After a scanner finds devices in the local net, the script must download a module for the found equipment by the indicated ID. To download a module use the following function
<syntaxhighlight lang="javascript">
IR.ModuleSetupFinish(StoreID, ModuleData, [Callback])
</syntaxhighlight>
where
* StoreID - module ID in the store of modules
* ModuleData - data required for installing a module (fields in Setup)
* Callback - a function to process errors that happened in the installation process (optional)
An example of a developed scanner for HDL modules. To install any module the following parameters are required: Type,SubNet id, Device id, module name, bus IP address, port.
<syntaxhighlight lang="javascript">
//Example of installing HDL Dimmer with a scanner
var l_nStoreID = 82;
var l_oModuleData = {
Module: {
//Data required for module work
Type: "Dimmer",
SubnetID: 3,
DeviceID: 6
Name: "HDL Dimmer"
}
Drivers: {
//Data for the driver
"HDL-BUS Pro Network (UDP)": {
Host: "255.255.255.255", //installing a host for the driver
Port: "6000" //installing a port for the driver
},
}
}

IR.ModuleSetupFinish(l_nStoreID, l_oModuleData, function(in_error){
if (!in_error){
...
} else {
...
}
});
</syntaxhighlight>
===Adding subdevices manually===
After adding the subdevices via the scanner or Setup, the user may have a need to add other subdevices. To ensure this, module developer has to assign the system variable
<syntaxhighlight lang="javascript">
SettingsPopupName = module.GetPopup('AddSubDevicePopup');
</syntaxhighlight >
You have to assign a window with the results of the scanner operation or a popup in which the user can configure a new subdevice or add this subdevice. This popup should be developed by the developer himself.<br/>
If the popup is assigned to the specified system variable, the user will see a "+" button in the module settings section. This button opens the specified popup
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:AddSubdeviceBtn.png]]</div></div>
</div>
Example of specifying the adding subdevices window. When developing, you need to create an adding window in the tablet resolution and a separate window in the smartphone resolution
<syntaxhighlight lang="javascript">
module.SettingsPopupName = IR.DisplayType != IR.DISPLAY_TYPE_TABLET? module.GetPopup("phone:NoAuthorize").Name: module.GetPopup("NoAuthorize").Name;
</syntaxhighlight >
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:AddSubdeviceWindow.png]]</div></div>
</div>
===Authorization===
To work with certain devices a user's authorization in a third-party system is required. i 3lite app has a special authorization mechanism for this purpose.<br/>
To authorize a user has to enter his access data in a special window. This window is unique for every device and a module developer must create it. A window to enter data is a popup with fields to enter data. The popup is created with the help of standard means of the studio and it may be unassigned to any subdevices. When access data are entered, the script must authorize in a third-party system and close the authorization window. After creating an authorization popup, a developer must call the authorization system variable in the script and assign the created popup in the variable.
<syntaxhighlight lang="javascript">
AuthorizationPopupName = module.GetPopup("AutorisationPopup");
</syntaxhighlight ><br/>
After an authorization popup is assigned to a variable, "Authorize" button appears in the module settings.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:NeedAuthorization1.png]]</div></div>
</div>
When this button is pressed, the app opens the authorization popup, assigned in the script. The next task for a module developer is to display a user's status (Authorized or not). There is a system variable to solve this task.
<syntaxhighlight lang="javascript">
AuthorizationStatus = true;
</syntaxhighlight ><br/>
If a user is authorized in the system, true value is assigned to the variable and the app changes the status of the authorization button into:
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Logout1.png]]</div></div>
</div>
A module devloper must also think about the mechanism of deauthorization. It is done on the authorization popup.<br/>
An example of the authorization script
<syntaxhighlight lang="javascript">
if (module.AuthorizationStatus == false) { //If a user is not authorized
module.AuthorizationPopupName = WindowSettings.Window.Name;//Assigning the authorization popup created earlier
} else if (module.AuthorizationStatus) //If a user is authorized
{
module.AuthorizationPopupName = IR.DisplayType != IR.DISPLAY_TYPE_TABLET? module.GetPopup("phone:deAuth").Name: module.GetPopup("deAuth").Name;//Showing the deauthorization popup
}
</syntaxhighlight ><br/>
Note. Remember to create a separate authorization/deauthorization popup for a smart phone and for a tablet.
===Changing settigns===
While working with the application, there may be a need to change the settings of the module. To provide such an opportunity, the module developer must create a function to change the module settings and assign it to the system method
<syntaxhighlight lang="javascript">
module.ChangeProperties = function (in_oSetup)
{
Processing of new module parameters
}
</syntaxhighlight>
When declaring this function, the application will add an edit settings button in the module.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ChangeBtn.png]]</div></div>
</div>
When the user clicks on this button, the application opens the Setup window that was used to install the module. In this window, the user enters new settings and presses the "ready" button. After that, the application runs the above function. The driver settings can be changed by the application itself, other module settings developer must change manually. New settings are written to the input parameter in_oSetup as a JSON line.<br/>
Также в данной функции необходимо обработать успешность изменения настроек. За это отвечает флаг
<syntaxhighlight lang="javascript">
module.FinishUpdateSettings = true;
</syntaxhighlight>
Если установка новых параметров прошла успешно, то надо выставить значение флага true, а обратном случае флаг должен принять значение false. Это позволяет приложению понять что смена параметров не удалась(если статус переменной будет false) и приложение отменит изменение настроек драйвера, вернув старые настройки<br/>
Пример обработки новых настроек модуля
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_MODULE_START, 0, function(){
module.ChangeProperties = function (in_oSetup, in_oModule) {
if (typeof (in_oSetup) == "string")
in_oSetup = JSON.Parse(in_oSetup);
var l_nChannel = in_oSetup.Module["Channel count"];
if (l_nChannel >= COUNT_CHANNEL) {
module.FinishUpdateSettings = true;
// Recreating element on cycle
for (var count = 1; count <= in_nChannel; count++) {

// Creating subDevice
l_oSubDevice = module.AddSubDevice("Relay " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_RELAY);

// Create revers
if (!l_oSubDevice.GetProperty("Reverse"))
l_oSubDevice.SetProperty("Reverse", 0);

// Assigned to the variable name of the channel
var l_sChannelName = "Relay:channel" + count;

// Adding channels
l_oSubDevice.AddChannel(l_sChannelName, Data);
l_oSubDevice.AddTag(l_sChannelName, Data);

// Adding smart virtual tag
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_TAG_POWER, true);
};
}
else {
for (var count = 1; count <= COUNT_CHANNEL; count++)
if (l_nChannel < count) {
var l_oDeleteSubDevice = module.GetSubDevice("Relay " + count);
module.DeleteSubDevice (l_oDeleteSubDevice.ID);
};
};
};
});
</syntaxhighlight>

Translations:DevManual/207/en

2017-04-17T05:17:24Z

When the user clicks on this button, the application opens the Setup window that was used to install the module. In this window, the user enters new settings and presses the "ready" button. After that, the application runs the above function. The driver settings can be changed by the application itself, other module settings developer must change manually. New settings are written to the input parameter in_oSetup as a JSON line.

Translations:DevManual/206/en

2017-04-17T05:07:00Z

Ildar: Новая страница: «When declaring this function, the application will add an edit settings button in the module.»

When declaring this function, the application will add an edit settings button in the module.

DevManual/en

2017-04-17T05:07:00Z

Ildar: Новая страница: «When declaring this function, the application will add an edit settings button in the module.»

<languages/>
=Module development guide=
==Definitions==

'''Module''' - is a component that allows you to control one type of equipment by its unique ID. The module is located in the store of modules.

'''Control panel (mobile device)''' - is a device from which the project i3 lite is launched (tablet, smartphone).

'''Store of modules''' - is a cloud server for uploading ready-made modules. The module store is available from the i3 lite application or on our[http://www.iridiummobile.ru/store/ site]

'''iRidium Studio''' - is a editor that allows to create the module to control device for i3 lite application. You need to use a special editor build for [http://www.iridiummobile.net/redirects/?go=iRidium_SETUP_LITE module developers] to develop the module

'''i3 lite''' - is an application to create, set and use i3 lite projects.

'''i3 lite project''' – is an automation project made up of ready equipment control modules. i3 lite projects differ from i2 Control projects: i3 lite projects can be edited dynamically without prior editing in iRidium Studio. i3 lite project consists of several small parts that can be put together into a single whole in i3 lite app with the help of the built-in constructor. It can also be easily edited in the app. As a result, a big number of intermediate processes are no longer necessary, such as installing software on PC, uploading projects on contol panels. All is done in one place - a control panel.

'''SubDevice''' - This is a virtual representation of the working area of the physical device. If we take as an example a 6-channel dimmer it has 6 sub-devices, because each independent device requires a separate control interface and connects to one channel.

'''Room (in i3 lite)''' - The visual part of i3 lite containing hardware management widgets. The project in i3 lite consists of rooms located on the floors

'''Widget''' - is a visual module component located in the room. It has limitations in size and fixed position in the room interface. It contains the main module functionality. For additional functions Remote is used.

'''Remote''' - is a visual module component which is hidden by default. It opens only when clicking on the corresponding item of the widget. It does not have size limitations (not more than the panel display size) and can be located in any part of the room interface (it is usually located in the middle of the panel display). It contains additional functionality of the module.

'''Macros''' - is a sequence of commands of various modules, which is activated by pressing. Contains "Action" and "Condition". For example, the macros "turn off all the lights in the house" will send the shutdown command to all devices responsible for lighting.

'''Routine''' - is a sequence of commands of various modules, which is activated automatically when a certain event occurs. Contains "Event", "Action" and "Condition". For example, "turn on the light if the motion sensor is triggered"

'''Event''' - is a routine component that describes the control command and the value range. If the value is sent in the indicated range, the routine is executed. For example, the event "Motion appeared" is activated if the motion sensor is triggered.

'''Action''' - is a component of macros and routines. It describes the control command and value that must be sent to the command. For example, "turn on the light". There are 2 types of Action: Simple Action and Advanced Action.

'''Simple Action''' - Simple Action is used when the command and Action value are known in advance.

'''Advanced Action''' - Advanced Action is used when the command is known but the value is unknown. The value is set dynamically when Action is used in i3 lite (but not when creating in iRidium studio).

'''Condition''' - is a component of macros and scenes. It describes the control command and value range. When a value from the value range is sent Action is executed.

'''Scanner''' - is a software part, that analyzes any bus looking for connected devices. Found connected devices are displayed in a list. Modules for the found devices are downloaded from iRidium store and the devices become available to control in i3 lite.
==Module concept==
The module is an independent subroutine of the i3 lite application which is built in the project and has an independent interface, driver and logic. Modules are developed in the [http://www.iridiummobile.net/redirects/?go=iRidium_SETUP_LITE iRidium Studio] editor and located in the module store [http://www.iridiummobile.ru/store/ iRidium Store]. Integrator downloads the module from the module store for each individual project.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ModuleInScheme.png]]</div></div>
</div>

There are two types of modules:
*Control module - module for hardware control
*Scanner - module for searching hardware in the local network and loading modules for found devices
== How to start developing the module ==
----

{{i}} Before starting your work, it is recommended to read [http://dev.iridiummobile.net/How_to_begin iRidium documentation]. It describes the basics of working with iRidium. The i3 lite documentation describes how to develop modules for the i3 lite platform for users, who already know iRidium. If you want to write script use [[Special:MyLanguage/Developers_API | i3 lite API]].
----

The module life cycle consists of:
* Developing the graphic part in iRidium studio
* Developing the driver part (scripts, devices)
* Testing
* Publishing in iRidium store
* Using (module download via the i3 lite application from the cloud and adding to automation projects)
<br/>
==Module structure ==
Each module must consist of subdevices. The subdevice is a virtual representation of the working area of a physical device. Many devices support multiple workgroups with the same functionality. Each workgroup may be in a separate zone. To fully control the zone, you need to create a subdevice for each workgroup of the device. For example, a 6-channel HDL dimmer contains 6 dimmable channels, through which 6 working groups can be controlled. Therefore, it is advisable to select in the module 6 subdevices for the possibility of creating actions, events and conditions for each workgroup separately. The presence of subdevice in the i3 lite module is obligatory. The number of sub-devices can be from one to many. Usually the number of subdevice is equal to the number of channels of the controller, the number of its work areas or logical devices.

Subdevice consists of:
* Conditions
* Actions
* Events
* Widgets

Conditions, actions and events are logical elements of the subdevice, on their basis macros and routines are created. Widget is a graphical element, through which the user will control subdevice. Usually one subdevice contains one widget, but the number of conditions, actions and events varies (from zero to many). The number of subdevices in the module can be either fixed or not. For example, you can develop a module only for a 6-channel dimmer, and you can make a module that will request the hardware for the number of subdevices and create the required number of subdevices.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ModuleStruct.png]]</div></div>
</div>
==Creating the module interface ==
The interface part of the midule consists of:
* widgets - interface part of the subdevice, which is located in the rooms and has basic control functions
* Remote - interface part of the module, which has a set of device functions and opens to the full screen, when you click on the widget button
* Authorization window - Authorization is required to work with some devices. To do this, the developer can create a special authorization window that is available in the module settings
* The module settings window is a window where you need to enter the parameters for the module operation
картинка окна настроек модуля и кнопки открытия
The whole graphic part is drawn in the graphical interface of the iRidium studio editor. In contradistinction to i3 pro, the module's interface should be made up of ready-made graphic components located in the gallery.

==== Widget ====

Widget is a visual component of the module, a kind of Popup that will be displayed in the room. The main task of the widget is to display the basic controls of the subdevice and to provide a module transition to the Remote control of the subdevice. For example, to control a media player, you can place a volume slider or Mute button for quick access to adjusting the volume. The weather widget can display the current weather, and the control panel will contain the weather forecast for all 5 days.<br />
The module does not make sense without widget, because it will not have a graphical representation in the i3 lite project.

Widget has a limited size
# Width '''640'''
# Height can not exceed '''1200'''

[[Файл:Пример виджета.png|center|thumb|Рис. Widget example]]

To create a widget, click the Add pop-up button in the Project overview panel and in the appeared menu select popup type: "Widget", set the name and properties:
[[Файл:ПанельПопап.png|thumb|center]]

Properties of a created widget can be changed with the help of '''Object Properties'''.<br />
Graphic items are assigned to channels like in popups:
[[Файл:Связывание_канала_команды_и_графического_элемента.png|center|thumb|Рис. Связывание канала команды и графического элемента]]
Widget will be displayed:
* In the room when a client uses the project
[[Файл:В_комнате_при_использовании_пользователем_проекта.png|center|thumb|]]
* In the module settings when it is added to the project:
[[Файл:И_в_настройках_модуля_при_добавлении_его_в_проект.png ‎|center|thumb|]]
====Remote and other graphic windows====

Remote (a remote control) is a graphical area to control SubDevices. Unlike wigets, it can have free size and position. And it is displayed on call. Remote is displayed when a button to go to the remote control is pressed on a widget.
Items to control equipment are placed on Remote (buttons, lists, switches, levels). There can be from 0 to several remote controls. Example of Remote:<br />
[[Файл:Пульт_управления.png ‎|center|thumb|]]<br />

Remote is created like a Widget. The only difference is to select "Remote" when you click "Add Popup Page" in the "Device Type" property.
==Interface design standard==
For the convenience of interface design, a standard was developed in which graphic windows should be developed in the module so that the modules of different developers looked uniformly within the framework of one project.
===Basic principles===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:GeneralUI.png]]</div></div>
<div class="col-sm-12 col-md-6">
Виджет состоит из «Header» и дополнительных модулей основного функционала. <br/>
«Header» — верхний модуль виджета.<br/>
«Header» содержит:<br/>
- наименование виджета;
- наименование устройства, которым<br/>
управляет виджет;<br/>
- иконка категории устройства.<br/>
<br/>
Дополнительные модули содержат элементы управления устройством.
</div>
</div>
===Module grid and blocks===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka1.png]]</div></div>
<div class="col-sm-12 col-md-6">
Module grid widget is a block 640 pt wide
And 120 pt in height. Each block has a grid of 8x8 pt.
The rounding of the corners is 12.5 ut. (Circle 25)
</div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka2.png]]</div></div>
<div class="col-sm-12 col-md-6">
The principle of constructing a widget block is a constructor from
Controls (buttons, switches, labels) from smaller to larger.
</div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka3.png]]</div></div>
<div class="col-sm-12 col-md-6">
Control items are combined and united in a block, blocks are united into a control panel.
</div>
</div>
===Buttons===
<big>'''Toggle'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Toggle.png]]</div></div>
<div class="col-sm-12 col-md-6">
Кнопка изменения значения «вкл/выкл». Применяется для отправки команды на устройство, вне зависимости от его текущего состояния.
</div>
</div>
<big>'''Switch'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Switch.png]]</div></div>
<div class="col-sm-12 col-md-6">
«On/off» switch. It is used only when the currect device status is known.
</div>
</div>
<big>'''Multistate'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Multistate.png]]</div></div>
<div class="col-sm-12 col-md-6">
Multistate button is used only when the current device status is known.
</div>
</div>
===Arrow-button===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:arrow1.png]]</div></div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:arrow2.png]]</div></div>
</div>
'''Действие кнопки'''<br/>
При нажатии на кнопку происходит вызов «PopUp».<br/>
'''Содержимое «PopUp»'''<br/>
«Input field», «Single selection», «Multiple selection».
===Sliders===
<div class="row">
<div class="col-sm-12 col-md-6">
Standart
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:StandartSlider.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
Value
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ValueSlider.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
Progress
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ProgressSlider.png]]</div></div>
</div>
===Description===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Description.png]]</div></div>
===Icons===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Icons1.png]]</div></div>
All icons are devided by their spheres of use, their main differene is the size.
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Icons2.png]]</div></div>
===«Header» widget===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:WidgetHeader.png]]</div></div>
===Icon location===
<div class="row">
<div class="col-sm-12 col-md-6">
The standard is 128х120 pt
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:FormFactor.png]]</div></div>
</div>
All buttons have two states - active and inactive
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:OFFicon.png]]</div></div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ONicon.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
When the button in inactive the color is always # 848484 or RGB 132
</div>
<div class="col-sm-12 col-md-6">
The state of a button is considered active, when the action received feedback and is short or instant (e.g. «Play» in a media player) or an acrion that is active for a long time and demands another activity to switch off the active state (e.g. «Repeat» in a media player).
</div>
</div>
==Basics of working with scripts==

To design an interface and to add a driver, you are to develop the logics of module work via script. The script part of developing i3 lite modules has a number of special features. Before developing the script part of i3 lite modules, please, read [http://dev.iridiummobile.net/JS_Guide iRidium Pro API] and [[Special:MyLanguage/Developers_API | i3 lite API]]. <br />

A module can contain any number of scripts. There are several types of scripts for modules:
* Driver - script files of this type contain script, responsible for working with a driver
* GUI - script files of this type contain script, responsible for working with graphics
* Common - script files of this type must contain general scripts, such as a set of additional functions or a description of classes of secondary importance
* Setup - a special script file that contains information about module setting, a list of fields that are obligatory to fill in, types of these fields and functions that check the correctness of entered data.

Devision into types is necessary for the module correct work on the server. Only logics and the driver part work on the server, but the server knows nothing about the graphic part. That's why a module developer has to devide scripts into types. The server does not notice files for working with the graphic part. <br />

When modules are developed module names have to be used instead of IR. Thus, a listener looks this way module.AddListener… <br />

Каждый скриптовой файл должен начинаться со слушателя
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_MODULE_START, 0, function(){});
</syntaxhighlight>
Это новый вид события, предназначенный специально для разработки модуля. При разработке модуля следует учитывать что скриптовой файл стал закрыт для других скриптовых файлов. Это хзначить что теперь можно использовать одноименные переменные и названия функций в разных скриптовых файлах и они не будут перезаписываться, но это накладывает ограничение: нельзя получить доступ к функции из другого скриптового файла простым способом. Для получения доступа к функции из другого скриптового файла, следует импортировать скриптовый файл с помощью команды module.Import("FileName.js"). <br />
Example:<br/>
<syntaxhighlight lang="javascript">
//Name_1.js - first js file
this.Text = "Hello, world!"; //Pointer to a text variable
//Name_2.js - second js file
var Text = module.Import("Name_1.js").Text; //Importing an object with a pointer to a text variable from the first js file
IR.Log(Text); //"Hello, world!" //log the text variable
</syntaxhighlight>
==Creating a subdevice==
The basis of every module is subdevices. The task of every module developer is to define how many subdevices a module has and to develop the logics of subdevice work. Each subdevice may contain a widget, a remote control, a set of actions, events and states. All contents of a subdevice have to be indicated when a subdevice is created. Subdevice contents can't be changed during module work. The following command is used to create a subdevice:<br/>
<syntaxhighlight lang="javascript">
module.AddSubDevice(SystemName, [Device], [System], [Type], [Tags], [Name], [Callback]);
</syntaxhighlight>
where<br/>
'''SystemName''' - subdevice system name<br/>
'''Device''' - a driver to which a subdevice will be assigned<br/>
'''System''' - old parameter, "false" is to be used<br/>
'''Type''' - type of smart device. Parameter is under development<br/>
'''Tags''' - Array of virtual tag objects<br/>
'''Name''' - subdevice name that is displayed to the user<br/>
'''Callback function(){do somethings}''' - a function that is on till the IR.EVENT_ADD_SUBDEVICE event happens.<br/>
As a reply the function returns a link to a subdevice, that can be used to address it.<br/>
An example of creating subdevices for HDL Relay devices. The script checks th number of devices in the bus and creates subdevices.<br/>
<syntaxhighlight lang="javascript">
for (var count = 1; count <= COUNT_CHANNEL; count++) {
// Creating a subdevice
l_oSubDevice = module.AddSubDevice("Relay " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_RELAY);
// Creating StatusOnStart command
if (count == 1)
l_oSubDevice.AddChannel("Relay:statusOnStart", [ChannelData]);
var l_sChannelName = "Relay:channel" + count;
// Adding channels
l_oSubDevice.AddChannel(l_sChannelName, [ChannelData]);
l_oSubDevice.AddTag(l_sChannelName, [ChannelData]);
// Add a virtual tag
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_TAG_POWER, true);
};</syntaxhighlight><br/>
Everything that is required can be added to a subdevice this way. An event is activated when a subdevice is created.<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function, [pointer]);
</syntaxhighlight><br/>
A link to a subdevice that was created is sent to a function. Different components can be added to subdevice in this event, such as, actions, events, states, widgets, chanels, tags. For example,<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function(in_oSubDevice){
Creating actions
in_oSubDevice.AddAction("On", false, in_oSubDevice.SystemName + "_Power", lightID + "_1", IR.SUB_DEVICE_COMMAND_POWER_ON);
in_oSubDevice.AddAction("Off", false, in_oSubDevice.SystemName + "_Power", lightID + "_0", IR.SUB_DEVICE_COMMAND_POWER_OFF);
Creating events
in_oSubDevice.AddEvent("On", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "1");
in_oSubDevice.AddEvent("Off", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "0");
Creating states
in_oSubDevice.AddCondition("On", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "1");
in_oSubDevice.AddCondition("Off", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "0");
});</syntaxhighlight><br/>
Thus, a developer can create the required number of subdevices when a module is installed or when new subdevices are added manually.
==Adding a widget to a subdevice==

After an interface is created in the studio and a function to add subdevices is added, create a copy of a widget for each subdevice and assign it to the subdevice. To assign a widget to a subdevice the following method is used.<br/>
<syntaxhighlight lang="javascript">SubDevice.addWidget(in_Widget)</syntaxhighlight><br/>


The input parameter of the method is '''in_Widget''' - an object, a widget, created in the studio beforehand.<br />
The output parameter of the method is '''True''' or '''False''' (successful or not).<br />
For example, we have 3 lamps. Not to create a separate wiget for each lamp, use a ready template and clone it. Here is an example of creating widgets with the help of a code using the existing template .<br />

Clone method allows to clone an existing popup.<br/>
<syntaxhighlight lang="javascript">Module.ClonePopup (in_Popup, in_Name)</syntaxhighlight><br/>
Входные параметры метода:
*'''in_Name''' - имя нового виджета.<br/>
*'''in_Popup''' - ссылка на всплывающее окно.<br/>
Выходным параметром метода является: успешно или нет ('''True''', '''False''').<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function(in_oSubDevice){
var popup = module.GetPopup("Dimmer"); // Calling a widget that we want to clone
// Creating a widget using cloning method
var widget = in_oSubDevice.addWidget(module.ClonePopup(popup, "Dimmer"+ in_oSubDevice.Name));
});</syntaxhighlight><br/>
----
{{i}} Names of new widgets must not be repeated
----
When a complete remote control is opened it is necessary to remmeber that a user will use the module both on a tablet and on a smart phone. The difference betwen the screen sizes makes a developer design 2 types of windows: a version for smart phones and a version for tablets. In addition a method must be added to the script that asks the system about the type of device where a module is launched and open the required window.
<syntaxhighlight lang="javascript">
if (IR.DisplayType == IR.DISPLAY_TYPE_PHONE) { //If a module is opened on a smart phone
var l_oPopupScanner = module.GetPopup("Phone"); //show a popup created for a smart phone
}
else {
var l_oPopupScanner = module.GetPopup("Tablet");//If a module is opened on a tablet, show a popup for a tablet
}
</syntaxhighlight><br/>
==Work with channels and tags==
After creating a subdevice and adding a widget you must add to the subevice channels and tags required for its work. Like in i3 pro version, a driver can be added in the studio or via script. Each subdevice requires a personal set of channels and tags for the selected driver. You may work with the following three components:<br/>
*Channel. The following method is used to create a channel<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddChannel(Name, DataArray)
</syntaxhighlight>where<br/>
'''Name''' - channel name<br/>
'''DataArray''' - data array (specific for every driver)<br/>
*Tag The following method is used to create a tag<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddTag(Name, DataArray)
</syntaxhighlight>where<br/>
'''Name''' - tag name<br/>
'''DataArray''' - data array, specific for every driver<br/>
*Virtual tag. The following method if used to create a virtual tag<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddVirtualTag(Name, Value, [Edit], [smartID], [Hidden])
</syntaxhighlight>where<br/>
'''Name'''- name of a subdevice virtual tag<br/>
'''Value''' - Tag value<br/>
'''Edit''' - Permission to edit a tag<br/>
'''smartID''' - Parameter is under development! Set "false"<br/>
'''Hidden''' - Feature of a hidden tag<br/>
===An example of creating channels and tags when creating a subdevice===
<syntaxhighlight lang="javascript">
l_oSubDevice = module.AddSubDevice("Light " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_DIMMER);

// Adding channel StatusOnStart
if (count == 1)
l_oSubDevice.AddChannel("Dimmer:statusOnStart", [ChannelData]);

// Assigned to the variable name of the channel
var l_sChannelName = "Dimmer:channel" + count;

// Adding channels
l_oSubDevice.AddChannel(l_sChannelName, [ChannelData]);
l_oSubDevice.AddTag(l_sChannelName, [TagData]);

// Adding smart virtual tag
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_COMMAND_POWER, true);
l_oSubDevice.AddVirtualTag("Power On", 0, false, IR.SUB_DEVICE_COMMAND_POWER_ON, true);
l_oSubDevice.AddVirtualTag("Power Off", 0, false, IR.SUB_DEVICE_COMMAND_POWER_OFF, true);
l_oSubDevice.AddVirtualTag("Level", 0, false, IR.SUB_DEVICE_COMMAND_LEVEL, true);
</syntaxhighlight>
==Setting a module in the app==
Modules are stored in iRidium store and can be installed in the app using one of the following ways:<br/>
*With the help of a scanner<br/>
*Manually<br/>
===Developing the Setup file===
The Setup file must be developed for each variant. It's a special script file with fields that are required for module work. These fields can be device IP address, port, city name, etc. To develop a Setup file, create a new script file and select its type - "Setup". Eacn field is a tag and can be accessed from the script, and the input value can be received.
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:СетапБонго.png]]</div></div>
The Setup file consists of 2 parts. Part 1 is the driver settings. The settings must require IP addresses, ports and logins to connect the driver to a device. Part 2 is the module general settings, such as number of outputs, access keys.
To set fields in the Setip file set the following fields in the script:
* Field type - indicate what field must be shown to a user (text field, data array, etc. Detailed description is given in API)
* Field name - name of field that a user sees when setting a module
* Default value - what value must be put by default
* Check function - a function to validate value in the field. A function must be written that checks the correctness of the entered data.
For example,"Setup" script for HDL module looks this way:
<syntaxhighlight lang="javascript">
{
// Data to connect drivers, created in Project Device Panel
Drivers:
[
{
Name: "HDL-BUS Pro Network (UDP)",
Properties:
[
{
Type: "textfield",
Name: "Host",
DefaultValue: "255.255.255.255",
Validation: function(in_sValue) {
var l_aValueHost = in_sValue.split(".");
if (l_aValueHost.length != 4) {
return "Please input correct Host";
} else
if (parseInt(l_aValueHost[0], 10)>=0
&& parseInt(l_aValueHost[0], 10)<=255
&& parseInt(l_aValueHost[1], 10)>=0
&& parseInt(l_aValueHost[1], 10)<=255
&& parseInt(l_aValueHost[2], 10)>=0
&& parseInt(l_aValueHost[2], 10)<=255
&& parseInt(l_aValueHost[3], 10)>=0
&& parseInt(l_aValueHost[3], 10)<=255
)
return 0
else
return "Please input correct Host";
}
},
{
Type: "textfield",
Name: "Port",
DefaultValue: "6000",
Validation: function(in_sValue) {
if(parseInt(in_sValue, 10)>=0)
return 0
else
return "Please input correct Port";
}
}
]
}
],

// General information for the module (driver and generated by script)
Module: [{
Name: "Channels Count",
Validation: function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input Count";
}
},
{
Type: "textfield",
Name : "SubnetID",
Validation : function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input SubnetID";
}
},
{
Type: "textfield",
Name : "DeviceID",
Validation : function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input DeviceID";
}
}

]
}
</syntaxhighlight>
To get data from Setup fields use the following function
<syntaxhighlight lang="javascript">
module.GetProperty("Field name")
</syntaxhighlight>
<br />
Besides standard parameters, any parameters required for module inizialization can be asked. Driver parameters are set in the driver automatically. The other parameters are to be asked and used manually.<br />
An example of work with Setup parameters
<syntaxhighlight lang="javascript">
var COUNT_CHANNEL = parseInt(module.GetProperty("Channel count")); // Getting count channel
var SubNetID = parseInt(module.GetProperty("SubnetID")); // Getting subnet id
var DeviceID = parseInt(module.GetProperty("DeviceID")); // Getting device id
</syntaxhighlight>
===Installing a module manually===
To install a module manually no additional script development is required. A user must go to iRidium store from the app, find a module, download it and enter date in the fields indicated in the Setup file. After it the app installs the module in the system with parameters entered by a user.
===Installing a module with the help of a scanner===
'''Scanner (сканер)''' - это модуль, который анализирует какую-либо шину на подключённые устройства либо ищет устройства в локальной сети. Найденные устройства формируются в список, для выбранного устройства качается модуль и становится доступен в i3 lite. <br/>
Схема работы сканера:
# Сканер загружается из магазина;
# Пользователь вводит параметры сканера (IP, Port и т.д) и эти параметры передаются в скрипт сканера;
# Сканер, обработав введенные параметры, опрашивает шину на устройства или ищет устройства в локальной сети;
# Из полученных устройств формируется список;
# При выборе определенного устройства в списке, сканер передаёт параметры выбранного устройства в модуль.
<br/>
При разработке сканера нужно учесть:
* Параметры сканера, при добавлении из магазина;
* Логику сканера;
* Передачу параметров выбранного устройства в модуль;
* Логику модуля, с учётом переданных от сканера параметров.
<br/>
Процесс разработки сканера ничем не отличается от разработки модуля. Точно также сканеру необходимо нарисовать визуальную часть, создать драйвер и написать скрипт с логикой. Основным отличием является то, что сканер может работать только на панели управления и сканер никогда не будет запущен на сервере, поэтому, при разработке скриптов, нет необходимости разделять скрипты на драйверные и интерфейсные.
<br/>
Также при разработке сканера появляется новая логика работы. Первым делом необходимо сделать модуль для управления устройством, далее надо загрузить модуль в магазин модулей. При загрузке модуля, вы увидите уникальный идентификатор вашего модуля. Когда вы будете разрабатывать сканер, вам необходимо написать скрипт со следующей логикой:
# Создание драйвера
# Поиск оборудования
# Если оборудование найдено, надо определить что это за оборудование
# При помощи команды ModuleSetupFinish (ID модуля, js объект с настройками setup данного модуля)
После этого приложение скачет модуль из магазина модулей и установит его.<br/>
The distinctive feature of developing a scanner is the event that lauches the driver work. When developing a scanner use the following event
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_OPEN_SCANNER, 0, function (){});
</syntaxhighlight>
A scanner must be developed after modules are developed. The developed modules are registered in the store of modules and are given a unique ID. After a scanner finds devices in the local net, the script must download a module for the found equipment by the indicated ID. To download a module use the following function
<syntaxhighlight lang="javascript">
IR.ModuleSetupFinish(StoreID, ModuleData, [Callback])
</syntaxhighlight>
where
* StoreID - module ID in the store of modules
* ModuleData - data required for installing a module (fields in Setup)
* Callback - a function to process errors that happened in the installation process (optional)
An example of a developed scanner for HDL modules. To install any module the following parameters are required: Type,SubNet id, Device id, module name, bus IP address, port.
<syntaxhighlight lang="javascript">
//Example of installing HDL Dimmer with a scanner
var l_nStoreID = 82;
var l_oModuleData = {
Module: {
//Data required for module work
Type: "Dimmer",
SubnetID: 3,
DeviceID: 6
Name: "HDL Dimmer"
}
Drivers: {
//Data for the driver
"HDL-BUS Pro Network (UDP)": {
Host: "255.255.255.255", //installing a host for the driver
Port: "6000" //installing a port for the driver
},
}
}

IR.ModuleSetupFinish(l_nStoreID, l_oModuleData, function(in_error){
if (!in_error){
...
} else {
...
}
});
</syntaxhighlight>
===Adding subdevices manually===
After adding the subdevices via the scanner or Setup, the user may have a need to add other subdevices. To ensure this, module developer has to assign the system variable
<syntaxhighlight lang="javascript">
SettingsPopupName = module.GetPopup('AddSubDevicePopup');
</syntaxhighlight >
You have to assign a window with the results of the scanner operation or a popup in which the user can configure a new subdevice or add this subdevice. This popup should be developed by the developer himself.<br/>
If the popup is assigned to the specified system variable, the user will see a "+" button in the module settings section. This button opens the specified popup
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:AddSubdeviceBtn.png]]</div></div>
</div>
Example of specifying the adding subdevices window. When developing, you need to create an adding window in the tablet resolution and a separate window in the smartphone resolution
<syntaxhighlight lang="javascript">
module.SettingsPopupName = IR.DisplayType != IR.DISPLAY_TYPE_TABLET? module.GetPopup("phone:NoAuthorize").Name: module.GetPopup("NoAuthorize").Name;
</syntaxhighlight >
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:AddSubdeviceWindow.png]]</div></div>
</div>
===Authorization===
To work with certain devices a user's authorization in a third-party system is required. i 3lite app has a special authorization mechanism for this purpose.<br/>
To authorize a user has to enter his access data in a special window. This window is unique for every device and a module developer must create it. A window to enter data is a popup with fields to enter data. The popup is created with the help of standard means of the studio and it may be unassigned to any subdevices. When access data are entered, the script must authorize in a third-party system and close the authorization window. After creating an authorization popup, a developer must call the authorization system variable in the script and assign the created popup in the variable.
<syntaxhighlight lang="javascript">
AuthorizationPopupName = module.GetPopup("AutorisationPopup");
</syntaxhighlight ><br/>
After an authorization popup is assigned to a variable, "Authorize" button appears in the module settings.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:NeedAuthorization1.png]]</div></div>
</div>
When this button is pressed, the app opens the authorization popup, assigned in the script. The next task for a module developer is to display a user's status (Authorized or not). There is a system variable to solve this task.
<syntaxhighlight lang="javascript">
AuthorizationStatus = true;
</syntaxhighlight ><br/>
If a user is authorized in the system, true value is assigned to the variable and the app changes the status of the authorization button into:
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Logout1.png]]</div></div>
</div>
A module devloper must also think about the mechanism of deauthorization. It is done on the authorization popup.<br/>
An example of the authorization script
<syntaxhighlight lang="javascript">
if (module.AuthorizationStatus == false) { //If a user is not authorized
module.AuthorizationPopupName = WindowSettings.Window.Name;//Assigning the authorization popup created earlier
} else if (module.AuthorizationStatus) //If a user is authorized
{
module.AuthorizationPopupName = IR.DisplayType != IR.DISPLAY_TYPE_TABLET? module.GetPopup("phone:deAuth").Name: module.GetPopup("deAuth").Name;//Showing the deauthorization popup
}
</syntaxhighlight ><br/>
Note. Remember to create a separate authorization/deauthorization popup for a smart phone and for a tablet.
===Changing settigns===
While working with the application, there may be a need to change the settings of the module. To provide such an opportunity, the module developer must create a function to change the module settings and assign it to the system method
<syntaxhighlight lang="javascript">
module.ChangeProperties = function (in_oSetup)
{
Processing of new module parameters
}
</syntaxhighlight>
When declaring this function, the application will add an edit settings button in the module.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ChangeBtn.png]]</div></div>
</div>
Когда пользователь нажмет на данную кнопку, приложение откроет окно Setup, которое использовалось при установке модуля. В этом окне пользователь введет новые настройки и нажмет кнопку "готово". После этого приложение запустить указанную выше функцию. Настройки драйвера приложение сможет изменить самостоятельно, остальные же настройки разработчик модуля дулжен изменить вручную. Новые настройки записываются во входной параметр in_oSetup в виде JSON строки.<br/>
Также в данной функции необходимо обработать успешность изменения настроек. За это отвечает флаг
<syntaxhighlight lang="javascript">
module.FinishUpdateSettings = true;
</syntaxhighlight>
Если установка новых параметров прошла успешно, то надо выставить значение флага true, а обратном случае флаг должен принять значение false. Это позволяет приложению понять что смена параметров не удалась(если статус переменной будет false) и приложение отменит изменение настроек драйвера, вернув старые настройки<br/>
Пример обработки новых настроек модуля
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_MODULE_START, 0, function(){
module.ChangeProperties = function (in_oSetup, in_oModule) {
if (typeof (in_oSetup) == "string")
in_oSetup = JSON.Parse(in_oSetup);
var l_nChannel = in_oSetup.Module["Channel count"];
if (l_nChannel >= COUNT_CHANNEL) {
module.FinishUpdateSettings = true;
// Recreating element on cycle
for (var count = 1; count <= in_nChannel; count++) {

// Creating subDevice
l_oSubDevice = module.AddSubDevice("Relay " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_RELAY);

// Create revers
if (!l_oSubDevice.GetProperty("Reverse"))
l_oSubDevice.SetProperty("Reverse", 0);

// Assigned to the variable name of the channel
var l_sChannelName = "Relay:channel" + count;

// Adding channels
l_oSubDevice.AddChannel(l_sChannelName, Data);
l_oSubDevice.AddTag(l_sChannelName, Data);

// Adding smart virtual tag
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_TAG_POWER, true);
};
}
else {
for (var count = 1; count <= COUNT_CHANNEL; count++)
if (l_nChannel < count) {
var l_oDeleteSubDevice = module.GetSubDevice("Relay " + count);
module.DeleteSubDevice (l_oDeleteSubDevice.ID);
};
};
};
});
</syntaxhighlight>

DevManual/en

2017-04-17T04:58:20Z

Ildar: Новая страница: «Processing of new module parameters»

<languages/>
=Module development guide=
==Definitions==

'''Module''' - is a component that allows you to control one type of equipment by its unique ID. The module is located in the store of modules.

'''Control panel (mobile device)''' - is a device from which the project i3 lite is launched (tablet, smartphone).

'''Store of modules''' - is a cloud server for uploading ready-made modules. The module store is available from the i3 lite application or on our[http://www.iridiummobile.ru/store/ site]

'''iRidium Studio''' - is a editor that allows to create the module to control device for i3 lite application. You need to use a special editor build for [http://www.iridiummobile.net/redirects/?go=iRidium_SETUP_LITE module developers] to develop the module

'''i3 lite''' - is an application to create, set and use i3 lite projects.

'''i3 lite project''' – is an automation project made up of ready equipment control modules. i3 lite projects differ from i2 Control projects: i3 lite projects can be edited dynamically without prior editing in iRidium Studio. i3 lite project consists of several small parts that can be put together into a single whole in i3 lite app with the help of the built-in constructor. It can also be easily edited in the app. As a result, a big number of intermediate processes are no longer necessary, such as installing software on PC, uploading projects on contol panels. All is done in one place - a control panel.

'''SubDevice''' - This is a virtual representation of the working area of the physical device. If we take as an example a 6-channel dimmer it has 6 sub-devices, because each independent device requires a separate control interface and connects to one channel.

'''Room (in i3 lite)''' - The visual part of i3 lite containing hardware management widgets. The project in i3 lite consists of rooms located on the floors

'''Widget''' - is a visual module component located in the room. It has limitations in size and fixed position in the room interface. It contains the main module functionality. For additional functions Remote is used.

'''Remote''' - is a visual module component which is hidden by default. It opens only when clicking on the corresponding item of the widget. It does not have size limitations (not more than the panel display size) and can be located in any part of the room interface (it is usually located in the middle of the panel display). It contains additional functionality of the module.

'''Macros''' - is a sequence of commands of various modules, which is activated by pressing. Contains "Action" and "Condition". For example, the macros "turn off all the lights in the house" will send the shutdown command to all devices responsible for lighting.

'''Routine''' - is a sequence of commands of various modules, which is activated automatically when a certain event occurs. Contains "Event", "Action" and "Condition". For example, "turn on the light if the motion sensor is triggered"

'''Event''' - is a routine component that describes the control command and the value range. If the value is sent in the indicated range, the routine is executed. For example, the event "Motion appeared" is activated if the motion sensor is triggered.

'''Action''' - is a component of macros and routines. It describes the control command and value that must be sent to the command. For example, "turn on the light". There are 2 types of Action: Simple Action and Advanced Action.

'''Simple Action''' - Simple Action is used when the command and Action value are known in advance.

'''Advanced Action''' - Advanced Action is used when the command is known but the value is unknown. The value is set dynamically when Action is used in i3 lite (but not when creating in iRidium studio).

'''Condition''' - is a component of macros and scenes. It describes the control command and value range. When a value from the value range is sent Action is executed.

'''Scanner''' - is a software part, that analyzes any bus looking for connected devices. Found connected devices are displayed in a list. Modules for the found devices are downloaded from iRidium store and the devices become available to control in i3 lite.
==Module concept==
The module is an independent subroutine of the i3 lite application which is built in the project and has an independent interface, driver and logic. Modules are developed in the [http://www.iridiummobile.net/redirects/?go=iRidium_SETUP_LITE iRidium Studio] editor and located in the module store [http://www.iridiummobile.ru/store/ iRidium Store]. Integrator downloads the module from the module store for each individual project.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ModuleInScheme.png]]</div></div>
</div>

There are two types of modules:
*Control module - module for hardware control
*Scanner - module for searching hardware in the local network and loading modules for found devices
== How to start developing the module ==
----

{{i}} Before starting your work, it is recommended to read [http://dev.iridiummobile.net/How_to_begin iRidium documentation]. It describes the basics of working with iRidium. The i3 lite documentation describes how to develop modules for the i3 lite platform for users, who already know iRidium. If you want to write script use [[Special:MyLanguage/Developers_API | i3 lite API]].
----

The module life cycle consists of:
* Developing the graphic part in iRidium studio
* Developing the driver part (scripts, devices)
* Testing
* Publishing in iRidium store
* Using (module download via the i3 lite application from the cloud and adding to automation projects)
<br/>
==Module structure ==
Each module must consist of subdevices. The subdevice is a virtual representation of the working area of a physical device. Many devices support multiple workgroups with the same functionality. Each workgroup may be in a separate zone. To fully control the zone, you need to create a subdevice for each workgroup of the device. For example, a 6-channel HDL dimmer contains 6 dimmable channels, through which 6 working groups can be controlled. Therefore, it is advisable to select in the module 6 subdevices for the possibility of creating actions, events and conditions for each workgroup separately. The presence of subdevice in the i3 lite module is obligatory. The number of sub-devices can be from one to many. Usually the number of subdevice is equal to the number of channels of the controller, the number of its work areas or logical devices.

Subdevice consists of:
* Conditions
* Actions
* Events
* Widgets

Conditions, actions and events are logical elements of the subdevice, on their basis macros and routines are created. Widget is a graphical element, through which the user will control subdevice. Usually one subdevice contains one widget, but the number of conditions, actions and events varies (from zero to many). The number of subdevices in the module can be either fixed or not. For example, you can develop a module only for a 6-channel dimmer, and you can make a module that will request the hardware for the number of subdevices and create the required number of subdevices.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ModuleStruct.png]]</div></div>
</div>
==Creating the module interface ==
The interface part of the midule consists of:
* widgets - interface part of the subdevice, which is located in the rooms and has basic control functions
* Remote - interface part of the module, which has a set of device functions and opens to the full screen, when you click on the widget button
* Authorization window - Authorization is required to work with some devices. To do this, the developer can create a special authorization window that is available in the module settings
* The module settings window is a window where you need to enter the parameters for the module operation
картинка окна настроек модуля и кнопки открытия
The whole graphic part is drawn in the graphical interface of the iRidium studio editor. In contradistinction to i3 pro, the module's interface should be made up of ready-made graphic components located in the gallery.

==== Widget ====

Widget is a visual component of the module, a kind of Popup that will be displayed in the room. The main task of the widget is to display the basic controls of the subdevice and to provide a module transition to the Remote control of the subdevice. For example, to control a media player, you can place a volume slider or Mute button for quick access to adjusting the volume. The weather widget can display the current weather, and the control panel will contain the weather forecast for all 5 days.<br />
The module does not make sense without widget, because it will not have a graphical representation in the i3 lite project.

Widget has a limited size
# Width '''640'''
# Height can not exceed '''1200'''

[[Файл:Пример виджета.png|center|thumb|Рис. Widget example]]

To create a widget, click the Add pop-up button in the Project overview panel and in the appeared menu select popup type: "Widget", set the name and properties:
[[Файл:ПанельПопап.png|thumb|center]]

Properties of a created widget can be changed with the help of '''Object Properties'''.<br />
Graphic items are assigned to channels like in popups:
[[Файл:Связывание_канала_команды_и_графического_элемента.png|center|thumb|Рис. Связывание канала команды и графического элемента]]
Widget will be displayed:
* In the room when a client uses the project
[[Файл:В_комнате_при_использовании_пользователем_проекта.png|center|thumb|]]
* In the module settings when it is added to the project:
[[Файл:И_в_настройках_модуля_при_добавлении_его_в_проект.png ‎|center|thumb|]]
====Remote and other graphic windows====

Remote (a remote control) is a graphical area to control SubDevices. Unlike wigets, it can have free size and position. And it is displayed on call. Remote is displayed when a button to go to the remote control is pressed on a widget.
Items to control equipment are placed on Remote (buttons, lists, switches, levels). There can be from 0 to several remote controls. Example of Remote:<br />
[[Файл:Пульт_управления.png ‎|center|thumb|]]<br />

Remote is created like a Widget. The only difference is to select "Remote" when you click "Add Popup Page" in the "Device Type" property.
==Interface design standard==
For the convenience of interface design, a standard was developed in which graphic windows should be developed in the module so that the modules of different developers looked uniformly within the framework of one project.
===Basic principles===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:GeneralUI.png]]</div></div>
<div class="col-sm-12 col-md-6">
Виджет состоит из «Header» и дополнительных модулей основного функционала. <br/>
«Header» — верхний модуль виджета.<br/>
«Header» содержит:<br/>
- наименование виджета;
- наименование устройства, которым<br/>
управляет виджет;<br/>
- иконка категории устройства.<br/>
<br/>
Дополнительные модули содержат элементы управления устройством.
</div>
</div>
===Module grid and blocks===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka1.png]]</div></div>
<div class="col-sm-12 col-md-6">
Module grid widget is a block 640 pt wide
And 120 pt in height. Each block has a grid of 8x8 pt.
The rounding of the corners is 12.5 ut. (Circle 25)
</div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka2.png]]</div></div>
<div class="col-sm-12 col-md-6">
The principle of constructing a widget block is a constructor from
Controls (buttons, switches, labels) from smaller to larger.
</div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka3.png]]</div></div>
<div class="col-sm-12 col-md-6">
Control items are combined and united in a block, blocks are united into a control panel.
</div>
</div>
===Buttons===
<big>'''Toggle'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Toggle.png]]</div></div>
<div class="col-sm-12 col-md-6">
Кнопка изменения значения «вкл/выкл». Применяется для отправки команды на устройство, вне зависимости от его текущего состояния.
</div>
</div>
<big>'''Switch'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Switch.png]]</div></div>
<div class="col-sm-12 col-md-6">
«On/off» switch. It is used only when the currect device status is known.
</div>
</div>
<big>'''Multistate'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Multistate.png]]</div></div>
<div class="col-sm-12 col-md-6">
Multistate button is used only when the current device status is known.
</div>
</div>
===Arrow-button===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:arrow1.png]]</div></div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:arrow2.png]]</div></div>
</div>
'''Действие кнопки'''<br/>
При нажатии на кнопку происходит вызов «PopUp».<br/>
'''Содержимое «PopUp»'''<br/>
«Input field», «Single selection», «Multiple selection».
===Sliders===
<div class="row">
<div class="col-sm-12 col-md-6">
Standart
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:StandartSlider.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
Value
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ValueSlider.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
Progress
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ProgressSlider.png]]</div></div>
</div>
===Description===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Description.png]]</div></div>
===Icons===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Icons1.png]]</div></div>
All icons are devided by their spheres of use, their main differene is the size.
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Icons2.png]]</div></div>
===«Header» widget===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:WidgetHeader.png]]</div></div>
===Icon location===
<div class="row">
<div class="col-sm-12 col-md-6">
The standard is 128х120 pt
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:FormFactor.png]]</div></div>
</div>
All buttons have two states - active and inactive
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:OFFicon.png]]</div></div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ONicon.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
When the button in inactive the color is always # 848484 or RGB 132
</div>
<div class="col-sm-12 col-md-6">
The state of a button is considered active, when the action received feedback and is short or instant (e.g. «Play» in a media player) or an acrion that is active for a long time and demands another activity to switch off the active state (e.g. «Repeat» in a media player).
</div>
</div>
==Basics of working with scripts==

To design an interface and to add a driver, you are to develop the logics of module work via script. The script part of developing i3 lite modules has a number of special features. Before developing the script part of i3 lite modules, please, read [http://dev.iridiummobile.net/JS_Guide iRidium Pro API] and [[Special:MyLanguage/Developers_API | i3 lite API]]. <br />

A module can contain any number of scripts. There are several types of scripts for modules:
* Driver - script files of this type contain script, responsible for working with a driver
* GUI - script files of this type contain script, responsible for working with graphics
* Common - script files of this type must contain general scripts, such as a set of additional functions or a description of classes of secondary importance
* Setup - a special script file that contains information about module setting, a list of fields that are obligatory to fill in, types of these fields and functions that check the correctness of entered data.

Devision into types is necessary for the module correct work on the server. Only logics and the driver part work on the server, but the server knows nothing about the graphic part. That's why a module developer has to devide scripts into types. The server does not notice files for working with the graphic part. <br />

When modules are developed module names have to be used instead of IR. Thus, a listener looks this way module.AddListener… <br />

Каждый скриптовой файл должен начинаться со слушателя
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_MODULE_START, 0, function(){});
</syntaxhighlight>
Это новый вид события, предназначенный специально для разработки модуля. При разработке модуля следует учитывать что скриптовой файл стал закрыт для других скриптовых файлов. Это хзначить что теперь можно использовать одноименные переменные и названия функций в разных скриптовых файлах и они не будут перезаписываться, но это накладывает ограничение: нельзя получить доступ к функции из другого скриптового файла простым способом. Для получения доступа к функции из другого скриптового файла, следует импортировать скриптовый файл с помощью команды module.Import("FileName.js"). <br />
Example:<br/>
<syntaxhighlight lang="javascript">
//Name_1.js - first js file
this.Text = "Hello, world!"; //Pointer to a text variable
//Name_2.js - second js file
var Text = module.Import("Name_1.js").Text; //Importing an object with a pointer to a text variable from the first js file
IR.Log(Text); //"Hello, world!" //log the text variable
</syntaxhighlight>
==Creating a subdevice==
The basis of every module is subdevices. The task of every module developer is to define how many subdevices a module has and to develop the logics of subdevice work. Each subdevice may contain a widget, a remote control, a set of actions, events and states. All contents of a subdevice have to be indicated when a subdevice is created. Subdevice contents can't be changed during module work. The following command is used to create a subdevice:<br/>
<syntaxhighlight lang="javascript">
module.AddSubDevice(SystemName, [Device], [System], [Type], [Tags], [Name], [Callback]);
</syntaxhighlight>
where<br/>
'''SystemName''' - subdevice system name<br/>
'''Device''' - a driver to which a subdevice will be assigned<br/>
'''System''' - old parameter, "false" is to be used<br/>
'''Type''' - type of smart device. Parameter is under development<br/>
'''Tags''' - Array of virtual tag objects<br/>
'''Name''' - subdevice name that is displayed to the user<br/>
'''Callback function(){do somethings}''' - a function that is on till the IR.EVENT_ADD_SUBDEVICE event happens.<br/>
As a reply the function returns a link to a subdevice, that can be used to address it.<br/>
An example of creating subdevices for HDL Relay devices. The script checks th number of devices in the bus and creates subdevices.<br/>
<syntaxhighlight lang="javascript">
for (var count = 1; count <= COUNT_CHANNEL; count++) {
// Creating a subdevice
l_oSubDevice = module.AddSubDevice("Relay " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_RELAY);
// Creating StatusOnStart command
if (count == 1)
l_oSubDevice.AddChannel("Relay:statusOnStart", [ChannelData]);
var l_sChannelName = "Relay:channel" + count;
// Adding channels
l_oSubDevice.AddChannel(l_sChannelName, [ChannelData]);
l_oSubDevice.AddTag(l_sChannelName, [ChannelData]);
// Add a virtual tag
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_TAG_POWER, true);
};</syntaxhighlight><br/>
Everything that is required can be added to a subdevice this way. An event is activated when a subdevice is created.<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function, [pointer]);
</syntaxhighlight><br/>
A link to a subdevice that was created is sent to a function. Different components can be added to subdevice in this event, such as, actions, events, states, widgets, chanels, tags. For example,<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function(in_oSubDevice){
Creating actions
in_oSubDevice.AddAction("On", false, in_oSubDevice.SystemName + "_Power", lightID + "_1", IR.SUB_DEVICE_COMMAND_POWER_ON);
in_oSubDevice.AddAction("Off", false, in_oSubDevice.SystemName + "_Power", lightID + "_0", IR.SUB_DEVICE_COMMAND_POWER_OFF);
Creating events
in_oSubDevice.AddEvent("On", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "1");
in_oSubDevice.AddEvent("Off", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "0");
Creating states
in_oSubDevice.AddCondition("On", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "1");
in_oSubDevice.AddCondition("Off", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "0");
});</syntaxhighlight><br/>
Thus, a developer can create the required number of subdevices when a module is installed or when new subdevices are added manually.
==Adding a widget to a subdevice==

After an interface is created in the studio and a function to add subdevices is added, create a copy of a widget for each subdevice and assign it to the subdevice. To assign a widget to a subdevice the following method is used.<br/>
<syntaxhighlight lang="javascript">SubDevice.addWidget(in_Widget)</syntaxhighlight><br/>


The input parameter of the method is '''in_Widget''' - an object, a widget, created in the studio beforehand.<br />
The output parameter of the method is '''True''' or '''False''' (successful or not).<br />
For example, we have 3 lamps. Not to create a separate wiget for each lamp, use a ready template and clone it. Here is an example of creating widgets with the help of a code using the existing template .<br />

Clone method allows to clone an existing popup.<br/>
<syntaxhighlight lang="javascript">Module.ClonePopup (in_Popup, in_Name)</syntaxhighlight><br/>
Входные параметры метода:
*'''in_Name''' - имя нового виджета.<br/>
*'''in_Popup''' - ссылка на всплывающее окно.<br/>
Выходным параметром метода является: успешно или нет ('''True''', '''False''').<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function(in_oSubDevice){
var popup = module.GetPopup("Dimmer"); // Calling a widget that we want to clone
// Creating a widget using cloning method
var widget = in_oSubDevice.addWidget(module.ClonePopup(popup, "Dimmer"+ in_oSubDevice.Name));
});</syntaxhighlight><br/>
----
{{i}} Names of new widgets must not be repeated
----
When a complete remote control is opened it is necessary to remmeber that a user will use the module both on a tablet and on a smart phone. The difference betwen the screen sizes makes a developer design 2 types of windows: a version for smart phones and a version for tablets. In addition a method must be added to the script that asks the system about the type of device where a module is launched and open the required window.
<syntaxhighlight lang="javascript">
if (IR.DisplayType == IR.DISPLAY_TYPE_PHONE) { //If a module is opened on a smart phone
var l_oPopupScanner = module.GetPopup("Phone"); //show a popup created for a smart phone
}
else {
var l_oPopupScanner = module.GetPopup("Tablet");//If a module is opened on a tablet, show a popup for a tablet
}
</syntaxhighlight><br/>
==Work with channels and tags==
After creating a subdevice and adding a widget you must add to the subevice channels and tags required for its work. Like in i3 pro version, a driver can be added in the studio or via script. Each subdevice requires a personal set of channels and tags for the selected driver. You may work with the following three components:<br/>
*Channel. The following method is used to create a channel<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddChannel(Name, DataArray)
</syntaxhighlight>where<br/>
'''Name''' - channel name<br/>
'''DataArray''' - data array (specific for every driver)<br/>
*Tag The following method is used to create a tag<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddTag(Name, DataArray)
</syntaxhighlight>where<br/>
'''Name''' - tag name<br/>
'''DataArray''' - data array, specific for every driver<br/>
*Virtual tag. The following method if used to create a virtual tag<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddVirtualTag(Name, Value, [Edit], [smartID], [Hidden])
</syntaxhighlight>where<br/>
'''Name'''- name of a subdevice virtual tag<br/>
'''Value''' - Tag value<br/>
'''Edit''' - Permission to edit a tag<br/>
'''smartID''' - Parameter is under development! Set "false"<br/>
'''Hidden''' - Feature of a hidden tag<br/>
===An example of creating channels and tags when creating a subdevice===
<syntaxhighlight lang="javascript">
l_oSubDevice = module.AddSubDevice("Light " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_DIMMER);

// Adding channel StatusOnStart
if (count == 1)
l_oSubDevice.AddChannel("Dimmer:statusOnStart", [ChannelData]);

// Assigned to the variable name of the channel
var l_sChannelName = "Dimmer:channel" + count;

// Adding channels
l_oSubDevice.AddChannel(l_sChannelName, [ChannelData]);
l_oSubDevice.AddTag(l_sChannelName, [TagData]);

// Adding smart virtual tag
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_COMMAND_POWER, true);
l_oSubDevice.AddVirtualTag("Power On", 0, false, IR.SUB_DEVICE_COMMAND_POWER_ON, true);
l_oSubDevice.AddVirtualTag("Power Off", 0, false, IR.SUB_DEVICE_COMMAND_POWER_OFF, true);
l_oSubDevice.AddVirtualTag("Level", 0, false, IR.SUB_DEVICE_COMMAND_LEVEL, true);
</syntaxhighlight>
==Setting a module in the app==
Modules are stored in iRidium store and can be installed in the app using one of the following ways:<br/>
*With the help of a scanner<br/>
*Manually<br/>
===Developing the Setup file===
The Setup file must be developed for each variant. It's a special script file with fields that are required for module work. These fields can be device IP address, port, city name, etc. To develop a Setup file, create a new script file and select its type - "Setup". Eacn field is a tag and can be accessed from the script, and the input value can be received.
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:СетапБонго.png]]</div></div>
The Setup file consists of 2 parts. Part 1 is the driver settings. The settings must require IP addresses, ports and logins to connect the driver to a device. Part 2 is the module general settings, such as number of outputs, access keys.
To set fields in the Setip file set the following fields in the script:
* Field type - indicate what field must be shown to a user (text field, data array, etc. Detailed description is given in API)
* Field name - name of field that a user sees when setting a module
* Default value - what value must be put by default
* Check function - a function to validate value in the field. A function must be written that checks the correctness of the entered data.
For example,"Setup" script for HDL module looks this way:
<syntaxhighlight lang="javascript">
{
// Data to connect drivers, created in Project Device Panel
Drivers:
[
{
Name: "HDL-BUS Pro Network (UDP)",
Properties:
[
{
Type: "textfield",
Name: "Host",
DefaultValue: "255.255.255.255",
Validation: function(in_sValue) {
var l_aValueHost = in_sValue.split(".");
if (l_aValueHost.length != 4) {
return "Please input correct Host";
} else
if (parseInt(l_aValueHost[0], 10)>=0
&& parseInt(l_aValueHost[0], 10)<=255
&& parseInt(l_aValueHost[1], 10)>=0
&& parseInt(l_aValueHost[1], 10)<=255
&& parseInt(l_aValueHost[2], 10)>=0
&& parseInt(l_aValueHost[2], 10)<=255
&& parseInt(l_aValueHost[3], 10)>=0
&& parseInt(l_aValueHost[3], 10)<=255
)
return 0
else
return "Please input correct Host";
}
},
{
Type: "textfield",
Name: "Port",
DefaultValue: "6000",
Validation: function(in_sValue) {
if(parseInt(in_sValue, 10)>=0)
return 0
else
return "Please input correct Port";
}
}
]
}
],

// General information for the module (driver and generated by script)
Module: [{
Name: "Channels Count",
Validation: function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input Count";
}
},
{
Type: "textfield",
Name : "SubnetID",
Validation : function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input SubnetID";
}
},
{
Type: "textfield",
Name : "DeviceID",
Validation : function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input DeviceID";
}
}

]
}
</syntaxhighlight>
To get data from Setup fields use the following function
<syntaxhighlight lang="javascript">
module.GetProperty("Field name")
</syntaxhighlight>
<br />
Besides standard parameters, any parameters required for module inizialization can be asked. Driver parameters are set in the driver automatically. The other parameters are to be asked and used manually.<br />
An example of work with Setup parameters
<syntaxhighlight lang="javascript">
var COUNT_CHANNEL = parseInt(module.GetProperty("Channel count")); // Getting count channel
var SubNetID = parseInt(module.GetProperty("SubnetID")); // Getting subnet id
var DeviceID = parseInt(module.GetProperty("DeviceID")); // Getting device id
</syntaxhighlight>
===Installing a module manually===
To install a module manually no additional script development is required. A user must go to iRidium store from the app, find a module, download it and enter date in the fields indicated in the Setup file. After it the app installs the module in the system with parameters entered by a user.
===Installing a module with the help of a scanner===
'''Scanner (сканер)''' - это модуль, который анализирует какую-либо шину на подключённые устройства либо ищет устройства в локальной сети. Найденные устройства формируются в список, для выбранного устройства качается модуль и становится доступен в i3 lite. <br/>
Схема работы сканера:
# Сканер загружается из магазина;
# Пользователь вводит параметры сканера (IP, Port и т.д) и эти параметры передаются в скрипт сканера;
# Сканер, обработав введенные параметры, опрашивает шину на устройства или ищет устройства в локальной сети;
# Из полученных устройств формируется список;
# При выборе определенного устройства в списке, сканер передаёт параметры выбранного устройства в модуль.
<br/>
При разработке сканера нужно учесть:
* Параметры сканера, при добавлении из магазина;
* Логику сканера;
* Передачу параметров выбранного устройства в модуль;
* Логику модуля, с учётом переданных от сканера параметров.
<br/>
Процесс разработки сканера ничем не отличается от разработки модуля. Точно также сканеру необходимо нарисовать визуальную часть, создать драйвер и написать скрипт с логикой. Основным отличием является то, что сканер может работать только на панели управления и сканер никогда не будет запущен на сервере, поэтому, при разработке скриптов, нет необходимости разделять скрипты на драйверные и интерфейсные.
<br/>
Также при разработке сканера появляется новая логика работы. Первым делом необходимо сделать модуль для управления устройством, далее надо загрузить модуль в магазин модулей. При загрузке модуля, вы увидите уникальный идентификатор вашего модуля. Когда вы будете разрабатывать сканер, вам необходимо написать скрипт со следующей логикой:
# Создание драйвера
# Поиск оборудования
# Если оборудование найдено, надо определить что это за оборудование
# При помощи команды ModuleSetupFinish (ID модуля, js объект с настройками setup данного модуля)
После этого приложение скачет модуль из магазина модулей и установит его.<br/>
The distinctive feature of developing a scanner is the event that lauches the driver work. When developing a scanner use the following event
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_OPEN_SCANNER, 0, function (){});
</syntaxhighlight>
A scanner must be developed after modules are developed. The developed modules are registered in the store of modules and are given a unique ID. After a scanner finds devices in the local net, the script must download a module for the found equipment by the indicated ID. To download a module use the following function
<syntaxhighlight lang="javascript">
IR.ModuleSetupFinish(StoreID, ModuleData, [Callback])
</syntaxhighlight>
where
* StoreID - module ID in the store of modules
* ModuleData - data required for installing a module (fields in Setup)
* Callback - a function to process errors that happened in the installation process (optional)
An example of a developed scanner for HDL modules. To install any module the following parameters are required: Type,SubNet id, Device id, module name, bus IP address, port.
<syntaxhighlight lang="javascript">
//Example of installing HDL Dimmer with a scanner
var l_nStoreID = 82;
var l_oModuleData = {
Module: {
//Data required for module work
Type: "Dimmer",
SubnetID: 3,
DeviceID: 6
Name: "HDL Dimmer"
}
Drivers: {
//Data for the driver
"HDL-BUS Pro Network (UDP)": {
Host: "255.255.255.255", //installing a host for the driver
Port: "6000" //installing a port for the driver
},
}
}

IR.ModuleSetupFinish(l_nStoreID, l_oModuleData, function(in_error){
if (!in_error){
...
} else {
...
}
});
</syntaxhighlight>
===Adding subdevices manually===
After adding the subdevices via the scanner or Setup, the user may have a need to add other subdevices. To ensure this, module developer has to assign the system variable
<syntaxhighlight lang="javascript">
SettingsPopupName = module.GetPopup('AddSubDevicePopup');
</syntaxhighlight >
You have to assign a window with the results of the scanner operation or a popup in which the user can configure a new subdevice or add this subdevice. This popup should be developed by the developer himself.<br/>
If the popup is assigned to the specified system variable, the user will see a "+" button in the module settings section. This button opens the specified popup
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:AddSubdeviceBtn.png]]</div></div>
</div>
Example of specifying the adding subdevices window. When developing, you need to create an adding window in the tablet resolution and a separate window in the smartphone resolution
<syntaxhighlight lang="javascript">
module.SettingsPopupName = IR.DisplayType != IR.DISPLAY_TYPE_TABLET? module.GetPopup("phone:NoAuthorize").Name: module.GetPopup("NoAuthorize").Name;
</syntaxhighlight >
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:AddSubdeviceWindow.png]]</div></div>
</div>
===Authorization===
To work with certain devices a user's authorization in a third-party system is required. i 3lite app has a special authorization mechanism for this purpose.<br/>
To authorize a user has to enter his access data in a special window. This window is unique for every device and a module developer must create it. A window to enter data is a popup with fields to enter data. The popup is created with the help of standard means of the studio and it may be unassigned to any subdevices. When access data are entered, the script must authorize in a third-party system and close the authorization window. After creating an authorization popup, a developer must call the authorization system variable in the script and assign the created popup in the variable.
<syntaxhighlight lang="javascript">
AuthorizationPopupName = module.GetPopup("AutorisationPopup");
</syntaxhighlight ><br/>
After an authorization popup is assigned to a variable, "Authorize" button appears in the module settings.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:NeedAuthorization1.png]]</div></div>
</div>
When this button is pressed, the app opens the authorization popup, assigned in the script. The next task for a module developer is to display a user's status (Authorized or not). There is a system variable to solve this task.
<syntaxhighlight lang="javascript">
AuthorizationStatus = true;
</syntaxhighlight ><br/>
If a user is authorized in the system, true value is assigned to the variable and the app changes the status of the authorization button into:
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Logout1.png]]</div></div>
</div>
A module devloper must also think about the mechanism of deauthorization. It is done on the authorization popup.<br/>
An example of the authorization script
<syntaxhighlight lang="javascript">
if (module.AuthorizationStatus == false) { //If a user is not authorized
module.AuthorizationPopupName = WindowSettings.Window.Name;//Assigning the authorization popup created earlier
} else if (module.AuthorizationStatus) //If a user is authorized
{
module.AuthorizationPopupName = IR.DisplayType != IR.DISPLAY_TYPE_TABLET? module.GetPopup("phone:deAuth").Name: module.GetPopup("deAuth").Name;//Showing the deauthorization popup
}
</syntaxhighlight ><br/>
Note. Remember to create a separate authorization/deauthorization popup for a smart phone and for a tablet.
===Changing settigns===
While working with the application, there may be a need to change the settings of the module. To provide such an opportunity, the module developer must create a function to change the module settings and assign it to the system method
<syntaxhighlight lang="javascript">
module.ChangeProperties = function (in_oSetup)
{
Processing of new module parameters
}
</syntaxhighlight>
При объявлении такой функции, приложение добавит в модуль кнопку редактирования настроек модуля.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ChangeBtn.png]]</div></div>
</div>
Когда пользователь нажмет на данную кнопку, приложение откроет окно Setup, которое использовалось при установке модуля. В этом окне пользователь введет новые настройки и нажмет кнопку "готово". После этого приложение запустить указанную выше функцию. Настройки драйвера приложение сможет изменить самостоятельно, остальные же настройки разработчик модуля дулжен изменить вручную. Новые настройки записываются во входной параметр in_oSetup в виде JSON строки.<br/>
Также в данной функции необходимо обработать успешность изменения настроек. За это отвечает флаг
<syntaxhighlight lang="javascript">
module.FinishUpdateSettings = true;
</syntaxhighlight>
Если установка новых параметров прошла успешно, то надо выставить значение флага true, а обратном случае флаг должен принять значение false. Это позволяет приложению понять что смена параметров не удалась(если статус переменной будет false) и приложение отменит изменение настроек драйвера, вернув старые настройки<br/>
Пример обработки новых настроек модуля
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_MODULE_START, 0, function(){
module.ChangeProperties = function (in_oSetup, in_oModule) {
if (typeof (in_oSetup) == "string")
in_oSetup = JSON.Parse(in_oSetup);
var l_nChannel = in_oSetup.Module["Channel count"];
if (l_nChannel >= COUNT_CHANNEL) {
module.FinishUpdateSettings = true;
// Recreating element on cycle
for (var count = 1; count <= in_nChannel; count++) {

// Creating subDevice
l_oSubDevice = module.AddSubDevice("Relay " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_RELAY);

// Create revers
if (!l_oSubDevice.GetProperty("Reverse"))
l_oSubDevice.SetProperty("Reverse", 0);

// Assigned to the variable name of the channel
var l_sChannelName = "Relay:channel" + count;

// Adding channels
l_oSubDevice.AddChannel(l_sChannelName, Data);
l_oSubDevice.AddTag(l_sChannelName, Data);

// Adding smart virtual tag
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_TAG_POWER, true);
};
}
else {
for (var count = 1; count <= COUNT_CHANNEL; count++)
if (l_nChannel < count) {
var l_oDeleteSubDevice = module.GetSubDevice("Relay " + count);
module.DeleteSubDevice (l_oDeleteSubDevice.ID);
};
};
};
});
</syntaxhighlight>

Translations:DevManual/205/en

2017-04-17T04:58:19Z

Ildar: Новая страница: «Processing of new module parameters»

Processing of new module parameters

DevManual/en

2017-04-17T04:57:53Z

Ildar: Новая страница: «While working with the application, there may be a need to change the settings of the module. To provide such an opportunity, the module developer must create a f…»

<languages/>
=Module development guide=
==Definitions==

'''Module''' - is a component that allows you to control one type of equipment by its unique ID. The module is located in the store of modules.

'''Control panel (mobile device)''' - is a device from which the project i3 lite is launched (tablet, smartphone).

'''Store of modules''' - is a cloud server for uploading ready-made modules. The module store is available from the i3 lite application or on our[http://www.iridiummobile.ru/store/ site]

'''iRidium Studio''' - is a editor that allows to create the module to control device for i3 lite application. You need to use a special editor build for [http://www.iridiummobile.net/redirects/?go=iRidium_SETUP_LITE module developers] to develop the module

'''i3 lite''' - is an application to create, set and use i3 lite projects.

'''i3 lite project''' – is an automation project made up of ready equipment control modules. i3 lite projects differ from i2 Control projects: i3 lite projects can be edited dynamically without prior editing in iRidium Studio. i3 lite project consists of several small parts that can be put together into a single whole in i3 lite app with the help of the built-in constructor. It can also be easily edited in the app. As a result, a big number of intermediate processes are no longer necessary, such as installing software on PC, uploading projects on contol panels. All is done in one place - a control panel.

'''SubDevice''' - This is a virtual representation of the working area of the physical device. If we take as an example a 6-channel dimmer it has 6 sub-devices, because each independent device requires a separate control interface and connects to one channel.

'''Room (in i3 lite)''' - The visual part of i3 lite containing hardware management widgets. The project in i3 lite consists of rooms located on the floors

'''Widget''' - is a visual module component located in the room. It has limitations in size and fixed position in the room interface. It contains the main module functionality. For additional functions Remote is used.

'''Remote''' - is a visual module component which is hidden by default. It opens only when clicking on the corresponding item of the widget. It does not have size limitations (not more than the panel display size) and can be located in any part of the room interface (it is usually located in the middle of the panel display). It contains additional functionality of the module.

'''Macros''' - is a sequence of commands of various modules, which is activated by pressing. Contains "Action" and "Condition". For example, the macros "turn off all the lights in the house" will send the shutdown command to all devices responsible for lighting.

'''Routine''' - is a sequence of commands of various modules, which is activated automatically when a certain event occurs. Contains "Event", "Action" and "Condition". For example, "turn on the light if the motion sensor is triggered"

'''Event''' - is a routine component that describes the control command and the value range. If the value is sent in the indicated range, the routine is executed. For example, the event "Motion appeared" is activated if the motion sensor is triggered.

'''Action''' - is a component of macros and routines. It describes the control command and value that must be sent to the command. For example, "turn on the light". There are 2 types of Action: Simple Action and Advanced Action.

'''Simple Action''' - Simple Action is used when the command and Action value are known in advance.

'''Advanced Action''' - Advanced Action is used when the command is known but the value is unknown. The value is set dynamically when Action is used in i3 lite (but not when creating in iRidium studio).

'''Condition''' - is a component of macros and scenes. It describes the control command and value range. When a value from the value range is sent Action is executed.

'''Scanner''' - is a software part, that analyzes any bus looking for connected devices. Found connected devices are displayed in a list. Modules for the found devices are downloaded from iRidium store and the devices become available to control in i3 lite.
==Module concept==
The module is an independent subroutine of the i3 lite application which is built in the project and has an independent interface, driver and logic. Modules are developed in the [http://www.iridiummobile.net/redirects/?go=iRidium_SETUP_LITE iRidium Studio] editor and located in the module store [http://www.iridiummobile.ru/store/ iRidium Store]. Integrator downloads the module from the module store for each individual project.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ModuleInScheme.png]]</div></div>
</div>

There are two types of modules:
*Control module - module for hardware control
*Scanner - module for searching hardware in the local network and loading modules for found devices
== How to start developing the module ==
----

{{i}} Before starting your work, it is recommended to read [http://dev.iridiummobile.net/How_to_begin iRidium documentation]. It describes the basics of working with iRidium. The i3 lite documentation describes how to develop modules for the i3 lite platform for users, who already know iRidium. If you want to write script use [[Special:MyLanguage/Developers_API | i3 lite API]].
----

The module life cycle consists of:
* Developing the graphic part in iRidium studio
* Developing the driver part (scripts, devices)
* Testing
* Publishing in iRidium store
* Using (module download via the i3 lite application from the cloud and adding to automation projects)
<br/>
==Module structure ==
Each module must consist of subdevices. The subdevice is a virtual representation of the working area of a physical device. Many devices support multiple workgroups with the same functionality. Each workgroup may be in a separate zone. To fully control the zone, you need to create a subdevice for each workgroup of the device. For example, a 6-channel HDL dimmer contains 6 dimmable channels, through which 6 working groups can be controlled. Therefore, it is advisable to select in the module 6 subdevices for the possibility of creating actions, events and conditions for each workgroup separately. The presence of subdevice in the i3 lite module is obligatory. The number of sub-devices can be from one to many. Usually the number of subdevice is equal to the number of channels of the controller, the number of its work areas or logical devices.

Subdevice consists of:
* Conditions
* Actions
* Events
* Widgets

Conditions, actions and events are logical elements of the subdevice, on their basis macros and routines are created. Widget is a graphical element, through which the user will control subdevice. Usually one subdevice contains one widget, but the number of conditions, actions and events varies (from zero to many). The number of subdevices in the module can be either fixed or not. For example, you can develop a module only for a 6-channel dimmer, and you can make a module that will request the hardware for the number of subdevices and create the required number of subdevices.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ModuleStruct.png]]</div></div>
</div>
==Creating the module interface ==
The interface part of the midule consists of:
* widgets - interface part of the subdevice, which is located in the rooms and has basic control functions
* Remote - interface part of the module, which has a set of device functions and opens to the full screen, when you click on the widget button
* Authorization window - Authorization is required to work with some devices. To do this, the developer can create a special authorization window that is available in the module settings
* The module settings window is a window where you need to enter the parameters for the module operation
картинка окна настроек модуля и кнопки открытия
The whole graphic part is drawn in the graphical interface of the iRidium studio editor. In contradistinction to i3 pro, the module's interface should be made up of ready-made graphic components located in the gallery.

==== Widget ====

Widget is a visual component of the module, a kind of Popup that will be displayed in the room. The main task of the widget is to display the basic controls of the subdevice and to provide a module transition to the Remote control of the subdevice. For example, to control a media player, you can place a volume slider or Mute button for quick access to adjusting the volume. The weather widget can display the current weather, and the control panel will contain the weather forecast for all 5 days.<br />
The module does not make sense without widget, because it will not have a graphical representation in the i3 lite project.

Widget has a limited size
# Width '''640'''
# Height can not exceed '''1200'''

[[Файл:Пример виджета.png|center|thumb|Рис. Widget example]]

To create a widget, click the Add pop-up button in the Project overview panel and in the appeared menu select popup type: "Widget", set the name and properties:
[[Файл:ПанельПопап.png|thumb|center]]

Properties of a created widget can be changed with the help of '''Object Properties'''.<br />
Graphic items are assigned to channels like in popups:
[[Файл:Связывание_канала_команды_и_графического_элемента.png|center|thumb|Рис. Связывание канала команды и графического элемента]]
Widget will be displayed:
* In the room when a client uses the project
[[Файл:В_комнате_при_использовании_пользователем_проекта.png|center|thumb|]]
* In the module settings when it is added to the project:
[[Файл:И_в_настройках_модуля_при_добавлении_его_в_проект.png ‎|center|thumb|]]
====Remote and other graphic windows====

Remote (a remote control) is a graphical area to control SubDevices. Unlike wigets, it can have free size and position. And it is displayed on call. Remote is displayed when a button to go to the remote control is pressed on a widget.
Items to control equipment are placed on Remote (buttons, lists, switches, levels). There can be from 0 to several remote controls. Example of Remote:<br />
[[Файл:Пульт_управления.png ‎|center|thumb|]]<br />

Remote is created like a Widget. The only difference is to select "Remote" when you click "Add Popup Page" in the "Device Type" property.
==Interface design standard==
For the convenience of interface design, a standard was developed in which graphic windows should be developed in the module so that the modules of different developers looked uniformly within the framework of one project.
===Basic principles===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:GeneralUI.png]]</div></div>
<div class="col-sm-12 col-md-6">
Виджет состоит из «Header» и дополнительных модулей основного функционала. <br/>
«Header» — верхний модуль виджета.<br/>
«Header» содержит:<br/>
- наименование виджета;
- наименование устройства, которым<br/>
управляет виджет;<br/>
- иконка категории устройства.<br/>
<br/>
Дополнительные модули содержат элементы управления устройством.
</div>
</div>
===Module grid and blocks===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka1.png]]</div></div>
<div class="col-sm-12 col-md-6">
Module grid widget is a block 640 pt wide
And 120 pt in height. Each block has a grid of 8x8 pt.
The rounding of the corners is 12.5 ut. (Circle 25)
</div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka2.png]]</div></div>
<div class="col-sm-12 col-md-6">
The principle of constructing a widget block is a constructor from
Controls (buttons, switches, labels) from smaller to larger.
</div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka3.png]]</div></div>
<div class="col-sm-12 col-md-6">
Control items are combined and united in a block, blocks are united into a control panel.
</div>
</div>
===Buttons===
<big>'''Toggle'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Toggle.png]]</div></div>
<div class="col-sm-12 col-md-6">
Кнопка изменения значения «вкл/выкл». Применяется для отправки команды на устройство, вне зависимости от его текущего состояния.
</div>
</div>
<big>'''Switch'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Switch.png]]</div></div>
<div class="col-sm-12 col-md-6">
«On/off» switch. It is used only when the currect device status is known.
</div>
</div>
<big>'''Multistate'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Multistate.png]]</div></div>
<div class="col-sm-12 col-md-6">
Multistate button is used only when the current device status is known.
</div>
</div>
===Arrow-button===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:arrow1.png]]</div></div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:arrow2.png]]</div></div>
</div>
'''Действие кнопки'''<br/>
При нажатии на кнопку происходит вызов «PopUp».<br/>
'''Содержимое «PopUp»'''<br/>
«Input field», «Single selection», «Multiple selection».
===Sliders===
<div class="row">
<div class="col-sm-12 col-md-6">
Standart
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:StandartSlider.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
Value
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ValueSlider.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
Progress
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ProgressSlider.png]]</div></div>
</div>
===Description===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Description.png]]</div></div>
===Icons===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Icons1.png]]</div></div>
All icons are devided by their spheres of use, their main differene is the size.
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Icons2.png]]</div></div>
===«Header» widget===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:WidgetHeader.png]]</div></div>
===Icon location===
<div class="row">
<div class="col-sm-12 col-md-6">
The standard is 128х120 pt
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:FormFactor.png]]</div></div>
</div>
All buttons have two states - active and inactive
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:OFFicon.png]]</div></div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ONicon.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
When the button in inactive the color is always # 848484 or RGB 132
</div>
<div class="col-sm-12 col-md-6">
The state of a button is considered active, when the action received feedback and is short or instant (e.g. «Play» in a media player) or an acrion that is active for a long time and demands another activity to switch off the active state (e.g. «Repeat» in a media player).
</div>
</div>
==Basics of working with scripts==

To design an interface and to add a driver, you are to develop the logics of module work via script. The script part of developing i3 lite modules has a number of special features. Before developing the script part of i3 lite modules, please, read [http://dev.iridiummobile.net/JS_Guide iRidium Pro API] and [[Special:MyLanguage/Developers_API | i3 lite API]]. <br />

A module can contain any number of scripts. There are several types of scripts for modules:
* Driver - script files of this type contain script, responsible for working with a driver
* GUI - script files of this type contain script, responsible for working with graphics
* Common - script files of this type must contain general scripts, such as a set of additional functions or a description of classes of secondary importance
* Setup - a special script file that contains information about module setting, a list of fields that are obligatory to fill in, types of these fields and functions that check the correctness of entered data.

Devision into types is necessary for the module correct work on the server. Only logics and the driver part work on the server, but the server knows nothing about the graphic part. That's why a module developer has to devide scripts into types. The server does not notice files for working with the graphic part. <br />

When modules are developed module names have to be used instead of IR. Thus, a listener looks this way module.AddListener… <br />

Каждый скриптовой файл должен начинаться со слушателя
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_MODULE_START, 0, function(){});
</syntaxhighlight>
Это новый вид события, предназначенный специально для разработки модуля. При разработке модуля следует учитывать что скриптовой файл стал закрыт для других скриптовых файлов. Это хзначить что теперь можно использовать одноименные переменные и названия функций в разных скриптовых файлах и они не будут перезаписываться, но это накладывает ограничение: нельзя получить доступ к функции из другого скриптового файла простым способом. Для получения доступа к функции из другого скриптового файла, следует импортировать скриптовый файл с помощью команды module.Import("FileName.js"). <br />
Example:<br/>
<syntaxhighlight lang="javascript">
//Name_1.js - first js file
this.Text = "Hello, world!"; //Pointer to a text variable
//Name_2.js - second js file
var Text = module.Import("Name_1.js").Text; //Importing an object with a pointer to a text variable from the first js file
IR.Log(Text); //"Hello, world!" //log the text variable
</syntaxhighlight>
==Creating a subdevice==
The basis of every module is subdevices. The task of every module developer is to define how many subdevices a module has and to develop the logics of subdevice work. Each subdevice may contain a widget, a remote control, a set of actions, events and states. All contents of a subdevice have to be indicated when a subdevice is created. Subdevice contents can't be changed during module work. The following command is used to create a subdevice:<br/>
<syntaxhighlight lang="javascript">
module.AddSubDevice(SystemName, [Device], [System], [Type], [Tags], [Name], [Callback]);
</syntaxhighlight>
where<br/>
'''SystemName''' - subdevice system name<br/>
'''Device''' - a driver to which a subdevice will be assigned<br/>
'''System''' - old parameter, "false" is to be used<br/>
'''Type''' - type of smart device. Parameter is under development<br/>
'''Tags''' - Array of virtual tag objects<br/>
'''Name''' - subdevice name that is displayed to the user<br/>
'''Callback function(){do somethings}''' - a function that is on till the IR.EVENT_ADD_SUBDEVICE event happens.<br/>
As a reply the function returns a link to a subdevice, that can be used to address it.<br/>
An example of creating subdevices for HDL Relay devices. The script checks th number of devices in the bus and creates subdevices.<br/>
<syntaxhighlight lang="javascript">
for (var count = 1; count <= COUNT_CHANNEL; count++) {
// Creating a subdevice
l_oSubDevice = module.AddSubDevice("Relay " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_RELAY);
// Creating StatusOnStart command
if (count == 1)
l_oSubDevice.AddChannel("Relay:statusOnStart", [ChannelData]);
var l_sChannelName = "Relay:channel" + count;
// Adding channels
l_oSubDevice.AddChannel(l_sChannelName, [ChannelData]);
l_oSubDevice.AddTag(l_sChannelName, [ChannelData]);
// Add a virtual tag
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_TAG_POWER, true);
};</syntaxhighlight><br/>
Everything that is required can be added to a subdevice this way. An event is activated when a subdevice is created.<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function, [pointer]);
</syntaxhighlight><br/>
A link to a subdevice that was created is sent to a function. Different components can be added to subdevice in this event, such as, actions, events, states, widgets, chanels, tags. For example,<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function(in_oSubDevice){
Creating actions
in_oSubDevice.AddAction("On", false, in_oSubDevice.SystemName + "_Power", lightID + "_1", IR.SUB_DEVICE_COMMAND_POWER_ON);
in_oSubDevice.AddAction("Off", false, in_oSubDevice.SystemName + "_Power", lightID + "_0", IR.SUB_DEVICE_COMMAND_POWER_OFF);
Creating events
in_oSubDevice.AddEvent("On", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "1");
in_oSubDevice.AddEvent("Off", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "0");
Creating states
in_oSubDevice.AddCondition("On", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "1");
in_oSubDevice.AddCondition("Off", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "0");
});</syntaxhighlight><br/>
Thus, a developer can create the required number of subdevices when a module is installed or when new subdevices are added manually.
==Adding a widget to a subdevice==

After an interface is created in the studio and a function to add subdevices is added, create a copy of a widget for each subdevice and assign it to the subdevice. To assign a widget to a subdevice the following method is used.<br/>
<syntaxhighlight lang="javascript">SubDevice.addWidget(in_Widget)</syntaxhighlight><br/>


The input parameter of the method is '''in_Widget''' - an object, a widget, created in the studio beforehand.<br />
The output parameter of the method is '''True''' or '''False''' (successful or not).<br />
For example, we have 3 lamps. Not to create a separate wiget for each lamp, use a ready template and clone it. Here is an example of creating widgets with the help of a code using the existing template .<br />

Clone method allows to clone an existing popup.<br/>
<syntaxhighlight lang="javascript">Module.ClonePopup (in_Popup, in_Name)</syntaxhighlight><br/>
Входные параметры метода:
*'''in_Name''' - имя нового виджета.<br/>
*'''in_Popup''' - ссылка на всплывающее окно.<br/>
Выходным параметром метода является: успешно или нет ('''True''', '''False''').<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function(in_oSubDevice){
var popup = module.GetPopup("Dimmer"); // Calling a widget that we want to clone
// Creating a widget using cloning method
var widget = in_oSubDevice.addWidget(module.ClonePopup(popup, "Dimmer"+ in_oSubDevice.Name));
});</syntaxhighlight><br/>
----
{{i}} Names of new widgets must not be repeated
----
When a complete remote control is opened it is necessary to remmeber that a user will use the module both on a tablet and on a smart phone. The difference betwen the screen sizes makes a developer design 2 types of windows: a version for smart phones and a version for tablets. In addition a method must be added to the script that asks the system about the type of device where a module is launched and open the required window.
<syntaxhighlight lang="javascript">
if (IR.DisplayType == IR.DISPLAY_TYPE_PHONE) { //If a module is opened on a smart phone
var l_oPopupScanner = module.GetPopup("Phone"); //show a popup created for a smart phone
}
else {
var l_oPopupScanner = module.GetPopup("Tablet");//If a module is opened on a tablet, show a popup for a tablet
}
</syntaxhighlight><br/>
==Work with channels and tags==
After creating a subdevice and adding a widget you must add to the subevice channels and tags required for its work. Like in i3 pro version, a driver can be added in the studio or via script. Each subdevice requires a personal set of channels and tags for the selected driver. You may work with the following three components:<br/>
*Channel. The following method is used to create a channel<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddChannel(Name, DataArray)
</syntaxhighlight>where<br/>
'''Name''' - channel name<br/>
'''DataArray''' - data array (specific for every driver)<br/>
*Tag The following method is used to create a tag<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddTag(Name, DataArray)
</syntaxhighlight>where<br/>
'''Name''' - tag name<br/>
'''DataArray''' - data array, specific for every driver<br/>
*Virtual tag. The following method if used to create a virtual tag<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddVirtualTag(Name, Value, [Edit], [smartID], [Hidden])
</syntaxhighlight>where<br/>
'''Name'''- name of a subdevice virtual tag<br/>
'''Value''' - Tag value<br/>
'''Edit''' - Permission to edit a tag<br/>
'''smartID''' - Parameter is under development! Set "false"<br/>
'''Hidden''' - Feature of a hidden tag<br/>
===An example of creating channels and tags when creating a subdevice===
<syntaxhighlight lang="javascript">
l_oSubDevice = module.AddSubDevice("Light " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_DIMMER);

// Adding channel StatusOnStart
if (count == 1)
l_oSubDevice.AddChannel("Dimmer:statusOnStart", [ChannelData]);

// Assigned to the variable name of the channel
var l_sChannelName = "Dimmer:channel" + count;

// Adding channels
l_oSubDevice.AddChannel(l_sChannelName, [ChannelData]);
l_oSubDevice.AddTag(l_sChannelName, [TagData]);

// Adding smart virtual tag
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_COMMAND_POWER, true);
l_oSubDevice.AddVirtualTag("Power On", 0, false, IR.SUB_DEVICE_COMMAND_POWER_ON, true);
l_oSubDevice.AddVirtualTag("Power Off", 0, false, IR.SUB_DEVICE_COMMAND_POWER_OFF, true);
l_oSubDevice.AddVirtualTag("Level", 0, false, IR.SUB_DEVICE_COMMAND_LEVEL, true);
</syntaxhighlight>
==Setting a module in the app==
Modules are stored in iRidium store and can be installed in the app using one of the following ways:<br/>
*With the help of a scanner<br/>
*Manually<br/>
===Developing the Setup file===
The Setup file must be developed for each variant. It's a special script file with fields that are required for module work. These fields can be device IP address, port, city name, etc. To develop a Setup file, create a new script file and select its type - "Setup". Eacn field is a tag and can be accessed from the script, and the input value can be received.
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:СетапБонго.png]]</div></div>
The Setup file consists of 2 parts. Part 1 is the driver settings. The settings must require IP addresses, ports and logins to connect the driver to a device. Part 2 is the module general settings, such as number of outputs, access keys.
To set fields in the Setip file set the following fields in the script:
* Field type - indicate what field must be shown to a user (text field, data array, etc. Detailed description is given in API)
* Field name - name of field that a user sees when setting a module
* Default value - what value must be put by default
* Check function - a function to validate value in the field. A function must be written that checks the correctness of the entered data.
For example,"Setup" script for HDL module looks this way:
<syntaxhighlight lang="javascript">
{
// Data to connect drivers, created in Project Device Panel
Drivers:
[
{
Name: "HDL-BUS Pro Network (UDP)",
Properties:
[
{
Type: "textfield",
Name: "Host",
DefaultValue: "255.255.255.255",
Validation: function(in_sValue) {
var l_aValueHost = in_sValue.split(".");
if (l_aValueHost.length != 4) {
return "Please input correct Host";
} else
if (parseInt(l_aValueHost[0], 10)>=0
&& parseInt(l_aValueHost[0], 10)<=255
&& parseInt(l_aValueHost[1], 10)>=0
&& parseInt(l_aValueHost[1], 10)<=255
&& parseInt(l_aValueHost[2], 10)>=0
&& parseInt(l_aValueHost[2], 10)<=255
&& parseInt(l_aValueHost[3], 10)>=0
&& parseInt(l_aValueHost[3], 10)<=255
)
return 0
else
return "Please input correct Host";
}
},
{
Type: "textfield",
Name: "Port",
DefaultValue: "6000",
Validation: function(in_sValue) {
if(parseInt(in_sValue, 10)>=0)
return 0
else
return "Please input correct Port";
}
}
]
}
],

// General information for the module (driver and generated by script)
Module: [{
Name: "Channels Count",
Validation: function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input Count";
}
},
{
Type: "textfield",
Name : "SubnetID",
Validation : function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input SubnetID";
}
},
{
Type: "textfield",
Name : "DeviceID",
Validation : function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input DeviceID";
}
}

]
}
</syntaxhighlight>
To get data from Setup fields use the following function
<syntaxhighlight lang="javascript">
module.GetProperty("Field name")
</syntaxhighlight>
<br />
Besides standard parameters, any parameters required for module inizialization can be asked. Driver parameters are set in the driver automatically. The other parameters are to be asked and used manually.<br />
An example of work with Setup parameters
<syntaxhighlight lang="javascript">
var COUNT_CHANNEL = parseInt(module.GetProperty("Channel count")); // Getting count channel
var SubNetID = parseInt(module.GetProperty("SubnetID")); // Getting subnet id
var DeviceID = parseInt(module.GetProperty("DeviceID")); // Getting device id
</syntaxhighlight>
===Installing a module manually===
To install a module manually no additional script development is required. A user must go to iRidium store from the app, find a module, download it and enter date in the fields indicated in the Setup file. After it the app installs the module in the system with parameters entered by a user.
===Installing a module with the help of a scanner===
'''Scanner (сканер)''' - это модуль, который анализирует какую-либо шину на подключённые устройства либо ищет устройства в локальной сети. Найденные устройства формируются в список, для выбранного устройства качается модуль и становится доступен в i3 lite. <br/>
Схема работы сканера:
# Сканер загружается из магазина;
# Пользователь вводит параметры сканера (IP, Port и т.д) и эти параметры передаются в скрипт сканера;
# Сканер, обработав введенные параметры, опрашивает шину на устройства или ищет устройства в локальной сети;
# Из полученных устройств формируется список;
# При выборе определенного устройства в списке, сканер передаёт параметры выбранного устройства в модуль.
<br/>
При разработке сканера нужно учесть:
* Параметры сканера, при добавлении из магазина;
* Логику сканера;
* Передачу параметров выбранного устройства в модуль;
* Логику модуля, с учётом переданных от сканера параметров.
<br/>
Процесс разработки сканера ничем не отличается от разработки модуля. Точно также сканеру необходимо нарисовать визуальную часть, создать драйвер и написать скрипт с логикой. Основным отличием является то, что сканер может работать только на панели управления и сканер никогда не будет запущен на сервере, поэтому, при разработке скриптов, нет необходимости разделять скрипты на драйверные и интерфейсные.
<br/>
Также при разработке сканера появляется новая логика работы. Первым делом необходимо сделать модуль для управления устройством, далее надо загрузить модуль в магазин модулей. При загрузке модуля, вы увидите уникальный идентификатор вашего модуля. Когда вы будете разрабатывать сканер, вам необходимо написать скрипт со следующей логикой:
# Создание драйвера
# Поиск оборудования
# Если оборудование найдено, надо определить что это за оборудование
# При помощи команды ModuleSetupFinish (ID модуля, js объект с настройками setup данного модуля)
После этого приложение скачет модуль из магазина модулей и установит его.<br/>
The distinctive feature of developing a scanner is the event that lauches the driver work. When developing a scanner use the following event
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_OPEN_SCANNER, 0, function (){});
</syntaxhighlight>
A scanner must be developed after modules are developed. The developed modules are registered in the store of modules and are given a unique ID. After a scanner finds devices in the local net, the script must download a module for the found equipment by the indicated ID. To download a module use the following function
<syntaxhighlight lang="javascript">
IR.ModuleSetupFinish(StoreID, ModuleData, [Callback])
</syntaxhighlight>
where
* StoreID - module ID in the store of modules
* ModuleData - data required for installing a module (fields in Setup)
* Callback - a function to process errors that happened in the installation process (optional)
An example of a developed scanner for HDL modules. To install any module the following parameters are required: Type,SubNet id, Device id, module name, bus IP address, port.
<syntaxhighlight lang="javascript">
//Example of installing HDL Dimmer with a scanner
var l_nStoreID = 82;
var l_oModuleData = {
Module: {
//Data required for module work
Type: "Dimmer",
SubnetID: 3,
DeviceID: 6
Name: "HDL Dimmer"
}
Drivers: {
//Data for the driver
"HDL-BUS Pro Network (UDP)": {
Host: "255.255.255.255", //installing a host for the driver
Port: "6000" //installing a port for the driver
},
}
}

IR.ModuleSetupFinish(l_nStoreID, l_oModuleData, function(in_error){
if (!in_error){
...
} else {
...
}
});
</syntaxhighlight>
===Adding subdevices manually===
After adding the subdevices via the scanner or Setup, the user may have a need to add other subdevices. To ensure this, module developer has to assign the system variable
<syntaxhighlight lang="javascript">
SettingsPopupName = module.GetPopup('AddSubDevicePopup');
</syntaxhighlight >
You have to assign a window with the results of the scanner operation or a popup in which the user can configure a new subdevice or add this subdevice. This popup should be developed by the developer himself.<br/>
If the popup is assigned to the specified system variable, the user will see a "+" button in the module settings section. This button opens the specified popup
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:AddSubdeviceBtn.png]]</div></div>
</div>
Example of specifying the adding subdevices window. When developing, you need to create an adding window in the tablet resolution and a separate window in the smartphone resolution
<syntaxhighlight lang="javascript">
module.SettingsPopupName = IR.DisplayType != IR.DISPLAY_TYPE_TABLET? module.GetPopup("phone:NoAuthorize").Name: module.GetPopup("NoAuthorize").Name;
</syntaxhighlight >
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:AddSubdeviceWindow.png]]</div></div>
</div>
===Authorization===
To work with certain devices a user's authorization in a third-party system is required. i 3lite app has a special authorization mechanism for this purpose.<br/>
To authorize a user has to enter his access data in a special window. This window is unique for every device and a module developer must create it. A window to enter data is a popup with fields to enter data. The popup is created with the help of standard means of the studio and it may be unassigned to any subdevices. When access data are entered, the script must authorize in a third-party system and close the authorization window. After creating an authorization popup, a developer must call the authorization system variable in the script and assign the created popup in the variable.
<syntaxhighlight lang="javascript">
AuthorizationPopupName = module.GetPopup("AutorisationPopup");
</syntaxhighlight ><br/>
After an authorization popup is assigned to a variable, "Authorize" button appears in the module settings.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:NeedAuthorization1.png]]</div></div>
</div>
When this button is pressed, the app opens the authorization popup, assigned in the script. The next task for a module developer is to display a user's status (Authorized or not). There is a system variable to solve this task.
<syntaxhighlight lang="javascript">
AuthorizationStatus = true;
</syntaxhighlight ><br/>
If a user is authorized in the system, true value is assigned to the variable and the app changes the status of the authorization button into:
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Logout1.png]]</div></div>
</div>
A module devloper must also think about the mechanism of deauthorization. It is done on the authorization popup.<br/>
An example of the authorization script
<syntaxhighlight lang="javascript">
if (module.AuthorizationStatus == false) { //If a user is not authorized
module.AuthorizationPopupName = WindowSettings.Window.Name;//Assigning the authorization popup created earlier
} else if (module.AuthorizationStatus) //If a user is authorized
{
module.AuthorizationPopupName = IR.DisplayType != IR.DISPLAY_TYPE_TABLET? module.GetPopup("phone:deAuth").Name: module.GetPopup("deAuth").Name;//Showing the deauthorization popup
}
</syntaxhighlight ><br/>
Note. Remember to create a separate authorization/deauthorization popup for a smart phone and for a tablet.
===Changing settigns===
While working with the application, there may be a need to change the settings of the module. To provide such an opportunity, the module developer must create a function to change the module settings and assign it to the system method
<syntaxhighlight lang="javascript">
module.ChangeProperties = function (in_oSetup)
{
обработка новых параметров модуля
}
</syntaxhighlight>
При объявлении такой функции, приложение добавит в модуль кнопку редактирования настроек модуля.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ChangeBtn.png]]</div></div>
</div>
Когда пользователь нажмет на данную кнопку, приложение откроет окно Setup, которое использовалось при установке модуля. В этом окне пользователь введет новые настройки и нажмет кнопку "готово". После этого приложение запустить указанную выше функцию. Настройки драйвера приложение сможет изменить самостоятельно, остальные же настройки разработчик модуля дулжен изменить вручную. Новые настройки записываются во входной параметр in_oSetup в виде JSON строки.<br/>
Также в данной функции необходимо обработать успешность изменения настроек. За это отвечает флаг
<syntaxhighlight lang="javascript">
module.FinishUpdateSettings = true;
</syntaxhighlight>
Если установка новых параметров прошла успешно, то надо выставить значение флага true, а обратном случае флаг должен принять значение false. Это позволяет приложению понять что смена параметров не удалась(если статус переменной будет false) и приложение отменит изменение настроек драйвера, вернув старые настройки<br/>
Пример обработки новых настроек модуля
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_MODULE_START, 0, function(){
module.ChangeProperties = function (in_oSetup, in_oModule) {
if (typeof (in_oSetup) == "string")
in_oSetup = JSON.Parse(in_oSetup);
var l_nChannel = in_oSetup.Module["Channel count"];
if (l_nChannel >= COUNT_CHANNEL) {
module.FinishUpdateSettings = true;
// Recreating element on cycle
for (var count = 1; count <= in_nChannel; count++) {

// Creating subDevice
l_oSubDevice = module.AddSubDevice("Relay " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_RELAY);

// Create revers
if (!l_oSubDevice.GetProperty("Reverse"))
l_oSubDevice.SetProperty("Reverse", 0);

// Assigned to the variable name of the channel
var l_sChannelName = "Relay:channel" + count;

// Adding channels
l_oSubDevice.AddChannel(l_sChannelName, Data);
l_oSubDevice.AddTag(l_sChannelName, Data);

// Adding smart virtual tag
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_TAG_POWER, true);
};
}
else {
for (var count = 1; count <= COUNT_CHANNEL; count++)
if (l_nChannel < count) {
var l_oDeleteSubDevice = module.GetSubDevice("Relay " + count);
module.DeleteSubDevice (l_oDeleteSubDevice.ID);
};
};
};
});
</syntaxhighlight>

Translations:DevManual/204/en

2017-04-17T04:57:52Z

While working with the application, there may be a need to change the settings of the module. To provide such an opportunity, the module developer must create a function to change the module settings and assign it to the system method

DevManual/en

2017-04-17T04:55:02Z

Ildar: Новая страница: «Example of specifying the adding subdevices window. When developing, you need to create an adding window in the tablet resolution and a separate window in the sma…»

<languages/>
=Module development guide=
==Definitions==

'''Module''' - is a component that allows you to control one type of equipment by its unique ID. The module is located in the store of modules.

'''Control panel (mobile device)''' - is a device from which the project i3 lite is launched (tablet, smartphone).

'''Store of modules''' - is a cloud server for uploading ready-made modules. The module store is available from the i3 lite application or on our[http://www.iridiummobile.ru/store/ site]

'''iRidium Studio''' - is a editor that allows to create the module to control device for i3 lite application. You need to use a special editor build for [http://www.iridiummobile.net/redirects/?go=iRidium_SETUP_LITE module developers] to develop the module

'''i3 lite''' - is an application to create, set and use i3 lite projects.

'''i3 lite project''' – is an automation project made up of ready equipment control modules. i3 lite projects differ from i2 Control projects: i3 lite projects can be edited dynamically without prior editing in iRidium Studio. i3 lite project consists of several small parts that can be put together into a single whole in i3 lite app with the help of the built-in constructor. It can also be easily edited in the app. As a result, a big number of intermediate processes are no longer necessary, such as installing software on PC, uploading projects on contol panels. All is done in one place - a control panel.

'''SubDevice''' - This is a virtual representation of the working area of the physical device. If we take as an example a 6-channel dimmer it has 6 sub-devices, because each independent device requires a separate control interface and connects to one channel.

'''Room (in i3 lite)''' - The visual part of i3 lite containing hardware management widgets. The project in i3 lite consists of rooms located on the floors

'''Widget''' - is a visual module component located in the room. It has limitations in size and fixed position in the room interface. It contains the main module functionality. For additional functions Remote is used.

'''Remote''' - is a visual module component which is hidden by default. It opens only when clicking on the corresponding item of the widget. It does not have size limitations (not more than the panel display size) and can be located in any part of the room interface (it is usually located in the middle of the panel display). It contains additional functionality of the module.

'''Macros''' - is a sequence of commands of various modules, which is activated by pressing. Contains "Action" and "Condition". For example, the macros "turn off all the lights in the house" will send the shutdown command to all devices responsible for lighting.

'''Routine''' - is a sequence of commands of various modules, which is activated automatically when a certain event occurs. Contains "Event", "Action" and "Condition". For example, "turn on the light if the motion sensor is triggered"

'''Event''' - is a routine component that describes the control command and the value range. If the value is sent in the indicated range, the routine is executed. For example, the event "Motion appeared" is activated if the motion sensor is triggered.

'''Action''' - is a component of macros and routines. It describes the control command and value that must be sent to the command. For example, "turn on the light". There are 2 types of Action: Simple Action and Advanced Action.

'''Simple Action''' - Simple Action is used when the command and Action value are known in advance.

'''Advanced Action''' - Advanced Action is used when the command is known but the value is unknown. The value is set dynamically when Action is used in i3 lite (but not when creating in iRidium studio).

'''Condition''' - is a component of macros and scenes. It describes the control command and value range. When a value from the value range is sent Action is executed.

'''Scanner''' - is a software part, that analyzes any bus looking for connected devices. Found connected devices are displayed in a list. Modules for the found devices are downloaded from iRidium store and the devices become available to control in i3 lite.
==Module concept==
The module is an independent subroutine of the i3 lite application which is built in the project and has an independent interface, driver and logic. Modules are developed in the [http://www.iridiummobile.net/redirects/?go=iRidium_SETUP_LITE iRidium Studio] editor and located in the module store [http://www.iridiummobile.ru/store/ iRidium Store]. Integrator downloads the module from the module store for each individual project.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ModuleInScheme.png]]</div></div>
</div>

There are two types of modules:
*Control module - module for hardware control
*Scanner - module for searching hardware in the local network and loading modules for found devices
== How to start developing the module ==
----

{{i}} Before starting your work, it is recommended to read [http://dev.iridiummobile.net/How_to_begin iRidium documentation]. It describes the basics of working with iRidium. The i3 lite documentation describes how to develop modules for the i3 lite platform for users, who already know iRidium. If you want to write script use [[Special:MyLanguage/Developers_API | i3 lite API]].
----

The module life cycle consists of:
* Developing the graphic part in iRidium studio
* Developing the driver part (scripts, devices)
* Testing
* Publishing in iRidium store
* Using (module download via the i3 lite application from the cloud and adding to automation projects)
<br/>
==Module structure ==
Each module must consist of subdevices. The subdevice is a virtual representation of the working area of a physical device. Many devices support multiple workgroups with the same functionality. Each workgroup may be in a separate zone. To fully control the zone, you need to create a subdevice for each workgroup of the device. For example, a 6-channel HDL dimmer contains 6 dimmable channels, through which 6 working groups can be controlled. Therefore, it is advisable to select in the module 6 subdevices for the possibility of creating actions, events and conditions for each workgroup separately. The presence of subdevice in the i3 lite module is obligatory. The number of sub-devices can be from one to many. Usually the number of subdevice is equal to the number of channels of the controller, the number of its work areas or logical devices.

Subdevice consists of:
* Conditions
* Actions
* Events
* Widgets

Conditions, actions and events are logical elements of the subdevice, on their basis macros and routines are created. Widget is a graphical element, through which the user will control subdevice. Usually one subdevice contains one widget, but the number of conditions, actions and events varies (from zero to many). The number of subdevices in the module can be either fixed or not. For example, you can develop a module only for a 6-channel dimmer, and you can make a module that will request the hardware for the number of subdevices and create the required number of subdevices.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ModuleStruct.png]]</div></div>
</div>
==Creating the module interface ==
The interface part of the midule consists of:
* widgets - interface part of the subdevice, which is located in the rooms and has basic control functions
* Remote - interface part of the module, which has a set of device functions and opens to the full screen, when you click on the widget button
* Authorization window - Authorization is required to work with some devices. To do this, the developer can create a special authorization window that is available in the module settings
* The module settings window is a window where you need to enter the parameters for the module operation
картинка окна настроек модуля и кнопки открытия
The whole graphic part is drawn in the graphical interface of the iRidium studio editor. In contradistinction to i3 pro, the module's interface should be made up of ready-made graphic components located in the gallery.

==== Widget ====

Widget is a visual component of the module, a kind of Popup that will be displayed in the room. The main task of the widget is to display the basic controls of the subdevice and to provide a module transition to the Remote control of the subdevice. For example, to control a media player, you can place a volume slider or Mute button for quick access to adjusting the volume. The weather widget can display the current weather, and the control panel will contain the weather forecast for all 5 days.<br />
The module does not make sense without widget, because it will not have a graphical representation in the i3 lite project.

Widget has a limited size
# Width '''640'''
# Height can not exceed '''1200'''

[[Файл:Пример виджета.png|center|thumb|Рис. Widget example]]

To create a widget, click the Add pop-up button in the Project overview panel and in the appeared menu select popup type: "Widget", set the name and properties:
[[Файл:ПанельПопап.png|thumb|center]]

Properties of a created widget can be changed with the help of '''Object Properties'''.<br />
Graphic items are assigned to channels like in popups:
[[Файл:Связывание_канала_команды_и_графического_элемента.png|center|thumb|Рис. Связывание канала команды и графического элемента]]
Widget will be displayed:
* In the room when a client uses the project
[[Файл:В_комнате_при_использовании_пользователем_проекта.png|center|thumb|]]
* In the module settings when it is added to the project:
[[Файл:И_в_настройках_модуля_при_добавлении_его_в_проект.png ‎|center|thumb|]]
====Remote and other graphic windows====

Remote (a remote control) is a graphical area to control SubDevices. Unlike wigets, it can have free size and position. And it is displayed on call. Remote is displayed when a button to go to the remote control is pressed on a widget.
Items to control equipment are placed on Remote (buttons, lists, switches, levels). There can be from 0 to several remote controls. Example of Remote:<br />
[[Файл:Пульт_управления.png ‎|center|thumb|]]<br />

Remote is created like a Widget. The only difference is to select "Remote" when you click "Add Popup Page" in the "Device Type" property.
==Interface design standard==
For the convenience of interface design, a standard was developed in which graphic windows should be developed in the module so that the modules of different developers looked uniformly within the framework of one project.
===Basic principles===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:GeneralUI.png]]</div></div>
<div class="col-sm-12 col-md-6">
Виджет состоит из «Header» и дополнительных модулей основного функционала. <br/>
«Header» — верхний модуль виджета.<br/>
«Header» содержит:<br/>
- наименование виджета;
- наименование устройства, которым<br/>
управляет виджет;<br/>
- иконка категории устройства.<br/>
<br/>
Дополнительные модули содержат элементы управления устройством.
</div>
</div>
===Module grid and blocks===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka1.png]]</div></div>
<div class="col-sm-12 col-md-6">
Module grid widget is a block 640 pt wide
And 120 pt in height. Each block has a grid of 8x8 pt.
The rounding of the corners is 12.5 ut. (Circle 25)
</div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka2.png]]</div></div>
<div class="col-sm-12 col-md-6">
The principle of constructing a widget block is a constructor from
Controls (buttons, switches, labels) from smaller to larger.
</div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka3.png]]</div></div>
<div class="col-sm-12 col-md-6">
Control items are combined and united in a block, blocks are united into a control panel.
</div>
</div>
===Buttons===
<big>'''Toggle'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Toggle.png]]</div></div>
<div class="col-sm-12 col-md-6">
Кнопка изменения значения «вкл/выкл». Применяется для отправки команды на устройство, вне зависимости от его текущего состояния.
</div>
</div>
<big>'''Switch'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Switch.png]]</div></div>
<div class="col-sm-12 col-md-6">
«On/off» switch. It is used only when the currect device status is known.
</div>
</div>
<big>'''Multistate'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Multistate.png]]</div></div>
<div class="col-sm-12 col-md-6">
Multistate button is used only when the current device status is known.
</div>
</div>
===Arrow-button===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:arrow1.png]]</div></div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:arrow2.png]]</div></div>
</div>
'''Действие кнопки'''<br/>
При нажатии на кнопку происходит вызов «PopUp».<br/>
'''Содержимое «PopUp»'''<br/>
«Input field», «Single selection», «Multiple selection».
===Sliders===
<div class="row">
<div class="col-sm-12 col-md-6">
Standart
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:StandartSlider.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
Value
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ValueSlider.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
Progress
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ProgressSlider.png]]</div></div>
</div>
===Description===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Description.png]]</div></div>
===Icons===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Icons1.png]]</div></div>
All icons are devided by their spheres of use, their main differene is the size.
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Icons2.png]]</div></div>
===«Header» widget===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:WidgetHeader.png]]</div></div>
===Icon location===
<div class="row">
<div class="col-sm-12 col-md-6">
The standard is 128х120 pt
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:FormFactor.png]]</div></div>
</div>
All buttons have two states - active and inactive
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:OFFicon.png]]</div></div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ONicon.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
When the button in inactive the color is always # 848484 or RGB 132
</div>
<div class="col-sm-12 col-md-6">
The state of a button is considered active, when the action received feedback and is short or instant (e.g. «Play» in a media player) or an acrion that is active for a long time and demands another activity to switch off the active state (e.g. «Repeat» in a media player).
</div>
</div>
==Basics of working with scripts==

To design an interface and to add a driver, you are to develop the logics of module work via script. The script part of developing i3 lite modules has a number of special features. Before developing the script part of i3 lite modules, please, read [http://dev.iridiummobile.net/JS_Guide iRidium Pro API] and [[Special:MyLanguage/Developers_API | i3 lite API]]. <br />

A module can contain any number of scripts. There are several types of scripts for modules:
* Driver - script files of this type contain script, responsible for working with a driver
* GUI - script files of this type contain script, responsible for working with graphics
* Common - script files of this type must contain general scripts, such as a set of additional functions or a description of classes of secondary importance
* Setup - a special script file that contains information about module setting, a list of fields that are obligatory to fill in, types of these fields and functions that check the correctness of entered data.

Devision into types is necessary for the module correct work on the server. Only logics and the driver part work on the server, but the server knows nothing about the graphic part. That's why a module developer has to devide scripts into types. The server does not notice files for working with the graphic part. <br />

When modules are developed module names have to be used instead of IR. Thus, a listener looks this way module.AddListener… <br />

Каждый скриптовой файл должен начинаться со слушателя
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_MODULE_START, 0, function(){});
</syntaxhighlight>
Это новый вид события, предназначенный специально для разработки модуля. При разработке модуля следует учитывать что скриптовой файл стал закрыт для других скриптовых файлов. Это хзначить что теперь можно использовать одноименные переменные и названия функций в разных скриптовых файлах и они не будут перезаписываться, но это накладывает ограничение: нельзя получить доступ к функции из другого скриптового файла простым способом. Для получения доступа к функции из другого скриптового файла, следует импортировать скриптовый файл с помощью команды module.Import("FileName.js"). <br />
Example:<br/>
<syntaxhighlight lang="javascript">
//Name_1.js - first js file
this.Text = "Hello, world!"; //Pointer to a text variable
//Name_2.js - second js file
var Text = module.Import("Name_1.js").Text; //Importing an object with a pointer to a text variable from the first js file
IR.Log(Text); //"Hello, world!" //log the text variable
</syntaxhighlight>
==Creating a subdevice==
The basis of every module is subdevices. The task of every module developer is to define how many subdevices a module has and to develop the logics of subdevice work. Each subdevice may contain a widget, a remote control, a set of actions, events and states. All contents of a subdevice have to be indicated when a subdevice is created. Subdevice contents can't be changed during module work. The following command is used to create a subdevice:<br/>
<syntaxhighlight lang="javascript">
module.AddSubDevice(SystemName, [Device], [System], [Type], [Tags], [Name], [Callback]);
</syntaxhighlight>
where<br/>
'''SystemName''' - subdevice system name<br/>
'''Device''' - a driver to which a subdevice will be assigned<br/>
'''System''' - old parameter, "false" is to be used<br/>
'''Type''' - type of smart device. Parameter is under development<br/>
'''Tags''' - Array of virtual tag objects<br/>
'''Name''' - subdevice name that is displayed to the user<br/>
'''Callback function(){do somethings}''' - a function that is on till the IR.EVENT_ADD_SUBDEVICE event happens.<br/>
As a reply the function returns a link to a subdevice, that can be used to address it.<br/>
An example of creating subdevices for HDL Relay devices. The script checks th number of devices in the bus and creates subdevices.<br/>
<syntaxhighlight lang="javascript">
for (var count = 1; count <= COUNT_CHANNEL; count++) {
// Creating a subdevice
l_oSubDevice = module.AddSubDevice("Relay " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_RELAY);
// Creating StatusOnStart command
if (count == 1)
l_oSubDevice.AddChannel("Relay:statusOnStart", [ChannelData]);
var l_sChannelName = "Relay:channel" + count;
// Adding channels
l_oSubDevice.AddChannel(l_sChannelName, [ChannelData]);
l_oSubDevice.AddTag(l_sChannelName, [ChannelData]);
// Add a virtual tag
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_TAG_POWER, true);
};</syntaxhighlight><br/>
Everything that is required can be added to a subdevice this way. An event is activated when a subdevice is created.<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function, [pointer]);
</syntaxhighlight><br/>
A link to a subdevice that was created is sent to a function. Different components can be added to subdevice in this event, such as, actions, events, states, widgets, chanels, tags. For example,<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function(in_oSubDevice){
Creating actions
in_oSubDevice.AddAction("On", false, in_oSubDevice.SystemName + "_Power", lightID + "_1", IR.SUB_DEVICE_COMMAND_POWER_ON);
in_oSubDevice.AddAction("Off", false, in_oSubDevice.SystemName + "_Power", lightID + "_0", IR.SUB_DEVICE_COMMAND_POWER_OFF);
Creating events
in_oSubDevice.AddEvent("On", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "1");
in_oSubDevice.AddEvent("Off", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "0");
Creating states
in_oSubDevice.AddCondition("On", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "1");
in_oSubDevice.AddCondition("Off", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "0");
});</syntaxhighlight><br/>
Thus, a developer can create the required number of subdevices when a module is installed or when new subdevices are added manually.
==Adding a widget to a subdevice==

After an interface is created in the studio and a function to add subdevices is added, create a copy of a widget for each subdevice and assign it to the subdevice. To assign a widget to a subdevice the following method is used.<br/>
<syntaxhighlight lang="javascript">SubDevice.addWidget(in_Widget)</syntaxhighlight><br/>


The input parameter of the method is '''in_Widget''' - an object, a widget, created in the studio beforehand.<br />
The output parameter of the method is '''True''' or '''False''' (successful or not).<br />
For example, we have 3 lamps. Not to create a separate wiget for each lamp, use a ready template and clone it. Here is an example of creating widgets with the help of a code using the existing template .<br />

Clone method allows to clone an existing popup.<br/>
<syntaxhighlight lang="javascript">Module.ClonePopup (in_Popup, in_Name)</syntaxhighlight><br/>
Входные параметры метода:
*'''in_Name''' - имя нового виджета.<br/>
*'''in_Popup''' - ссылка на всплывающее окно.<br/>
Выходным параметром метода является: успешно или нет ('''True''', '''False''').<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function(in_oSubDevice){
var popup = module.GetPopup("Dimmer"); // Calling a widget that we want to clone
// Creating a widget using cloning method
var widget = in_oSubDevice.addWidget(module.ClonePopup(popup, "Dimmer"+ in_oSubDevice.Name));
});</syntaxhighlight><br/>
----
{{i}} Names of new widgets must not be repeated
----
When a complete remote control is opened it is necessary to remmeber that a user will use the module both on a tablet and on a smart phone. The difference betwen the screen sizes makes a developer design 2 types of windows: a version for smart phones and a version for tablets. In addition a method must be added to the script that asks the system about the type of device where a module is launched and open the required window.
<syntaxhighlight lang="javascript">
if (IR.DisplayType == IR.DISPLAY_TYPE_PHONE) { //If a module is opened on a smart phone
var l_oPopupScanner = module.GetPopup("Phone"); //show a popup created for a smart phone
}
else {
var l_oPopupScanner = module.GetPopup("Tablet");//If a module is opened on a tablet, show a popup for a tablet
}
</syntaxhighlight><br/>
==Work with channels and tags==
After creating a subdevice and adding a widget you must add to the subevice channels and tags required for its work. Like in i3 pro version, a driver can be added in the studio or via script. Each subdevice requires a personal set of channels and tags for the selected driver. You may work with the following three components:<br/>
*Channel. The following method is used to create a channel<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddChannel(Name, DataArray)
</syntaxhighlight>where<br/>
'''Name''' - channel name<br/>
'''DataArray''' - data array (specific for every driver)<br/>
*Tag The following method is used to create a tag<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddTag(Name, DataArray)
</syntaxhighlight>where<br/>
'''Name''' - tag name<br/>
'''DataArray''' - data array, specific for every driver<br/>
*Virtual tag. The following method if used to create a virtual tag<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddVirtualTag(Name, Value, [Edit], [smartID], [Hidden])
</syntaxhighlight>where<br/>
'''Name'''- name of a subdevice virtual tag<br/>
'''Value''' - Tag value<br/>
'''Edit''' - Permission to edit a tag<br/>
'''smartID''' - Parameter is under development! Set "false"<br/>
'''Hidden''' - Feature of a hidden tag<br/>
===An example of creating channels and tags when creating a subdevice===
<syntaxhighlight lang="javascript">
l_oSubDevice = module.AddSubDevice("Light " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_DIMMER);

// Adding channel StatusOnStart
if (count == 1)
l_oSubDevice.AddChannel("Dimmer:statusOnStart", [ChannelData]);

// Assigned to the variable name of the channel
var l_sChannelName = "Dimmer:channel" + count;

// Adding channels
l_oSubDevice.AddChannel(l_sChannelName, [ChannelData]);
l_oSubDevice.AddTag(l_sChannelName, [TagData]);

// Adding smart virtual tag
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_COMMAND_POWER, true);
l_oSubDevice.AddVirtualTag("Power On", 0, false, IR.SUB_DEVICE_COMMAND_POWER_ON, true);
l_oSubDevice.AddVirtualTag("Power Off", 0, false, IR.SUB_DEVICE_COMMAND_POWER_OFF, true);
l_oSubDevice.AddVirtualTag("Level", 0, false, IR.SUB_DEVICE_COMMAND_LEVEL, true);
</syntaxhighlight>
==Setting a module in the app==
Modules are stored in iRidium store and can be installed in the app using one of the following ways:<br/>
*With the help of a scanner<br/>
*Manually<br/>
===Developing the Setup file===
The Setup file must be developed for each variant. It's a special script file with fields that are required for module work. These fields can be device IP address, port, city name, etc. To develop a Setup file, create a new script file and select its type - "Setup". Eacn field is a tag and can be accessed from the script, and the input value can be received.
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:СетапБонго.png]]</div></div>
The Setup file consists of 2 parts. Part 1 is the driver settings. The settings must require IP addresses, ports and logins to connect the driver to a device. Part 2 is the module general settings, such as number of outputs, access keys.
To set fields in the Setip file set the following fields in the script:
* Field type - indicate what field must be shown to a user (text field, data array, etc. Detailed description is given in API)
* Field name - name of field that a user sees when setting a module
* Default value - what value must be put by default
* Check function - a function to validate value in the field. A function must be written that checks the correctness of the entered data.
For example,"Setup" script for HDL module looks this way:
<syntaxhighlight lang="javascript">
{
// Data to connect drivers, created in Project Device Panel
Drivers:
[
{
Name: "HDL-BUS Pro Network (UDP)",
Properties:
[
{
Type: "textfield",
Name: "Host",
DefaultValue: "255.255.255.255",
Validation: function(in_sValue) {
var l_aValueHost = in_sValue.split(".");
if (l_aValueHost.length != 4) {
return "Please input correct Host";
} else
if (parseInt(l_aValueHost[0], 10)>=0
&& parseInt(l_aValueHost[0], 10)<=255
&& parseInt(l_aValueHost[1], 10)>=0
&& parseInt(l_aValueHost[1], 10)<=255
&& parseInt(l_aValueHost[2], 10)>=0
&& parseInt(l_aValueHost[2], 10)<=255
&& parseInt(l_aValueHost[3], 10)>=0
&& parseInt(l_aValueHost[3], 10)<=255
)
return 0
else
return "Please input correct Host";
}
},
{
Type: "textfield",
Name: "Port",
DefaultValue: "6000",
Validation: function(in_sValue) {
if(parseInt(in_sValue, 10)>=0)
return 0
else
return "Please input correct Port";
}
}
]
}
],

// General information for the module (driver and generated by script)
Module: [{
Name: "Channels Count",
Validation: function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input Count";
}
},
{
Type: "textfield",
Name : "SubnetID",
Validation : function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input SubnetID";
}
},
{
Type: "textfield",
Name : "DeviceID",
Validation : function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input DeviceID";
}
}

]
}
</syntaxhighlight>
To get data from Setup fields use the following function
<syntaxhighlight lang="javascript">
module.GetProperty("Field name")
</syntaxhighlight>
<br />
Besides standard parameters, any parameters required for module inizialization can be asked. Driver parameters are set in the driver automatically. The other parameters are to be asked and used manually.<br />
An example of work with Setup parameters
<syntaxhighlight lang="javascript">
var COUNT_CHANNEL = parseInt(module.GetProperty("Channel count")); // Getting count channel
var SubNetID = parseInt(module.GetProperty("SubnetID")); // Getting subnet id
var DeviceID = parseInt(module.GetProperty("DeviceID")); // Getting device id
</syntaxhighlight>
===Installing a module manually===
To install a module manually no additional script development is required. A user must go to iRidium store from the app, find a module, download it and enter date in the fields indicated in the Setup file. After it the app installs the module in the system with parameters entered by a user.
===Installing a module with the help of a scanner===
'''Scanner (сканер)''' - это модуль, который анализирует какую-либо шину на подключённые устройства либо ищет устройства в локальной сети. Найденные устройства формируются в список, для выбранного устройства качается модуль и становится доступен в i3 lite. <br/>
Схема работы сканера:
# Сканер загружается из магазина;
# Пользователь вводит параметры сканера (IP, Port и т.д) и эти параметры передаются в скрипт сканера;
# Сканер, обработав введенные параметры, опрашивает шину на устройства или ищет устройства в локальной сети;
# Из полученных устройств формируется список;
# При выборе определенного устройства в списке, сканер передаёт параметры выбранного устройства в модуль.
<br/>
При разработке сканера нужно учесть:
* Параметры сканера, при добавлении из магазина;
* Логику сканера;
* Передачу параметров выбранного устройства в модуль;
* Логику модуля, с учётом переданных от сканера параметров.
<br/>
Процесс разработки сканера ничем не отличается от разработки модуля. Точно также сканеру необходимо нарисовать визуальную часть, создать драйвер и написать скрипт с логикой. Основным отличием является то, что сканер может работать только на панели управления и сканер никогда не будет запущен на сервере, поэтому, при разработке скриптов, нет необходимости разделять скрипты на драйверные и интерфейсные.
<br/>
Также при разработке сканера появляется новая логика работы. Первым делом необходимо сделать модуль для управления устройством, далее надо загрузить модуль в магазин модулей. При загрузке модуля, вы увидите уникальный идентификатор вашего модуля. Когда вы будете разрабатывать сканер, вам необходимо написать скрипт со следующей логикой:
# Создание драйвера
# Поиск оборудования
# Если оборудование найдено, надо определить что это за оборудование
# При помощи команды ModuleSetupFinish (ID модуля, js объект с настройками setup данного модуля)
После этого приложение скачет модуль из магазина модулей и установит его.<br/>
The distinctive feature of developing a scanner is the event that lauches the driver work. When developing a scanner use the following event
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_OPEN_SCANNER, 0, function (){});
</syntaxhighlight>
A scanner must be developed after modules are developed. The developed modules are registered in the store of modules and are given a unique ID. After a scanner finds devices in the local net, the script must download a module for the found equipment by the indicated ID. To download a module use the following function
<syntaxhighlight lang="javascript">
IR.ModuleSetupFinish(StoreID, ModuleData, [Callback])
</syntaxhighlight>
where
* StoreID - module ID in the store of modules
* ModuleData - data required for installing a module (fields in Setup)
* Callback - a function to process errors that happened in the installation process (optional)
An example of a developed scanner for HDL modules. To install any module the following parameters are required: Type,SubNet id, Device id, module name, bus IP address, port.
<syntaxhighlight lang="javascript">
//Example of installing HDL Dimmer with a scanner
var l_nStoreID = 82;
var l_oModuleData = {
Module: {
//Data required for module work
Type: "Dimmer",
SubnetID: 3,
DeviceID: 6
Name: "HDL Dimmer"
}
Drivers: {
//Data for the driver
"HDL-BUS Pro Network (UDP)": {
Host: "255.255.255.255", //installing a host for the driver
Port: "6000" //installing a port for the driver
},
}
}

IR.ModuleSetupFinish(l_nStoreID, l_oModuleData, function(in_error){
if (!in_error){
...
} else {
...
}
});
</syntaxhighlight>
===Adding subdevices manually===
After adding the subdevices via the scanner or Setup, the user may have a need to add other subdevices. To ensure this, module developer has to assign the system variable
<syntaxhighlight lang="javascript">
SettingsPopupName = module.GetPopup('AddSubDevicePopup');
</syntaxhighlight >
You have to assign a window with the results of the scanner operation or a popup in which the user can configure a new subdevice or add this subdevice. This popup should be developed by the developer himself.<br/>
If the popup is assigned to the specified system variable, the user will see a "+" button in the module settings section. This button opens the specified popup
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:AddSubdeviceBtn.png]]</div></div>
</div>
Example of specifying the adding subdevices window. When developing, you need to create an adding window in the tablet resolution and a separate window in the smartphone resolution
<syntaxhighlight lang="javascript">
module.SettingsPopupName = IR.DisplayType != IR.DISPLAY_TYPE_TABLET? module.GetPopup("phone:NoAuthorize").Name: module.GetPopup("NoAuthorize").Name;
</syntaxhighlight >
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:AddSubdeviceWindow.png]]</div></div>
</div>
===Authorization===
To work with certain devices a user's authorization in a third-party system is required. i 3lite app has a special authorization mechanism for this purpose.<br/>
To authorize a user has to enter his access data in a special window. This window is unique for every device and a module developer must create it. A window to enter data is a popup with fields to enter data. The popup is created with the help of standard means of the studio and it may be unassigned to any subdevices. When access data are entered, the script must authorize in a third-party system and close the authorization window. After creating an authorization popup, a developer must call the authorization system variable in the script and assign the created popup in the variable.
<syntaxhighlight lang="javascript">
AuthorizationPopupName = module.GetPopup("AutorisationPopup");
</syntaxhighlight ><br/>
After an authorization popup is assigned to a variable, "Authorize" button appears in the module settings.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:NeedAuthorization1.png]]</div></div>
</div>
When this button is pressed, the app opens the authorization popup, assigned in the script. The next task for a module developer is to display a user's status (Authorized or not). There is a system variable to solve this task.
<syntaxhighlight lang="javascript">
AuthorizationStatus = true;
</syntaxhighlight ><br/>
If a user is authorized in the system, true value is assigned to the variable and the app changes the status of the authorization button into:
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Logout1.png]]</div></div>
</div>
A module devloper must also think about the mechanism of deauthorization. It is done on the authorization popup.<br/>
An example of the authorization script
<syntaxhighlight lang="javascript">
if (module.AuthorizationStatus == false) { //If a user is not authorized
module.AuthorizationPopupName = WindowSettings.Window.Name;//Assigning the authorization popup created earlier
} else if (module.AuthorizationStatus) //If a user is authorized
{
module.AuthorizationPopupName = IR.DisplayType != IR.DISPLAY_TYPE_TABLET? module.GetPopup("phone:deAuth").Name: module.GetPopup("deAuth").Name;//Showing the deauthorization popup
}
</syntaxhighlight ><br/>
Note. Remember to create a separate authorization/deauthorization popup for a smart phone and for a tablet.
===Changing settigns===
В ходе работы с приложением, может возникнуть потребность изменить настройки модуля. Для обеспечения такой возможностью, разработчик модуля должен создать функцию изменения настроек модуля и присвоить ее к системному методу
<syntaxhighlight lang="javascript">
module.ChangeProperties = function (in_oSetup)
{
обработка новых параметров модуля
}
</syntaxhighlight>
При объявлении такой функции, приложение добавит в модуль кнопку редактирования настроек модуля.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ChangeBtn.png]]</div></div>
</div>
Когда пользователь нажмет на данную кнопку, приложение откроет окно Setup, которое использовалось при установке модуля. В этом окне пользователь введет новые настройки и нажмет кнопку "готово". После этого приложение запустить указанную выше функцию. Настройки драйвера приложение сможет изменить самостоятельно, остальные же настройки разработчик модуля дулжен изменить вручную. Новые настройки записываются во входной параметр in_oSetup в виде JSON строки.<br/>
Также в данной функции необходимо обработать успешность изменения настроек. За это отвечает флаг
<syntaxhighlight lang="javascript">
module.FinishUpdateSettings = true;
</syntaxhighlight>
Если установка новых параметров прошла успешно, то надо выставить значение флага true, а обратном случае флаг должен принять значение false. Это позволяет приложению понять что смена параметров не удалась(если статус переменной будет false) и приложение отменит изменение настроек драйвера, вернув старые настройки<br/>
Пример обработки новых настроек модуля
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_MODULE_START, 0, function(){
module.ChangeProperties = function (in_oSetup, in_oModule) {
if (typeof (in_oSetup) == "string")
in_oSetup = JSON.Parse(in_oSetup);
var l_nChannel = in_oSetup.Module["Channel count"];
if (l_nChannel >= COUNT_CHANNEL) {
module.FinishUpdateSettings = true;
// Recreating element on cycle
for (var count = 1; count <= in_nChannel; count++) {

// Creating subDevice
l_oSubDevice = module.AddSubDevice("Relay " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_RELAY);

// Create revers
if (!l_oSubDevice.GetProperty("Reverse"))
l_oSubDevice.SetProperty("Reverse", 0);

// Assigned to the variable name of the channel
var l_sChannelName = "Relay:channel" + count;

// Adding channels
l_oSubDevice.AddChannel(l_sChannelName, Data);
l_oSubDevice.AddTag(l_sChannelName, Data);

// Adding smart virtual tag
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_TAG_POWER, true);
};
}
else {
for (var count = 1; count <= COUNT_CHANNEL; count++)
if (l_nChannel < count) {
var l_oDeleteSubDevice = module.GetSubDevice("Relay " + count);
module.DeleteSubDevice (l_oDeleteSubDevice.ID);
};
};
};
});
</syntaxhighlight>

Translations:DevManual/203/en

2017-04-17T04:55:01Z

Example of specifying the adding subdevices window. When developing, you need to create an adding window in the tablet resolution and a separate window in the smartphone resolution

DevManual/en

2017-04-17T04:48:42Z

Ildar: Новая страница: «If the popup is assigned to the specified system variable, the user will see a "+" button in the module settings section. This button opens the specified popup»

<languages/>
=Module development guide=
==Definitions==

'''Module''' - is a component that allows you to control one type of equipment by its unique ID. The module is located in the store of modules.

'''Control panel (mobile device)''' - is a device from which the project i3 lite is launched (tablet, smartphone).

'''Store of modules''' - is a cloud server for uploading ready-made modules. The module store is available from the i3 lite application or on our[http://www.iridiummobile.ru/store/ site]

'''iRidium Studio''' - is a editor that allows to create the module to control device for i3 lite application. You need to use a special editor build for [http://www.iridiummobile.net/redirects/?go=iRidium_SETUP_LITE module developers] to develop the module

'''i3 lite''' - is an application to create, set and use i3 lite projects.

'''i3 lite project''' – is an automation project made up of ready equipment control modules. i3 lite projects differ from i2 Control projects: i3 lite projects can be edited dynamically without prior editing in iRidium Studio. i3 lite project consists of several small parts that can be put together into a single whole in i3 lite app with the help of the built-in constructor. It can also be easily edited in the app. As a result, a big number of intermediate processes are no longer necessary, such as installing software on PC, uploading projects on contol panels. All is done in one place - a control panel.

'''SubDevice''' - This is a virtual representation of the working area of the physical device. If we take as an example a 6-channel dimmer it has 6 sub-devices, because each independent device requires a separate control interface and connects to one channel.

'''Room (in i3 lite)''' - The visual part of i3 lite containing hardware management widgets. The project in i3 lite consists of rooms located on the floors

'''Widget''' - is a visual module component located in the room. It has limitations in size and fixed position in the room interface. It contains the main module functionality. For additional functions Remote is used.

'''Remote''' - is a visual module component which is hidden by default. It opens only when clicking on the corresponding item of the widget. It does not have size limitations (not more than the panel display size) and can be located in any part of the room interface (it is usually located in the middle of the panel display). It contains additional functionality of the module.

'''Macros''' - is a sequence of commands of various modules, which is activated by pressing. Contains "Action" and "Condition". For example, the macros "turn off all the lights in the house" will send the shutdown command to all devices responsible for lighting.

'''Routine''' - is a sequence of commands of various modules, which is activated automatically when a certain event occurs. Contains "Event", "Action" and "Condition". For example, "turn on the light if the motion sensor is triggered"

'''Event''' - is a routine component that describes the control command and the value range. If the value is sent in the indicated range, the routine is executed. For example, the event "Motion appeared" is activated if the motion sensor is triggered.

'''Action''' - is a component of macros and routines. It describes the control command and value that must be sent to the command. For example, "turn on the light". There are 2 types of Action: Simple Action and Advanced Action.

'''Simple Action''' - Simple Action is used when the command and Action value are known in advance.

'''Advanced Action''' - Advanced Action is used when the command is known but the value is unknown. The value is set dynamically when Action is used in i3 lite (but not when creating in iRidium studio).

'''Condition''' - is a component of macros and scenes. It describes the control command and value range. When a value from the value range is sent Action is executed.

'''Scanner''' - is a software part, that analyzes any bus looking for connected devices. Found connected devices are displayed in a list. Modules for the found devices are downloaded from iRidium store and the devices become available to control in i3 lite.
==Module concept==
The module is an independent subroutine of the i3 lite application which is built in the project and has an independent interface, driver and logic. Modules are developed in the [http://www.iridiummobile.net/redirects/?go=iRidium_SETUP_LITE iRidium Studio] editor and located in the module store [http://www.iridiummobile.ru/store/ iRidium Store]. Integrator downloads the module from the module store for each individual project.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ModuleInScheme.png]]</div></div>
</div>

There are two types of modules:
*Control module - module for hardware control
*Scanner - module for searching hardware in the local network and loading modules for found devices
== How to start developing the module ==
----

{{i}} Before starting your work, it is recommended to read [http://dev.iridiummobile.net/How_to_begin iRidium documentation]. It describes the basics of working with iRidium. The i3 lite documentation describes how to develop modules for the i3 lite platform for users, who already know iRidium. If you want to write script use [[Special:MyLanguage/Developers_API | i3 lite API]].
----

The module life cycle consists of:
* Developing the graphic part in iRidium studio
* Developing the driver part (scripts, devices)
* Testing
* Publishing in iRidium store
* Using (module download via the i3 lite application from the cloud and adding to automation projects)
<br/>
==Module structure ==
Each module must consist of subdevices. The subdevice is a virtual representation of the working area of a physical device. Many devices support multiple workgroups with the same functionality. Each workgroup may be in a separate zone. To fully control the zone, you need to create a subdevice for each workgroup of the device. For example, a 6-channel HDL dimmer contains 6 dimmable channels, through which 6 working groups can be controlled. Therefore, it is advisable to select in the module 6 subdevices for the possibility of creating actions, events and conditions for each workgroup separately. The presence of subdevice in the i3 lite module is obligatory. The number of sub-devices can be from one to many. Usually the number of subdevice is equal to the number of channels of the controller, the number of its work areas or logical devices.

Subdevice consists of:
* Conditions
* Actions
* Events
* Widgets

Conditions, actions and events are logical elements of the subdevice, on their basis macros and routines are created. Widget is a graphical element, through which the user will control subdevice. Usually one subdevice contains one widget, but the number of conditions, actions and events varies (from zero to many). The number of subdevices in the module can be either fixed or not. For example, you can develop a module only for a 6-channel dimmer, and you can make a module that will request the hardware for the number of subdevices and create the required number of subdevices.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ModuleStruct.png]]</div></div>
</div>
==Creating the module interface ==
The interface part of the midule consists of:
* widgets - interface part of the subdevice, which is located in the rooms and has basic control functions
* Remote - interface part of the module, which has a set of device functions and opens to the full screen, when you click on the widget button
* Authorization window - Authorization is required to work with some devices. To do this, the developer can create a special authorization window that is available in the module settings
* The module settings window is a window where you need to enter the parameters for the module operation
картинка окна настроек модуля и кнопки открытия
The whole graphic part is drawn in the graphical interface of the iRidium studio editor. In contradistinction to i3 pro, the module's interface should be made up of ready-made graphic components located in the gallery.

==== Widget ====

Widget is a visual component of the module, a kind of Popup that will be displayed in the room. The main task of the widget is to display the basic controls of the subdevice and to provide a module transition to the Remote control of the subdevice. For example, to control a media player, you can place a volume slider or Mute button for quick access to adjusting the volume. The weather widget can display the current weather, and the control panel will contain the weather forecast for all 5 days.<br />
The module does not make sense without widget, because it will not have a graphical representation in the i3 lite project.

Widget has a limited size
# Width '''640'''
# Height can not exceed '''1200'''

[[Файл:Пример виджета.png|center|thumb|Рис. Widget example]]

To create a widget, click the Add pop-up button in the Project overview panel and in the appeared menu select popup type: "Widget", set the name and properties:
[[Файл:ПанельПопап.png|thumb|center]]

Properties of a created widget can be changed with the help of '''Object Properties'''.<br />
Graphic items are assigned to channels like in popups:
[[Файл:Связывание_канала_команды_и_графического_элемента.png|center|thumb|Рис. Связывание канала команды и графического элемента]]
Widget will be displayed:
* In the room when a client uses the project
[[Файл:В_комнате_при_использовании_пользователем_проекта.png|center|thumb|]]
* In the module settings when it is added to the project:
[[Файл:И_в_настройках_модуля_при_добавлении_его_в_проект.png ‎|center|thumb|]]
====Remote and other graphic windows====

Remote (a remote control) is a graphical area to control SubDevices. Unlike wigets, it can have free size and position. And it is displayed on call. Remote is displayed when a button to go to the remote control is pressed on a widget.
Items to control equipment are placed on Remote (buttons, lists, switches, levels). There can be from 0 to several remote controls. Example of Remote:<br />
[[Файл:Пульт_управления.png ‎|center|thumb|]]<br />

Remote is created like a Widget. The only difference is to select "Remote" when you click "Add Popup Page" in the "Device Type" property.
==Interface design standard==
For the convenience of interface design, a standard was developed in which graphic windows should be developed in the module so that the modules of different developers looked uniformly within the framework of one project.
===Basic principles===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:GeneralUI.png]]</div></div>
<div class="col-sm-12 col-md-6">
Виджет состоит из «Header» и дополнительных модулей основного функционала. <br/>
«Header» — верхний модуль виджета.<br/>
«Header» содержит:<br/>
- наименование виджета;
- наименование устройства, которым<br/>
управляет виджет;<br/>
- иконка категории устройства.<br/>
<br/>
Дополнительные модули содержат элементы управления устройством.
</div>
</div>
===Module grid and blocks===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka1.png]]</div></div>
<div class="col-sm-12 col-md-6">
Module grid widget is a block 640 pt wide
And 120 pt in height. Each block has a grid of 8x8 pt.
The rounding of the corners is 12.5 ut. (Circle 25)
</div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka2.png]]</div></div>
<div class="col-sm-12 col-md-6">
The principle of constructing a widget block is a constructor from
Controls (buttons, switches, labels) from smaller to larger.
</div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka3.png]]</div></div>
<div class="col-sm-12 col-md-6">
Control items are combined and united in a block, blocks are united into a control panel.
</div>
</div>
===Buttons===
<big>'''Toggle'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Toggle.png]]</div></div>
<div class="col-sm-12 col-md-6">
Кнопка изменения значения «вкл/выкл». Применяется для отправки команды на устройство, вне зависимости от его текущего состояния.
</div>
</div>
<big>'''Switch'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Switch.png]]</div></div>
<div class="col-sm-12 col-md-6">
«On/off» switch. It is used only when the currect device status is known.
</div>
</div>
<big>'''Multistate'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Multistate.png]]</div></div>
<div class="col-sm-12 col-md-6">
Multistate button is used only when the current device status is known.
</div>
</div>
===Arrow-button===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:arrow1.png]]</div></div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:arrow2.png]]</div></div>
</div>
'''Действие кнопки'''<br/>
При нажатии на кнопку происходит вызов «PopUp».<br/>
'''Содержимое «PopUp»'''<br/>
«Input field», «Single selection», «Multiple selection».
===Sliders===
<div class="row">
<div class="col-sm-12 col-md-6">
Standart
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:StandartSlider.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
Value
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ValueSlider.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
Progress
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ProgressSlider.png]]</div></div>
</div>
===Description===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Description.png]]</div></div>
===Icons===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Icons1.png]]</div></div>
All icons are devided by their spheres of use, their main differene is the size.
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Icons2.png]]</div></div>
===«Header» widget===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:WidgetHeader.png]]</div></div>
===Icon location===
<div class="row">
<div class="col-sm-12 col-md-6">
The standard is 128х120 pt
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:FormFactor.png]]</div></div>
</div>
All buttons have two states - active and inactive
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:OFFicon.png]]</div></div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ONicon.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
When the button in inactive the color is always # 848484 or RGB 132
</div>
<div class="col-sm-12 col-md-6">
The state of a button is considered active, when the action received feedback and is short or instant (e.g. «Play» in a media player) or an acrion that is active for a long time and demands another activity to switch off the active state (e.g. «Repeat» in a media player).
</div>
</div>
==Basics of working with scripts==

To design an interface and to add a driver, you are to develop the logics of module work via script. The script part of developing i3 lite modules has a number of special features. Before developing the script part of i3 lite modules, please, read [http://dev.iridiummobile.net/JS_Guide iRidium Pro API] and [[Special:MyLanguage/Developers_API | i3 lite API]]. <br />

A module can contain any number of scripts. There are several types of scripts for modules:
* Driver - script files of this type contain script, responsible for working with a driver
* GUI - script files of this type contain script, responsible for working with graphics
* Common - script files of this type must contain general scripts, such as a set of additional functions or a description of classes of secondary importance
* Setup - a special script file that contains information about module setting, a list of fields that are obligatory to fill in, types of these fields and functions that check the correctness of entered data.

Devision into types is necessary for the module correct work on the server. Only logics and the driver part work on the server, but the server knows nothing about the graphic part. That's why a module developer has to devide scripts into types. The server does not notice files for working with the graphic part. <br />

When modules are developed module names have to be used instead of IR. Thus, a listener looks this way module.AddListener… <br />

Каждый скриптовой файл должен начинаться со слушателя
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_MODULE_START, 0, function(){});
</syntaxhighlight>
Это новый вид события, предназначенный специально для разработки модуля. При разработке модуля следует учитывать что скриптовой файл стал закрыт для других скриптовых файлов. Это хзначить что теперь можно использовать одноименные переменные и названия функций в разных скриптовых файлах и они не будут перезаписываться, но это накладывает ограничение: нельзя получить доступ к функции из другого скриптового файла простым способом. Для получения доступа к функции из другого скриптового файла, следует импортировать скриптовый файл с помощью команды module.Import("FileName.js"). <br />
Example:<br/>
<syntaxhighlight lang="javascript">
//Name_1.js - first js file
this.Text = "Hello, world!"; //Pointer to a text variable
//Name_2.js - second js file
var Text = module.Import("Name_1.js").Text; //Importing an object with a pointer to a text variable from the first js file
IR.Log(Text); //"Hello, world!" //log the text variable
</syntaxhighlight>
==Creating a subdevice==
The basis of every module is subdevices. The task of every module developer is to define how many subdevices a module has and to develop the logics of subdevice work. Each subdevice may contain a widget, a remote control, a set of actions, events and states. All contents of a subdevice have to be indicated when a subdevice is created. Subdevice contents can't be changed during module work. The following command is used to create a subdevice:<br/>
<syntaxhighlight lang="javascript">
module.AddSubDevice(SystemName, [Device], [System], [Type], [Tags], [Name], [Callback]);
</syntaxhighlight>
where<br/>
'''SystemName''' - subdevice system name<br/>
'''Device''' - a driver to which a subdevice will be assigned<br/>
'''System''' - old parameter, "false" is to be used<br/>
'''Type''' - type of smart device. Parameter is under development<br/>
'''Tags''' - Array of virtual tag objects<br/>
'''Name''' - subdevice name that is displayed to the user<br/>
'''Callback function(){do somethings}''' - a function that is on till the IR.EVENT_ADD_SUBDEVICE event happens.<br/>
As a reply the function returns a link to a subdevice, that can be used to address it.<br/>
An example of creating subdevices for HDL Relay devices. The script checks th number of devices in the bus and creates subdevices.<br/>
<syntaxhighlight lang="javascript">
for (var count = 1; count <= COUNT_CHANNEL; count++) {
// Creating a subdevice
l_oSubDevice = module.AddSubDevice("Relay " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_RELAY);
// Creating StatusOnStart command
if (count == 1)
l_oSubDevice.AddChannel("Relay:statusOnStart", [ChannelData]);
var l_sChannelName = "Relay:channel" + count;
// Adding channels
l_oSubDevice.AddChannel(l_sChannelName, [ChannelData]);
l_oSubDevice.AddTag(l_sChannelName, [ChannelData]);
// Add a virtual tag
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_TAG_POWER, true);
};</syntaxhighlight><br/>
Everything that is required can be added to a subdevice this way. An event is activated when a subdevice is created.<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function, [pointer]);
</syntaxhighlight><br/>
A link to a subdevice that was created is sent to a function. Different components can be added to subdevice in this event, such as, actions, events, states, widgets, chanels, tags. For example,<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function(in_oSubDevice){
Creating actions
in_oSubDevice.AddAction("On", false, in_oSubDevice.SystemName + "_Power", lightID + "_1", IR.SUB_DEVICE_COMMAND_POWER_ON);
in_oSubDevice.AddAction("Off", false, in_oSubDevice.SystemName + "_Power", lightID + "_0", IR.SUB_DEVICE_COMMAND_POWER_OFF);
Creating events
in_oSubDevice.AddEvent("On", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "1");
in_oSubDevice.AddEvent("Off", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "0");
Creating states
in_oSubDevice.AddCondition("On", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "1");
in_oSubDevice.AddCondition("Off", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "0");
});</syntaxhighlight><br/>
Thus, a developer can create the required number of subdevices when a module is installed or when new subdevices are added manually.
==Adding a widget to a subdevice==

After an interface is created in the studio and a function to add subdevices is added, create a copy of a widget for each subdevice and assign it to the subdevice. To assign a widget to a subdevice the following method is used.<br/>
<syntaxhighlight lang="javascript">SubDevice.addWidget(in_Widget)</syntaxhighlight><br/>


The input parameter of the method is '''in_Widget''' - an object, a widget, created in the studio beforehand.<br />
The output parameter of the method is '''True''' or '''False''' (successful or not).<br />
For example, we have 3 lamps. Not to create a separate wiget for each lamp, use a ready template and clone it. Here is an example of creating widgets with the help of a code using the existing template .<br />

Clone method allows to clone an existing popup.<br/>
<syntaxhighlight lang="javascript">Module.ClonePopup (in_Popup, in_Name)</syntaxhighlight><br/>
Входные параметры метода:
*'''in_Name''' - имя нового виджета.<br/>
*'''in_Popup''' - ссылка на всплывающее окно.<br/>
Выходным параметром метода является: успешно или нет ('''True''', '''False''').<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function(in_oSubDevice){
var popup = module.GetPopup("Dimmer"); // Calling a widget that we want to clone
// Creating a widget using cloning method
var widget = in_oSubDevice.addWidget(module.ClonePopup(popup, "Dimmer"+ in_oSubDevice.Name));
});</syntaxhighlight><br/>
----
{{i}} Names of new widgets must not be repeated
----
When a complete remote control is opened it is necessary to remmeber that a user will use the module both on a tablet and on a smart phone. The difference betwen the screen sizes makes a developer design 2 types of windows: a version for smart phones and a version for tablets. In addition a method must be added to the script that asks the system about the type of device where a module is launched and open the required window.
<syntaxhighlight lang="javascript">
if (IR.DisplayType == IR.DISPLAY_TYPE_PHONE) { //If a module is opened on a smart phone
var l_oPopupScanner = module.GetPopup("Phone"); //show a popup created for a smart phone
}
else {
var l_oPopupScanner = module.GetPopup("Tablet");//If a module is opened on a tablet, show a popup for a tablet
}
</syntaxhighlight><br/>
==Work with channels and tags==
After creating a subdevice and adding a widget you must add to the subevice channels and tags required for its work. Like in i3 pro version, a driver can be added in the studio or via script. Each subdevice requires a personal set of channels and tags for the selected driver. You may work with the following three components:<br/>
*Channel. The following method is used to create a channel<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddChannel(Name, DataArray)
</syntaxhighlight>where<br/>
'''Name''' - channel name<br/>
'''DataArray''' - data array (specific for every driver)<br/>
*Tag The following method is used to create a tag<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddTag(Name, DataArray)
</syntaxhighlight>where<br/>
'''Name''' - tag name<br/>
'''DataArray''' - data array, specific for every driver<br/>
*Virtual tag. The following method if used to create a virtual tag<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddVirtualTag(Name, Value, [Edit], [smartID], [Hidden])
</syntaxhighlight>where<br/>
'''Name'''- name of a subdevice virtual tag<br/>
'''Value''' - Tag value<br/>
'''Edit''' - Permission to edit a tag<br/>
'''smartID''' - Parameter is under development! Set "false"<br/>
'''Hidden''' - Feature of a hidden tag<br/>
===An example of creating channels and tags when creating a subdevice===
<syntaxhighlight lang="javascript">
l_oSubDevice = module.AddSubDevice("Light " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_DIMMER);

// Adding channel StatusOnStart
if (count == 1)
l_oSubDevice.AddChannel("Dimmer:statusOnStart", [ChannelData]);

// Assigned to the variable name of the channel
var l_sChannelName = "Dimmer:channel" + count;

// Adding channels
l_oSubDevice.AddChannel(l_sChannelName, [ChannelData]);
l_oSubDevice.AddTag(l_sChannelName, [TagData]);

// Adding smart virtual tag
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_COMMAND_POWER, true);
l_oSubDevice.AddVirtualTag("Power On", 0, false, IR.SUB_DEVICE_COMMAND_POWER_ON, true);
l_oSubDevice.AddVirtualTag("Power Off", 0, false, IR.SUB_DEVICE_COMMAND_POWER_OFF, true);
l_oSubDevice.AddVirtualTag("Level", 0, false, IR.SUB_DEVICE_COMMAND_LEVEL, true);
</syntaxhighlight>
==Setting a module in the app==
Modules are stored in iRidium store and can be installed in the app using one of the following ways:<br/>
*With the help of a scanner<br/>
*Manually<br/>
===Developing the Setup file===
The Setup file must be developed for each variant. It's a special script file with fields that are required for module work. These fields can be device IP address, port, city name, etc. To develop a Setup file, create a new script file and select its type - "Setup". Eacn field is a tag and can be accessed from the script, and the input value can be received.
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:СетапБонго.png]]</div></div>
The Setup file consists of 2 parts. Part 1 is the driver settings. The settings must require IP addresses, ports and logins to connect the driver to a device. Part 2 is the module general settings, such as number of outputs, access keys.
To set fields in the Setip file set the following fields in the script:
* Field type - indicate what field must be shown to a user (text field, data array, etc. Detailed description is given in API)
* Field name - name of field that a user sees when setting a module
* Default value - what value must be put by default
* Check function - a function to validate value in the field. A function must be written that checks the correctness of the entered data.
For example,"Setup" script for HDL module looks this way:
<syntaxhighlight lang="javascript">
{
// Data to connect drivers, created in Project Device Panel
Drivers:
[
{
Name: "HDL-BUS Pro Network (UDP)",
Properties:
[
{
Type: "textfield",
Name: "Host",
DefaultValue: "255.255.255.255",
Validation: function(in_sValue) {
var l_aValueHost = in_sValue.split(".");
if (l_aValueHost.length != 4) {
return "Please input correct Host";
} else
if (parseInt(l_aValueHost[0], 10)>=0
&& parseInt(l_aValueHost[0], 10)<=255
&& parseInt(l_aValueHost[1], 10)>=0
&& parseInt(l_aValueHost[1], 10)<=255
&& parseInt(l_aValueHost[2], 10)>=0
&& parseInt(l_aValueHost[2], 10)<=255
&& parseInt(l_aValueHost[3], 10)>=0
&& parseInt(l_aValueHost[3], 10)<=255
)
return 0
else
return "Please input correct Host";
}
},
{
Type: "textfield",
Name: "Port",
DefaultValue: "6000",
Validation: function(in_sValue) {
if(parseInt(in_sValue, 10)>=0)
return 0
else
return "Please input correct Port";
}
}
]
}
],

// General information for the module (driver and generated by script)
Module: [{
Name: "Channels Count",
Validation: function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input Count";
}
},
{
Type: "textfield",
Name : "SubnetID",
Validation : function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input SubnetID";
}
},
{
Type: "textfield",
Name : "DeviceID",
Validation : function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input DeviceID";
}
}

]
}
</syntaxhighlight>
To get data from Setup fields use the following function
<syntaxhighlight lang="javascript">
module.GetProperty("Field name")
</syntaxhighlight>
<br />
Besides standard parameters, any parameters required for module inizialization can be asked. Driver parameters are set in the driver automatically. The other parameters are to be asked and used manually.<br />
An example of work with Setup parameters
<syntaxhighlight lang="javascript">
var COUNT_CHANNEL = parseInt(module.GetProperty("Channel count")); // Getting count channel
var SubNetID = parseInt(module.GetProperty("SubnetID")); // Getting subnet id
var DeviceID = parseInt(module.GetProperty("DeviceID")); // Getting device id
</syntaxhighlight>
===Installing a module manually===
To install a module manually no additional script development is required. A user must go to iRidium store from the app, find a module, download it and enter date in the fields indicated in the Setup file. After it the app installs the module in the system with parameters entered by a user.
===Installing a module with the help of a scanner===
'''Scanner (сканер)''' - это модуль, который анализирует какую-либо шину на подключённые устройства либо ищет устройства в локальной сети. Найденные устройства формируются в список, для выбранного устройства качается модуль и становится доступен в i3 lite. <br/>
Схема работы сканера:
# Сканер загружается из магазина;
# Пользователь вводит параметры сканера (IP, Port и т.д) и эти параметры передаются в скрипт сканера;
# Сканер, обработав введенные параметры, опрашивает шину на устройства или ищет устройства в локальной сети;
# Из полученных устройств формируется список;
# При выборе определенного устройства в списке, сканер передаёт параметры выбранного устройства в модуль.
<br/>
При разработке сканера нужно учесть:
* Параметры сканера, при добавлении из магазина;
* Логику сканера;
* Передачу параметров выбранного устройства в модуль;
* Логику модуля, с учётом переданных от сканера параметров.
<br/>
Процесс разработки сканера ничем не отличается от разработки модуля. Точно также сканеру необходимо нарисовать визуальную часть, создать драйвер и написать скрипт с логикой. Основным отличием является то, что сканер может работать только на панели управления и сканер никогда не будет запущен на сервере, поэтому, при разработке скриптов, нет необходимости разделять скрипты на драйверные и интерфейсные.
<br/>
Также при разработке сканера появляется новая логика работы. Первым делом необходимо сделать модуль для управления устройством, далее надо загрузить модуль в магазин модулей. При загрузке модуля, вы увидите уникальный идентификатор вашего модуля. Когда вы будете разрабатывать сканер, вам необходимо написать скрипт со следующей логикой:
# Создание драйвера
# Поиск оборудования
# Если оборудование найдено, надо определить что это за оборудование
# При помощи команды ModuleSetupFinish (ID модуля, js объект с настройками setup данного модуля)
После этого приложение скачет модуль из магазина модулей и установит его.<br/>
The distinctive feature of developing a scanner is the event that lauches the driver work. When developing a scanner use the following event
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_OPEN_SCANNER, 0, function (){});
</syntaxhighlight>
A scanner must be developed after modules are developed. The developed modules are registered in the store of modules and are given a unique ID. After a scanner finds devices in the local net, the script must download a module for the found equipment by the indicated ID. To download a module use the following function
<syntaxhighlight lang="javascript">
IR.ModuleSetupFinish(StoreID, ModuleData, [Callback])
</syntaxhighlight>
where
* StoreID - module ID in the store of modules
* ModuleData - data required for installing a module (fields in Setup)
* Callback - a function to process errors that happened in the installation process (optional)
An example of a developed scanner for HDL modules. To install any module the following parameters are required: Type,SubNet id, Device id, module name, bus IP address, port.
<syntaxhighlight lang="javascript">
//Example of installing HDL Dimmer with a scanner
var l_nStoreID = 82;
var l_oModuleData = {
Module: {
//Data required for module work
Type: "Dimmer",
SubnetID: 3,
DeviceID: 6
Name: "HDL Dimmer"
}
Drivers: {
//Data for the driver
"HDL-BUS Pro Network (UDP)": {
Host: "255.255.255.255", //installing a host for the driver
Port: "6000" //installing a port for the driver
},
}
}

IR.ModuleSetupFinish(l_nStoreID, l_oModuleData, function(in_error){
if (!in_error){
...
} else {
...
}
});
</syntaxhighlight>
===Adding subdevices manually===
After adding the subdevices via the scanner or Setup, the user may have a need to add other subdevices. To ensure this, module developer has to assign the system variable
<syntaxhighlight lang="javascript">
SettingsPopupName = module.GetPopup('AddSubDevicePopup');
</syntaxhighlight >
You have to assign a window with the results of the scanner operation or a popup in which the user can configure a new subdevice or add this subdevice. This popup should be developed by the developer himself.<br/>
If the popup is assigned to the specified system variable, the user will see a "+" button in the module settings section. This button opens the specified popup
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:AddSubdeviceBtn.png]]</div></div>
</div>
Пример указания окна добавления подустройств. При разработке, надо создавать окно добавления в разрешении планшета и отдельно окно в разрешении смартфона
<syntaxhighlight lang="javascript">
module.SettingsPopupName = IR.DisplayType != IR.DISPLAY_TYPE_TABLET? module.GetPopup("phone:NoAuthorize").Name: module.GetPopup("NoAuthorize").Name;
</syntaxhighlight >
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:AddSubdeviceWindow.png]]</div></div>
</div>
===Authorization===
To work with certain devices a user's authorization in a third-party system is required. i 3lite app has a special authorization mechanism for this purpose.<br/>
To authorize a user has to enter his access data in a special window. This window is unique for every device and a module developer must create it. A window to enter data is a popup with fields to enter data. The popup is created with the help of standard means of the studio and it may be unassigned to any subdevices. When access data are entered, the script must authorize in a third-party system and close the authorization window. After creating an authorization popup, a developer must call the authorization system variable in the script and assign the created popup in the variable.
<syntaxhighlight lang="javascript">
AuthorizationPopupName = module.GetPopup("AutorisationPopup");
</syntaxhighlight ><br/>
After an authorization popup is assigned to a variable, "Authorize" button appears in the module settings.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:NeedAuthorization1.png]]</div></div>
</div>
When this button is pressed, the app opens the authorization popup, assigned in the script. The next task for a module developer is to display a user's status (Authorized or not). There is a system variable to solve this task.
<syntaxhighlight lang="javascript">
AuthorizationStatus = true;
</syntaxhighlight ><br/>
If a user is authorized in the system, true value is assigned to the variable and the app changes the status of the authorization button into:
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Logout1.png]]</div></div>
</div>
A module devloper must also think about the mechanism of deauthorization. It is done on the authorization popup.<br/>
An example of the authorization script
<syntaxhighlight lang="javascript">
if (module.AuthorizationStatus == false) { //If a user is not authorized
module.AuthorizationPopupName = WindowSettings.Window.Name;//Assigning the authorization popup created earlier
} else if (module.AuthorizationStatus) //If a user is authorized
{
module.AuthorizationPopupName = IR.DisplayType != IR.DISPLAY_TYPE_TABLET? module.GetPopup("phone:deAuth").Name: module.GetPopup("deAuth").Name;//Showing the deauthorization popup
}
</syntaxhighlight ><br/>
Note. Remember to create a separate authorization/deauthorization popup for a smart phone and for a tablet.
===Changing settigns===
В ходе работы с приложением, может возникнуть потребность изменить настройки модуля. Для обеспечения такой возможностью, разработчик модуля должен создать функцию изменения настроек модуля и присвоить ее к системному методу
<syntaxhighlight lang="javascript">
module.ChangeProperties = function (in_oSetup)
{
обработка новых параметров модуля
}
</syntaxhighlight>
При объявлении такой функции, приложение добавит в модуль кнопку редактирования настроек модуля.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ChangeBtn.png]]</div></div>
</div>
Когда пользователь нажмет на данную кнопку, приложение откроет окно Setup, которое использовалось при установке модуля. В этом окне пользователь введет новые настройки и нажмет кнопку "готово". После этого приложение запустить указанную выше функцию. Настройки драйвера приложение сможет изменить самостоятельно, остальные же настройки разработчик модуля дулжен изменить вручную. Новые настройки записываются во входной параметр in_oSetup в виде JSON строки.<br/>
Также в данной функции необходимо обработать успешность изменения настроек. За это отвечает флаг
<syntaxhighlight lang="javascript">
module.FinishUpdateSettings = true;
</syntaxhighlight>
Если установка новых параметров прошла успешно, то надо выставить значение флага true, а обратном случае флаг должен принять значение false. Это позволяет приложению понять что смена параметров не удалась(если статус переменной будет false) и приложение отменит изменение настроек драйвера, вернув старые настройки<br/>
Пример обработки новых настроек модуля
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_MODULE_START, 0, function(){
module.ChangeProperties = function (in_oSetup, in_oModule) {
if (typeof (in_oSetup) == "string")
in_oSetup = JSON.Parse(in_oSetup);
var l_nChannel = in_oSetup.Module["Channel count"];
if (l_nChannel >= COUNT_CHANNEL) {
module.FinishUpdateSettings = true;
// Recreating element on cycle
for (var count = 1; count <= in_nChannel; count++) {

// Creating subDevice
l_oSubDevice = module.AddSubDevice("Relay " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_RELAY);

// Create revers
if (!l_oSubDevice.GetProperty("Reverse"))
l_oSubDevice.SetProperty("Reverse", 0);

// Assigned to the variable name of the channel
var l_sChannelName = "Relay:channel" + count;

// Adding channels
l_oSubDevice.AddChannel(l_sChannelName, Data);
l_oSubDevice.AddTag(l_sChannelName, Data);

// Adding smart virtual tag
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_TAG_POWER, true);
};
}
else {
for (var count = 1; count <= COUNT_CHANNEL; count++)
if (l_nChannel < count) {
var l_oDeleteSubDevice = module.GetSubDevice("Relay " + count);
module.DeleteSubDevice (l_oDeleteSubDevice.ID);
};
};
};
});
</syntaxhighlight>

Translations:DevManual/202/en

2017-04-17T04:48:41Z

Ildar: Новая страница: «If the popup is assigned to the specified system variable, the user will see a "+" button in the module settings section. This button opens the specified popup»

If the popup is assigned to the specified system variable, the user will see a "+" button in the module settings section. This button opens the specified popup

DevManual/en

2017-04-17T04:44:57Z

Ildar: Новая страница: «You have to assign a window with the results of the scanner operation or a popup in which the user can configure a new subdevice or add this subdevice. This popup…»

<languages/>
=Module development guide=
==Definitions==

'''Module''' - is a component that allows you to control one type of equipment by its unique ID. The module is located in the store of modules.

'''Control panel (mobile device)''' - is a device from which the project i3 lite is launched (tablet, smartphone).

'''Store of modules''' - is a cloud server for uploading ready-made modules. The module store is available from the i3 lite application or on our[http://www.iridiummobile.ru/store/ site]

'''iRidium Studio''' - is a editor that allows to create the module to control device for i3 lite application. You need to use a special editor build for [http://www.iridiummobile.net/redirects/?go=iRidium_SETUP_LITE module developers] to develop the module

'''i3 lite''' - is an application to create, set and use i3 lite projects.

'''i3 lite project''' – is an automation project made up of ready equipment control modules. i3 lite projects differ from i2 Control projects: i3 lite projects can be edited dynamically without prior editing in iRidium Studio. i3 lite project consists of several small parts that can be put together into a single whole in i3 lite app with the help of the built-in constructor. It can also be easily edited in the app. As a result, a big number of intermediate processes are no longer necessary, such as installing software on PC, uploading projects on contol panels. All is done in one place - a control panel.

'''SubDevice''' - This is a virtual representation of the working area of the physical device. If we take as an example a 6-channel dimmer it has 6 sub-devices, because each independent device requires a separate control interface and connects to one channel.

'''Room (in i3 lite)''' - The visual part of i3 lite containing hardware management widgets. The project in i3 lite consists of rooms located on the floors

'''Widget''' - is a visual module component located in the room. It has limitations in size and fixed position in the room interface. It contains the main module functionality. For additional functions Remote is used.

'''Remote''' - is a visual module component which is hidden by default. It opens only when clicking on the corresponding item of the widget. It does not have size limitations (not more than the panel display size) and can be located in any part of the room interface (it is usually located in the middle of the panel display). It contains additional functionality of the module.

'''Macros''' - is a sequence of commands of various modules, which is activated by pressing. Contains "Action" and "Condition". For example, the macros "turn off all the lights in the house" will send the shutdown command to all devices responsible for lighting.

'''Routine''' - is a sequence of commands of various modules, which is activated automatically when a certain event occurs. Contains "Event", "Action" and "Condition". For example, "turn on the light if the motion sensor is triggered"

'''Event''' - is a routine component that describes the control command and the value range. If the value is sent in the indicated range, the routine is executed. For example, the event "Motion appeared" is activated if the motion sensor is triggered.

'''Action''' - is a component of macros and routines. It describes the control command and value that must be sent to the command. For example, "turn on the light". There are 2 types of Action: Simple Action and Advanced Action.

'''Simple Action''' - Simple Action is used when the command and Action value are known in advance.

'''Advanced Action''' - Advanced Action is used when the command is known but the value is unknown. The value is set dynamically when Action is used in i3 lite (but not when creating in iRidium studio).

'''Condition''' - is a component of macros and scenes. It describes the control command and value range. When a value from the value range is sent Action is executed.

'''Scanner''' - is a software part, that analyzes any bus looking for connected devices. Found connected devices are displayed in a list. Modules for the found devices are downloaded from iRidium store and the devices become available to control in i3 lite.
==Module concept==
The module is an independent subroutine of the i3 lite application which is built in the project and has an independent interface, driver and logic. Modules are developed in the [http://www.iridiummobile.net/redirects/?go=iRidium_SETUP_LITE iRidium Studio] editor and located in the module store [http://www.iridiummobile.ru/store/ iRidium Store]. Integrator downloads the module from the module store for each individual project.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ModuleInScheme.png]]</div></div>
</div>

There are two types of modules:
*Control module - module for hardware control
*Scanner - module for searching hardware in the local network and loading modules for found devices
== How to start developing the module ==
----

{{i}} Before starting your work, it is recommended to read [http://dev.iridiummobile.net/How_to_begin iRidium documentation]. It describes the basics of working with iRidium. The i3 lite documentation describes how to develop modules for the i3 lite platform for users, who already know iRidium. If you want to write script use [[Special:MyLanguage/Developers_API | i3 lite API]].
----

The module life cycle consists of:
* Developing the graphic part in iRidium studio
* Developing the driver part (scripts, devices)
* Testing
* Publishing in iRidium store
* Using (module download via the i3 lite application from the cloud and adding to automation projects)
<br/>
==Module structure ==
Each module must consist of subdevices. The subdevice is a virtual representation of the working area of a physical device. Many devices support multiple workgroups with the same functionality. Each workgroup may be in a separate zone. To fully control the zone, you need to create a subdevice for each workgroup of the device. For example, a 6-channel HDL dimmer contains 6 dimmable channels, through which 6 working groups can be controlled. Therefore, it is advisable to select in the module 6 subdevices for the possibility of creating actions, events and conditions for each workgroup separately. The presence of subdevice in the i3 lite module is obligatory. The number of sub-devices can be from one to many. Usually the number of subdevice is equal to the number of channels of the controller, the number of its work areas or logical devices.

Subdevice consists of:
* Conditions
* Actions
* Events
* Widgets

Conditions, actions and events are logical elements of the subdevice, on their basis macros and routines are created. Widget is a graphical element, through which the user will control subdevice. Usually one subdevice contains one widget, but the number of conditions, actions and events varies (from zero to many). The number of subdevices in the module can be either fixed or not. For example, you can develop a module only for a 6-channel dimmer, and you can make a module that will request the hardware for the number of subdevices and create the required number of subdevices.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ModuleStruct.png]]</div></div>
</div>
==Creating the module interface ==
The interface part of the midule consists of:
* widgets - interface part of the subdevice, which is located in the rooms and has basic control functions
* Remote - interface part of the module, which has a set of device functions and opens to the full screen, when you click on the widget button
* Authorization window - Authorization is required to work with some devices. To do this, the developer can create a special authorization window that is available in the module settings
* The module settings window is a window where you need to enter the parameters for the module operation
картинка окна настроек модуля и кнопки открытия
The whole graphic part is drawn in the graphical interface of the iRidium studio editor. In contradistinction to i3 pro, the module's interface should be made up of ready-made graphic components located in the gallery.

==== Widget ====

Widget is a visual component of the module, a kind of Popup that will be displayed in the room. The main task of the widget is to display the basic controls of the subdevice and to provide a module transition to the Remote control of the subdevice. For example, to control a media player, you can place a volume slider or Mute button for quick access to adjusting the volume. The weather widget can display the current weather, and the control panel will contain the weather forecast for all 5 days.<br />
The module does not make sense without widget, because it will not have a graphical representation in the i3 lite project.

Widget has a limited size
# Width '''640'''
# Height can not exceed '''1200'''

[[Файл:Пример виджета.png|center|thumb|Рис. Widget example]]

To create a widget, click the Add pop-up button in the Project overview panel and in the appeared menu select popup type: "Widget", set the name and properties:
[[Файл:ПанельПопап.png|thumb|center]]

Properties of a created widget can be changed with the help of '''Object Properties'''.<br />
Graphic items are assigned to channels like in popups:
[[Файл:Связывание_канала_команды_и_графического_элемента.png|center|thumb|Рис. Связывание канала команды и графического элемента]]
Widget will be displayed:
* In the room when a client uses the project
[[Файл:В_комнате_при_использовании_пользователем_проекта.png|center|thumb|]]
* In the module settings when it is added to the project:
[[Файл:И_в_настройках_модуля_при_добавлении_его_в_проект.png ‎|center|thumb|]]
====Remote and other graphic windows====

Remote (a remote control) is a graphical area to control SubDevices. Unlike wigets, it can have free size and position. And it is displayed on call. Remote is displayed when a button to go to the remote control is pressed on a widget.
Items to control equipment are placed on Remote (buttons, lists, switches, levels). There can be from 0 to several remote controls. Example of Remote:<br />
[[Файл:Пульт_управления.png ‎|center|thumb|]]<br />

Remote is created like a Widget. The only difference is to select "Remote" when you click "Add Popup Page" in the "Device Type" property.
==Interface design standard==
For the convenience of interface design, a standard was developed in which graphic windows should be developed in the module so that the modules of different developers looked uniformly within the framework of one project.
===Basic principles===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:GeneralUI.png]]</div></div>
<div class="col-sm-12 col-md-6">
Виджет состоит из «Header» и дополнительных модулей основного функционала. <br/>
«Header» — верхний модуль виджета.<br/>
«Header» содержит:<br/>
- наименование виджета;
- наименование устройства, которым<br/>
управляет виджет;<br/>
- иконка категории устройства.<br/>
<br/>
Дополнительные модули содержат элементы управления устройством.
</div>
</div>
===Module grid and blocks===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka1.png]]</div></div>
<div class="col-sm-12 col-md-6">
Module grid widget is a block 640 pt wide
And 120 pt in height. Each block has a grid of 8x8 pt.
The rounding of the corners is 12.5 ut. (Circle 25)
</div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka2.png]]</div></div>
<div class="col-sm-12 col-md-6">
The principle of constructing a widget block is a constructor from
Controls (buttons, switches, labels) from smaller to larger.
</div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka3.png]]</div></div>
<div class="col-sm-12 col-md-6">
Control items are combined and united in a block, blocks are united into a control panel.
</div>
</div>
===Buttons===
<big>'''Toggle'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Toggle.png]]</div></div>
<div class="col-sm-12 col-md-6">
Кнопка изменения значения «вкл/выкл». Применяется для отправки команды на устройство, вне зависимости от его текущего состояния.
</div>
</div>
<big>'''Switch'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Switch.png]]</div></div>
<div class="col-sm-12 col-md-6">
«On/off» switch. It is used only when the currect device status is known.
</div>
</div>
<big>'''Multistate'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Multistate.png]]</div></div>
<div class="col-sm-12 col-md-6">
Multistate button is used only when the current device status is known.
</div>
</div>
===Arrow-button===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:arrow1.png]]</div></div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:arrow2.png]]</div></div>
</div>
'''Действие кнопки'''<br/>
При нажатии на кнопку происходит вызов «PopUp».<br/>
'''Содержимое «PopUp»'''<br/>
«Input field», «Single selection», «Multiple selection».
===Sliders===
<div class="row">
<div class="col-sm-12 col-md-6">
Standart
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:StandartSlider.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
Value
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ValueSlider.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
Progress
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ProgressSlider.png]]</div></div>
</div>
===Description===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Description.png]]</div></div>
===Icons===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Icons1.png]]</div></div>
All icons are devided by their spheres of use, their main differene is the size.
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Icons2.png]]</div></div>
===«Header» widget===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:WidgetHeader.png]]</div></div>
===Icon location===
<div class="row">
<div class="col-sm-12 col-md-6">
The standard is 128х120 pt
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:FormFactor.png]]</div></div>
</div>
All buttons have two states - active and inactive
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:OFFicon.png]]</div></div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ONicon.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
When the button in inactive the color is always # 848484 or RGB 132
</div>
<div class="col-sm-12 col-md-6">
The state of a button is considered active, when the action received feedback and is short or instant (e.g. «Play» in a media player) or an acrion that is active for a long time and demands another activity to switch off the active state (e.g. «Repeat» in a media player).
</div>
</div>
==Basics of working with scripts==

To design an interface and to add a driver, you are to develop the logics of module work via script. The script part of developing i3 lite modules has a number of special features. Before developing the script part of i3 lite modules, please, read [http://dev.iridiummobile.net/JS_Guide iRidium Pro API] and [[Special:MyLanguage/Developers_API | i3 lite API]]. <br />

A module can contain any number of scripts. There are several types of scripts for modules:
* Driver - script files of this type contain script, responsible for working with a driver
* GUI - script files of this type contain script, responsible for working with graphics
* Common - script files of this type must contain general scripts, such as a set of additional functions or a description of classes of secondary importance
* Setup - a special script file that contains information about module setting, a list of fields that are obligatory to fill in, types of these fields and functions that check the correctness of entered data.

Devision into types is necessary for the module correct work on the server. Only logics and the driver part work on the server, but the server knows nothing about the graphic part. That's why a module developer has to devide scripts into types. The server does not notice files for working with the graphic part. <br />

When modules are developed module names have to be used instead of IR. Thus, a listener looks this way module.AddListener… <br />

Каждый скриптовой файл должен начинаться со слушателя
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_MODULE_START, 0, function(){});
</syntaxhighlight>
Это новый вид события, предназначенный специально для разработки модуля. При разработке модуля следует учитывать что скриптовой файл стал закрыт для других скриптовых файлов. Это хзначить что теперь можно использовать одноименные переменные и названия функций в разных скриптовых файлах и они не будут перезаписываться, но это накладывает ограничение: нельзя получить доступ к функции из другого скриптового файла простым способом. Для получения доступа к функции из другого скриптового файла, следует импортировать скриптовый файл с помощью команды module.Import("FileName.js"). <br />
Example:<br/>
<syntaxhighlight lang="javascript">
//Name_1.js - first js file
this.Text = "Hello, world!"; //Pointer to a text variable
//Name_2.js - second js file
var Text = module.Import("Name_1.js").Text; //Importing an object with a pointer to a text variable from the first js file
IR.Log(Text); //"Hello, world!" //log the text variable
</syntaxhighlight>
==Creating a subdevice==
The basis of every module is subdevices. The task of every module developer is to define how many subdevices a module has and to develop the logics of subdevice work. Each subdevice may contain a widget, a remote control, a set of actions, events and states. All contents of a subdevice have to be indicated when a subdevice is created. Subdevice contents can't be changed during module work. The following command is used to create a subdevice:<br/>
<syntaxhighlight lang="javascript">
module.AddSubDevice(SystemName, [Device], [System], [Type], [Tags], [Name], [Callback]);
</syntaxhighlight>
where<br/>
'''SystemName''' - subdevice system name<br/>
'''Device''' - a driver to which a subdevice will be assigned<br/>
'''System''' - old parameter, "false" is to be used<br/>
'''Type''' - type of smart device. Parameter is under development<br/>
'''Tags''' - Array of virtual tag objects<br/>
'''Name''' - subdevice name that is displayed to the user<br/>
'''Callback function(){do somethings}''' - a function that is on till the IR.EVENT_ADD_SUBDEVICE event happens.<br/>
As a reply the function returns a link to a subdevice, that can be used to address it.<br/>
An example of creating subdevices for HDL Relay devices. The script checks th number of devices in the bus and creates subdevices.<br/>
<syntaxhighlight lang="javascript">
for (var count = 1; count <= COUNT_CHANNEL; count++) {
// Creating a subdevice
l_oSubDevice = module.AddSubDevice("Relay " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_RELAY);
// Creating StatusOnStart command
if (count == 1)
l_oSubDevice.AddChannel("Relay:statusOnStart", [ChannelData]);
var l_sChannelName = "Relay:channel" + count;
// Adding channels
l_oSubDevice.AddChannel(l_sChannelName, [ChannelData]);
l_oSubDevice.AddTag(l_sChannelName, [ChannelData]);
// Add a virtual tag
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_TAG_POWER, true);
};</syntaxhighlight><br/>
Everything that is required can be added to a subdevice this way. An event is activated when a subdevice is created.<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function, [pointer]);
</syntaxhighlight><br/>
A link to a subdevice that was created is sent to a function. Different components can be added to subdevice in this event, such as, actions, events, states, widgets, chanels, tags. For example,<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function(in_oSubDevice){
Creating actions
in_oSubDevice.AddAction("On", false, in_oSubDevice.SystemName + "_Power", lightID + "_1", IR.SUB_DEVICE_COMMAND_POWER_ON);
in_oSubDevice.AddAction("Off", false, in_oSubDevice.SystemName + "_Power", lightID + "_0", IR.SUB_DEVICE_COMMAND_POWER_OFF);
Creating events
in_oSubDevice.AddEvent("On", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "1");
in_oSubDevice.AddEvent("Off", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "0");
Creating states
in_oSubDevice.AddCondition("On", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "1");
in_oSubDevice.AddCondition("Off", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "0");
});</syntaxhighlight><br/>
Thus, a developer can create the required number of subdevices when a module is installed or when new subdevices are added manually.
==Adding a widget to a subdevice==

After an interface is created in the studio and a function to add subdevices is added, create a copy of a widget for each subdevice and assign it to the subdevice. To assign a widget to a subdevice the following method is used.<br/>
<syntaxhighlight lang="javascript">SubDevice.addWidget(in_Widget)</syntaxhighlight><br/>


The input parameter of the method is '''in_Widget''' - an object, a widget, created in the studio beforehand.<br />
The output parameter of the method is '''True''' or '''False''' (successful or not).<br />
For example, we have 3 lamps. Not to create a separate wiget for each lamp, use a ready template and clone it. Here is an example of creating widgets with the help of a code using the existing template .<br />

Clone method allows to clone an existing popup.<br/>
<syntaxhighlight lang="javascript">Module.ClonePopup (in_Popup, in_Name)</syntaxhighlight><br/>
Входные параметры метода:
*'''in_Name''' - имя нового виджета.<br/>
*'''in_Popup''' - ссылка на всплывающее окно.<br/>
Выходным параметром метода является: успешно или нет ('''True''', '''False''').<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function(in_oSubDevice){
var popup = module.GetPopup("Dimmer"); // Calling a widget that we want to clone
// Creating a widget using cloning method
var widget = in_oSubDevice.addWidget(module.ClonePopup(popup, "Dimmer"+ in_oSubDevice.Name));
});</syntaxhighlight><br/>
----
{{i}} Names of new widgets must not be repeated
----
When a complete remote control is opened it is necessary to remmeber that a user will use the module both on a tablet and on a smart phone. The difference betwen the screen sizes makes a developer design 2 types of windows: a version for smart phones and a version for tablets. In addition a method must be added to the script that asks the system about the type of device where a module is launched and open the required window.
<syntaxhighlight lang="javascript">
if (IR.DisplayType == IR.DISPLAY_TYPE_PHONE) { //If a module is opened on a smart phone
var l_oPopupScanner = module.GetPopup("Phone"); //show a popup created for a smart phone
}
else {
var l_oPopupScanner = module.GetPopup("Tablet");//If a module is opened on a tablet, show a popup for a tablet
}
</syntaxhighlight><br/>
==Work with channels and tags==
After creating a subdevice and adding a widget you must add to the subevice channels and tags required for its work. Like in i3 pro version, a driver can be added in the studio or via script. Each subdevice requires a personal set of channels and tags for the selected driver. You may work with the following three components:<br/>
*Channel. The following method is used to create a channel<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddChannel(Name, DataArray)
</syntaxhighlight>where<br/>
'''Name''' - channel name<br/>
'''DataArray''' - data array (specific for every driver)<br/>
*Tag The following method is used to create a tag<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddTag(Name, DataArray)
</syntaxhighlight>where<br/>
'''Name''' - tag name<br/>
'''DataArray''' - data array, specific for every driver<br/>
*Virtual tag. The following method if used to create a virtual tag<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddVirtualTag(Name, Value, [Edit], [smartID], [Hidden])
</syntaxhighlight>where<br/>
'''Name'''- name of a subdevice virtual tag<br/>
'''Value''' - Tag value<br/>
'''Edit''' - Permission to edit a tag<br/>
'''smartID''' - Parameter is under development! Set "false"<br/>
'''Hidden''' - Feature of a hidden tag<br/>
===An example of creating channels and tags when creating a subdevice===
<syntaxhighlight lang="javascript">
l_oSubDevice = module.AddSubDevice("Light " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_DIMMER);

// Adding channel StatusOnStart
if (count == 1)
l_oSubDevice.AddChannel("Dimmer:statusOnStart", [ChannelData]);

// Assigned to the variable name of the channel
var l_sChannelName = "Dimmer:channel" + count;

// Adding channels
l_oSubDevice.AddChannel(l_sChannelName, [ChannelData]);
l_oSubDevice.AddTag(l_sChannelName, [TagData]);

// Adding smart virtual tag
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_COMMAND_POWER, true);
l_oSubDevice.AddVirtualTag("Power On", 0, false, IR.SUB_DEVICE_COMMAND_POWER_ON, true);
l_oSubDevice.AddVirtualTag("Power Off", 0, false, IR.SUB_DEVICE_COMMAND_POWER_OFF, true);
l_oSubDevice.AddVirtualTag("Level", 0, false, IR.SUB_DEVICE_COMMAND_LEVEL, true);
</syntaxhighlight>
==Setting a module in the app==
Modules are stored in iRidium store and can be installed in the app using one of the following ways:<br/>
*With the help of a scanner<br/>
*Manually<br/>
===Developing the Setup file===
The Setup file must be developed for each variant. It's a special script file with fields that are required for module work. These fields can be device IP address, port, city name, etc. To develop a Setup file, create a new script file and select its type - "Setup". Eacn field is a tag and can be accessed from the script, and the input value can be received.
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:СетапБонго.png]]</div></div>
The Setup file consists of 2 parts. Part 1 is the driver settings. The settings must require IP addresses, ports and logins to connect the driver to a device. Part 2 is the module general settings, such as number of outputs, access keys.
To set fields in the Setip file set the following fields in the script:
* Field type - indicate what field must be shown to a user (text field, data array, etc. Detailed description is given in API)
* Field name - name of field that a user sees when setting a module
* Default value - what value must be put by default
* Check function - a function to validate value in the field. A function must be written that checks the correctness of the entered data.
For example,"Setup" script for HDL module looks this way:
<syntaxhighlight lang="javascript">
{
// Data to connect drivers, created in Project Device Panel
Drivers:
[
{
Name: "HDL-BUS Pro Network (UDP)",
Properties:
[
{
Type: "textfield",
Name: "Host",
DefaultValue: "255.255.255.255",
Validation: function(in_sValue) {
var l_aValueHost = in_sValue.split(".");
if (l_aValueHost.length != 4) {
return "Please input correct Host";
} else
if (parseInt(l_aValueHost[0], 10)>=0
&& parseInt(l_aValueHost[0], 10)<=255
&& parseInt(l_aValueHost[1], 10)>=0
&& parseInt(l_aValueHost[1], 10)<=255
&& parseInt(l_aValueHost[2], 10)>=0
&& parseInt(l_aValueHost[2], 10)<=255
&& parseInt(l_aValueHost[3], 10)>=0
&& parseInt(l_aValueHost[3], 10)<=255
)
return 0
else
return "Please input correct Host";
}
},
{
Type: "textfield",
Name: "Port",
DefaultValue: "6000",
Validation: function(in_sValue) {
if(parseInt(in_sValue, 10)>=0)
return 0
else
return "Please input correct Port";
}
}
]
}
],

// General information for the module (driver and generated by script)
Module: [{
Name: "Channels Count",
Validation: function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input Count";
}
},
{
Type: "textfield",
Name : "SubnetID",
Validation : function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input SubnetID";
}
},
{
Type: "textfield",
Name : "DeviceID",
Validation : function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input DeviceID";
}
}

]
}
</syntaxhighlight>
To get data from Setup fields use the following function
<syntaxhighlight lang="javascript">
module.GetProperty("Field name")
</syntaxhighlight>
<br />
Besides standard parameters, any parameters required for module inizialization can be asked. Driver parameters are set in the driver automatically. The other parameters are to be asked and used manually.<br />
An example of work with Setup parameters
<syntaxhighlight lang="javascript">
var COUNT_CHANNEL = parseInt(module.GetProperty("Channel count")); // Getting count channel
var SubNetID = parseInt(module.GetProperty("SubnetID")); // Getting subnet id
var DeviceID = parseInt(module.GetProperty("DeviceID")); // Getting device id
</syntaxhighlight>
===Installing a module manually===
To install a module manually no additional script development is required. A user must go to iRidium store from the app, find a module, download it and enter date in the fields indicated in the Setup file. After it the app installs the module in the system with parameters entered by a user.
===Installing a module with the help of a scanner===
'''Scanner (сканер)''' - это модуль, который анализирует какую-либо шину на подключённые устройства либо ищет устройства в локальной сети. Найденные устройства формируются в список, для выбранного устройства качается модуль и становится доступен в i3 lite. <br/>
Схема работы сканера:
# Сканер загружается из магазина;
# Пользователь вводит параметры сканера (IP, Port и т.д) и эти параметры передаются в скрипт сканера;
# Сканер, обработав введенные параметры, опрашивает шину на устройства или ищет устройства в локальной сети;
# Из полученных устройств формируется список;
# При выборе определенного устройства в списке, сканер передаёт параметры выбранного устройства в модуль.
<br/>
При разработке сканера нужно учесть:
* Параметры сканера, при добавлении из магазина;
* Логику сканера;
* Передачу параметров выбранного устройства в модуль;
* Логику модуля, с учётом переданных от сканера параметров.
<br/>
Процесс разработки сканера ничем не отличается от разработки модуля. Точно также сканеру необходимо нарисовать визуальную часть, создать драйвер и написать скрипт с логикой. Основным отличием является то, что сканер может работать только на панели управления и сканер никогда не будет запущен на сервере, поэтому, при разработке скриптов, нет необходимости разделять скрипты на драйверные и интерфейсные.
<br/>
Также при разработке сканера появляется новая логика работы. Первым делом необходимо сделать модуль для управления устройством, далее надо загрузить модуль в магазин модулей. При загрузке модуля, вы увидите уникальный идентификатор вашего модуля. Когда вы будете разрабатывать сканер, вам необходимо написать скрипт со следующей логикой:
# Создание драйвера
# Поиск оборудования
# Если оборудование найдено, надо определить что это за оборудование
# При помощи команды ModuleSetupFinish (ID модуля, js объект с настройками setup данного модуля)
После этого приложение скачет модуль из магазина модулей и установит его.<br/>
The distinctive feature of developing a scanner is the event that lauches the driver work. When developing a scanner use the following event
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_OPEN_SCANNER, 0, function (){});
</syntaxhighlight>
A scanner must be developed after modules are developed. The developed modules are registered in the store of modules and are given a unique ID. After a scanner finds devices in the local net, the script must download a module for the found equipment by the indicated ID. To download a module use the following function
<syntaxhighlight lang="javascript">
IR.ModuleSetupFinish(StoreID, ModuleData, [Callback])
</syntaxhighlight>
where
* StoreID - module ID in the store of modules
* ModuleData - data required for installing a module (fields in Setup)
* Callback - a function to process errors that happened in the installation process (optional)
An example of a developed scanner for HDL modules. To install any module the following parameters are required: Type,SubNet id, Device id, module name, bus IP address, port.
<syntaxhighlight lang="javascript">
//Example of installing HDL Dimmer with a scanner
var l_nStoreID = 82;
var l_oModuleData = {
Module: {
//Data required for module work
Type: "Dimmer",
SubnetID: 3,
DeviceID: 6
Name: "HDL Dimmer"
}
Drivers: {
//Data for the driver
"HDL-BUS Pro Network (UDP)": {
Host: "255.255.255.255", //installing a host for the driver
Port: "6000" //installing a port for the driver
},
}
}

IR.ModuleSetupFinish(l_nStoreID, l_oModuleData, function(in_error){
if (!in_error){
...
} else {
...
}
});
</syntaxhighlight>
===Adding subdevices manually===
After adding the subdevices via the scanner or Setup, the user may have a need to add other subdevices. To ensure this, module developer has to assign the system variable
<syntaxhighlight lang="javascript">
SettingsPopupName = module.GetPopup('AddSubDevicePopup');
</syntaxhighlight >
You have to assign a window with the results of the scanner operation or a popup in which the user can configure a new subdevice or add this subdevice. This popup should be developed by the developer himself.<br/>
Если к указанной системной переменной привязан попап, то в разделе настроек модуля пользователь увидит кнопку "+", которая открывает указанный попап
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:AddSubdeviceBtn.png]]</div></div>
</div>
Пример указания окна добавления подустройств. При разработке, надо создавать окно добавления в разрешении планшета и отдельно окно в разрешении смартфона
<syntaxhighlight lang="javascript">
module.SettingsPopupName = IR.DisplayType != IR.DISPLAY_TYPE_TABLET? module.GetPopup("phone:NoAuthorize").Name: module.GetPopup("NoAuthorize").Name;
</syntaxhighlight >
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:AddSubdeviceWindow.png]]</div></div>
</div>
===Authorization===
To work with certain devices a user's authorization in a third-party system is required. i 3lite app has a special authorization mechanism for this purpose.<br/>
To authorize a user has to enter his access data in a special window. This window is unique for every device and a module developer must create it. A window to enter data is a popup with fields to enter data. The popup is created with the help of standard means of the studio and it may be unassigned to any subdevices. When access data are entered, the script must authorize in a third-party system and close the authorization window. After creating an authorization popup, a developer must call the authorization system variable in the script and assign the created popup in the variable.
<syntaxhighlight lang="javascript">
AuthorizationPopupName = module.GetPopup("AutorisationPopup");
</syntaxhighlight ><br/>
After an authorization popup is assigned to a variable, "Authorize" button appears in the module settings.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:NeedAuthorization1.png]]</div></div>
</div>
When this button is pressed, the app opens the authorization popup, assigned in the script. The next task for a module developer is to display a user's status (Authorized or not). There is a system variable to solve this task.
<syntaxhighlight lang="javascript">
AuthorizationStatus = true;
</syntaxhighlight ><br/>
If a user is authorized in the system, true value is assigned to the variable and the app changes the status of the authorization button into:
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Logout1.png]]</div></div>
</div>
A module devloper must also think about the mechanism of deauthorization. It is done on the authorization popup.<br/>
An example of the authorization script
<syntaxhighlight lang="javascript">
if (module.AuthorizationStatus == false) { //If a user is not authorized
module.AuthorizationPopupName = WindowSettings.Window.Name;//Assigning the authorization popup created earlier
} else if (module.AuthorizationStatus) //If a user is authorized
{
module.AuthorizationPopupName = IR.DisplayType != IR.DISPLAY_TYPE_TABLET? module.GetPopup("phone:deAuth").Name: module.GetPopup("deAuth").Name;//Showing the deauthorization popup
}
</syntaxhighlight ><br/>
Note. Remember to create a separate authorization/deauthorization popup for a smart phone and for a tablet.
===Changing settigns===
В ходе работы с приложением, может возникнуть потребность изменить настройки модуля. Для обеспечения такой возможностью, разработчик модуля должен создать функцию изменения настроек модуля и присвоить ее к системному методу
<syntaxhighlight lang="javascript">
module.ChangeProperties = function (in_oSetup)
{
обработка новых параметров модуля
}
</syntaxhighlight>
При объявлении такой функции, приложение добавит в модуль кнопку редактирования настроек модуля.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ChangeBtn.png]]</div></div>
</div>
Когда пользователь нажмет на данную кнопку, приложение откроет окно Setup, которое использовалось при установке модуля. В этом окне пользователь введет новые настройки и нажмет кнопку "готово". После этого приложение запустить указанную выше функцию. Настройки драйвера приложение сможет изменить самостоятельно, остальные же настройки разработчик модуля дулжен изменить вручную. Новые настройки записываются во входной параметр in_oSetup в виде JSON строки.<br/>
Также в данной функции необходимо обработать успешность изменения настроек. За это отвечает флаг
<syntaxhighlight lang="javascript">
module.FinishUpdateSettings = true;
</syntaxhighlight>
Если установка новых параметров прошла успешно, то надо выставить значение флага true, а обратном случае флаг должен принять значение false. Это позволяет приложению понять что смена параметров не удалась(если статус переменной будет false) и приложение отменит изменение настроек драйвера, вернув старые настройки<br/>
Пример обработки новых настроек модуля
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_MODULE_START, 0, function(){
module.ChangeProperties = function (in_oSetup, in_oModule) {
if (typeof (in_oSetup) == "string")
in_oSetup = JSON.Parse(in_oSetup);
var l_nChannel = in_oSetup.Module["Channel count"];
if (l_nChannel >= COUNT_CHANNEL) {
module.FinishUpdateSettings = true;
// Recreating element on cycle
for (var count = 1; count <= in_nChannel; count++) {

// Creating subDevice
l_oSubDevice = module.AddSubDevice("Relay " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_RELAY);

// Create revers
if (!l_oSubDevice.GetProperty("Reverse"))
l_oSubDevice.SetProperty("Reverse", 0);

// Assigned to the variable name of the channel
var l_sChannelName = "Relay:channel" + count;

// Adding channels
l_oSubDevice.AddChannel(l_sChannelName, Data);
l_oSubDevice.AddTag(l_sChannelName, Data);

// Adding smart virtual tag
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_TAG_POWER, true);
};
}
else {
for (var count = 1; count <= COUNT_CHANNEL; count++)
if (l_nChannel < count) {
var l_oDeleteSubDevice = module.GetSubDevice("Relay " + count);
module.DeleteSubDevice (l_oDeleteSubDevice.ID);
};
};
};
});
</syntaxhighlight>

Translations:DevManual/201/en

2017-04-17T04:44:56Z

You have to assign a window with the results of the scanner operation or a popup in which the user can configure a new subdevice or add this subdevice. This popup should be developed by the developer himself.

DevManual/en

2017-04-17T04:39:23Z

Ildar:

<languages/>
=Module development guide=
==Definitions==

'''Module''' - is a component that allows you to control one type of equipment by its unique ID. The module is located in the store of modules.

'''Control panel (mobile device)''' - is a device from which the project i3 lite is launched (tablet, smartphone).

'''Store of modules''' - is a cloud server for uploading ready-made modules. The module store is available from the i3 lite application or on our[http://www.iridiummobile.ru/store/ site]

'''iRidium Studio''' - is a editor that allows to create the module to control device for i3 lite application. You need to use a special editor build for [http://www.iridiummobile.net/redirects/?go=iRidium_SETUP_LITE module developers] to develop the module

'''i3 lite''' - is an application to create, set and use i3 lite projects.

'''i3 lite project''' – is an automation project made up of ready equipment control modules. i3 lite projects differ from i2 Control projects: i3 lite projects can be edited dynamically without prior editing in iRidium Studio. i3 lite project consists of several small parts that can be put together into a single whole in i3 lite app with the help of the built-in constructor. It can also be easily edited in the app. As a result, a big number of intermediate processes are no longer necessary, such as installing software on PC, uploading projects on contol panels. All is done in one place - a control panel.

'''SubDevice''' - This is a virtual representation of the working area of the physical device. If we take as an example a 6-channel dimmer it has 6 sub-devices, because each independent device requires a separate control interface and connects to one channel.

'''Room (in i3 lite)''' - The visual part of i3 lite containing hardware management widgets. The project in i3 lite consists of rooms located on the floors

'''Widget''' - is a visual module component located in the room. It has limitations in size and fixed position in the room interface. It contains the main module functionality. For additional functions Remote is used.

'''Remote''' - is a visual module component which is hidden by default. It opens only when clicking on the corresponding item of the widget. It does not have size limitations (not more than the panel display size) and can be located in any part of the room interface (it is usually located in the middle of the panel display). It contains additional functionality of the module.

'''Macros''' - is a sequence of commands of various modules, which is activated by pressing. Contains "Action" and "Condition". For example, the macros "turn off all the lights in the house" will send the shutdown command to all devices responsible for lighting.

'''Routine''' - is a sequence of commands of various modules, which is activated automatically when a certain event occurs. Contains "Event", "Action" and "Condition". For example, "turn on the light if the motion sensor is triggered"

'''Event''' - is a routine component that describes the control command and the value range. If the value is sent in the indicated range, the routine is executed. For example, the event "Motion appeared" is activated if the motion sensor is triggered.

'''Action''' - is a component of macros and routines. It describes the control command and value that must be sent to the command. For example, "turn on the light". There are 2 types of Action: Simple Action and Advanced Action.

'''Simple Action''' - Simple Action is used when the command and Action value are known in advance.

'''Advanced Action''' - Advanced Action is used when the command is known but the value is unknown. The value is set dynamically when Action is used in i3 lite (but not when creating in iRidium studio).

'''Condition''' - is a component of macros and scenes. It describes the control command and value range. When a value from the value range is sent Action is executed.

'''Scanner''' - is a software part, that analyzes any bus looking for connected devices. Found connected devices are displayed in a list. Modules for the found devices are downloaded from iRidium store and the devices become available to control in i3 lite.
==Module concept==
The module is an independent subroutine of the i3 lite application which is built in the project and has an independent interface, driver and logic. Modules are developed in the [http://www.iridiummobile.net/redirects/?go=iRidium_SETUP_LITE iRidium Studio] editor and located in the module store [http://www.iridiummobile.ru/store/ iRidium Store]. Integrator downloads the module from the module store for each individual project.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ModuleInScheme.png]]</div></div>
</div>

There are two types of modules:
*Control module - module for hardware control
*Scanner - module for searching hardware in the local network and loading modules for found devices
== How to start developing the module ==
----

{{i}} Before starting your work, it is recommended to read [http://dev.iridiummobile.net/How_to_begin iRidium documentation]. It describes the basics of working with iRidium. The i3 lite documentation describes how to develop modules for the i3 lite platform for users, who already know iRidium. If you want to write script use [[Special:MyLanguage/Developers_API | i3 lite API]].
----

The module life cycle consists of:
* Developing the graphic part in iRidium studio
* Developing the driver part (scripts, devices)
* Testing
* Publishing in iRidium store
* Using (module download via the i3 lite application from the cloud and adding to automation projects)
<br/>
==Module structure ==
Each module must consist of subdevices. The subdevice is a virtual representation of the working area of a physical device. Many devices support multiple workgroups with the same functionality. Each workgroup may be in a separate zone. To fully control the zone, you need to create a subdevice for each workgroup of the device. For example, a 6-channel HDL dimmer contains 6 dimmable channels, through which 6 working groups can be controlled. Therefore, it is advisable to select in the module 6 subdevices for the possibility of creating actions, events and conditions for each workgroup separately. The presence of subdevice in the i3 lite module is obligatory. The number of sub-devices can be from one to many. Usually the number of subdevice is equal to the number of channels of the controller, the number of its work areas or logical devices.

Subdevice consists of:
* Conditions
* Actions
* Events
* Widgets

Conditions, actions and events are logical elements of the subdevice, on their basis macros and routines are created. Widget is a graphical element, through which the user will control subdevice. Usually one subdevice contains one widget, but the number of conditions, actions and events varies (from zero to many). The number of subdevices in the module can be either fixed or not. For example, you can develop a module only for a 6-channel dimmer, and you can make a module that will request the hardware for the number of subdevices and create the required number of subdevices.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ModuleStruct.png]]</div></div>
</div>
==Creating the module interface ==
The interface part of the midule consists of:
* widgets - interface part of the subdevice, which is located in the rooms and has basic control functions
* Remote - interface part of the module, which has a set of device functions and opens to the full screen, when you click on the widget button
* Authorization window - Authorization is required to work with some devices. To do this, the developer can create a special authorization window that is available in the module settings
* The module settings window is a window where you need to enter the parameters for the module operation
картинка окна настроек модуля и кнопки открытия
The whole graphic part is drawn in the graphical interface of the iRidium studio editor. In contradistinction to i3 pro, the module's interface should be made up of ready-made graphic components located in the gallery.

==== Widget ====

Widget is a visual component of the module, a kind of Popup that will be displayed in the room. The main task of the widget is to display the basic controls of the subdevice and to provide a module transition to the Remote control of the subdevice. For example, to control a media player, you can place a volume slider or Mute button for quick access to adjusting the volume. The weather widget can display the current weather, and the control panel will contain the weather forecast for all 5 days.<br />
The module does not make sense without widget, because it will not have a graphical representation in the i3 lite project.

Widget has a limited size
# Width '''640'''
# Height can not exceed '''1200'''

[[Файл:Пример виджета.png|center|thumb|Рис. Widget example]]

To create a widget, click the Add pop-up button in the Project overview panel and in the appeared menu select popup type: "Widget", set the name and properties:
[[Файл:ПанельПопап.png|thumb|center]]

Properties of a created widget can be changed with the help of '''Object Properties'''.<br />
Graphic items are assigned to channels like in popups:
[[Файл:Связывание_канала_команды_и_графического_элемента.png|center|thumb|Рис. Связывание канала команды и графического элемента]]
Widget will be displayed:
* In the room when a client uses the project
[[Файл:В_комнате_при_использовании_пользователем_проекта.png|center|thumb|]]
* In the module settings when it is added to the project:
[[Файл:И_в_настройках_модуля_при_добавлении_его_в_проект.png ‎|center|thumb|]]
====Remote and other graphic windows====

Remote (a remote control) is a graphical area to control SubDevices. Unlike wigets, it can have free size and position. And it is displayed on call. Remote is displayed when a button to go to the remote control is pressed on a widget.
Items to control equipment are placed on Remote (buttons, lists, switches, levels). There can be from 0 to several remote controls. Example of Remote:<br />
[[Файл:Пульт_управления.png ‎|center|thumb|]]<br />

Remote is created like a Widget. The only difference is to select "Remote" when you click "Add Popup Page" in the "Device Type" property.
==Interface design standard==
For the convenience of interface design, a standard was developed in which graphic windows should be developed in the module so that the modules of different developers looked uniformly within the framework of one project.
===Basic principles===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:GeneralUI.png]]</div></div>
<div class="col-sm-12 col-md-6">
Виджет состоит из «Header» и дополнительных модулей основного функционала. <br/>
«Header» — верхний модуль виджета.<br/>
«Header» содержит:<br/>
- наименование виджета;
- наименование устройства, которым<br/>
управляет виджет;<br/>
- иконка категории устройства.<br/>
<br/>
Дополнительные модули содержат элементы управления устройством.
</div>
</div>
===Module grid and blocks===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka1.png]]</div></div>
<div class="col-sm-12 col-md-6">
Module grid widget is a block 640 pt wide
And 120 pt in height. Each block has a grid of 8x8 pt.
The rounding of the corners is 12.5 ut. (Circle 25)
</div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka2.png]]</div></div>
<div class="col-sm-12 col-md-6">
The principle of constructing a widget block is a constructor from
Controls (buttons, switches, labels) from smaller to larger.
</div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka3.png]]</div></div>
<div class="col-sm-12 col-md-6">
Control items are combined and united in a block, blocks are united into a control panel.
</div>
</div>
===Buttons===
<big>'''Toggle'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Toggle.png]]</div></div>
<div class="col-sm-12 col-md-6">
Кнопка изменения значения «вкл/выкл». Применяется для отправки команды на устройство, вне зависимости от его текущего состояния.
</div>
</div>
<big>'''Switch'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Switch.png]]</div></div>
<div class="col-sm-12 col-md-6">
«On/off» switch. It is used only when the currect device status is known.
</div>
</div>
<big>'''Multistate'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Multistate.png]]</div></div>
<div class="col-sm-12 col-md-6">
Multistate button is used only when the current device status is known.
</div>
</div>
===Arrow-button===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:arrow1.png]]</div></div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:arrow2.png]]</div></div>
</div>
'''Действие кнопки'''<br/>
При нажатии на кнопку происходит вызов «PopUp».<br/>
'''Содержимое «PopUp»'''<br/>
«Input field», «Single selection», «Multiple selection».
===Sliders===
<div class="row">
<div class="col-sm-12 col-md-6">
Standart
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:StandartSlider.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
Value
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ValueSlider.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
Progress
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ProgressSlider.png]]</div></div>
</div>
===Description===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Description.png]]</div></div>
===Icons===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Icons1.png]]</div></div>
All icons are devided by their spheres of use, their main differene is the size.
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Icons2.png]]</div></div>
===«Header» widget===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:WidgetHeader.png]]</div></div>
===Icon location===
<div class="row">
<div class="col-sm-12 col-md-6">
The standard is 128х120 pt
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:FormFactor.png]]</div></div>
</div>
All buttons have two states - active and inactive
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:OFFicon.png]]</div></div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ONicon.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
When the button in inactive the color is always # 848484 or RGB 132
</div>
<div class="col-sm-12 col-md-6">
The state of a button is considered active, when the action received feedback and is short or instant (e.g. «Play» in a media player) or an acrion that is active for a long time and demands another activity to switch off the active state (e.g. «Repeat» in a media player).
</div>
</div>
==Basics of working with scripts==

To design an interface and to add a driver, you are to develop the logics of module work via script. The script part of developing i3 lite modules has a number of special features. Before developing the script part of i3 lite modules, please, read [http://dev.iridiummobile.net/JS_Guide iRidium Pro API] and [[Special:MyLanguage/Developers_API | i3 lite API]]. <br />

A module can contain any number of scripts. There are several types of scripts for modules:
* Driver - script files of this type contain script, responsible for working with a driver
* GUI - script files of this type contain script, responsible for working with graphics
* Common - script files of this type must contain general scripts, such as a set of additional functions or a description of classes of secondary importance
* Setup - a special script file that contains information about module setting, a list of fields that are obligatory to fill in, types of these fields and functions that check the correctness of entered data.

Devision into types is necessary for the module correct work on the server. Only logics and the driver part work on the server, but the server knows nothing about the graphic part. That's why a module developer has to devide scripts into types. The server does not notice files for working with the graphic part. <br />

When modules are developed module names have to be used instead of IR. Thus, a listener looks this way module.AddListener… <br />

Каждый скриптовой файл должен начинаться со слушателя
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_MODULE_START, 0, function(){});
</syntaxhighlight>
Это новый вид события, предназначенный специально для разработки модуля. При разработке модуля следует учитывать что скриптовой файл стал закрыт для других скриптовых файлов. Это хзначить что теперь можно использовать одноименные переменные и названия функций в разных скриптовых файлах и они не будут перезаписываться, но это накладывает ограничение: нельзя получить доступ к функции из другого скриптового файла простым способом. Для получения доступа к функции из другого скриптового файла, следует импортировать скриптовый файл с помощью команды module.Import("FileName.js"). <br />
Example:<br/>
<syntaxhighlight lang="javascript">
//Name_1.js - first js file
this.Text = "Hello, world!"; //Pointer to a text variable
//Name_2.js - second js file
var Text = module.Import("Name_1.js").Text; //Importing an object with a pointer to a text variable from the first js file
IR.Log(Text); //"Hello, world!" //log the text variable
</syntaxhighlight>
==Creating a subdevice==
The basis of every module is subdevices. The task of every module developer is to define how many subdevices a module has and to develop the logics of subdevice work. Each subdevice may contain a widget, a remote control, a set of actions, events and states. All contents of a subdevice have to be indicated when a subdevice is created. Subdevice contents can't be changed during module work. The following command is used to create a subdevice:<br/>
<syntaxhighlight lang="javascript">
module.AddSubDevice(SystemName, [Device], [System], [Type], [Tags], [Name], [Callback]);
</syntaxhighlight>
where<br/>
'''SystemName''' - subdevice system name<br/>
'''Device''' - a driver to which a subdevice will be assigned<br/>
'''System''' - old parameter, "false" is to be used<br/>
'''Type''' - type of smart device. Parameter is under development<br/>
'''Tags''' - Array of virtual tag objects<br/>
'''Name''' - subdevice name that is displayed to the user<br/>
'''Callback function(){do somethings}''' - a function that is on till the IR.EVENT_ADD_SUBDEVICE event happens.<br/>
As a reply the function returns a link to a subdevice, that can be used to address it.<br/>
An example of creating subdevices for HDL Relay devices. The script checks th number of devices in the bus and creates subdevices.<br/>
<syntaxhighlight lang="javascript">
for (var count = 1; count <= COUNT_CHANNEL; count++) {
// Creating a subdevice
l_oSubDevice = module.AddSubDevice("Relay " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_RELAY);
// Creating StatusOnStart command
if (count == 1)
l_oSubDevice.AddChannel("Relay:statusOnStart", [ChannelData]);
var l_sChannelName = "Relay:channel" + count;
// Adding channels
l_oSubDevice.AddChannel(l_sChannelName, [ChannelData]);
l_oSubDevice.AddTag(l_sChannelName, [ChannelData]);
// Add a virtual tag
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_TAG_POWER, true);
};</syntaxhighlight><br/>
Everything that is required can be added to a subdevice this way. An event is activated when a subdevice is created.<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function, [pointer]);
</syntaxhighlight><br/>
A link to a subdevice that was created is sent to a function. Different components can be added to subdevice in this event, such as, actions, events, states, widgets, chanels, tags. For example,<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function(in_oSubDevice){
Creating actions
in_oSubDevice.AddAction("On", false, in_oSubDevice.SystemName + "_Power", lightID + "_1", IR.SUB_DEVICE_COMMAND_POWER_ON);
in_oSubDevice.AddAction("Off", false, in_oSubDevice.SystemName + "_Power", lightID + "_0", IR.SUB_DEVICE_COMMAND_POWER_OFF);
Creating events
in_oSubDevice.AddEvent("On", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "1");
in_oSubDevice.AddEvent("Off", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "0");
Creating states
in_oSubDevice.AddCondition("On", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "1");
in_oSubDevice.AddCondition("Off", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "0");
});</syntaxhighlight><br/>
Thus, a developer can create the required number of subdevices when a module is installed or when new subdevices are added manually.
==Adding a widget to a subdevice==

After an interface is created in the studio and a function to add subdevices is added, create a copy of a widget for each subdevice and assign it to the subdevice. To assign a widget to a subdevice the following method is used.<br/>
<syntaxhighlight lang="javascript">SubDevice.addWidget(in_Widget)</syntaxhighlight><br/>


The input parameter of the method is '''in_Widget''' - an object, a widget, created in the studio beforehand.<br />
The output parameter of the method is '''True''' or '''False''' (successful or not).<br />
For example, we have 3 lamps. Not to create a separate wiget for each lamp, use a ready template and clone it. Here is an example of creating widgets with the help of a code using the existing template .<br />

Clone method allows to clone an existing popup.<br/>
<syntaxhighlight lang="javascript">Module.ClonePopup (in_Popup, in_Name)</syntaxhighlight><br/>
Входные параметры метода:
*'''in_Name''' - имя нового виджета.<br/>
*'''in_Popup''' - ссылка на всплывающее окно.<br/>
Выходным параметром метода является: успешно или нет ('''True''', '''False''').<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function(in_oSubDevice){
var popup = module.GetPopup("Dimmer"); // Calling a widget that we want to clone
// Creating a widget using cloning method
var widget = in_oSubDevice.addWidget(module.ClonePopup(popup, "Dimmer"+ in_oSubDevice.Name));
});</syntaxhighlight><br/>
----
{{i}} Names of new widgets must not be repeated
----
When a complete remote control is opened it is necessary to remmeber that a user will use the module both on a tablet and on a smart phone. The difference betwen the screen sizes makes a developer design 2 types of windows: a version for smart phones and a version for tablets. In addition a method must be added to the script that asks the system about the type of device where a module is launched and open the required window.
<syntaxhighlight lang="javascript">
if (IR.DisplayType == IR.DISPLAY_TYPE_PHONE) { //If a module is opened on a smart phone
var l_oPopupScanner = module.GetPopup("Phone"); //show a popup created for a smart phone
}
else {
var l_oPopupScanner = module.GetPopup("Tablet");//If a module is opened on a tablet, show a popup for a tablet
}
</syntaxhighlight><br/>
==Work with channels and tags==
After creating a subdevice and adding a widget you must add to the subevice channels and tags required for its work. Like in i3 pro version, a driver can be added in the studio or via script. Each subdevice requires a personal set of channels and tags for the selected driver. You may work with the following three components:<br/>
*Channel. The following method is used to create a channel<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddChannel(Name, DataArray)
</syntaxhighlight>where<br/>
'''Name''' - channel name<br/>
'''DataArray''' - data array (specific for every driver)<br/>
*Tag The following method is used to create a tag<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddTag(Name, DataArray)
</syntaxhighlight>where<br/>
'''Name''' - tag name<br/>
'''DataArray''' - data array, specific for every driver<br/>
*Virtual tag. The following method if used to create a virtual tag<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddVirtualTag(Name, Value, [Edit], [smartID], [Hidden])
</syntaxhighlight>where<br/>
'''Name'''- name of a subdevice virtual tag<br/>
'''Value''' - Tag value<br/>
'''Edit''' - Permission to edit a tag<br/>
'''smartID''' - Parameter is under development! Set "false"<br/>
'''Hidden''' - Feature of a hidden tag<br/>
===An example of creating channels and tags when creating a subdevice===
<syntaxhighlight lang="javascript">
l_oSubDevice = module.AddSubDevice("Light " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_DIMMER);

// Adding channel StatusOnStart
if (count == 1)
l_oSubDevice.AddChannel("Dimmer:statusOnStart", [ChannelData]);

// Assigned to the variable name of the channel
var l_sChannelName = "Dimmer:channel" + count;

// Adding channels
l_oSubDevice.AddChannel(l_sChannelName, [ChannelData]);
l_oSubDevice.AddTag(l_sChannelName, [TagData]);

// Adding smart virtual tag
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_COMMAND_POWER, true);
l_oSubDevice.AddVirtualTag("Power On", 0, false, IR.SUB_DEVICE_COMMAND_POWER_ON, true);
l_oSubDevice.AddVirtualTag("Power Off", 0, false, IR.SUB_DEVICE_COMMAND_POWER_OFF, true);
l_oSubDevice.AddVirtualTag("Level", 0, false, IR.SUB_DEVICE_COMMAND_LEVEL, true);
</syntaxhighlight>
==Setting a module in the app==
Modules are stored in iRidium store and can be installed in the app using one of the following ways:<br/>
*With the help of a scanner<br/>
*Manually<br/>
===Developing the Setup file===
The Setup file must be developed for each variant. It's a special script file with fields that are required for module work. These fields can be device IP address, port, city name, etc. To develop a Setup file, create a new script file and select its type - "Setup". Eacn field is a tag and can be accessed from the script, and the input value can be received.
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:СетапБонго.png]]</div></div>
The Setup file consists of 2 parts. Part 1 is the driver settings. The settings must require IP addresses, ports and logins to connect the driver to a device. Part 2 is the module general settings, such as number of outputs, access keys.
To set fields in the Setip file set the following fields in the script:
* Field type - indicate what field must be shown to a user (text field, data array, etc. Detailed description is given in API)
* Field name - name of field that a user sees when setting a module
* Default value - what value must be put by default
* Check function - a function to validate value in the field. A function must be written that checks the correctness of the entered data.
For example,"Setup" script for HDL module looks this way:
<syntaxhighlight lang="javascript">
{
// Data to connect drivers, created in Project Device Panel
Drivers:
[
{
Name: "HDL-BUS Pro Network (UDP)",
Properties:
[
{
Type: "textfield",
Name: "Host",
DefaultValue: "255.255.255.255",
Validation: function(in_sValue) {
var l_aValueHost = in_sValue.split(".");
if (l_aValueHost.length != 4) {
return "Please input correct Host";
} else
if (parseInt(l_aValueHost[0], 10)>=0
&& parseInt(l_aValueHost[0], 10)<=255
&& parseInt(l_aValueHost[1], 10)>=0
&& parseInt(l_aValueHost[1], 10)<=255
&& parseInt(l_aValueHost[2], 10)>=0
&& parseInt(l_aValueHost[2], 10)<=255
&& parseInt(l_aValueHost[3], 10)>=0
&& parseInt(l_aValueHost[3], 10)<=255
)
return 0
else
return "Please input correct Host";
}
},
{
Type: "textfield",
Name: "Port",
DefaultValue: "6000",
Validation: function(in_sValue) {
if(parseInt(in_sValue, 10)>=0)
return 0
else
return "Please input correct Port";
}
}
]
}
],

// General information for the module (driver and generated by script)
Module: [{
Name: "Channels Count",
Validation: function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input Count";
}
},
{
Type: "textfield",
Name : "SubnetID",
Validation : function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input SubnetID";
}
},
{
Type: "textfield",
Name : "DeviceID",
Validation : function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input DeviceID";
}
}

]
}
</syntaxhighlight>
To get data from Setup fields use the following function
<syntaxhighlight lang="javascript">
module.GetProperty("Field name")
</syntaxhighlight>
<br />
Besides standard parameters, any parameters required for module inizialization can be asked. Driver parameters are set in the driver automatically. The other parameters are to be asked and used manually.<br />
An example of work with Setup parameters
<syntaxhighlight lang="javascript">
var COUNT_CHANNEL = parseInt(module.GetProperty("Channel count")); // Getting count channel
var SubNetID = parseInt(module.GetProperty("SubnetID")); // Getting subnet id
var DeviceID = parseInt(module.GetProperty("DeviceID")); // Getting device id
</syntaxhighlight>
===Installing a module manually===
To install a module manually no additional script development is required. A user must go to iRidium store from the app, find a module, download it and enter date in the fields indicated in the Setup file. After it the app installs the module in the system with parameters entered by a user.
===Installing a module with the help of a scanner===
'''Scanner (сканер)''' - это модуль, который анализирует какую-либо шину на подключённые устройства либо ищет устройства в локальной сети. Найденные устройства формируются в список, для выбранного устройства качается модуль и становится доступен в i3 lite. <br/>
Схема работы сканера:
# Сканер загружается из магазина;
# Пользователь вводит параметры сканера (IP, Port и т.д) и эти параметры передаются в скрипт сканера;
# Сканер, обработав введенные параметры, опрашивает шину на устройства или ищет устройства в локальной сети;
# Из полученных устройств формируется список;
# При выборе определенного устройства в списке, сканер передаёт параметры выбранного устройства в модуль.
<br/>
При разработке сканера нужно учесть:
* Параметры сканера, при добавлении из магазина;
* Логику сканера;
* Передачу параметров выбранного устройства в модуль;
* Логику модуля, с учётом переданных от сканера параметров.
<br/>
Процесс разработки сканера ничем не отличается от разработки модуля. Точно также сканеру необходимо нарисовать визуальную часть, создать драйвер и написать скрипт с логикой. Основным отличием является то, что сканер может работать только на панели управления и сканер никогда не будет запущен на сервере, поэтому, при разработке скриптов, нет необходимости разделять скрипты на драйверные и интерфейсные.
<br/>
Также при разработке сканера появляется новая логика работы. Первым делом необходимо сделать модуль для управления устройством, далее надо загрузить модуль в магазин модулей. При загрузке модуля, вы увидите уникальный идентификатор вашего модуля. Когда вы будете разрабатывать сканер, вам необходимо написать скрипт со следующей логикой:
# Создание драйвера
# Поиск оборудования
# Если оборудование найдено, надо определить что это за оборудование
# При помощи команды ModuleSetupFinish (ID модуля, js объект с настройками setup данного модуля)
После этого приложение скачет модуль из магазина модулей и установит его.<br/>
The distinctive feature of developing a scanner is the event that lauches the driver work. When developing a scanner use the following event
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_OPEN_SCANNER, 0, function (){});
</syntaxhighlight>
A scanner must be developed after modules are developed. The developed modules are registered in the store of modules and are given a unique ID. After a scanner finds devices in the local net, the script must download a module for the found equipment by the indicated ID. To download a module use the following function
<syntaxhighlight lang="javascript">
IR.ModuleSetupFinish(StoreID, ModuleData, [Callback])
</syntaxhighlight>
where
* StoreID - module ID in the store of modules
* ModuleData - data required for installing a module (fields in Setup)
* Callback - a function to process errors that happened in the installation process (optional)
An example of a developed scanner for HDL modules. To install any module the following parameters are required: Type,SubNet id, Device id, module name, bus IP address, port.
<syntaxhighlight lang="javascript">
//Example of installing HDL Dimmer with a scanner
var l_nStoreID = 82;
var l_oModuleData = {
Module: {
//Data required for module work
Type: "Dimmer",
SubnetID: 3,
DeviceID: 6
Name: "HDL Dimmer"
}
Drivers: {
//Data for the driver
"HDL-BUS Pro Network (UDP)": {
Host: "255.255.255.255", //installing a host for the driver
Port: "6000" //installing a port for the driver
},
}
}

IR.ModuleSetupFinish(l_nStoreID, l_oModuleData, function(in_error){
if (!in_error){
...
} else {
...
}
});
</syntaxhighlight>
===Adding subdevices manually===
After adding the subdevices via the scanner or Setup, the user may have a need to add other subdevices. To ensure this, module developer has to assign the system variable
<syntaxhighlight lang="javascript">
SettingsPopupName = module.GetPopup('AddSubDevicePopup');
</syntaxhighlight >
К этой системной переменной надо привязать окно, с результатами работы сканера или попап, в котором пользователь может указать настройки нового подустройства и добавить это подустройство. Такой попап разработчик модуля должен разработать самостоятельно.<br/>
Если к указанной системной переменной привязан попап, то в разделе настроек модуля пользователь увидит кнопку "+", которая открывает указанный попап
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:AddSubdeviceBtn.png]]</div></div>
</div>
Пример указания окна добавления подустройств. При разработке, надо создавать окно добавления в разрешении планшета и отдельно окно в разрешении смартфона
<syntaxhighlight lang="javascript">
module.SettingsPopupName = IR.DisplayType != IR.DISPLAY_TYPE_TABLET? module.GetPopup("phone:NoAuthorize").Name: module.GetPopup("NoAuthorize").Name;
</syntaxhighlight >
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:AddSubdeviceWindow.png]]</div></div>
</div>
===Authorization===
To work with certain devices a user's authorization in a third-party system is required. i 3lite app has a special authorization mechanism for this purpose.<br/>
To authorize a user has to enter his access data in a special window. This window is unique for every device and a module developer must create it. A window to enter data is a popup with fields to enter data. The popup is created with the help of standard means of the studio and it may be unassigned to any subdevices. When access data are entered, the script must authorize in a third-party system and close the authorization window. After creating an authorization popup, a developer must call the authorization system variable in the script and assign the created popup in the variable.
<syntaxhighlight lang="javascript">
AuthorizationPopupName = module.GetPopup("AutorisationPopup");
</syntaxhighlight ><br/>
After an authorization popup is assigned to a variable, "Authorize" button appears in the module settings.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:NeedAuthorization1.png]]</div></div>
</div>
When this button is pressed, the app opens the authorization popup, assigned in the script. The next task for a module developer is to display a user's status (Authorized or not). There is a system variable to solve this task.
<syntaxhighlight lang="javascript">
AuthorizationStatus = true;
</syntaxhighlight ><br/>
If a user is authorized in the system, true value is assigned to the variable and the app changes the status of the authorization button into:
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Logout1.png]]</div></div>
</div>
A module devloper must also think about the mechanism of deauthorization. It is done on the authorization popup.<br/>
An example of the authorization script
<syntaxhighlight lang="javascript">
if (module.AuthorizationStatus == false) { //If a user is not authorized
module.AuthorizationPopupName = WindowSettings.Window.Name;//Assigning the authorization popup created earlier
} else if (module.AuthorizationStatus) //If a user is authorized
{
module.AuthorizationPopupName = IR.DisplayType != IR.DISPLAY_TYPE_TABLET? module.GetPopup("phone:deAuth").Name: module.GetPopup("deAuth").Name;//Showing the deauthorization popup
}
</syntaxhighlight ><br/>
Note. Remember to create a separate authorization/deauthorization popup for a smart phone and for a tablet.
===Changing settigns===
В ходе работы с приложением, может возникнуть потребность изменить настройки модуля. Для обеспечения такой возможностью, разработчик модуля должен создать функцию изменения настроек модуля и присвоить ее к системному методу
<syntaxhighlight lang="javascript">
module.ChangeProperties = function (in_oSetup)
{
обработка новых параметров модуля
}
</syntaxhighlight>
При объявлении такой функции, приложение добавит в модуль кнопку редактирования настроек модуля.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ChangeBtn.png]]</div></div>
</div>
Когда пользователь нажмет на данную кнопку, приложение откроет окно Setup, которое использовалось при установке модуля. В этом окне пользователь введет новые настройки и нажмет кнопку "готово". После этого приложение запустить указанную выше функцию. Настройки драйвера приложение сможет изменить самостоятельно, остальные же настройки разработчик модуля дулжен изменить вручную. Новые настройки записываются во входной параметр in_oSetup в виде JSON строки.<br/>
Также в данной функции необходимо обработать успешность изменения настроек. За это отвечает флаг
<syntaxhighlight lang="javascript">
module.FinishUpdateSettings = true;
</syntaxhighlight>
Если установка новых параметров прошла успешно, то надо выставить значение флага true, а обратном случае флаг должен принять значение false. Это позволяет приложению понять что смена параметров не удалась(если статус переменной будет false) и приложение отменит изменение настроек драйвера, вернув старые настройки<br/>
Пример обработки новых настроек модуля
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_MODULE_START, 0, function(){
module.ChangeProperties = function (in_oSetup, in_oModule) {
if (typeof (in_oSetup) == "string")
in_oSetup = JSON.Parse(in_oSetup);
var l_nChannel = in_oSetup.Module["Channel count"];
if (l_nChannel >= COUNT_CHANNEL) {
module.FinishUpdateSettings = true;
// Recreating element on cycle
for (var count = 1; count <= in_nChannel; count++) {

// Creating subDevice
l_oSubDevice = module.AddSubDevice("Relay " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_RELAY);

// Create revers
if (!l_oSubDevice.GetProperty("Reverse"))
l_oSubDevice.SetProperty("Reverse", 0);

// Assigned to the variable name of the channel
var l_sChannelName = "Relay:channel" + count;

// Adding channels
l_oSubDevice.AddChannel(l_sChannelName, Data);
l_oSubDevice.AddTag(l_sChannelName, Data);

// Adding smart virtual tag
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_TAG_POWER, true);
};
}
else {
for (var count = 1; count <= COUNT_CHANNEL; count++)
if (l_nChannel < count) {
var l_oDeleteSubDevice = module.GetSubDevice("Relay " + count);
module.DeleteSubDevice (l_oDeleteSubDevice.ID);
};
};
};
});
</syntaxhighlight>

Translations:DevManual/200/en

2017-04-17T04:39:22Z

Ildar:

After adding the subdevices via the scanner or Setup, the user may have a need to add other subdevices. To ensure this, module developer has to assign the system variable

DevManual/en

2017-04-17T04:38:36Z

Ildar: Новая страница: «After adding the subdevices via the scanner or Setup, the user may have a need to add additional subdevices. To ensure this, module developer has to assign the sy…»

<languages/>
=Module development guide=
==Definitions==

'''Module''' - is a component that allows you to control one type of equipment by its unique ID. The module is located in the store of modules.

'''Control panel (mobile device)''' - is a device from which the project i3 lite is launched (tablet, smartphone).

'''Store of modules''' - is a cloud server for uploading ready-made modules. The module store is available from the i3 lite application or on our[http://www.iridiummobile.ru/store/ site]

'''iRidium Studio''' - is a editor that allows to create the module to control device for i3 lite application. You need to use a special editor build for [http://www.iridiummobile.net/redirects/?go=iRidium_SETUP_LITE module developers] to develop the module

'''i3 lite''' - is an application to create, set and use i3 lite projects.

'''i3 lite project''' – is an automation project made up of ready equipment control modules. i3 lite projects differ from i2 Control projects: i3 lite projects can be edited dynamically without prior editing in iRidium Studio. i3 lite project consists of several small parts that can be put together into a single whole in i3 lite app with the help of the built-in constructor. It can also be easily edited in the app. As a result, a big number of intermediate processes are no longer necessary, such as installing software on PC, uploading projects on contol panels. All is done in one place - a control panel.

'''SubDevice''' - This is a virtual representation of the working area of the physical device. If we take as an example a 6-channel dimmer it has 6 sub-devices, because each independent device requires a separate control interface and connects to one channel.

'''Room (in i3 lite)''' - The visual part of i3 lite containing hardware management widgets. The project in i3 lite consists of rooms located on the floors

'''Widget''' - is a visual module component located in the room. It has limitations in size and fixed position in the room interface. It contains the main module functionality. For additional functions Remote is used.

'''Remote''' - is a visual module component which is hidden by default. It opens only when clicking on the corresponding item of the widget. It does not have size limitations (not more than the panel display size) and can be located in any part of the room interface (it is usually located in the middle of the panel display). It contains additional functionality of the module.

'''Macros''' - is a sequence of commands of various modules, which is activated by pressing. Contains "Action" and "Condition". For example, the macros "turn off all the lights in the house" will send the shutdown command to all devices responsible for lighting.

'''Routine''' - is a sequence of commands of various modules, which is activated automatically when a certain event occurs. Contains "Event", "Action" and "Condition". For example, "turn on the light if the motion sensor is triggered"

'''Event''' - is a routine component that describes the control command and the value range. If the value is sent in the indicated range, the routine is executed. For example, the event "Motion appeared" is activated if the motion sensor is triggered.

'''Action''' - is a component of macros and routines. It describes the control command and value that must be sent to the command. For example, "turn on the light". There are 2 types of Action: Simple Action and Advanced Action.

'''Simple Action''' - Simple Action is used when the command and Action value are known in advance.

'''Advanced Action''' - Advanced Action is used when the command is known but the value is unknown. The value is set dynamically when Action is used in i3 lite (but not when creating in iRidium studio).

'''Condition''' - is a component of macros and scenes. It describes the control command and value range. When a value from the value range is sent Action is executed.

'''Scanner''' - is a software part, that analyzes any bus looking for connected devices. Found connected devices are displayed in a list. Modules for the found devices are downloaded from iRidium store and the devices become available to control in i3 lite.
==Module concept==
The module is an independent subroutine of the i3 lite application which is built in the project and has an independent interface, driver and logic. Modules are developed in the [http://www.iridiummobile.net/redirects/?go=iRidium_SETUP_LITE iRidium Studio] editor and located in the module store [http://www.iridiummobile.ru/store/ iRidium Store]. Integrator downloads the module from the module store for each individual project.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ModuleInScheme.png]]</div></div>
</div>

There are two types of modules:
*Control module - module for hardware control
*Scanner - module for searching hardware in the local network and loading modules for found devices
== How to start developing the module ==
----

{{i}} Before starting your work, it is recommended to read [http://dev.iridiummobile.net/How_to_begin iRidium documentation]. It describes the basics of working with iRidium. The i3 lite documentation describes how to develop modules for the i3 lite platform for users, who already know iRidium. If you want to write script use [[Special:MyLanguage/Developers_API | i3 lite API]].
----

The module life cycle consists of:
* Developing the graphic part in iRidium studio
* Developing the driver part (scripts, devices)
* Testing
* Publishing in iRidium store
* Using (module download via the i3 lite application from the cloud and adding to automation projects)
<br/>
==Module structure ==
Each module must consist of subdevices. The subdevice is a virtual representation of the working area of a physical device. Many devices support multiple workgroups with the same functionality. Each workgroup may be in a separate zone. To fully control the zone, you need to create a subdevice for each workgroup of the device. For example, a 6-channel HDL dimmer contains 6 dimmable channels, through which 6 working groups can be controlled. Therefore, it is advisable to select in the module 6 subdevices for the possibility of creating actions, events and conditions for each workgroup separately. The presence of subdevice in the i3 lite module is obligatory. The number of sub-devices can be from one to many. Usually the number of subdevice is equal to the number of channels of the controller, the number of its work areas or logical devices.

Subdevice consists of:
* Conditions
* Actions
* Events
* Widgets

Conditions, actions and events are logical elements of the subdevice, on their basis macros and routines are created. Widget is a graphical element, through which the user will control subdevice. Usually one subdevice contains one widget, but the number of conditions, actions and events varies (from zero to many). The number of subdevices in the module can be either fixed or not. For example, you can develop a module only for a 6-channel dimmer, and you can make a module that will request the hardware for the number of subdevices and create the required number of subdevices.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ModuleStruct.png]]</div></div>
</div>
==Creating the module interface ==
The interface part of the midule consists of:
* widgets - interface part of the subdevice, which is located in the rooms and has basic control functions
* Remote - interface part of the module, which has a set of device functions and opens to the full screen, when you click on the widget button
* Authorization window - Authorization is required to work with some devices. To do this, the developer can create a special authorization window that is available in the module settings
* The module settings window is a window where you need to enter the parameters for the module operation
картинка окна настроек модуля и кнопки открытия
The whole graphic part is drawn in the graphical interface of the iRidium studio editor. In contradistinction to i3 pro, the module's interface should be made up of ready-made graphic components located in the gallery.

==== Widget ====

Widget is a visual component of the module, a kind of Popup that will be displayed in the room. The main task of the widget is to display the basic controls of the subdevice and to provide a module transition to the Remote control of the subdevice. For example, to control a media player, you can place a volume slider or Mute button for quick access to adjusting the volume. The weather widget can display the current weather, and the control panel will contain the weather forecast for all 5 days.<br />
The module does not make sense without widget, because it will not have a graphical representation in the i3 lite project.

Widget has a limited size
# Width '''640'''
# Height can not exceed '''1200'''

[[Файл:Пример виджета.png|center|thumb|Рис. Widget example]]

To create a widget, click the Add pop-up button in the Project overview panel and in the appeared menu select popup type: "Widget", set the name and properties:
[[Файл:ПанельПопап.png|thumb|center]]

Properties of a created widget can be changed with the help of '''Object Properties'''.<br />
Graphic items are assigned to channels like in popups:
[[Файл:Связывание_канала_команды_и_графического_элемента.png|center|thumb|Рис. Связывание канала команды и графического элемента]]
Widget will be displayed:
* In the room when a client uses the project
[[Файл:В_комнате_при_использовании_пользователем_проекта.png|center|thumb|]]
* In the module settings when it is added to the project:
[[Файл:И_в_настройках_модуля_при_добавлении_его_в_проект.png ‎|center|thumb|]]
====Remote and other graphic windows====

Remote (a remote control) is a graphical area to control SubDevices. Unlike wigets, it can have free size and position. And it is displayed on call. Remote is displayed when a button to go to the remote control is pressed on a widget.
Items to control equipment are placed on Remote (buttons, lists, switches, levels). There can be from 0 to several remote controls. Example of Remote:<br />
[[Файл:Пульт_управления.png ‎|center|thumb|]]<br />

Remote is created like a Widget. The only difference is to select "Remote" when you click "Add Popup Page" in the "Device Type" property.
==Interface design standard==
For the convenience of interface design, a standard was developed in which graphic windows should be developed in the module so that the modules of different developers looked uniformly within the framework of one project.
===Basic principles===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:GeneralUI.png]]</div></div>
<div class="col-sm-12 col-md-6">
Виджет состоит из «Header» и дополнительных модулей основного функционала. <br/>
«Header» — верхний модуль виджета.<br/>
«Header» содержит:<br/>
- наименование виджета;
- наименование устройства, которым<br/>
управляет виджет;<br/>
- иконка категории устройства.<br/>
<br/>
Дополнительные модули содержат элементы управления устройством.
</div>
</div>
===Module grid and blocks===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka1.png]]</div></div>
<div class="col-sm-12 col-md-6">
Module grid widget is a block 640 pt wide
And 120 pt in height. Each block has a grid of 8x8 pt.
The rounding of the corners is 12.5 ut. (Circle 25)
</div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka2.png]]</div></div>
<div class="col-sm-12 col-md-6">
The principle of constructing a widget block is a constructor from
Controls (buttons, switches, labels) from smaller to larger.
</div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka3.png]]</div></div>
<div class="col-sm-12 col-md-6">
Control items are combined and united in a block, blocks are united into a control panel.
</div>
</div>
===Buttons===
<big>'''Toggle'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Toggle.png]]</div></div>
<div class="col-sm-12 col-md-6">
Кнопка изменения значения «вкл/выкл». Применяется для отправки команды на устройство, вне зависимости от его текущего состояния.
</div>
</div>
<big>'''Switch'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Switch.png]]</div></div>
<div class="col-sm-12 col-md-6">
«On/off» switch. It is used only when the currect device status is known.
</div>
</div>
<big>'''Multistate'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Multistate.png]]</div></div>
<div class="col-sm-12 col-md-6">
Multistate button is used only when the current device status is known.
</div>
</div>
===Arrow-button===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:arrow1.png]]</div></div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:arrow2.png]]</div></div>
</div>
'''Действие кнопки'''<br/>
При нажатии на кнопку происходит вызов «PopUp».<br/>
'''Содержимое «PopUp»'''<br/>
«Input field», «Single selection», «Multiple selection».
===Sliders===
<div class="row">
<div class="col-sm-12 col-md-6">
Standart
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:StandartSlider.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
Value
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ValueSlider.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
Progress
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ProgressSlider.png]]</div></div>
</div>
===Description===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Description.png]]</div></div>
===Icons===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Icons1.png]]</div></div>
All icons are devided by their spheres of use, their main differene is the size.
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Icons2.png]]</div></div>
===«Header» widget===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:WidgetHeader.png]]</div></div>
===Icon location===
<div class="row">
<div class="col-sm-12 col-md-6">
The standard is 128х120 pt
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:FormFactor.png]]</div></div>
</div>
All buttons have two states - active and inactive
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:OFFicon.png]]</div></div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ONicon.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
When the button in inactive the color is always # 848484 or RGB 132
</div>
<div class="col-sm-12 col-md-6">
The state of a button is considered active, when the action received feedback and is short or instant (e.g. «Play» in a media player) or an acrion that is active for a long time and demands another activity to switch off the active state (e.g. «Repeat» in a media player).
</div>
</div>
==Basics of working with scripts==

To design an interface and to add a driver, you are to develop the logics of module work via script. The script part of developing i3 lite modules has a number of special features. Before developing the script part of i3 lite modules, please, read [http://dev.iridiummobile.net/JS_Guide iRidium Pro API] and [[Special:MyLanguage/Developers_API | i3 lite API]]. <br />

A module can contain any number of scripts. There are several types of scripts for modules:
* Driver - script files of this type contain script, responsible for working with a driver
* GUI - script files of this type contain script, responsible for working with graphics
* Common - script files of this type must contain general scripts, such as a set of additional functions or a description of classes of secondary importance
* Setup - a special script file that contains information about module setting, a list of fields that are obligatory to fill in, types of these fields and functions that check the correctness of entered data.

Devision into types is necessary for the module correct work on the server. Only logics and the driver part work on the server, but the server knows nothing about the graphic part. That's why a module developer has to devide scripts into types. The server does not notice files for working with the graphic part. <br />

When modules are developed module names have to be used instead of IR. Thus, a listener looks this way module.AddListener… <br />

Каждый скриптовой файл должен начинаться со слушателя
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_MODULE_START, 0, function(){});
</syntaxhighlight>
Это новый вид события, предназначенный специально для разработки модуля. При разработке модуля следует учитывать что скриптовой файл стал закрыт для других скриптовых файлов. Это хзначить что теперь можно использовать одноименные переменные и названия функций в разных скриптовых файлах и они не будут перезаписываться, но это накладывает ограничение: нельзя получить доступ к функции из другого скриптового файла простым способом. Для получения доступа к функции из другого скриптового файла, следует импортировать скриптовый файл с помощью команды module.Import("FileName.js"). <br />
Example:<br/>
<syntaxhighlight lang="javascript">
//Name_1.js - first js file
this.Text = "Hello, world!"; //Pointer to a text variable
//Name_2.js - second js file
var Text = module.Import("Name_1.js").Text; //Importing an object with a pointer to a text variable from the first js file
IR.Log(Text); //"Hello, world!" //log the text variable
</syntaxhighlight>
==Creating a subdevice==
The basis of every module is subdevices. The task of every module developer is to define how many subdevices a module has and to develop the logics of subdevice work. Each subdevice may contain a widget, a remote control, a set of actions, events and states. All contents of a subdevice have to be indicated when a subdevice is created. Subdevice contents can't be changed during module work. The following command is used to create a subdevice:<br/>
<syntaxhighlight lang="javascript">
module.AddSubDevice(SystemName, [Device], [System], [Type], [Tags], [Name], [Callback]);
</syntaxhighlight>
where<br/>
'''SystemName''' - subdevice system name<br/>
'''Device''' - a driver to which a subdevice will be assigned<br/>
'''System''' - old parameter, "false" is to be used<br/>
'''Type''' - type of smart device. Parameter is under development<br/>
'''Tags''' - Array of virtual tag objects<br/>
'''Name''' - subdevice name that is displayed to the user<br/>
'''Callback function(){do somethings}''' - a function that is on till the IR.EVENT_ADD_SUBDEVICE event happens.<br/>
As a reply the function returns a link to a subdevice, that can be used to address it.<br/>
An example of creating subdevices for HDL Relay devices. The script checks th number of devices in the bus and creates subdevices.<br/>
<syntaxhighlight lang="javascript">
for (var count = 1; count <= COUNT_CHANNEL; count++) {
// Creating a subdevice
l_oSubDevice = module.AddSubDevice("Relay " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_RELAY);
// Creating StatusOnStart command
if (count == 1)
l_oSubDevice.AddChannel("Relay:statusOnStart", [ChannelData]);
var l_sChannelName = "Relay:channel" + count;
// Adding channels
l_oSubDevice.AddChannel(l_sChannelName, [ChannelData]);
l_oSubDevice.AddTag(l_sChannelName, [ChannelData]);
// Add a virtual tag
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_TAG_POWER, true);
};</syntaxhighlight><br/>
Everything that is required can be added to a subdevice this way. An event is activated when a subdevice is created.<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function, [pointer]);
</syntaxhighlight><br/>
A link to a subdevice that was created is sent to a function. Different components can be added to subdevice in this event, such as, actions, events, states, widgets, chanels, tags. For example,<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function(in_oSubDevice){
Creating actions
in_oSubDevice.AddAction("On", false, in_oSubDevice.SystemName + "_Power", lightID + "_1", IR.SUB_DEVICE_COMMAND_POWER_ON);
in_oSubDevice.AddAction("Off", false, in_oSubDevice.SystemName + "_Power", lightID + "_0", IR.SUB_DEVICE_COMMAND_POWER_OFF);
Creating events
in_oSubDevice.AddEvent("On", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "1");
in_oSubDevice.AddEvent("Off", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "0");
Creating states
in_oSubDevice.AddCondition("On", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "1");
in_oSubDevice.AddCondition("Off", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "0");
});</syntaxhighlight><br/>
Thus, a developer can create the required number of subdevices when a module is installed or when new subdevices are added manually.
==Adding a widget to a subdevice==

After an interface is created in the studio and a function to add subdevices is added, create a copy of a widget for each subdevice and assign it to the subdevice. To assign a widget to a subdevice the following method is used.<br/>
<syntaxhighlight lang="javascript">SubDevice.addWidget(in_Widget)</syntaxhighlight><br/>


The input parameter of the method is '''in_Widget''' - an object, a widget, created in the studio beforehand.<br />
The output parameter of the method is '''True''' or '''False''' (successful or not).<br />
For example, we have 3 lamps. Not to create a separate wiget for each lamp, use a ready template and clone it. Here is an example of creating widgets with the help of a code using the existing template .<br />

Clone method allows to clone an existing popup.<br/>
<syntaxhighlight lang="javascript">Module.ClonePopup (in_Popup, in_Name)</syntaxhighlight><br/>
Входные параметры метода:
*'''in_Name''' - имя нового виджета.<br/>
*'''in_Popup''' - ссылка на всплывающее окно.<br/>
Выходным параметром метода является: успешно или нет ('''True''', '''False''').<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function(in_oSubDevice){
var popup = module.GetPopup("Dimmer"); // Calling a widget that we want to clone
// Creating a widget using cloning method
var widget = in_oSubDevice.addWidget(module.ClonePopup(popup, "Dimmer"+ in_oSubDevice.Name));
});</syntaxhighlight><br/>
----
{{i}} Names of new widgets must not be repeated
----
When a complete remote control is opened it is necessary to remmeber that a user will use the module both on a tablet and on a smart phone. The difference betwen the screen sizes makes a developer design 2 types of windows: a version for smart phones and a version for tablets. In addition a method must be added to the script that asks the system about the type of device where a module is launched and open the required window.
<syntaxhighlight lang="javascript">
if (IR.DisplayType == IR.DISPLAY_TYPE_PHONE) { //If a module is opened on a smart phone
var l_oPopupScanner = module.GetPopup("Phone"); //show a popup created for a smart phone
}
else {
var l_oPopupScanner = module.GetPopup("Tablet");//If a module is opened on a tablet, show a popup for a tablet
}
</syntaxhighlight><br/>
==Work with channels and tags==
After creating a subdevice and adding a widget you must add to the subevice channels and tags required for its work. Like in i3 pro version, a driver can be added in the studio or via script. Each subdevice requires a personal set of channels and tags for the selected driver. You may work with the following three components:<br/>
*Channel. The following method is used to create a channel<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddChannel(Name, DataArray)
</syntaxhighlight>where<br/>
'''Name''' - channel name<br/>
'''DataArray''' - data array (specific for every driver)<br/>
*Tag The following method is used to create a tag<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddTag(Name, DataArray)
</syntaxhighlight>where<br/>
'''Name''' - tag name<br/>
'''DataArray''' - data array, specific for every driver<br/>
*Virtual tag. The following method if used to create a virtual tag<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddVirtualTag(Name, Value, [Edit], [smartID], [Hidden])
</syntaxhighlight>where<br/>
'''Name'''- name of a subdevice virtual tag<br/>
'''Value''' - Tag value<br/>
'''Edit''' - Permission to edit a tag<br/>
'''smartID''' - Parameter is under development! Set "false"<br/>
'''Hidden''' - Feature of a hidden tag<br/>
===An example of creating channels and tags when creating a subdevice===
<syntaxhighlight lang="javascript">
l_oSubDevice = module.AddSubDevice("Light " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_DIMMER);

// Adding channel StatusOnStart
if (count == 1)
l_oSubDevice.AddChannel("Dimmer:statusOnStart", [ChannelData]);

// Assigned to the variable name of the channel
var l_sChannelName = "Dimmer:channel" + count;

// Adding channels
l_oSubDevice.AddChannel(l_sChannelName, [ChannelData]);
l_oSubDevice.AddTag(l_sChannelName, [TagData]);

// Adding smart virtual tag
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_COMMAND_POWER, true);
l_oSubDevice.AddVirtualTag("Power On", 0, false, IR.SUB_DEVICE_COMMAND_POWER_ON, true);
l_oSubDevice.AddVirtualTag("Power Off", 0, false, IR.SUB_DEVICE_COMMAND_POWER_OFF, true);
l_oSubDevice.AddVirtualTag("Level", 0, false, IR.SUB_DEVICE_COMMAND_LEVEL, true);
</syntaxhighlight>
==Setting a module in the app==
Modules are stored in iRidium store and can be installed in the app using one of the following ways:<br/>
*With the help of a scanner<br/>
*Manually<br/>
===Developing the Setup file===
The Setup file must be developed for each variant. It's a special script file with fields that are required for module work. These fields can be device IP address, port, city name, etc. To develop a Setup file, create a new script file and select its type - "Setup". Eacn field is a tag and can be accessed from the script, and the input value can be received.
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:СетапБонго.png]]</div></div>
The Setup file consists of 2 parts. Part 1 is the driver settings. The settings must require IP addresses, ports and logins to connect the driver to a device. Part 2 is the module general settings, such as number of outputs, access keys.
To set fields in the Setip file set the following fields in the script:
* Field type - indicate what field must be shown to a user (text field, data array, etc. Detailed description is given in API)
* Field name - name of field that a user sees when setting a module
* Default value - what value must be put by default
* Check function - a function to validate value in the field. A function must be written that checks the correctness of the entered data.
For example,"Setup" script for HDL module looks this way:
<syntaxhighlight lang="javascript">
{
// Data to connect drivers, created in Project Device Panel
Drivers:
[
{
Name: "HDL-BUS Pro Network (UDP)",
Properties:
[
{
Type: "textfield",
Name: "Host",
DefaultValue: "255.255.255.255",
Validation: function(in_sValue) {
var l_aValueHost = in_sValue.split(".");
if (l_aValueHost.length != 4) {
return "Please input correct Host";
} else
if (parseInt(l_aValueHost[0], 10)>=0
&& parseInt(l_aValueHost[0], 10)<=255
&& parseInt(l_aValueHost[1], 10)>=0
&& parseInt(l_aValueHost[1], 10)<=255
&& parseInt(l_aValueHost[2], 10)>=0
&& parseInt(l_aValueHost[2], 10)<=255
&& parseInt(l_aValueHost[3], 10)>=0
&& parseInt(l_aValueHost[3], 10)<=255
)
return 0
else
return "Please input correct Host";
}
},
{
Type: "textfield",
Name: "Port",
DefaultValue: "6000",
Validation: function(in_sValue) {
if(parseInt(in_sValue, 10)>=0)
return 0
else
return "Please input correct Port";
}
}
]
}
],

// General information for the module (driver and generated by script)
Module: [{
Name: "Channels Count",
Validation: function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input Count";
}
},
{
Type: "textfield",
Name : "SubnetID",
Validation : function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input SubnetID";
}
},
{
Type: "textfield",
Name : "DeviceID",
Validation : function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input DeviceID";
}
}

]
}
</syntaxhighlight>
To get data from Setup fields use the following function
<syntaxhighlight lang="javascript">
module.GetProperty("Field name")
</syntaxhighlight>
<br />
Besides standard parameters, any parameters required for module inizialization can be asked. Driver parameters are set in the driver automatically. The other parameters are to be asked and used manually.<br />
An example of work with Setup parameters
<syntaxhighlight lang="javascript">
var COUNT_CHANNEL = parseInt(module.GetProperty("Channel count")); // Getting count channel
var SubNetID = parseInt(module.GetProperty("SubnetID")); // Getting subnet id
var DeviceID = parseInt(module.GetProperty("DeviceID")); // Getting device id
</syntaxhighlight>
===Installing a module manually===
To install a module manually no additional script development is required. A user must go to iRidium store from the app, find a module, download it and enter date in the fields indicated in the Setup file. After it the app installs the module in the system with parameters entered by a user.
===Installing a module with the help of a scanner===
'''Scanner (сканер)''' - это модуль, который анализирует какую-либо шину на подключённые устройства либо ищет устройства в локальной сети. Найденные устройства формируются в список, для выбранного устройства качается модуль и становится доступен в i3 lite. <br/>
Схема работы сканера:
# Сканер загружается из магазина;
# Пользователь вводит параметры сканера (IP, Port и т.д) и эти параметры передаются в скрипт сканера;
# Сканер, обработав введенные параметры, опрашивает шину на устройства или ищет устройства в локальной сети;
# Из полученных устройств формируется список;
# При выборе определенного устройства в списке, сканер передаёт параметры выбранного устройства в модуль.
<br/>
При разработке сканера нужно учесть:
* Параметры сканера, при добавлении из магазина;
* Логику сканера;
* Передачу параметров выбранного устройства в модуль;
* Логику модуля, с учётом переданных от сканера параметров.
<br/>
Процесс разработки сканера ничем не отличается от разработки модуля. Точно также сканеру необходимо нарисовать визуальную часть, создать драйвер и написать скрипт с логикой. Основным отличием является то, что сканер может работать только на панели управления и сканер никогда не будет запущен на сервере, поэтому, при разработке скриптов, нет необходимости разделять скрипты на драйверные и интерфейсные.
<br/>
Также при разработке сканера появляется новая логика работы. Первым делом необходимо сделать модуль для управления устройством, далее надо загрузить модуль в магазин модулей. При загрузке модуля, вы увидите уникальный идентификатор вашего модуля. Когда вы будете разрабатывать сканер, вам необходимо написать скрипт со следующей логикой:
# Создание драйвера
# Поиск оборудования
# Если оборудование найдено, надо определить что это за оборудование
# При помощи команды ModuleSetupFinish (ID модуля, js объект с настройками setup данного модуля)
После этого приложение скачет модуль из магазина модулей и установит его.<br/>
The distinctive feature of developing a scanner is the event that lauches the driver work. When developing a scanner use the following event
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_OPEN_SCANNER, 0, function (){});
</syntaxhighlight>
A scanner must be developed after modules are developed. The developed modules are registered in the store of modules and are given a unique ID. After a scanner finds devices in the local net, the script must download a module for the found equipment by the indicated ID. To download a module use the following function
<syntaxhighlight lang="javascript">
IR.ModuleSetupFinish(StoreID, ModuleData, [Callback])
</syntaxhighlight>
where
* StoreID - module ID in the store of modules
* ModuleData - data required for installing a module (fields in Setup)
* Callback - a function to process errors that happened in the installation process (optional)
An example of a developed scanner for HDL modules. To install any module the following parameters are required: Type,SubNet id, Device id, module name, bus IP address, port.
<syntaxhighlight lang="javascript">
//Example of installing HDL Dimmer with a scanner
var l_nStoreID = 82;
var l_oModuleData = {
Module: {
//Data required for module work
Type: "Dimmer",
SubnetID: 3,
DeviceID: 6
Name: "HDL Dimmer"
}
Drivers: {
//Data for the driver
"HDL-BUS Pro Network (UDP)": {
Host: "255.255.255.255", //installing a host for the driver
Port: "6000" //installing a port for the driver
},
}
}

IR.ModuleSetupFinish(l_nStoreID, l_oModuleData, function(in_error){
if (!in_error){
...
} else {
...
}
});
</syntaxhighlight>
===Adding subdevices manually===
After adding the subdevices via the scanner or Setup, the user may have a need to add additional subdevices. To ensure this, module developer has to assign the system variable
<syntaxhighlight lang="javascript">
SettingsPopupName = module.GetPopup('AddSubDevicePopup');
</syntaxhighlight >
К этой системной переменной надо привязать окно, с результатами работы сканера или попап, в котором пользователь может указать настройки нового подустройства и добавить это подустройство. Такой попап разработчик модуля должен разработать самостоятельно.<br/>
Если к указанной системной переменной привязан попап, то в разделе настроек модуля пользователь увидит кнопку "+", которая открывает указанный попап
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:AddSubdeviceBtn.png]]</div></div>
</div>
Пример указания окна добавления подустройств. При разработке, надо создавать окно добавления в разрешении планшета и отдельно окно в разрешении смартфона
<syntaxhighlight lang="javascript">
module.SettingsPopupName = IR.DisplayType != IR.DISPLAY_TYPE_TABLET? module.GetPopup("phone:NoAuthorize").Name: module.GetPopup("NoAuthorize").Name;
</syntaxhighlight >
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:AddSubdeviceWindow.png]]</div></div>
</div>
===Authorization===
To work with certain devices a user's authorization in a third-party system is required. i 3lite app has a special authorization mechanism for this purpose.<br/>
To authorize a user has to enter his access data in a special window. This window is unique for every device and a module developer must create it. A window to enter data is a popup with fields to enter data. The popup is created with the help of standard means of the studio and it may be unassigned to any subdevices. When access data are entered, the script must authorize in a third-party system and close the authorization window. After creating an authorization popup, a developer must call the authorization system variable in the script and assign the created popup in the variable.
<syntaxhighlight lang="javascript">
AuthorizationPopupName = module.GetPopup("AutorisationPopup");
</syntaxhighlight ><br/>
After an authorization popup is assigned to a variable, "Authorize" button appears in the module settings.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:NeedAuthorization1.png]]</div></div>
</div>
When this button is pressed, the app opens the authorization popup, assigned in the script. The next task for a module developer is to display a user's status (Authorized or not). There is a system variable to solve this task.
<syntaxhighlight lang="javascript">
AuthorizationStatus = true;
</syntaxhighlight ><br/>
If a user is authorized in the system, true value is assigned to the variable and the app changes the status of the authorization button into:
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Logout1.png]]</div></div>
</div>
A module devloper must also think about the mechanism of deauthorization. It is done on the authorization popup.<br/>
An example of the authorization script
<syntaxhighlight lang="javascript">
if (module.AuthorizationStatus == false) { //If a user is not authorized
module.AuthorizationPopupName = WindowSettings.Window.Name;//Assigning the authorization popup created earlier
} else if (module.AuthorizationStatus) //If a user is authorized
{
module.AuthorizationPopupName = IR.DisplayType != IR.DISPLAY_TYPE_TABLET? module.GetPopup("phone:deAuth").Name: module.GetPopup("deAuth").Name;//Showing the deauthorization popup
}
</syntaxhighlight ><br/>
Note. Remember to create a separate authorization/deauthorization popup for a smart phone and for a tablet.
===Changing settigns===
В ходе работы с приложением, может возникнуть потребность изменить настройки модуля. Для обеспечения такой возможностью, разработчик модуля должен создать функцию изменения настроек модуля и присвоить ее к системному методу
<syntaxhighlight lang="javascript">
module.ChangeProperties = function (in_oSetup)
{
обработка новых параметров модуля
}
</syntaxhighlight>
При объявлении такой функции, приложение добавит в модуль кнопку редактирования настроек модуля.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ChangeBtn.png]]</div></div>
</div>
Когда пользователь нажмет на данную кнопку, приложение откроет окно Setup, которое использовалось при установке модуля. В этом окне пользователь введет новые настройки и нажмет кнопку "готово". После этого приложение запустить указанную выше функцию. Настройки драйвера приложение сможет изменить самостоятельно, остальные же настройки разработчик модуля дулжен изменить вручную. Новые настройки записываются во входной параметр in_oSetup в виде JSON строки.<br/>
Также в данной функции необходимо обработать успешность изменения настроек. За это отвечает флаг
<syntaxhighlight lang="javascript">
module.FinishUpdateSettings = true;
</syntaxhighlight>
Если установка новых параметров прошла успешно, то надо выставить значение флага true, а обратном случае флаг должен принять значение false. Это позволяет приложению понять что смена параметров не удалась(если статус переменной будет false) и приложение отменит изменение настроек драйвера, вернув старые настройки<br/>
Пример обработки новых настроек модуля
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_MODULE_START, 0, function(){
module.ChangeProperties = function (in_oSetup, in_oModule) {
if (typeof (in_oSetup) == "string")
in_oSetup = JSON.Parse(in_oSetup);
var l_nChannel = in_oSetup.Module["Channel count"];
if (l_nChannel >= COUNT_CHANNEL) {
module.FinishUpdateSettings = true;
// Recreating element on cycle
for (var count = 1; count <= in_nChannel; count++) {

// Creating subDevice
l_oSubDevice = module.AddSubDevice("Relay " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_RELAY);

// Create revers
if (!l_oSubDevice.GetProperty("Reverse"))
l_oSubDevice.SetProperty("Reverse", 0);

// Assigned to the variable name of the channel
var l_sChannelName = "Relay:channel" + count;

// Adding channels
l_oSubDevice.AddChannel(l_sChannelName, Data);
l_oSubDevice.AddTag(l_sChannelName, Data);

// Adding smart virtual tag
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_TAG_POWER, true);
};
}
else {
for (var count = 1; count <= COUNT_CHANNEL; count++)
if (l_nChannel < count) {
var l_oDeleteSubDevice = module.GetSubDevice("Relay " + count);
module.DeleteSubDevice (l_oDeleteSubDevice.ID);
};
};
};
});
</syntaxhighlight>

Translations:DevManual/200/en

2017-04-17T04:38:35Z

After adding the subdevices via the scanner or Setup, the user may have a need to add additional subdevices. To ensure this, module developer has to assign the system variable

Translations:DevManual/Page display title/en

2017-04-11T07:28:26Z

Ildar:

DevManual

Translations:DevManual/Page display title/en

2017-04-11T07:01:50Z

Ildar: Новая страница: «Инструкция для разработчиков»

Инструкция для разработчиков

DevManual/en

2017-04-03T10:56:35Z

Ildar: Новая страница: «The principle of constructing a widget block is a constructor from Controls (buttons, switches, labels) from smaller to larger.»

<languages/>
=Module development guide=
==Definitions==

'''Module''' - is a component that allows you to control one type of equipment by its unique ID. The module is located in the store of modules.

'''Control panel (mobile device)''' - is a device from which the project i3 lite is launched (tablet, smartphone).

'''Store of modules''' - is a cloud server for uploading ready-made modules. The module store is available from the i3 lite application or on our[http://www.iridiummobile.ru/store/ site]

'''iRidium Studio''' - is a editor that allows to create the module to control device for i3 lite application. You need to use a special editor build for [http://www.iridiummobile.net/redirects/?go=iRidium_SETUP_LITE module developers] to develop the module

'''i3 lite''' - is an application to create, set and use i3 lite projects.

'''i3 lite project''' – is an automation project made up of ready equipment control modules. i3 lite projects differ from i2 Control projects: i3 lite projects can be edited dynamically without prior editing in iRidium Studio. i3 lite project consists of several small parts that can be put together into a single whole in i3 lite app with the help of the built-in constructor. It can also be easily edited in the app. As a result, a big number of intermediate processes are no longer necessary, such as installing software on PC, uploading projects on contol panels. All is done in one place - a control panel.

'''SubDevice''' - This is a virtual representation of the working area of the physical device. If we take as an example a 6-channel dimmer it has 6 sub-devices, because each independent device requires a separate control interface and connects to one channel.

'''Room (in i3 lite)''' - The visual part of i3 lite containing hardware management widgets. The project in i3 lite consists of rooms located on the floors

'''Widget''' - is a visual module component located in the room. It has limitations in size and fixed position in the room interface. It contains the main module functionality. For additional functions Remote is used.

'''Remote''' - is a visual module component which is hidden by default. It opens only when clicking on the corresponding item of the widget. It does not have size limitations (not more than the panel display size) and can be located in any part of the room interface (it is usually located in the middle of the panel display). It contains additional functionality of the module.

'''Macros''' - is a sequence of commands of various modules, which is activated by pressing. Contains "Action" and "Condition". For example, the macros "turn off all the lights in the house" will send the shutdown command to all devices responsible for lighting.

'''Routine''' - is a sequence of commands of various modules, which is activated automatically when a certain event occurs. Contains "Event", "Action" and "Condition". For example, "turn on the light if the motion sensor is triggered"

'''Event''' - is a routine component that describes the control command and the value range. If the value is sent in the indicated range, the routine is executed. For example, the event "Motion appeared" is activated if the motion sensor is triggered.

'''Action''' - is a component of macros and routines. It describes the control command and value that must be sent to the command. For example, "turn on the light". There are 2 types of Action: Simple Action and Advanced Action.

'''Simple Action''' - Simple Action is used when the command and Action value are known in advance.

'''Advanced Action''' - Advanced Action is used when the command is known but the value is unknown. The value is set dynamically when Action is used in i3 lite (but not when creating in iRidium studio).

'''Condition''' - is a component of macros and scenes. It describes the control command and value range. When a value from the value range is sent Action is executed.

'''Scanner''' - is a software part, that analyzes any bus looking for connected devices. Found connected devices are displayed in a list. Modules for the found devices are downloaded from iRidium store and the devices become available to control in i3 lite.
==Module concept==
The module is an independent subroutine of the i3 lite application which is built in the project and has an independent interface, driver and logic. Modules are developed in the [http://www.iridiummobile.net/redirects/?go=iRidium_SETUP_LITE iRidium Studio] editor and located in the module store [http://www.iridiummobile.ru/store/ iRidium Store]. Integrator downloads the module from the module store for each individual project.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ModuleInScheme.png]]</div></div>
</div>

There are two types of modules:
*Control module - module for hardware control
*Scanner - module for searching hardware in the local network and loading modules for found devices
== How to start developing the module ==
----

{{i}} Before starting your work, it is recommended to read [http://dev.iridiummobile.net/How_to_begin iRidium documentation]. It describes the basics of working with iRidium. The i3 lite documentation describes how to develop modules for the i3 lite platform for users, who already know iRidium. If you want to write script use [[Special:MyLanguage/Developers_API | i3 lite API]].
----

The module life cycle consists of:
* Developing the graphic part in iRidium studio
* Developing the driver part (scripts, devices)
* Testing
* Publishing in iRidium store
* Using (module download via the i3 lite application from the cloud and adding to automation projects)
<br/>
==Module structure ==
Each module must consist of subdevices. The subdevice is a virtual representation of the working area of a physical device. Many devices support multiple workgroups with the same functionality. Each workgroup may be in a separate zone. To fully control the zone, you need to create a subdevice for each workgroup of the device. For example, a 6-channel HDL dimmer contains 6 dimmable channels, through which 6 working groups can be controlled. Therefore, it is advisable to select in the module 6 subdevices for the possibility of creating actions, events and conditions for each workgroup separately. The presence of subdevice in the i3 lite module is obligatory. The number of sub-devices can be from one to many. Usually the number of subdevice is equal to the number of channels of the controller, the number of its work areas or logical devices.

Subdevice consists of:
* Conditions
* Actions
* Events
* Widgets

Conditions, actions and events are logical elements of the subdevice, on their basis macros and routines are created. Widget is a graphical element, through which the user will control subdevice. Usually one subdevice contains one widget, but the number of conditions, actions and events varies (from zero to many). The number of subdevices in the module can be either fixed or not. For example, you can develop a module only for a 6-channel dimmer, and you can make a module that will request the hardware for the number of subdevices and create the required number of subdevices.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ModuleStruct.png]]</div></div>
</div>
==Creating the module interface ==
The interface part of the midule consists of:
* widgets - interface part of the subdevice, which is located in the rooms and has basic control functions
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:WidgetExample.png]]</div></div>
</div>
* Remote - interface part of the module, which has a set of device functions and opens to the full screen, when you click on the widget button
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:RemoteExample.png]]</div></div>
</div>
* Authorization window - Authorization is required to work with some devices. To do this, the developer can create a special authorization window that is available in the module settings
картинка кнопки авторизации и окна авторизации
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:AutorisationExample.png]]</div></div>
</div>
* The module settings window is a window where you need to enter the parameters for the module operation
картинка окна настроек модуля и кнопки открытия
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:SettingsExample.png]]</div></div>
</div>
The whole graphic part is drawn in the graphical interface of the iRidium studio editor. In contradistinction to i3 pro, the module's interface should be made up of ready-made graphic components located in the gallery.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ItemGallery.png]]</div></div>
</div>

==== Widget ====

Widget is a visual component of the module, a kind of Popup that will be displayed in the room. The main task of the widget is to display the basic controls of the subdevice and to provide a module transition to the Remote control of the subdevice. For example, to control a media player, you can place a volume slider or Mute button for quick access to adjusting the volume. The weather widget can display the current weather, and the control panel will contain the weather forecast for all 5 days.<br />
The module does not make sense without widget, because it will not have a graphical representation in the i3 lite project.

Widget has a limited size
# Width '''640'''
# Height can not exceed '''1200'''

[[Файл:Пример виджета.png|center|thumb|Рис. Widget example]]

To create a widget, click the Add pop-up button in the Project overview panel and in the appeared menu select popup type: "Widget", set the name and properties:
[[Файл:ПанельПопап.png|thumb|center]]

Properties of a created widget can be changed with the help of '''Object Properties'''.<br />
Graphic items are assigned to channels like in popups:
[[Файл:Связывание_канала_команды_и_графического_элемента.png|center|thumb|Рис. Связывание канала команды и графического элемента]]
Widget will be displayed:
* In the room when a client uses the project
[[Файл:В_комнате_при_использовании_пользователем_проекта.png|center|thumb|]]
* In the module settings when it is added to the project:
[[Файл:И_в_настройках_модуля_при_добавлении_его_в_проект.png ‎|center|thumb|]]
====Remote and other graphic windows====

Remote (a remote control) is a graphical area to control SubDevices. Unlike wigets, it can have free size and position. And it is displayed on call. Remote is displayed when a button to go to the remote control is pressed on a widget.
Items to control equipment are placed on Remote (buttons, lists, switches, levels). There can be from 0 to several remote controls. Example of Remote:<br />
[[Файл:Пульт_управления.png ‎|center|thumb|]]<br />

Remote is created like a Widget. The only difference is to select "Remote" when you click "Add Popup Page" in the "Device Type" property.
==Interface design standard==
For the convenience of interface design, a standard was developed in which graphic windows should be developed in the module so that the modules of different developers looked uniformly within the framework of one project.
===Basic principles===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:GeneralUI.png]]</div></div>
<div class="col-sm-12 col-md-6">
Виджет состоит из «Header» и дополнительных модулей основного функционала. <br/>
«Header» — верхний модуль виджета.<br/>
«Header» содержит:<br/>
- наименование виджета;
- наименование устройства, которым<br/>
управляет виджет;<br/>
- иконка категории устройства.<br/>
<br/>
Дополнительные модули содержат элементы управления устройством.
</div>
</div>
===Module grid and blocks===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka1.png]]</div></div>
<div class="col-sm-12 col-md-6">
Module grid widget is a block 640 pt wide
And 120 pt in height. Each block has a grid of 8x8 pt.
The rounding of the corners is 12.5 ut. (Circle 25)
</div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka2.png]]</div></div>
<div class="col-sm-12 col-md-6">
The principle of constructing a widget block is a constructor from
Controls (buttons, switches, labels) from smaller to larger.
</div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka3.png]]</div></div>
<div class="col-sm-12 col-md-6">
Элементы управления комбинируются и объединяются в блок,
а блоки объединяются в панель управления.
</div>
</div>
===Кнопки===
<big>'''Toggle'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Toggle.png]]</div></div>
<div class="col-sm-12 col-md-6">
Кнопка изменения значения «вкл/выкл». Применяется как в случаях с неизвестным состоянием работы устройства, так и для управления функционалом устройства.
</div>
</div>
<big>'''Switch'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Switch.png]]</div></div>
<div class="col-sm-12 col-md-6">
Кнопка изменения значения «вкл/выкл». Применяется только в случаях с известным состоянием работы устройства.
</div>
</div>
<big>'''Multistate'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Multistate.png]]</div></div>
<div class="col-sm-12 col-md-6">
Кнопка изменения значения предустановленного состояния устройства применяется только в случаях с известным cостоянием работы устройства.
</div>
</div>
===Кнопка-стрелка===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:arrow1.png]]</div></div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:arrow2.png]]</div></div>
</div>
'''Действие кнопки'''<br/>
При нажатии на кнопку происходит вызов «PopUp».<br/>
'''Содержимое «PopUp»'''<br/>
«Input field», «Single selection», «Multiple selection».
===Слайдеры===
<div class="row">
<div class="col-sm-12 col-md-6">
Standart
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:StandartSlider.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
Value
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ValueSlider.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
Progress
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ProgressSlider.png]]</div></div>
</div>
===Описание===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Description.png]]</div></div>
===Иконки===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Icons1.png]]</div></div>
Все иконки делятся по сферам применения, и их главное различие — размеры
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Icons2.png]]</div></div>
===Виджет «header»===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:WidgetHeader.png]]</div></div>
===Расположение кнопок===
<div class="row">
<div class="col-sm-12 col-md-6">
Форм фактор: 128х120 pt
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:FormFactor.png]]</div></div>
</div>
Все кнопки имеют два состояния — покой и активность.
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:OFFicon.png]]</div></div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ONicon.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
В состоянии покоя цвет кнопки всегда # 848484 или RGB 132
</div>
<div class="col-sm-12 col-md-6">
Активным состояние кнопки считается только тогда, когда действие получило обратную связь является кратковременным или мгновенным (например: «Play» в медиаплеере) или действие, которое находится в состоянии активности продолжительное время и требует дополнительного воздействия для отключения состояния активности
(например: «Repeat» в медиаплеере).
</div>
</div>
==Основы работы со скриптами==

После проектирования интерфейса и добавления драйвера, вам понадобится разработать логику работы модуля в скриптах. Скриптовая часть при разработке i3 lite модуля имеет некоторые особенности. Перед разработкой скриптовой части lite модуля рекомендуем ознакомиться с [http://dev.iridiummobile.net/JS_Guide iRidium Pro API] и [[Special:MyLanguage/Developers_API | i3 lite API]]. <br />

Модуль может содержать неограниченное количество скриптов.
Существуют разные типы скриптов для модуля:
* Driver - в скриптовых файлах данного типа должны содержаться скрипты, отвечающие за работу с драйвером
* GUI - В этих скриптовых файлах содержатся скрипты, отвечающие за работу с графикой
* Common - в данных скриптовых файлах должны содержаться скрипты общего характера, тут может быть набор дополнительных функций или описание классов второстепенного назначения
* Setup - это специальный скриптовой файл, в нем содержиться информация о настройке модуля. а именно - список полей, обязательных для заполнения, типы этих полей и функции проверки правильности введенных данных.

Разделение на типы необходимо для правильной обработки модуля на сервере. На сервере работает только логика и драверная часть модулей, но сервер ничего не знает о графической части. Поэтому разработчику модуля требуется разбивать скрипты по типам. Сервер игнорирует файлы для работы с графической частью. <br />

При разработке модуля следует использовать простраство имен module вместо IR. Таким образом слушатель будет иметь вид module.AddListener(… <br />

Каждый скриптовой файл должен начинаться со слушателя
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_MODULE_START, 0, function(){});
</syntaxhighlight>
Это новый вид события, предназначенный специально для разработки модуля. При разработке модуля следует учитывать что скриптовой файл стал закрыт для других скриптовых файлов. Это хзначить что теперь можно использовать одноименные переменные и названия функций в разных скриптовых файлах и они не будут перезаписываться, но это накладывает ограничение: нельзя получить доступ к функции из другого скриптового файла простым способом. Для получения доступа к функции из другого скриптового файла, следует импортировать скриптовый файл с помощью команды module.Import("FileName.js"). <br />
Пример:<br/>
<syntaxhighlight lang="javascript">
//Name_1.js - первый js файл
this.Text = "Hello, world!"; //Указатель на текстовую переменную
//Name_2.js - второй js файл
var Text = module.Import("Name_1.js").Text; //Импортируем из первого js файла объект с указателем на текстовую переменную
IR.Log(Text); //"Hello, world!" //выводим в лог переменную Text
</syntaxhighlight>
==Создание подустройств==
Основой любого модуля служат подустройства и задачей разработчика модуля является определить сколько подустройств будет в модуле и разработать логику работы подустройств. В состав каждого подустройства может входить виджет, пульт управления, собственный набор действий, событий и состояний. Все составляющие подустройства необходимо указать при его создании. Содержимое подустройства не может меняться в ходе работы модуля. Для создания подустройства используется команда:<br/>
<syntaxhighlight lang="javascript">
module.AddSubDevice(SystemName, [Device], [System], [Type], [Tags], [Name], [Callback]);
</syntaxhighlight>
,где<br/>
'''SystemName''' - системное имя подустройства<br/>
'''Device''' - драйвер, к которому будет привязано подустройство<br/>
'''System''' - устаревший параметр, следует использовать false<br/>
'''Type''' - тип smart устройства. Параметр в разработке<br/>
'''Tags''' - Массив объектов виртуальных тегов<br/>
'''Name''' - имя подустройства, которое отображается пользователю<br/>
'''Callback function(){do somethings}''' - функция, которая выполняется до наступления события IR.EVENT_ADD_SUBDEVICE<br/>
В ответ функция вернет ссылку на подустройство, по которой к нему можно обратиться.<br/>
Пример создания подустройств для HDL Relay устройств. Скрипт проверяет количество устройств в шине и в цикле создает подустройства<br/>
<syntaxhighlight lang="javascript">
for (var count = 1; count <= COUNT_CHANNEL; count++) {
// Создаем подустройство
l_oSubDevice = module.AddSubDevice("Relay " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_RELAY);
// Создаем команду StatusOnStart
if (count == 1)
l_oSubDevice.AddChannel("Relay:statusOnStart", [ChannelData]);
var l_sChannelName = "Relay:channel" + count;
// Добавляем каналы
l_oSubDevice.AddChannel(l_sChannelName, [ChannelData]);
l_oSubDevice.AddTag(l_sChannelName, [ChannelData]);
// Добавляем виртуальный тег
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_TAG_POWER, true);
};</syntaxhighlight><br/>
Таким способом можно добавить в подустройство все необходимые сущности. Также, при создании подустройства, активируется событие<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function, [pointer]);
</syntaxhighlight><br/>
В функцию передается ссылка на только что созданное подустройство. В данном событии можно добавлять к подустройству различные компоненты(действия, события, состояния, виджеты, каналы, теги). Например:<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function(in_oSubDevice){
Создаем действия
in_oSubDevice.AddAction("On", false, in_oSubDevice.SystemName + "_Power", lightID + "_1", IR.SUB_DEVICE_COMMAND_POWER_ON);
in_oSubDevice.AddAction("Off", false, in_oSubDevice.SystemName + "_Power", lightID + "_0", IR.SUB_DEVICE_COMMAND_POWER_OFF);
Создаем события
in_oSubDevice.AddEvent("On", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "1");
in_oSubDevice.AddEvent("Off", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "0");
Создаем состояния
in_oSubDevice.AddCondition("On", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "1");
in_oSubDevice.AddCondition("Off", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "0");
});</syntaxhighlight><br/>
Таким образом разработчик может создавать нужное количество подустройств при установке модуля или ручном добавлении новых подустройств
==Добавление виджетов к подустройству==

Полсе создания интерфейсов в редакторе и добавления функции добавления подустройств, вам потребуется создавать для каждого поустройства свой экземпляр виджета и привязывать его к подустройству. Для привязки виджета к подустройству используется метод<br/>
<syntaxhighlight lang="javascript">SubDevice.addWidget(in_Widget)</syntaxhighlight><br/>

Входным параметром метода является: '''in_Widget''' - объект - виджет, заранее созданный в редакторе.<br/>
Выходным параметром метода является: успешно или нет ('''True''', '''False''').<br/>
К примеру у нас 3 лампочки и для того, чтобы не создавать для каждой лампочки отдельный виджет, мы воспользуемся уже готовым примером нашего окна и просто будем клонировать его. Напишем пример создания виджета с помощью кода по уже существующему образцу.<br/>

Метод Clone позволяет клонировать уже существующее всплывающее окно.<br/>
<syntaxhighlight lang="javascript">Module.ClonePopup (in_Popup, in_Name)</syntaxhighlight><br/>
Входные параметры метода:
*'''in_Name''' - имя нового виджета.<br/>
*'''in_Popup''' - ссылка на всплывающее окно.<br/>
Выходным параметром метода является: успешно или нет ('''True''', '''False''').<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function(in_oSubDevice){
var popup = module.GetPopup("Dimmer"); // Обращаемся к виджету который собираемся скопировать
// Создаем виджет методом клонирования
var widget = in_oSubDevice.addWidget(module.ClonePopup(popup, "Dimmer"+ in_oSubDevice.Name));
});</syntaxhighlight><br/>
----
{{i}} Имена новых виджетов не должны повторяться.
----
При открытии полноценного пульта управления из виджета, необходимо помнить о том что пользователь будет запускать модуль как на планшета, так и на телефоне. Из-за разницы в величине экранов, разработчик модуля должен разработать 2 вида окон. Вид под телефонную версию модуля и вид под планшетную версию. При этом надо добавить в скрипт метод, который будет спрашивать у системы вид устройства, на котором запущен модуль, и открывать соответствующее окно
<syntaxhighlight lang="javascript">
if (IR.DisplayType == IR.DISPLAY_TYPE_PHONE) { //Если модуль открыт на телефоне
var l_oPopupScanner = module.GetPopup("Phone"); //Показываем попап, отрисованный для телефона
}
else {
var l_oPopupScanner = module.GetPopup("Tablet");//Если планшет, то открываем попап для планшета
}
</syntaxhighlight><br/>
==Работа с каналами и тегами==
После создания подустройства и добавления виджета, вам понадобится добавить к подустройству нужные для работы каналы и теги. Как и в версии i3 Pro, драйвер можно добавить в графическом интерфейсе редактора или в скрипте. Для каждого подустройства потребуется собственный набор каналов и тегов для выбранного драйвера. В ходе работы может потребоваться работать с тремя компонентами:<br/>
*Канал. Для создания канала следует использовать метод<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddChannel(Name, DataArray)
</syntaxhighlight>где,<br/>
'''Name''' - имя канала<br/>
'''DataArray''' - массив данных, специфичный для каждого драйвера<br/>
*Тег. Для создания тега следует использовать метод<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddTag(Name, DataArray)
</syntaxhighlight>где,<br/>
'''Name''' - имя тега<br/>
'''DataArray''' - массив данных, специфичный для каждого драйвера<br/>
*Виртуальный тег. Для создания виртуального следует использовать метод<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddVirtualTag(Name, Value, [Edit], [smartID], [Hidden])
</syntaxhighlight>где,<br/>
'''Name'''- имя виртуального тега подустройства<br/>
'''Value''' - Значение тега<br/>
'''Edit''' - Разрешение редактирования тега<br/>
'''smartID''' - Параметр в разработке! Необходимо устанавливать false<br/>
'''Hidden''' - Признак скрытости тега<br/>
===Пример создания каналов и тегов при создании подустройства:===
<syntaxhighlight lang="javascript">
l_oSubDevice = module.AddSubDevice("Light " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_DIMMER);

// Adding channel StatusOnStart
if (count == 1)
l_oSubDevice.AddChannel("Dimmer:statusOnStart", [ChannelData]);

// Assigned to the variable name of the channel
var l_sChannelName = "Dimmer:channel" + count;

// Adding channels
l_oSubDevice.AddChannel(l_sChannelName, [ChannelData]);
l_oSubDevice.AddTag(l_sChannelName, [TagData]);

// Adding smart virtual tag
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_COMMAND_POWER, true);
l_oSubDevice.AddVirtualTag("Power On", 0, false, IR.SUB_DEVICE_COMMAND_POWER_ON, true);
l_oSubDevice.AddVirtualTag("Power Off", 0, false, IR.SUB_DEVICE_COMMAND_POWER_OFF, true);
l_oSubDevice.AddVirtualTag("Level", 0, false, IR.SUB_DEVICE_COMMAND_LEVEL, true);
</syntaxhighlight>
==Установка модуля в приложение==
Модули хранятся в магазине модулей iRidium Store и могут устанавливаться в приложение двумя способами:<br/>
*С помощью сканера<br/>
*Вручную<br/>
===Разработка Setup===
Для любого варианта необходимо разрабатывать файл Setup. Это специальный скриптовой файл, в котором прописаны поля, необходимые для работы модуля. Такими полями могут выступать ip адрес устройства, порт, название города итд. Для разработки Setup необходимо создать новый скриптовый файл и задать его тип "Setup". Каждое поле является тегом и к нему можно получить доступ из скрипта и получить введенное значение
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:СетапБонго.png]]</div></div>
Файл Setup состоит из 2-ух частей. Первая часть это настройки драйверов. В этих настройках следует запрашивать ip адреса, порты и логины, для подключения драйвера у устройству. Вторая часть файла это общие настройки модуля, такие как количество выходов, ключи доступа.
Для установки поля в Setup необходимо настроить следующие поля в скрипте:
* Тип поля - надо указать какое поле надо показать пользователю(текстовое поле, массив значений итд. Подробнее описано в API)
* Имя поля - название поля, которое увидит пользователь при настройке модуля
* Значение по умолчанию - какое значение следует подставлять по умолчанию
* Функция проверки - функция валидации значения в поле. Здесь требуется написать функцию, которая будет проверять корректность введенных данных.
Например, скрипт "Setup" для модуля HDL выглядит следующим образом:
<syntaxhighlight lang="javascript">
{
// Data to connect drivers, created in Project Device Panel
Drivers:
[
{
Name: "HDL-BUS Pro Network (UDP)",
Properties:
[
{
Type: "textfield",
Name: "Host",
DefaultValue: "255.255.255.255",
Validation: function(in_sValue) {
var l_aValueHost = in_sValue.split(".");
if (l_aValueHost.length != 4) {
return "Please input correct Host";
} else
if (parseInt(l_aValueHost[0], 10)>=0
&& parseInt(l_aValueHost[0], 10)<=255
&& parseInt(l_aValueHost[1], 10)>=0
&& parseInt(l_aValueHost[1], 10)<=255
&& parseInt(l_aValueHost[2], 10)>=0
&& parseInt(l_aValueHost[2], 10)<=255
&& parseInt(l_aValueHost[3], 10)>=0
&& parseInt(l_aValueHost[3], 10)<=255
)
return 0
else
return "Please input correct Host";
}
},
{
Type: "textfield",
Name: "Port",
DefaultValue: "6000",
Validation: function(in_sValue) {
if(parseInt(in_sValue, 10)>=0)
return 0
else
return "Please input correct Port";
}
}
]
}
],

// General information for the module (driver and generated by script)
Module: [{
Name: "Channels Count",
Validation: function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input Count";
}
},
{
Type: "textfield",
Name : "SubnetID",
Validation : function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input SubnetID";
}
},
{
Type: "textfield",
Name : "DeviceID",
Validation : function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input DeviceID";
}
}

]
}
</syntaxhighlight>
Для получения данных из полей Setup следует использовать функцию
<syntaxhighlight lang="javascript">
module.GetProperty("Имя поля")
</syntaxhighlight>
<br />
Помимо стандартных параметров, можно запрашивать любые, необходимые для инициализации модуля, параметры. Параметры драйвера подставляются в драйвер автоматически. Остальные параметры следует запрашивать и использовать вручную<br />
Пример работы с параметрами Setup
<syntaxhighlight lang="javascript">
var COUNT_CHANNEL = parseInt(module.GetProperty("Channel count")); // Getting count channel
var SubNetID = parseInt(module.GetProperty("SubnetID")); // Getting subnet id
var DeviceID = parseInt(module.GetProperty("DeviceID")); // Getting device id
</syntaxhighlight>
===Установка модуля вручную===
===Установка модуля с помощью сканера===
===Ручное добавление подустройств===
===Авторизация===
===Смена настроек===
===Удаление модуля===

Translations:DevManual/78/en

2017-04-03T10:56:34Z

Ildar: Новая страница: «The principle of constructing a widget block is a constructor from Controls (buttons, switches, labels) from smaller to larger.»

The principle of constructing a widget block is a constructor from
Controls (buttons, switches, labels) from smaller to larger.

DevManual/en

2017-04-03T10:50:30Z

Ildar: Новая страница: «Module grid widget is a block 640 pt wide And 120 pt in height. Each block has a grid of 8x8 pt. The rounding of the corners is 12.5 ut. (Circle 25)»

<languages/>
=Module development guide=
==Definitions==

'''Module''' - is a component that allows you to control one type of equipment by its unique ID. The module is located in the store of modules.

'''Control panel (mobile device)''' - is a device from which the project i3 lite is launched (tablet, smartphone).

'''Store of modules''' - is a cloud server for uploading ready-made modules. The module store is available from the i3 lite application or on our[http://www.iridiummobile.ru/store/ site]

'''iRidium Studio''' - is a editor that allows to create the module to control device for i3 lite application. You need to use a special editor build for [http://www.iridiummobile.net/redirects/?go=iRidium_SETUP_LITE module developers] to develop the module

'''i3 lite''' - is an application to create, set and use i3 lite projects.

'''i3 lite project''' – is an automation project made up of ready equipment control modules. i3 lite projects differ from i2 Control projects: i3 lite projects can be edited dynamically without prior editing in iRidium Studio. i3 lite project consists of several small parts that can be put together into a single whole in i3 lite app with the help of the built-in constructor. It can also be easily edited in the app. As a result, a big number of intermediate processes are no longer necessary, such as installing software on PC, uploading projects on contol panels. All is done in one place - a control panel.

'''SubDevice''' - This is a virtual representation of the working area of the physical device. If we take as an example a 6-channel dimmer it has 6 sub-devices, because each independent device requires a separate control interface and connects to one channel.

'''Room (in i3 lite)''' - The visual part of i3 lite containing hardware management widgets. The project in i3 lite consists of rooms located on the floors

'''Widget''' - is a visual module component located in the room. It has limitations in size and fixed position in the room interface. It contains the main module functionality. For additional functions Remote is used.

'''Remote''' - is a visual module component which is hidden by default. It opens only when clicking on the corresponding item of the widget. It does not have size limitations (not more than the panel display size) and can be located in any part of the room interface (it is usually located in the middle of the panel display). It contains additional functionality of the module.

'''Macros''' - is a sequence of commands of various modules, which is activated by pressing. Contains "Action" and "Condition". For example, the macros "turn off all the lights in the house" will send the shutdown command to all devices responsible for lighting.

'''Routine''' - is a sequence of commands of various modules, which is activated automatically when a certain event occurs. Contains "Event", "Action" and "Condition". For example, "turn on the light if the motion sensor is triggered"

'''Event''' - is a routine component that describes the control command and the value range. If the value is sent in the indicated range, the routine is executed. For example, the event "Motion appeared" is activated if the motion sensor is triggered.

'''Action''' - is a component of macros and routines. It describes the control command and value that must be sent to the command. For example, "turn on the light". There are 2 types of Action: Simple Action and Advanced Action.

'''Simple Action''' - Simple Action is used when the command and Action value are known in advance.

'''Advanced Action''' - Advanced Action is used when the command is known but the value is unknown. The value is set dynamically when Action is used in i3 lite (but not when creating in iRidium studio).

'''Condition''' - is a component of macros and scenes. It describes the control command and value range. When a value from the value range is sent Action is executed.

'''Scanner''' - is a software part, that analyzes any bus looking for connected devices. Found connected devices are displayed in a list. Modules for the found devices are downloaded from iRidium store and the devices become available to control in i3 lite.
==Module concept==
The module is an independent subroutine of the i3 lite application which is built in the project and has an independent interface, driver and logic. Modules are developed in the [http://www.iridiummobile.net/redirects/?go=iRidium_SETUP_LITE iRidium Studio] editor and located in the module store [http://www.iridiummobile.ru/store/ iRidium Store]. Integrator downloads the module from the module store for each individual project.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ModuleInScheme.png]]</div></div>
</div>

There are two types of modules:
*Control module - module for hardware control
*Scanner - module for searching hardware in the local network and loading modules for found devices
== How to start developing the module ==
----

{{i}} Before starting your work, it is recommended to read [http://dev.iridiummobile.net/How_to_begin iRidium documentation]. It describes the basics of working with iRidium. The i3 lite documentation describes how to develop modules for the i3 lite platform for users, who already know iRidium. If you want to write script use [[Special:MyLanguage/Developers_API | i3 lite API]].
----

The module life cycle consists of:
* Developing the graphic part in iRidium studio
* Developing the driver part (scripts, devices)
* Testing
* Publishing in iRidium store
* Using (module download via the i3 lite application from the cloud and adding to automation projects)
<br/>
==Module structure ==
Each module must consist of subdevices. The subdevice is a virtual representation of the working area of a physical device. Many devices support multiple workgroups with the same functionality. Each workgroup may be in a separate zone. To fully control the zone, you need to create a subdevice for each workgroup of the device. For example, a 6-channel HDL dimmer contains 6 dimmable channels, through which 6 working groups can be controlled. Therefore, it is advisable to select in the module 6 subdevices for the possibility of creating actions, events and conditions for each workgroup separately. The presence of subdevice in the i3 lite module is obligatory. The number of sub-devices can be from one to many. Usually the number of subdevice is equal to the number of channels of the controller, the number of its work areas or logical devices.

Subdevice consists of:
* Conditions
* Actions
* Events
* Widgets

Conditions, actions and events are logical elements of the subdevice, on their basis macros and routines are created. Widget is a graphical element, through which the user will control subdevice. Usually one subdevice contains one widget, but the number of conditions, actions and events varies (from zero to many). The number of subdevices in the module can be either fixed or not. For example, you can develop a module only for a 6-channel dimmer, and you can make a module that will request the hardware for the number of subdevices and create the required number of subdevices.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ModuleStruct.png]]</div></div>
</div>
==Creating the module interface ==
The interface part of the midule consists of:
* widgets - interface part of the subdevice, which is located in the rooms and has basic control functions
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:WidgetExample.png]]</div></div>
</div>
* Remote - interface part of the module, which has a set of device functions and opens to the full screen, when you click on the widget button
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:RemoteExample.png]]</div></div>
</div>
* Authorization window - Authorization is required to work with some devices. To do this, the developer can create a special authorization window that is available in the module settings
картинка кнопки авторизации и окна авторизации
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:AutorisationExample.png]]</div></div>
</div>
* The module settings window is a window where you need to enter the parameters for the module operation
картинка окна настроек модуля и кнопки открытия
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:SettingsExample.png]]</div></div>
</div>
The whole graphic part is drawn in the graphical interface of the iRidium studio editor. In contradistinction to i3 pro, the module's interface should be made up of ready-made graphic components located in the gallery.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ItemGallery.png]]</div></div>
</div>

==== Widget ====

Widget is a visual component of the module, a kind of Popup that will be displayed in the room. The main task of the widget is to display the basic controls of the subdevice and to provide a module transition to the Remote control of the subdevice. For example, to control a media player, you can place a volume slider or Mute button for quick access to adjusting the volume. The weather widget can display the current weather, and the control panel will contain the weather forecast for all 5 days.<br />
The module does not make sense without widget, because it will not have a graphical representation in the i3 lite project.

Widget has a limited size
# Width '''640'''
# Height can not exceed '''1200'''

[[Файл:Пример виджета.png|center|thumb|Рис. Widget example]]

To create a widget, click the Add pop-up button in the Project overview panel and in the appeared menu select popup type: "Widget", set the name and properties:
[[Файл:ПанельПопап.png|thumb|center]]

Properties of a created widget can be changed with the help of '''Object Properties'''.<br />
Graphic items are assigned to channels like in popups:
[[Файл:Связывание_канала_команды_и_графического_элемента.png|center|thumb|Рис. Связывание канала команды и графического элемента]]
Widget will be displayed:
* In the room when a client uses the project
[[Файл:В_комнате_при_использовании_пользователем_проекта.png|center|thumb|]]
* In the module settings when it is added to the project:
[[Файл:И_в_настройках_модуля_при_добавлении_его_в_проект.png ‎|center|thumb|]]
====Remote and other graphic windows====

Remote (a remote control) is a graphical area to control SubDevices. Unlike wigets, it can have free size and position. And it is displayed on call. Remote is displayed when a button to go to the remote control is pressed on a widget.
Items to control equipment are placed on Remote (buttons, lists, switches, levels). There can be from 0 to several remote controls. Example of Remote:<br />
[[Файл:Пульт_управления.png ‎|center|thumb|]]<br />

Remote is created like a Widget. The only difference is to select "Remote" when you click "Add Popup Page" in the "Device Type" property.
==Interface design standard==
For the convenience of interface design, a standard was developed in which graphic windows should be developed in the module so that the modules of different developers looked uniformly within the framework of one project.
===Basic principles===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:GeneralUI.png]]</div></div>
<div class="col-sm-12 col-md-6">
Виджет состоит из «Header» и дополнительных модулей основного функционала. <br/>
«Header» — верхний модуль виджета.<br/>
«Header» содержит:<br/>
- наименование виджета;
- наименование устройства, которым<br/>
управляет виджет;<br/>
- иконка категории устройства.<br/>
<br/>
Дополнительные модули содержат элементы управления устройством.
</div>
</div>
===Module grid and blocks===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka1.png]]</div></div>
<div class="col-sm-12 col-md-6">
Module grid widget is a block 640 pt wide
And 120 pt in height. Each block has a grid of 8x8 pt.
The rounding of the corners is 12.5 ut. (Circle 25)
</div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka2.png]]</div></div>
<div class="col-sm-12 col-md-6">
Принцип построения блока виджета представляет собой конструктор из
элементов управления (кнопок, свитчей, лэйблов) от меньшего к большему.
</div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka3.png]]</div></div>
<div class="col-sm-12 col-md-6">
Элементы управления комбинируются и объединяются в блок,
а блоки объединяются в панель управления.
</div>
</div>
===Кнопки===
<big>'''Toggle'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Toggle.png]]</div></div>
<div class="col-sm-12 col-md-6">
Кнопка изменения значения «вкл/выкл». Применяется как в случаях с неизвестным состоянием работы устройства, так и для управления функционалом устройства.
</div>
</div>
<big>'''Switch'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Switch.png]]</div></div>
<div class="col-sm-12 col-md-6">
Кнопка изменения значения «вкл/выкл». Применяется только в случаях с известным состоянием работы устройства.
</div>
</div>
<big>'''Multistate'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Multistate.png]]</div></div>
<div class="col-sm-12 col-md-6">
Кнопка изменения значения предустановленного состояния устройства применяется только в случаях с известным cостоянием работы устройства.
</div>
</div>
===Кнопка-стрелка===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:arrow1.png]]</div></div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:arrow2.png]]</div></div>
</div>
'''Действие кнопки'''<br/>
При нажатии на кнопку происходит вызов «PopUp».<br/>
'''Содержимое «PopUp»'''<br/>
«Input field», «Single selection», «Multiple selection».
===Слайдеры===
<div class="row">
<div class="col-sm-12 col-md-6">
Standart
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:StandartSlider.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
Value
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ValueSlider.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
Progress
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ProgressSlider.png]]</div></div>
</div>
===Описание===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Description.png]]</div></div>
===Иконки===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Icons1.png]]</div></div>
Все иконки делятся по сферам применения, и их главное различие — размеры
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Icons2.png]]</div></div>
===Виджет «header»===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:WidgetHeader.png]]</div></div>
===Расположение кнопок===
<div class="row">
<div class="col-sm-12 col-md-6">
Форм фактор: 128х120 pt
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:FormFactor.png]]</div></div>
</div>
Все кнопки имеют два состояния — покой и активность.
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:OFFicon.png]]</div></div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ONicon.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
В состоянии покоя цвет кнопки всегда # 848484 или RGB 132
</div>
<div class="col-sm-12 col-md-6">
Активным состояние кнопки считается только тогда, когда действие получило обратную связь является кратковременным или мгновенным (например: «Play» в медиаплеере) или действие, которое находится в состоянии активности продолжительное время и требует дополнительного воздействия для отключения состояния активности
(например: «Repeat» в медиаплеере).
</div>
</div>
==Основы работы со скриптами==

После проектирования интерфейса и добавления драйвера, вам понадобится разработать логику работы модуля в скриптах. Скриптовая часть при разработке i3 lite модуля имеет некоторые особенности. Перед разработкой скриптовой части lite модуля рекомендуем ознакомиться с [http://dev.iridiummobile.net/JS_Guide iRidium Pro API] и [[Special:MyLanguage/Developers_API | i3 lite API]]. <br />

Модуль может содержать неограниченное количество скриптов.
Существуют разные типы скриптов для модуля:
* Driver - в скриптовых файлах данного типа должны содержаться скрипты, отвечающие за работу с драйвером
* GUI - В этих скриптовых файлах содержатся скрипты, отвечающие за работу с графикой
* Common - в данных скриптовых файлах должны содержаться скрипты общего характера, тут может быть набор дополнительных функций или описание классов второстепенного назначения
* Setup - это специальный скриптовой файл, в нем содержиться информация о настройке модуля. а именно - список полей, обязательных для заполнения, типы этих полей и функции проверки правильности введенных данных.

Разделение на типы необходимо для правильной обработки модуля на сервере. На сервере работает только логика и драверная часть модулей, но сервер ничего не знает о графической части. Поэтому разработчику модуля требуется разбивать скрипты по типам. Сервер игнорирует файлы для работы с графической частью. <br />

При разработке модуля следует использовать простраство имен module вместо IR. Таким образом слушатель будет иметь вид module.AddListener(… <br />

Каждый скриптовой файл должен начинаться со слушателя
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_MODULE_START, 0, function(){});
</syntaxhighlight>
Это новый вид события, предназначенный специально для разработки модуля. При разработке модуля следует учитывать что скриптовой файл стал закрыт для других скриптовых файлов. Это хзначить что теперь можно использовать одноименные переменные и названия функций в разных скриптовых файлах и они не будут перезаписываться, но это накладывает ограничение: нельзя получить доступ к функции из другого скриптового файла простым способом. Для получения доступа к функции из другого скриптового файла, следует импортировать скриптовый файл с помощью команды module.Import("FileName.js"). <br />
Пример:<br/>
<syntaxhighlight lang="javascript">
//Name_1.js - первый js файл
this.Text = "Hello, world!"; //Указатель на текстовую переменную
//Name_2.js - второй js файл
var Text = module.Import("Name_1.js").Text; //Импортируем из первого js файла объект с указателем на текстовую переменную
IR.Log(Text); //"Hello, world!" //выводим в лог переменную Text
</syntaxhighlight>
==Создание подустройств==
Основой любого модуля служат подустройства и задачей разработчика модуля является определить сколько подустройств будет в модуле и разработать логику работы подустройств. В состав каждого подустройства может входить виджет, пульт управления, собственный набор действий, событий и состояний. Все составляющие подустройства необходимо указать при его создании. Содержимое подустройства не может меняться в ходе работы модуля. Для создания подустройства используется команда:<br/>
<syntaxhighlight lang="javascript">
module.AddSubDevice(SystemName, [Device], [System], [Type], [Tags], [Name], [Callback]);
</syntaxhighlight>
,где<br/>
'''SystemName''' - системное имя подустройства<br/>
'''Device''' - драйвер, к которому будет привязано подустройство<br/>
'''System''' - устаревший параметр, следует использовать false<br/>
'''Type''' - тип smart устройства. Параметр в разработке<br/>
'''Tags''' - Массив объектов виртуальных тегов<br/>
'''Name''' - имя подустройства, которое отображается пользователю<br/>
'''Callback function(){do somethings}''' - функция, которая выполняется до наступления события IR.EVENT_ADD_SUBDEVICE<br/>
В ответ функция вернет ссылку на подустройство, по которой к нему можно обратиться.<br/>
Пример создания подустройств для HDL Relay устройств. Скрипт проверяет количество устройств в шине и в цикле создает подустройства<br/>
<syntaxhighlight lang="javascript">
for (var count = 1; count <= COUNT_CHANNEL; count++) {
// Создаем подустройство
l_oSubDevice = module.AddSubDevice("Relay " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_RELAY);
// Создаем команду StatusOnStart
if (count == 1)
l_oSubDevice.AddChannel("Relay:statusOnStart", [ChannelData]);
var l_sChannelName = "Relay:channel" + count;
// Добавляем каналы
l_oSubDevice.AddChannel(l_sChannelName, [ChannelData]);
l_oSubDevice.AddTag(l_sChannelName, [ChannelData]);
// Добавляем виртуальный тег
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_TAG_POWER, true);
};</syntaxhighlight><br/>
Таким способом можно добавить в подустройство все необходимые сущности. Также, при создании подустройства, активируется событие<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function, [pointer]);
</syntaxhighlight><br/>
В функцию передается ссылка на только что созданное подустройство. В данном событии можно добавлять к подустройству различные компоненты(действия, события, состояния, виджеты, каналы, теги). Например:<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function(in_oSubDevice){
Создаем действия
in_oSubDevice.AddAction("On", false, in_oSubDevice.SystemName + "_Power", lightID + "_1", IR.SUB_DEVICE_COMMAND_POWER_ON);
in_oSubDevice.AddAction("Off", false, in_oSubDevice.SystemName + "_Power", lightID + "_0", IR.SUB_DEVICE_COMMAND_POWER_OFF);
Создаем события
in_oSubDevice.AddEvent("On", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "1");
in_oSubDevice.AddEvent("Off", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "0");
Создаем состояния
in_oSubDevice.AddCondition("On", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "1");
in_oSubDevice.AddCondition("Off", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "0");
});</syntaxhighlight><br/>
Таким образом разработчик может создавать нужное количество подустройств при установке модуля или ручном добавлении новых подустройств
==Добавление виджетов к подустройству==

Полсе создания интерфейсов в редакторе и добавления функции добавления подустройств, вам потребуется создавать для каждого поустройства свой экземпляр виджета и привязывать его к подустройству. Для привязки виджета к подустройству используется метод<br/>
<syntaxhighlight lang="javascript">SubDevice.addWidget(in_Widget)</syntaxhighlight><br/>

Входным параметром метода является: '''in_Widget''' - объект - виджет, заранее созданный в редакторе.<br/>
Выходным параметром метода является: успешно или нет ('''True''', '''False''').<br/>
К примеру у нас 3 лампочки и для того, чтобы не создавать для каждой лампочки отдельный виджет, мы воспользуемся уже готовым примером нашего окна и просто будем клонировать его. Напишем пример создания виджета с помощью кода по уже существующему образцу.<br/>

Метод Clone позволяет клонировать уже существующее всплывающее окно.<br/>
<syntaxhighlight lang="javascript">Module.ClonePopup (in_Popup, in_Name)</syntaxhighlight><br/>
Входные параметры метода:
*'''in_Name''' - имя нового виджета.<br/>
*'''in_Popup''' - ссылка на всплывающее окно.<br/>
Выходным параметром метода является: успешно или нет ('''True''', '''False''').<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function(in_oSubDevice){
var popup = module.GetPopup("Dimmer"); // Обращаемся к виджету который собираемся скопировать
// Создаем виджет методом клонирования
var widget = in_oSubDevice.addWidget(module.ClonePopup(popup, "Dimmer"+ in_oSubDevice.Name));
});</syntaxhighlight><br/>
----
{{i}} Имена новых виджетов не должны повторяться.
----
При открытии полноценного пульта управления из виджета, необходимо помнить о том что пользователь будет запускать модуль как на планшета, так и на телефоне. Из-за разницы в величине экранов, разработчик модуля должен разработать 2 вида окон. Вид под телефонную версию модуля и вид под планшетную версию. При этом надо добавить в скрипт метод, который будет спрашивать у системы вид устройства, на котором запущен модуль, и открывать соответствующее окно
<syntaxhighlight lang="javascript">
if (IR.DisplayType == IR.DISPLAY_TYPE_PHONE) { //Если модуль открыт на телефоне
var l_oPopupScanner = module.GetPopup("Phone"); //Показываем попап, отрисованный для телефона
}
else {
var l_oPopupScanner = module.GetPopup("Tablet");//Если планшет, то открываем попап для планшета
}
</syntaxhighlight><br/>
==Работа с каналами и тегами==
После создания подустройства и добавления виджета, вам понадобится добавить к подустройству нужные для работы каналы и теги. Как и в версии i3 Pro, драйвер можно добавить в графическом интерфейсе редактора или в скрипте. Для каждого подустройства потребуется собственный набор каналов и тегов для выбранного драйвера. В ходе работы может потребоваться работать с тремя компонентами:<br/>
*Канал. Для создания канала следует использовать метод<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddChannel(Name, DataArray)
</syntaxhighlight>где,<br/>
'''Name''' - имя канала<br/>
'''DataArray''' - массив данных, специфичный для каждого драйвера<br/>
*Тег. Для создания тега следует использовать метод<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddTag(Name, DataArray)
</syntaxhighlight>где,<br/>
'''Name''' - имя тега<br/>
'''DataArray''' - массив данных, специфичный для каждого драйвера<br/>
*Виртуальный тег. Для создания виртуального следует использовать метод<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddVirtualTag(Name, Value, [Edit], [smartID], [Hidden])
</syntaxhighlight>где,<br/>
'''Name'''- имя виртуального тега подустройства<br/>
'''Value''' - Значение тега<br/>
'''Edit''' - Разрешение редактирования тега<br/>
'''smartID''' - Параметр в разработке! Необходимо устанавливать false<br/>
'''Hidden''' - Признак скрытости тега<br/>
===Пример создания каналов и тегов при создании подустройства:===
<syntaxhighlight lang="javascript">
l_oSubDevice = module.AddSubDevice("Light " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_DIMMER);

// Adding channel StatusOnStart
if (count == 1)
l_oSubDevice.AddChannel("Dimmer:statusOnStart", [ChannelData]);

// Assigned to the variable name of the channel
var l_sChannelName = "Dimmer:channel" + count;

// Adding channels
l_oSubDevice.AddChannel(l_sChannelName, [ChannelData]);
l_oSubDevice.AddTag(l_sChannelName, [TagData]);

// Adding smart virtual tag
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_COMMAND_POWER, true);
l_oSubDevice.AddVirtualTag("Power On", 0, false, IR.SUB_DEVICE_COMMAND_POWER_ON, true);
l_oSubDevice.AddVirtualTag("Power Off", 0, false, IR.SUB_DEVICE_COMMAND_POWER_OFF, true);
l_oSubDevice.AddVirtualTag("Level", 0, false, IR.SUB_DEVICE_COMMAND_LEVEL, true);
</syntaxhighlight>
==Установка модуля в приложение==
Модули хранятся в магазине модулей iRidium Store и могут устанавливаться в приложение двумя способами:<br/>
*С помощью сканера<br/>
*Вручную<br/>
===Разработка Setup===
Для любого варианта необходимо разрабатывать файл Setup. Это специальный скриптовой файл, в котором прописаны поля, необходимые для работы модуля. Такими полями могут выступать ip адрес устройства, порт, название города итд. Для разработки Setup необходимо создать новый скриптовый файл и задать его тип "Setup". Каждое поле является тегом и к нему можно получить доступ из скрипта и получить введенное значение
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:СетапБонго.png]]</div></div>
Файл Setup состоит из 2-ух частей. Первая часть это настройки драйверов. В этих настройках следует запрашивать ip адреса, порты и логины, для подключения драйвера у устройству. Вторая часть файла это общие настройки модуля, такие как количество выходов, ключи доступа.
Для установки поля в Setup необходимо настроить следующие поля в скрипте:
* Тип поля - надо указать какое поле надо показать пользователю(текстовое поле, массив значений итд. Подробнее описано в API)
* Имя поля - название поля, которое увидит пользователь при настройке модуля
* Значение по умолчанию - какое значение следует подставлять по умолчанию
* Функция проверки - функция валидации значения в поле. Здесь требуется написать функцию, которая будет проверять корректность введенных данных.
Например, скрипт "Setup" для модуля HDL выглядит следующим образом:
<syntaxhighlight lang="javascript">
{
// Data to connect drivers, created in Project Device Panel
Drivers:
[
{
Name: "HDL-BUS Pro Network (UDP)",
Properties:
[
{
Type: "textfield",
Name: "Host",
DefaultValue: "255.255.255.255",
Validation: function(in_sValue) {
var l_aValueHost = in_sValue.split(".");
if (l_aValueHost.length != 4) {
return "Please input correct Host";
} else
if (parseInt(l_aValueHost[0], 10)>=0
&& parseInt(l_aValueHost[0], 10)<=255
&& parseInt(l_aValueHost[1], 10)>=0
&& parseInt(l_aValueHost[1], 10)<=255
&& parseInt(l_aValueHost[2], 10)>=0
&& parseInt(l_aValueHost[2], 10)<=255
&& parseInt(l_aValueHost[3], 10)>=0
&& parseInt(l_aValueHost[3], 10)<=255
)
return 0
else
return "Please input correct Host";
}
},
{
Type: "textfield",
Name: "Port",
DefaultValue: "6000",
Validation: function(in_sValue) {
if(parseInt(in_sValue, 10)>=0)
return 0
else
return "Please input correct Port";
}
}
]
}
],

// General information for the module (driver and generated by script)
Module: [{
Name: "Channels Count",
Validation: function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input Count";
}
},
{
Type: "textfield",
Name : "SubnetID",
Validation : function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input SubnetID";
}
},
{
Type: "textfield",
Name : "DeviceID",
Validation : function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input DeviceID";
}
}

]
}
</syntaxhighlight>
Для получения данных из полей Setup следует использовать функцию
<syntaxhighlight lang="javascript">
module.GetProperty("Имя поля")
</syntaxhighlight>
<br />
Помимо стандартных параметров, можно запрашивать любые, необходимые для инициализации модуля, параметры. Параметры драйвера подставляются в драйвер автоматически. Остальные параметры следует запрашивать и использовать вручную<br />
Пример работы с параметрами Setup
<syntaxhighlight lang="javascript">
var COUNT_CHANNEL = parseInt(module.GetProperty("Channel count")); // Getting count channel
var SubNetID = parseInt(module.GetProperty("SubnetID")); // Getting subnet id
var DeviceID = parseInt(module.GetProperty("DeviceID")); // Getting device id
</syntaxhighlight>
===Установка модуля вручную===
===Установка модуля с помощью сканера===
===Ручное добавление подустройств===
===Авторизация===
===Смена настроек===
===Удаление модуля===

Translations:DevManual/77/en

2017-04-03T10:50:29Z

Ildar: Новая страница: «Module grid widget is a block 640 pt wide And 120 pt in height. Each block has a grid of 8x8 pt. The rounding of the corners is 12.5 ut. (Circle 25)»

Module grid widget is a block 640 pt wide
And 120 pt in height. Each block has a grid of 8x8 pt.
The rounding of the corners is 12.5 ut. (Circle 25)

DevManual/en

2017-04-03T10:47:40Z

Ildar:

<languages/>
=Module development guide=
==Definitions==

'''Module''' - is a component that allows you to control one type of equipment by its unique ID. The module is located in the store of modules.

'''Control panel (mobile device)''' - is a device from which the project i3 lite is launched (tablet, smartphone).

'''Store of modules''' - is a cloud server for uploading ready-made modules. The module store is available from the i3 lite application or on our[http://www.iridiummobile.ru/store/ site]

'''iRidium Studio''' - is a editor that allows to create the module to control device for i3 lite application. You need to use a special editor build for [http://www.iridiummobile.net/redirects/?go=iRidium_SETUP_LITE module developers] to develop the module

'''i3 lite''' - is an application to create, set and use i3 lite projects.

'''i3 lite project''' – is an automation project made up of ready equipment control modules. i3 lite projects differ from i2 Control projects: i3 lite projects can be edited dynamically without prior editing in iRidium Studio. i3 lite project consists of several small parts that can be put together into a single whole in i3 lite app with the help of the built-in constructor. It can also be easily edited in the app. As a result, a big number of intermediate processes are no longer necessary, such as installing software on PC, uploading projects on contol panels. All is done in one place - a control panel.

'''SubDevice''' - This is a virtual representation of the working area of the physical device. If we take as an example a 6-channel dimmer it has 6 sub-devices, because each independent device requires a separate control interface and connects to one channel.

'''Room (in i3 lite)''' - The visual part of i3 lite containing hardware management widgets. The project in i3 lite consists of rooms located on the floors

'''Widget''' - is a visual module component located in the room. It has limitations in size and fixed position in the room interface. It contains the main module functionality. For additional functions Remote is used.

'''Remote''' - is a visual module component which is hidden by default. It opens only when clicking on the corresponding item of the widget. It does not have size limitations (not more than the panel display size) and can be located in any part of the room interface (it is usually located in the middle of the panel display). It contains additional functionality of the module.

'''Macros''' - is a sequence of commands of various modules, which is activated by pressing. Contains "Action" and "Condition". For example, the macros "turn off all the lights in the house" will send the shutdown command to all devices responsible for lighting.

'''Routine''' - is a sequence of commands of various modules, which is activated automatically when a certain event occurs. Contains "Event", "Action" and "Condition". For example, "turn on the light if the motion sensor is triggered"

'''Event''' - is a routine component that describes the control command and the value range. If the value is sent in the indicated range, the routine is executed. For example, the event "Motion appeared" is activated if the motion sensor is triggered.

'''Action''' - is a component of macros and routines. It describes the control command and value that must be sent to the command. For example, "turn on the light". There are 2 types of Action: Simple Action and Advanced Action.

'''Simple Action''' - Simple Action is used when the command and Action value are known in advance.

'''Advanced Action''' - Advanced Action is used when the command is known but the value is unknown. The value is set dynamically when Action is used in i3 lite (but not when creating in iRidium studio).

'''Condition''' - is a component of macros and scenes. It describes the control command and value range. When a value from the value range is sent Action is executed.

'''Scanner''' - is a software part, that analyzes any bus looking for connected devices. Found connected devices are displayed in a list. Modules for the found devices are downloaded from iRidium store and the devices become available to control in i3 lite.
==Module concept==
The module is an independent subroutine of the i3 lite application which is built in the project and has an independent interface, driver and logic. Modules are developed in the [http://www.iridiummobile.net/redirects/?go=iRidium_SETUP_LITE iRidium Studio] editor and located in the module store [http://www.iridiummobile.ru/store/ iRidium Store]. Integrator downloads the module from the module store for each individual project.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ModuleInScheme.png]]</div></div>
</div>

There are two types of modules:
*Control module - module for hardware control
*Scanner - module for searching hardware in the local network and loading modules for found devices
== How to start developing the module ==
----

{{i}} Before starting your work, it is recommended to read [http://dev.iridiummobile.net/How_to_begin iRidium documentation]. It describes the basics of working with iRidium. The i3 lite documentation describes how to develop modules for the i3 lite platform for users, who already know iRidium. If you want to write script use [[Special:MyLanguage/Developers_API | i3 lite API]].
----

The module life cycle consists of:
* Developing the graphic part in iRidium studio
* Developing the driver part (scripts, devices)
* Testing
* Publishing in iRidium store
* Using (module download via the i3 lite application from the cloud and adding to automation projects)
<br/>
==Module structure ==
Each module must consist of subdevices. The subdevice is a virtual representation of the working area of a physical device. Many devices support multiple workgroups with the same functionality. Each workgroup may be in a separate zone. To fully control the zone, you need to create a subdevice for each workgroup of the device. For example, a 6-channel HDL dimmer contains 6 dimmable channels, through which 6 working groups can be controlled. Therefore, it is advisable to select in the module 6 subdevices for the possibility of creating actions, events and conditions for each workgroup separately. The presence of subdevice in the i3 lite module is obligatory. The number of sub-devices can be from one to many. Usually the number of subdevice is equal to the number of channels of the controller, the number of its work areas or logical devices.

Subdevice consists of:
* Conditions
* Actions
* Events
* Widgets

Conditions, actions and events are logical elements of the subdevice, on their basis macros and routines are created. Widget is a graphical element, through which the user will control subdevice. Usually one subdevice contains one widget, but the number of conditions, actions and events varies (from zero to many). The number of subdevices in the module can be either fixed or not. For example, you can develop a module only for a 6-channel dimmer, and you can make a module that will request the hardware for the number of subdevices and create the required number of subdevices.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ModuleStruct.png]]</div></div>
</div>
==Creating the module interface ==
The interface part of the midule consists of:
* widgets - interface part of the subdevice, which is located in the rooms and has basic control functions
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:WidgetExample.png]]</div></div>
</div>
* Remote - interface part of the module, which has a set of device functions and opens to the full screen, when you click on the widget button
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:RemoteExample.png]]</div></div>
</div>
* Authorization window - Authorization is required to work with some devices. To do this, the developer can create a special authorization window that is available in the module settings
картинка кнопки авторизации и окна авторизации
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:AutorisationExample.png]]</div></div>
</div>
* The module settings window is a window where you need to enter the parameters for the module operation
картинка окна настроек модуля и кнопки открытия
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:SettingsExample.png]]</div></div>
</div>
The whole graphic part is drawn in the graphical interface of the iRidium studio editor. In contradistinction to i3 pro, the module's interface should be made up of ready-made graphic components located in the gallery.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ItemGallery.png]]</div></div>
</div>

==== Widget ====

Widget is a visual component of the module, a kind of Popup that will be displayed in the room. The main task of the widget is to display the basic controls of the subdevice and to provide a module transition to the Remote control of the subdevice. For example, to control a media player, you can place a volume slider or Mute button for quick access to adjusting the volume. The weather widget can display the current weather, and the control panel will contain the weather forecast for all 5 days.<br />
The module does not make sense without widget, because it will not have a graphical representation in the i3 lite project.

Widget has a limited size
# Width '''640'''
# Height can not exceed '''1200'''

[[Файл:Пример виджета.png|center|thumb|Рис. Widget example]]

To create a widget, click the Add pop-up button in the Project overview panel and in the appeared menu select popup type: "Widget", set the name and properties:
[[Файл:ПанельПопап.png|thumb|center]]

Properties of a created widget can be changed with the help of '''Object Properties'''.<br />
Graphic items are assigned to channels like in popups:
[[Файл:Связывание_канала_команды_и_графического_элемента.png|center|thumb|Рис. Связывание канала команды и графического элемента]]
Widget will be displayed:
* In the room when a client uses the project
[[Файл:В_комнате_при_использовании_пользователем_проекта.png|center|thumb|]]
* In the module settings when it is added to the project:
[[Файл:И_в_настройках_модуля_при_добавлении_его_в_проект.png ‎|center|thumb|]]
====Remote and other graphic windows====

Remote (a remote control) is a graphical area to control SubDevices. Unlike wigets, it can have free size and position. And it is displayed on call. Remote is displayed when a button to go to the remote control is pressed on a widget.
Items to control equipment are placed on Remote (buttons, lists, switches, levels). There can be from 0 to several remote controls. Example of Remote:<br />
[[Файл:Пульт_управления.png ‎|center|thumb|]]<br />

Remote is created like a Widget. The only difference is to select "Remote" when you click "Add Popup Page" in the "Device Type" property.
==Interface design standard==
For the convenience of interface design, a standard was developed in which graphic windows should be developed in the module so that the modules of different developers looked uniformly within the framework of one project.
===Basic principles===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:GeneralUI.png]]</div></div>
<div class="col-sm-12 col-md-6">
Виджет состоит из «Header» и дополнительных модулей основного функционала. <br/>
«Header» — верхний модуль виджета.<br/>
«Header» содержит:<br/>
- наименование виджета;
- наименование устройства, которым<br/>
управляет виджет;<br/>
- иконка категории устройства.<br/>
<br/>
Дополнительные модули содержат элементы управления устройством.
</div>
</div>
===Module grid and blocks===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka1.png]]</div></div>
<div class="col-sm-12 col-md-6">
Модульная сетка виджета представляет собой блоки 640 pt в ширину
и 120 pt в высоту. Каждый блок имеет сетку 8х8 pt.
Скругления углов равно 12,5 ut. (Circle 25)
</div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka2.png]]</div></div>
<div class="col-sm-12 col-md-6">
Принцип построения блока виджета представляет собой конструктор из
элементов управления (кнопок, свитчей, лэйблов) от меньшего к большему.
</div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka3.png]]</div></div>
<div class="col-sm-12 col-md-6">
Элементы управления комбинируются и объединяются в блок,
а блоки объединяются в панель управления.
</div>
</div>
===Кнопки===
<big>'''Toggle'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Toggle.png]]</div></div>
<div class="col-sm-12 col-md-6">
Кнопка изменения значения «вкл/выкл». Применяется как в случаях с неизвестным состоянием работы устройства, так и для управления функционалом устройства.
</div>
</div>
<big>'''Switch'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Switch.png]]</div></div>
<div class="col-sm-12 col-md-6">
Кнопка изменения значения «вкл/выкл». Применяется только в случаях с известным состоянием работы устройства.
</div>
</div>
<big>'''Multistate'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Multistate.png]]</div></div>
<div class="col-sm-12 col-md-6">
Кнопка изменения значения предустановленного состояния устройства применяется только в случаях с известным cостоянием работы устройства.
</div>
</div>
===Кнопка-стрелка===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:arrow1.png]]</div></div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:arrow2.png]]</div></div>
</div>
'''Действие кнопки'''<br/>
При нажатии на кнопку происходит вызов «PopUp».<br/>
'''Содержимое «PopUp»'''<br/>
«Input field», «Single selection», «Multiple selection».
===Слайдеры===
<div class="row">
<div class="col-sm-12 col-md-6">
Standart
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:StandartSlider.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
Value
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ValueSlider.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
Progress
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ProgressSlider.png]]</div></div>
</div>
===Описание===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Description.png]]</div></div>
===Иконки===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Icons1.png]]</div></div>
Все иконки делятся по сферам применения, и их главное различие — размеры
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Icons2.png]]</div></div>
===Виджет «header»===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:WidgetHeader.png]]</div></div>
===Расположение кнопок===
<div class="row">
<div class="col-sm-12 col-md-6">
Форм фактор: 128х120 pt
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:FormFactor.png]]</div></div>
</div>
Все кнопки имеют два состояния — покой и активность.
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:OFFicon.png]]</div></div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ONicon.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
В состоянии покоя цвет кнопки всегда # 848484 или RGB 132
</div>
<div class="col-sm-12 col-md-6">
Активным состояние кнопки считается только тогда, когда действие получило обратную связь является кратковременным или мгновенным (например: «Play» в медиаплеере) или действие, которое находится в состоянии активности продолжительное время и требует дополнительного воздействия для отключения состояния активности
(например: «Repeat» в медиаплеере).
</div>
</div>
==Основы работы со скриптами==

После проектирования интерфейса и добавления драйвера, вам понадобится разработать логику работы модуля в скриптах. Скриптовая часть при разработке i3 lite модуля имеет некоторые особенности. Перед разработкой скриптовой части lite модуля рекомендуем ознакомиться с [http://dev.iridiummobile.net/JS_Guide iRidium Pro API] и [[Special:MyLanguage/Developers_API | i3 lite API]]. <br />

Модуль может содержать неограниченное количество скриптов.
Существуют разные типы скриптов для модуля:
* Driver - в скриптовых файлах данного типа должны содержаться скрипты, отвечающие за работу с драйвером
* GUI - В этих скриптовых файлах содержатся скрипты, отвечающие за работу с графикой
* Common - в данных скриптовых файлах должны содержаться скрипты общего характера, тут может быть набор дополнительных функций или описание классов второстепенного назначения
* Setup - это специальный скриптовой файл, в нем содержиться информация о настройке модуля. а именно - список полей, обязательных для заполнения, типы этих полей и функции проверки правильности введенных данных.

Разделение на типы необходимо для правильной обработки модуля на сервере. На сервере работает только логика и драверная часть модулей, но сервер ничего не знает о графической части. Поэтому разработчику модуля требуется разбивать скрипты по типам. Сервер игнорирует файлы для работы с графической частью. <br />

При разработке модуля следует использовать простраство имен module вместо IR. Таким образом слушатель будет иметь вид module.AddListener(… <br />

Каждый скриптовой файл должен начинаться со слушателя
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_MODULE_START, 0, function(){});
</syntaxhighlight>
Это новый вид события, предназначенный специально для разработки модуля. При разработке модуля следует учитывать что скриптовой файл стал закрыт для других скриптовых файлов. Это хзначить что теперь можно использовать одноименные переменные и названия функций в разных скриптовых файлах и они не будут перезаписываться, но это накладывает ограничение: нельзя получить доступ к функции из другого скриптового файла простым способом. Для получения доступа к функции из другого скриптового файла, следует импортировать скриптовый файл с помощью команды module.Import("FileName.js"). <br />
Пример:<br/>
<syntaxhighlight lang="javascript">
//Name_1.js - первый js файл
this.Text = "Hello, world!"; //Указатель на текстовую переменную
//Name_2.js - второй js файл
var Text = module.Import("Name_1.js").Text; //Импортируем из первого js файла объект с указателем на текстовую переменную
IR.Log(Text); //"Hello, world!" //выводим в лог переменную Text
</syntaxhighlight>
==Создание подустройств==
Основой любого модуля служат подустройства и задачей разработчика модуля является определить сколько подустройств будет в модуле и разработать логику работы подустройств. В состав каждого подустройства может входить виджет, пульт управления, собственный набор действий, событий и состояний. Все составляющие подустройства необходимо указать при его создании. Содержимое подустройства не может меняться в ходе работы модуля. Для создания подустройства используется команда:<br/>
<syntaxhighlight lang="javascript">
module.AddSubDevice(SystemName, [Device], [System], [Type], [Tags], [Name], [Callback]);
</syntaxhighlight>
,где<br/>
'''SystemName''' - системное имя подустройства<br/>
'''Device''' - драйвер, к которому будет привязано подустройство<br/>
'''System''' - устаревший параметр, следует использовать false<br/>
'''Type''' - тип smart устройства. Параметр в разработке<br/>
'''Tags''' - Массив объектов виртуальных тегов<br/>
'''Name''' - имя подустройства, которое отображается пользователю<br/>
'''Callback function(){do somethings}''' - функция, которая выполняется до наступления события IR.EVENT_ADD_SUBDEVICE<br/>
В ответ функция вернет ссылку на подустройство, по которой к нему можно обратиться.<br/>
Пример создания подустройств для HDL Relay устройств. Скрипт проверяет количество устройств в шине и в цикле создает подустройства<br/>
<syntaxhighlight lang="javascript">
for (var count = 1; count <= COUNT_CHANNEL; count++) {
// Создаем подустройство
l_oSubDevice = module.AddSubDevice("Relay " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_RELAY);
// Создаем команду StatusOnStart
if (count == 1)
l_oSubDevice.AddChannel("Relay:statusOnStart", [ChannelData]);
var l_sChannelName = "Relay:channel" + count;
// Добавляем каналы
l_oSubDevice.AddChannel(l_sChannelName, [ChannelData]);
l_oSubDevice.AddTag(l_sChannelName, [ChannelData]);
// Добавляем виртуальный тег
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_TAG_POWER, true);
};</syntaxhighlight><br/>
Таким способом можно добавить в подустройство все необходимые сущности. Также, при создании подустройства, активируется событие<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function, [pointer]);
</syntaxhighlight><br/>
В функцию передается ссылка на только что созданное подустройство. В данном событии можно добавлять к подустройству различные компоненты(действия, события, состояния, виджеты, каналы, теги). Например:<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function(in_oSubDevice){
Создаем действия
in_oSubDevice.AddAction("On", false, in_oSubDevice.SystemName + "_Power", lightID + "_1", IR.SUB_DEVICE_COMMAND_POWER_ON);
in_oSubDevice.AddAction("Off", false, in_oSubDevice.SystemName + "_Power", lightID + "_0", IR.SUB_DEVICE_COMMAND_POWER_OFF);
Создаем события
in_oSubDevice.AddEvent("On", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "1");
in_oSubDevice.AddEvent("Off", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "0");
Создаем состояния
in_oSubDevice.AddCondition("On", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "1");
in_oSubDevice.AddCondition("Off", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "0");
});</syntaxhighlight><br/>
Таким образом разработчик может создавать нужное количество подустройств при установке модуля или ручном добавлении новых подустройств
==Добавление виджетов к подустройству==

Полсе создания интерфейсов в редакторе и добавления функции добавления подустройств, вам потребуется создавать для каждого поустройства свой экземпляр виджета и привязывать его к подустройству. Для привязки виджета к подустройству используется метод<br/>
<syntaxhighlight lang="javascript">SubDevice.addWidget(in_Widget)</syntaxhighlight><br/>

Входным параметром метода является: '''in_Widget''' - объект - виджет, заранее созданный в редакторе.<br/>
Выходным параметром метода является: успешно или нет ('''True''', '''False''').<br/>
К примеру у нас 3 лампочки и для того, чтобы не создавать для каждой лампочки отдельный виджет, мы воспользуемся уже готовым примером нашего окна и просто будем клонировать его. Напишем пример создания виджета с помощью кода по уже существующему образцу.<br/>

Метод Clone позволяет клонировать уже существующее всплывающее окно.<br/>
<syntaxhighlight lang="javascript">Module.ClonePopup (in_Popup, in_Name)</syntaxhighlight><br/>
Входные параметры метода:
*'''in_Name''' - имя нового виджета.<br/>
*'''in_Popup''' - ссылка на всплывающее окно.<br/>
Выходным параметром метода является: успешно или нет ('''True''', '''False''').<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function(in_oSubDevice){
var popup = module.GetPopup("Dimmer"); // Обращаемся к виджету который собираемся скопировать
// Создаем виджет методом клонирования
var widget = in_oSubDevice.addWidget(module.ClonePopup(popup, "Dimmer"+ in_oSubDevice.Name));
});</syntaxhighlight><br/>
----
{{i}} Имена новых виджетов не должны повторяться.
----
При открытии полноценного пульта управления из виджета, необходимо помнить о том что пользователь будет запускать модуль как на планшета, так и на телефоне. Из-за разницы в величине экранов, разработчик модуля должен разработать 2 вида окон. Вид под телефонную версию модуля и вид под планшетную версию. При этом надо добавить в скрипт метод, который будет спрашивать у системы вид устройства, на котором запущен модуль, и открывать соответствующее окно
<syntaxhighlight lang="javascript">
if (IR.DisplayType == IR.DISPLAY_TYPE_PHONE) { //Если модуль открыт на телефоне
var l_oPopupScanner = module.GetPopup("Phone"); //Показываем попап, отрисованный для телефона
}
else {
var l_oPopupScanner = module.GetPopup("Tablet");//Если планшет, то открываем попап для планшета
}
</syntaxhighlight><br/>
==Работа с каналами и тегами==
После создания подустройства и добавления виджета, вам понадобится добавить к подустройству нужные для работы каналы и теги. Как и в версии i3 Pro, драйвер можно добавить в графическом интерфейсе редактора или в скрипте. Для каждого подустройства потребуется собственный набор каналов и тегов для выбранного драйвера. В ходе работы может потребоваться работать с тремя компонентами:<br/>
*Канал. Для создания канала следует использовать метод<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddChannel(Name, DataArray)
</syntaxhighlight>где,<br/>
'''Name''' - имя канала<br/>
'''DataArray''' - массив данных, специфичный для каждого драйвера<br/>
*Тег. Для создания тега следует использовать метод<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddTag(Name, DataArray)
</syntaxhighlight>где,<br/>
'''Name''' - имя тега<br/>
'''DataArray''' - массив данных, специфичный для каждого драйвера<br/>
*Виртуальный тег. Для создания виртуального следует использовать метод<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddVirtualTag(Name, Value, [Edit], [smartID], [Hidden])
</syntaxhighlight>где,<br/>
'''Name'''- имя виртуального тега подустройства<br/>
'''Value''' - Значение тега<br/>
'''Edit''' - Разрешение редактирования тега<br/>
'''smartID''' - Параметр в разработке! Необходимо устанавливать false<br/>
'''Hidden''' - Признак скрытости тега<br/>
===Пример создания каналов и тегов при создании подустройства:===
<syntaxhighlight lang="javascript">
l_oSubDevice = module.AddSubDevice("Light " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_DIMMER);

// Adding channel StatusOnStart
if (count == 1)
l_oSubDevice.AddChannel("Dimmer:statusOnStart", [ChannelData]);

// Assigned to the variable name of the channel
var l_sChannelName = "Dimmer:channel" + count;

// Adding channels
l_oSubDevice.AddChannel(l_sChannelName, [ChannelData]);
l_oSubDevice.AddTag(l_sChannelName, [TagData]);

// Adding smart virtual tag
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_COMMAND_POWER, true);
l_oSubDevice.AddVirtualTag("Power On", 0, false, IR.SUB_DEVICE_COMMAND_POWER_ON, true);
l_oSubDevice.AddVirtualTag("Power Off", 0, false, IR.SUB_DEVICE_COMMAND_POWER_OFF, true);
l_oSubDevice.AddVirtualTag("Level", 0, false, IR.SUB_DEVICE_COMMAND_LEVEL, true);
</syntaxhighlight>
==Установка модуля в приложение==
Модули хранятся в магазине модулей iRidium Store и могут устанавливаться в приложение двумя способами:<br/>
*С помощью сканера<br/>
*Вручную<br/>
===Разработка Setup===
Для любого варианта необходимо разрабатывать файл Setup. Это специальный скриптовой файл, в котором прописаны поля, необходимые для работы модуля. Такими полями могут выступать ip адрес устройства, порт, название города итд. Для разработки Setup необходимо создать новый скриптовый файл и задать его тип "Setup". Каждое поле является тегом и к нему можно получить доступ из скрипта и получить введенное значение
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:СетапБонго.png]]</div></div>
Файл Setup состоит из 2-ух частей. Первая часть это настройки драйверов. В этих настройках следует запрашивать ip адреса, порты и логины, для подключения драйвера у устройству. Вторая часть файла это общие настройки модуля, такие как количество выходов, ключи доступа.
Для установки поля в Setup необходимо настроить следующие поля в скрипте:
* Тип поля - надо указать какое поле надо показать пользователю(текстовое поле, массив значений итд. Подробнее описано в API)
* Имя поля - название поля, которое увидит пользователь при настройке модуля
* Значение по умолчанию - какое значение следует подставлять по умолчанию
* Функция проверки - функция валидации значения в поле. Здесь требуется написать функцию, которая будет проверять корректность введенных данных.
Например, скрипт "Setup" для модуля HDL выглядит следующим образом:
<syntaxhighlight lang="javascript">
{
// Data to connect drivers, created in Project Device Panel
Drivers:
[
{
Name: "HDL-BUS Pro Network (UDP)",
Properties:
[
{
Type: "textfield",
Name: "Host",
DefaultValue: "255.255.255.255",
Validation: function(in_sValue) {
var l_aValueHost = in_sValue.split(".");
if (l_aValueHost.length != 4) {
return "Please input correct Host";
} else
if (parseInt(l_aValueHost[0], 10)>=0
&& parseInt(l_aValueHost[0], 10)<=255
&& parseInt(l_aValueHost[1], 10)>=0
&& parseInt(l_aValueHost[1], 10)<=255
&& parseInt(l_aValueHost[2], 10)>=0
&& parseInt(l_aValueHost[2], 10)<=255
&& parseInt(l_aValueHost[3], 10)>=0
&& parseInt(l_aValueHost[3], 10)<=255
)
return 0
else
return "Please input correct Host";
}
},
{
Type: "textfield",
Name: "Port",
DefaultValue: "6000",
Validation: function(in_sValue) {
if(parseInt(in_sValue, 10)>=0)
return 0
else
return "Please input correct Port";
}
}
]
}
],

// General information for the module (driver and generated by script)
Module: [{
Name: "Channels Count",
Validation: function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input Count";
}
},
{
Type: "textfield",
Name : "SubnetID",
Validation : function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input SubnetID";
}
},
{
Type: "textfield",
Name : "DeviceID",
Validation : function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input DeviceID";
}
}

]
}
</syntaxhighlight>
Для получения данных из полей Setup следует использовать функцию
<syntaxhighlight lang="javascript">
module.GetProperty("Имя поля")
</syntaxhighlight>
<br />
Помимо стандартных параметров, можно запрашивать любые, необходимые для инициализации модуля, параметры. Параметры драйвера подставляются в драйвер автоматически. Остальные параметры следует запрашивать и использовать вручную<br />
Пример работы с параметрами Setup
<syntaxhighlight lang="javascript">
var COUNT_CHANNEL = parseInt(module.GetProperty("Channel count")); // Getting count channel
var SubNetID = parseInt(module.GetProperty("SubnetID")); // Getting subnet id
var DeviceID = parseInt(module.GetProperty("DeviceID")); // Getting device id
</syntaxhighlight>
===Установка модуля вручную===
===Установка модуля с помощью сканера===
===Ручное добавление подустройств===
===Авторизация===
===Смена настроек===
===Удаление модуля===

Translations:DevManual/76/en

2017-04-03T10:47:39Z

Ildar:

Module grid and blocks

DevManual/en

2017-04-03T10:43:34Z

Ildar: Новая страница: «Modular grid and blocks»

<languages/>
=Module development guide=
==Definitions==

'''Module''' - is a component that allows you to control one type of equipment by its unique ID. The module is located in the store of modules.

'''Control panel (mobile device)''' - is a device from which the project i3 lite is launched (tablet, smartphone).

'''Store of modules''' - is a cloud server for uploading ready-made modules. The module store is available from the i3 lite application or on our[http://www.iridiummobile.ru/store/ site]

'''iRidium Studio''' - is a editor that allows to create the module to control device for i3 lite application. You need to use a special editor build for [http://www.iridiummobile.net/redirects/?go=iRidium_SETUP_LITE module developers] to develop the module

'''i3 lite''' - is an application to create, set and use i3 lite projects.

'''i3 lite project''' – is an automation project made up of ready equipment control modules. i3 lite projects differ from i2 Control projects: i3 lite projects can be edited dynamically without prior editing in iRidium Studio. i3 lite project consists of several small parts that can be put together into a single whole in i3 lite app with the help of the built-in constructor. It can also be easily edited in the app. As a result, a big number of intermediate processes are no longer necessary, such as installing software on PC, uploading projects on contol panels. All is done in one place - a control panel.

'''SubDevice''' - This is a virtual representation of the working area of the physical device. If we take as an example a 6-channel dimmer it has 6 sub-devices, because each independent device requires a separate control interface and connects to one channel.

'''Room (in i3 lite)''' - The visual part of i3 lite containing hardware management widgets. The project in i3 lite consists of rooms located on the floors

'''Widget''' - is a visual module component located in the room. It has limitations in size and fixed position in the room interface. It contains the main module functionality. For additional functions Remote is used.

'''Remote''' - is a visual module component which is hidden by default. It opens only when clicking on the corresponding item of the widget. It does not have size limitations (not more than the panel display size) and can be located in any part of the room interface (it is usually located in the middle of the panel display). It contains additional functionality of the module.

'''Macros''' - is a sequence of commands of various modules, which is activated by pressing. Contains "Action" and "Condition". For example, the macros "turn off all the lights in the house" will send the shutdown command to all devices responsible for lighting.

'''Routine''' - is a sequence of commands of various modules, which is activated automatically when a certain event occurs. Contains "Event", "Action" and "Condition". For example, "turn on the light if the motion sensor is triggered"

'''Event''' - is a routine component that describes the control command and the value range. If the value is sent in the indicated range, the routine is executed. For example, the event "Motion appeared" is activated if the motion sensor is triggered.

'''Action''' - is a component of macros and routines. It describes the control command and value that must be sent to the command. For example, "turn on the light". There are 2 types of Action: Simple Action and Advanced Action.

'''Simple Action''' - Simple Action is used when the command and Action value are known in advance.

'''Advanced Action''' - Advanced Action is used when the command is known but the value is unknown. The value is set dynamically when Action is used in i3 lite (but not when creating in iRidium studio).

'''Condition''' - is a component of macros and scenes. It describes the control command and value range. When a value from the value range is sent Action is executed.

'''Scanner''' - is a software part, that analyzes any bus looking for connected devices. Found connected devices are displayed in a list. Modules for the found devices are downloaded from iRidium store and the devices become available to control in i3 lite.
==Module concept==
The module is an independent subroutine of the i3 lite application which is built in the project and has an independent interface, driver and logic. Modules are developed in the [http://www.iridiummobile.net/redirects/?go=iRidium_SETUP_LITE iRidium Studio] editor and located in the module store [http://www.iridiummobile.ru/store/ iRidium Store]. Integrator downloads the module from the module store for each individual project.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ModuleInScheme.png]]</div></div>
</div>

There are two types of modules:
*Control module - module for hardware control
*Scanner - module for searching hardware in the local network and loading modules for found devices
== How to start developing the module ==
----

{{i}} Before starting your work, it is recommended to read [http://dev.iridiummobile.net/How_to_begin iRidium documentation]. It describes the basics of working with iRidium. The i3 lite documentation describes how to develop modules for the i3 lite platform for users, who already know iRidium. If you want to write script use [[Special:MyLanguage/Developers_API | i3 lite API]].
----

The module life cycle consists of:
* Developing the graphic part in iRidium studio
* Developing the driver part (scripts, devices)
* Testing
* Publishing in iRidium store
* Using (module download via the i3 lite application from the cloud and adding to automation projects)
<br/>
==Module structure ==
Each module must consist of subdevices. The subdevice is a virtual representation of the working area of a physical device. Many devices support multiple workgroups with the same functionality. Each workgroup may be in a separate zone. To fully control the zone, you need to create a subdevice for each workgroup of the device. For example, a 6-channel HDL dimmer contains 6 dimmable channels, through which 6 working groups can be controlled. Therefore, it is advisable to select in the module 6 subdevices for the possibility of creating actions, events and conditions for each workgroup separately. The presence of subdevice in the i3 lite module is obligatory. The number of sub-devices can be from one to many. Usually the number of subdevice is equal to the number of channels of the controller, the number of its work areas or logical devices.

Subdevice consists of:
* Conditions
* Actions
* Events
* Widgets

Conditions, actions and events are logical elements of the subdevice, on their basis macros and routines are created. Widget is a graphical element, through which the user will control subdevice. Usually one subdevice contains one widget, but the number of conditions, actions and events varies (from zero to many). The number of subdevices in the module can be either fixed or not. For example, you can develop a module only for a 6-channel dimmer, and you can make a module that will request the hardware for the number of subdevices and create the required number of subdevices.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ModuleStruct.png]]</div></div>
</div>
==Creating the module interface ==
The interface part of the midule consists of:
* widgets - interface part of the subdevice, which is located in the rooms and has basic control functions
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:WidgetExample.png]]</div></div>
</div>
* Remote - interface part of the module, which has a set of device functions and opens to the full screen, when you click on the widget button
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:RemoteExample.png]]</div></div>
</div>
* Authorization window - Authorization is required to work with some devices. To do this, the developer can create a special authorization window that is available in the module settings
картинка кнопки авторизации и окна авторизации
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:AutorisationExample.png]]</div></div>
</div>
* The module settings window is a window where you need to enter the parameters for the module operation
картинка окна настроек модуля и кнопки открытия
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:SettingsExample.png]]</div></div>
</div>
The whole graphic part is drawn in the graphical interface of the iRidium studio editor. In contradistinction to i3 pro, the module's interface should be made up of ready-made graphic components located in the gallery.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ItemGallery.png]]</div></div>
</div>

==== Widget ====

Widget is a visual component of the module, a kind of Popup that will be displayed in the room. The main task of the widget is to display the basic controls of the subdevice and to provide a module transition to the Remote control of the subdevice. For example, to control a media player, you can place a volume slider or Mute button for quick access to adjusting the volume. The weather widget can display the current weather, and the control panel will contain the weather forecast for all 5 days.<br />
The module does not make sense without widget, because it will not have a graphical representation in the i3 lite project.

Widget has a limited size
# Width '''640'''
# Height can not exceed '''1200'''

[[Файл:Пример виджета.png|center|thumb|Рис. Widget example]]

To create a widget, click the Add pop-up button in the Project overview panel and in the appeared menu select popup type: "Widget", set the name and properties:
[[Файл:ПанельПопап.png|thumb|center]]

Properties of a created widget can be changed with the help of '''Object Properties'''.<br />
Graphic items are assigned to channels like in popups:
[[Файл:Связывание_канала_команды_и_графического_элемента.png|center|thumb|Рис. Связывание канала команды и графического элемента]]
Widget will be displayed:
* In the room when a client uses the project
[[Файл:В_комнате_при_использовании_пользователем_проекта.png|center|thumb|]]
* In the module settings when it is added to the project:
[[Файл:И_в_настройках_модуля_при_добавлении_его_в_проект.png ‎|center|thumb|]]
====Remote and other graphic windows====

Remote (a remote control) is a graphical area to control SubDevices. Unlike wigets, it can have free size and position. And it is displayed on call. Remote is displayed when a button to go to the remote control is pressed on a widget.
Items to control equipment are placed on Remote (buttons, lists, switches, levels). There can be from 0 to several remote controls. Example of Remote:<br />
[[Файл:Пульт_управления.png ‎|center|thumb|]]<br />

Remote is created like a Widget. The only difference is to select "Remote" when you click "Add Popup Page" in the "Device Type" property.
==Interface design standard==
For the convenience of interface design, a standard was developed in which graphic windows should be developed in the module so that the modules of different developers looked uniformly within the framework of one project.
===Basic principles===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:GeneralUI.png]]</div></div>
<div class="col-sm-12 col-md-6">
Виджет состоит из «Header» и дополнительных модулей основного функционала. <br/>
«Header» — верхний модуль виджета.<br/>
«Header» содержит:<br/>
- наименование виджета;
- наименование устройства, которым<br/>
управляет виджет;<br/>
- иконка категории устройства.<br/>
<br/>
Дополнительные модули содержат элементы управления устройством.
</div>
</div>
===Modular grid and blocks===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka1.png]]</div></div>
<div class="col-sm-12 col-md-6">
Модульная сетка виджета представляет собой блоки 640 pt в ширину
и 120 pt в высоту. Каждый блок имеет сетку 8х8 pt.
Скругления углов равно 12,5 ut. (Circle 25)
</div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka2.png]]</div></div>
<div class="col-sm-12 col-md-6">
Принцип построения блока виджета представляет собой конструктор из
элементов управления (кнопок, свитчей, лэйблов) от меньшего к большему.
</div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka3.png]]</div></div>
<div class="col-sm-12 col-md-6">
Элементы управления комбинируются и объединяются в блок,
а блоки объединяются в панель управления.
</div>
</div>
===Кнопки===
<big>'''Toggle'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Toggle.png]]</div></div>
<div class="col-sm-12 col-md-6">
Кнопка изменения значения «вкл/выкл». Применяется как в случаях с неизвестным состоянием работы устройства, так и для управления функционалом устройства.
</div>
</div>
<big>'''Switch'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Switch.png]]</div></div>
<div class="col-sm-12 col-md-6">
Кнопка изменения значения «вкл/выкл». Применяется только в случаях с известным состоянием работы устройства.
</div>
</div>
<big>'''Multistate'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Multistate.png]]</div></div>
<div class="col-sm-12 col-md-6">
Кнопка изменения значения предустановленного состояния устройства применяется только в случаях с известным cостоянием работы устройства.
</div>
</div>
===Кнопка-стрелка===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:arrow1.png]]</div></div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:arrow2.png]]</div></div>
</div>
'''Действие кнопки'''<br/>
При нажатии на кнопку происходит вызов «PopUp».<br/>
'''Содержимое «PopUp»'''<br/>
«Input field», «Single selection», «Multiple selection».
===Слайдеры===
<div class="row">
<div class="col-sm-12 col-md-6">
Standart
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:StandartSlider.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
Value
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ValueSlider.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
Progress
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ProgressSlider.png]]</div></div>
</div>
===Описание===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Description.png]]</div></div>
===Иконки===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Icons1.png]]</div></div>
Все иконки делятся по сферам применения, и их главное различие — размеры
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Icons2.png]]</div></div>
===Виджет «header»===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:WidgetHeader.png]]</div></div>
===Расположение кнопок===
<div class="row">
<div class="col-sm-12 col-md-6">
Форм фактор: 128х120 pt
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:FormFactor.png]]</div></div>
</div>
Все кнопки имеют два состояния — покой и активность.
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:OFFicon.png]]</div></div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ONicon.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
В состоянии покоя цвет кнопки всегда # 848484 или RGB 132
</div>
<div class="col-sm-12 col-md-6">
Активным состояние кнопки считается только тогда, когда действие получило обратную связь является кратковременным или мгновенным (например: «Play» в медиаплеере) или действие, которое находится в состоянии активности продолжительное время и требует дополнительного воздействия для отключения состояния активности
(например: «Repeat» в медиаплеере).
</div>
</div>
==Основы работы со скриптами==

После проектирования интерфейса и добавления драйвера, вам понадобится разработать логику работы модуля в скриптах. Скриптовая часть при разработке i3 lite модуля имеет некоторые особенности. Перед разработкой скриптовой части lite модуля рекомендуем ознакомиться с [http://dev.iridiummobile.net/JS_Guide iRidium Pro API] и [[Special:MyLanguage/Developers_API | i3 lite API]]. <br />

Модуль может содержать неограниченное количество скриптов.
Существуют разные типы скриптов для модуля:
* Driver - в скриптовых файлах данного типа должны содержаться скрипты, отвечающие за работу с драйвером
* GUI - В этих скриптовых файлах содержатся скрипты, отвечающие за работу с графикой
* Common - в данных скриптовых файлах должны содержаться скрипты общего характера, тут может быть набор дополнительных функций или описание классов второстепенного назначения
* Setup - это специальный скриптовой файл, в нем содержиться информация о настройке модуля. а именно - список полей, обязательных для заполнения, типы этих полей и функции проверки правильности введенных данных.

Разделение на типы необходимо для правильной обработки модуля на сервере. На сервере работает только логика и драверная часть модулей, но сервер ничего не знает о графической части. Поэтому разработчику модуля требуется разбивать скрипты по типам. Сервер игнорирует файлы для работы с графической частью. <br />

При разработке модуля следует использовать простраство имен module вместо IR. Таким образом слушатель будет иметь вид module.AddListener(… <br />

Каждый скриптовой файл должен начинаться со слушателя
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_MODULE_START, 0, function(){});
</syntaxhighlight>
Это новый вид события, предназначенный специально для разработки модуля. При разработке модуля следует учитывать что скриптовой файл стал закрыт для других скриптовых файлов. Это хзначить что теперь можно использовать одноименные переменные и названия функций в разных скриптовых файлах и они не будут перезаписываться, но это накладывает ограничение: нельзя получить доступ к функции из другого скриптового файла простым способом. Для получения доступа к функции из другого скриптового файла, следует импортировать скриптовый файл с помощью команды module.Import("FileName.js"). <br />
Пример:<br/>
<syntaxhighlight lang="javascript">
//Name_1.js - первый js файл
this.Text = "Hello, world!"; //Указатель на текстовую переменную
//Name_2.js - второй js файл
var Text = module.Import("Name_1.js").Text; //Импортируем из первого js файла объект с указателем на текстовую переменную
IR.Log(Text); //"Hello, world!" //выводим в лог переменную Text
</syntaxhighlight>
==Создание подустройств==
Основой любого модуля служат подустройства и задачей разработчика модуля является определить сколько подустройств будет в модуле и разработать логику работы подустройств. В состав каждого подустройства может входить виджет, пульт управления, собственный набор действий, событий и состояний. Все составляющие подустройства необходимо указать при его создании. Содержимое подустройства не может меняться в ходе работы модуля. Для создания подустройства используется команда:<br/>
<syntaxhighlight lang="javascript">
module.AddSubDevice(SystemName, [Device], [System], [Type], [Tags], [Name], [Callback]);
</syntaxhighlight>
,где<br/>
'''SystemName''' - системное имя подустройства<br/>
'''Device''' - драйвер, к которому будет привязано подустройство<br/>
'''System''' - устаревший параметр, следует использовать false<br/>
'''Type''' - тип smart устройства. Параметр в разработке<br/>
'''Tags''' - Массив объектов виртуальных тегов<br/>
'''Name''' - имя подустройства, которое отображается пользователю<br/>
'''Callback function(){do somethings}''' - функция, которая выполняется до наступления события IR.EVENT_ADD_SUBDEVICE<br/>
В ответ функция вернет ссылку на подустройство, по которой к нему можно обратиться.<br/>
Пример создания подустройств для HDL Relay устройств. Скрипт проверяет количество устройств в шине и в цикле создает подустройства<br/>
<syntaxhighlight lang="javascript">
for (var count = 1; count <= COUNT_CHANNEL; count++) {
// Создаем подустройство
l_oSubDevice = module.AddSubDevice("Relay " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_RELAY);
// Создаем команду StatusOnStart
if (count == 1)
l_oSubDevice.AddChannel("Relay:statusOnStart", [ChannelData]);
var l_sChannelName = "Relay:channel" + count;
// Добавляем каналы
l_oSubDevice.AddChannel(l_sChannelName, [ChannelData]);
l_oSubDevice.AddTag(l_sChannelName, [ChannelData]);
// Добавляем виртуальный тег
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_TAG_POWER, true);
};</syntaxhighlight><br/>
Таким способом можно добавить в подустройство все необходимые сущности. Также, при создании подустройства, активируется событие<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function, [pointer]);
</syntaxhighlight><br/>
В функцию передается ссылка на только что созданное подустройство. В данном событии можно добавлять к подустройству различные компоненты(действия, события, состояния, виджеты, каналы, теги). Например:<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function(in_oSubDevice){
Создаем действия
in_oSubDevice.AddAction("On", false, in_oSubDevice.SystemName + "_Power", lightID + "_1", IR.SUB_DEVICE_COMMAND_POWER_ON);
in_oSubDevice.AddAction("Off", false, in_oSubDevice.SystemName + "_Power", lightID + "_0", IR.SUB_DEVICE_COMMAND_POWER_OFF);
Создаем события
in_oSubDevice.AddEvent("On", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "1");
in_oSubDevice.AddEvent("Off", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "0");
Создаем состояния
in_oSubDevice.AddCondition("On", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "1");
in_oSubDevice.AddCondition("Off", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "0");
});</syntaxhighlight><br/>
Таким образом разработчик может создавать нужное количество подустройств при установке модуля или ручном добавлении новых подустройств
==Добавление виджетов к подустройству==

Полсе создания интерфейсов в редакторе и добавления функции добавления подустройств, вам потребуется создавать для каждого поустройства свой экземпляр виджета и привязывать его к подустройству. Для привязки виджета к подустройству используется метод<br/>
<syntaxhighlight lang="javascript">SubDevice.addWidget(in_Widget)</syntaxhighlight><br/>

Входным параметром метода является: '''in_Widget''' - объект - виджет, заранее созданный в редакторе.<br/>
Выходным параметром метода является: успешно или нет ('''True''', '''False''').<br/>
К примеру у нас 3 лампочки и для того, чтобы не создавать для каждой лампочки отдельный виджет, мы воспользуемся уже готовым примером нашего окна и просто будем клонировать его. Напишем пример создания виджета с помощью кода по уже существующему образцу.<br/>

Метод Clone позволяет клонировать уже существующее всплывающее окно.<br/>
<syntaxhighlight lang="javascript">Module.ClonePopup (in_Popup, in_Name)</syntaxhighlight><br/>
Входные параметры метода:
*'''in_Name''' - имя нового виджета.<br/>
*'''in_Popup''' - ссылка на всплывающее окно.<br/>
Выходным параметром метода является: успешно или нет ('''True''', '''False''').<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function(in_oSubDevice){
var popup = module.GetPopup("Dimmer"); // Обращаемся к виджету который собираемся скопировать
// Создаем виджет методом клонирования
var widget = in_oSubDevice.addWidget(module.ClonePopup(popup, "Dimmer"+ in_oSubDevice.Name));
});</syntaxhighlight><br/>
----
{{i}} Имена новых виджетов не должны повторяться.
----
При открытии полноценного пульта управления из виджета, необходимо помнить о том что пользователь будет запускать модуль как на планшета, так и на телефоне. Из-за разницы в величине экранов, разработчик модуля должен разработать 2 вида окон. Вид под телефонную версию модуля и вид под планшетную версию. При этом надо добавить в скрипт метод, который будет спрашивать у системы вид устройства, на котором запущен модуль, и открывать соответствующее окно
<syntaxhighlight lang="javascript">
if (IR.DisplayType == IR.DISPLAY_TYPE_PHONE) { //Если модуль открыт на телефоне
var l_oPopupScanner = module.GetPopup("Phone"); //Показываем попап, отрисованный для телефона
}
else {
var l_oPopupScanner = module.GetPopup("Tablet");//Если планшет, то открываем попап для планшета
}
</syntaxhighlight><br/>
==Работа с каналами и тегами==
После создания подустройства и добавления виджета, вам понадобится добавить к подустройству нужные для работы каналы и теги. Как и в версии i3 Pro, драйвер можно добавить в графическом интерфейсе редактора или в скрипте. Для каждого подустройства потребуется собственный набор каналов и тегов для выбранного драйвера. В ходе работы может потребоваться работать с тремя компонентами:<br/>
*Канал. Для создания канала следует использовать метод<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddChannel(Name, DataArray)
</syntaxhighlight>где,<br/>
'''Name''' - имя канала<br/>
'''DataArray''' - массив данных, специфичный для каждого драйвера<br/>
*Тег. Для создания тега следует использовать метод<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddTag(Name, DataArray)
</syntaxhighlight>где,<br/>
'''Name''' - имя тега<br/>
'''DataArray''' - массив данных, специфичный для каждого драйвера<br/>
*Виртуальный тег. Для создания виртуального следует использовать метод<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddVirtualTag(Name, Value, [Edit], [smartID], [Hidden])
</syntaxhighlight>где,<br/>
'''Name'''- имя виртуального тега подустройства<br/>
'''Value''' - Значение тега<br/>
'''Edit''' - Разрешение редактирования тега<br/>
'''smartID''' - Параметр в разработке! Необходимо устанавливать false<br/>
'''Hidden''' - Признак скрытости тега<br/>
===Пример создания каналов и тегов при создании подустройства:===
<syntaxhighlight lang="javascript">
l_oSubDevice = module.AddSubDevice("Light " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_DIMMER);

// Adding channel StatusOnStart
if (count == 1)
l_oSubDevice.AddChannel("Dimmer:statusOnStart", [ChannelData]);

// Assigned to the variable name of the channel
var l_sChannelName = "Dimmer:channel" + count;

// Adding channels
l_oSubDevice.AddChannel(l_sChannelName, [ChannelData]);
l_oSubDevice.AddTag(l_sChannelName, [TagData]);

// Adding smart virtual tag
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_COMMAND_POWER, true);
l_oSubDevice.AddVirtualTag("Power On", 0, false, IR.SUB_DEVICE_COMMAND_POWER_ON, true);
l_oSubDevice.AddVirtualTag("Power Off", 0, false, IR.SUB_DEVICE_COMMAND_POWER_OFF, true);
l_oSubDevice.AddVirtualTag("Level", 0, false, IR.SUB_DEVICE_COMMAND_LEVEL, true);
</syntaxhighlight>
==Установка модуля в приложение==
Модули хранятся в магазине модулей iRidium Store и могут устанавливаться в приложение двумя способами:<br/>
*С помощью сканера<br/>
*Вручную<br/>
===Разработка Setup===
Для любого варианта необходимо разрабатывать файл Setup. Это специальный скриптовой файл, в котором прописаны поля, необходимые для работы модуля. Такими полями могут выступать ip адрес устройства, порт, название города итд. Для разработки Setup необходимо создать новый скриптовый файл и задать его тип "Setup". Каждое поле является тегом и к нему можно получить доступ из скрипта и получить введенное значение
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:СетапБонго.png]]</div></div>
Файл Setup состоит из 2-ух частей. Первая часть это настройки драйверов. В этих настройках следует запрашивать ip адреса, порты и логины, для подключения драйвера у устройству. Вторая часть файла это общие настройки модуля, такие как количество выходов, ключи доступа.
Для установки поля в Setup необходимо настроить следующие поля в скрипте:
* Тип поля - надо указать какое поле надо показать пользователю(текстовое поле, массив значений итд. Подробнее описано в API)
* Имя поля - название поля, которое увидит пользователь при настройке модуля
* Значение по умолчанию - какое значение следует подставлять по умолчанию
* Функция проверки - функция валидации значения в поле. Здесь требуется написать функцию, которая будет проверять корректность введенных данных.
Например, скрипт "Setup" для модуля HDL выглядит следующим образом:
<syntaxhighlight lang="javascript">
{
// Data to connect drivers, created in Project Device Panel
Drivers:
[
{
Name: "HDL-BUS Pro Network (UDP)",
Properties:
[
{
Type: "textfield",
Name: "Host",
DefaultValue: "255.255.255.255",
Validation: function(in_sValue) {
var l_aValueHost = in_sValue.split(".");
if (l_aValueHost.length != 4) {
return "Please input correct Host";
} else
if (parseInt(l_aValueHost[0], 10)>=0
&& parseInt(l_aValueHost[0], 10)<=255
&& parseInt(l_aValueHost[1], 10)>=0
&& parseInt(l_aValueHost[1], 10)<=255
&& parseInt(l_aValueHost[2], 10)>=0
&& parseInt(l_aValueHost[2], 10)<=255
&& parseInt(l_aValueHost[3], 10)>=0
&& parseInt(l_aValueHost[3], 10)<=255
)
return 0
else
return "Please input correct Host";
}
},
{
Type: "textfield",
Name: "Port",
DefaultValue: "6000",
Validation: function(in_sValue) {
if(parseInt(in_sValue, 10)>=0)
return 0
else
return "Please input correct Port";
}
}
]
}
],

// General information for the module (driver and generated by script)
Module: [{
Name: "Channels Count",
Validation: function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input Count";
}
},
{
Type: "textfield",
Name : "SubnetID",
Validation : function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input SubnetID";
}
},
{
Type: "textfield",
Name : "DeviceID",
Validation : function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input DeviceID";
}
}

]
}
</syntaxhighlight>
Для получения данных из полей Setup следует использовать функцию
<syntaxhighlight lang="javascript">
module.GetProperty("Имя поля")
</syntaxhighlight>
<br />
Помимо стандартных параметров, можно запрашивать любые, необходимые для инициализации модуля, параметры. Параметры драйвера подставляются в драйвер автоматически. Остальные параметры следует запрашивать и использовать вручную<br />
Пример работы с параметрами Setup
<syntaxhighlight lang="javascript">
var COUNT_CHANNEL = parseInt(module.GetProperty("Channel count")); // Getting count channel
var SubNetID = parseInt(module.GetProperty("SubnetID")); // Getting subnet id
var DeviceID = parseInt(module.GetProperty("DeviceID")); // Getting device id
</syntaxhighlight>
===Установка модуля вручную===
===Установка модуля с помощью сканера===
===Ручное добавление подустройств===
===Авторизация===
===Смена настроек===
===Удаление модуля===

Translations:DevManual/76/en

2017-04-03T10:43:33Z

Ildar: Новая страница: «Modular grid and blocks»

Modular grid and blocks

Translations:DevManual/75/en

2017-04-03T10:42:42Z

Ildar: Новая страница: «The widget consists of the "Header" and additional modules of the main functional. <br/> "Header" - the top module of the widget.<br/> "Header" contains:<br/> - t…»

The widget consists of the "Header" and additional modules of the main functional. <br/>
"Header" - the top module of the widget.<br/>
"Header" contains:<br/>
- the name of the widget;
- the name of the device, that<br/>is controlled by the widget;<br/>
-device category icon.<br/>
<br/>
The additional modules contain the device controls.

Translations:DevManual/74/en

2017-04-03T10:33:51Z

Ildar: Новая страница: «Basic principles»

Basic principles

DevManual/en

2017-04-03T10:33:51Z

Ildar: Новая страница: «Basic principles»

<languages/>
=Module development guide=
==Definitions==

'''Module''' - is a component that allows you to control one type of equipment by its unique ID. The module is located in the store of modules.

'''Control panel (mobile device)''' - is a device from which the project i3 lite is launched (tablet, smartphone).

'''Store of modules''' - is a cloud server for uploading ready-made modules. The module store is available from the i3 lite application or on our[http://www.iridiummobile.ru/store/ site]

'''iRidium Studio''' - is a editor that allows to create the module to control device for i3 lite application. You need to use a special editor build for [http://www.iridiummobile.net/redirects/?go=iRidium_SETUP_LITE module developers] to develop the module

'''i3 lite''' - is an application to create, set and use i3 lite projects.

'''i3 lite project''' – is an automation project made up of ready equipment control modules. i3 lite projects differ from i2 Control projects: i3 lite projects can be edited dynamically without prior editing in iRidium Studio. i3 lite project consists of several small parts that can be put together into a single whole in i3 lite app with the help of the built-in constructor. It can also be easily edited in the app. As a result, a big number of intermediate processes are no longer necessary, such as installing software on PC, uploading projects on contol panels. All is done in one place - a control panel.

'''SubDevice''' - This is a virtual representation of the working area of the physical device. If we take as an example a 6-channel dimmer it has 6 sub-devices, because each independent device requires a separate control interface and connects to one channel.

'''Room (in i3 lite)''' - The visual part of i3 lite containing hardware management widgets. The project in i3 lite consists of rooms located on the floors

'''Widget''' - is a visual module component located in the room. It has limitations in size and fixed position in the room interface. It contains the main module functionality. For additional functions Remote is used.

'''Remote''' - is a visual module component which is hidden by default. It opens only when clicking on the corresponding item of the widget. It does not have size limitations (not more than the panel display size) and can be located in any part of the room interface (it is usually located in the middle of the panel display). It contains additional functionality of the module.

'''Macros''' - is a sequence of commands of various modules, which is activated by pressing. Contains "Action" and "Condition". For example, the macros "turn off all the lights in the house" will send the shutdown command to all devices responsible for lighting.

'''Routine''' - is a sequence of commands of various modules, which is activated automatically when a certain event occurs. Contains "Event", "Action" and "Condition". For example, "turn on the light if the motion sensor is triggered"

'''Event''' - is a routine component that describes the control command and the value range. If the value is sent in the indicated range, the routine is executed. For example, the event "Motion appeared" is activated if the motion sensor is triggered.

'''Action''' - is a component of macros and routines. It describes the control command and value that must be sent to the command. For example, "turn on the light". There are 2 types of Action: Simple Action and Advanced Action.

'''Simple Action''' - Simple Action is used when the command and Action value are known in advance.

'''Advanced Action''' - Advanced Action is used when the command is known but the value is unknown. The value is set dynamically when Action is used in i3 lite (but not when creating in iRidium studio).

'''Condition''' - is a component of macros and scenes. It describes the control command and value range. When a value from the value range is sent Action is executed.

'''Scanner''' - is a software part, that analyzes any bus looking for connected devices. Found connected devices are displayed in a list. Modules for the found devices are downloaded from iRidium store and the devices become available to control in i3 lite.
==Module concept==
The module is an independent subroutine of the i3 lite application which is built in the project and has an independent interface, driver and logic. Modules are developed in the [http://www.iridiummobile.net/redirects/?go=iRidium_SETUP_LITE iRidium Studio] editor and located in the module store [http://www.iridiummobile.ru/store/ iRidium Store]. Integrator downloads the module from the module store for each individual project.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ModuleInScheme.png]]</div></div>
</div>

There are two types of modules:
*Control module - module for hardware control
*Scanner - module for searching hardware in the local network and loading modules for found devices
== How to start developing the module ==
----

{{i}} Before starting your work, it is recommended to read [http://dev.iridiummobile.net/How_to_begin iRidium documentation]. It describes the basics of working with iRidium. The i3 lite documentation describes how to develop modules for the i3 lite platform for users, who already know iRidium. If you want to write script use [[Special:MyLanguage/Developers_API | i3 lite API]].
----

The module life cycle consists of:
* Developing the graphic part in iRidium studio
* Developing the driver part (scripts, devices)
* Testing
* Publishing in iRidium store
* Using (module download via the i3 lite application from the cloud and adding to automation projects)
<br/>
==Module structure ==
Each module must consist of subdevices. The subdevice is a virtual representation of the working area of a physical device. Many devices support multiple workgroups with the same functionality. Each workgroup may be in a separate zone. To fully control the zone, you need to create a subdevice for each workgroup of the device. For example, a 6-channel HDL dimmer contains 6 dimmable channels, through which 6 working groups can be controlled. Therefore, it is advisable to select in the module 6 subdevices for the possibility of creating actions, events and conditions for each workgroup separately. The presence of subdevice in the i3 lite module is obligatory. The number of sub-devices can be from one to many. Usually the number of subdevice is equal to the number of channels of the controller, the number of its work areas or logical devices.

Subdevice consists of:
* Conditions
* Actions
* Events
* Widgets

Conditions, actions and events are logical elements of the subdevice, on their basis macros and routines are created. Widget is a graphical element, through which the user will control subdevice. Usually one subdevice contains one widget, but the number of conditions, actions and events varies (from zero to many). The number of subdevices in the module can be either fixed or not. For example, you can develop a module only for a 6-channel dimmer, and you can make a module that will request the hardware for the number of subdevices and create the required number of subdevices.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ModuleStruct.png]]</div></div>
</div>
==Creating the module interface ==
The interface part of the midule consists of:
* widgets - interface part of the subdevice, which is located in the rooms and has basic control functions
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:WidgetExample.png]]</div></div>
</div>
* Remote - interface part of the module, which has a set of device functions and opens to the full screen, when you click on the widget button
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:RemoteExample.png]]</div></div>
</div>
* Authorization window - Authorization is required to work with some devices. To do this, the developer can create a special authorization window that is available in the module settings
картинка кнопки авторизации и окна авторизации
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:AutorisationExample.png]]</div></div>
</div>
* The module settings window is a window where you need to enter the parameters for the module operation
картинка окна настроек модуля и кнопки открытия
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:SettingsExample.png]]</div></div>
</div>
The whole graphic part is drawn in the graphical interface of the iRidium studio editor. In contradistinction to i3 pro, the module's interface should be made up of ready-made graphic components located in the gallery.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ItemGallery.png]]</div></div>
</div>

==== Widget ====

Widget is a visual component of the module, a kind of Popup that will be displayed in the room. The main task of the widget is to display the basic controls of the subdevice and to provide a module transition to the Remote control of the subdevice. For example, to control a media player, you can place a volume slider or Mute button for quick access to adjusting the volume. The weather widget can display the current weather, and the control panel will contain the weather forecast for all 5 days.<br />
The module does not make sense without widget, because it will not have a graphical representation in the i3 lite project.

Widget has a limited size
# Width '''640'''
# Height can not exceed '''1200'''

[[Файл:Пример виджета.png|center|thumb|Рис. Widget example]]

To create a widget, click the Add pop-up button in the Project overview panel and in the appeared menu select popup type: "Widget", set the name and properties:
[[Файл:ПанельПопап.png|thumb|center]]

Properties of a created widget can be changed with the help of '''Object Properties'''.<br />
Graphic items are assigned to channels like in popups:
[[Файл:Связывание_канала_команды_и_графического_элемента.png|center|thumb|Рис. Связывание канала команды и графического элемента]]
Widget will be displayed:
* In the room when a client uses the project
[[Файл:В_комнате_при_использовании_пользователем_проекта.png|center|thumb|]]
* In the module settings when it is added to the project:
[[Файл:И_в_настройках_модуля_при_добавлении_его_в_проект.png ‎|center|thumb|]]
====Remote and other graphic windows====

Remote (a remote control) is a graphical area to control SubDevices. Unlike wigets, it can have free size and position. And it is displayed on call. Remote is displayed when a button to go to the remote control is pressed on a widget.
Items to control equipment are placed on Remote (buttons, lists, switches, levels). There can be from 0 to several remote controls. Example of Remote:<br />
[[Файл:Пульт_управления.png ‎|center|thumb|]]<br />

Remote is created like a Widget. The only difference is to select "Remote" when you click "Add Popup Page" in the "Device Type" property.
==Interface design standard==
For the convenience of interface design, a standard was developed in which graphic windows should be developed in the module so that the modules of different developers looked uniformly within the framework of one project.
===Basic principles===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:GeneralUI.png]]</div></div>
<div class="col-sm-12 col-md-6">
Виджет состоит из «Header» и дополнительных модулей основного функционала. <br/>
«Header» — верхний модуль виджета.<br/>
«Header» содержит:<br/>
- наименование виджета;
- наименование устройства, которым<br/>
управляет виджет;<br/>
- иконка категории устройства.<br/>
<br/>
Дополнительные модули содержат элементы управления устройством.
</div>
</div>
===Модульная сетка и блоки===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka1.png]]</div></div>
<div class="col-sm-12 col-md-6">
Модульная сетка виджета представляет собой блоки 640 pt в ширину
и 120 pt в высоту. Каждый блок имеет сетку 8х8 pt.
Скругления углов равно 12,5 ut. (Circle 25)
</div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka2.png]]</div></div>
<div class="col-sm-12 col-md-6">
Принцип построения блока виджета представляет собой конструктор из
элементов управления (кнопок, свитчей, лэйблов) от меньшего к большему.
</div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka3.png]]</div></div>
<div class="col-sm-12 col-md-6">
Элементы управления комбинируются и объединяются в блок,
а блоки объединяются в панель управления.
</div>
</div>
===Кнопки===
<big>'''Toggle'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Toggle.png]]</div></div>
<div class="col-sm-12 col-md-6">
Кнопка изменения значения «вкл/выкл». Применяется как в случаях с неизвестным состоянием работы устройства, так и для управления функционалом устройства.
</div>
</div>
<big>'''Switch'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Switch.png]]</div></div>
<div class="col-sm-12 col-md-6">
Кнопка изменения значения «вкл/выкл». Применяется только в случаях с известным состоянием работы устройства.
</div>
</div>
<big>'''Multistate'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Multistate.png]]</div></div>
<div class="col-sm-12 col-md-6">
Кнопка изменения значения предустановленного состояния устройства применяется только в случаях с известным cостоянием работы устройства.
</div>
</div>
===Кнопка-стрелка===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:arrow1.png]]</div></div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:arrow2.png]]</div></div>
</div>
'''Действие кнопки'''<br/>
При нажатии на кнопку происходит вызов «PopUp».<br/>
'''Содержимое «PopUp»'''<br/>
«Input field», «Single selection», «Multiple selection».
===Слайдеры===
<div class="row">
<div class="col-sm-12 col-md-6">
Standart
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:StandartSlider.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
Value
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ValueSlider.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
Progress
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ProgressSlider.png]]</div></div>
</div>
===Описание===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Description.png]]</div></div>
===Иконки===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Icons1.png]]</div></div>
Все иконки делятся по сферам применения, и их главное различие — размеры
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Icons2.png]]</div></div>
===Виджет «header»===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:WidgetHeader.png]]</div></div>
===Расположение кнопок===
<div class="row">
<div class="col-sm-12 col-md-6">
Форм фактор: 128х120 pt
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:FormFactor.png]]</div></div>
</div>
Все кнопки имеют два состояния — покой и активность.
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:OFFicon.png]]</div></div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ONicon.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
В состоянии покоя цвет кнопки всегда # 848484 или RGB 132
</div>
<div class="col-sm-12 col-md-6">
Активным состояние кнопки считается только тогда, когда действие получило обратную связь является кратковременным или мгновенным (например: «Play» в медиаплеере) или действие, которое находится в состоянии активности продолжительное время и требует дополнительного воздействия для отключения состояния активности
(например: «Repeat» в медиаплеере).
</div>
</div>
==Основы работы со скриптами==

После проектирования интерфейса и добавления драйвера, вам понадобится разработать логику работы модуля в скриптах. Скриптовая часть при разработке i3 lite модуля имеет некоторые особенности. Перед разработкой скриптовой части lite модуля рекомендуем ознакомиться с [http://dev.iridiummobile.net/JS_Guide iRidium Pro API] и [[Special:MyLanguage/Developers_API | i3 lite API]]. <br />

Модуль может содержать неограниченное количество скриптов.
Существуют разные типы скриптов для модуля:
* Driver - в скриптовых файлах данного типа должны содержаться скрипты, отвечающие за работу с драйвером
* GUI - В этих скриптовых файлах содержатся скрипты, отвечающие за работу с графикой
* Common - в данных скриптовых файлах должны содержаться скрипты общего характера, тут может быть набор дополнительных функций или описание классов второстепенного назначения
* Setup - это специальный скриптовой файл, в нем содержиться информация о настройке модуля. а именно - список полей, обязательных для заполнения, типы этих полей и функции проверки правильности введенных данных.

Разделение на типы необходимо для правильной обработки модуля на сервере. На сервере работает только логика и драверная часть модулей, но сервер ничего не знает о графической части. Поэтому разработчику модуля требуется разбивать скрипты по типам. Сервер игнорирует файлы для работы с графической частью. <br />

При разработке модуля следует использовать простраство имен module вместо IR. Таким образом слушатель будет иметь вид module.AddListener(… <br />

Каждый скриптовой файл должен начинаться со слушателя
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_MODULE_START, 0, function(){});
</syntaxhighlight>
Это новый вид события, предназначенный специально для разработки модуля. При разработке модуля следует учитывать что скриптовой файл стал закрыт для других скриптовых файлов. Это хзначить что теперь можно использовать одноименные переменные и названия функций в разных скриптовых файлах и они не будут перезаписываться, но это накладывает ограничение: нельзя получить доступ к функции из другого скриптового файла простым способом. Для получения доступа к функции из другого скриптового файла, следует импортировать скриптовый файл с помощью команды module.Import("FileName.js"). <br />
Пример:<br/>
<syntaxhighlight lang="javascript">
//Name_1.js - первый js файл
this.Text = "Hello, world!"; //Указатель на текстовую переменную
//Name_2.js - второй js файл
var Text = module.Import("Name_1.js").Text; //Импортируем из первого js файла объект с указателем на текстовую переменную
IR.Log(Text); //"Hello, world!" //выводим в лог переменную Text
</syntaxhighlight>
==Создание подустройств==
Основой любого модуля служат подустройства и задачей разработчика модуля является определить сколько подустройств будет в модуле и разработать логику работы подустройств. В состав каждого подустройства может входить виджет, пульт управления, собственный набор действий, событий и состояний. Все составляющие подустройства необходимо указать при его создании. Содержимое подустройства не может меняться в ходе работы модуля. Для создания подустройства используется команда:<br/>
<syntaxhighlight lang="javascript">
module.AddSubDevice(SystemName, [Device], [System], [Type], [Tags], [Name], [Callback]);
</syntaxhighlight>
,где<br/>
'''SystemName''' - системное имя подустройства<br/>
'''Device''' - драйвер, к которому будет привязано подустройство<br/>
'''System''' - устаревший параметр, следует использовать false<br/>
'''Type''' - тип smart устройства. Параметр в разработке<br/>
'''Tags''' - Массив объектов виртуальных тегов<br/>
'''Name''' - имя подустройства, которое отображается пользователю<br/>
'''Callback function(){do somethings}''' - функция, которая выполняется до наступления события IR.EVENT_ADD_SUBDEVICE<br/>
В ответ функция вернет ссылку на подустройство, по которой к нему можно обратиться.<br/>
Пример создания подустройств для HDL Relay устройств. Скрипт проверяет количество устройств в шине и в цикле создает подустройства<br/>
<syntaxhighlight lang="javascript">
for (var count = 1; count <= COUNT_CHANNEL; count++) {
// Создаем подустройство
l_oSubDevice = module.AddSubDevice("Relay " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_RELAY);
// Создаем команду StatusOnStart
if (count == 1)
l_oSubDevice.AddChannel("Relay:statusOnStart", [ChannelData]);
var l_sChannelName = "Relay:channel" + count;
// Добавляем каналы
l_oSubDevice.AddChannel(l_sChannelName, [ChannelData]);
l_oSubDevice.AddTag(l_sChannelName, [ChannelData]);
// Добавляем виртуальный тег
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_TAG_POWER, true);
};</syntaxhighlight><br/>
Таким способом можно добавить в подустройство все необходимые сущности. Также, при создании подустройства, активируется событие<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function, [pointer]);
</syntaxhighlight><br/>
В функцию передается ссылка на только что созданное подустройство. В данном событии можно добавлять к подустройству различные компоненты(действия, события, состояния, виджеты, каналы, теги). Например:<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function(in_oSubDevice){
Создаем действия
in_oSubDevice.AddAction("On", false, in_oSubDevice.SystemName + "_Power", lightID + "_1", IR.SUB_DEVICE_COMMAND_POWER_ON);
in_oSubDevice.AddAction("Off", false, in_oSubDevice.SystemName + "_Power", lightID + "_0", IR.SUB_DEVICE_COMMAND_POWER_OFF);
Создаем события
in_oSubDevice.AddEvent("On", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "1");
in_oSubDevice.AddEvent("Off", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "0");
Создаем состояния
in_oSubDevice.AddCondition("On", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "1");
in_oSubDevice.AddCondition("Off", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "0");
});</syntaxhighlight><br/>
Таким образом разработчик может создавать нужное количество подустройств при установке модуля или ручном добавлении новых подустройств
==Добавление виджетов к подустройству==

Полсе создания интерфейсов в редакторе и добавления функции добавления подустройств, вам потребуется создавать для каждого поустройства свой экземпляр виджета и привязывать его к подустройству. Для привязки виджета к подустройству используется метод<br/>
<syntaxhighlight lang="javascript">SubDevice.addWidget(in_Widget)</syntaxhighlight><br/>

Входным параметром метода является: '''in_Widget''' - объект - виджет, заранее созданный в редакторе.<br/>
Выходным параметром метода является: успешно или нет ('''True''', '''False''').<br/>
К примеру у нас 3 лампочки и для того, чтобы не создавать для каждой лампочки отдельный виджет, мы воспользуемся уже готовым примером нашего окна и просто будем клонировать его. Напишем пример создания виджета с помощью кода по уже существующему образцу.<br/>

Метод Clone позволяет клонировать уже существующее всплывающее окно.<br/>
<syntaxhighlight lang="javascript">Module.ClonePopup (in_Popup, in_Name)</syntaxhighlight><br/>
Входные параметры метода:
*'''in_Name''' - имя нового виджета.<br/>
*'''in_Popup''' - ссылка на всплывающее окно.<br/>
Выходным параметром метода является: успешно или нет ('''True''', '''False''').<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function(in_oSubDevice){
var popup = module.GetPopup("Dimmer"); // Обращаемся к виджету который собираемся скопировать
// Создаем виджет методом клонирования
var widget = in_oSubDevice.addWidget(module.ClonePopup(popup, "Dimmer"+ in_oSubDevice.Name));
});</syntaxhighlight><br/>
----
{{i}} Имена новых виджетов не должны повторяться.
----
При открытии полноценного пульта управления из виджета, необходимо помнить о том что пользователь будет запускать модуль как на планшета, так и на телефоне. Из-за разницы в величине экранов, разработчик модуля должен разработать 2 вида окон. Вид под телефонную версию модуля и вид под планшетную версию. При этом надо добавить в скрипт метод, который будет спрашивать у системы вид устройства, на котором запущен модуль, и открывать соответствующее окно
<syntaxhighlight lang="javascript">
if (IR.DisplayType == IR.DISPLAY_TYPE_PHONE) { //Если модуль открыт на телефоне
var l_oPopupScanner = module.GetPopup("Phone"); //Показываем попап, отрисованный для телефона
}
else {
var l_oPopupScanner = module.GetPopup("Tablet");//Если планшет, то открываем попап для планшета
}
</syntaxhighlight><br/>
==Работа с каналами и тегами==
После создания подустройства и добавления виджета, вам понадобится добавить к подустройству нужные для работы каналы и теги. Как и в версии i3 Pro, драйвер можно добавить в графическом интерфейсе редактора или в скрипте. Для каждого подустройства потребуется собственный набор каналов и тегов для выбранного драйвера. В ходе работы может потребоваться работать с тремя компонентами:<br/>
*Канал. Для создания канала следует использовать метод<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddChannel(Name, DataArray)
</syntaxhighlight>где,<br/>
'''Name''' - имя канала<br/>
'''DataArray''' - массив данных, специфичный для каждого драйвера<br/>
*Тег. Для создания тега следует использовать метод<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddTag(Name, DataArray)
</syntaxhighlight>где,<br/>
'''Name''' - имя тега<br/>
'''DataArray''' - массив данных, специфичный для каждого драйвера<br/>
*Виртуальный тег. Для создания виртуального следует использовать метод<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddVirtualTag(Name, Value, [Edit], [smartID], [Hidden])
</syntaxhighlight>где,<br/>
'''Name'''- имя виртуального тега подустройства<br/>
'''Value''' - Значение тега<br/>
'''Edit''' - Разрешение редактирования тега<br/>
'''smartID''' - Параметр в разработке! Необходимо устанавливать false<br/>
'''Hidden''' - Признак скрытости тега<br/>
===Пример создания каналов и тегов при создании подустройства:===
<syntaxhighlight lang="javascript">
l_oSubDevice = module.AddSubDevice("Light " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_DIMMER);

// Adding channel StatusOnStart
if (count == 1)
l_oSubDevice.AddChannel("Dimmer:statusOnStart", [ChannelData]);

// Assigned to the variable name of the channel
var l_sChannelName = "Dimmer:channel" + count;

// Adding channels
l_oSubDevice.AddChannel(l_sChannelName, [ChannelData]);
l_oSubDevice.AddTag(l_sChannelName, [TagData]);

// Adding smart virtual tag
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_COMMAND_POWER, true);
l_oSubDevice.AddVirtualTag("Power On", 0, false, IR.SUB_DEVICE_COMMAND_POWER_ON, true);
l_oSubDevice.AddVirtualTag("Power Off", 0, false, IR.SUB_DEVICE_COMMAND_POWER_OFF, true);
l_oSubDevice.AddVirtualTag("Level", 0, false, IR.SUB_DEVICE_COMMAND_LEVEL, true);
</syntaxhighlight>
==Установка модуля в приложение==
Модули хранятся в магазине модулей iRidium Store и могут устанавливаться в приложение двумя способами:<br/>
*С помощью сканера<br/>
*Вручную<br/>
===Разработка Setup===
Для любого варианта необходимо разрабатывать файл Setup. Это специальный скриптовой файл, в котором прописаны поля, необходимые для работы модуля. Такими полями могут выступать ip адрес устройства, порт, название города итд. Для разработки Setup необходимо создать новый скриптовый файл и задать его тип "Setup". Каждое поле является тегом и к нему можно получить доступ из скрипта и получить введенное значение
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:СетапБонго.png]]</div></div>
Файл Setup состоит из 2-ух частей. Первая часть это настройки драйверов. В этих настройках следует запрашивать ip адреса, порты и логины, для подключения драйвера у устройству. Вторая часть файла это общие настройки модуля, такие как количество выходов, ключи доступа.
Для установки поля в Setup необходимо настроить следующие поля в скрипте:
* Тип поля - надо указать какое поле надо показать пользователю(текстовое поле, массив значений итд. Подробнее описано в API)
* Имя поля - название поля, которое увидит пользователь при настройке модуля
* Значение по умолчанию - какое значение следует подставлять по умолчанию
* Функция проверки - функция валидации значения в поле. Здесь требуется написать функцию, которая будет проверять корректность введенных данных.
Например, скрипт "Setup" для модуля HDL выглядит следующим образом:
<syntaxhighlight lang="javascript">
{
// Data to connect drivers, created in Project Device Panel
Drivers:
[
{
Name: "HDL-BUS Pro Network (UDP)",
Properties:
[
{
Type: "textfield",
Name: "Host",
DefaultValue: "255.255.255.255",
Validation: function(in_sValue) {
var l_aValueHost = in_sValue.split(".");
if (l_aValueHost.length != 4) {
return "Please input correct Host";
} else
if (parseInt(l_aValueHost[0], 10)>=0
&& parseInt(l_aValueHost[0], 10)<=255
&& parseInt(l_aValueHost[1], 10)>=0
&& parseInt(l_aValueHost[1], 10)<=255
&& parseInt(l_aValueHost[2], 10)>=0
&& parseInt(l_aValueHost[2], 10)<=255
&& parseInt(l_aValueHost[3], 10)>=0
&& parseInt(l_aValueHost[3], 10)<=255
)
return 0
else
return "Please input correct Host";
}
},
{
Type: "textfield",
Name: "Port",
DefaultValue: "6000",
Validation: function(in_sValue) {
if(parseInt(in_sValue, 10)>=0)
return 0
else
return "Please input correct Port";
}
}
]
}
],

// General information for the module (driver and generated by script)
Module: [{
Name: "Channels Count",
Validation: function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input Count";
}
},
{
Type: "textfield",
Name : "SubnetID",
Validation : function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input SubnetID";
}
},
{
Type: "textfield",
Name : "DeviceID",
Validation : function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input DeviceID";
}
}

]
}
</syntaxhighlight>
Для получения данных из полей Setup следует использовать функцию
<syntaxhighlight lang="javascript">
module.GetProperty("Имя поля")
</syntaxhighlight>
<br />
Помимо стандартных параметров, можно запрашивать любые, необходимые для инициализации модуля, параметры. Параметры драйвера подставляются в драйвер автоматически. Остальные параметры следует запрашивать и использовать вручную<br />
Пример работы с параметрами Setup
<syntaxhighlight lang="javascript">
var COUNT_CHANNEL = parseInt(module.GetProperty("Channel count")); // Getting count channel
var SubNetID = parseInt(module.GetProperty("SubnetID")); // Getting subnet id
var DeviceID = parseInt(module.GetProperty("DeviceID")); // Getting device id
</syntaxhighlight>
===Установка модуля вручную===
===Установка модуля с помощью сканера===
===Ручное добавление подустройств===
===Авторизация===
===Смена настроек===
===Удаление модуля===

DevManual/en

2017-04-03T10:33:41Z

Ildar: Новая страница: «For the convenience of interface design, a standard was developed in which graphic windows should be developed in the module so that the modules of different deve…»

<languages/>
=Module development guide=
==Definitions==

'''Module''' - is a component that allows you to control one type of equipment by its unique ID. The module is located in the store of modules.

'''Control panel (mobile device)''' - is a device from which the project i3 lite is launched (tablet, smartphone).

'''Store of modules''' - is a cloud server for uploading ready-made modules. The module store is available from the i3 lite application or on our[http://www.iridiummobile.ru/store/ site]

'''iRidium Studio''' - is a editor that allows to create the module to control device for i3 lite application. You need to use a special editor build for [http://www.iridiummobile.net/redirects/?go=iRidium_SETUP_LITE module developers] to develop the module

'''i3 lite''' - is an application to create, set and use i3 lite projects.

'''i3 lite project''' – is an automation project made up of ready equipment control modules. i3 lite projects differ from i2 Control projects: i3 lite projects can be edited dynamically without prior editing in iRidium Studio. i3 lite project consists of several small parts that can be put together into a single whole in i3 lite app with the help of the built-in constructor. It can also be easily edited in the app. As a result, a big number of intermediate processes are no longer necessary, such as installing software on PC, uploading projects on contol panels. All is done in one place - a control panel.

'''SubDevice''' - This is a virtual representation of the working area of the physical device. If we take as an example a 6-channel dimmer it has 6 sub-devices, because each independent device requires a separate control interface and connects to one channel.

'''Room (in i3 lite)''' - The visual part of i3 lite containing hardware management widgets. The project in i3 lite consists of rooms located on the floors

'''Widget''' - is a visual module component located in the room. It has limitations in size and fixed position in the room interface. It contains the main module functionality. For additional functions Remote is used.

'''Remote''' - is a visual module component which is hidden by default. It opens only when clicking on the corresponding item of the widget. It does not have size limitations (not more than the panel display size) and can be located in any part of the room interface (it is usually located in the middle of the panel display). It contains additional functionality of the module.

'''Macros''' - is a sequence of commands of various modules, which is activated by pressing. Contains "Action" and "Condition". For example, the macros "turn off all the lights in the house" will send the shutdown command to all devices responsible for lighting.

'''Routine''' - is a sequence of commands of various modules, which is activated automatically when a certain event occurs. Contains "Event", "Action" and "Condition". For example, "turn on the light if the motion sensor is triggered"

'''Event''' - is a routine component that describes the control command and the value range. If the value is sent in the indicated range, the routine is executed. For example, the event "Motion appeared" is activated if the motion sensor is triggered.

'''Action''' - is a component of macros and routines. It describes the control command and value that must be sent to the command. For example, "turn on the light". There are 2 types of Action: Simple Action and Advanced Action.

'''Simple Action''' - Simple Action is used when the command and Action value are known in advance.

'''Advanced Action''' - Advanced Action is used when the command is known but the value is unknown. The value is set dynamically when Action is used in i3 lite (but not when creating in iRidium studio).

'''Condition''' - is a component of macros and scenes. It describes the control command and value range. When a value from the value range is sent Action is executed.

'''Scanner''' - is a software part, that analyzes any bus looking for connected devices. Found connected devices are displayed in a list. Modules for the found devices are downloaded from iRidium store and the devices become available to control in i3 lite.
==Module concept==
The module is an independent subroutine of the i3 lite application which is built in the project and has an independent interface, driver and logic. Modules are developed in the [http://www.iridiummobile.net/redirects/?go=iRidium_SETUP_LITE iRidium Studio] editor and located in the module store [http://www.iridiummobile.ru/store/ iRidium Store]. Integrator downloads the module from the module store for each individual project.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ModuleInScheme.png]]</div></div>
</div>

There are two types of modules:
*Control module - module for hardware control
*Scanner - module for searching hardware in the local network and loading modules for found devices
== How to start developing the module ==
----

{{i}} Before starting your work, it is recommended to read [http://dev.iridiummobile.net/How_to_begin iRidium documentation]. It describes the basics of working with iRidium. The i3 lite documentation describes how to develop modules for the i3 lite platform for users, who already know iRidium. If you want to write script use [[Special:MyLanguage/Developers_API | i3 lite API]].
----

The module life cycle consists of:
* Developing the graphic part in iRidium studio
* Developing the driver part (scripts, devices)
* Testing
* Publishing in iRidium store
* Using (module download via the i3 lite application from the cloud and adding to automation projects)
<br/>
==Module structure ==
Each module must consist of subdevices. The subdevice is a virtual representation of the working area of a physical device. Many devices support multiple workgroups with the same functionality. Each workgroup may be in a separate zone. To fully control the zone, you need to create a subdevice for each workgroup of the device. For example, a 6-channel HDL dimmer contains 6 dimmable channels, through which 6 working groups can be controlled. Therefore, it is advisable to select in the module 6 subdevices for the possibility of creating actions, events and conditions for each workgroup separately. The presence of subdevice in the i3 lite module is obligatory. The number of sub-devices can be from one to many. Usually the number of subdevice is equal to the number of channels of the controller, the number of its work areas or logical devices.

Subdevice consists of:
* Conditions
* Actions
* Events
* Widgets

Conditions, actions and events are logical elements of the subdevice, on their basis macros and routines are created. Widget is a graphical element, through which the user will control subdevice. Usually one subdevice contains one widget, but the number of conditions, actions and events varies (from zero to many). The number of subdevices in the module can be either fixed or not. For example, you can develop a module only for a 6-channel dimmer, and you can make a module that will request the hardware for the number of subdevices and create the required number of subdevices.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ModuleStruct.png]]</div></div>
</div>
==Creating the module interface ==
The interface part of the midule consists of:
* widgets - interface part of the subdevice, which is located in the rooms and has basic control functions
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:WidgetExample.png]]</div></div>
</div>
* Remote - interface part of the module, which has a set of device functions and opens to the full screen, when you click on the widget button
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:RemoteExample.png]]</div></div>
</div>
* Authorization window - Authorization is required to work with some devices. To do this, the developer can create a special authorization window that is available in the module settings
картинка кнопки авторизации и окна авторизации
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:AutorisationExample.png]]</div></div>
</div>
* The module settings window is a window where you need to enter the parameters for the module operation
картинка окна настроек модуля и кнопки открытия
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:SettingsExample.png]]</div></div>
</div>
The whole graphic part is drawn in the graphical interface of the iRidium studio editor. In contradistinction to i3 pro, the module's interface should be made up of ready-made graphic components located in the gallery.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ItemGallery.png]]</div></div>
</div>

==== Widget ====

Widget is a visual component of the module, a kind of Popup that will be displayed in the room. The main task of the widget is to display the basic controls of the subdevice and to provide a module transition to the Remote control of the subdevice. For example, to control a media player, you can place a volume slider or Mute button for quick access to adjusting the volume. The weather widget can display the current weather, and the control panel will contain the weather forecast for all 5 days.<br />
The module does not make sense without widget, because it will not have a graphical representation in the i3 lite project.

Widget has a limited size
# Width '''640'''
# Height can not exceed '''1200'''

[[Файл:Пример виджета.png|center|thumb|Рис. Widget example]]

To create a widget, click the Add pop-up button in the Project overview panel and in the appeared menu select popup type: "Widget", set the name and properties:
[[Файл:ПанельПопап.png|thumb|center]]

Properties of a created widget can be changed with the help of '''Object Properties'''.<br />
Graphic items are assigned to channels like in popups:
[[Файл:Связывание_канала_команды_и_графического_элемента.png|center|thumb|Рис. Связывание канала команды и графического элемента]]
Widget will be displayed:
* In the room when a client uses the project
[[Файл:В_комнате_при_использовании_пользователем_проекта.png|center|thumb|]]
* In the module settings when it is added to the project:
[[Файл:И_в_настройках_модуля_при_добавлении_его_в_проект.png ‎|center|thumb|]]
====Remote and other graphic windows====

Remote (a remote control) is a graphical area to control SubDevices. Unlike wigets, it can have free size and position. And it is displayed on call. Remote is displayed when a button to go to the remote control is pressed on a widget.
Items to control equipment are placed on Remote (buttons, lists, switches, levels). There can be from 0 to several remote controls. Example of Remote:<br />
[[Файл:Пульт_управления.png ‎|center|thumb|]]<br />

Remote is created like a Widget. The only difference is to select "Remote" when you click "Add Popup Page" in the "Device Type" property.
==Interface design standard==
For the convenience of interface design, a standard was developed in which graphic windows should be developed in the module so that the modules of different developers looked uniformly within the framework of one project.
===Основные принципы===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:GeneralUI.png]]</div></div>
<div class="col-sm-12 col-md-6">
Виджет состоит из «Header» и дополнительных модулей основного функционала. <br/>
«Header» — верхний модуль виджета.<br/>
«Header» содержит:<br/>
- наименование виджета;
- наименование устройства, которым<br/>
управляет виджет;<br/>
- иконка категории устройства.<br/>
<br/>
Дополнительные модули содержат элементы управления устройством.
</div>
</div>
===Модульная сетка и блоки===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka1.png]]</div></div>
<div class="col-sm-12 col-md-6">
Модульная сетка виджета представляет собой блоки 640 pt в ширину
и 120 pt в высоту. Каждый блок имеет сетку 8х8 pt.
Скругления углов равно 12,5 ut. (Circle 25)
</div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka2.png]]</div></div>
<div class="col-sm-12 col-md-6">
Принцип построения блока виджета представляет собой конструктор из
элементов управления (кнопок, свитчей, лэйблов) от меньшего к большему.
</div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka3.png]]</div></div>
<div class="col-sm-12 col-md-6">
Элементы управления комбинируются и объединяются в блок,
а блоки объединяются в панель управления.
</div>
</div>
===Кнопки===
<big>'''Toggle'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Toggle.png]]</div></div>
<div class="col-sm-12 col-md-6">
Кнопка изменения значения «вкл/выкл». Применяется как в случаях с неизвестным состоянием работы устройства, так и для управления функционалом устройства.
</div>
</div>
<big>'''Switch'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Switch.png]]</div></div>
<div class="col-sm-12 col-md-6">
Кнопка изменения значения «вкл/выкл». Применяется только в случаях с известным состоянием работы устройства.
</div>
</div>
<big>'''Multistate'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Multistate.png]]</div></div>
<div class="col-sm-12 col-md-6">
Кнопка изменения значения предустановленного состояния устройства применяется только в случаях с известным cостоянием работы устройства.
</div>
</div>
===Кнопка-стрелка===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:arrow1.png]]</div></div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:arrow2.png]]</div></div>
</div>
'''Действие кнопки'''<br/>
При нажатии на кнопку происходит вызов «PopUp».<br/>
'''Содержимое «PopUp»'''<br/>
«Input field», «Single selection», «Multiple selection».
===Слайдеры===
<div class="row">
<div class="col-sm-12 col-md-6">
Standart
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:StandartSlider.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
Value
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ValueSlider.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
Progress
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ProgressSlider.png]]</div></div>
</div>
===Описание===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Description.png]]</div></div>
===Иконки===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Icons1.png]]</div></div>
Все иконки делятся по сферам применения, и их главное различие — размеры
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Icons2.png]]</div></div>
===Виджет «header»===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:WidgetHeader.png]]</div></div>
===Расположение кнопок===
<div class="row">
<div class="col-sm-12 col-md-6">
Форм фактор: 128х120 pt
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:FormFactor.png]]</div></div>
</div>
Все кнопки имеют два состояния — покой и активность.
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:OFFicon.png]]</div></div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ONicon.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
В состоянии покоя цвет кнопки всегда # 848484 или RGB 132
</div>
<div class="col-sm-12 col-md-6">
Активным состояние кнопки считается только тогда, когда действие получило обратную связь является кратковременным или мгновенным (например: «Play» в медиаплеере) или действие, которое находится в состоянии активности продолжительное время и требует дополнительного воздействия для отключения состояния активности
(например: «Repeat» в медиаплеере).
</div>
</div>
==Основы работы со скриптами==

После проектирования интерфейса и добавления драйвера, вам понадобится разработать логику работы модуля в скриптах. Скриптовая часть при разработке i3 lite модуля имеет некоторые особенности. Перед разработкой скриптовой части lite модуля рекомендуем ознакомиться с [http://dev.iridiummobile.net/JS_Guide iRidium Pro API] и [[Special:MyLanguage/Developers_API | i3 lite API]]. <br />

Модуль может содержать неограниченное количество скриптов.
Существуют разные типы скриптов для модуля:
* Driver - в скриптовых файлах данного типа должны содержаться скрипты, отвечающие за работу с драйвером
* GUI - В этих скриптовых файлах содержатся скрипты, отвечающие за работу с графикой
* Common - в данных скриптовых файлах должны содержаться скрипты общего характера, тут может быть набор дополнительных функций или описание классов второстепенного назначения
* Setup - это специальный скриптовой файл, в нем содержиться информация о настройке модуля. а именно - список полей, обязательных для заполнения, типы этих полей и функции проверки правильности введенных данных.

Разделение на типы необходимо для правильной обработки модуля на сервере. На сервере работает только логика и драверная часть модулей, но сервер ничего не знает о графической части. Поэтому разработчику модуля требуется разбивать скрипты по типам. Сервер игнорирует файлы для работы с графической частью. <br />

При разработке модуля следует использовать простраство имен module вместо IR. Таким образом слушатель будет иметь вид module.AddListener(… <br />

Каждый скриптовой файл должен начинаться со слушателя
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_MODULE_START, 0, function(){});
</syntaxhighlight>
Это новый вид события, предназначенный специально для разработки модуля. При разработке модуля следует учитывать что скриптовой файл стал закрыт для других скриптовых файлов. Это хзначить что теперь можно использовать одноименные переменные и названия функций в разных скриптовых файлах и они не будут перезаписываться, но это накладывает ограничение: нельзя получить доступ к функции из другого скриптового файла простым способом. Для получения доступа к функции из другого скриптового файла, следует импортировать скриптовый файл с помощью команды module.Import("FileName.js"). <br />
Пример:<br/>
<syntaxhighlight lang="javascript">
//Name_1.js - первый js файл
this.Text = "Hello, world!"; //Указатель на текстовую переменную
//Name_2.js - второй js файл
var Text = module.Import("Name_1.js").Text; //Импортируем из первого js файла объект с указателем на текстовую переменную
IR.Log(Text); //"Hello, world!" //выводим в лог переменную Text
</syntaxhighlight>
==Создание подустройств==
Основой любого модуля служат подустройства и задачей разработчика модуля является определить сколько подустройств будет в модуле и разработать логику работы подустройств. В состав каждого подустройства может входить виджет, пульт управления, собственный набор действий, событий и состояний. Все составляющие подустройства необходимо указать при его создании. Содержимое подустройства не может меняться в ходе работы модуля. Для создания подустройства используется команда:<br/>
<syntaxhighlight lang="javascript">
module.AddSubDevice(SystemName, [Device], [System], [Type], [Tags], [Name], [Callback]);
</syntaxhighlight>
,где<br/>
'''SystemName''' - системное имя подустройства<br/>
'''Device''' - драйвер, к которому будет привязано подустройство<br/>
'''System''' - устаревший параметр, следует использовать false<br/>
'''Type''' - тип smart устройства. Параметр в разработке<br/>
'''Tags''' - Массив объектов виртуальных тегов<br/>
'''Name''' - имя подустройства, которое отображается пользователю<br/>
'''Callback function(){do somethings}''' - функция, которая выполняется до наступления события IR.EVENT_ADD_SUBDEVICE<br/>
В ответ функция вернет ссылку на подустройство, по которой к нему можно обратиться.<br/>
Пример создания подустройств для HDL Relay устройств. Скрипт проверяет количество устройств в шине и в цикле создает подустройства<br/>
<syntaxhighlight lang="javascript">
for (var count = 1; count <= COUNT_CHANNEL; count++) {
// Создаем подустройство
l_oSubDevice = module.AddSubDevice("Relay " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_RELAY);
// Создаем команду StatusOnStart
if (count == 1)
l_oSubDevice.AddChannel("Relay:statusOnStart", [ChannelData]);
var l_sChannelName = "Relay:channel" + count;
// Добавляем каналы
l_oSubDevice.AddChannel(l_sChannelName, [ChannelData]);
l_oSubDevice.AddTag(l_sChannelName, [ChannelData]);
// Добавляем виртуальный тег
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_TAG_POWER, true);
};</syntaxhighlight><br/>
Таким способом можно добавить в подустройство все необходимые сущности. Также, при создании подустройства, активируется событие<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function, [pointer]);
</syntaxhighlight><br/>
В функцию передается ссылка на только что созданное подустройство. В данном событии можно добавлять к подустройству различные компоненты(действия, события, состояния, виджеты, каналы, теги). Например:<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function(in_oSubDevice){
Создаем действия
in_oSubDevice.AddAction("On", false, in_oSubDevice.SystemName + "_Power", lightID + "_1", IR.SUB_DEVICE_COMMAND_POWER_ON);
in_oSubDevice.AddAction("Off", false, in_oSubDevice.SystemName + "_Power", lightID + "_0", IR.SUB_DEVICE_COMMAND_POWER_OFF);
Создаем события
in_oSubDevice.AddEvent("On", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "1");
in_oSubDevice.AddEvent("Off", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "0");
Создаем состояния
in_oSubDevice.AddCondition("On", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "1");
in_oSubDevice.AddCondition("Off", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "0");
});</syntaxhighlight><br/>
Таким образом разработчик может создавать нужное количество подустройств при установке модуля или ручном добавлении новых подустройств
==Добавление виджетов к подустройству==

Полсе создания интерфейсов в редакторе и добавления функции добавления подустройств, вам потребуется создавать для каждого поустройства свой экземпляр виджета и привязывать его к подустройству. Для привязки виджета к подустройству используется метод<br/>
<syntaxhighlight lang="javascript">SubDevice.addWidget(in_Widget)</syntaxhighlight><br/>

Входным параметром метода является: '''in_Widget''' - объект - виджет, заранее созданный в редакторе.<br/>
Выходным параметром метода является: успешно или нет ('''True''', '''False''').<br/>
К примеру у нас 3 лампочки и для того, чтобы не создавать для каждой лампочки отдельный виджет, мы воспользуемся уже готовым примером нашего окна и просто будем клонировать его. Напишем пример создания виджета с помощью кода по уже существующему образцу.<br/>

Метод Clone позволяет клонировать уже существующее всплывающее окно.<br/>
<syntaxhighlight lang="javascript">Module.ClonePopup (in_Popup, in_Name)</syntaxhighlight><br/>
Входные параметры метода:
*'''in_Name''' - имя нового виджета.<br/>
*'''in_Popup''' - ссылка на всплывающее окно.<br/>
Выходным параметром метода является: успешно или нет ('''True''', '''False''').<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function(in_oSubDevice){
var popup = module.GetPopup("Dimmer"); // Обращаемся к виджету который собираемся скопировать
// Создаем виджет методом клонирования
var widget = in_oSubDevice.addWidget(module.ClonePopup(popup, "Dimmer"+ in_oSubDevice.Name));
});</syntaxhighlight><br/>
----
{{i}} Имена новых виджетов не должны повторяться.
----
При открытии полноценного пульта управления из виджета, необходимо помнить о том что пользователь будет запускать модуль как на планшета, так и на телефоне. Из-за разницы в величине экранов, разработчик модуля должен разработать 2 вида окон. Вид под телефонную версию модуля и вид под планшетную версию. При этом надо добавить в скрипт метод, который будет спрашивать у системы вид устройства, на котором запущен модуль, и открывать соответствующее окно
<syntaxhighlight lang="javascript">
if (IR.DisplayType == IR.DISPLAY_TYPE_PHONE) { //Если модуль открыт на телефоне
var l_oPopupScanner = module.GetPopup("Phone"); //Показываем попап, отрисованный для телефона
}
else {
var l_oPopupScanner = module.GetPopup("Tablet");//Если планшет, то открываем попап для планшета
}
</syntaxhighlight><br/>
==Работа с каналами и тегами==
После создания подустройства и добавления виджета, вам понадобится добавить к подустройству нужные для работы каналы и теги. Как и в версии i3 Pro, драйвер можно добавить в графическом интерфейсе редактора или в скрипте. Для каждого подустройства потребуется собственный набор каналов и тегов для выбранного драйвера. В ходе работы может потребоваться работать с тремя компонентами:<br/>
*Канал. Для создания канала следует использовать метод<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddChannel(Name, DataArray)
</syntaxhighlight>где,<br/>
'''Name''' - имя канала<br/>
'''DataArray''' - массив данных, специфичный для каждого драйвера<br/>
*Тег. Для создания тега следует использовать метод<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddTag(Name, DataArray)
</syntaxhighlight>где,<br/>
'''Name''' - имя тега<br/>
'''DataArray''' - массив данных, специфичный для каждого драйвера<br/>
*Виртуальный тег. Для создания виртуального следует использовать метод<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddVirtualTag(Name, Value, [Edit], [smartID], [Hidden])
</syntaxhighlight>где,<br/>
'''Name'''- имя виртуального тега подустройства<br/>
'''Value''' - Значение тега<br/>
'''Edit''' - Разрешение редактирования тега<br/>
'''smartID''' - Параметр в разработке! Необходимо устанавливать false<br/>
'''Hidden''' - Признак скрытости тега<br/>
===Пример создания каналов и тегов при создании подустройства:===
<syntaxhighlight lang="javascript">
l_oSubDevice = module.AddSubDevice("Light " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_DIMMER);

// Adding channel StatusOnStart
if (count == 1)
l_oSubDevice.AddChannel("Dimmer:statusOnStart", [ChannelData]);

// Assigned to the variable name of the channel
var l_sChannelName = "Dimmer:channel" + count;

// Adding channels
l_oSubDevice.AddChannel(l_sChannelName, [ChannelData]);
l_oSubDevice.AddTag(l_sChannelName, [TagData]);

// Adding smart virtual tag
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_COMMAND_POWER, true);
l_oSubDevice.AddVirtualTag("Power On", 0, false, IR.SUB_DEVICE_COMMAND_POWER_ON, true);
l_oSubDevice.AddVirtualTag("Power Off", 0, false, IR.SUB_DEVICE_COMMAND_POWER_OFF, true);
l_oSubDevice.AddVirtualTag("Level", 0, false, IR.SUB_DEVICE_COMMAND_LEVEL, true);
</syntaxhighlight>
==Установка модуля в приложение==
Модули хранятся в магазине модулей iRidium Store и могут устанавливаться в приложение двумя способами:<br/>
*С помощью сканера<br/>
*Вручную<br/>
===Разработка Setup===
Для любого варианта необходимо разрабатывать файл Setup. Это специальный скриптовой файл, в котором прописаны поля, необходимые для работы модуля. Такими полями могут выступать ip адрес устройства, порт, название города итд. Для разработки Setup необходимо создать новый скриптовый файл и задать его тип "Setup". Каждое поле является тегом и к нему можно получить доступ из скрипта и получить введенное значение
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:СетапБонго.png]]</div></div>
Файл Setup состоит из 2-ух частей. Первая часть это настройки драйверов. В этих настройках следует запрашивать ip адреса, порты и логины, для подключения драйвера у устройству. Вторая часть файла это общие настройки модуля, такие как количество выходов, ключи доступа.
Для установки поля в Setup необходимо настроить следующие поля в скрипте:
* Тип поля - надо указать какое поле надо показать пользователю(текстовое поле, массив значений итд. Подробнее описано в API)
* Имя поля - название поля, которое увидит пользователь при настройке модуля
* Значение по умолчанию - какое значение следует подставлять по умолчанию
* Функция проверки - функция валидации значения в поле. Здесь требуется написать функцию, которая будет проверять корректность введенных данных.
Например, скрипт "Setup" для модуля HDL выглядит следующим образом:
<syntaxhighlight lang="javascript">
{
// Data to connect drivers, created in Project Device Panel
Drivers:
[
{
Name: "HDL-BUS Pro Network (UDP)",
Properties:
[
{
Type: "textfield",
Name: "Host",
DefaultValue: "255.255.255.255",
Validation: function(in_sValue) {
var l_aValueHost = in_sValue.split(".");
if (l_aValueHost.length != 4) {
return "Please input correct Host";
} else
if (parseInt(l_aValueHost[0], 10)>=0
&& parseInt(l_aValueHost[0], 10)<=255
&& parseInt(l_aValueHost[1], 10)>=0
&& parseInt(l_aValueHost[1], 10)<=255
&& parseInt(l_aValueHost[2], 10)>=0
&& parseInt(l_aValueHost[2], 10)<=255
&& parseInt(l_aValueHost[3], 10)>=0
&& parseInt(l_aValueHost[3], 10)<=255
)
return 0
else
return "Please input correct Host";
}
},
{
Type: "textfield",
Name: "Port",
DefaultValue: "6000",
Validation: function(in_sValue) {
if(parseInt(in_sValue, 10)>=0)
return 0
else
return "Please input correct Port";
}
}
]
}
],

// General information for the module (driver and generated by script)
Module: [{
Name: "Channels Count",
Validation: function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input Count";
}
},
{
Type: "textfield",
Name : "SubnetID",
Validation : function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input SubnetID";
}
},
{
Type: "textfield",
Name : "DeviceID",
Validation : function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input DeviceID";
}
}

]
}
</syntaxhighlight>
Для получения данных из полей Setup следует использовать функцию
<syntaxhighlight lang="javascript">
module.GetProperty("Имя поля")
</syntaxhighlight>
<br />
Помимо стандартных параметров, можно запрашивать любые, необходимые для инициализации модуля, параметры. Параметры драйвера подставляются в драйвер автоматически. Остальные параметры следует запрашивать и использовать вручную<br />
Пример работы с параметрами Setup
<syntaxhighlight lang="javascript">
var COUNT_CHANNEL = parseInt(module.GetProperty("Channel count")); // Getting count channel
var SubNetID = parseInt(module.GetProperty("SubnetID")); // Getting subnet id
var DeviceID = parseInt(module.GetProperty("DeviceID")); // Getting device id
</syntaxhighlight>
===Установка модуля вручную===
===Установка модуля с помощью сканера===
===Ручное добавление подустройств===
===Авторизация===
===Смена настроек===
===Удаление модуля===

Translations:DevManual/73/en

2017-04-03T10:33:40Z

For the convenience of interface design, a standard was developed in which graphic windows should be developed in the module so that the modules of different developers looked uniformly within the framework of one project.

Translations:DevManual/72/en

2017-04-03T10:26:38Z

Ildar: Новая страница: «Interface design standard»

Interface design standard

DevManual/en

2017-04-03T10:26:38Z

Ildar: Новая страница: «Interface design standard»

<languages/>
=Module development guide=
==Definitions==

'''Module''' - is a component that allows you to control one type of equipment by its unique ID. The module is located in the store of modules.

'''Control panel (mobile device)''' - is a device from which the project i3 lite is launched (tablet, smartphone).

'''Store of modules''' - is a cloud server for uploading ready-made modules. The module store is available from the i3 lite application or on our[http://www.iridiummobile.ru/store/ site]

'''iRidium Studio''' - is a editor that allows to create the module to control device for i3 lite application. You need to use a special editor build for [http://www.iridiummobile.net/redirects/?go=iRidium_SETUP_LITE module developers] to develop the module

'''i3 lite''' - is an application to create, set and use i3 lite projects.

'''i3 lite project''' – is an automation project made up of ready equipment control modules. i3 lite projects differ from i2 Control projects: i3 lite projects can be edited dynamically without prior editing in iRidium Studio. i3 lite project consists of several small parts that can be put together into a single whole in i3 lite app with the help of the built-in constructor. It can also be easily edited in the app. As a result, a big number of intermediate processes are no longer necessary, such as installing software on PC, uploading projects on contol panels. All is done in one place - a control panel.

'''SubDevice''' - This is a virtual representation of the working area of the physical device. If we take as an example a 6-channel dimmer it has 6 sub-devices, because each independent device requires a separate control interface and connects to one channel.

'''Room (in i3 lite)''' - The visual part of i3 lite containing hardware management widgets. The project in i3 lite consists of rooms located on the floors

'''Widget''' - is a visual module component located in the room. It has limitations in size and fixed position in the room interface. It contains the main module functionality. For additional functions Remote is used.

'''Remote''' - is a visual module component which is hidden by default. It opens only when clicking on the corresponding item of the widget. It does not have size limitations (not more than the panel display size) and can be located in any part of the room interface (it is usually located in the middle of the panel display). It contains additional functionality of the module.

'''Macros''' - is a sequence of commands of various modules, which is activated by pressing. Contains "Action" and "Condition". For example, the macros "turn off all the lights in the house" will send the shutdown command to all devices responsible for lighting.

'''Routine''' - is a sequence of commands of various modules, which is activated automatically when a certain event occurs. Contains "Event", "Action" and "Condition". For example, "turn on the light if the motion sensor is triggered"

'''Event''' - is a routine component that describes the control command and the value range. If the value is sent in the indicated range, the routine is executed. For example, the event "Motion appeared" is activated if the motion sensor is triggered.

'''Action''' - is a component of macros and routines. It describes the control command and value that must be sent to the command. For example, "turn on the light". There are 2 types of Action: Simple Action and Advanced Action.

'''Simple Action''' - Simple Action is used when the command and Action value are known in advance.

'''Advanced Action''' - Advanced Action is used when the command is known but the value is unknown. The value is set dynamically when Action is used in i3 lite (but not when creating in iRidium studio).

'''Condition''' - is a component of macros and scenes. It describes the control command and value range. When a value from the value range is sent Action is executed.

'''Scanner''' - is a software part, that analyzes any bus looking for connected devices. Found connected devices are displayed in a list. Modules for the found devices are downloaded from iRidium store and the devices become available to control in i3 lite.
==Module concept==
The module is an independent subroutine of the i3 lite application which is built in the project and has an independent interface, driver and logic. Modules are developed in the [http://www.iridiummobile.net/redirects/?go=iRidium_SETUP_LITE iRidium Studio] editor and located in the module store [http://www.iridiummobile.ru/store/ iRidium Store]. Integrator downloads the module from the module store for each individual project.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ModuleInScheme.png]]</div></div>
</div>

There are two types of modules:
*Control module - module for hardware control
*Scanner - module for searching hardware in the local network and loading modules for found devices
== How to start developing the module ==
----

{{i}} Before starting your work, it is recommended to read [http://dev.iridiummobile.net/How_to_begin iRidium documentation]. It describes the basics of working with iRidium. The i3 lite documentation describes how to develop modules for the i3 lite platform for users, who already know iRidium. If you want to write script use [[Special:MyLanguage/Developers_API | i3 lite API]].
----

The module life cycle consists of:
* Developing the graphic part in iRidium studio
* Developing the driver part (scripts, devices)
* Testing
* Publishing in iRidium store
* Using (module download via the i3 lite application from the cloud and adding to automation projects)
<br/>
==Module structure ==
Each module must consist of subdevices. The subdevice is a virtual representation of the working area of a physical device. Many devices support multiple workgroups with the same functionality. Each workgroup may be in a separate zone. To fully control the zone, you need to create a subdevice for each workgroup of the device. For example, a 6-channel HDL dimmer contains 6 dimmable channels, through which 6 working groups can be controlled. Therefore, it is advisable to select in the module 6 subdevices for the possibility of creating actions, events and conditions for each workgroup separately. The presence of subdevice in the i3 lite module is obligatory. The number of sub-devices can be from one to many. Usually the number of subdevice is equal to the number of channels of the controller, the number of its work areas or logical devices.

Subdevice consists of:
* Conditions
* Actions
* Events
* Widgets

Conditions, actions and events are logical elements of the subdevice, on their basis macros and routines are created. Widget is a graphical element, through which the user will control subdevice. Usually one subdevice contains one widget, but the number of conditions, actions and events varies (from zero to many). The number of subdevices in the module can be either fixed or not. For example, you can develop a module only for a 6-channel dimmer, and you can make a module that will request the hardware for the number of subdevices and create the required number of subdevices.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ModuleStruct.png]]</div></div>
</div>
==Creating the module interface ==
The interface part of the midule consists of:
* widgets - interface part of the subdevice, which is located in the rooms and has basic control functions
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:WidgetExample.png]]</div></div>
</div>
* Remote - interface part of the module, which has a set of device functions and opens to the full screen, when you click on the widget button
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:RemoteExample.png]]</div></div>
</div>
* Authorization window - Authorization is required to work with some devices. To do this, the developer can create a special authorization window that is available in the module settings
картинка кнопки авторизации и окна авторизации
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:AutorisationExample.png]]</div></div>
</div>
* The module settings window is a window where you need to enter the parameters for the module operation
картинка окна настроек модуля и кнопки открытия
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:SettingsExample.png]]</div></div>
</div>
The whole graphic part is drawn in the graphical interface of the iRidium studio editor. In contradistinction to i3 pro, the module's interface should be made up of ready-made graphic components located in the gallery.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ItemGallery.png]]</div></div>
</div>

==== Widget ====

Widget is a visual component of the module, a kind of Popup that will be displayed in the room. The main task of the widget is to display the basic controls of the subdevice and to provide a module transition to the Remote control of the subdevice. For example, to control a media player, you can place a volume slider or Mute button for quick access to adjusting the volume. The weather widget can display the current weather, and the control panel will contain the weather forecast for all 5 days.<br />
The module does not make sense without widget, because it will not have a graphical representation in the i3 lite project.

Widget has a limited size
# Width '''640'''
# Height can not exceed '''1200'''

[[Файл:Пример виджета.png|center|thumb|Рис. Widget example]]

To create a widget, click the Add pop-up button in the Project overview panel and in the appeared menu select popup type: "Widget", set the name and properties:
[[Файл:ПанельПопап.png|thumb|center]]

Properties of a created widget can be changed with the help of '''Object Properties'''.<br />
Graphic items are assigned to channels like in popups:
[[Файл:Связывание_канала_команды_и_графического_элемента.png|center|thumb|Рис. Связывание канала команды и графического элемента]]
Widget will be displayed:
* In the room when a client uses the project
[[Файл:В_комнате_при_использовании_пользователем_проекта.png|center|thumb|]]
* In the module settings when it is added to the project:
[[Файл:И_в_настройках_модуля_при_добавлении_его_в_проект.png ‎|center|thumb|]]
====Remote and other graphic windows====

Remote (a remote control) is a graphical area to control SubDevices. Unlike wigets, it can have free size and position. And it is displayed on call. Remote is displayed when a button to go to the remote control is pressed on a widget.
Items to control equipment are placed on Remote (buttons, lists, switches, levels). There can be from 0 to several remote controls. Example of Remote:<br />
[[Файл:Пульт_управления.png ‎|center|thumb|]]<br />

Remote is created like a Widget. The only difference is to select "Remote" when you click "Add Popup Page" in the "Device Type" property.
==Interface design standard==
Для удобства проектирования интерфейса был разработан стандарт, в котором следует разрабатывать графические окна в модуле, чтобы модули разных разработчиков выглядели единообразно в рамках одного проекта.
===Основные принципы===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:GeneralUI.png]]</div></div>
<div class="col-sm-12 col-md-6">
Виджет состоит из «Header» и дополнительных модулей основного функционала. <br/>
«Header» — верхний модуль виджета.<br/>
«Header» содержит:<br/>
- наименование виджета;
- наименование устройства, которым<br/>
управляет виджет;<br/>
- иконка категории устройства.<br/>
<br/>
Дополнительные модули содержат элементы управления устройством.
</div>
</div>
===Модульная сетка и блоки===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka1.png]]</div></div>
<div class="col-sm-12 col-md-6">
Модульная сетка виджета представляет собой блоки 640 pt в ширину
и 120 pt в высоту. Каждый блок имеет сетку 8х8 pt.
Скругления углов равно 12,5 ut. (Circle 25)
</div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka2.png]]</div></div>
<div class="col-sm-12 col-md-6">
Принцип построения блока виджета представляет собой конструктор из
элементов управления (кнопок, свитчей, лэйблов) от меньшего к большему.
</div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka3.png]]</div></div>
<div class="col-sm-12 col-md-6">
Элементы управления комбинируются и объединяются в блок,
а блоки объединяются в панель управления.
</div>
</div>
===Кнопки===
<big>'''Toggle'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Toggle.png]]</div></div>
<div class="col-sm-12 col-md-6">
Кнопка изменения значения «вкл/выкл». Применяется как в случаях с неизвестным состоянием работы устройства, так и для управления функционалом устройства.
</div>
</div>
<big>'''Switch'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Switch.png]]</div></div>
<div class="col-sm-12 col-md-6">
Кнопка изменения значения «вкл/выкл». Применяется только в случаях с известным состоянием работы устройства.
</div>
</div>
<big>'''Multistate'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Multistate.png]]</div></div>
<div class="col-sm-12 col-md-6">
Кнопка изменения значения предустановленного состояния устройства применяется только в случаях с известным cостоянием работы устройства.
</div>
</div>
===Кнопка-стрелка===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:arrow1.png]]</div></div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:arrow2.png]]</div></div>
</div>
'''Действие кнопки'''<br/>
При нажатии на кнопку происходит вызов «PopUp».<br/>
'''Содержимое «PopUp»'''<br/>
«Input field», «Single selection», «Multiple selection».
===Слайдеры===
<div class="row">
<div class="col-sm-12 col-md-6">
Standart
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:StandartSlider.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
Value
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ValueSlider.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
Progress
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ProgressSlider.png]]</div></div>
</div>
===Описание===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Description.png]]</div></div>
===Иконки===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Icons1.png]]</div></div>
Все иконки делятся по сферам применения, и их главное различие — размеры
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Icons2.png]]</div></div>
===Виджет «header»===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:WidgetHeader.png]]</div></div>
===Расположение кнопок===
<div class="row">
<div class="col-sm-12 col-md-6">
Форм фактор: 128х120 pt
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:FormFactor.png]]</div></div>
</div>
Все кнопки имеют два состояния — покой и активность.
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:OFFicon.png]]</div></div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ONicon.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
В состоянии покоя цвет кнопки всегда # 848484 или RGB 132
</div>
<div class="col-sm-12 col-md-6">
Активным состояние кнопки считается только тогда, когда действие получило обратную связь является кратковременным или мгновенным (например: «Play» в медиаплеере) или действие, которое находится в состоянии активности продолжительное время и требует дополнительного воздействия для отключения состояния активности
(например: «Repeat» в медиаплеере).
</div>
</div>
==Основы работы со скриптами==

После проектирования интерфейса и добавления драйвера, вам понадобится разработать логику работы модуля в скриптах. Скриптовая часть при разработке i3 lite модуля имеет некоторые особенности. Перед разработкой скриптовой части lite модуля рекомендуем ознакомиться с [http://dev.iridiummobile.net/JS_Guide iRidium Pro API] и [[Special:MyLanguage/Developers_API | i3 lite API]]. <br />

Модуль может содержать неограниченное количество скриптов.
Существуют разные типы скриптов для модуля:
* Driver - в скриптовых файлах данного типа должны содержаться скрипты, отвечающие за работу с драйвером
* GUI - В этих скриптовых файлах содержатся скрипты, отвечающие за работу с графикой
* Common - в данных скриптовых файлах должны содержаться скрипты общего характера, тут может быть набор дополнительных функций или описание классов второстепенного назначения
* Setup - это специальный скриптовой файл, в нем содержиться информация о настройке модуля. а именно - список полей, обязательных для заполнения, типы этих полей и функции проверки правильности введенных данных.

Разделение на типы необходимо для правильной обработки модуля на сервере. На сервере работает только логика и драверная часть модулей, но сервер ничего не знает о графической части. Поэтому разработчику модуля требуется разбивать скрипты по типам. Сервер игнорирует файлы для работы с графической частью. <br />

При разработке модуля следует использовать простраство имен module вместо IR. Таким образом слушатель будет иметь вид module.AddListener(… <br />

Каждый скриптовой файл должен начинаться со слушателя
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_MODULE_START, 0, function(){});
</syntaxhighlight>
Это новый вид события, предназначенный специально для разработки модуля. При разработке модуля следует учитывать что скриптовой файл стал закрыт для других скриптовых файлов. Это хзначить что теперь можно использовать одноименные переменные и названия функций в разных скриптовых файлах и они не будут перезаписываться, но это накладывает ограничение: нельзя получить доступ к функции из другого скриптового файла простым способом. Для получения доступа к функции из другого скриптового файла, следует импортировать скриптовый файл с помощью команды module.Import("FileName.js"). <br />
Пример:<br/>
<syntaxhighlight lang="javascript">
//Name_1.js - первый js файл
this.Text = "Hello, world!"; //Указатель на текстовую переменную
//Name_2.js - второй js файл
var Text = module.Import("Name_1.js").Text; //Импортируем из первого js файла объект с указателем на текстовую переменную
IR.Log(Text); //"Hello, world!" //выводим в лог переменную Text
</syntaxhighlight>
==Создание подустройств==
Основой любого модуля служат подустройства и задачей разработчика модуля является определить сколько подустройств будет в модуле и разработать логику работы подустройств. В состав каждого подустройства может входить виджет, пульт управления, собственный набор действий, событий и состояний. Все составляющие подустройства необходимо указать при его создании. Содержимое подустройства не может меняться в ходе работы модуля. Для создания подустройства используется команда:<br/>
<syntaxhighlight lang="javascript">
module.AddSubDevice(SystemName, [Device], [System], [Type], [Tags], [Name], [Callback]);
</syntaxhighlight>
,где<br/>
'''SystemName''' - системное имя подустройства<br/>
'''Device''' - драйвер, к которому будет привязано подустройство<br/>
'''System''' - устаревший параметр, следует использовать false<br/>
'''Type''' - тип smart устройства. Параметр в разработке<br/>
'''Tags''' - Массив объектов виртуальных тегов<br/>
'''Name''' - имя подустройства, которое отображается пользователю<br/>
'''Callback function(){do somethings}''' - функция, которая выполняется до наступления события IR.EVENT_ADD_SUBDEVICE<br/>
В ответ функция вернет ссылку на подустройство, по которой к нему можно обратиться.<br/>
Пример создания подустройств для HDL Relay устройств. Скрипт проверяет количество устройств в шине и в цикле создает подустройства<br/>
<syntaxhighlight lang="javascript">
for (var count = 1; count <= COUNT_CHANNEL; count++) {
// Создаем подустройство
l_oSubDevice = module.AddSubDevice("Relay " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_RELAY);
// Создаем команду StatusOnStart
if (count == 1)
l_oSubDevice.AddChannel("Relay:statusOnStart", [ChannelData]);
var l_sChannelName = "Relay:channel" + count;
// Добавляем каналы
l_oSubDevice.AddChannel(l_sChannelName, [ChannelData]);
l_oSubDevice.AddTag(l_sChannelName, [ChannelData]);
// Добавляем виртуальный тег
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_TAG_POWER, true);
};</syntaxhighlight><br/>
Таким способом можно добавить в подустройство все необходимые сущности. Также, при создании подустройства, активируется событие<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function, [pointer]);
</syntaxhighlight><br/>
В функцию передается ссылка на только что созданное подустройство. В данном событии можно добавлять к подустройству различные компоненты(действия, события, состояния, виджеты, каналы, теги). Например:<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function(in_oSubDevice){
Создаем действия
in_oSubDevice.AddAction("On", false, in_oSubDevice.SystemName + "_Power", lightID + "_1", IR.SUB_DEVICE_COMMAND_POWER_ON);
in_oSubDevice.AddAction("Off", false, in_oSubDevice.SystemName + "_Power", lightID + "_0", IR.SUB_DEVICE_COMMAND_POWER_OFF);
Создаем события
in_oSubDevice.AddEvent("On", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "1");
in_oSubDevice.AddEvent("Off", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "0");
Создаем состояния
in_oSubDevice.AddCondition("On", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "1");
in_oSubDevice.AddCondition("Off", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "0");
});</syntaxhighlight><br/>
Таким образом разработчик может создавать нужное количество подустройств при установке модуля или ручном добавлении новых подустройств
==Добавление виджетов к подустройству==

Полсе создания интерфейсов в редакторе и добавления функции добавления подустройств, вам потребуется создавать для каждого поустройства свой экземпляр виджета и привязывать его к подустройству. Для привязки виджета к подустройству используется метод<br/>
<syntaxhighlight lang="javascript">SubDevice.addWidget(in_Widget)</syntaxhighlight><br/>

Входным параметром метода является: '''in_Widget''' - объект - виджет, заранее созданный в редакторе.<br/>
Выходным параметром метода является: успешно или нет ('''True''', '''False''').<br/>
К примеру у нас 3 лампочки и для того, чтобы не создавать для каждой лампочки отдельный виджет, мы воспользуемся уже готовым примером нашего окна и просто будем клонировать его. Напишем пример создания виджета с помощью кода по уже существующему образцу.<br/>

Метод Clone позволяет клонировать уже существующее всплывающее окно.<br/>
<syntaxhighlight lang="javascript">Module.ClonePopup (in_Popup, in_Name)</syntaxhighlight><br/>
Входные параметры метода:
*'''in_Name''' - имя нового виджета.<br/>
*'''in_Popup''' - ссылка на всплывающее окно.<br/>
Выходным параметром метода является: успешно или нет ('''True''', '''False''').<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function(in_oSubDevice){
var popup = module.GetPopup("Dimmer"); // Обращаемся к виджету который собираемся скопировать
// Создаем виджет методом клонирования
var widget = in_oSubDevice.addWidget(module.ClonePopup(popup, "Dimmer"+ in_oSubDevice.Name));
});</syntaxhighlight><br/>
----
{{i}} Имена новых виджетов не должны повторяться.
----
При открытии полноценного пульта управления из виджета, необходимо помнить о том что пользователь будет запускать модуль как на планшета, так и на телефоне. Из-за разницы в величине экранов, разработчик модуля должен разработать 2 вида окон. Вид под телефонную версию модуля и вид под планшетную версию. При этом надо добавить в скрипт метод, который будет спрашивать у системы вид устройства, на котором запущен модуль, и открывать соответствующее окно
<syntaxhighlight lang="javascript">
if (IR.DisplayType == IR.DISPLAY_TYPE_PHONE) { //Если модуль открыт на телефоне
var l_oPopupScanner = module.GetPopup("Phone"); //Показываем попап, отрисованный для телефона
}
else {
var l_oPopupScanner = module.GetPopup("Tablet");//Если планшет, то открываем попап для планшета
}
</syntaxhighlight><br/>
==Работа с каналами и тегами==
После создания подустройства и добавления виджета, вам понадобится добавить к подустройству нужные для работы каналы и теги. Как и в версии i3 Pro, драйвер можно добавить в графическом интерфейсе редактора или в скрипте. Для каждого подустройства потребуется собственный набор каналов и тегов для выбранного драйвера. В ходе работы может потребоваться работать с тремя компонентами:<br/>
*Канал. Для создания канала следует использовать метод<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddChannel(Name, DataArray)
</syntaxhighlight>где,<br/>
'''Name''' - имя канала<br/>
'''DataArray''' - массив данных, специфичный для каждого драйвера<br/>
*Тег. Для создания тега следует использовать метод<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddTag(Name, DataArray)
</syntaxhighlight>где,<br/>
'''Name''' - имя тега<br/>
'''DataArray''' - массив данных, специфичный для каждого драйвера<br/>
*Виртуальный тег. Для создания виртуального следует использовать метод<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddVirtualTag(Name, Value, [Edit], [smartID], [Hidden])
</syntaxhighlight>где,<br/>
'''Name'''- имя виртуального тега подустройства<br/>
'''Value''' - Значение тега<br/>
'''Edit''' - Разрешение редактирования тега<br/>
'''smartID''' - Параметр в разработке! Необходимо устанавливать false<br/>
'''Hidden''' - Признак скрытости тега<br/>
===Пример создания каналов и тегов при создании подустройства:===
<syntaxhighlight lang="javascript">
l_oSubDevice = module.AddSubDevice("Light " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_DIMMER);

// Adding channel StatusOnStart
if (count == 1)
l_oSubDevice.AddChannel("Dimmer:statusOnStart", [ChannelData]);

// Assigned to the variable name of the channel
var l_sChannelName = "Dimmer:channel" + count;

// Adding channels
l_oSubDevice.AddChannel(l_sChannelName, [ChannelData]);
l_oSubDevice.AddTag(l_sChannelName, [TagData]);

// Adding smart virtual tag
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_COMMAND_POWER, true);
l_oSubDevice.AddVirtualTag("Power On", 0, false, IR.SUB_DEVICE_COMMAND_POWER_ON, true);
l_oSubDevice.AddVirtualTag("Power Off", 0, false, IR.SUB_DEVICE_COMMAND_POWER_OFF, true);
l_oSubDevice.AddVirtualTag("Level", 0, false, IR.SUB_DEVICE_COMMAND_LEVEL, true);
</syntaxhighlight>
==Установка модуля в приложение==
Модули хранятся в магазине модулей iRidium Store и могут устанавливаться в приложение двумя способами:<br/>
*С помощью сканера<br/>
*Вручную<br/>
===Разработка Setup===
Для любого варианта необходимо разрабатывать файл Setup. Это специальный скриптовой файл, в котором прописаны поля, необходимые для работы модуля. Такими полями могут выступать ip адрес устройства, порт, название города итд. Для разработки Setup необходимо создать новый скриптовый файл и задать его тип "Setup". Каждое поле является тегом и к нему можно получить доступ из скрипта и получить введенное значение
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:СетапБонго.png]]</div></div>
Файл Setup состоит из 2-ух частей. Первая часть это настройки драйверов. В этих настройках следует запрашивать ip адреса, порты и логины, для подключения драйвера у устройству. Вторая часть файла это общие настройки модуля, такие как количество выходов, ключи доступа.
Для установки поля в Setup необходимо настроить следующие поля в скрипте:
* Тип поля - надо указать какое поле надо показать пользователю(текстовое поле, массив значений итд. Подробнее описано в API)
* Имя поля - название поля, которое увидит пользователь при настройке модуля
* Значение по умолчанию - какое значение следует подставлять по умолчанию
* Функция проверки - функция валидации значения в поле. Здесь требуется написать функцию, которая будет проверять корректность введенных данных.
Например, скрипт "Setup" для модуля HDL выглядит следующим образом:
<syntaxhighlight lang="javascript">
{
// Data to connect drivers, created in Project Device Panel
Drivers:
[
{
Name: "HDL-BUS Pro Network (UDP)",
Properties:
[
{
Type: "textfield",
Name: "Host",
DefaultValue: "255.255.255.255",
Validation: function(in_sValue) {
var l_aValueHost = in_sValue.split(".");
if (l_aValueHost.length != 4) {
return "Please input correct Host";
} else
if (parseInt(l_aValueHost[0], 10)>=0
&& parseInt(l_aValueHost[0], 10)<=255
&& parseInt(l_aValueHost[1], 10)>=0
&& parseInt(l_aValueHost[1], 10)<=255
&& parseInt(l_aValueHost[2], 10)>=0
&& parseInt(l_aValueHost[2], 10)<=255
&& parseInt(l_aValueHost[3], 10)>=0
&& parseInt(l_aValueHost[3], 10)<=255
)
return 0
else
return "Please input correct Host";
}
},
{
Type: "textfield",
Name: "Port",
DefaultValue: "6000",
Validation: function(in_sValue) {
if(parseInt(in_sValue, 10)>=0)
return 0
else
return "Please input correct Port";
}
}
]
}
],

// General information for the module (driver and generated by script)
Module: [{
Name: "Channels Count",
Validation: function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input Count";
}
},
{
Type: "textfield",
Name : "SubnetID",
Validation : function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input SubnetID";
}
},
{
Type: "textfield",
Name : "DeviceID",
Validation : function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input DeviceID";
}
}

]
}
</syntaxhighlight>
Для получения данных из полей Setup следует использовать функцию
<syntaxhighlight lang="javascript">
module.GetProperty("Имя поля")
</syntaxhighlight>
<br />
Помимо стандартных параметров, можно запрашивать любые, необходимые для инициализации модуля, параметры. Параметры драйвера подставляются в драйвер автоматически. Остальные параметры следует запрашивать и использовать вручную<br />
Пример работы с параметрами Setup
<syntaxhighlight lang="javascript">
var COUNT_CHANNEL = parseInt(module.GetProperty("Channel count")); // Getting count channel
var SubNetID = parseInt(module.GetProperty("SubnetID")); // Getting subnet id
var DeviceID = parseInt(module.GetProperty("DeviceID")); // Getting device id
</syntaxhighlight>
===Установка модуля вручную===
===Установка модуля с помощью сканера===
===Ручное добавление подустройств===
===Авторизация===
===Смена настроек===
===Удаление модуля===

DevManual/en

2017-04-03T10:25:12Z

Ildar: Новая страница: «Remote is created like a Widget. The only difference is to select "Remote" when you click "Add Popup Page" in the "Device Type" property.»

<languages/>
=Module development guide=
==Definitions==

'''Module''' - is a component that allows you to control one type of equipment by its unique ID. The module is located in the store of modules.

'''Control panel (mobile device)''' - is a device from which the project i3 lite is launched (tablet, smartphone).

'''Store of modules''' - is a cloud server for uploading ready-made modules. The module store is available from the i3 lite application or on our[http://www.iridiummobile.ru/store/ site]

'''iRidium Studio''' - is a editor that allows to create the module to control device for i3 lite application. You need to use a special editor build for [http://www.iridiummobile.net/redirects/?go=iRidium_SETUP_LITE module developers] to develop the module

'''i3 lite''' - is an application to create, set and use i3 lite projects.

'''i3 lite project''' – is an automation project made up of ready equipment control modules. i3 lite projects differ from i2 Control projects: i3 lite projects can be edited dynamically without prior editing in iRidium Studio. i3 lite project consists of several small parts that can be put together into a single whole in i3 lite app with the help of the built-in constructor. It can also be easily edited in the app. As a result, a big number of intermediate processes are no longer necessary, such as installing software on PC, uploading projects on contol panels. All is done in one place - a control panel.

'''SubDevice''' - This is a virtual representation of the working area of the physical device. If we take as an example a 6-channel dimmer it has 6 sub-devices, because each independent device requires a separate control interface and connects to one channel.

'''Room (in i3 lite)''' - The visual part of i3 lite containing hardware management widgets. The project in i3 lite consists of rooms located on the floors

'''Widget''' - is a visual module component located in the room. It has limitations in size and fixed position in the room interface. It contains the main module functionality. For additional functions Remote is used.

'''Remote''' - is a visual module component which is hidden by default. It opens only when clicking on the corresponding item of the widget. It does not have size limitations (not more than the panel display size) and can be located in any part of the room interface (it is usually located in the middle of the panel display). It contains additional functionality of the module.

'''Macros''' - is a sequence of commands of various modules, which is activated by pressing. Contains "Action" and "Condition". For example, the macros "turn off all the lights in the house" will send the shutdown command to all devices responsible for lighting.

'''Routine''' - is a sequence of commands of various modules, which is activated automatically when a certain event occurs. Contains "Event", "Action" and "Condition". For example, "turn on the light if the motion sensor is triggered"

'''Event''' - is a routine component that describes the control command and the value range. If the value is sent in the indicated range, the routine is executed. For example, the event "Motion appeared" is activated if the motion sensor is triggered.

'''Action''' - is a component of macros and routines. It describes the control command and value that must be sent to the command. For example, "turn on the light". There are 2 types of Action: Simple Action and Advanced Action.

'''Simple Action''' - Simple Action is used when the command and Action value are known in advance.

'''Advanced Action''' - Advanced Action is used when the command is known but the value is unknown. The value is set dynamically when Action is used in i3 lite (but not when creating in iRidium studio).

'''Condition''' - is a component of macros and scenes. It describes the control command and value range. When a value from the value range is sent Action is executed.

'''Scanner''' - is a software part, that analyzes any bus looking for connected devices. Found connected devices are displayed in a list. Modules for the found devices are downloaded from iRidium store and the devices become available to control in i3 lite.
==Module concept==
The module is an independent subroutine of the i3 lite application which is built in the project and has an independent interface, driver and logic. Modules are developed in the [http://www.iridiummobile.net/redirects/?go=iRidium_SETUP_LITE iRidium Studio] editor and located in the module store [http://www.iridiummobile.ru/store/ iRidium Store]. Integrator downloads the module from the module store for each individual project.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ModuleInScheme.png]]</div></div>
</div>

There are two types of modules:
*Control module - module for hardware control
*Scanner - module for searching hardware in the local network and loading modules for found devices
== How to start developing the module ==
----

{{i}} Before starting your work, it is recommended to read [http://dev.iridiummobile.net/How_to_begin iRidium documentation]. It describes the basics of working with iRidium. The i3 lite documentation describes how to develop modules for the i3 lite platform for users, who already know iRidium. If you want to write script use [[Special:MyLanguage/Developers_API | i3 lite API]].
----

The module life cycle consists of:
* Developing the graphic part in iRidium studio
* Developing the driver part (scripts, devices)
* Testing
* Publishing in iRidium store
* Using (module download via the i3 lite application from the cloud and adding to automation projects)
<br/>
==Module structure ==
Each module must consist of subdevices. The subdevice is a virtual representation of the working area of a physical device. Many devices support multiple workgroups with the same functionality. Each workgroup may be in a separate zone. To fully control the zone, you need to create a subdevice for each workgroup of the device. For example, a 6-channel HDL dimmer contains 6 dimmable channels, through which 6 working groups can be controlled. Therefore, it is advisable to select in the module 6 subdevices for the possibility of creating actions, events and conditions for each workgroup separately. The presence of subdevice in the i3 lite module is obligatory. The number of sub-devices can be from one to many. Usually the number of subdevice is equal to the number of channels of the controller, the number of its work areas or logical devices.

Subdevice consists of:
* Conditions
* Actions
* Events
* Widgets

Conditions, actions and events are logical elements of the subdevice, on their basis macros and routines are created. Widget is a graphical element, through which the user will control subdevice. Usually one subdevice contains one widget, but the number of conditions, actions and events varies (from zero to many). The number of subdevices in the module can be either fixed or not. For example, you can develop a module only for a 6-channel dimmer, and you can make a module that will request the hardware for the number of subdevices and create the required number of subdevices.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ModuleStruct.png]]</div></div>
</div>
==Creating the module interface ==
The interface part of the midule consists of:
* widgets - interface part of the subdevice, which is located in the rooms and has basic control functions
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:WidgetExample.png]]</div></div>
</div>
* Remote - interface part of the module, which has a set of device functions and opens to the full screen, when you click on the widget button
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:RemoteExample.png]]</div></div>
</div>
* Authorization window - Authorization is required to work with some devices. To do this, the developer can create a special authorization window that is available in the module settings
картинка кнопки авторизации и окна авторизации
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:AutorisationExample.png]]</div></div>
</div>
* The module settings window is a window where you need to enter the parameters for the module operation
картинка окна настроек модуля и кнопки открытия
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:SettingsExample.png]]</div></div>
</div>
The whole graphic part is drawn in the graphical interface of the iRidium studio editor. In contradistinction to i3 pro, the module's interface should be made up of ready-made graphic components located in the gallery.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ItemGallery.png]]</div></div>
</div>

==== Widget ====

Widget is a visual component of the module, a kind of Popup that will be displayed in the room. The main task of the widget is to display the basic controls of the subdevice and to provide a module transition to the Remote control of the subdevice. For example, to control a media player, you can place a volume slider or Mute button for quick access to adjusting the volume. The weather widget can display the current weather, and the control panel will contain the weather forecast for all 5 days.<br />
The module does not make sense without widget, because it will not have a graphical representation in the i3 lite project.

Widget has a limited size
# Width '''640'''
# Height can not exceed '''1200'''

[[Файл:Пример виджета.png|center|thumb|Рис. Widget example]]

To create a widget, click the Add pop-up button in the Project overview panel and in the appeared menu select popup type: "Widget", set the name and properties:
[[Файл:ПанельПопап.png|thumb|center]]

Properties of a created widget can be changed with the help of '''Object Properties'''.<br />
Graphic items are assigned to channels like in popups:
[[Файл:Связывание_канала_команды_и_графического_элемента.png|center|thumb|Рис. Связывание канала команды и графического элемента]]
Widget will be displayed:
* In the room when a client uses the project
[[Файл:В_комнате_при_использовании_пользователем_проекта.png|center|thumb|]]
* In the module settings when it is added to the project:
[[Файл:И_в_настройках_модуля_при_добавлении_его_в_проект.png ‎|center|thumb|]]
====Remote and other graphic windows====

Remote (a remote control) is a graphical area to control SubDevices. Unlike wigets, it can have free size and position. And it is displayed on call. Remote is displayed when a button to go to the remote control is pressed on a widget.
Items to control equipment are placed on Remote (buttons, lists, switches, levels). There can be from 0 to several remote controls. Example of Remote:<br />
[[Файл:Пульт_управления.png ‎|center|thumb|]]<br />

Remote is created like a Widget. The only difference is to select "Remote" when you click "Add Popup Page" in the "Device Type" property.
==Стандарт проектирования интерфейса==
Для удобства проектирования интерфейса был разработан стандарт, в котором следует разрабатывать графические окна в модуле, чтобы модули разных разработчиков выглядели единообразно в рамках одного проекта.
===Основные принципы===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:GeneralUI.png]]</div></div>
<div class="col-sm-12 col-md-6">
Виджет состоит из «Header» и дополнительных модулей основного функционала. <br/>
«Header» — верхний модуль виджета.<br/>
«Header» содержит:<br/>
- наименование виджета;
- наименование устройства, которым<br/>
управляет виджет;<br/>
- иконка категории устройства.<br/>
<br/>
Дополнительные модули содержат элементы управления устройством.
</div>
</div>
===Модульная сетка и блоки===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka1.png]]</div></div>
<div class="col-sm-12 col-md-6">
Модульная сетка виджета представляет собой блоки 640 pt в ширину
и 120 pt в высоту. Каждый блок имеет сетку 8х8 pt.
Скругления углов равно 12,5 ut. (Circle 25)
</div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka2.png]]</div></div>
<div class="col-sm-12 col-md-6">
Принцип построения блока виджета представляет собой конструктор из
элементов управления (кнопок, свитчей, лэйблов) от меньшего к большему.
</div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka3.png]]</div></div>
<div class="col-sm-12 col-md-6">
Элементы управления комбинируются и объединяются в блок,
а блоки объединяются в панель управления.
</div>
</div>
===Кнопки===
<big>'''Toggle'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Toggle.png]]</div></div>
<div class="col-sm-12 col-md-6">
Кнопка изменения значения «вкл/выкл». Применяется как в случаях с неизвестным состоянием работы устройства, так и для управления функционалом устройства.
</div>
</div>
<big>'''Switch'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Switch.png]]</div></div>
<div class="col-sm-12 col-md-6">
Кнопка изменения значения «вкл/выкл». Применяется только в случаях с известным состоянием работы устройства.
</div>
</div>
<big>'''Multistate'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Multistate.png]]</div></div>
<div class="col-sm-12 col-md-6">
Кнопка изменения значения предустановленного состояния устройства применяется только в случаях с известным cостоянием работы устройства.
</div>
</div>
===Кнопка-стрелка===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:arrow1.png]]</div></div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:arrow2.png]]</div></div>
</div>
'''Действие кнопки'''<br/>
При нажатии на кнопку происходит вызов «PopUp».<br/>
'''Содержимое «PopUp»'''<br/>
«Input field», «Single selection», «Multiple selection».
===Слайдеры===
<div class="row">
<div class="col-sm-12 col-md-6">
Standart
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:StandartSlider.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
Value
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ValueSlider.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
Progress
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ProgressSlider.png]]</div></div>
</div>
===Описание===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Description.png]]</div></div>
===Иконки===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Icons1.png]]</div></div>
Все иконки делятся по сферам применения, и их главное различие — размеры
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Icons2.png]]</div></div>
===Виджет «header»===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:WidgetHeader.png]]</div></div>
===Расположение кнопок===
<div class="row">
<div class="col-sm-12 col-md-6">
Форм фактор: 128х120 pt
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:FormFactor.png]]</div></div>
</div>
Все кнопки имеют два состояния — покой и активность.
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:OFFicon.png]]</div></div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ONicon.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
В состоянии покоя цвет кнопки всегда # 848484 или RGB 132
</div>
<div class="col-sm-12 col-md-6">
Активным состояние кнопки считается только тогда, когда действие получило обратную связь является кратковременным или мгновенным (например: «Play» в медиаплеере) или действие, которое находится в состоянии активности продолжительное время и требует дополнительного воздействия для отключения состояния активности
(например: «Repeat» в медиаплеере).
</div>
</div>
==Основы работы со скриптами==

После проектирования интерфейса и добавления драйвера, вам понадобится разработать логику работы модуля в скриптах. Скриптовая часть при разработке i3 lite модуля имеет некоторые особенности. Перед разработкой скриптовой части lite модуля рекомендуем ознакомиться с [http://dev.iridiummobile.net/JS_Guide iRidium Pro API] и [[Special:MyLanguage/Developers_API | i3 lite API]]. <br />

Модуль может содержать неограниченное количество скриптов.
Существуют разные типы скриптов для модуля:
* Driver - в скриптовых файлах данного типа должны содержаться скрипты, отвечающие за работу с драйвером
* GUI - В этих скриптовых файлах содержатся скрипты, отвечающие за работу с графикой
* Common - в данных скриптовых файлах должны содержаться скрипты общего характера, тут может быть набор дополнительных функций или описание классов второстепенного назначения
* Setup - это специальный скриптовой файл, в нем содержиться информация о настройке модуля. а именно - список полей, обязательных для заполнения, типы этих полей и функции проверки правильности введенных данных.

Разделение на типы необходимо для правильной обработки модуля на сервере. На сервере работает только логика и драверная часть модулей, но сервер ничего не знает о графической части. Поэтому разработчику модуля требуется разбивать скрипты по типам. Сервер игнорирует файлы для работы с графической частью. <br />

При разработке модуля следует использовать простраство имен module вместо IR. Таким образом слушатель будет иметь вид module.AddListener(… <br />

Каждый скриптовой файл должен начинаться со слушателя
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_MODULE_START, 0, function(){});
</syntaxhighlight>
Это новый вид события, предназначенный специально для разработки модуля. При разработке модуля следует учитывать что скриптовой файл стал закрыт для других скриптовых файлов. Это хзначить что теперь можно использовать одноименные переменные и названия функций в разных скриптовых файлах и они не будут перезаписываться, но это накладывает ограничение: нельзя получить доступ к функции из другого скриптового файла простым способом. Для получения доступа к функции из другого скриптового файла, следует импортировать скриптовый файл с помощью команды module.Import("FileName.js"). <br />
Пример:<br/>
<syntaxhighlight lang="javascript">
//Name_1.js - первый js файл
this.Text = "Hello, world!"; //Указатель на текстовую переменную
//Name_2.js - второй js файл
var Text = module.Import("Name_1.js").Text; //Импортируем из первого js файла объект с указателем на текстовую переменную
IR.Log(Text); //"Hello, world!" //выводим в лог переменную Text
</syntaxhighlight>
==Создание подустройств==
Основой любого модуля служат подустройства и задачей разработчика модуля является определить сколько подустройств будет в модуле и разработать логику работы подустройств. В состав каждого подустройства может входить виджет, пульт управления, собственный набор действий, событий и состояний. Все составляющие подустройства необходимо указать при его создании. Содержимое подустройства не может меняться в ходе работы модуля. Для создания подустройства используется команда:<br/>
<syntaxhighlight lang="javascript">
module.AddSubDevice(SystemName, [Device], [System], [Type], [Tags], [Name], [Callback]);
</syntaxhighlight>
,где<br/>
'''SystemName''' - системное имя подустройства<br/>
'''Device''' - драйвер, к которому будет привязано подустройство<br/>
'''System''' - устаревший параметр, следует использовать false<br/>
'''Type''' - тип smart устройства. Параметр в разработке<br/>
'''Tags''' - Массив объектов виртуальных тегов<br/>
'''Name''' - имя подустройства, которое отображается пользователю<br/>
'''Callback function(){do somethings}''' - функция, которая выполняется до наступления события IR.EVENT_ADD_SUBDEVICE<br/>
В ответ функция вернет ссылку на подустройство, по которой к нему можно обратиться.<br/>
Пример создания подустройств для HDL Relay устройств. Скрипт проверяет количество устройств в шине и в цикле создает подустройства<br/>
<syntaxhighlight lang="javascript">
for (var count = 1; count <= COUNT_CHANNEL; count++) {
// Создаем подустройство
l_oSubDevice = module.AddSubDevice("Relay " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_RELAY);
// Создаем команду StatusOnStart
if (count == 1)
l_oSubDevice.AddChannel("Relay:statusOnStart", [ChannelData]);
var l_sChannelName = "Relay:channel" + count;
// Добавляем каналы
l_oSubDevice.AddChannel(l_sChannelName, [ChannelData]);
l_oSubDevice.AddTag(l_sChannelName, [ChannelData]);
// Добавляем виртуальный тег
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_TAG_POWER, true);
};</syntaxhighlight><br/>
Таким способом можно добавить в подустройство все необходимые сущности. Также, при создании подустройства, активируется событие<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function, [pointer]);
</syntaxhighlight><br/>
В функцию передается ссылка на только что созданное подустройство. В данном событии можно добавлять к подустройству различные компоненты(действия, события, состояния, виджеты, каналы, теги). Например:<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function(in_oSubDevice){
Создаем действия
in_oSubDevice.AddAction("On", false, in_oSubDevice.SystemName + "_Power", lightID + "_1", IR.SUB_DEVICE_COMMAND_POWER_ON);
in_oSubDevice.AddAction("Off", false, in_oSubDevice.SystemName + "_Power", lightID + "_0", IR.SUB_DEVICE_COMMAND_POWER_OFF);
Создаем события
in_oSubDevice.AddEvent("On", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "1");
in_oSubDevice.AddEvent("Off", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "0");
Создаем состояния
in_oSubDevice.AddCondition("On", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "1");
in_oSubDevice.AddCondition("Off", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "0");
});</syntaxhighlight><br/>
Таким образом разработчик может создавать нужное количество подустройств при установке модуля или ручном добавлении новых подустройств
==Добавление виджетов к подустройству==

Полсе создания интерфейсов в редакторе и добавления функции добавления подустройств, вам потребуется создавать для каждого поустройства свой экземпляр виджета и привязывать его к подустройству. Для привязки виджета к подустройству используется метод<br/>
<syntaxhighlight lang="javascript">SubDevice.addWidget(in_Widget)</syntaxhighlight><br/>

Входным параметром метода является: '''in_Widget''' - объект - виджет, заранее созданный в редакторе.<br/>
Выходным параметром метода является: успешно или нет ('''True''', '''False''').<br/>
К примеру у нас 3 лампочки и для того, чтобы не создавать для каждой лампочки отдельный виджет, мы воспользуемся уже готовым примером нашего окна и просто будем клонировать его. Напишем пример создания виджета с помощью кода по уже существующему образцу.<br/>

Метод Clone позволяет клонировать уже существующее всплывающее окно.<br/>
<syntaxhighlight lang="javascript">Module.ClonePopup (in_Popup, in_Name)</syntaxhighlight><br/>
Входные параметры метода:
*'''in_Name''' - имя нового виджета.<br/>
*'''in_Popup''' - ссылка на всплывающее окно.<br/>
Выходным параметром метода является: успешно или нет ('''True''', '''False''').<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function(in_oSubDevice){
var popup = module.GetPopup("Dimmer"); // Обращаемся к виджету который собираемся скопировать
// Создаем виджет методом клонирования
var widget = in_oSubDevice.addWidget(module.ClonePopup(popup, "Dimmer"+ in_oSubDevice.Name));
});</syntaxhighlight><br/>
----
{{i}} Имена новых виджетов не должны повторяться.
----
При открытии полноценного пульта управления из виджета, необходимо помнить о том что пользователь будет запускать модуль как на планшета, так и на телефоне. Из-за разницы в величине экранов, разработчик модуля должен разработать 2 вида окон. Вид под телефонную версию модуля и вид под планшетную версию. При этом надо добавить в скрипт метод, который будет спрашивать у системы вид устройства, на котором запущен модуль, и открывать соответствующее окно
<syntaxhighlight lang="javascript">
if (IR.DisplayType == IR.DISPLAY_TYPE_PHONE) { //Если модуль открыт на телефоне
var l_oPopupScanner = module.GetPopup("Phone"); //Показываем попап, отрисованный для телефона
}
else {
var l_oPopupScanner = module.GetPopup("Tablet");//Если планшет, то открываем попап для планшета
}
</syntaxhighlight><br/>
==Работа с каналами и тегами==
После создания подустройства и добавления виджета, вам понадобится добавить к подустройству нужные для работы каналы и теги. Как и в версии i3 Pro, драйвер можно добавить в графическом интерфейсе редактора или в скрипте. Для каждого подустройства потребуется собственный набор каналов и тегов для выбранного драйвера. В ходе работы может потребоваться работать с тремя компонентами:<br/>
*Канал. Для создания канала следует использовать метод<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddChannel(Name, DataArray)
</syntaxhighlight>где,<br/>
'''Name''' - имя канала<br/>
'''DataArray''' - массив данных, специфичный для каждого драйвера<br/>
*Тег. Для создания тега следует использовать метод<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddTag(Name, DataArray)
</syntaxhighlight>где,<br/>
'''Name''' - имя тега<br/>
'''DataArray''' - массив данных, специфичный для каждого драйвера<br/>
*Виртуальный тег. Для создания виртуального следует использовать метод<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddVirtualTag(Name, Value, [Edit], [smartID], [Hidden])
</syntaxhighlight>где,<br/>
'''Name'''- имя виртуального тега подустройства<br/>
'''Value''' - Значение тега<br/>
'''Edit''' - Разрешение редактирования тега<br/>
'''smartID''' - Параметр в разработке! Необходимо устанавливать false<br/>
'''Hidden''' - Признак скрытости тега<br/>
===Пример создания каналов и тегов при создании подустройства:===
<syntaxhighlight lang="javascript">
l_oSubDevice = module.AddSubDevice("Light " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_DIMMER);

// Adding channel StatusOnStart
if (count == 1)
l_oSubDevice.AddChannel("Dimmer:statusOnStart", [ChannelData]);

// Assigned to the variable name of the channel
var l_sChannelName = "Dimmer:channel" + count;

// Adding channels
l_oSubDevice.AddChannel(l_sChannelName, [ChannelData]);
l_oSubDevice.AddTag(l_sChannelName, [TagData]);

// Adding smart virtual tag
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_COMMAND_POWER, true);
l_oSubDevice.AddVirtualTag("Power On", 0, false, IR.SUB_DEVICE_COMMAND_POWER_ON, true);
l_oSubDevice.AddVirtualTag("Power Off", 0, false, IR.SUB_DEVICE_COMMAND_POWER_OFF, true);
l_oSubDevice.AddVirtualTag("Level", 0, false, IR.SUB_DEVICE_COMMAND_LEVEL, true);
</syntaxhighlight>
==Установка модуля в приложение==
Модули хранятся в магазине модулей iRidium Store и могут устанавливаться в приложение двумя способами:<br/>
*С помощью сканера<br/>
*Вручную<br/>
===Разработка Setup===
Для любого варианта необходимо разрабатывать файл Setup. Это специальный скриптовой файл, в котором прописаны поля, необходимые для работы модуля. Такими полями могут выступать ip адрес устройства, порт, название города итд. Для разработки Setup необходимо создать новый скриптовый файл и задать его тип "Setup". Каждое поле является тегом и к нему можно получить доступ из скрипта и получить введенное значение
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:СетапБонго.png]]</div></div>
Файл Setup состоит из 2-ух частей. Первая часть это настройки драйверов. В этих настройках следует запрашивать ip адреса, порты и логины, для подключения драйвера у устройству. Вторая часть файла это общие настройки модуля, такие как количество выходов, ключи доступа.
Для установки поля в Setup необходимо настроить следующие поля в скрипте:
* Тип поля - надо указать какое поле надо показать пользователю(текстовое поле, массив значений итд. Подробнее описано в API)
* Имя поля - название поля, которое увидит пользователь при настройке модуля
* Значение по умолчанию - какое значение следует подставлять по умолчанию
* Функция проверки - функция валидации значения в поле. Здесь требуется написать функцию, которая будет проверять корректность введенных данных.
Например, скрипт "Setup" для модуля HDL выглядит следующим образом:
<syntaxhighlight lang="javascript">
{
// Data to connect drivers, created in Project Device Panel
Drivers:
[
{
Name: "HDL-BUS Pro Network (UDP)",
Properties:
[
{
Type: "textfield",
Name: "Host",
DefaultValue: "255.255.255.255",
Validation: function(in_sValue) {
var l_aValueHost = in_sValue.split(".");
if (l_aValueHost.length != 4) {
return "Please input correct Host";
} else
if (parseInt(l_aValueHost[0], 10)>=0
&& parseInt(l_aValueHost[0], 10)<=255
&& parseInt(l_aValueHost[1], 10)>=0
&& parseInt(l_aValueHost[1], 10)<=255
&& parseInt(l_aValueHost[2], 10)>=0
&& parseInt(l_aValueHost[2], 10)<=255
&& parseInt(l_aValueHost[3], 10)>=0
&& parseInt(l_aValueHost[3], 10)<=255
)
return 0
else
return "Please input correct Host";
}
},
{
Type: "textfield",
Name: "Port",
DefaultValue: "6000",
Validation: function(in_sValue) {
if(parseInt(in_sValue, 10)>=0)
return 0
else
return "Please input correct Port";
}
}
]
}
],

// General information for the module (driver and generated by script)
Module: [{
Name: "Channels Count",
Validation: function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input Count";
}
},
{
Type: "textfield",
Name : "SubnetID",
Validation : function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input SubnetID";
}
},
{
Type: "textfield",
Name : "DeviceID",
Validation : function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input DeviceID";
}
}

]
}
</syntaxhighlight>
Для получения данных из полей Setup следует использовать функцию
<syntaxhighlight lang="javascript">
module.GetProperty("Имя поля")
</syntaxhighlight>
<br />
Помимо стандартных параметров, можно запрашивать любые, необходимые для инициализации модуля, параметры. Параметры драйвера подставляются в драйвер автоматически. Остальные параметры следует запрашивать и использовать вручную<br />
Пример работы с параметрами Setup
<syntaxhighlight lang="javascript">
var COUNT_CHANNEL = parseInt(module.GetProperty("Channel count")); // Getting count channel
var SubNetID = parseInt(module.GetProperty("SubnetID")); // Getting subnet id
var DeviceID = parseInt(module.GetProperty("DeviceID")); // Getting device id
</syntaxhighlight>
===Установка модуля вручную===
===Установка модуля с помощью сканера===
===Ручное добавление подустройств===
===Авторизация===
===Смена настроек===
===Удаление модуля===

Translations:DevManual/71/en

2017-04-03T10:25:11Z

Ildar: Новая страница: «Remote is created like a Widget. The only difference is to select "Remote" when you click "Add Popup Page" in the "Device Type" property.»

Remote is created like a Widget. The only difference is to select "Remote" when you click "Add Popup Page" in the "Device Type" property.

Translations:DevManual/70/en

2017-04-03T10:15:42Z

Ildar: Новая страница: «Remote (a remote control) is a graphical area to control SubDevices. Unlike wigets, it can have free size and position. And it is displayed on call. Remote is dis…»

Remote (a remote control) is a graphical area to control SubDevices. Unlike wigets, it can have free size and position. And it is displayed on call. Remote is displayed when a button to go to the remote control is pressed on a widget.
Items to control equipment are placed on Remote (buttons, lists, switches, levels). There can be from 0 to several remote controls. Example of Remote:<br />

DevManual/en

2017-04-03T10:15:42Z

<languages/>
=Module development guide=
==Definitions==

'''Module''' - is a component that allows you to control one type of equipment by its unique ID. The module is located in the store of modules.

'''Control panel (mobile device)''' - is a device from which the project i3 lite is launched (tablet, smartphone).

'''Store of modules''' - is a cloud server for uploading ready-made modules. The module store is available from the i3 lite application or on our[http://www.iridiummobile.ru/store/ site]

'''iRidium Studio''' - is a editor that allows to create the module to control device for i3 lite application. You need to use a special editor build for [http://www.iridiummobile.net/redirects/?go=iRidium_SETUP_LITE module developers] to develop the module

'''i3 lite''' - is an application to create, set and use i3 lite projects.

'''i3 lite project''' – is an automation project made up of ready equipment control modules. i3 lite projects differ from i2 Control projects: i3 lite projects can be edited dynamically without prior editing in iRidium Studio. i3 lite project consists of several small parts that can be put together into a single whole in i3 lite app with the help of the built-in constructor. It can also be easily edited in the app. As a result, a big number of intermediate processes are no longer necessary, such as installing software on PC, uploading projects on contol panels. All is done in one place - a control panel.

'''SubDevice''' - This is a virtual representation of the working area of the physical device. If we take as an example a 6-channel dimmer it has 6 sub-devices, because each independent device requires a separate control interface and connects to one channel.

'''Room (in i3 lite)''' - The visual part of i3 lite containing hardware management widgets. The project in i3 lite consists of rooms located on the floors

'''Widget''' - is a visual module component located in the room. It has limitations in size and fixed position in the room interface. It contains the main module functionality. For additional functions Remote is used.

'''Remote''' - is a visual module component which is hidden by default. It opens only when clicking on the corresponding item of the widget. It does not have size limitations (not more than the panel display size) and can be located in any part of the room interface (it is usually located in the middle of the panel display). It contains additional functionality of the module.

'''Macros''' - is a sequence of commands of various modules, which is activated by pressing. Contains "Action" and "Condition". For example, the macros "turn off all the lights in the house" will send the shutdown command to all devices responsible for lighting.

'''Routine''' - is a sequence of commands of various modules, which is activated automatically when a certain event occurs. Contains "Event", "Action" and "Condition". For example, "turn on the light if the motion sensor is triggered"

'''Event''' - is a routine component that describes the control command and the value range. If the value is sent in the indicated range, the routine is executed. For example, the event "Motion appeared" is activated if the motion sensor is triggered.

'''Action''' - is a component of macros and routines. It describes the control command and value that must be sent to the command. For example, "turn on the light". There are 2 types of Action: Simple Action and Advanced Action.

'''Simple Action''' - Simple Action is used when the command and Action value are known in advance.

'''Advanced Action''' - Advanced Action is used when the command is known but the value is unknown. The value is set dynamically when Action is used in i3 lite (but not when creating in iRidium studio).

'''Condition''' - is a component of macros and scenes. It describes the control command and value range. When a value from the value range is sent Action is executed.

'''Scanner''' - is a software part, that analyzes any bus looking for connected devices. Found connected devices are displayed in a list. Modules for the found devices are downloaded from iRidium store and the devices become available to control in i3 lite.
==Module concept==
The module is an independent subroutine of the i3 lite application which is built in the project and has an independent interface, driver and logic. Modules are developed in the [http://www.iridiummobile.net/redirects/?go=iRidium_SETUP_LITE iRidium Studio] editor and located in the module store [http://www.iridiummobile.ru/store/ iRidium Store]. Integrator downloads the module from the module store for each individual project.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ModuleInScheme.png]]</div></div>
</div>

There are two types of modules:
*Control module - module for hardware control
*Scanner - module for searching hardware in the local network and loading modules for found devices
== How to start developing the module ==
----

{{i}} Before starting your work, it is recommended to read [http://dev.iridiummobile.net/How_to_begin iRidium documentation]. It describes the basics of working with iRidium. The i3 lite documentation describes how to develop modules for the i3 lite platform for users, who already know iRidium. If you want to write script use [[Special:MyLanguage/Developers_API | i3 lite API]].
----

The module life cycle consists of:
* Developing the graphic part in iRidium studio
* Developing the driver part (scripts, devices)
* Testing
* Publishing in iRidium store
* Using (module download via the i3 lite application from the cloud and adding to automation projects)
<br/>
==Module structure ==
Each module must consist of subdevices. The subdevice is a virtual representation of the working area of a physical device. Many devices support multiple workgroups with the same functionality. Each workgroup may be in a separate zone. To fully control the zone, you need to create a subdevice for each workgroup of the device. For example, a 6-channel HDL dimmer contains 6 dimmable channels, through which 6 working groups can be controlled. Therefore, it is advisable to select in the module 6 subdevices for the possibility of creating actions, events and conditions for each workgroup separately. The presence of subdevice in the i3 lite module is obligatory. The number of sub-devices can be from one to many. Usually the number of subdevice is equal to the number of channels of the controller, the number of its work areas or logical devices.

Subdevice consists of:
* Conditions
* Actions
* Events
* Widgets

Conditions, actions and events are logical elements of the subdevice, on their basis macros and routines are created. Widget is a graphical element, through which the user will control subdevice. Usually one subdevice contains one widget, but the number of conditions, actions and events varies (from zero to many). The number of subdevices in the module can be either fixed or not. For example, you can develop a module only for a 6-channel dimmer, and you can make a module that will request the hardware for the number of subdevices and create the required number of subdevices.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ModuleStruct.png]]</div></div>
</div>
==Creating the module interface ==
The interface part of the midule consists of:
* widgets - interface part of the subdevice, which is located in the rooms and has basic control functions
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:WidgetExample.png]]</div></div>
</div>
* Remote - interface part of the module, which has a set of device functions and opens to the full screen, when you click on the widget button
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:RemoteExample.png]]</div></div>
</div>
* Authorization window - Authorization is required to work with some devices. To do this, the developer can create a special authorization window that is available in the module settings
картинка кнопки авторизации и окна авторизации
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:AutorisationExample.png]]</div></div>
</div>
* The module settings window is a window where you need to enter the parameters for the module operation
картинка окна настроек модуля и кнопки открытия
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:SettingsExample.png]]</div></div>
</div>
The whole graphic part is drawn in the graphical interface of the iRidium studio editor. In contradistinction to i3 pro, the module's interface should be made up of ready-made graphic components located in the gallery.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ItemGallery.png]]</div></div>
</div>

==== Widget ====

Widget is a visual component of the module, a kind of Popup that will be displayed in the room. The main task of the widget is to display the basic controls of the subdevice and to provide a module transition to the Remote control of the subdevice. For example, to control a media player, you can place a volume slider or Mute button for quick access to adjusting the volume. The weather widget can display the current weather, and the control panel will contain the weather forecast for all 5 days.<br />
The module does not make sense without widget, because it will not have a graphical representation in the i3 lite project.

Widget has a limited size
# Width '''640'''
# Height can not exceed '''1200'''

[[Файл:Пример виджета.png|center|thumb|Рис. Widget example]]

To create a widget, click the Add pop-up button in the Project overview panel and in the appeared menu select popup type: "Widget", set the name and properties:
[[Файл:ПанельПопап.png|thumb|center]]

Properties of a created widget can be changed with the help of '''Object Properties'''.<br />
Graphic items are assigned to channels like in popups:
[[Файл:Связывание_канала_команды_и_графического_элемента.png|center|thumb|Рис. Связывание канала команды и графического элемента]]
Widget will be displayed:
* In the room when a client uses the project
[[Файл:В_комнате_при_использовании_пользователем_проекта.png|center|thumb|]]
* In the module settings when it is added to the project:
[[Файл:И_в_настройках_модуля_при_добавлении_его_в_проект.png ‎|center|thumb|]]
====Remote and other graphic windows====

Remote (a remote control) is a graphical area to control SubDevices. Unlike wigets, it can have free size and position. And it is displayed on call. Remote is displayed when a button to go to the remote control is pressed on a widget.
Items to control equipment are placed on Remote (buttons, lists, switches, levels). There can be from 0 to several remote controls. Example of Remote:<br />
[[Файл:Пульт_управления.png ‎|center|thumb|]]<br />

Окно создаётся аналогично виджету, с одним лишь отличием, что при нажатии "Add Popup Page" в параметре "Device Type" надо выбрать "Remote".
==Стандарт проектирования интерфейса==
Для удобства проектирования интерфейса был разработан стандарт, в котором следует разрабатывать графические окна в модуле, чтобы модули разных разработчиков выглядели единообразно в рамках одного проекта.
===Основные принципы===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:GeneralUI.png]]</div></div>
<div class="col-sm-12 col-md-6">
Виджет состоит из «Header» и дополнительных модулей основного функционала. <br/>
«Header» — верхний модуль виджета.<br/>
«Header» содержит:<br/>
- наименование виджета;
- наименование устройства, которым<br/>
управляет виджет;<br/>
- иконка категории устройства.<br/>
<br/>
Дополнительные модули содержат элементы управления устройством.
</div>
</div>
===Модульная сетка и блоки===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka1.png]]</div></div>
<div class="col-sm-12 col-md-6">
Модульная сетка виджета представляет собой блоки 640 pt в ширину
и 120 pt в высоту. Каждый блок имеет сетку 8х8 pt.
Скругления углов равно 12,5 ut. (Circle 25)
</div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka2.png]]</div></div>
<div class="col-sm-12 col-md-6">
Принцип построения блока виджета представляет собой конструктор из
элементов управления (кнопок, свитчей, лэйблов) от меньшего к большему.
</div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka3.png]]</div></div>
<div class="col-sm-12 col-md-6">
Элементы управления комбинируются и объединяются в блок,
а блоки объединяются в панель управления.
</div>
</div>
===Кнопки===
<big>'''Toggle'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Toggle.png]]</div></div>
<div class="col-sm-12 col-md-6">
Кнопка изменения значения «вкл/выкл». Применяется как в случаях с неизвестным состоянием работы устройства, так и для управления функционалом устройства.
</div>
</div>
<big>'''Switch'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Switch.png]]</div></div>
<div class="col-sm-12 col-md-6">
Кнопка изменения значения «вкл/выкл». Применяется только в случаях с известным состоянием работы устройства.
</div>
</div>
<big>'''Multistate'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Multistate.png]]</div></div>
<div class="col-sm-12 col-md-6">
Кнопка изменения значения предустановленного состояния устройства применяется только в случаях с известным cостоянием работы устройства.
</div>
</div>
===Кнопка-стрелка===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:arrow1.png]]</div></div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:arrow2.png]]</div></div>
</div>
'''Действие кнопки'''<br/>
При нажатии на кнопку происходит вызов «PopUp».<br/>
'''Содержимое «PopUp»'''<br/>
«Input field», «Single selection», «Multiple selection».
===Слайдеры===
<div class="row">
<div class="col-sm-12 col-md-6">
Standart
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:StandartSlider.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
Value
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ValueSlider.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
Progress
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ProgressSlider.png]]</div></div>
</div>
===Описание===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Description.png]]</div></div>
===Иконки===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Icons1.png]]</div></div>
Все иконки делятся по сферам применения, и их главное различие — размеры
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Icons2.png]]</div></div>
===Виджет «header»===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:WidgetHeader.png]]</div></div>
===Расположение кнопок===
<div class="row">
<div class="col-sm-12 col-md-6">
Форм фактор: 128х120 pt
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:FormFactor.png]]</div></div>
</div>
Все кнопки имеют два состояния — покой и активность.
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:OFFicon.png]]</div></div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ONicon.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
В состоянии покоя цвет кнопки всегда # 848484 или RGB 132
</div>
<div class="col-sm-12 col-md-6">
Активным состояние кнопки считается только тогда, когда действие получило обратную связь является кратковременным или мгновенным (например: «Play» в медиаплеере) или действие, которое находится в состоянии активности продолжительное время и требует дополнительного воздействия для отключения состояния активности
(например: «Repeat» в медиаплеере).
</div>
</div>
==Основы работы со скриптами==

После проектирования интерфейса и добавления драйвера, вам понадобится разработать логику работы модуля в скриптах. Скриптовая часть при разработке i3 lite модуля имеет некоторые особенности. Перед разработкой скриптовой части lite модуля рекомендуем ознакомиться с [http://dev.iridiummobile.net/JS_Guide iRidium Pro API] и [[Special:MyLanguage/Developers_API | i3 lite API]]. <br />

Модуль может содержать неограниченное количество скриптов.
Существуют разные типы скриптов для модуля:
* Driver - в скриптовых файлах данного типа должны содержаться скрипты, отвечающие за работу с драйвером
* GUI - В этих скриптовых файлах содержатся скрипты, отвечающие за работу с графикой
* Common - в данных скриптовых файлах должны содержаться скрипты общего характера, тут может быть набор дополнительных функций или описание классов второстепенного назначения
* Setup - это специальный скриптовой файл, в нем содержиться информация о настройке модуля. а именно - список полей, обязательных для заполнения, типы этих полей и функции проверки правильности введенных данных.

Разделение на типы необходимо для правильной обработки модуля на сервере. На сервере работает только логика и драверная часть модулей, но сервер ничего не знает о графической части. Поэтому разработчику модуля требуется разбивать скрипты по типам. Сервер игнорирует файлы для работы с графической частью. <br />

При разработке модуля следует использовать простраство имен module вместо IR. Таким образом слушатель будет иметь вид module.AddListener(… <br />

Каждый скриптовой файл должен начинаться со слушателя
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_MODULE_START, 0, function(){});
</syntaxhighlight>
Это новый вид события, предназначенный специально для разработки модуля. При разработке модуля следует учитывать что скриптовой файл стал закрыт для других скриптовых файлов. Это хзначить что теперь можно использовать одноименные переменные и названия функций в разных скриптовых файлах и они не будут перезаписываться, но это накладывает ограничение: нельзя получить доступ к функции из другого скриптового файла простым способом. Для получения доступа к функции из другого скриптового файла, следует импортировать скриптовый файл с помощью команды module.Import("FileName.js"). <br />
Пример:<br/>
<syntaxhighlight lang="javascript">
//Name_1.js - первый js файл
this.Text = "Hello, world!"; //Указатель на текстовую переменную
//Name_2.js - второй js файл
var Text = module.Import("Name_1.js").Text; //Импортируем из первого js файла объект с указателем на текстовую переменную
IR.Log(Text); //"Hello, world!" //выводим в лог переменную Text
</syntaxhighlight>
==Создание подустройств==
Основой любого модуля служат подустройства и задачей разработчика модуля является определить сколько подустройств будет в модуле и разработать логику работы подустройств. В состав каждого подустройства может входить виджет, пульт управления, собственный набор действий, событий и состояний. Все составляющие подустройства необходимо указать при его создании. Содержимое подустройства не может меняться в ходе работы модуля. Для создания подустройства используется команда:<br/>
<syntaxhighlight lang="javascript">
module.AddSubDevice(SystemName, [Device], [System], [Type], [Tags], [Name], [Callback]);
</syntaxhighlight>
,где<br/>
'''SystemName''' - системное имя подустройства<br/>
'''Device''' - драйвер, к которому будет привязано подустройство<br/>
'''System''' - устаревший параметр, следует использовать false<br/>
'''Type''' - тип smart устройства. Параметр в разработке<br/>
'''Tags''' - Массив объектов виртуальных тегов<br/>
'''Name''' - имя подустройства, которое отображается пользователю<br/>
'''Callback function(){do somethings}''' - функция, которая выполняется до наступления события IR.EVENT_ADD_SUBDEVICE<br/>
В ответ функция вернет ссылку на подустройство, по которой к нему можно обратиться.<br/>
Пример создания подустройств для HDL Relay устройств. Скрипт проверяет количество устройств в шине и в цикле создает подустройства<br/>
<syntaxhighlight lang="javascript">
for (var count = 1; count <= COUNT_CHANNEL; count++) {
// Создаем подустройство
l_oSubDevice = module.AddSubDevice("Relay " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_RELAY);
// Создаем команду StatusOnStart
if (count == 1)
l_oSubDevice.AddChannel("Relay:statusOnStart", [ChannelData]);
var l_sChannelName = "Relay:channel" + count;
// Добавляем каналы
l_oSubDevice.AddChannel(l_sChannelName, [ChannelData]);
l_oSubDevice.AddTag(l_sChannelName, [ChannelData]);
// Добавляем виртуальный тег
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_TAG_POWER, true);
};</syntaxhighlight><br/>
Таким способом можно добавить в подустройство все необходимые сущности. Также, при создании подустройства, активируется событие<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function, [pointer]);
</syntaxhighlight><br/>
В функцию передается ссылка на только что созданное подустройство. В данном событии можно добавлять к подустройству различные компоненты(действия, события, состояния, виджеты, каналы, теги). Например:<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function(in_oSubDevice){
Создаем действия
in_oSubDevice.AddAction("On", false, in_oSubDevice.SystemName + "_Power", lightID + "_1", IR.SUB_DEVICE_COMMAND_POWER_ON);
in_oSubDevice.AddAction("Off", false, in_oSubDevice.SystemName + "_Power", lightID + "_0", IR.SUB_DEVICE_COMMAND_POWER_OFF);
Создаем события
in_oSubDevice.AddEvent("On", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "1");
in_oSubDevice.AddEvent("Off", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "0");
Создаем состояния
in_oSubDevice.AddCondition("On", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "1");
in_oSubDevice.AddCondition("Off", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "0");
});</syntaxhighlight><br/>
Таким образом разработчик может создавать нужное количество подустройств при установке модуля или ручном добавлении новых подустройств
==Добавление виджетов к подустройству==

Полсе создания интерфейсов в редакторе и добавления функции добавления подустройств, вам потребуется создавать для каждого поустройства свой экземпляр виджета и привязывать его к подустройству. Для привязки виджета к подустройству используется метод<br/>
<syntaxhighlight lang="javascript">SubDevice.addWidget(in_Widget)</syntaxhighlight><br/>

Входным параметром метода является: '''in_Widget''' - объект - виджет, заранее созданный в редакторе.<br/>
Выходным параметром метода является: успешно или нет ('''True''', '''False''').<br/>
К примеру у нас 3 лампочки и для того, чтобы не создавать для каждой лампочки отдельный виджет, мы воспользуемся уже готовым примером нашего окна и просто будем клонировать его. Напишем пример создания виджета с помощью кода по уже существующему образцу.<br/>

Метод Clone позволяет клонировать уже существующее всплывающее окно.<br/>
<syntaxhighlight lang="javascript">Module.ClonePopup (in_Popup, in_Name)</syntaxhighlight><br/>
Входные параметры метода:
*'''in_Name''' - имя нового виджета.<br/>
*'''in_Popup''' - ссылка на всплывающее окно.<br/>
Выходным параметром метода является: успешно или нет ('''True''', '''False''').<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function(in_oSubDevice){
var popup = module.GetPopup("Dimmer"); // Обращаемся к виджету который собираемся скопировать
// Создаем виджет методом клонирования
var widget = in_oSubDevice.addWidget(module.ClonePopup(popup, "Dimmer"+ in_oSubDevice.Name));
});</syntaxhighlight><br/>
----
{{i}} Имена новых виджетов не должны повторяться.
----
При открытии полноценного пульта управления из виджета, необходимо помнить о том что пользователь будет запускать модуль как на планшета, так и на телефоне. Из-за разницы в величине экранов, разработчик модуля должен разработать 2 вида окон. Вид под телефонную версию модуля и вид под планшетную версию. При этом надо добавить в скрипт метод, который будет спрашивать у системы вид устройства, на котором запущен модуль, и открывать соответствующее окно
<syntaxhighlight lang="javascript">
if (IR.DisplayType == IR.DISPLAY_TYPE_PHONE) { //Если модуль открыт на телефоне
var l_oPopupScanner = module.GetPopup("Phone"); //Показываем попап, отрисованный для телефона
}
else {
var l_oPopupScanner = module.GetPopup("Tablet");//Если планшет, то открываем попап для планшета
}
</syntaxhighlight><br/>
==Работа с каналами и тегами==
После создания подустройства и добавления виджета, вам понадобится добавить к подустройству нужные для работы каналы и теги. Как и в версии i3 Pro, драйвер можно добавить в графическом интерфейсе редактора или в скрипте. Для каждого подустройства потребуется собственный набор каналов и тегов для выбранного драйвера. В ходе работы может потребоваться работать с тремя компонентами:<br/>
*Канал. Для создания канала следует использовать метод<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddChannel(Name, DataArray)
</syntaxhighlight>где,<br/>
'''Name''' - имя канала<br/>
'''DataArray''' - массив данных, специфичный для каждого драйвера<br/>
*Тег. Для создания тега следует использовать метод<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddTag(Name, DataArray)
</syntaxhighlight>где,<br/>
'''Name''' - имя тега<br/>
'''DataArray''' - массив данных, специфичный для каждого драйвера<br/>
*Виртуальный тег. Для создания виртуального следует использовать метод<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddVirtualTag(Name, Value, [Edit], [smartID], [Hidden])
</syntaxhighlight>где,<br/>
'''Name'''- имя виртуального тега подустройства<br/>
'''Value''' - Значение тега<br/>
'''Edit''' - Разрешение редактирования тега<br/>
'''smartID''' - Параметр в разработке! Необходимо устанавливать false<br/>
'''Hidden''' - Признак скрытости тега<br/>
===Пример создания каналов и тегов при создании подустройства:===
<syntaxhighlight lang="javascript">
l_oSubDevice = module.AddSubDevice("Light " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_DIMMER);

// Adding channel StatusOnStart
if (count == 1)
l_oSubDevice.AddChannel("Dimmer:statusOnStart", [ChannelData]);

// Assigned to the variable name of the channel
var l_sChannelName = "Dimmer:channel" + count;

// Adding channels
l_oSubDevice.AddChannel(l_sChannelName, [ChannelData]);
l_oSubDevice.AddTag(l_sChannelName, [TagData]);

// Adding smart virtual tag
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_COMMAND_POWER, true);
l_oSubDevice.AddVirtualTag("Power On", 0, false, IR.SUB_DEVICE_COMMAND_POWER_ON, true);
l_oSubDevice.AddVirtualTag("Power Off", 0, false, IR.SUB_DEVICE_COMMAND_POWER_OFF, true);
l_oSubDevice.AddVirtualTag("Level", 0, false, IR.SUB_DEVICE_COMMAND_LEVEL, true);
</syntaxhighlight>
==Установка модуля в приложение==
Модули хранятся в магазине модулей iRidium Store и могут устанавливаться в приложение двумя способами:<br/>
*С помощью сканера<br/>
*Вручную<br/>
===Разработка Setup===
Для любого варианта необходимо разрабатывать файл Setup. Это специальный скриптовой файл, в котором прописаны поля, необходимые для работы модуля. Такими полями могут выступать ip адрес устройства, порт, название города итд. Для разработки Setup необходимо создать новый скриптовый файл и задать его тип "Setup". Каждое поле является тегом и к нему можно получить доступ из скрипта и получить введенное значение
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:СетапБонго.png]]</div></div>
Файл Setup состоит из 2-ух частей. Первая часть это настройки драйверов. В этих настройках следует запрашивать ip адреса, порты и логины, для подключения драйвера у устройству. Вторая часть файла это общие настройки модуля, такие как количество выходов, ключи доступа.
Для установки поля в Setup необходимо настроить следующие поля в скрипте:
* Тип поля - надо указать какое поле надо показать пользователю(текстовое поле, массив значений итд. Подробнее описано в API)
* Имя поля - название поля, которое увидит пользователь при настройке модуля
* Значение по умолчанию - какое значение следует подставлять по умолчанию
* Функция проверки - функция валидации значения в поле. Здесь требуется написать функцию, которая будет проверять корректность введенных данных.
Например, скрипт "Setup" для модуля HDL выглядит следующим образом:
<syntaxhighlight lang="javascript">
{
// Data to connect drivers, created in Project Device Panel
Drivers:
[
{
Name: "HDL-BUS Pro Network (UDP)",
Properties:
[
{
Type: "textfield",
Name: "Host",
DefaultValue: "255.255.255.255",
Validation: function(in_sValue) {
var l_aValueHost = in_sValue.split(".");
if (l_aValueHost.length != 4) {
return "Please input correct Host";
} else
if (parseInt(l_aValueHost[0], 10)>=0
&& parseInt(l_aValueHost[0], 10)<=255
&& parseInt(l_aValueHost[1], 10)>=0
&& parseInt(l_aValueHost[1], 10)<=255
&& parseInt(l_aValueHost[2], 10)>=0
&& parseInt(l_aValueHost[2], 10)<=255
&& parseInt(l_aValueHost[3], 10)>=0
&& parseInt(l_aValueHost[3], 10)<=255
)
return 0
else
return "Please input correct Host";
}
},
{
Type: "textfield",
Name: "Port",
DefaultValue: "6000",
Validation: function(in_sValue) {
if(parseInt(in_sValue, 10)>=0)
return 0
else
return "Please input correct Port";
}
}
]
}
],

// General information for the module (driver and generated by script)
Module: [{
Name: "Channels Count",
Validation: function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input Count";
}
},
{
Type: "textfield",
Name : "SubnetID",
Validation : function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input SubnetID";
}
},
{
Type: "textfield",
Name : "DeviceID",
Validation : function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input DeviceID";
}
}

]
}
</syntaxhighlight>
Для получения данных из полей Setup следует использовать функцию
<syntaxhighlight lang="javascript">
module.GetProperty("Имя поля")
</syntaxhighlight>
<br />
Помимо стандартных параметров, можно запрашивать любые, необходимые для инициализации модуля, параметры. Параметры драйвера подставляются в драйвер автоматически. Остальные параметры следует запрашивать и использовать вручную<br />
Пример работы с параметрами Setup
<syntaxhighlight lang="javascript">
var COUNT_CHANNEL = parseInt(module.GetProperty("Channel count")); // Getting count channel
var SubNetID = parseInt(module.GetProperty("SubnetID")); // Getting subnet id
var DeviceID = parseInt(module.GetProperty("DeviceID")); // Getting device id
</syntaxhighlight>
===Установка модуля вручную===
===Установка модуля с помощью сканера===
===Ручное добавление подустройств===
===Авторизация===
===Смена настроек===
===Удаление модуля===

DevManual/en

2017-04-03T10:09:39Z

Ildar: Новая страница: «Remote and other graphic windows»

<languages/>
=Module development guide=
==Definitions==

'''Module''' - is a component that allows you to control one type of equipment by its unique ID. The module is located in the store of modules.

'''Control panel (mobile device)''' - is a device from which the project i3 lite is launched (tablet, smartphone).

'''Store of modules''' - is a cloud server for uploading ready-made modules. The module store is available from the i3 lite application or on our[http://www.iridiummobile.ru/store/ site]

'''iRidium Studio''' - is a editor that allows to create the module to control device for i3 lite application. You need to use a special editor build for [http://www.iridiummobile.net/redirects/?go=iRidium_SETUP_LITE module developers] to develop the module

'''i3 lite''' - is an application to create, set and use i3 lite projects.

'''i3 lite project''' – is an automation project made up of ready equipment control modules. i3 lite projects differ from i2 Control projects: i3 lite projects can be edited dynamically without prior editing in iRidium Studio. i3 lite project consists of several small parts that can be put together into a single whole in i3 lite app with the help of the built-in constructor. It can also be easily edited in the app. As a result, a big number of intermediate processes are no longer necessary, such as installing software on PC, uploading projects on contol panels. All is done in one place - a control panel.

'''SubDevice''' - This is a virtual representation of the working area of the physical device. If we take as an example a 6-channel dimmer it has 6 sub-devices, because each independent device requires a separate control interface and connects to one channel.

'''Room (in i3 lite)''' - The visual part of i3 lite containing hardware management widgets. The project in i3 lite consists of rooms located on the floors

'''Widget''' - is a visual module component located in the room. It has limitations in size and fixed position in the room interface. It contains the main module functionality. For additional functions Remote is used.

'''Remote''' - is a visual module component which is hidden by default. It opens only when clicking on the corresponding item of the widget. It does not have size limitations (not more than the panel display size) and can be located in any part of the room interface (it is usually located in the middle of the panel display). It contains additional functionality of the module.

'''Macros''' - is a sequence of commands of various modules, which is activated by pressing. Contains "Action" and "Condition". For example, the macros "turn off all the lights in the house" will send the shutdown command to all devices responsible for lighting.

'''Routine''' - is a sequence of commands of various modules, which is activated automatically when a certain event occurs. Contains "Event", "Action" and "Condition". For example, "turn on the light if the motion sensor is triggered"

'''Event''' - is a routine component that describes the control command and the value range. If the value is sent in the indicated range, the routine is executed. For example, the event "Motion appeared" is activated if the motion sensor is triggered.

'''Action''' - is a component of macros and routines. It describes the control command and value that must be sent to the command. For example, "turn on the light". There are 2 types of Action: Simple Action and Advanced Action.

'''Simple Action''' - Simple Action is used when the command and Action value are known in advance.

'''Advanced Action''' - Advanced Action is used when the command is known but the value is unknown. The value is set dynamically when Action is used in i3 lite (but not when creating in iRidium studio).

'''Condition''' - is a component of macros and scenes. It describes the control command and value range. When a value from the value range is sent Action is executed.

'''Scanner''' - is a software part, that analyzes any bus looking for connected devices. Found connected devices are displayed in a list. Modules for the found devices are downloaded from iRidium store and the devices become available to control in i3 lite.
==Module concept==
The module is an independent subroutine of the i3 lite application which is built in the project and has an independent interface, driver and logic. Modules are developed in the [http://www.iridiummobile.net/redirects/?go=iRidium_SETUP_LITE iRidium Studio] editor and located in the module store [http://www.iridiummobile.ru/store/ iRidium Store]. Integrator downloads the module from the module store for each individual project.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ModuleInScheme.png]]</div></div>
</div>

There are two types of modules:
*Control module - module for hardware control
*Scanner - module for searching hardware in the local network and loading modules for found devices
== How to start developing the module ==
----

{{i}} Before starting your work, it is recommended to read [http://dev.iridiummobile.net/How_to_begin iRidium documentation]. It describes the basics of working with iRidium. The i3 lite documentation describes how to develop modules for the i3 lite platform for users, who already know iRidium. If you want to write script use [[Special:MyLanguage/Developers_API | i3 lite API]].
----

The module life cycle consists of:
* Developing the graphic part in iRidium studio
* Developing the driver part (scripts, devices)
* Testing
* Publishing in iRidium store
* Using (module download via the i3 lite application from the cloud and adding to automation projects)
<br/>
==Module structure ==
Each module must consist of subdevices. The subdevice is a virtual representation of the working area of a physical device. Many devices support multiple workgroups with the same functionality. Each workgroup may be in a separate zone. To fully control the zone, you need to create a subdevice for each workgroup of the device. For example, a 6-channel HDL dimmer contains 6 dimmable channels, through which 6 working groups can be controlled. Therefore, it is advisable to select in the module 6 subdevices for the possibility of creating actions, events and conditions for each workgroup separately. The presence of subdevice in the i3 lite module is obligatory. The number of sub-devices can be from one to many. Usually the number of subdevice is equal to the number of channels of the controller, the number of its work areas or logical devices.

Subdevice consists of:
* Conditions
* Actions
* Events
* Widgets

Conditions, actions and events are logical elements of the subdevice, on their basis macros and routines are created. Widget is a graphical element, through which the user will control subdevice. Usually one subdevice contains one widget, but the number of conditions, actions and events varies (from zero to many). The number of subdevices in the module can be either fixed or not. For example, you can develop a module only for a 6-channel dimmer, and you can make a module that will request the hardware for the number of subdevices and create the required number of subdevices.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ModuleStruct.png]]</div></div>
</div>
==Creating the module interface ==
The interface part of the midule consists of:
* widgets - interface part of the subdevice, which is located in the rooms and has basic control functions
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:WidgetExample.png]]</div></div>
</div>
* Remote - interface part of the module, which has a set of device functions and opens to the full screen, when you click on the widget button
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:RemoteExample.png]]</div></div>
</div>
* Authorization window - Authorization is required to work with some devices. To do this, the developer can create a special authorization window that is available in the module settings
картинка кнопки авторизации и окна авторизации
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:AutorisationExample.png]]</div></div>
</div>
* The module settings window is a window where you need to enter the parameters for the module operation
картинка окна настроек модуля и кнопки открытия
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:SettingsExample.png]]</div></div>
</div>
The whole graphic part is drawn in the graphical interface of the iRidium studio editor. In contradistinction to i3 pro, the module's interface should be made up of ready-made graphic components located in the gallery.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ItemGallery.png]]</div></div>
</div>

==== Widget ====

Widget is a visual component of the module, a kind of Popup that will be displayed in the room. The main task of the widget is to display the basic controls of the subdevice and to provide a module transition to the Remote control of the subdevice. For example, to control a media player, you can place a volume slider or Mute button for quick access to adjusting the volume. The weather widget can display the current weather, and the control panel will contain the weather forecast for all 5 days.<br />
The module does not make sense without widget, because it will not have a graphical representation in the i3 lite project.

Widget has a limited size
# Width '''640'''
# Height can not exceed '''1200'''

[[Файл:Пример виджета.png|center|thumb|Рис. Widget example]]

To create a widget, click the Add pop-up button in the Project overview panel and in the appeared menu select popup type: "Widget", set the name and properties:
[[Файл:ПанельПопап.png|thumb|center]]

Properties of a created widget can be changed with the help of '''Object Properties'''.<br />
Graphic items are assigned to channels like in popups:
[[Файл:Связывание_канала_команды_и_графического_элемента.png|center|thumb|Рис. Связывание канала команды и графического элемента]]
Widget will be displayed:
* In the room when a client uses the project
[[Файл:В_комнате_при_использовании_пользователем_проекта.png|center|thumb|]]
* In the module settings when it is added to the project:
[[Файл:И_в_настройках_модуля_при_добавлении_его_в_проект.png ‎|center|thumb|]]
====Remote and other graphic windows====

Remote (пульт управления) и прочие окна - это графическое пространство для управления SubDevice, в отличии от виджета они могут иметь произвольные размеры, позицию и отображается по вызову. Пульт отображается в момент, когда на виджете была нажата кнопка перехода к пульту.
На пульте управления размещаются элементы управления оборудованием (кнопки, списки, переключатели, уровни). Пультов управления может быть от 0 до нескольких. Пример пульта:<br />
[[Файл:Пульт_управления.png ‎|center|thumb|]]<br />

Окно создаётся аналогично виджету, с одним лишь отличием, что при нажатии "Add Popup Page" в параметре "Device Type" надо выбрать "Remote".
==Стандарт проектирования интерфейса==
Для удобства проектирования интерфейса был разработан стандарт, в котором следует разрабатывать графические окна в модуле, чтобы модули разных разработчиков выглядели единообразно в рамках одного проекта.
===Основные принципы===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:GeneralUI.png]]</div></div>
<div class="col-sm-12 col-md-6">
Виджет состоит из «Header» и дополнительных модулей основного функционала. <br/>
«Header» — верхний модуль виджета.<br/>
«Header» содержит:<br/>
- наименование виджета;
- наименование устройства, которым<br/>
управляет виджет;<br/>
- иконка категории устройства.<br/>
<br/>
Дополнительные модули содержат элементы управления устройством.
</div>
</div>
===Модульная сетка и блоки===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka1.png]]</div></div>
<div class="col-sm-12 col-md-6">
Модульная сетка виджета представляет собой блоки 640 pt в ширину
и 120 pt в высоту. Каждый блок имеет сетку 8х8 pt.
Скругления углов равно 12,5 ut. (Circle 25)
</div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka2.png]]</div></div>
<div class="col-sm-12 col-md-6">
Принцип построения блока виджета представляет собой конструктор из
элементов управления (кнопок, свитчей, лэйблов) от меньшего к большему.
</div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka3.png]]</div></div>
<div class="col-sm-12 col-md-6">
Элементы управления комбинируются и объединяются в блок,
а блоки объединяются в панель управления.
</div>
</div>
===Кнопки===
<big>'''Toggle'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Toggle.png]]</div></div>
<div class="col-sm-12 col-md-6">
Кнопка изменения значения «вкл/выкл». Применяется как в случаях с неизвестным состоянием работы устройства, так и для управления функционалом устройства.
</div>
</div>
<big>'''Switch'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Switch.png]]</div></div>
<div class="col-sm-12 col-md-6">
Кнопка изменения значения «вкл/выкл». Применяется только в случаях с известным состоянием работы устройства.
</div>
</div>
<big>'''Multistate'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Multistate.png]]</div></div>
<div class="col-sm-12 col-md-6">
Кнопка изменения значения предустановленного состояния устройства применяется только в случаях с известным cостоянием работы устройства.
</div>
</div>
===Кнопка-стрелка===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:arrow1.png]]</div></div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:arrow2.png]]</div></div>
</div>
'''Действие кнопки'''<br/>
При нажатии на кнопку происходит вызов «PopUp».<br/>
'''Содержимое «PopUp»'''<br/>
«Input field», «Single selection», «Multiple selection».
===Слайдеры===
<div class="row">
<div class="col-sm-12 col-md-6">
Standart
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:StandartSlider.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
Value
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ValueSlider.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
Progress
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ProgressSlider.png]]</div></div>
</div>
===Описание===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Description.png]]</div></div>
===Иконки===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Icons1.png]]</div></div>
Все иконки делятся по сферам применения, и их главное различие — размеры
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Icons2.png]]</div></div>
===Виджет «header»===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:WidgetHeader.png]]</div></div>
===Расположение кнопок===
<div class="row">
<div class="col-sm-12 col-md-6">
Форм фактор: 128х120 pt
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:FormFactor.png]]</div></div>
</div>
Все кнопки имеют два состояния — покой и активность.
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:OFFicon.png]]</div></div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ONicon.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
В состоянии покоя цвет кнопки всегда # 848484 или RGB 132
</div>
<div class="col-sm-12 col-md-6">
Активным состояние кнопки считается только тогда, когда действие получило обратную связь является кратковременным или мгновенным (например: «Play» в медиаплеере) или действие, которое находится в состоянии активности продолжительное время и требует дополнительного воздействия для отключения состояния активности
(например: «Repeat» в медиаплеере).
</div>
</div>
==Основы работы со скриптами==

После проектирования интерфейса и добавления драйвера, вам понадобится разработать логику работы модуля в скриптах. Скриптовая часть при разработке i3 lite модуля имеет некоторые особенности. Перед разработкой скриптовой части lite модуля рекомендуем ознакомиться с [http://dev.iridiummobile.net/JS_Guide iRidium Pro API] и [[Special:MyLanguage/Developers_API | i3 lite API]]. <br />

Модуль может содержать неограниченное количество скриптов.
Существуют разные типы скриптов для модуля:
* Driver - в скриптовых файлах данного типа должны содержаться скрипты, отвечающие за работу с драйвером
* GUI - В этих скриптовых файлах содержатся скрипты, отвечающие за работу с графикой
* Common - в данных скриптовых файлах должны содержаться скрипты общего характера, тут может быть набор дополнительных функций или описание классов второстепенного назначения
* Setup - это специальный скриптовой файл, в нем содержиться информация о настройке модуля. а именно - список полей, обязательных для заполнения, типы этих полей и функции проверки правильности введенных данных.

Разделение на типы необходимо для правильной обработки модуля на сервере. На сервере работает только логика и драверная часть модулей, но сервер ничего не знает о графической части. Поэтому разработчику модуля требуется разбивать скрипты по типам. Сервер игнорирует файлы для работы с графической частью. <br />

При разработке модуля следует использовать простраство имен module вместо IR. Таким образом слушатель будет иметь вид module.AddListener(… <br />

Каждый скриптовой файл должен начинаться со слушателя
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_MODULE_START, 0, function(){});
</syntaxhighlight>
Это новый вид события, предназначенный специально для разработки модуля. При разработке модуля следует учитывать что скриптовой файл стал закрыт для других скриптовых файлов. Это хзначить что теперь можно использовать одноименные переменные и названия функций в разных скриптовых файлах и они не будут перезаписываться, но это накладывает ограничение: нельзя получить доступ к функции из другого скриптового файла простым способом. Для получения доступа к функции из другого скриптового файла, следует импортировать скриптовый файл с помощью команды module.Import("FileName.js"). <br />
Пример:<br/>
<syntaxhighlight lang="javascript">
//Name_1.js - первый js файл
this.Text = "Hello, world!"; //Указатель на текстовую переменную
//Name_2.js - второй js файл
var Text = module.Import("Name_1.js").Text; //Импортируем из первого js файла объект с указателем на текстовую переменную
IR.Log(Text); //"Hello, world!" //выводим в лог переменную Text
</syntaxhighlight>
==Создание подустройств==
Основой любого модуля служат подустройства и задачей разработчика модуля является определить сколько подустройств будет в модуле и разработать логику работы подустройств. В состав каждого подустройства может входить виджет, пульт управления, собственный набор действий, событий и состояний. Все составляющие подустройства необходимо указать при его создании. Содержимое подустройства не может меняться в ходе работы модуля. Для создания подустройства используется команда:<br/>
<syntaxhighlight lang="javascript">
module.AddSubDevice(SystemName, [Device], [System], [Type], [Tags], [Name], [Callback]);
</syntaxhighlight>
,где<br/>
'''SystemName''' - системное имя подустройства<br/>
'''Device''' - драйвер, к которому будет привязано подустройство<br/>
'''System''' - устаревший параметр, следует использовать false<br/>
'''Type''' - тип smart устройства. Параметр в разработке<br/>
'''Tags''' - Массив объектов виртуальных тегов<br/>
'''Name''' - имя подустройства, которое отображается пользователю<br/>
'''Callback function(){do somethings}''' - функция, которая выполняется до наступления события IR.EVENT_ADD_SUBDEVICE<br/>
В ответ функция вернет ссылку на подустройство, по которой к нему можно обратиться.<br/>
Пример создания подустройств для HDL Relay устройств. Скрипт проверяет количество устройств в шине и в цикле создает подустройства<br/>
<syntaxhighlight lang="javascript">
for (var count = 1; count <= COUNT_CHANNEL; count++) {
// Создаем подустройство
l_oSubDevice = module.AddSubDevice("Relay " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_RELAY);
// Создаем команду StatusOnStart
if (count == 1)
l_oSubDevice.AddChannel("Relay:statusOnStart", [ChannelData]);
var l_sChannelName = "Relay:channel" + count;
// Добавляем каналы
l_oSubDevice.AddChannel(l_sChannelName, [ChannelData]);
l_oSubDevice.AddTag(l_sChannelName, [ChannelData]);
// Добавляем виртуальный тег
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_TAG_POWER, true);
};</syntaxhighlight><br/>
Таким способом можно добавить в подустройство все необходимые сущности. Также, при создании подустройства, активируется событие<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function, [pointer]);
</syntaxhighlight><br/>
В функцию передается ссылка на только что созданное подустройство. В данном событии можно добавлять к подустройству различные компоненты(действия, события, состояния, виджеты, каналы, теги). Например:<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function(in_oSubDevice){
Создаем действия
in_oSubDevice.AddAction("On", false, in_oSubDevice.SystemName + "_Power", lightID + "_1", IR.SUB_DEVICE_COMMAND_POWER_ON);
in_oSubDevice.AddAction("Off", false, in_oSubDevice.SystemName + "_Power", lightID + "_0", IR.SUB_DEVICE_COMMAND_POWER_OFF);
Создаем события
in_oSubDevice.AddEvent("On", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "1");
in_oSubDevice.AddEvent("Off", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "0");
Создаем состояния
in_oSubDevice.AddCondition("On", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "1");
in_oSubDevice.AddCondition("Off", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "0");
});</syntaxhighlight><br/>
Таким образом разработчик может создавать нужное количество подустройств при установке модуля или ручном добавлении новых подустройств
==Добавление виджетов к подустройству==

Полсе создания интерфейсов в редакторе и добавления функции добавления подустройств, вам потребуется создавать для каждого поустройства свой экземпляр виджета и привязывать его к подустройству. Для привязки виджета к подустройству используется метод<br/>
<syntaxhighlight lang="javascript">SubDevice.addWidget(in_Widget)</syntaxhighlight><br/>

Входным параметром метода является: '''in_Widget''' - объект - виджет, заранее созданный в редакторе.<br/>
Выходным параметром метода является: успешно или нет ('''True''', '''False''').<br/>
К примеру у нас 3 лампочки и для того, чтобы не создавать для каждой лампочки отдельный виджет, мы воспользуемся уже готовым примером нашего окна и просто будем клонировать его. Напишем пример создания виджета с помощью кода по уже существующему образцу.<br/>

Метод Clone позволяет клонировать уже существующее всплывающее окно.<br/>
<syntaxhighlight lang="javascript">Module.ClonePopup (in_Popup, in_Name)</syntaxhighlight><br/>
Входные параметры метода:
*'''in_Name''' - имя нового виджета.<br/>
*'''in_Popup''' - ссылка на всплывающее окно.<br/>
Выходным параметром метода является: успешно или нет ('''True''', '''False''').<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function(in_oSubDevice){
var popup = module.GetPopup("Dimmer"); // Обращаемся к виджету который собираемся скопировать
// Создаем виджет методом клонирования
var widget = in_oSubDevice.addWidget(module.ClonePopup(popup, "Dimmer"+ in_oSubDevice.Name));
});</syntaxhighlight><br/>
----
{{i}} Имена новых виджетов не должны повторяться.
----
При открытии полноценного пульта управления из виджета, необходимо помнить о том что пользователь будет запускать модуль как на планшета, так и на телефоне. Из-за разницы в величине экранов, разработчик модуля должен разработать 2 вида окон. Вид под телефонную версию модуля и вид под планшетную версию. При этом надо добавить в скрипт метод, который будет спрашивать у системы вид устройства, на котором запущен модуль, и открывать соответствующее окно
<syntaxhighlight lang="javascript">
if (IR.DisplayType == IR.DISPLAY_TYPE_PHONE) { //Если модуль открыт на телефоне
var l_oPopupScanner = module.GetPopup("Phone"); //Показываем попап, отрисованный для телефона
}
else {
var l_oPopupScanner = module.GetPopup("Tablet");//Если планшет, то открываем попап для планшета
}
</syntaxhighlight><br/>
==Работа с каналами и тегами==
После создания подустройства и добавления виджета, вам понадобится добавить к подустройству нужные для работы каналы и теги. Как и в версии i3 Pro, драйвер можно добавить в графическом интерфейсе редактора или в скрипте. Для каждого подустройства потребуется собственный набор каналов и тегов для выбранного драйвера. В ходе работы может потребоваться работать с тремя компонентами:<br/>
*Канал. Для создания канала следует использовать метод<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddChannel(Name, DataArray)
</syntaxhighlight>где,<br/>
'''Name''' - имя канала<br/>
'''DataArray''' - массив данных, специфичный для каждого драйвера<br/>
*Тег. Для создания тега следует использовать метод<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddTag(Name, DataArray)
</syntaxhighlight>где,<br/>
'''Name''' - имя тега<br/>
'''DataArray''' - массив данных, специфичный для каждого драйвера<br/>
*Виртуальный тег. Для создания виртуального следует использовать метод<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddVirtualTag(Name, Value, [Edit], [smartID], [Hidden])
</syntaxhighlight>где,<br/>
'''Name'''- имя виртуального тега подустройства<br/>
'''Value''' - Значение тега<br/>
'''Edit''' - Разрешение редактирования тега<br/>
'''smartID''' - Параметр в разработке! Необходимо устанавливать false<br/>
'''Hidden''' - Признак скрытости тега<br/>
===Пример создания каналов и тегов при создании подустройства:===
<syntaxhighlight lang="javascript">
l_oSubDevice = module.AddSubDevice("Light " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_DIMMER);

// Adding channel StatusOnStart
if (count == 1)
l_oSubDevice.AddChannel("Dimmer:statusOnStart", [ChannelData]);

// Assigned to the variable name of the channel
var l_sChannelName = "Dimmer:channel" + count;

// Adding channels
l_oSubDevice.AddChannel(l_sChannelName, [ChannelData]);
l_oSubDevice.AddTag(l_sChannelName, [TagData]);

// Adding smart virtual tag
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_COMMAND_POWER, true);
l_oSubDevice.AddVirtualTag("Power On", 0, false, IR.SUB_DEVICE_COMMAND_POWER_ON, true);
l_oSubDevice.AddVirtualTag("Power Off", 0, false, IR.SUB_DEVICE_COMMAND_POWER_OFF, true);
l_oSubDevice.AddVirtualTag("Level", 0, false, IR.SUB_DEVICE_COMMAND_LEVEL, true);
</syntaxhighlight>
==Установка модуля в приложение==
Модули хранятся в магазине модулей iRidium Store и могут устанавливаться в приложение двумя способами:<br/>
*С помощью сканера<br/>
*Вручную<br/>
===Разработка Setup===
Для любого варианта необходимо разрабатывать файл Setup. Это специальный скриптовой файл, в котором прописаны поля, необходимые для работы модуля. Такими полями могут выступать ip адрес устройства, порт, название города итд. Для разработки Setup необходимо создать новый скриптовый файл и задать его тип "Setup". Каждое поле является тегом и к нему можно получить доступ из скрипта и получить введенное значение
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:СетапБонго.png]]</div></div>
Файл Setup состоит из 2-ух частей. Первая часть это настройки драйверов. В этих настройках следует запрашивать ip адреса, порты и логины, для подключения драйвера у устройству. Вторая часть файла это общие настройки модуля, такие как количество выходов, ключи доступа.
Для установки поля в Setup необходимо настроить следующие поля в скрипте:
* Тип поля - надо указать какое поле надо показать пользователю(текстовое поле, массив значений итд. Подробнее описано в API)
* Имя поля - название поля, которое увидит пользователь при настройке модуля
* Значение по умолчанию - какое значение следует подставлять по умолчанию
* Функция проверки - функция валидации значения в поле. Здесь требуется написать функцию, которая будет проверять корректность введенных данных.
Например, скрипт "Setup" для модуля HDL выглядит следующим образом:
<syntaxhighlight lang="javascript">
{
// Data to connect drivers, created in Project Device Panel
Drivers:
[
{
Name: "HDL-BUS Pro Network (UDP)",
Properties:
[
{
Type: "textfield",
Name: "Host",
DefaultValue: "255.255.255.255",
Validation: function(in_sValue) {
var l_aValueHost = in_sValue.split(".");
if (l_aValueHost.length != 4) {
return "Please input correct Host";
} else
if (parseInt(l_aValueHost[0], 10)>=0
&& parseInt(l_aValueHost[0], 10)<=255
&& parseInt(l_aValueHost[1], 10)>=0
&& parseInt(l_aValueHost[1], 10)<=255
&& parseInt(l_aValueHost[2], 10)>=0
&& parseInt(l_aValueHost[2], 10)<=255
&& parseInt(l_aValueHost[3], 10)>=0
&& parseInt(l_aValueHost[3], 10)<=255
)
return 0
else
return "Please input correct Host";
}
},
{
Type: "textfield",
Name: "Port",
DefaultValue: "6000",
Validation: function(in_sValue) {
if(parseInt(in_sValue, 10)>=0)
return 0
else
return "Please input correct Port";
}
}
]
}
],

// General information for the module (driver and generated by script)
Module: [{
Name: "Channels Count",
Validation: function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input Count";
}
},
{
Type: "textfield",
Name : "SubnetID",
Validation : function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input SubnetID";
}
},
{
Type: "textfield",
Name : "DeviceID",
Validation : function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input DeviceID";
}
}

]
}
</syntaxhighlight>
Для получения данных из полей Setup следует использовать функцию
<syntaxhighlight lang="javascript">
module.GetProperty("Имя поля")
</syntaxhighlight>
<br />
Помимо стандартных параметров, можно запрашивать любые, необходимые для инициализации модуля, параметры. Параметры драйвера подставляются в драйвер автоматически. Остальные параметры следует запрашивать и использовать вручную<br />
Пример работы с параметрами Setup
<syntaxhighlight lang="javascript">
var COUNT_CHANNEL = parseInt(module.GetProperty("Channel count")); // Getting count channel
var SubNetID = parseInt(module.GetProperty("SubnetID")); // Getting subnet id
var DeviceID = parseInt(module.GetProperty("DeviceID")); // Getting device id
</syntaxhighlight>
===Установка модуля вручную===
===Установка модуля с помощью сканера===
===Ручное добавление подустройств===
===Авторизация===
===Смена настроек===
===Удаление модуля===

Translations:DevManual/69/en

2017-04-03T10:09:38Z

Ildar: Новая страница: «Remote and other graphic windows»

Remote and other graphic windows

DevManual/en

2017-04-03T10:08:39Z

Ildar: Новая страница: «In the module settings when it is added to the project:»

<languages/>
=Module development guide=
==Definitions==

'''Module''' - is a component that allows you to control one type of equipment by its unique ID. The module is located in the store of modules.

'''Control panel (mobile device)''' - is a device from which the project i3 lite is launched (tablet, smartphone).

'''Store of modules''' - is a cloud server for uploading ready-made modules. The module store is available from the i3 lite application or on our[http://www.iridiummobile.ru/store/ site]

'''iRidium Studio''' - is a editor that allows to create the module to control device for i3 lite application. You need to use a special editor build for [http://www.iridiummobile.net/redirects/?go=iRidium_SETUP_LITE module developers] to develop the module

'''i3 lite''' - is an application to create, set and use i3 lite projects.

'''i3 lite project''' – is an automation project made up of ready equipment control modules. i3 lite projects differ from i2 Control projects: i3 lite projects can be edited dynamically without prior editing in iRidium Studio. i3 lite project consists of several small parts that can be put together into a single whole in i3 lite app with the help of the built-in constructor. It can also be easily edited in the app. As a result, a big number of intermediate processes are no longer necessary, such as installing software on PC, uploading projects on contol panels. All is done in one place - a control panel.

'''SubDevice''' - This is a virtual representation of the working area of the physical device. If we take as an example a 6-channel dimmer it has 6 sub-devices, because each independent device requires a separate control interface and connects to one channel.

'''Room (in i3 lite)''' - The visual part of i3 lite containing hardware management widgets. The project in i3 lite consists of rooms located on the floors

'''Widget''' - is a visual module component located in the room. It has limitations in size and fixed position in the room interface. It contains the main module functionality. For additional functions Remote is used.

'''Remote''' - is a visual module component which is hidden by default. It opens only when clicking on the corresponding item of the widget. It does not have size limitations (not more than the panel display size) and can be located in any part of the room interface (it is usually located in the middle of the panel display). It contains additional functionality of the module.

'''Macros''' - is a sequence of commands of various modules, which is activated by pressing. Contains "Action" and "Condition". For example, the macros "turn off all the lights in the house" will send the shutdown command to all devices responsible for lighting.

'''Routine''' - is a sequence of commands of various modules, which is activated automatically when a certain event occurs. Contains "Event", "Action" and "Condition". For example, "turn on the light if the motion sensor is triggered"

'''Event''' - is a routine component that describes the control command and the value range. If the value is sent in the indicated range, the routine is executed. For example, the event "Motion appeared" is activated if the motion sensor is triggered.

'''Action''' - is a component of macros and routines. It describes the control command and value that must be sent to the command. For example, "turn on the light". There are 2 types of Action: Simple Action and Advanced Action.

'''Simple Action''' - Simple Action is used when the command and Action value are known in advance.

'''Advanced Action''' - Advanced Action is used when the command is known but the value is unknown. The value is set dynamically when Action is used in i3 lite (but not when creating in iRidium studio).

'''Condition''' - is a component of macros and scenes. It describes the control command and value range. When a value from the value range is sent Action is executed.

'''Scanner''' - is a software part, that analyzes any bus looking for connected devices. Found connected devices are displayed in a list. Modules for the found devices are downloaded from iRidium store and the devices become available to control in i3 lite.
==Module concept==
The module is an independent subroutine of the i3 lite application which is built in the project and has an independent interface, driver and logic. Modules are developed in the [http://www.iridiummobile.net/redirects/?go=iRidium_SETUP_LITE iRidium Studio] editor and located in the module store [http://www.iridiummobile.ru/store/ iRidium Store]. Integrator downloads the module from the module store for each individual project.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ModuleInScheme.png]]</div></div>
</div>

There are two types of modules:
*Control module - module for hardware control
*Scanner - module for searching hardware in the local network and loading modules for found devices
== How to start developing the module ==
----

{{i}} Before starting your work, it is recommended to read [http://dev.iridiummobile.net/How_to_begin iRidium documentation]. It describes the basics of working with iRidium. The i3 lite documentation describes how to develop modules for the i3 lite platform for users, who already know iRidium. If you want to write script use [[Special:MyLanguage/Developers_API | i3 lite API]].
----

The module life cycle consists of:
* Developing the graphic part in iRidium studio
* Developing the driver part (scripts, devices)
* Testing
* Publishing in iRidium store
* Using (module download via the i3 lite application from the cloud and adding to automation projects)
<br/>
==Module structure ==
Each module must consist of subdevices. The subdevice is a virtual representation of the working area of a physical device. Many devices support multiple workgroups with the same functionality. Each workgroup may be in a separate zone. To fully control the zone, you need to create a subdevice for each workgroup of the device. For example, a 6-channel HDL dimmer contains 6 dimmable channels, through which 6 working groups can be controlled. Therefore, it is advisable to select in the module 6 subdevices for the possibility of creating actions, events and conditions for each workgroup separately. The presence of subdevice in the i3 lite module is obligatory. The number of sub-devices can be from one to many. Usually the number of subdevice is equal to the number of channels of the controller, the number of its work areas or logical devices.

Subdevice consists of:
* Conditions
* Actions
* Events
* Widgets

Conditions, actions and events are logical elements of the subdevice, on their basis macros and routines are created. Widget is a graphical element, through which the user will control subdevice. Usually one subdevice contains one widget, but the number of conditions, actions and events varies (from zero to many). The number of subdevices in the module can be either fixed or not. For example, you can develop a module only for a 6-channel dimmer, and you can make a module that will request the hardware for the number of subdevices and create the required number of subdevices.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ModuleStruct.png]]</div></div>
</div>
==Creating the module interface ==
The interface part of the midule consists of:
* widgets - interface part of the subdevice, which is located in the rooms and has basic control functions
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:WidgetExample.png]]</div></div>
</div>
* Remote - interface part of the module, which has a set of device functions and opens to the full screen, when you click on the widget button
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:RemoteExample.png]]</div></div>
</div>
* Authorization window - Authorization is required to work with some devices. To do this, the developer can create a special authorization window that is available in the module settings
картинка кнопки авторизации и окна авторизации
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:AutorisationExample.png]]</div></div>
</div>
* The module settings window is a window where you need to enter the parameters for the module operation
картинка окна настроек модуля и кнопки открытия
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:SettingsExample.png]]</div></div>
</div>
The whole graphic part is drawn in the graphical interface of the iRidium studio editor. In contradistinction to i3 pro, the module's interface should be made up of ready-made graphic components located in the gallery.
<div class="row">
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:ItemGallery.png]]</div></div>
</div>

==== Widget ====

Widget is a visual component of the module, a kind of Popup that will be displayed in the room. The main task of the widget is to display the basic controls of the subdevice and to provide a module transition to the Remote control of the subdevice. For example, to control a media player, you can place a volume slider or Mute button for quick access to adjusting the volume. The weather widget can display the current weather, and the control panel will contain the weather forecast for all 5 days.<br />
The module does not make sense without widget, because it will not have a graphical representation in the i3 lite project.

Widget has a limited size
# Width '''640'''
# Height can not exceed '''1200'''

[[Файл:Пример виджета.png|center|thumb|Рис. Widget example]]

To create a widget, click the Add pop-up button in the Project overview panel and in the appeared menu select popup type: "Widget", set the name and properties:
[[Файл:ПанельПопап.png|thumb|center]]

Properties of a created widget can be changed with the help of '''Object Properties'''.<br />
Graphic items are assigned to channels like in popups:
[[Файл:Связывание_канала_команды_и_графического_элемента.png|center|thumb|Рис. Связывание канала команды и графического элемента]]
Widget will be displayed:
* In the room when a client uses the project
[[Файл:В_комнате_при_использовании_пользователем_проекта.png|center|thumb|]]
* In the module settings when it is added to the project:
[[Файл:И_в_настройках_модуля_при_добавлении_его_в_проект.png ‎|center|thumb|]]
====Remote и прочие графические окна====

Remote (пульт управления) и прочие окна - это графическое пространство для управления SubDevice, в отличии от виджета они могут иметь произвольные размеры, позицию и отображается по вызову. Пульт отображается в момент, когда на виджете была нажата кнопка перехода к пульту.
На пульте управления размещаются элементы управления оборудованием (кнопки, списки, переключатели, уровни). Пультов управления может быть от 0 до нескольких. Пример пульта:<br />
[[Файл:Пульт_управления.png ‎|center|thumb|]]<br />

Окно создаётся аналогично виджету, с одним лишь отличием, что при нажатии "Add Popup Page" в параметре "Device Type" надо выбрать "Remote".
==Стандарт проектирования интерфейса==
Для удобства проектирования интерфейса был разработан стандарт, в котором следует разрабатывать графические окна в модуле, чтобы модули разных разработчиков выглядели единообразно в рамках одного проекта.
===Основные принципы===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:GeneralUI.png]]</div></div>
<div class="col-sm-12 col-md-6">
Виджет состоит из «Header» и дополнительных модулей основного функционала. <br/>
«Header» — верхний модуль виджета.<br/>
«Header» содержит:<br/>
- наименование виджета;
- наименование устройства, которым<br/>
управляет виджет;<br/>
- иконка категории устройства.<br/>
<br/>
Дополнительные модули содержат элементы управления устройством.
</div>
</div>
===Модульная сетка и блоки===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka1.png]]</div></div>
<div class="col-sm-12 col-md-6">
Модульная сетка виджета представляет собой блоки 640 pt в ширину
и 120 pt в высоту. Каждый блок имеет сетку 8х8 pt.
Скругления углов равно 12,5 ut. (Circle 25)
</div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka2.png]]</div></div>
<div class="col-sm-12 col-md-6">
Принцип построения блока виджета представляет собой конструктор из
элементов управления (кнопок, свитчей, лэйблов) от меньшего к большему.
</div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Setka3.png]]</div></div>
<div class="col-sm-12 col-md-6">
Элементы управления комбинируются и объединяются в блок,
а блоки объединяются в панель управления.
</div>
</div>
===Кнопки===
<big>'''Toggle'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Toggle.png]]</div></div>
<div class="col-sm-12 col-md-6">
Кнопка изменения значения «вкл/выкл». Применяется как в случаях с неизвестным состоянием работы устройства, так и для управления функционалом устройства.
</div>
</div>
<big>'''Switch'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Switch.png]]</div></div>
<div class="col-sm-12 col-md-6">
Кнопка изменения значения «вкл/выкл». Применяется только в случаях с известным состоянием работы устройства.
</div>
</div>
<big>'''Multistate'''</big><br/>
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:Multistate.png]]</div></div>
<div class="col-sm-12 col-md-6">
Кнопка изменения значения предустановленного состояния устройства применяется только в случаях с известным cостоянием работы устройства.
</div>
</div>
===Кнопка-стрелка===
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:arrow1.png]]</div></div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:arrow2.png]]</div></div>
</div>
'''Действие кнопки'''<br/>
При нажатии на кнопку происходит вызов «PopUp».<br/>
'''Содержимое «PopUp»'''<br/>
«Input field», «Single selection», «Multiple selection».
===Слайдеры===
<div class="row">
<div class="col-sm-12 col-md-6">
Standart
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:StandartSlider.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
Value
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ValueSlider.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
Progress
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ProgressSlider.png]]</div></div>
</div>
===Описание===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Description.png]]</div></div>
===Иконки===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Icons1.png]]</div></div>
Все иконки делятся по сферам применения, и их главное различие — размеры
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:Icons2.png]]</div></div>
===Виджет «header»===
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:WidgetHeader.png]]</div></div>
===Расположение кнопок===
<div class="row">
<div class="col-sm-12 col-md-6">
Форм фактор: 128х120 pt
</div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:FormFactor.png]]</div></div>
</div>
Все кнопки имеют два состояния — покой и активность.
<div class="row">
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:OFFicon.png]]</div></div>
<div class="col-sm-12 col-md-6"><div class="thumbnail">[[File:ONicon.png]]</div></div>
</div>
<div class="row">
<div class="col-sm-12 col-md-6">
В состоянии покоя цвет кнопки всегда # 848484 или RGB 132
</div>
<div class="col-sm-12 col-md-6">
Активным состояние кнопки считается только тогда, когда действие получило обратную связь является кратковременным или мгновенным (например: «Play» в медиаплеере) или действие, которое находится в состоянии активности продолжительное время и требует дополнительного воздействия для отключения состояния активности
(например: «Repeat» в медиаплеере).
</div>
</div>
==Основы работы со скриптами==

После проектирования интерфейса и добавления драйвера, вам понадобится разработать логику работы модуля в скриптах. Скриптовая часть при разработке i3 lite модуля имеет некоторые особенности. Перед разработкой скриптовой части lite модуля рекомендуем ознакомиться с [http://dev.iridiummobile.net/JS_Guide iRidium Pro API] и [[Special:MyLanguage/Developers_API | i3 lite API]]. <br />

Модуль может содержать неограниченное количество скриптов.
Существуют разные типы скриптов для модуля:
* Driver - в скриптовых файлах данного типа должны содержаться скрипты, отвечающие за работу с драйвером
* GUI - В этих скриптовых файлах содержатся скрипты, отвечающие за работу с графикой
* Common - в данных скриптовых файлах должны содержаться скрипты общего характера, тут может быть набор дополнительных функций или описание классов второстепенного назначения
* Setup - это специальный скриптовой файл, в нем содержиться информация о настройке модуля. а именно - список полей, обязательных для заполнения, типы этих полей и функции проверки правильности введенных данных.

Разделение на типы необходимо для правильной обработки модуля на сервере. На сервере работает только логика и драверная часть модулей, но сервер ничего не знает о графической части. Поэтому разработчику модуля требуется разбивать скрипты по типам. Сервер игнорирует файлы для работы с графической частью. <br />

При разработке модуля следует использовать простраство имен module вместо IR. Таким образом слушатель будет иметь вид module.AddListener(… <br />

Каждый скриптовой файл должен начинаться со слушателя
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_MODULE_START, 0, function(){});
</syntaxhighlight>
Это новый вид события, предназначенный специально для разработки модуля. При разработке модуля следует учитывать что скриптовой файл стал закрыт для других скриптовых файлов. Это хзначить что теперь можно использовать одноименные переменные и названия функций в разных скриптовых файлах и они не будут перезаписываться, но это накладывает ограничение: нельзя получить доступ к функции из другого скриптового файла простым способом. Для получения доступа к функции из другого скриптового файла, следует импортировать скриптовый файл с помощью команды module.Import("FileName.js"). <br />
Пример:<br/>
<syntaxhighlight lang="javascript">
//Name_1.js - первый js файл
this.Text = "Hello, world!"; //Указатель на текстовую переменную
//Name_2.js - второй js файл
var Text = module.Import("Name_1.js").Text; //Импортируем из первого js файла объект с указателем на текстовую переменную
IR.Log(Text); //"Hello, world!" //выводим в лог переменную Text
</syntaxhighlight>
==Создание подустройств==
Основой любого модуля служат подустройства и задачей разработчика модуля является определить сколько подустройств будет в модуле и разработать логику работы подустройств. В состав каждого подустройства может входить виджет, пульт управления, собственный набор действий, событий и состояний. Все составляющие подустройства необходимо указать при его создании. Содержимое подустройства не может меняться в ходе работы модуля. Для создания подустройства используется команда:<br/>
<syntaxhighlight lang="javascript">
module.AddSubDevice(SystemName, [Device], [System], [Type], [Tags], [Name], [Callback]);
</syntaxhighlight>
,где<br/>
'''SystemName''' - системное имя подустройства<br/>
'''Device''' - драйвер, к которому будет привязано подустройство<br/>
'''System''' - устаревший параметр, следует использовать false<br/>
'''Type''' - тип smart устройства. Параметр в разработке<br/>
'''Tags''' - Массив объектов виртуальных тегов<br/>
'''Name''' - имя подустройства, которое отображается пользователю<br/>
'''Callback function(){do somethings}''' - функция, которая выполняется до наступления события IR.EVENT_ADD_SUBDEVICE<br/>
В ответ функция вернет ссылку на подустройство, по которой к нему можно обратиться.<br/>
Пример создания подустройств для HDL Relay устройств. Скрипт проверяет количество устройств в шине и в цикле создает подустройства<br/>
<syntaxhighlight lang="javascript">
for (var count = 1; count <= COUNT_CHANNEL; count++) {
// Создаем подустройство
l_oSubDevice = module.AddSubDevice("Relay " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_RELAY);
// Создаем команду StatusOnStart
if (count == 1)
l_oSubDevice.AddChannel("Relay:statusOnStart", [ChannelData]);
var l_sChannelName = "Relay:channel" + count;
// Добавляем каналы
l_oSubDevice.AddChannel(l_sChannelName, [ChannelData]);
l_oSubDevice.AddTag(l_sChannelName, [ChannelData]);
// Добавляем виртуальный тег
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_TAG_POWER, true);
};</syntaxhighlight><br/>
Таким способом можно добавить в подустройство все необходимые сущности. Также, при создании подустройства, активируется событие<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function, [pointer]);
</syntaxhighlight><br/>
В функцию передается ссылка на только что созданное подустройство. В данном событии можно добавлять к подустройству различные компоненты(действия, события, состояния, виджеты, каналы, теги). Например:<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function(in_oSubDevice){
Создаем действия
in_oSubDevice.AddAction("On", false, in_oSubDevice.SystemName + "_Power", lightID + "_1", IR.SUB_DEVICE_COMMAND_POWER_ON);
in_oSubDevice.AddAction("Off", false, in_oSubDevice.SystemName + "_Power", lightID + "_0", IR.SUB_DEVICE_COMMAND_POWER_OFF);
Создаем события
in_oSubDevice.AddEvent("On", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "1");
in_oSubDevice.AddEvent("Off", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "0");
Создаем состояния
in_oSubDevice.AddCondition("On", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "1");
in_oSubDevice.AddCondition("Off", "Drivers.PhilipsHue." + in_oSubDevice.SystemName + "_Power", false, "==", "0");
});</syntaxhighlight><br/>
Таким образом разработчик может создавать нужное количество подустройств при установке модуля или ручном добавлении новых подустройств
==Добавление виджетов к подустройству==

Полсе создания интерфейсов в редакторе и добавления функции добавления подустройств, вам потребуется создавать для каждого поустройства свой экземпляр виджета и привязывать его к подустройству. Для привязки виджета к подустройству используется метод<br/>
<syntaxhighlight lang="javascript">SubDevice.addWidget(in_Widget)</syntaxhighlight><br/>

Входным параметром метода является: '''in_Widget''' - объект - виджет, заранее созданный в редакторе.<br/>
Выходным параметром метода является: успешно или нет ('''True''', '''False''').<br/>
К примеру у нас 3 лампочки и для того, чтобы не создавать для каждой лампочки отдельный виджет, мы воспользуемся уже готовым примером нашего окна и просто будем клонировать его. Напишем пример создания виджета с помощью кода по уже существующему образцу.<br/>

Метод Clone позволяет клонировать уже существующее всплывающее окно.<br/>
<syntaxhighlight lang="javascript">Module.ClonePopup (in_Popup, in_Name)</syntaxhighlight><br/>
Входные параметры метода:
*'''in_Name''' - имя нового виджета.<br/>
*'''in_Popup''' - ссылка на всплывающее окно.<br/>
Выходным параметром метода является: успешно или нет ('''True''', '''False''').<br/>
<syntaxhighlight lang="javascript">
module.AddListener(IR.EVENT_ADD_SUBDEVICE, 0, function(in_oSubDevice){
var popup = module.GetPopup("Dimmer"); // Обращаемся к виджету который собираемся скопировать
// Создаем виджет методом клонирования
var widget = in_oSubDevice.addWidget(module.ClonePopup(popup, "Dimmer"+ in_oSubDevice.Name));
});</syntaxhighlight><br/>
----
{{i}} Имена новых виджетов не должны повторяться.
----
При открытии полноценного пульта управления из виджета, необходимо помнить о том что пользователь будет запускать модуль как на планшета, так и на телефоне. Из-за разницы в величине экранов, разработчик модуля должен разработать 2 вида окон. Вид под телефонную версию модуля и вид под планшетную версию. При этом надо добавить в скрипт метод, который будет спрашивать у системы вид устройства, на котором запущен модуль, и открывать соответствующее окно
<syntaxhighlight lang="javascript">
if (IR.DisplayType == IR.DISPLAY_TYPE_PHONE) { //Если модуль открыт на телефоне
var l_oPopupScanner = module.GetPopup("Phone"); //Показываем попап, отрисованный для телефона
}
else {
var l_oPopupScanner = module.GetPopup("Tablet");//Если планшет, то открываем попап для планшета
}
</syntaxhighlight><br/>
==Работа с каналами и тегами==
После создания подустройства и добавления виджета, вам понадобится добавить к подустройству нужные для работы каналы и теги. Как и в версии i3 Pro, драйвер можно добавить в графическом интерфейсе редактора или в скрипте. Для каждого подустройства потребуется собственный набор каналов и тегов для выбранного драйвера. В ходе работы может потребоваться работать с тремя компонентами:<br/>
*Канал. Для создания канала следует использовать метод<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddChannel(Name, DataArray)
</syntaxhighlight>где,<br/>
'''Name''' - имя канала<br/>
'''DataArray''' - массив данных, специфичный для каждого драйвера<br/>
*Тег. Для создания тега следует использовать метод<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddTag(Name, DataArray)
</syntaxhighlight>где,<br/>
'''Name''' - имя тега<br/>
'''DataArray''' - массив данных, специфичный для каждого драйвера<br/>
*Виртуальный тег. Для создания виртуального следует использовать метод<br/>
<syntaxhighlight lang="javascript">
SubDevice.AddVirtualTag(Name, Value, [Edit], [smartID], [Hidden])
</syntaxhighlight>где,<br/>
'''Name'''- имя виртуального тега подустройства<br/>
'''Value''' - Значение тега<br/>
'''Edit''' - Разрешение редактирования тега<br/>
'''smartID''' - Параметр в разработке! Необходимо устанавливать false<br/>
'''Hidden''' - Признак скрытости тега<br/>
===Пример создания каналов и тегов при создании подустройства:===
<syntaxhighlight lang="javascript">
l_oSubDevice = module.AddSubDevice("Light " + count, HDL_SERVER, false, IR.SUB_DEVICE_TYPE_THROUGH_DIMMER);

// Adding channel StatusOnStart
if (count == 1)
l_oSubDevice.AddChannel("Dimmer:statusOnStart", [ChannelData]);

// Assigned to the variable name of the channel
var l_sChannelName = "Dimmer:channel" + count;

// Adding channels
l_oSubDevice.AddChannel(l_sChannelName, [ChannelData]);
l_oSubDevice.AddTag(l_sChannelName, [TagData]);

// Adding smart virtual tag
l_oSubDevice.AddVirtualTag("Power", 0, false, IR.SUB_DEVICE_COMMAND_POWER, true);
l_oSubDevice.AddVirtualTag("Power On", 0, false, IR.SUB_DEVICE_COMMAND_POWER_ON, true);
l_oSubDevice.AddVirtualTag("Power Off", 0, false, IR.SUB_DEVICE_COMMAND_POWER_OFF, true);
l_oSubDevice.AddVirtualTag("Level", 0, false, IR.SUB_DEVICE_COMMAND_LEVEL, true);
</syntaxhighlight>
==Установка модуля в приложение==
Модули хранятся в магазине модулей iRidium Store и могут устанавливаться в приложение двумя способами:<br/>
*С помощью сканера<br/>
*Вручную<br/>
===Разработка Setup===
Для любого варианта необходимо разрабатывать файл Setup. Это специальный скриптовой файл, в котором прописаны поля, необходимые для работы модуля. Такими полями могут выступать ip адрес устройства, порт, название города итд. Для разработки Setup необходимо создать новый скриптовый файл и задать его тип "Setup". Каждое поле является тегом и к нему можно получить доступ из скрипта и получить введенное значение
<div class="col-sm-12 col-md-12"><div class="thumbnail">[[File:СетапБонго.png]]</div></div>
Файл Setup состоит из 2-ух частей. Первая часть это настройки драйверов. В этих настройках следует запрашивать ip адреса, порты и логины, для подключения драйвера у устройству. Вторая часть файла это общие настройки модуля, такие как количество выходов, ключи доступа.
Для установки поля в Setup необходимо настроить следующие поля в скрипте:
* Тип поля - надо указать какое поле надо показать пользователю(текстовое поле, массив значений итд. Подробнее описано в API)
* Имя поля - название поля, которое увидит пользователь при настройке модуля
* Значение по умолчанию - какое значение следует подставлять по умолчанию
* Функция проверки - функция валидации значения в поле. Здесь требуется написать функцию, которая будет проверять корректность введенных данных.
Например, скрипт "Setup" для модуля HDL выглядит следующим образом:
<syntaxhighlight lang="javascript">
{
// Data to connect drivers, created in Project Device Panel
Drivers:
[
{
Name: "HDL-BUS Pro Network (UDP)",
Properties:
[
{
Type: "textfield",
Name: "Host",
DefaultValue: "255.255.255.255",
Validation: function(in_sValue) {
var l_aValueHost = in_sValue.split(".");
if (l_aValueHost.length != 4) {
return "Please input correct Host";
} else
if (parseInt(l_aValueHost[0], 10)>=0
&& parseInt(l_aValueHost[0], 10)<=255
&& parseInt(l_aValueHost[1], 10)>=0
&& parseInt(l_aValueHost[1], 10)<=255
&& parseInt(l_aValueHost[2], 10)>=0
&& parseInt(l_aValueHost[2], 10)<=255
&& parseInt(l_aValueHost[3], 10)>=0
&& parseInt(l_aValueHost[3], 10)<=255
)
return 0
else
return "Please input correct Host";
}
},
{
Type: "textfield",
Name: "Port",
DefaultValue: "6000",
Validation: function(in_sValue) {
if(parseInt(in_sValue, 10)>=0)
return 0
else
return "Please input correct Port";
}
}
]
}
],

// General information for the module (driver and generated by script)
Module: [{
Name: "Channels Count",
Validation: function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input Count";
}
},
{
Type: "textfield",
Name : "SubnetID",
Validation : function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input SubnetID";
}
},
{
Type: "textfield",
Name : "DeviceID",
Validation : function (in_sValue) {
if (parseInt(in_sValue, 10)>=0)
return 0;
else
return "Please input DeviceID";
}
}

]
}
</syntaxhighlight>
Для получения данных из полей Setup следует использовать функцию
<syntaxhighlight lang="javascript">
module.GetProperty("Имя поля")
</syntaxhighlight>
<br />
Помимо стандартных параметров, можно запрашивать любые, необходимые для инициализации модуля, параметры. Параметры драйвера подставляются в драйвер автоматически. Остальные параметры следует запрашивать и использовать вручную<br />
Пример работы с параметрами Setup
<syntaxhighlight lang="javascript">
var COUNT_CHANNEL = parseInt(module.GetProperty("Channel count")); // Getting count channel
var SubNetID = parseInt(module.GetProperty("SubnetID")); // Getting subnet id
var DeviceID = parseInt(module.GetProperty("DeviceID")); // Getting device id
</syntaxhighlight>
===Установка модуля вручную===
===Установка модуля с помощью сканера===
===Ручное добавление подустройств===
===Авторизация===
===Смена настроек===
===Удаление модуля===