API tools faq
paste
Advertisement
Guest User

Untitled

a guest
Oct 7th, 2021
61
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 36.42 KB | None | 0 0
raw download clone embed print report
  1. <?php
  2. /**
  3. * Image with Hotspots
  4. *
  5. * Shortcode which inserts an image with one or many hotspots that show tooltips
  6. */
  7. if ( ! defined( 'ABSPATH' ) ) { exit; } // Exit if accessed directly
  8.  
  9.  
  10. if ( ! class_exists( 'avia_sc_image_hotspots' ) )
  11. {
  12. class avia_sc_image_hotspots extends aviaShortcodeTemplate
  13. {
  14. /**
  15. * @since 4.5.7.2
  16. * @var int
  17. */
  18. static protected $img_hotspot_count = 0;
  19.  
  20. /**
  21. * Create the config array for the shortcode button
  22. */
  23. function shortcode_insert_button()
  24. {
  25. $this->config['version'] = '1.0';
  26. $this->config['is_fullwidth'] = 'yes';
  27. $this->config['self_closing'] = 'no';
  28. $this->config['base_element'] = 'yes';
  29.  
  30. $this->config['name'] = __( 'Image with Hotspots', 'avia_framework' );
  31. $this->config['tab'] = __( 'Media Elements', 'avia_framework' );
  32. $this->config['icon'] = AviaBuilder::$path['imagesURL'] . 'sc-image-hotspot.png';
  33. $this->config['order'] = 95;
  34. $this->config['target'] = 'avia-target-insert';
  35. $this->config['shortcode'] = 'av_image_hotspot';
  36. $this->config['shortcode_nested'] = array( 'av_image_spot' );
  37. $this->config['modal_data'] = array( 'modal_class' => 'bigscreen' );
  38. $this->config['tooltip'] = __( 'Inserts an image with one or many hotspots that show tooltips', 'avia_framework' );
  39. $this->config['disabling_allowed'] = true;
  40. $this->config['id_name'] = 'id';
  41. $this->config['id_show'] = 'yes';
  42. }
  43.  
  44. function extra_assets()
  45. {
  46. //load css
  47. wp_enqueue_style( 'avia-module-hotspot', AviaBuilder::$path['pluginUrlRoot'] . 'avia-shortcodes/image_hotspots/image_hotspots.css', array( 'avia-layout' ), false );
  48.  
  49. //load js
  50. wp_enqueue_script( 'avia-module-hotspot', AviaBuilder::$path['pluginUrlRoot'] . 'avia-shortcodes/image_hotspots/image_hotspots.js', array( 'avia-shortcodes' ), false, true );
  51. }
  52.  
  53.  
  54. /**
  55. * Popup Elements
  56. *
  57. * If this function is defined in a child class the element automatically gets an edit button, that, when pressed
  58. * opens a modal window that allows to edit the element properties
  59. *
  60. * @return void
  61. */
  62. function popup_elements()
  63. {
  64. $this->elements = array(
  65.  
  66. array(
  67. 'type' => 'tab_container',
  68. 'nodescription' => true
  69. ),
  70.  
  71. array(
  72. 'type' => 'tab',
  73. 'name' => __( 'Content', 'avia_framework' ),
  74. 'nodescription' => true
  75. ),
  76.  
  77. array(
  78. 'type' => 'template',
  79. 'template_id' => $this->popup_key( 'content_image' )
  80. ),
  81.  
  82. array(
  83. 'type' => 'tab_close',
  84. 'nodescription' => true
  85. ),
  86.  
  87. array(
  88. 'type' => 'tab',
  89. 'name' => __( 'Styling', 'avia_framework' ),
  90. 'nodescription' => true
  91. ),
  92.  
  93. array(
  94. 'type' => 'template',
  95. 'template_id' => 'toggle_container',
  96. 'templates_include' => array(
  97. $this->popup_key( 'styling_image_size' ),
  98. $this->popup_key( 'styling_hotspot' )
  99. ),
  100. 'nodescription' => true
  101. ),
  102.  
  103. array(
  104. 'type' => 'tab_close',
  105. 'nodescription' => true
  106. ),
  107.  
  108. array(
  109. 'type' => 'tab',
  110. 'name' => __( 'Advanced', 'avia_framework' ),
  111. 'nodescription' => true
  112. ),
  113.  
  114. array(
  115. 'type' => 'toggle_container',
  116. 'nodescription' => true
  117. ),
  118.  
  119. array(
  120. 'type' => 'template',
  121. 'template_id' => $this->popup_key( 'advanced_animation' )
  122. ),
  123.  
  124. array(
  125. 'type' => 'template',
  126. 'template_id' => 'lazy_loading_toggle',
  127. 'lockable' => true
  128. ),
  129.  
  130. array(
  131. 'type' => 'template',
  132. 'template_id' => 'screen_options_toggle',
  133. 'templates_include' => array(
  134. $this->popup_key( 'advanced_mobile' ),
  135. 'screen_options_visibility'
  136. ),
  137. 'lockable' => true
  138. ),
  139.  
  140. array(
  141. 'type' => 'template',
  142. 'template_id' => 'developer_options_toggle',
  143. 'args' => array( 'sc' => $this )
  144. ),
  145.  
  146. array(
  147. 'type' => 'toggle_container_close',
  148. 'nodescription' => true
  149. ),
  150.  
  151. array(
  152. 'type' => 'tab_close',
  153. 'nodescription' => true
  154. ),
  155.  
  156. array(
  157. 'type' => 'template',
  158. 'template_id' => 'element_template_selection_tab',
  159. 'args' => array( 'sc' => $this )
  160. ),
  161.  
  162. array(
  163. 'type' => 'tab_container_close',
  164. 'nodescription' => true
  165. )
  166.  
  167. );
  168.  
  169.  
  170. }
  171.  
  172. /**
  173. * Create and register templates for easier maintainance
  174. *
  175. * @since 4.6.4
  176. */
  177. protected function register_dynamic_templates()
  178. {
  179.  
  180. $this->register_modal_group_templates();
  181.  
  182. /**
  183. * Content Tab
  184. * ===========
  185. */
  186. $c = array(
  187. array(
  188. 'name' => __( 'Choose Image','avia_framework' ),
  189. 'desc' => __( 'Either upload a new, or choose an existing image from your media library. Once an Image has been selected you can add your Hotspots', 'avia_framework' ),
  190. 'id' => 'src',
  191. 'type' => 'image',
  192. 'title' => __( 'Insert Image', 'avia_framework' ),
  193. 'button' => __( 'Insert', 'avia_framework' ),
  194. 'std' => AviaBuilder::$path['imagesURL'] . 'placeholder-full.jpg',
  195. 'container_class' => 'av-hotspot-container',
  196. 'lockable' => true,
  197. 'locked' => array( 'src', 'attachment', 'attachment_size' )
  198. ),
  199.  
  200. array(
  201. 'name' => __( 'Add/Edit your hotspots.', 'avia_framework' ),
  202. 'desc' => __( 'Here you can add, remove and edit the locations, tooltips and appearance for your hotspots.', 'avia_framework' ),
  203. 'type' => 'modal_group',
  204. 'id' => 'content',
  205. 'modal_title' => __( 'Edit Hotspot Tooltip', 'avia_framework' ),
  206. 'add_label' => __( 'Add Hotspot', 'avia_framework' ),
  207. 'std' => array(),
  208. 'editable_item' => true,
  209. 'lockable' => true,
  210. 'tmpl_set_default' => false,
  211. 'special_modal' => array(
  212. 'type' => 'hotspot',
  213. 'image_container_class' => 'av-hotspot-container'
  214. ),
  215. 'subelements' => $this->create_modal()
  216. )
  217. );
  218.  
  219. AviaPopupTemplates()->register_dynamic_template( $this->popup_key( 'content_image' ), $c );
  220.  
  221.  
  222. /**
  223. * Styling Tab
  224. * ===========
  225. */
  226.  
  227. $c = array(
  228. array(
  229. 'name' => __( 'Hotspot Styling', 'avia_framework' ),
  230. 'desc' => __( 'Select the hotspot styling', 'avia_framework' ),
  231. 'id' => 'hotspot_layout',
  232. 'type' => 'select',
  233. 'std' => 'numbered',
  234. 'lockable' => true,
  235. 'subtype' => array(
  236. __( 'Numbered Hotspot', 'avia_framework' ) => 'numbered',
  237. __( 'Blank Hotspot', 'avia_framework' ) => 'blank'
  238. )
  239. )
  240. );
  241.  
  242. $template = array(
  243. array(
  244. 'type' => 'template',
  245. 'template_id' => 'toggle',
  246. 'title' => __( 'Hotspot', 'avia_framework' ),
  247. 'content' => $c
  248. ),
  249. );
  250.  
  251. AviaPopupTemplates()->register_dynamic_template( $this->popup_key( 'styling_hotspot' ), $template );
  252.  
  253.  
  254. $c = array(
  255.  
  256. array(
  257. 'type' => 'template',
  258. 'template_id' => 'image_size_select',
  259. 'lockable' => true,
  260. 'method' => 'fallback_media'
  261. )
  262. );
  263.  
  264. $template = array(
  265. array(
  266. 'type' => 'template',
  267. 'template_id' => 'toggle',
  268. 'title' => __( 'Image Size', 'avia_framework' ),
  269. 'content' => $c
  270. ),
  271. );
  272.  
  273. AviaPopupTemplates()->register_dynamic_template( $this->popup_key( 'styling_image_size' ), $template );
  274.  
  275.  
  276. /**
  277. * Advanced Tab
  278. * =============
  279. */
  280.  
  281. $c = array(
  282. array(
  283. 'name' => __( 'Image Fade in Animation', 'avia_framework' ),
  284. 'desc' => __( "Add a small animation to the image when the user first scrolls to the image position. This is only to add some 'spice' to the site and only works in modern browsers", 'avia_framework' ),
  285. 'id' => 'animation',
  286. 'type' => 'select',
  287. 'std' => 'no-animation',
  288. 'lockable' => true,
  289. 'subtype' => array(
  290. __( 'None', 'avia_framework' ) => 'no-animation',
  291. __( 'Simple Fade in', 'avia_framework' ) => 'fade-in',
  292. __( 'Pop up', 'avia_framework' ) => 'pop-up',
  293. __( 'Top to Bottom', 'avia_framework' ) => 'top-to-bottom',
  294. __( 'Bottom to Top', 'avia_framework' ) => 'bottom-to-top',
  295. __( 'Left to Right', 'avia_framework' ) => 'left-to-right',
  296. __( 'Right to Left', 'avia_framework' ) => 'right-to-left'
  297. )
  298. ),
  299.  
  300. array(
  301. 'name' => __( 'Show Tooltips', 'avia_framework' ),
  302. 'desc' => __( 'Select when to display the tooltips', 'avia_framework' ),
  303. 'id' => 'hotspot_tooltip_display',
  304. 'type' => 'select',
  305. 'std' => '',
  306. 'lockable' => true,
  307. 'subtype' => array(
  308. __( 'On Mouse Hover', 'avia_framework' ) => '',
  309. __( 'Always', 'avia_framework' ) => 'av-permanent-tooltip',
  310. __( 'Show On Mouse Hover - Hide On Click', 'avia_framework' ) => 'av-close-on-click-tooltip'
  311. )
  312. )
  313.  
  314. );
  315.  
  316. $template = array(
  317. array(
  318. 'type' => 'template',
  319. 'template_id' => 'toggle',
  320. 'title' => __( 'Animation', 'avia_framework' ),
  321. 'content' => $c
  322. ),
  323. );
  324.  
  325. AviaPopupTemplates()->register_dynamic_template( $this->popup_key( 'advanced_animation' ), $template );
  326.  
  327. $c = array(
  328. array(
  329. 'name' => __( 'Hotspot on mobile devices', 'avia_framework' ),
  330. 'desc' => __( 'Check if you always want to show the tooltips on mobile phones below the image. Recommended if your tooltips contain a lot of text', 'avia_framework' ),
  331. 'id' => 'hotspot_mobile',
  332. 'type' => 'checkbox',
  333. 'std' => 'true',
  334. 'lockable' => true
  335. )
  336.  
  337. );
  338.  
  339. AviaPopupTemplates()->register_dynamic_template( $this->popup_key( 'advanced_mobile' ), $c );
  340.  
  341.  
  342.  
  343. }
  344.  
  345. /**
  346. * Creates the modal popup for a single entry
  347. *
  348. * @since 4.6.4
  349. * @return array
  350. */
  351. protected function create_modal()
  352. {
  353. $elements = array(
  354.  
  355. array(
  356. 'type' => 'tab_container',
  357. 'nodescription' => true
  358. ),
  359.  
  360. array(
  361. 'type' => 'tab',
  362. 'name' => __( 'Content', 'avia_framework' ),
  363. 'nodescription' => true
  364. ),
  365.  
  366. array(
  367. 'type' => 'template',
  368. 'template_id' => $this->popup_key( 'modal_content_text' )
  369. ),
  370.  
  371. array(
  372. 'type' => 'tab_close',
  373. 'nodescription' => true
  374. ),
  375.  
  376. array(
  377. 'type' => 'tab',
  378. 'name' => __( 'Styling', 'avia_framework' ),
  379. 'nodescription' => true
  380. ),
  381.  
  382. array(
  383. 'type' => 'template',
  384. 'template_id' => 'toggle_container',
  385. 'templates_include' => array(
  386. $this->popup_key( 'modal_styling_tooltip' ),
  387. $this->popup_key( 'modal_styling_colors' )
  388. ),
  389. 'nodescription' => true
  390. ),
  391.  
  392. array(
  393. 'type' => 'tab_close',
  394. 'nodescription' => true
  395. ),
  396.  
  397. array(
  398. 'type' => 'tab',
  399. 'name' => __( 'Advanced', 'avia_framework' ),
  400. 'nodescription' => true
  401. ),
  402.  
  403. array(
  404. 'type' => 'template',
  405. 'template_id' => 'toggle_container',
  406. 'templates_include' => array(
  407. $this->popup_key( 'modal_advanced_link' )
  408. ),
  409. 'nodescription' => true
  410. ),
  411.  
  412. array(
  413. 'type' => 'tab_close',
  414. 'nodescription' => true
  415. ),
  416.  
  417. array(
  418. 'type' => 'template',
  419. 'template_id' => 'element_template_selection_tab',
  420. 'args' => array(
  421. 'sc' => $this,
  422. 'modal_group' => true
  423. )
  424. ),
  425.  
  426. array(
  427. 'id' => 'hotspot_pos',
  428. 'std' => '',
  429. 'type' => 'hidden'
  430. ),
  431.  
  432. array(
  433. 'type' => 'tab_container_close',
  434. 'nodescription' => true
  435. )
  436.  
  437. );
  438.  
  439. return $elements;
  440. }
  441.  
  442. /**
  443. * Register all templates for the modal group popup
  444. *
  445. * @since 4.6.4
  446. */
  447. protected function register_modal_group_templates()
  448. {
  449. /**
  450. * Content Tab
  451. * ===========
  452. */
  453.  
  454. $c = array(
  455. array(
  456. 'name' => __( 'Tooltip', 'avia_framework' ),
  457. 'desc' => __( 'Enter a short descriptive text that appears if the user places his mouse above the hotspot', 'avia_framework' ) ,
  458. 'id' => 'content',
  459. 'type' => 'tiny_mce',
  460. 'std' => '',
  461. 'lockable' => true,
  462. 'tmpl_set_default' => false
  463. ),
  464.  
  465. );
  466.  
  467. AviaPopupTemplates()->register_dynamic_template( $this->popup_key( 'modal_content_text' ), $c );
  468.  
  469. /**
  470. * Styling Tab
  471. * ===========
  472. */
  473.  
  474. $c = array(
  475. array(
  476. 'name' => __( 'Tooltip Position', 'avia_framework' ),
  477. 'desc' => __( 'Select where to display the tooltip in relation to the hotspot', 'avia_framework' ),
  478. 'id' => 'tooltip_pos',
  479. 'type' => 'select',
  480. 'std' => 'av-tt-pos-above av-tt-align-left',
  481. 'lockable' => true,
  482. 'subtype' => array(
  483. 'Above' => array(
  484. __( 'Top Left', 'avia_framework' ) => 'av-tt-pos-above av-tt-align-left',
  485. __( 'Top Right', 'avia_framework' ) => 'av-tt-pos-above av-tt-align-right',
  486. __( 'Top Centered', 'avia_framework' ) => 'av-tt-pos-above av-tt-align-centered',
  487. ),
  488. 'Below' => array(
  489. __( 'Bottom Left', 'avia_framework' ) => 'av-tt-pos-below av-tt-align-left',
  490. __( 'Bottom Right', 'avia_framework' ) => 'av-tt-pos-below av-tt-align-right',
  491. __( 'Bottom Centered', 'avia_framework' ) => 'av-tt-pos-below av-tt-align-centered',
  492. ),
  493. 'Left' => array(
  494. __( 'Left Top', 'avia_framework' ) => 'av-tt-pos-left av-tt-align-top',
  495. __( 'Left Bottom', 'avia_framework' ) => 'av-tt-pos-left av-tt-align-bottom',
  496. __( 'Left Centered', 'avia_framework' ) => 'av-tt-pos-left av-tt-align-centered',
  497. ),
  498. 'Right'=> array(
  499. __( 'Right Top', 'avia_framework' ) => 'av-tt-pos-right av-tt-align-top',
  500. __( 'Right Bottom', 'avia_framework' ) => 'av-tt-pos-right av-tt-align-bottom',
  501. __( 'Right Centered', 'avia_framework' ) => 'av-tt-pos-right av-tt-align-centered',
  502. )
  503. )
  504. ),
  505.  
  506. array(
  507. 'name' => __( 'Tooltip Width', 'avia_framework' ),
  508. 'desc' => __( 'Select the width of the tooltip. Height is based on the content', 'avia_framework' ),
  509. 'id' => 'tooltip_width',
  510. 'type' => 'select',
  511. 'std' => 'av-tt-default-width',
  512. 'lockable' => true,
  513. 'subtype' => array(
  514. __( 'Default', 'avia_framework' ) => 'av-tt-default-width',
  515. __( 'Large', 'avia_framework' ) => 'av-tt-large-width',
  516. __( 'Extra Large', 'avia_framework' ) => 'av-tt-xlarge-width',
  517. ),
  518. ),
  519.  
  520. array(
  521. 'name' => __( 'Tooltip Style', 'avia_framework' ),
  522. 'desc' => __( 'Choose the style of your tooltip', 'avia_framework' ) ,
  523. 'id' => 'tooltip_style',
  524. 'type' => 'select',
  525. 'std' => 'main_color',
  526. 'lockable' => true,
  527. 'subtype' => array(
  528. __( 'Default', 'avia_framework' ) => 'main_color',
  529. __( 'Default with drop shadow', 'avia_framework' ) => 'main_color av-tooltip-shadow',
  530. __( 'Transparent Dark', 'avia_framework' ) => 'transparent_dark'
  531. )
  532. )
  533.  
  534. );
  535.  
  536. $template = array(
  537. array(
  538. 'type' => 'template',
  539. 'template_id' => 'toggle',
  540. 'title' => __( 'Tooltip', 'avia_framework' ),
  541. 'content' => $c
  542. ),
  543. );
  544.  
  545. AviaPopupTemplates()->register_dynamic_template( $this->popup_key( 'modal_styling_tooltip' ), $template );
  546.  
  547. $c = array(
  548. array(
  549. 'name' => __( 'Hotspot Color', 'avia_framework' ),
  550. 'desc' => __( 'Set the colors of your hotspot', 'avia_framework' ),
  551. 'id' => 'hotspot_color',
  552. 'type' => 'select',
  553. 'std' => '',
  554. 'lockable' => true,
  555. 'subtype' => array(
  556. __( 'Default', 'avia_framework' ) => '',
  557. __( 'Custom', 'avia_framework' ) => 'custom',
  558. ),
  559. ),
  560.  
  561. array(
  562. 'name' => __( 'Custom Background Color', 'avia_framework' ),
  563. 'desc' => __( 'Select a custom background color here', 'avia_framework' ),
  564. 'id' => 'custom_bg',
  565. 'type' => 'colorpicker',
  566. 'std' => '#ffffff',
  567. 'lockable' => true,
  568. 'required' => array( 'hotspot_color', 'equals', 'custom' )
  569. ),
  570.  
  571. array(
  572. 'name' => __( 'Custom Font Color', 'avia_framework' ),
  573. 'desc' => __( 'Select a custom font color here', 'avia_framework' ),
  574. 'id' => 'custom_font',
  575. 'type' => 'colorpicker',
  576. 'std' => '#888888',
  577. 'lockable' => true,
  578. 'required' => array( 'hotspot_color', 'equals', 'custom' )
  579. ),
  580.  
  581. array(
  582. 'name' => __( 'Custom Pulse Color', 'avia_framework' ),
  583. 'desc' => __( 'Select a custom pulse color here', 'avia_framework' ),
  584. 'id' => 'custom_pulse',
  585. 'type' => 'colorpicker',
  586. 'std' => '#ffffff',
  587. 'lockable' => true,
  588. 'required' => array( 'hotspot_color', 'equals', 'custom' )
  589. )
  590.  
  591. );
  592.  
  593. $template = array(
  594. array(
  595. 'type' => 'template',
  596. 'template_id' => 'toggle',
  597. 'title' => __( 'Colors', 'avia_framework' ),
  598. 'content' => $c
  599. ),
  600. );
  601.  
  602. AviaPopupTemplates()->register_dynamic_template( $this->popup_key( 'modal_styling_colors' ), $template );
  603.  
  604. /**
  605. * Advanced Tab
  606. * ============
  607. */
  608.  
  609. $c = array(
  610. array(
  611. 'type' => 'template',
  612. 'template_id' => 'linkpicker_toggle',
  613. 'name' => __( 'Hotspot Link?', 'avia_framework' ),
  614. 'desc' => __( 'Where should your hotspot link to?', 'avia_framework' ),
  615. 'target_id' => 'link_target',
  616. 'no_toggle' => true,
  617. 'lockable' => true,
  618. 'subtypes' => array( 'no', 'manually', 'single', 'taxonomy' )
  619. )
  620.  
  621. );
  622.  
  623. AviaPopupTemplates()->register_dynamic_template( $this->popup_key( 'modal_advanced_link' ), $c );
  624.  
  625. }
  626.  
  627.  
  628. /**
  629. * Editor Element - this function defines the visual appearance of an element on the AviaBuilder Canvas
  630. * Most common usage is to define some markup in the $params['innerHtml'] which is then inserted into the drag and drop container
  631. * Less often used: $params['data'] to add data attributes, $params['class'] to modify the className
  632. *
  633. *
  634. * @param array $params this array holds the default values for $content and $args.
  635. * @return $params the return array usually holds an innerHtml key that holds item specific markup.
  636. */
  637. function editor_element( $params )
  638. {
  639. $default = array();
  640. $locked = array();
  641. $attr = $params['args'];
  642. Avia_Element_Templates()->set_locked_attributes( $attr, $this, $this->config['shortcode'], $default, $locked );
  643.  
  644. $template = $this->update_template_lockable( 'src', "<img src='{{src}}' alt=''/>", $locked );
  645.  
  646. $img = '';
  647.  
  648. if( ! empty( $attr['attachment'] ) && ! empty( $attr['attachment_size'] ) )
  649. {
  650. $img = wp_get_attachment_image( $attr['attachment'], $attr['attachment_size'] );
  651. }
  652. else if( isset( $attr['src'] ) && is_numeric( $attr['src'] ) )
  653. {
  654. $img = wp_get_attachment_image( $attr['src'], 'large' );
  655. }
  656. else if( ! empty( $attr['src'] ) )
  657. {
  658. $img = "<img src='" . esc_attr( $attr['src'] ) . "' alt='' />";
  659. }
  660.  
  661.  
  662. $html = AviaPopupTemplates()->get_html_template( 'alb_element_fullwidth_stretch' );
  663. $button = '<span class="av_hotspot_image_caption button button-primary button-large">' . __( 'Image with Hotspots - Click to insert image and hotspots', 'avia_framework' ) . '</span>';
  664.  
  665. $pos = strrpos( $html, '</div>' );
  666. $html = substr( $html, 0, $pos ) . $button . '</div>';
  667.  
  668. $params['innerHtml'] = '<div class="avia_image avia_hotspot_image avia_image_style" data-update_element_template="yes">';
  669. $params['innerHtml'] .= "<div class='avia_image_container avia-align-center ' {$template}>{$img}</div>";
  670. $params['innerHtml'] .= $html;
  671. $params['innerHtml'] .= '</div>';
  672.  
  673. $params['class'] = '';
  674.  
  675. return $params;
  676. }
  677.  
  678. /**
  679. * Editor Sub Element - this function defines the visual appearance of an element that is displayed within a modal window and on click opens its own modal window
  680. * Works in the same way as Editor Element
  681. * @param array $params this array holds the default values for $content and $args.
  682. * @return $params the return array usually holds an innerHtml key that holds item specific markup.
  683. */
  684. function editor_sub_element( $params )
  685. {
  686. /**
  687. * Fix a bug in 4.7 and 4.7.1 renaming option id (no longer backwards comp.) - can be removed in a future version again
  688. */
  689. if( isset( $params['args']['linktarget'] ) )
  690. {
  691. $params['args']['link_target'] = $params['args']['linktarget'];
  692. }
  693.  
  694. $default = array();
  695. $locked = array();
  696. $attr = $params['args'];
  697. Avia_Element_Templates()->set_locked_attributes( $attr, $this, $this->config['shortcode_nested'][0], $default, $locked );
  698.  
  699. $params['innerHtml'] = '';
  700. $params['innerHtml'] .= "<div class='avia_title_container' data-hotspot_pos='{$attr['hotspot_pos']}' data-update_element_template='yes'>" . __( 'Hotspot', 'avia_framework' ) . ' </div>';
  701.  
  702. return $params;
  703. }
  704.  
  705. /**
  706. * Create custom stylings
  707. *
  708. * @since 4.8.4
  709. * @param array $args
  710. * @return array
  711. */
  712. protected function get_element_styles( array $args )
  713. {
  714. $result = parent::get_element_styles( $args );
  715.  
  716. extract( $result );
  717.  
  718. $default = array(
  719. 'animation' => 'no-animation',
  720. 'attachment' => '',
  721. 'attachment_size' => '',
  722. 'image_size' => '',
  723. 'hotspot_layout' => 'numbered',
  724. 'hotspot_mobile' => '',
  725. 'hotspot_tooltip_display' => '',
  726. 'lazy_loading' => 'disabled',
  727. 'src' => '',
  728. 'img_h' => '',
  729. 'img_w' => '',
  730. 'img_alt' => '',
  731. 'img_title' => '',
  732. 'attachment_id' => 0,
  733. 'hotspots' => array() // CET modified hotspots
  734. );
  735.  
  736. $default = $this->sync_sc_defaults_array( $default, 'no_modal_item', 'no_content' );
  737.  
  738. $locked = array();
  739. Avia_Element_Templates()->set_locked_attributes( $atts, $this, $shortcodename, $default, $locked, $content );
  740. Avia_Element_Templates()->add_template_class( $meta, $atts, $default );
  741.  
  742. $hotspots = ShortcodeHelper::shortcode2array( $content, 1 );
  743.  
  744. foreach( $hotspots as $key => &$item )
  745. {
  746. $item_def = $this->get_default_modal_group_args();
  747. Avia_Element_Templates()->set_locked_attributes( $item['attr'], $this, $this->config['shortcode_nested'][0], $item_def, $locked, $item['content'] );
  748. }
  749.  
  750. unset( $item );
  751.  
  752. $atts = shortcode_atts( $default, $atts, $this->config['shortcode'] );
  753.  
  754. // @since 4.8.6.3
  755. if( ! empty( $atts['image_size'] ) )
  756. {
  757. if( 'no scaling' == $atts['image_size'] )
  758. {
  759. $atts['image_size'] = 'full';
  760. }
  761.  
  762. $atts['attachment_size'] = $atts['image_size'];
  763. }
  764.  
  765. $atts['hotspots'] = $hotspots;
  766.  
  767. if( ! empty( $atts['attachment'] ) )
  768. {
  769. /**
  770. * Allows e.g. WPML to reroute to translated image
  771. */
  772. $posts = get_posts( array(
  773. 'include' => $atts['attachment'],
  774. 'post_status' => 'inherit',
  775. 'post_type' => 'attachment',
  776. 'post_mime_type' => 'image',
  777. 'order' => 'ASC',
  778. 'orderby' => 'post__in' )
  779. );
  780.  
  781. if( is_array( $posts ) && ! empty( $posts ) )
  782. {
  783. $attachment_entry = $posts[0];
  784. $atts['attachment_id'] = $attachment_entry->ID;
  785.  
  786. $alt = get_post_meta( $attachment_entry->ID, '_wp_attachment_image_alt', true );
  787. $atts['img_alt'] = ! empty( $alt ) ? esc_attr( $alt ) : '';
  788. $atts['img_title'] = trim( $attachment_entry->post_title ) ? esc_attr( $attachment_entry->post_title ) : '';
  789.  
  790. if( ! empty( $atts['attachment_size'] ) )
  791. {
  792. $src = wp_get_attachment_image_src( $attachment_entry->ID, $atts['attachment_size'] );
  793. $atts['img_h'] = ! empty( $src[2] ) ? $src[2] : '';
  794. $atts['img_w'] = ! empty( $src[1] ) ? $src[1] : '';
  795. $atts['src'] = ! empty( $src[0] ) ? $src[0] : '';
  796. }
  797. }
  798. }
  799.  
  800.  
  801.  
  802.  
  803. $classes = array(
  804. 'av-hotspot-image-container',
  805. $element_id
  806. );
  807.  
  808. $element_styling->add_classes( 'container', $classes );
  809. $element_styling->add_classes_from_array( 'container', $meta, 'el_class' );
  810.  
  811.  
  812. if( ! empty( $atts['src'] ) )
  813. {
  814. //some custom classes
  815. $element_styling->add_classes( 'container', array( "av-hotspot-{$atts['hotspot_layout']}", $atts['hotspot_tooltip_display'] ) );
  816.  
  817. if( $atts['animation'] != 'no-animation' )
  818. {
  819. $element_styling->add_classes( 'container', array( 'avia_animated_image', 'avia_animate_when_almost_visible', $atts['animation'] ) );
  820. }
  821.  
  822. if( ! empty( $atts['hotspot_mobile'] ) )
  823. {
  824. $element_styling->add_classes( 'container', 'av-mobile-fallback-active' );
  825. }
  826. }
  827.  
  828.  
  829. $selectors = array(
  830. 'container' => ".av-hotspot-image-container.{$element_id}"
  831. );
  832.  
  833. $element_styling->add_selectors( $selectors );
  834.  
  835. $result['default'] = $default;
  836. $result['atts'] = $atts;
  837. $result['content'] = $content;
  838. $result['element_styling'] = $element_styling;
  839. $result['meta'] = $meta;
  840.  
  841. return $result;
  842. }
  843.  
  844. /**
  845. * Create custom stylings for items
  846. * (also called when creating header implicit)
  847. *
  848. * @since 4.8.4
  849. * @param array $args
  850. * @return array
  851. */
  852. protected function get_element_styles_item( array $args )
  853. {
  854. $result = parent::get_element_styles_item( $args );
  855.  
  856. extract( $result );
  857.  
  858. /**
  859. * Fix a bug in 4.7 and 4.7.1 renaming option id (no longer backwards comp.) - can be removed in a future version again
  860. */
  861. if( isset( $atts['linktarget'] ) )
  862. {
  863. $atts['link_target'] = $atts['linktarget'];
  864. }
  865.  
  866. $default = array(
  867. 'tooltip_width' => 'av-tt-default-width',
  868. 'tooltip_pos' => 'av-tt-pos-above av-tt-align-left',
  869. 'hotspot_pos' => '50,50',
  870. 'output' => '',
  871. 'hotspot_color' => '',
  872. 'custom_bg' => '',
  873. 'custom_font' => '',
  874. 'custom_pulse' => '',
  875. 'tooltip_style' => 'main_color',
  876. 'link' => '',
  877. 'link_target' => ''
  878. );
  879.  
  880. $default = $this->sync_sc_defaults_array( $default, 'modal_item', 'no_content' );
  881.  
  882. $atts = shortcode_atts( $default, $atts, $this->config['shortcode_nested'][0] );
  883.  
  884. // hidden, set in editor
  885. if( empty( $atts['hotspot_pos'] ) )
  886. {
  887. $atts['hotspot_pos'] = '50,50';
  888. }
  889.  
  890. $classes = array(
  891. 'av-image-hotspot',
  892. $element_id
  893. );
  894.  
  895. $element_styling->add_classes( 'container', $classes );
  896.  
  897.  
  898. $hotspot_pos = explode( ',', $atts['hotspot_pos'] );
  899. $element_styling->add_styles( 'container', array(
  900. 'top' => $hotspot_pos[0] . '%',
  901. 'left' => $hotspot_pos[1] . '%'
  902. ) );
  903.  
  904. if( 'custom' == $atts['hotspot_color'] )
  905. {
  906. $element_styling->add_styles( 'container-inner', array(
  907. 'background-color' => $atts['custom_bg'],
  908. 'color' => $atts['custom_font']
  909. ) );
  910.  
  911. $element_styling->add_styles( 'container-pulse', array( 'background-color' => $atts['custom_pulse'] ) );
  912. }
  913.  
  914.  
  915. $selectors = array(
  916. 'container' => ".av-hotspot-image-container .av-image-hotspot.{$element_id}",
  917. 'container-inner' => ".av-hotspot-image-container .av-image-hotspot.{$element_id} .av-image-hotspot_inner",
  918. 'container-pulse' => ".av-hotspot-image-container .av-image-hotspot.{$element_id} .av-image-hotspot-pulse",
  919. );
  920.  
  921. $element_styling->add_selectors( $selectors );
  922.  
  923. $result['default'] = $default;
  924. $result['atts'] = $atts;
  925. $result['content'] = $content;
  926. $result['element_styling'] = $element_styling;
  927.  
  928. return $result;
  929. }
  930.  
  931. /**
  932. * Frontend Shortcode Handler
  933. *
  934. * @param array $atts array of attributes
  935. * @param string $content text within enclosing form of shortcode element
  936. * @param string $shortcodename the shortcode found, when == callback name
  937. * @return string $output returns the modified html string
  938. */
  939. function shortcode_handler( $atts, $content = '', $shortcodename = '', $meta = '' )
  940. {
  941. $result = $this->get_element_styles( compact( array( 'atts', 'content', 'shortcodename', 'meta' ) ) );
  942.  
  943. extract( $result );
  944.  
  945. extract( AviaHelper::av_mobile_sizes( $atts ) ); //return $av_font_classes, $av_title_font_classes and $av_display_classes
  946.  
  947. extract( $atts );
  948.  
  949. if( 'disabled' == $atts['img_scrset'] )
  950. {
  951. Av_Responsive_Images()->force_disable( 'disabled' );
  952. }
  953.  
  954. avia_sc_image_hotspots::$img_hotspot_count ++;
  955.  
  956. $output = '';
  957.  
  958. //no src? return
  959. if( ! empty( $src ) )
  960. {
  961. $extra_class = ! ShortcodeHelper::is_top_level() ? ' av-non-fullwidth-hotspot-image' : '';
  962.  
  963. $hotspot_html = '';
  964. $tooltip_html = '';
  965. $counter = 1;
  966.  
  967. foreach( $hotspots as $hotspot )
  968. {
  969. if( ! empty( $hotspot_mobile ) )
  970. {
  971. $tooltip_html .= $this->add_fallback_tooltip( $hotspot, $counter, $hotspot_tooltip_display );
  972. }
  973.  
  974. $extraClass = ! empty( $hotspot_mobile ) ? ' av-mobile-fallback-active ' : '';
  975. $extraClass .= ! empty( $hotspot_tooltip_display ) ? " {$hotspot_tooltip_display}-single " : '';
  976.  
  977. $hotspot_html .= $this->add_hotspot( $hotspot, $counter, $extraClass, $hotspot_tooltip_display );
  978. $counter ++;
  979. }
  980.  
  981. $hw = '';
  982. if( ! empty( $img_h ) )
  983. {
  984. $hw .= ' height="' . $img_h . '"';
  985. }
  986. if( ! empty( $img_w ) )
  987. {
  988. $hw .= ' width="' . $img_w . '"';
  989. }
  990.  
  991. $markup_img = avia_markup_helper( array( 'context' => 'image', 'echo' => false, 'custom_markup' => $meta['custom_markup'] ) );
  992. $markup_url = avia_markup_helper( array( 'context' => 'image_url', 'echo' => false, 'custom_markup' => $meta['custom_markup'] ) );
  993.  
  994. $el_id = ShortcodeHelper::is_top_level() ? '' : $meta['custom_el_id'];
  995. $img_tag = "<img class='avia_image' src='{$src}' alt='{$img_alt}' title='{$img_title}' {$hw} {$markup_url} />";
  996. $img_tag = Av_Responsive_Images()->prepare_single_image( $img_tag, $attachment_id, $lazy_loading );
  997.  
  998.  
  999. $style_tag = $element_styling->get_style_tag( $element_id );
  1000. $item_tag = $element_styling->style_tag_html( $this->subitem_inline_styles, 'sub-' . $element_id );
  1001. $container_class = $element_styling->get_class_string( 'container' );
  1002.  
  1003. $output .= $style_tag;
  1004. $output .= $item_tag;
  1005. $output .= "<div {$el_id} class='{$container_class} {$av_display_classes} {$extra_class}' {$markup_img}>";
  1006. $output .= "<div class='av-hotspot-container'>";
  1007. $output .= "<div class='av-hotspot-container-inner-cell'>";
  1008. $output .= "<div class='av-hotspot-container-inner-wrap'>";
  1009. $output .= $hotspot_html;
  1010. $output .= $img_tag;
  1011. $output .= '</div>';
  1012. $output .= '</div>';
  1013. $output .= '</div>';
  1014. $output .= $tooltip_html;
  1015. $output .= '</div>';
  1016. }
  1017.  
  1018. $output = Av_Responsive_Images()->make_content_images_responsive( $output );
  1019.  
  1020. Av_Responsive_Images()->force_disable( 'reset' );
  1021.  
  1022. $this->subitem_inline_styles = '';
  1023.  
  1024. if( ! ShortcodeHelper::is_top_level() )
  1025. {
  1026. return $output;
  1027. }
  1028.  
  1029. $skipSecond = false;
  1030. $params['class'] = "main_color av-fullwidth-hotspots {$meta['el_class']} {$av_display_classes}";
  1031. $params['open_structure'] = false;
  1032. $params['id'] = AviaHelper::save_string( $meta['custom_id_val'] , '-', 'av-sc-img-hotspot-' . avia_sc_image_hotspots::$img_hotspot_count );
  1033. $params['custom_markup'] = $meta['custom_markup'];
  1034.  
  1035. //we don't need a closing structure if the element is the first one or if a previous fullwidth element was displayed before
  1036. if( $meta['index'] == 0 )
  1037. {
  1038. $params['close'] = false;
  1039. }
  1040.  
  1041. if( ! empty( $meta['siblings']['prev']['tag'] ) && in_array( $meta['siblings']['prev']['tag'], AviaBuilder::$full_el_no_section ) )
  1042. {
  1043. $params['close'] = false;
  1044. }
  1045.  
  1046. $section = avia_new_section( $params );
  1047. $section .= $output;
  1048. $section .= '</div>'; //close section
  1049.  
  1050.  
  1051. //if the next tag is a section dont create a new section from this shortcode
  1052. if( ! empty( $meta['siblings']['next']['tag'] ) && in_array( $meta['siblings']['next']['tag'], AviaBuilder::$full_el ) )
  1053. {
  1054. $skipSecond = true;
  1055. }
  1056.  
  1057. //if there is no next element dont create a new section.
  1058. if( empty( $meta['siblings']['next']['tag'] ) )
  1059. {
  1060. $skipSecond = true;
  1061. }
  1062.  
  1063. if( empty( $skipSecond ) )
  1064. {
  1065. $section .= avia_new_section( array( 'close' => false, 'id' => 'after_image_hotspots' ) );
  1066. }
  1067.  
  1068. return $section;
  1069. }
  1070.  
  1071. /**
  1072. *
  1073. * @since < 4.0
  1074. * @param array $hotspot
  1075. * @param int $counter
  1076. * @param string $extraClass
  1077. * @param string $hotspot_tooltip_display
  1078. * @return string
  1079. */
  1080. protected function add_hotspot( array $hotspot, $counter, $extraClass = '', $hotspot_tooltip_display = '' )
  1081. {
  1082. // init parameters for normal shortcode handler
  1083. $atts = $hotspot['attr'];
  1084. $content = $hotspot['content'];
  1085. $shortcodename = $this->config['shortcode_nested'][0];
  1086.  
  1087.  
  1088. $result = $this->get_element_styles_item( compact( array( 'atts', 'content', 'shortcodename' ) ) );
  1089.  
  1090. extract( $result );
  1091.  
  1092. extract( $atts );
  1093.  
  1094. // prepare content for data attribute
  1095. $content = esc_attr( ShortcodeHelper::avia_apply_autop( ShortcodeHelper::avia_remove_autop( $content ) ) );
  1096.  
  1097. $tags = array( 'div', 'div' );
  1098. if( ! empty( $link ) )
  1099. {
  1100. $link = AviaHelper::get_url( $link, false );
  1101. $blank = AviaHelper::get_link_target( $link_target );
  1102. $tags = array( "a href={$link} {$blank}", 'a' );
  1103. }
  1104.  
  1105. $layout = explode( ' ', $tooltip_pos );
  1106. $data_pos = isset( $layout[0] ) ? str_replace( 'av-tt-pos-', '', $layout[0] ) : 'top';
  1107. $data_align = isset( $layout[1] ) ? str_replace( 'av-tt-align-', '', $layout[1] ) : 'centered';
  1108.  
  1109. switch( $data_pos )
  1110. {
  1111. case 'above':
  1112. $data_pos = 'top';
  1113. break;
  1114. case 'below':
  1115. $data_pos = 'bottom';
  1116. break;
  1117. }
  1118.  
  1119.  
  1120. $this->subitem_inline_styles .= $element_styling->get_style_tag( $element_id, 'rules_only' );
  1121. $container_class = $element_styling->get_class_string( 'container' );
  1122.  
  1123. $output .= "<div class='{$container_class} av-image-hotspot-{$counter} {$hotspot_tooltip_display}' data-avia-tooltip-position='{$data_pos}' data-avia-tooltip-alignment='{$data_align}' data-avia-tooltip-class='{$tooltip_width} {$tooltip_pos} {$extraClass} {$tooltip_style} av-tt-hotspot' data-avia-tooltip='{$content}'>";
  1124. $output .= "<{$tags[0]} class='av-image-hotspot_inner'>{$counter}</{$tags[1]}>";
  1125. $output .= "<div class='av-image-hotspot-pulse'></div>";
  1126. $output .= '</div>';
  1127.  
  1128. return $output;
  1129. }
  1130.  
  1131. /**
  1132. *
  1133. * @param array $hotspot
  1134. * @param int $counter
  1135. * @param string $hotspot_tooltip_display
  1136. * @return string
  1137. */
  1138. protected function add_fallback_tooltip( $hotspot, $counter, $hotspot_tooltip_display = '' )
  1139. {
  1140. $content = $hotspot['content'];
  1141.  
  1142. if( empty( $content ) )
  1143. {
  1144. return;
  1145. }
  1146.  
  1147. $output = '';
  1148. $output .= "<div class='av-hotspot-fallback-tooltip av-image-hotspot-{$counter} {$hotspot_tooltip_display}'>";
  1149. $output .= '<div class="av-hotspot-fallback-tooltip-count">';
  1150. $output .= $counter;
  1151. $output .= '<div class="avia-arrow"></div>';
  1152. $output .= '</div>';
  1153. $output .= '<div class="av-hotspot-fallback-tooltip-inner clearfix">';
  1154. $output .= ShortcodeHelper::avia_apply_autop( $content );
  1155. $output .= '</div>';
  1156. $output .= '</div>';
  1157.  
  1158. return $output;
  1159. }
  1160.  
  1161. }
  1162. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!