form.php — Interactive Image Map Builder trunk

interactive-image-map-builder / settings / form.php

interactive-image-map-builder / settings Last commit date

css 2 years ago add-point-html.php 10 months ago builder.php 2 years ago edit-point-html.php 10 months ago form.php 10 months ago how-to-use.php 2 years ago import-export-plugins.php 1 year ago nested-point.php 3 months ago plugin-settings.php 2 years ago save.php 2 years ago template-settings.php 10 months ago wpmart-plugins.php 2 years ago

form.php

178 lines

1	<div class="isimb_6310_tabs_panel_settings">
2	<form method="post">
3	<?php wp_nonce_field("isimb_6310_nonce_field_form") ?>
4	<input type="hidden" name="id" value="<?php echo esc_attr($ids) ?>" />
5	<input type="hidden" name="main_image" value="<?php echo isset($cssData['main_image']) ? esc_attr($cssData['main_image']) : '' ?>" />
6	<input type="hidden" name="json_data" id="isimb_6310_json_field" value="<?php echo isset($cssData['json_data']) ? esc_attr($cssData['json_data']) : '' ?>" />
7	<div class="isimb-6310-tab-content">
8	<div id="tab-1">
9	<div class="row isimb_6310_padding_15_px">
10	<h3 class="isimb-6310-tab-menu-settings">Image Map Builder Settings</h3>
11	<div class="isimb-6310-col-50">
12	<table class="table table-responsive isimb_6310_admin_table">
13	<tr height="45">
14	<td>
15	<b>Shortcode Name</b>
16	</td>
17	<td>
18	<input type="text" class="isimb-6310-form-input" required autocomplete="off" name="name" placeholder="Enter builder name" value="<?php echo isset($styledata['name']) ? isimb_6310_replace(esc_attr($styledata['name'])) : 'Image Map Builder' ?>">
19	</td>
20	</tr>
21	<tr height="45">
22	<td>
23	<b>Tooltip Position</b>
24	<span class="isimb-6310-pro">(Pro) <div class="isimb-6310-pro-text">This feature is available only on the pro version. You can view changes once logged in as admin or moderator.</div></span>
25	</td>
26	<td>
27	<select name="tooltip_position" class="isimb-6310-form-input">
28	<?php
29	$arr = ['Auto Adjust', 'Top Right', 'Center Right', 'Bottom Right', 'Top Left', 'Center Left', 'Bottom Left', 'Polygon Center'];
30	$tooltip_position = isset($cssData['tooltip_position']) ? esc_attr($cssData['tooltip_position']) : 0;
31	foreach ($arr as $key => $value) {
32	$selected = $key == $tooltip_position ? ' selected' : '';
33	echo "<option value='{$key}'{$selected}>{$value}</option>";
34	}
35	?>
36	</select>
37	</td>
38	</tr>
39	<tr height="45" class="tooltip-attribute">
40	<td>
41	<b class="tooltip-attribute-text-1">From Top</b>
42	<span class="isimb-6310-pro">(Pro) <div class="isimb-6310-pro-text">This feature is available only on the pro version. You can view changes once logged in as admin or moderator.</div></span>
43	</td>
44	<td>
45	<input type="number" class="isimb-6310-form-input" required autocomplete="off" name="top_bottom" value="<?php echo isset($cssData['top_bottom']) ? esc_attr($cssData['top_bottom']) : 0 ?>">
46	</td>
47	</tr>
48	<tr height="45" class="tooltip-attribute">
49	<td>
50	<b class="tooltip-attribute-text-2">From Right</b>
51	<span class="isimb-6310-pro">(Pro) <div class="isimb-6310-pro-text">This feature is available only on the pro version. You can view changes once logged in as admin or moderator.</div></span>
52	</td>
53	<td>
54	<input type="number" class="isimb-6310-form-input" required autocomplete="off" name="left_right" value="<?php echo isset($cssData['left_right']) ? esc_attr($cssData['left_right']) : 0 ?>">
55	</td>
56	</tr>
57	<tr height="45">
58	<td>
59	<b>Custom CSS</b>
60	<span class="isimb-6310-pro">(Pro) <div class="isimb-6310-pro-text">This feature is available only on the pro version. You can view changes once logged in as admin or moderator.</div></span>
61	</td>
62	<td>
63	<textarea class="isimb-6310-form-input" name="custom_css" rows="4"><?php echo isset($cssData['custom_css']) ? esc_attr($cssData['custom_css']) : '' ?></textarea>
64	</td>
65	</tr>
66	</table>
67	</div>
68	<div class="isimb-6310-col-50">
69	<table class="table table-responsive isimb_6310_admin_table">
70	<tr height="50">
71	<td>
72	<b>Display Zoom Feature:</b>
73	<span class="isimb-6310-pro">(Pro) <div class="isimb-6310-pro-text">This feature is available only on the pro version. You can view changes once logged in as admin or moderator.</div></span>
74	</td>
75	<td>
76	<input type="radio" name="zoom_feature" value="1" checked>No
77	<input type="radio" name="zoom_feature" value="2" <?php echo isset($cssData['zoom_feature']) && ($cssData['zoom_feature'] == 2) ? ' checked' : '' ?>>Yes
78	</td>
79	</tr>
80	<tr height="50" class="toggle-zoom-feature">
81	<td>
82	<b>Display Device Type:</b>
83	<span class="isimb-6310-pro">(Pro) <div class="isimb-6310-pro-text">This feature is available only on the pro version. You can view changes once logged in as admin or moderator.</div></span>
84	</td>
85	<td>
86	<select name="display_device" class="isimb-6310-form-input">
87	<option value="1">Only Mobile</option>
88	<option value="2" <?php echo isset($cssData['display_device']) && ($cssData['display_device'] == 2) ? ' selected' : '' ?>>Only Desktop</option>
89	<option value="3" <?php echo isset($cssData['display_device']) && ($cssData['display_device'] == 3) ? ' selected' : '' ?>>Both Desktop & Mobile</option>
90	</select>
91	</td>
92	</tr>
93	<tr height="50" class="toggle-zoom-feature">
94	<td>
95	<b>Zoom In Icon:</b>
96	<span class="isimb-6310-pro">(Pro) <div class="isimb-6310-pro-text">This feature is available only on the pro version. You can view changes once logged in as admin or moderator.</div></span>
97	</td>
98	<td style="display: flex; align-items: center; padding-top: 10px">
99	<input type="hidden" name="zoom_in_icon" value="<?php echo isset($cssData['zoom_in_icon']) && $cssData['zoom_in_icon'] ? esc_attr($cssData['zoom_in_icon']) : isimb_6310_plugin_dir_url . 'assets/images/zoom-in.png' ?>" />
100	<img src="<?php echo isset($cssData['zoom_in_icon']) && $cssData['zoom_in_icon'] ? esc_attr($cssData['zoom_in_icon']) : isimb_6310_plugin_dir_url . 'assets/images/zoom-in.png'; ?>" alt="" width="30" height="30">
101	<button class="isimb-6310-btn-success isimb-6310-zoom-icon">Upload Icon</button>
102	</td>
103	</tr>
104	<tr height="50" class="toggle-zoom-feature">
105	<td>
106	<b>Zoom Out Icon:</b>
107	<span class="isimb-6310-pro">(Pro) <div class="isimb-6310-pro-text">This feature is available only on the pro version. You can view changes once logged in as admin or moderator.</div></span>
108	</td>
109	<td style="display: flex; align-items: center; padding-top: 10px">
110	<input type="hidden" name="zoom_out_icon" value="<?php echo isset($cssData['zoom_out_icon']) && $cssData['zoom_out_icon'] ? esc_attr($cssData['zoom_out_icon']) : isimb_6310_plugin_dir_url . 'assets/images/zoom-out.png' ?>" />
111	<img src="<?php echo isset($cssData['zoom_out_icon']) && $cssData['zoom_out_icon'] ? esc_attr($cssData['zoom_out_icon']) : isimb_6310_plugin_dir_url . 'assets/images/zoom-out.png' ?>" alt="" width="30" height="30">
112	<button class="isimb-6310-btn-success isimb-6310-zoom-icon">Upload Icon</button>
113	</td>
114	</tr>
115	<tr height="50" class="toggle-zoom-feature">
116	<td>
117	<b>Desktop Icon Size:</b>
118	<span class="isimb-6310-pro">(Pro) <div class="isimb-6310-pro-text">This feature is available only on the pro version. You can view changes once logged in as admin or moderator.</div></span>
119	</td>
120	<td>
121	<input type="number" class="isimb-6310-form-input" name="desktop_icon_size" value="<?php echo isset($cssData['desktop_icon_size']) ? esc_attr($cssData['desktop_icon_size']) : '30' ?>" />
122	</td>
123	</tr>
124	<tr height="50" class="toggle-zoom-feature">
125	<td>
126	<b>Mobile Icon Size:</b>
127	<span class="isimb-6310-pro">(Pro) <div class="isimb-6310-pro-text">This feature is available only on the pro version. You can view changes once logged in as admin or moderator.</div></span>
128	</td>
129	<td>
130	<input type="number" class="isimb-6310-form-input" name="mobile_icon_size" value="<?php echo isset($cssData['mobile_icon_size']) ? esc_attr($cssData['mobile_icon_size']) : '25' ?>" />
131	</td>
132	</tr>
133	<tr height="50" class="toggle-zoom-feature" style="background: #FFF !important;">
134	<td>
135	<b>Icon Position:</b>
136	<span class="isimb-6310-pro">(Pro) <div class="isimb-6310-pro-text">This feature is available only on the pro version. You can view changes once logged in as admin or moderator.</div></span>
137	</td>
138	<td>
139	<select name="icon_position" class="isimb-6310-form-input">
140	<?php
141	$positions = [
142	'right-top' => 'Right Top',
143	'right-bottom' => 'Right Bottom',
144	'left-top' => 'Left Top',
145	'bottom-left' => 'Left Bottom',
146	'flex-start' => 'Left',
147	'center' => 'Center',
148	'flex-end' => 'Right',
149	];
150
151	$selectedKey = isset($cssData['icon_position']) ? $cssData['icon_position'] : 'right-top';
152	foreach ($positions as $key => $label) {
153	$selected = ($key === $selectedKey) ? ' selected' : '';
154	echo "<option value=\"{$key}\"{$selected}>{$label}</option>\n";
155	}
156	?>
157	</select>
158	</td>
159	</tr>
160	<tr height="40px" class="toggle-zoom-feature toggle-zoom-feature-background" style="background: #f2f2f2 !important;">
161	<td>
162	<label class="isimb-6310-form-label" for="icons">Icon Background:</label>
163	<span class="isimb-6310-pro">(Pro) <div class="isimb-6310-pro-text">This feature is available only on the pro version. You can view changes once logged in as admin or moderator.</div></span>
164	</td>
165	<td>
166	<input type="text" name="icon_background" class="isimb_6310_icon_background isimb-6310-form-input isimb_6310_color_picker" data-opacity="0.8" data-format="rgb" value="<?php echo isset($cssData['icon_background']) ? esc_attr($cssData['icon_background']) : 'rgba(0, 0, 0, 0.9)' ?>">
167	</td>
168	</tr>
169	</table>
170	</div>
171	</div>
172	</div>
173	<hr />
174	<input type="submit" name="update_style_change" value="Save" class="isimb-6310-btn-primary isimb-6310-pull-right isimb-6310-insert-ja-data" style="margin-right: 15px; margin-bottom: 10px; display: block" />
175	<br class="isimb-6310-clear" />
176	</div>
177	</form>
178	</div>