MS_Helper_Html

Helper class for rendering HTML components.

Defined (1)

The class is defined in the following location(s).

/app/helper/class-ms-helper-html.php  
  1. class MS_Helper_Html extends MS_Helper { 
  2.  
  3. /** Constants for default HTML input elements. */ 
  4. const INPUT_TYPE_HIDDEN = 'hidden'; 
  5. const INPUT_TYPE_TEXT_AREA = 'textarea'; 
  6. const INPUT_TYPE_SELECT = 'select'; 
  7. const INPUT_TYPE_RADIO = 'radio'; 
  8. const INPUT_TYPE_SUBMIT = 'submit'; 
  9. const INPUT_TYPE_BUTTON = 'button'; 
  10. const INPUT_TYPE_CHECKBOX = 'checkbox'; 
  11. const INPUT_TYPE_IMAGE = 'image'; 
  12. // Different input types 
  13. const INPUT_TYPE_TEXT = 'text'; 
  14. const INPUT_TYPE_PASSWORD = 'password'; 
  15. const INPUT_TYPE_NUMBER = 'number'; 
  16. const INPUT_TYPE_EMAIL = 'email'; 
  17. const INPUT_TYPE_URL = 'url'; 
  18. const INPUT_TYPE_TIME = 'time'; 
  19. const INPUT_TYPE_SEARCH = 'search'; 
  20. const INPUT_TYPE_FILE = 'file'; 
  21.  
  22. /** Constants for advanced HTML input elements. */ 
  23. const INPUT_TYPE_WP_EDITOR = 'wp_editor'; 
  24. const INPUT_TYPE_DATEPICKER = 'datepicker'; 
  25. const INPUT_TYPE_RADIO_SLIDER = 'radio_slider'; 
  26. const INPUT_TYPE_TAG_SELECT = 'tag_select'; 
  27. const INPUT_TYPE_WP_PAGES = 'wp_pages'; 
  28.  
  29. /** Constants for default HTML elements. */ 
  30. const TYPE_HTML_LINK = 'html_link'; 
  31. const TYPE_HTML_SEPARATOR = 'html_separator'; 
  32. const TYPE_HTML_TEXT = 'html_text'; 
  33. const TYPE_HTML_TABLE = 'html_table'; 
  34.  
  35. /** 
  36. * Method for creating HTML elements/fields. 
  37. * Pass in array with field arguments. See $defaults for argmuments. 
  38. * Use constants to specify field type. e.g. MS_Helper_Html::INPUT_TYPE_TEXT 
  39. * @since 1.0.0 
  40. * @return void|string If $return param is false the HTML will be echo'ed,  
  41. * otherwise returned as string 
  42. */ 
  43. public static function html_element( $field_args, $return = false ) { 
  44. return lib2()->html->element( $field_args, $return ); 
  45.  
  46.  
  47. /** 
  48. * Echo the header part of a settings form, including the title and 
  49. * description. 
  50. * @since 1.0.0 
  51. * @param array $args Title, description and breadcrumb infos. 
  52. */ 
  53. public static function settings_header( $args = null ) { 
  54. $defaults = array( 
  55. 'title' => '',  
  56. 'title_icon_class' => '',  
  57. 'desc' => '',  
  58. 'bread_crumbs' => null,  
  59. ); 
  60. $args = wp_parse_args( $args, $defaults ); 
  61. $args = apply_filters( 'ms_helper_html_settings_header_args', $args ); 
  62. extract( $args ); 
  63.  
  64. if ( ! is_array( $desc ) ) { 
  65. $desc = array( $desc ); 
  66.  
  67. MS_Helper_Html::bread_crumbs( $bread_crumbs ); 
  68. ?> 
  69. <h2 class="ms-settings-title"> 
  70. <?php if ( ! empty( $title_icon_class ) ) : ?> 
  71. <i class="<?php echo esc_attr( $title_icon_class ); ?>"></i> 
  72. <?php endif; ?> 
  73. <?php printf( $title ); ?> 
  74. </h2> 
  75. <div class="ms-settings-desc-wrapper"> 
  76. <?php foreach ( $desc as $description ) : ?> 
  77. <div class="ms-settings-desc ms-description"> 
  78. <?php printf( $description ); ?> 
  79. </div> 
  80. <?php endforeach; ?> 
  81. </div> 
  82. <?php 
  83.  
  84. /** 
  85. * Echo the footer section of a settings form. 
  86. * @since 1.0.0 
  87. * @param null|array $fields List of fields to display in the footer. 
  88. * @param bool|array $submit_info What kind of submit button to add. 
  89. */ 
  90. public static function settings_footer( $fields = null, $submit_info = null ) { 
  91. // Default Submit-Button is "Next >>" 
  92. if ( true === $submit_info ) { 
  93. $submit_info = array( 
  94. 'id' => 'next',  
  95. 'value' => __( 'Next', MS_TEXT_DOMAIN ),  
  96. 'action' => 'next',  
  97. ); 
  98.  
  99. if ( empty( $fields ) ) { 
  100. $fields = array(); 
  101.  
  102. if ( $submit_info ) { 
  103. $submit_fields = array( 
  104. 'next' => array( 
  105. 'id' => @$submit_info['id'],  
  106. 'type' => MS_Helper_Html::INPUT_TYPE_SUBMIT,  
  107. 'value' => @$submit_info['value'],  
  108. ),  
  109. 'action' => array( 
  110. 'id' => 'action',  
  111. 'type' => MS_Helper_Html::INPUT_TYPE_HIDDEN,  
  112. 'value' => @$submit_info['action'],  
  113. ),  
  114. '_wpnonce' => array( 
  115. 'id' => '_wpnonce',  
  116. 'type' => MS_Helper_Html::INPUT_TYPE_HIDDEN,  
  117. 'value' => wp_create_nonce( @$submit_info['action'] ),  
  118. ),  
  119. ); 
  120.  
  121. foreach ( $submit_fields as $key => $field ) { 
  122. if ( ! isset( $fields[ $key ] ) ) { 
  123. $fields[ $key ] = $field; 
  124.  
  125. $args = array( 
  126. 'saving_text' => __( 'Saving changes...', MS_TEXT_DOMAIN ),  
  127. 'saved_text' => __( 'All changes saved.', MS_TEXT_DOMAIN ),  
  128. 'error_text' => __( 'Could not save changes.', MS_TEXT_DOMAIN ),  
  129. 'fields' => $fields,  
  130. ); 
  131. $args = apply_filters( 'ms_helper_html_settings_footer_args', $args ); 
  132. $fields = $args['fields']; 
  133. unset( $args['fields'] ); 
  134.  
  135. ?> 
  136. <div class="ms-settings-footer"> 
  137. <form method="post" action=""> 
  138. <?php 
  139. foreach ( $fields as $field ) { 
  140. MS_Helper_Html::html_element( $field ); 
  141. self::save_text( $args ); 
  142. ?> 
  143. </form> 
  144. </div> 
  145. </div> 
  146. <?php 
  147.  
  148. public static function settings_tab_header( $args = null ) { 
  149. $defaults = array( 
  150. 'title' => '',  
  151. 'desc' => array(),  
  152. 'class' => '',  
  153. ); 
  154.  
  155. $args = wp_parse_args( $args, $defaults ); 
  156. $args = apply_filters( 'ms_helper_html_settings_header_args', $args ); 
  157. extract( $args ); 
  158.  
  159. if ( ! is_array( $desc ) ) { 
  160. $desc = array( $desc ); 
  161. foreach ( $desc as $id => $text ) { 
  162. if ( empty( $text ) ) { unset( $desc[$id] ); } 
  163.  
  164. ?> 
  165. <div class="ms-settings-wrapper <?php echo esc_attr( $class ); ?>"> 
  166. <?php if ( ! empty( $title ) || ! empty( $desc ) ) : ?> 
  167. <div class="ms-header"> 
  168. <?php if ( ! empty( $title ) ) : ?> 
  169. <div class="ms-settings-tab-title"> 
  170. <h3><?php printf( $title ); ?></h3> 
  171. </div> 
  172. <?php endif; ?> 
  173.  
  174. <?php if ( ! empty( $desc ) ) : ?> 
  175. <div class="ms-settings-description"> 
  176. <?php foreach ( $desc as $description ): ?> 
  177. <div class="ms-description"> 
  178. <?php echo '' . $description; ?> 
  179. </div> 
  180. <?php endforeach; ?> 
  181. </div> 
  182. <?php endif; ?> 
  183.  
  184. <?php self::html_separator(); ?> 
  185. </div> 
  186. <?php endif; ?> 
  187. <?php 
  188.  
  189. /** 
  190. * Echo a single content box including the header and footer of the box. 
  191. * The fields-list will be used to render the box body. 
  192. * @since 1.0.0 
  193. * @param array $fields_in List of fields to render 
  194. * @param string $title Box title 
  195. * @param string $description Description to display 
  196. * @param string $state Toggle-state of the box: static/open/closed 
  197. */ 
  198. public static function settings_box( $fields_in, $title = '', $description = '', $state = 'static', $class = '' ) { 
  199. // If its a fields array, great, if not, make a fields array. 
  200. $fields = $fields_in; 
  201. if ( ! is_array( $fields_in ) ) { 
  202. $fields = array(); 
  203. $fields[] = $fields_in; 
  204.  
  205. self::settings_box_header( $title, $description, $state, $class ); 
  206. foreach ( $fields as $field ) { 
  207. MS_Helper_Html::html_element( $field ); 
  208. self::save_text(); 
  209. self::settings_box_footer(); 
  210.  
  211. /** 
  212. * Echo the header of a content box. That box has a similar layout to a 
  213. * normal WordPress meta-box. 
  214. * The box has a title and description and can optionally be collapsible. 
  215. * @since 1.0.0 
  216. * @param string $title Box title displayed in the top 
  217. * @param string $description Description to display 
  218. * @param string $state Toggle-state of the box: static/open/closed 
  219. */ 
  220. public static function settings_box_header( $title = '', $description = '', $state = 'static', $class = '' ) { 
  221. do_action( 'ms_helper_settings_box_header_init', $title, $description, $state ); 
  222.  
  223. $handle = ''; 
  224. if ( $state !== 'static' ) { 
  225. $state = ('closed' === $state ? 'closed' : 'open'); 
  226. $handle = sprintf( 
  227. '<div class="handlediv" title="%s"></div>',  
  228. __( 'Click to toggle' ) // Intentionally no text-domain, so we use WordPress default translation. 
  229. ); 
  230. $box_class = $state; 
  231. if ( ! strlen( $title ) && ! strlen( $description ) ) { 
  232. $box_class .= ' nohead'; 
  233.  
  234. ?> 
  235. <div class="ms-settings-box-wrapper <?php echo esc_attr( $class ); ?>"> 
  236. <div class="ms-settings-box <?php echo esc_attr( $box_class ); ?>"> 
  237. <div class="ms-header"> 
  238. <?php printf( $handle ); ?> 
  239. <?php if ( ! empty( $title ) ) : ?> 
  240. <h3><?php printf( $title ); ?></h3> 
  241. <?php endif; ?> 
  242. <?php if ( ! empty( $description ) ) : ?> 
  243. <span class="ms-settings-description ms-description"><?php echo '' . $description; ?></span> 
  244. <?php endif; ?> 
  245. </div> 
  246. <div class="inside"> 
  247. <?php 
  248. do_action( 'ms_helper_settings_box_header_end', $title, $description, $state ); 
  249.  
  250. /** 
  251. * Echo the footer of a content box. 
  252. * @since 1.0.0 
  253. */ 
  254. public static function settings_box_footer() { 
  255. do_action( 'ms_helper_settings_box_footer_init' ); 
  256. ?> 
  257. </div> <!-- .inside --> 
  258. </div> <!-- .ms-settings-box --> 
  259. </div> <!-- .ms-settings-box-wrapper --> 
  260. <?php 
  261. do_action( 'ms_helper_settings_box_footer_end' ); 
  262.  
  263. /** 
  264. * Method for creating submit button. 
  265. * Pass in array with field arguments. See $defaults for argmuments. 
  266. * @since 1.0.0 
  267. * @return void But does output HTML. 
  268. */ 
  269. public static function html_submit( $args = array(), $return = false ) { 
  270. $defaults = array( 
  271. 'id' => 'submit',  
  272. 'value' => __( 'Save Changes', MS_TEXT_DOMAIN ),  
  273. 'class' => 'button button-primary',  
  274. ); 
  275. wp_parse_args( $args, $defaults ); 
  276.  
  277. $args['type'] = self::INPUT_TYPE_SUBMIT; 
  278.  
  279. if ( $return ) { 
  280. return self::html_element( $args, true ); 
  281. } else { 
  282. self::html_element( $args ); 
  283.  
  284. /** 
  285. * Method for creating html link. 
  286. * Pass in array with link arguments. See $defaults for arguments. 
  287. * @since 1.0.0 
  288. * @return string But does output HTML. 
  289. */ 
  290. public static function html_link( $args = array(), $return = false ) { 
  291. $defaults = array( 
  292. 'id' => '',  
  293. 'title' => '',  
  294. 'value' => '',  
  295. 'class' => '',  
  296. 'url' => '',  
  297. ); 
  298. wp_parse_args( $args, $defaults ); 
  299.  
  300. $args['type'] = self::TYPE_HTML_LINK; 
  301.  
  302. if ( $return ) { 
  303. return self::html_element( $args, true ); 
  304. } else { 
  305. self::html_element( $args ); 
  306.  
  307. /** 
  308. * Method for outputting vertical tabs. 
  309. * Returns the active tab key. Vertical tabs need to be wrapped in additional code. 
  310. * @since 1.0.0 
  311. * @param array $tabs 
  312. * @param string $active_tab 
  313. * @param array $persistent 
  314. * @return string Active tab. 
  315. */ 
  316. public static function html_admin_vertical_tabs( $tabs, $active_tab = null, $persistent = array( 'edit' ) ) { 
  317. reset( $tabs ); 
  318. $first_key = key( $tabs ); 
  319.  
  320. // Setup navigation tabs. 
  321. if ( empty( $active_tab ) ) { 
  322. $active_tab = ! empty( $_GET['tab'] ) ? $_GET['tab'] : $first_key; 
  323.  
  324. if ( ! array_key_exists( $active_tab, $tabs ) ) { 
  325. $active_tab = $first_key; 
  326.  
  327. // Render tabbed interface. 
  328. ?> 
  329. <div class="ms-tab-container"> 
  330. <ul id="sortable-units" class="ms-tabs" style=""> 
  331. <?php foreach ( $tabs as $tab_name => $tab ) : 
  332. $tab_class = $tab_name == $active_tab ? 'active' : ''; 
  333. $url = $tab['url']; 
  334.  
  335. foreach ( $persistent as $param ) { 
  336. lib2()->array->equip_request( $param ); 
  337. $value = $_REQUEST[ $param ]; 
  338. $url = esc_url_raw( 
  339. add_query_arg( $param, $value, $url ) 
  340. ); 
  341. ?> 
  342. <li class="ms-tab <?php echo esc_attr( $tab_class ); ?> "> 
  343. <a class="ms-tab-link" href="<?php echo esc_url( $url ); ?>"> 
  344. <?php echo esc_html( $tab['title'] ); ?> 
  345. </a> 
  346. </li> 
  347. <?php endforeach; ?> 
  348. </ul> 
  349. </div> 
  350. <?php 
  351.  
  352. // Return current active tab. 
  353. return $active_tab; 
  354.  
  355. /** 
  356. * Method for outputting tooltips. 
  357. * @since 1.0.0 
  358. * @return string But does output HTML. 
  359. */ 
  360. public static function tooltip( $tip = '', $return = false ) { 
  361. if ( empty( $tip ) ) { 
  362. return; 
  363.  
  364. if ( $return ) { ob_start(); } 
  365. ?> 
  366. <div class="wpmui-tooltip-wrapper"> 
  367. <div class="wpmui-tooltip-info"><i class="wpmui-fa wpmui-fa-info-circle"></i></div> 
  368. <div class="wpmui-tooltip"> 
  369. <div class="wpmui-tooltip-button">×</div> 
  370. <div class="wpmui-tooltip-content"> 
  371. <?php printf( $tip ); ?> 
  372. </div> 
  373. </div> 
  374. </div> 
  375. <?php 
  376. if ( $return ) { return ob_get_clean(); } 
  377.  
  378. /** 
  379. * Echo HTML separator element. 
  380. * Vertical separators will be on the right side of the parent element. 
  381. * @since 1.0.0 
  382. * @param string $type Either 'horizontal' or 'vertical' 
  383. */ 
  384. public static function html_separator( $type = 'horizontal' ) { 
  385. lib2()->html->element( 
  386. array( 
  387. 'type' => self::TYPE_HTML_SEPARATOR,  
  388. 'value' => $type,  
  389. ); 
  390.  
  391. /** 
  392. * Echo HTML structure for save-text and animation. 
  393. * @since 1.0.0 
  394. * @param array $texts Optionally override the default save-texts. 
  395. * @param bool $return If set to true the HTML code will be returned. 
  396. * @param bool $animation If an animation should be displayed while saving. 
  397. */ 
  398. public static function save_text( $texts = array(), $animation = false, $return = false ) { 
  399. $defaults = array( 
  400. 'saving_text' => __( 'Saving changes...', MS_TEXT_DOMAIN ),  
  401. 'saved_text' => __( 'All changes saved.', MS_TEXT_DOMAIN ),  
  402. 'error_text' => __( 'Could not save changes.', MS_TEXT_DOMAIN ),  
  403. ); 
  404. extract( wp_parse_args( $texts, $defaults ) ); 
  405.  
  406. if ( $return ) { 
  407. $command = 'sprintf'; 
  408. } else { 
  409. $command = 'printf'; 
  410.  
  411. if ( $animation ) { 
  412. $saving_text = '<div class="loading-animation"></div> ' . $saved_text; 
  413.  
  414. return $command( 
  415. '<span class="ms-save-text-wrapper"> 
  416. <span class="ms-saving-text">%1$s</span> 
  417. <span class="ms-saved-text">%2$s</span> 
  418. <span class="ms-error-text">%3$s<span class="err-code"></span></span> 
  419. </span>',  
  420. $saving_text,  
  421. $saved_text,  
  422. $error_text 
  423. ); 
  424.  
  425. /** 
  426. * Used by the overview views to display a list of available content items. 
  427. * The items are typically formatted like a taglist via CSS. 
  428. * @since 1.0.0 
  429. * @param WP_Post $item The item to display. 
  430. * @param string $tag The tag will be wrapped inside this HTML tag. 
  431. */ 
  432. public static function content_tag( $item, $tag = 'li' ) { 
  433. $label = property_exists( $item, 'post_title' ) ? $item->post_title : $item->name; 
  434.  
  435. if ( ! empty( $item->id ) && is_a( $item, 'WP_Post' ) ) { 
  436. printf( 
  437. '<%1$s class="ms-content-tag"><a href="%3$s">%2$s</a></%1$s>',  
  438. esc_attr( $tag ),  
  439. esc_html( $label ),  
  440. get_edit_post_link( $item->id ) 
  441. ); 
  442. else { 
  443. printf( 
  444. '<%1$s class="ms-content-tag"><span>%2$s</span></%1$s>',  
  445. esc_attr( $tag ),  
  446. esc_html( $label ) 
  447. ); 
  448.  
  449. public static function bread_crumbs( $bread_crumbs ) { 
  450. $crumbs = array(); 
  451. $html = ''; 
  452.  
  453. if ( is_array( $bread_crumbs ) ) { 
  454. foreach ( $bread_crumbs as $key => $bread_crumb ) { 
  455. if ( ! empty( $bread_crumb['url'] ) ) { 
  456. $crumbs[] = sprintf( 
  457. '<span class="ms-bread-crumb-%s"><a href="%s">%s</a></span>',  
  458. esc_attr( $key ),  
  459. $bread_crumb['url'],  
  460. $bread_crumb['title'] 
  461. ); 
  462. elseif ( ! empty( $bread_crumb['title'] ) ) { 
  463. $crumbs[] = sprintf( 
  464. '<span class="ms-bread-crumb-%s">%s</span>',  
  465. esc_attr( $key ),  
  466. $bread_crumb['title'] 
  467. ); 
  468.  
  469. if ( count( $crumbs ) > 0 ) { 
  470. $html = '<div class="ms-bread-crumb">'; 
  471. $html .= implode( '<span class="ms-bread-crumb-sep"> » </span>', $crumbs ); 
  472. $html .= '</div>'; 
  473. $html = apply_filters( 'ms_helper_html_bread_crumbs', $html ); 
  474.  
  475. printf( $html ); 
  476.  
  477. public static function period_desc( $period, $class = '' ) { 
  478. $html = sprintf( 
  479. '<span class="ms-period-desc %s"> <span class="ms-period-unit">%s</span> <span class="ms-period-type">%s</span></span>',  
  480. esc_attr( $class ),  
  481. $period['period_unit'],  
  482. $period['period_type'] 
  483. ); 
  484.  
  485. return apply_filters( 'ms_helper_html_period_desc', $html ); 
  486.