1<script type="text/x-jquery-tmpl" id="custom_intervals_row">
2	<tr class="form_row">
3		<td>
4			<ul class="<?= CRadioButtonList::ZBX_STYLE_CLASS ?>" id="delay_flex_#{rowNum}_type">
5				<li>
6					<input type="radio" id="delay_flex_#{rowNum}_type_0" name="delay_flex[#{rowNum}][type]" value="0" checked="checked">
7					<label for="delay_flex_#{rowNum}_type_0"><?= _('Flexible') ?></label>
8				</li><li>
9					<input type="radio" id="delay_flex_#{rowNum}_type_1" name="delay_flex[#{rowNum}][type]" value="1">
10					<label for="delay_flex_#{rowNum}_type_1"><?= _('Scheduling') ?></label>
11				</li>
12			</ul>
13		</td>
14		<td>
15			<input type="text" id="delay_flex_#{rowNum}_delay" name="delay_flex[#{rowNum}][delay]" maxlength="255" placeholder="<?= ZBX_ITEM_FLEXIBLE_DELAY_DEFAULT ?>">
16			<input type="text" id="delay_flex_#{rowNum}_schedule" name="delay_flex[#{rowNum}][schedule]" maxlength="255" placeholder="<?= ZBX_ITEM_SCHEDULING_DEFAULT ?>" style="display: none;">
17		</td>
18		<td>
19			<input type="text" id="delay_flex_#{rowNum}_period" name="delay_flex[#{rowNum}][period]" maxlength="255" placeholder="<?= ZBX_DEFAULT_INTERVAL ?>">
20		</td>
21		<td>
22			<button type="button" id="delay_flex_#{rowNum}_remove" name="delay_flex[#{rowNum}][remove]" class="<?= ZBX_STYLE_BTN_LINK ?> element-table-remove"><?= _('Remove') ?></button>
23		</td>
24	</tr>
25</script>
26<script type="text/x-jquery-tmpl" id="preprocessing_steps_row">
27	<?php
28		$preproc_types_cbbox = new CComboBox('preprocessing[#{rowNum}][type]', '');
29
30		foreach (get_preprocessing_types() as $group) {
31			$cb_group = new COptGroup($group['label']);
32
33			foreach ($group['types'] as $type => $label) {
34				$cb_group->addItem(new CComboItem($type, $label));
35			}
36
37			$preproc_types_cbbox->addItem($cb_group);
38		}
39
40		echo (new CRow([
41			(new CCol(
42				(new CDiv())->addClass(ZBX_STYLE_DRAG_ICON)
43			))->addClass(ZBX_STYLE_TD_DRAG_ICON),
44			$preproc_types_cbbox,
45			(new CTextBox('preprocessing[#{rowNum}][params][0]', ''))->setAttribute('placeholder', _('number')),
46			(new CTextBox('preprocessing[#{rowNum}][params][1]', ''))->setAttribute('placeholder', _('output')),
47			(new CButton('preprocessing[#{rowNum}][remove]', _('Remove')))
48				->addClass(ZBX_STYLE_BTN_LINK)
49				->addClass('element-table-remove')
50		]))
51			->addClass('sortable')
52			->toString()
53	?>
54	</script>
55<script type="text/javascript">
56	jQuery(function($) {
57		$('#visible_type, #visible_interface').click(function() {
58			// if no item type is selected, reset the interfaces to default
59			if (!$('#visible_type').is(':checked')) {
60				var itemInterfaceTypes = <?php echo CJs::encodeJson(itemTypeInterface()); ?>;
61				organizeInterfaces(itemInterfaceTypes[<?php echo CJs::encodeJson($data['initial_item_type']) ?>]);
62			}
63			else {
64				$('#type').trigger('change');
65			}
66		});
67
68		$('#type')
69			.change(function() {
70				// update the interface select with each item type change
71				var itemInterfaceTypes = <?php echo CJs::encodeJson(itemTypeInterface()); ?>;
72				organizeInterfaces(itemInterfaceTypes[parseInt(jQuery(this).val())]);
73			})
74			.trigger('change');
75
76		$('#history_mode')
77			.change(function() {
78				if ($('[name="history_mode"][value=' + <?= ITEM_STORAGE_OFF ?> + ']').is(':checked')) {
79					$('#history').prop('disabled', true).hide();
80				}
81				else {
82					$('#history').prop('disabled', false).show();
83				}
84			})
85			.trigger('change');
86
87		$('#trends_mode')
88			.change(function() {
89				if ($('[name="trends_mode"][value=' + <?= ITEM_STORAGE_OFF ?> + ']').is(':checked')) {
90					$('#trends').prop('disabled', true).hide();
91				}
92				else {
93					$('#trends').prop('disabled', false).show();
94				}
95			})
96			.trigger('change');
97
98		$('#custom_intervals').on('click', 'input[type="radio"]', function() {
99			var rowNum = $(this).attr('id').split('_')[2];
100
101			if ($(this).val() == <?= ITEM_DELAY_FLEXIBLE; ?>) {
102				$('#delay_flex_' + rowNum + '_schedule').hide();
103				$('#delay_flex_' + rowNum + '_delay').show();
104				$('#delay_flex_' + rowNum + '_period').show();
105			}
106			else {
107				$('#delay_flex_' + rowNum + '_delay').hide();
108				$('#delay_flex_' + rowNum + '_period').hide();
109				$('#delay_flex_' + rowNum + '_schedule').show();
110			}
111		});
112
113		$('#custom_intervals').dynamicRows({
114			template: '#custom_intervals_row'
115		});
116
117		var preproc_row_tpl = new Template($('#preprocessing_steps_row').html()),
118			preprocessing = $('#preprocessing');
119
120		preprocessing.sortable({
121			disabled: (preprocessing.find('tr.sortable') < 2),
122			items: 'tr.sortable',
123			axis: 'y',
124			containment: 'parent',
125			cursor: IE ? 'move' : 'grabbing',
126			handle: 'div.<?= ZBX_STYLE_DRAG_ICON ?>',
127			tolerance: 'pointer',
128			opacity: 0.6,
129			helper: function(e, ui) {
130				ui.children().each(function() {
131					var td = $(this);
132
133					td.width(td.width());
134				});
135
136				return ui;
137			},
138			start: function(e, ui) {
139				$(ui.placeholder).height($(ui.helper).height());
140			}
141		});
142
143		preprocessing
144			.on('click', '.element-table-add', function() {
145				var row = $(this).parent().parent();
146				row.before(preproc_row_tpl.evaluate({rowNum: preprocessing.find('tr.sortable').length}));
147
148				if (preprocessing.find('tr.sortable').length > 1) {
149					preprocessing.sortable('enable');
150				}
151			})
152			.on('click', '.element-table-remove', function() {
153				var row = $(this).parent().parent();
154				row.remove();
155
156				if (preprocessing.find('tr.sortable').length < 2) {
157					preprocessing.sortable('disable');
158				}
159			})
160			.on('change', 'select[name*="type"]', function() {
161				var inputs = $(this).parent().parent().find('[name*="params"]');
162
163				switch ($(this).val()) {
164					case '<?= ZBX_PREPROC_MULTIPLIER ?>':
165						$(inputs[0])
166							.show()
167							.attr('placeholder', <?= CJs::encodeJson(_('number')) ?>);
168						$(inputs[1]).hide();
169						break;
170
171					case '<?= ZBX_PREPROC_RTRIM ?>':
172					case '<?= ZBX_PREPROC_LTRIM ?>':
173					case '<?= ZBX_PREPROC_TRIM ?>':
174						$(inputs[0])
175							.show()
176							.attr('placeholder', <?= CJs::encodeJson(_('list of characters')) ?>);
177						$(inputs[1]).hide();
178						break;
179
180					case '<?= ZBX_PREPROC_XPATH ?>':
181					case '<?= ZBX_PREPROC_JSONPATH ?>':
182						$(inputs[0])
183							.show()
184							.attr('placeholder', <?= CJs::encodeJson(_('path')) ?>);
185						$(inputs[1]).hide();
186						break;
187
188					case '<?= ZBX_PREPROC_REGSUB ?>':
189						$(inputs[0])
190							.show()
191							.attr('placeholder', <?= CJs::encodeJson(_('pattern')) ?>);
192						$(inputs[1]).show();
193						break;
194
195					case '<?= ZBX_PREPROC_BOOL2DEC ?>':
196					case '<?= ZBX_PREPROC_OCT2DEC ?>':
197					case '<?= ZBX_PREPROC_HEX2DEC ?>':
198					case '<?= ZBX_PREPROC_DELTA_VALUE ?>':
199					case '<?= ZBX_PREPROC_DELTA_SPEED ?>':
200						$(inputs[0]).hide();
201						$(inputs[1]).hide();
202						break;
203				}
204			});
205
206			var $ = jQuery,
207				editableTable = function (elm, tmpl, tmpl_defaults) {
208					var table,
209						row_template,
210						row_default_values,
211						insert_point,
212						rows = 0,
213						table_row_class = 'editable_table_row';
214
215					table = $(elm);
216					insert_point = table.find('tbody tr[data-insert-point]');
217					row_template = new Template($(tmpl).html());
218					row_default_values = tmpl_defaults;
219
220					table.sortable({
221						disabled: true,
222						items: 'tbody tr.sortable',
223						axis: 'y',
224						containment: 'parent',
225						cursor: IE ? 'move' : 'grabbing',
226						handle: 'div.<?= ZBX_STYLE_DRAG_ICON ?>',
227						tolerance: 'pointer',
228						opacity: 0.6,
229						helper: function(e, ui) {
230							ui.children('td').each(function() {
231								$(this).width($(this).width());
232							});
233
234							return ui;
235						},
236						start: function(e, ui) {
237							// Fix placeholder not to change height while object is being dragged.
238							$(ui.placeholder).height($(ui.helper).height());
239						}
240					});
241
242					table.on('click', '[data-row-action]', function (e) {
243						e.preventDefault();
244
245						switch ($(e.currentTarget).data('row-action')) {
246							case 'remove_row' :
247								rows -= 1;
248								table.sortable('option', 'disabled', rows < 2);
249
250								$(e.currentTarget).closest('.'+table_row_class).remove();
251								break;
252
253							case 'add_row' :
254								var row_data = $(e.currentTarget).data('values'),
255									new_row = addRow($.extend({index: rows + 1}, row_data||{}));
256
257								if (!row_data) {
258									new_row.find('[type="text"]').val('');
259								}
260								break;
261						}
262					});
263
264					function addRow(values) {
265						rows += 1;
266						table.sortable('option', 'disabled', rows < 2);
267
268						return $(row_template.evaluate(values))
269							.addClass(table_row_class)
270							.addClass('sortable')
271							.data('row-values', values)
272							.insertBefore(insert_point);
273					}
274
275					function addRows(rows_values) {
276						$.each(rows_values, function(index, values) {
277							addRow($.extend({"index": index}, values));
278						});
279					}
280
281					return {
282						addRow: function(values) {
283							return addRow(values);
284						},
285						addRows: function(rows_values) {
286							addRows(rows_values);
287							return table;
288						},
289						clearTable: function() {
290							table.find('.'+table_row_class).remove();
291							return table;
292						}
293					}
294				};
295
296		$('[data-sortable-pairs-table]').each(function() {
297			var t = $(this),
298				table = t.find('table'),
299				data = JSON.parse(t.find('[type="text/json"]').text()),
300				template = t.find('[type="text/x-jquery-tmpl"]'),
301				et = new editableTable(table, template);
302
303			et.addRows(data);
304
305			if (t.data('sortable-pairs-table') != 1) {
306				table.sortable('option', 'disabled', true);
307			}
308
309			t.data('editableTable', et);
310		});
311	});
312</script>
313