option.php
432 lines
| 1 | <?php |
| 2 | /** |
| 3 | * Template for rendering some markup elements. |
| 4 | * |
| 5 | * @package Hustle |
| 6 | * @since 4.0.0 |
| 7 | */ |
| 8 | |
| 9 | $element_type = strtolower( $type ); |
| 10 | $type_class = 'optin_' . $element_type . '_' . $element_type . ' ' . $element_type; |
| 11 | $for = ( isset( $for ) ) ? $for : ''; |
| 12 | $attributes = isset( $attributes ) ? $attributes : array(); |
| 13 | |
| 14 | // FIELD TYPE: Label. |
| 15 | if ( 'label' === $element_type ) { ?> |
| 16 | <label |
| 17 | <?php echo isset( $for ) ? 'for="' . esc_attr( $for ) . '"' : ''; ?> |
| 18 | class="<?php echo isset( $class ) ? esc_attr( $class ) : 'sui-label'; ?>" |
| 19 | <?php $this->render_attributes( isset( $attributes ) ? $attributes : array() ); ?> |
| 20 | > |
| 21 | <?php echo $value; // phpcs:ignore ?> |
| 22 | <?php if ( isset( $note ) && ! empty( $note ) ) { ?> |
| 23 | <span class="sui-label-note"><?php echo $note; // phpcs:ignore ?></span> |
| 24 | <?php } ?> |
| 25 | </label> |
| 26 | |
| 27 | <?php |
| 28 | // FIELD TYPE: Description. |
| 29 | } elseif ( 'description' === $element_type ) { |
| 30 | ?> |
| 31 | <span class="sui-description"><?php echo $value; // phpcs:ignore ?></span> |
| 32 | |
| 33 | <?php |
| 34 | // FIELD TYPE: Notice. |
| 35 | } elseif ( 'notice' === $element_type ) { |
| 36 | ?> |
| 37 | |
| 38 | <div |
| 39 | <?php echo ! empty( $id ) ? 'id="' . esc_attr( $id ) . '"' : ''; ?> |
| 40 | class="sui-notice <?php echo isset( $class ) ? esc_attr( $class ) : ''; ?>" |
| 41 | <?php $this->render_attributes( $attributes ); ?> |
| 42 | > |
| 43 | |
| 44 | <div class="sui-notice-content"> |
| 45 | |
| 46 | <div class="sui-notice-message"> |
| 47 | |
| 48 | <?php if ( ! empty( $icon ) ) : ?> |
| 49 | <span class="sui-notice-icon sui-icon-<?php echo esc_attr( $icon ); ?> sui-md" aria-hidden="true"></span> |
| 50 | <?php endif; ?> |
| 51 | <p><?php echo $value; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped, Make sure $value is properly escaped! We're not escaping it in here. ?></p> |
| 52 | |
| 53 | </div> |
| 54 | |
| 55 | </div> |
| 56 | |
| 57 | </div> |
| 58 | |
| 59 | <?php |
| 60 | // FIELD TYPE: Textarea. |
| 61 | } elseif ( 'textarea' === $element_type ) { |
| 62 | ?> |
| 63 | <textarea <?php $this->render_attributes( isset( $attributes ) ? $attributes : array() ); ?> |
| 64 | name="<?php echo esc_attr( $name ); ?>" |
| 65 | id="<?php echo esc_attr( $id ); ?>" |
| 66 | cols="30" rows="10"><?php echo esc_textarea( $value ? $value : $default ); ?></textarea> |
| 67 | |
| 68 | <?php |
| 69 | // FIELD TYPE: Select. |
| 70 | } elseif ( 'select' === $element_type ) { |
| 71 | ?> |
| 72 | <select |
| 73 | <?php echo empty( $name ) ? '' : 'name="' . esc_attr( $name ) . '"'; ?> |
| 74 | <?php echo empty( $id ) ? '' : 'id="' . esc_attr( $id ) . '"'; ?> |
| 75 | <?php echo empty( $class ) ? '' : 'class="' . esc_attr( $class ) . '"'; ?> |
| 76 | <?php echo empty( $nonce ) ? '' : 'data-nonce="' . esc_attr( $nonce ) . '"'; ?> |
| 77 | <?php $this->render_attributes( isset( $attributes ) ? $attributes : array() ); ?> |
| 78 | > |
| 79 | <?php |
| 80 | foreach ( $options as $value => $label ) : |
| 81 | $label = ! empty( $label ) ? $label : '‍'; |
| 82 | $_selected = is_array( $selected ) && empty( $selected ) ? '' : $selected; |
| 83 | ?> |
| 84 | <option <?php selected( $_selected, $value ); ?> value="<?php echo esc_attr( $value ); ?>"><?php echo esc_attr( $label ); ?></option> |
| 85 | <?php endforeach; ?> |
| 86 | </select> |
| 87 | |
| 88 | <?php |
| 89 | // FIELD TYPE: Multiple Select. |
| 90 | } elseif ( 'multiselect' === $element_type ) { |
| 91 | ?> |
| 92 | <select |
| 93 | <?php echo empty( $name ) ? '' : 'name="' . esc_attr( $name ) . '"'; ?> |
| 94 | <?php echo empty( $id ) ? '' : 'id="' . esc_attr( $id ) . '"'; ?> |
| 95 | <?php echo empty( $class ) ? '' : 'class="' . esc_attr( $class ) . '"'; ?> |
| 96 | <?php $this->render_attributes( isset( $attributes ) ? $attributes : array() ); ?> |
| 97 | > |
| 98 | <?php |
| 99 | $_selected = empty( $selected ) ? array() : $selected; |
| 100 | foreach ( $options as $value => $label ) : |
| 101 | $label = ! empty( $label ) ? $label : '‍'; |
| 102 | $selected = is_array( $_selected ) && in_array( absint( $value ), $_selected, true ) ? 'selected' : ''; |
| 103 | ?> |
| 104 | <option <?php echo esc_attr( $selected ); ?> value="<?php echo esc_attr( $value ); ?>"><?php echo esc_attr( $label ); ?></option> |
| 105 | <?php endforeach; ?> |
| 106 | </select> |
| 107 | <?php |
| 108 | // FIELD TYPE: Link. |
| 109 | } elseif ( 'link' === $element_type ) { |
| 110 | ?> |
| 111 | <a <?php $this->render_attributes( isset( $attributes ) ? $attributes : array() ); ?> |
| 112 | href="<?php echo esc_url( $href ); ?>" |
| 113 | target="<?php echo isset( $target ) ? esc_attr( $target ) : '_self'; ?>" |
| 114 | id="<?php echo isset( $id ) ? esc_attr( $id ) : ''; ?>" |
| 115 | class="<?php echo esc_attr( $type_class ); ?> <?php echo isset( $class ) ? esc_attr( $class ) : ''; ?>" |
| 116 | <?php echo isset( $style ) ? 'style="' . esc_attr( $style ) . '"' : ''; ?>><?php echo esc_html( $text ); ?></a> |
| 117 | |
| 118 | <?php |
| 119 | // FIELD TYPE: Wrapper. |
| 120 | } elseif ( 'wrapper' === $element_type ) { |
| 121 | ?> |
| 122 | <div |
| 123 | <?php $this->render_attributes( isset( $attributes ) ? $attributes : array() ); ?> |
| 124 | <?php echo isset( $id ) ? 'id="' . esc_attr( $id ) . '"' : ''; ?> |
| 125 | class=" |
| 126 | <?php |
| 127 | if ( empty( $is_not_field_wrapper ) ) { |
| 128 | echo 'sui-form-field ';} |
| 129 | ?> |
| 130 | <?php |
| 131 | if ( isset( $class ) ) { |
| 132 | echo esc_attr( $class );} |
| 133 | ?> |
| 134 | " |
| 135 | <?php echo isset( $style ) ? 'style="' . esc_attr( $style ) . '"' : ''; ?> |
| 136 | > |
| 137 | <?php |
| 138 | foreach ( (array) $elements as $element ) { |
| 139 | $this->render( 'general/option', $element ); |
| 140 | } |
| 141 | ?> |
| 142 | </div> |
| 143 | |
| 144 | <?php |
| 145 | // FIELD TYPE: Radio (Group). |
| 146 | } elseif ( 'radios' === $element_type ) { |
| 147 | $_selected = -1; |
| 148 | |
| 149 | if ( isset( $default ) ) { |
| 150 | $_selected = $default; |
| 151 | } |
| 152 | |
| 153 | if ( isset( $selected ) ) { |
| 154 | $_selected = $selected; |
| 155 | } |
| 156 | |
| 157 | if ( is_array( $_selected ) && empty( $_selected ) ) { |
| 158 | $_selected = ''; |
| 159 | } |
| 160 | |
| 161 | foreach ( $options as $value => $label ) { |
| 162 | $label_before = isset( $label_before ) ? $label_before : false; |
| 163 | ?> |
| 164 | |
| 165 | <label |
| 166 | <?php echo isset( $field_id ) ? 'for="' . esc_attr( $field_id ) . '"' : ''; ?> |
| 167 | class="sui-radio<?php echo isset( $class ) ? ' ' . esc_attr( $class ) : ''; ?>" |
| 168 | > |
| 169 | |
| 170 | <input |
| 171 | type="radio" |
| 172 | <?php echo isset( $name ) ? 'name="' . esc_attr( $name ) . '"' : ''; ?> |
| 173 | <?php echo 'value="' . esc_attr( $value ) . '"'; ?> |
| 174 | <?php echo isset( $field_id ) ? 'id="' . esc_attr( $field_id ) . '-' . esc_attr( str_replace( ' ', '-', strtolower( $value ) ) ) . '"' : ''; ?> |
| 175 | <?php $this->render_attributes( isset( $item_attributes ) ? $item_attributes : array() ); ?> |
| 176 | <?php selected( $_selected, $value ); ?> |
| 177 | /> |
| 178 | |
| 179 | <span aria-hidden="true"></span> |
| 180 | |
| 181 | <?php echo ! empty( $label ) ? '<span>' . esc_html( $label ) . '</span>' : ''; ?> |
| 182 | |
| 183 | </label> |
| 184 | |
| 185 | <?php } ?> |
| 186 | |
| 187 | <?php |
| 188 | // FIELD TYPE: Radio. |
| 189 | } elseif ( 'radio' === $element_type ) { |
| 190 | ?> |
| 191 | |
| 192 | <label |
| 193 | <?php echo isset( $id ) ? 'for="' . esc_attr( $id ) . '"' : ''; ?> |
| 194 | class="sui-radio<?php echo isset( $class ) ? ' ' . esc_attr( $class ) : ''; ?>" |
| 195 | > |
| 196 | <input |
| 197 | type="radio" |
| 198 | <?php echo isset( $name ) ? 'name="' . esc_attr( $name ) . '"' : ''; ?> |
| 199 | <?php echo isset( $value ) ? 'value="' . esc_attr( $value ) . '"' : ''; ?> |
| 200 | <?php echo isset( $id ) ? 'id="' . esc_attr( $id ) . '"' : ''; ?> |
| 201 | <?php $this->render_attributes( isset( $attributes ) ? $attributes : array() ); ?> |
| 202 | /> |
| 203 | <span aria-hidden="true"></span> |
| 204 | <?php echo isset( $label ) ? '<span>' . esc_html( $label ) . '</span>' : ''; ?> |
| 205 | </label> |
| 206 | |
| 207 | <?php |
| 208 | // FIELD TYPE: Checkbox (Group). |
| 209 | } elseif ( 'checkboxes' === $element_type ) { |
| 210 | |
| 211 | $_selected = -1; |
| 212 | |
| 213 | if ( isset( $default ) ) { |
| 214 | $_selected = $default; |
| 215 | } |
| 216 | |
| 217 | if ( isset( $selected ) ) { |
| 218 | $_selected = $selected; |
| 219 | } |
| 220 | |
| 221 | foreach ( $options as $value => $label ) { |
| 222 | |
| 223 | $id = esc_attr( $id . "-" . str_replace( " ", "-", strtolower( $value ) ) ); // phpcs:ignore |
| 224 | $checked = is_array( $_selected ) ? in_array( $value, $_selected ) ? checked(true, true, false) : "" : checked( $_selected, $value, false ); // phpcs:ignore |
| 225 | ?> |
| 226 | |
| 227 | <label |
| 228 | <?php echo isset( $id ) ? 'for="' . esc_attr( $id ) . '"' : ''; ?> |
| 229 | class="sui-checkbox<?php echo isset( $class ) ? ' ' . esc_attr( $class ) : ''; ?>" |
| 230 | > |
| 231 | |
| 232 | <input |
| 233 | type="checkbox" |
| 234 | <?php echo isset( $name ) ? 'name="' . esc_attr( $name ) . '"' : ''; ?> |
| 235 | <?php echo 'value="' . esc_attr( $value ) . '"'; ?> |
| 236 | <?php echo isset( $id ) ? 'id="' . esc_attr( $id ) . '"' : ''; ?> |
| 237 | <?php $this->render_attributes( isset( $item_attributes ) ? $item_attributes : array() ); ?> |
| 238 | <?php echo esc_html( $checked ); ?> |
| 239 | /> |
| 240 | |
| 241 | <span aria-hidden="true"></span> |
| 242 | |
| 243 | <?php echo ! empty( $label ) ? '<span>' . esc_html( $label ) . '</span>' : ''; ?> |
| 244 | |
| 245 | </label> |
| 246 | |
| 247 | <?php } ?> |
| 248 | |
| 249 | <?php |
| 250 | // FIELD TYPE: Checkbox. |
| 251 | } elseif ( 'checkbox' === $element_type ) { |
| 252 | ?> |
| 253 | |
| 254 | <label |
| 255 | <?php echo isset( $id ) ? 'for="' . esc_attr( $id ) . '"' : ''; ?> |
| 256 | class="sui-checkbox<?php echo isset( $class ) ? ' ' . esc_attr( $class ) : ''; ?>" |
| 257 | > |
| 258 | <input |
| 259 | type="checkbox" |
| 260 | <?php echo isset( $name ) ? 'name="' . esc_attr( $name ) . '"' : ''; ?> |
| 261 | <?php echo isset( $value ) ? 'value="' . esc_attr( $value ) . '"' : ''; ?> |
| 262 | <?php echo isset( $id ) ? 'id="' . esc_attr( $id ) . '"' : ''; ?> |
| 263 | <?php $this->render_attributes( isset( $attributes ) ? $attributes : array() ); ?> |
| 264 | /> |
| 265 | <span aria-hidden="true"></span> |
| 266 | <?php echo isset( $label ) ? '<span>' . esc_html( $label ) . '</span>' : ''; ?> |
| 267 | </label> |
| 268 | |
| 269 | <?php |
| 270 | // FIELD TYPE: Checkbox (Toggle). |
| 271 | } elseif ( 'checkbox_toggle' === $element_type ) { |
| 272 | ?> |
| 273 | <label |
| 274 | <?php echo isset( $id ) ? 'for="' . esc_attr( $id ) . '"' : ''; ?> |
| 275 | class="sui-toggle" |
| 276 | > |
| 277 | <input |
| 278 | type="checkbox" |
| 279 | name="<?php echo esc_attr( $name ); ?>" |
| 280 | value="<?php echo esc_attr( $value ); ?>" |
| 281 | <?php echo ( ! empty( $id ) && ! empty( $label ) ? 'aria-labelledby="' . esc_attr( $label ) . '-label"' : '' ); ?> |
| 282 | <?php echo ( ! empty( $id ) && ! empty( $description ) ? 'aria-describedby="' . esc_attr( $description ) . '-label"' : '' ); ?> |
| 283 | <?php echo isset( $id ) ? 'id="' . esc_attr( $id ) . '"' : ''; ?> |
| 284 | <?php $this->render_attributes( isset( $attributes ) ? $attributes : array() ); ?> |
| 285 | /> |
| 286 | <span class="sui-toggle-slider" aria-hidden="true"></span> |
| 287 | |
| 288 | <?php if ( isset( $label ) && '' !== $label ) { ?> |
| 289 | <span <?php echo isset( $id ) ? 'id="' . esc_attr( $id ) . '-label" ' : ''; ?>class="sui-toggle-label"><?php echo esc_html( $label ); ?></span> |
| 290 | <?php } ?> |
| 291 | <?php if ( isset( $description ) && '' !== $description ) { ?> |
| 292 | <span <?php echo isset( $id ) ? 'id="' . esc_attr( $id ) . '-description" ' : ''; ?>class="sui-description"><?php echo esc_html( $description ); ?></span> |
| 293 | <?php } ?> |
| 294 | </label> |
| 295 | |
| 296 | <?php |
| 297 | // FIELD TYPE: Checkbox (Toggle). |
| 298 | } elseif ( 'sui_tabs' === $element_type ) { |
| 299 | ?> |
| 300 | |
| 301 | <?php echo ! empty( $label ) ? '<span>' . esc_html( $label ) . '</span>' : ''; ?> |
| 302 | |
| 303 | <div class="sui-side-tabs" style="margin-top: 5px;"> |
| 304 | |
| 305 | <div class="sui-tabs-menu"> |
| 306 | <?php |
| 307 | foreach ( $options as $key => $option_title ) { |
| 308 | |
| 309 | $field_id = esc_attr( $name . '-' . str_replace( ' ', '-', strtolower( $key ) ) ); |
| 310 | ?> |
| 311 | <label for="hustle-<?php echo esc_html( $field_id ); ?>" |
| 312 | class="sui-tab-item <?php echo $key === $value ? 'active' : ''; ?>" |
| 313 | > |
| 314 | <input |
| 315 | type="radio" |
| 316 | name="<?php echo esc_html( $name ); ?>" |
| 317 | value="<?php echo esc_html( $key ); ?>" |
| 318 | id="hustle-<?php echo esc_html( $field_id ); ?>" |
| 319 | <?php checked( $key, $value ); ?> |
| 320 | /> |
| 321 | <?php echo esc_html( $option_title ); ?> |
| 322 | </label> |
| 323 | |
| 324 | <?php } ?> |
| 325 | |
| 326 | </div> |
| 327 | |
| 328 | <?php if ( ! empty( $description ) ) { ?> |
| 329 | <span class="sui-description"><?php echo esc_html( $description ); ?></span> |
| 330 | <?php } ?> |
| 331 | |
| 332 | </div> |
| 333 | |
| 334 | |
| 335 | <?php |
| 336 | // TAG TYPE: Small. |
| 337 | } elseif ( 'small' === $element_type ) { |
| 338 | ?> |
| 339 | <p><small <?php $this->render_attributes( isset( $attributes ) ? $attributes : array() ); ?> for="<?php echo esc_attr( $for ); ?>"> |
| 340 | <?php echo $value; // phpcs:ignore ?> |
| 341 | </small></p> |
| 342 | |
| 343 | <?php |
| 344 | // FIELD TYPE: Error label. |
| 345 | } elseif ( 'error' === $element_type ) { |
| 346 | ?> |
| 347 | <span |
| 348 | <?php $this->render_attributes( isset( $attributes ) ? $attributes : array() ); ?> |
| 349 | <?php echo ( isset( $id ) ? 'id="' . esc_attr( $id ) . '"' : '' ); ?> |
| 350 | class="sui-error-message<?php echo isset( $class ) ? ' ' . esc_attr( $class ) : ''; ?>" |
| 351 | > |
| 352 | <?php echo $value; // phpcs:ignore ?> |
| 353 | </span> |
| 354 | |
| 355 | <?php |
| 356 | // FIELD TYPE: Ajax button. |
| 357 | // This button is not an input submit. |
| 358 | } elseif ( 'button' === $element_type ) { |
| 359 | ?> |
| 360 | <button |
| 361 | <?php echo isset( $name ) ? 'name="' . esc_attr( $name ) . '"' : ''; ?> |
| 362 | <?php echo ( isset( $id ) ? 'id="' . esc_attr( $id ) . '"' : '' ); ?> |
| 363 | class="sui-button sui-button-ghost <?php echo esc_attr( $type_class ); ?> <?php echo isset( $class ) ? esc_attr( $class ) : ''; ?>" |
| 364 | <?php $this->render_attributes( isset( $attributes ) ? $attributes : array() ); ?> |
| 365 | > |
| 366 | <?php echo $value; // phpcs:ignore ?> |
| 367 | </button> |
| 368 | |
| 369 | <?php |
| 370 | // FIELD TYPE: Ajax button. |
| 371 | // This button is not an input submit. |
| 372 | } elseif ( 'ajax_button' === $element_type ) { |
| 373 | ?> |
| 374 | <button <?php $this->render_attributes( isset( $attributes ) ? $attributes : array() ); ?> <?php echo ( isset( $id ) ? 'id="' . esc_attr( $id ) . '"' : '' ); ?> class="hustle-onload-icon-action sui-button <?php echo isset( $class ) ? esc_attr( $class ) : ''; ?>"> |
| 375 | <span class="sui-loading-text"><?php echo esc_html( $value ); ?></span><span class="sui-icon-loader sui-loading" aria-hidden="true"></span> |
| 376 | </button> |
| 377 | |
| 378 | <?php |
| 379 | // FIELD TYPE: Button. |
| 380 | } elseif ( 'submit_button' === $element_type ) { |
| 381 | ?> |
| 382 | <button type="submit"<?php $this->render_attributes( isset( $attributes ) ? $attributes : array() ); ?> <?php echo ( isset( $id ) ? 'id="' . esc_attr( $id ) . '"' : '' ); ?> class="sui-button <?php echo isset( $class ) ? esc_attr( $class ) : ''; ?>"> |
| 383 | <?php echo $value; // phpcs:ignore ?> |
| 384 | </button> |
| 385 | |
| 386 | <?php |
| 387 | // FIELD TYPE: Password. |
| 388 | } elseif ( 'password-reset' === $element_type ) { |
| 389 | ?> |
| 390 | <div class="sui-with-button sui-with-button-icon"> |
| 391 | |
| 392 | <input |
| 393 | <?php $this->render_attributes( isset( $attributes ) ? $attributes : array() ); ?> |
| 394 | type="password" |
| 395 | <?php echo isset( $name ) ? 'name="' . esc_attr( $name ) . '"' : ''; ?> |
| 396 | value="<?php echo isset( $value ) ? esc_attr( $value ) : ''; ?>" |
| 397 | <?php echo isset( $placeholder ) ? 'placeholder="' . esc_attr( $placeholder ) . '"' : ''; ?> |
| 398 | id="<?php echo isset( $id ) ? esc_attr( $id ) : ''; ?>" |
| 399 | class="sui-form-control <?php echo esc_attr( $type_class ); ?> <?php echo isset( $class ) ? esc_attr( $class ) : ''; ?>" |
| 400 | /> |
| 401 | |
| 402 | <button class="sui-button-icon"> |
| 403 | <span aria-hidden="true" class="sui-icon-eye"></span> |
| 404 | <span class="sui-password-text sui-screen-reader-text"><?php esc_html_e( 'Show Password', 'hustle' ); ?></span> |
| 405 | <span class="sui-password-text sui-screen-reader-text sui-hidden"><?php esc_html_e( 'Hide Password', 'hustle' ); ?></span> |
| 406 | </button> |
| 407 | |
| 408 | </div> |
| 409 | <?php |
| 410 | // FIELD TYPE: Raw. |
| 411 | } elseif ( 'raw' === $element_type ) { |
| 412 | ?> |
| 413 | <?php echo $value; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?> |
| 414 | <?php } else { ?> |
| 415 | <?php echo isset( $icon ) ? '<div class="sui-control-with-icon">' : ''; ?> |
| 416 | |
| 417 | <input |
| 418 | <?php $this->render_attributes( isset( $attributes ) ? $attributes : array() ); ?> |
| 419 | type="<?php echo esc_attr( $element_type ); ?>" |
| 420 | <?php echo isset( $name ) ? 'name="' . esc_attr( $name ) . '"' : ''; ?> |
| 421 | value="<?php echo isset( $value ) ? esc_attr( $value ) : ''; ?>" |
| 422 | <?php echo isset( $placeholder ) ? 'placeholder="' . esc_attr( $placeholder ) . '"' : ''; ?> |
| 423 | id="<?php echo isset( $id ) ? esc_attr( $id ) : ''; ?>" |
| 424 | class="sui-form-control <?php echo esc_attr( $type_class ); ?> <?php echo isset( $class ) ? esc_attr( $class ) : ''; ?>" |
| 425 | /> |
| 426 | |
| 427 | <?php echo isset( $icon ) ? '<span class="sui-icon-' . esc_attr( $icon ) . '" aria-hidden="true"></span>' : ''; ?> |
| 428 | |
| 429 | <?php echo isset( $icon ) ? '</div>' : ''; ?> |
| 430 | <?php |
| 431 | } |
| 432 |