API tools faq
paste
milenbogoev

Untitled

milenbogoev
Jul 12th, 2023
117
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 151.36 KB | None | 0 0
raw download clone embed print report
  1.  
  2. text/x-generic carousel.php ( C++ source, ASCII text, with very long lines )
  3. <?php
  4.  
  5. class ExtraCarousel extends OxygenExtraElements {
  6.  
  7. var $js_added = false;
  8. var $js_fullscreen_added = false;
  9. var $js_fade_added = false;
  10. var $bg_lazy_added = false;
  11. var $sync_added = false;
  12. var $hash_added = false;
  13. var $css_added = false;
  14.  
  15. function name() {
  16. return __('Carousel Builder');
  17. }
  18.  
  19. function icon() {
  20. return plugin_dir_url(__FILE__) . 'assets/icons/'.basename(__FILE__, '.php').'.svg';
  21. }
  22.  
  23. function enablePresets() {
  24. return true;
  25. }
  26.  
  27. function enableFullPresets() {
  28. return true;
  29. }
  30.  
  31. function init() {
  32.  
  33. $this->El->useAJAXControls();
  34. $this->enableNesting();
  35.  
  36. }
  37.  
  38.  
  39. function extras_button_place() {
  40. return "interactive";
  41. }
  42.  
  43.  
  44. function render($options, $defaults, $content) {
  45.  
  46.  
  47. // get options
  48. $nav_type = isset( $options['nav_type'] ) ? esc_attr($options['nav_type']) : "";
  49. $prev_icon = isset( $options['prev_icon'] ) ? esc_attr($options['prev_icon']) : "";
  50. $next_icon = isset( $options['next_icon'] ) ? esc_attr($options['next_icon']) : "";
  51.  
  52. $contain = isset( $options['contain'] ) ? esc_attr($options['contain']) : "";
  53. $percentage_position = isset( $options['percentage_position'] ) ? esc_attr($options['percentage_position']) : "";
  54. $free_scroll = isset( $options['free_scroll'] ) ? esc_attr($options['free_scroll']) : "";
  55. $draggable = isset( $options['draggable'] ) ? esc_attr($options['draggable']) : "";
  56. $wrap_around = isset( $options['wrap_around'] ) ? esc_attr($options['wrap_around']) : "";
  57. $maybe_group = isset( $options['maybe_group'] ) ? esc_attr($options['maybe_group']) : "";
  58. $group_cells = isset( $options['group_cells'] ) ? esc_attr($options['group_cells']) : "1";
  59. $group_percent = isset( $options['group_percent'] ) ? esc_attr($options['group_percent']) : "1";
  60. $maybe_pause_autoplay = isset( $options['maybe_pause_autoplay'] ) ? esc_attr($options['maybe_pause_autoplay']) : "";
  61. $autoplay = isset( $options['autoplay'] ) ? esc_attr($options['autoplay']) : "";
  62. $initial_index = isset( $options['initial_index'] ) ? esc_attr($options['initial_index']) : "";
  63. $maybe_accessibility = isset( $options['maybe_accessibility'] ) ? esc_attr($options['maybe_accessibility']) : "";
  64. $cell_align = isset( $options['cell_align'] ) ? esc_attr($options['cell_align']) : "";
  65. $right_to_left = isset( $options['right_to_left'] ) ? esc_attr($options['right_to_left']) : "";
  66. $images_loaded = isset( $options['images_loaded'] ) ? esc_attr($options['images_loaded']) : "";
  67. $page_dots = isset( $options['page_dots'] ) ? esc_attr($options['page_dots']) : "";
  68. $lazy_cells = isset( $options['lazy_cells'] ) ? esc_attr($options['lazy_cells']) : "";
  69. $maybe_lazy = isset( $options['maybe_lazy'] ) ? esc_attr($options['maybe_lazy']) : "";
  70. $as_nav_for = isset( $options['as_nav_for'] ) ? esc_attr($options['as_nav_for']) : "";
  71. $click_to_select = isset( $options['click_to_select'] ) ? esc_attr($options['click_to_select']) : "false";
  72.  
  73. $parallax_bg = isset( $options['parallax_bg'] ) ? esc_attr($options['parallax_bg']) : "false";
  74. $parallax_bg_control = isset( $options['parallax_bg_control'] ) ? esc_attr($options['parallax_bg_control']) : "5";
  75. $maybe_force_heights = isset( $options['maybe_force_heights'] ) ? esc_attr($options['maybe_force_heights']) : "";
  76.  
  77. $drag_threshold = isset( $options['drag_threshold'] ) ? esc_attr($options['drag_threshold']) : "";
  78. $selected_attraction = isset( $options['selected_attraction'] ) ? esc_attr($options['selected_attraction']) : "";
  79. $friction = isset( $options['friction'] ) ? esc_attr($options['friction']) : "";
  80. $free_scroll_friction = isset( $options['free_scroll_friction'] ) ? esc_attr($options['free_scroll_friction']) : "";
  81.  
  82. $maybe_ticker = isset( $options['maybe_ticker'] ) ? esc_attr($options['maybe_ticker']) : "";
  83. $ticker = isset( $options['ticker'] ) ? esc_attr($options['ticker']) : "";
  84.  
  85. $acf_field_name = isset( $options['acf_field_name'] ) ? esc_attr($options['acf_field_name']) : "";
  86. $gallery_image_size = isset( $options['gallery_image_size'] ) ? esc_attr($options['gallery_image_size']) : "large";
  87. $acf_return_format = isset( $options['acf_return_format'] ) ? esc_attr($options['acf_return_format']) : "";
  88.  
  89. $metabox_image_field = isset( $options['metabox_image_field'] ) ? esc_attr($options['metabox_image_field']) : "";
  90. $metabox_group_field = isset( $options['metabox_group_field'] ) ? esc_attr($options['metabox_group_field']) : "";
  91.  
  92. $metabox_data_source = isset( $options['metabox_data_source'] ) ? esc_attr($options['metabox_data_source']) : "";
  93. $metabox_option_name = isset( $options['metabox_option_name'] ) ? esc_attr($options['metabox_option_name']) : "";
  94. $metabox_post_id = isset( $options['metabox_post_id'] ) ? esc_attr($options['metabox_post_id']) : "";
  95.  
  96. $shuffle = isset( $options['random_order'] ) ? esc_attr($options['random_order']) : "false";
  97.  
  98. $acf_post_id = isset( $options['acf_post_id'] ) ? esc_attr($options['acf_post_id']) : "";
  99.  
  100. if ('options' === esc_attr($options['acf_post_id'])) {
  101. $post_id = "options";
  102. } elseif ('custom' === esc_attr($options['acf_post_id'])) {
  103. $post_id = esc_attr($options['custom_post_id']);
  104. } else {
  105. $post_id = false;
  106. }
  107.  
  108. $maybe_main_product = isset( $options['maybe_main_product'] ) ? esc_attr($options['maybe_main_product']) : "";
  109.  
  110. $maybe_captions = isset( $options['maybe_captions'] ) ? esc_attr($options['maybe_captions']) : "";
  111.  
  112. $maybe_fade = isset( $options['maybe_fade'] ) ? esc_attr($options['maybe_fade']) : "";
  113.  
  114. $ticker_hover_pause = isset( $options['ticker_hover_pause'] ) ? esc_attr($options['ticker_hover_pause']) : "";
  115.  
  116. $maybe_links = isset( $options['maybe_links'] ) ? esc_attr($options['maybe_links']) : "";
  117.  
  118. $trigger_animations = isset( $options['trigger_animations'] ) ? esc_attr($options['trigger_animations']) : "";
  119.  
  120. $trigger_animations_delay = isset( $options['trigger_animations_delay'] ) ? esc_attr($options['trigger_animations_delay']) : "";
  121.  
  122. $maybe_sync = isset( $options['maybe_sync'] ) ? esc_attr($options['maybe_sync']) : "";
  123.  
  124. $sync_carousel = isset( $options['sync_carousel'] ) ? esc_attr($options['sync_carousel']) : "";
  125.  
  126. $resume_autoplay = isset( $options['resume_autoplay'] ) ? esc_attr($options['resume_autoplay']) : "";
  127.  
  128. $maybe_fouc = isset( $options['maybe_fouc'] ) ? esc_attr($options['maybe_fouc']) : "";
  129. $maybe_srcset = isset( $options['maybe_srcset'] ) ? esc_attr($options['maybe_srcset']) : "";
  130.  
  131. $maybe_hash = isset( $options['maybe_hash'] ) ? esc_attr($options['maybe_hash']) : "";
  132.  
  133. $id = esc_attr($options['selector']);
  134.  
  135. $maybe_cell_selector = isset( $options['maybe_cell_selector'] ) ? esc_attr($options['maybe_cell_selector']) : "";
  136.  
  137. $no_image = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mNgYAAAAAMAASsJTYQAAAAASUVORK5CYII=';
  138.  
  139.  
  140. if ( isset( $options['carousel_type'] ) && esc_attr($options['carousel_type']) === 'repeater' ) {
  141. $carousel_selector = '.oxy-dynamic-list';
  142. }
  143. else if ( isset( $options['carousel_type'] ) && esc_attr($options['carousel_type']) === 'woo' ) {
  144. $carousel_selector = 'ul.products';
  145. }
  146. else if ( isset( $options['carousel_type'] ) && esc_attr($options['carousel_type']) === 'easy_posts' ) {
  147. $carousel_selector = '.oxy-posts';
  148. }
  149. else if ( isset( $options['carousel_type'] ) && (esc_attr($options['carousel_type']) === 'acf_gallery' || esc_attr($options['carousel_type']) === 'medialibrary' || esc_attr($options['carousel_type']) === 'woo_gallery' || esc_attr($options['carousel_type']) === 'metabox_image')) {
  150. $carousel_selector = '.oxy-carousel-builder_gallery-images';
  151. }
  152. else {
  153. $carousel_selector = '.oxy-inner-content';
  154. }
  155.  
  156.  
  157. if ( isset( $options['carousel_type'] ) && esc_attr($options['carousel_type']) === 'woo' ) {
  158. $cell_selector = '.product';
  159. }
  160. else if ( isset( $options['carousel_type'] ) && esc_attr($options['carousel_type']) === 'easy_posts' ) {
  161. $cell_selector = '.oxy-post';
  162. }
  163. else if ( isset( $options['carousel_type'] ) && esc_attr($options['carousel_type']) === 'custom' ) {
  164. $cell_selector = '.cell';
  165. }
  166. else if ( isset( $options['carousel_type'] ) && (esc_attr($options['carousel_type']) === 'acf_gallery' || esc_attr($options['carousel_type']) === 'medialibrary' || esc_attr($options['carousel_type']) === 'woo_gallery' || esc_attr($options['carousel_type']) === 'metabox_image')) {
  167. $cell_selector = '.oxy-carousel-builder_gallery-image';
  168. }
  169. else {
  170. $cell_selector = isset( $options['cell_selector'] ) ? esc_attr($options['cell_selector']) : "";
  171. }
  172.  
  173.  
  174. if ( isset( $options['nav_type'] ) && esc_attr($options['nav_type']) === 'custom' ) {
  175. $previous_selector = isset( $options['previous_selector'] ) ? esc_attr($options['previous_selector']) : "";
  176. $next_selector = isset( $options['next_selector'] ) ? esc_attr($options['next_selector']) : "";
  177. } else {
  178. if ( ! function_exists('do_oxygen_elements') ) {
  179. $previous_selector = '#'. esc_attr($options['selector']) . ' .oxy-carousel-builder_prev';
  180. $next_selector = '#'. esc_attr($options['selector']) . ' .oxy-carousel-builder_next';
  181. } else {
  182. $previous_selector = '.oxy-carousel-builder_prev';
  183. $next_selector = '.oxy-carousel-builder_next';
  184. }
  185. }
  186.  
  187.  
  188. global $oxygen_svg_icons_to_load;
  189. $oxygen_svg_icons_to_load[] = $next_icon;
  190. $oxygen_svg_icons_to_load[] = $prev_icon;
  191.  
  192. $output = '';
  193. $this->dequeue_scripts_styles();
  194.  
  195. $output .= '<div class="oxy-carousel-builder_inner oxy-inner-content';
  196.  
  197. $output .= ('true' !== $maybe_fouc) || (defined('OXY_ELEMENTS_API_AJAX') && OXY_ELEMENTS_API_AJAX) ? '': ' oxy-carousel-builder_hidden oxy-carousel-builder_fadein ';
  198.  
  199. $output .= (defined('OXY_ELEMENTS_API_AJAX') && OXY_ELEMENTS_API_AJAX) ? ' extras-in-builder ' : '';
  200.  
  201. $output .= '" ';
  202.  
  203. $output .= 'data-prev="' . $previous_selector . '" ';
  204. $output .= 'data-next="' . $next_selector . '" ';
  205. $output .= 'data-contain="' . $contain . '" ';
  206. $output .= 'data-percent="' . $percentage_position . '" ';
  207. $output .= 'data-freescroll="' . $free_scroll . '" ';
  208. $output .= 'data-draggable="' . $draggable . '" ';
  209. $output .= 'data-wraparound="' . $wrap_around . '" ';
  210. $output .= 'data-carousel="' . $carousel_selector . '" ';
  211. $output .= 'data-cell="' . $cell_selector . '" ';
  212.  
  213. if ( ( 'true' === $maybe_cell_selector ) && ( 'repeater' === esc_attr($options['carousel_type']) ) ) {
  214. $output .= 'data-repeater-cell="true" ';
  215. }
  216.  
  217. $output .= 'data-dragthreshold="' . $drag_threshold . '" ';
  218. $output .= 'data-selectedattraction="' . $selected_attraction . '" ';
  219. $output .= 'data-friction="' . $friction . '" ';
  220. $output .= 'data-freescrollfriction="' . $free_scroll_friction . '" ';
  221. $output .= 'data-forceheight="' . $maybe_force_heights . '" ';
  222. $output .= 'data-fade="' . $maybe_fade . '" ';
  223. $output .= 'data-tickerpause="' . $ticker_hover_pause . '" ';
  224.  
  225. if (isset( $options['parallax_bg'] ) && esc_attr($options['parallax_bg']) === 'false') {
  226. // No grouping if we have parallax on
  227.  
  228. if ('true' === $maybe_group) {
  229. $output .= 'data-groupcells="true" ';
  230. }
  231.  
  232. else if ('percent' === $maybe_group) {
  233. $output .= 'data-groupcells="' . $group_percent . '%" ';
  234. }
  235.  
  236. else if ('false' === $maybe_group) {
  237. $output .= 'data-groupcells="false" ';
  238. }
  239.  
  240. else {
  241. $output .= 'data-groupcells="' . $group_cells . '" ';
  242. }
  243.  
  244.  
  245. }
  246.  
  247. if (isset( $options['maybe_lazy'] ) && esc_attr($options['maybe_lazy']) === 'true') {
  248.  
  249. $output .= 'data-lazy="' . $lazy_cells . '" ';
  250.  
  251. }
  252.  
  253. if (isset( $options['maybe_bg_lazy'] ) && esc_attr($options['maybe_bg_lazy']) === 'true') {
  254.  
  255. $output .= 'data-bg-lazy="' . $lazy_cells . '" ';
  256.  
  257. }
  258.  
  259. if (isset( $options['maybe_resume_autoplay'] ) && esc_attr($options['maybe_resume_autoplay']) === 'true') {
  260.  
  261. $output .= 'data-resume-autoplay="' . $resume_autoplay . '" ';
  262.  
  263. }
  264.  
  265.  
  266. $output .= 'data-autoplay="' . $autoplay . '" ';
  267. $output .= 'data-pauseautoplay="' . $maybe_pause_autoplay . '" ';
  268. $output .= 'data-hash="' . $maybe_hash . '" ';
  269. $output .= 'data-initial="' . $initial_index . '" ';
  270. $output .= 'data-accessibility="' . $maybe_accessibility . '" ';
  271. $output .= 'data-cellalign="' . $cell_align . '" ';
  272. $output .= 'data-righttoleft="' . $right_to_left . '" ';
  273. $output .= 'data-images-loaded="' . $images_loaded . '" ';
  274. $output .= 'data-pagedots="' . $page_dots . '" ';
  275. $output .= 'data-trigger-aos="' . $trigger_animations . '" ';
  276.  
  277. $output .= ('true' === $trigger_animations) ? 'data-trigger-aos-delay="' . $trigger_animations_delay . '" ' : '';
  278.  
  279. $output .= 'data-clickselect="' . $click_to_select . '" ';
  280.  
  281.  
  282. if (isset( $options['wrap_around'] ) && esc_attr($options['wrap_around']) === 'false') {
  283. // No parallax if wrap around is on.
  284. $output .= 'data-parallaxbg="' . $parallax_bg . '" ';
  285. $output .= 'data-bgspeed="' . $parallax_bg_control . '" ';
  286. }
  287.  
  288. if (isset( $options['editor_mode'] ) && esc_attr($options['editor_mode']) === 'preview') {
  289.  
  290. $output .= 'data-preview="true" ';
  291.  
  292. }
  293.  
  294. if ( isset( $options['maybe_asnavfor'] ) && esc_attr($options['maybe_asnavfor']) === 'true' ) {
  295.  
  296. $output .= 'data-asnavfor="' . $as_nav_for . '" ';
  297.  
  298. }
  299.  
  300. if ( isset( $options['maybe_sync'] ) && esc_attr($options['maybe_sync']) === 'true' ) {
  301.  
  302. $output .= 'data-sync="' . $sync_carousel . '" ';
  303.  
  304. }
  305.  
  306.  
  307. if ( isset( $options['adaptive_height'] ) && esc_attr($options['adaptive_height']) === 'true' ) {
  308.  
  309. $output .= 'data-adaptheight="true" ';
  310.  
  311. }
  312.  
  313. if ( isset( $options['maybe_fullscreen'] ) && esc_attr($options['maybe_fullscreen']) === 'true' ) {
  314.  
  315. $output .= 'data-fullscreen="true" ';
  316.  
  317. }
  318.  
  319.  
  320. $output .= 'data-tick="' . $maybe_ticker . '" ';
  321.  
  322.  
  323. if ( isset( $options['maybe_ticker'] ) && esc_attr($options['maybe_ticker']) === 'true' ) {
  324.  
  325. $output .= 'data-ticker="' . $ticker . '" ';
  326. }
  327.  
  328.  
  329. $output .= '>';
  330.  
  331. $gallery_src_attr = ( (defined('OXY_ELEMENTS_API_AJAX') && OXY_ELEMENTS_API_AJAX) || ( 'true' !== $maybe_lazy ) ) ? 'src' : 'data-flickity-lazyload';
  332. $gallery_srcset_attr = ( (defined('OXY_ELEMENTS_API_AJAX') && OXY_ELEMENTS_API_AJAX) || ( 'true' !== $maybe_lazy ) ) ? 'srcset' : 'data-flickity-lazyload-srcset';
  333.  
  334.  
  335.  
  336. if ( ( esc_attr($options['carousel_type']) !== 'acf_gallery' ) && ( esc_attr($options['carousel_type']) !== 'medialibrary' ) && ( esc_attr($options['carousel_type']) !== 'woo_gallery' ) && ( esc_attr($options['carousel_type']) !== 'metabox_image' ) ) {
  337.  
  338. if ( $content ) {
  339.  
  340. if ( function_exists('do_oxygen_elements') ) {
  341. $output .= do_oxygen_elements($content);
  342. }
  343. else {
  344. $output .= do_shortcode($content);
  345. }
  346.  
  347. }
  348.  
  349.  
  350. } else if ( esc_attr($options['carousel_type']) === 'metabox_image' ) {
  351.  
  352. if ( !function_exists( 'rwmb_meta' ) ) {
  353. return;
  354. }
  355.  
  356. if ('settings' === $metabox_data_source) {
  357. $metabox_args = ['object_type' => 'setting', 'size' => $gallery_image_size];
  358. $post_id = $metabox_option_name;
  359. }
  360. else if ('custom' === $metabox_data_source) {
  361. $metabox_args = ['size' => $gallery_image_size];
  362. $post_id = $metabox_post_id;
  363. }
  364. else {
  365. $metabox_args = ['size' => $gallery_image_size];
  366. $post_id = null;
  367. }
  368.  
  369. if ( empty( $metabox_group_field ) ) {
  370. $images = rwmb_meta( $metabox_image_field, $metabox_args, $post_id );
  371. }
  372.  
  373. else {
  374. $image_group = rwmb_meta( $metabox_group_field, $metabox_args, $post_id );
  375. $images = isset( $image_group[$metabox_image_field] ) ? $image_group[$metabox_image_field] : '';
  376. }
  377.  
  378. if( $images ) {
  379.  
  380. if ('true' === $shuffle) {
  381. shuffle($images);
  382. }
  383.  
  384. $output .= '<div class=oxy-carousel-builder_gallery-images>';
  385. foreach ( $images as $key => $image ) {
  386.  
  387. if ( !empty( $metabox_group_field ) ) {
  388. $image = RWMB_Image_Field::file_info( $image, array( 'size' => $gallery_image_size ) );
  389. }
  390.  
  391. if ('true' === $maybe_links) {
  392. $output .= '<a href="'. $image['full_url']. '" class="oxy-carousel-builder_gallery-image" id=' . $id . '-' . $key . '>';
  393. } else {
  394. $output .= '<div class="oxy-carousel-builder_gallery-image" id=' . $id . '-' . $key . '>';
  395. }
  396. $output .= $image['caption'] && ('true' === $maybe_captions) ? '<span class="oxy-carousel-builder_gallery-image-wrapper">' : '';
  397. if ('false' !== $maybe_srcset) {
  398. $output .= ( 'true' !== $maybe_lazy ) ? wp_get_attachment_image( $image['ID'], $gallery_image_size, array( "alt" => $image['alt'] ), array( 'loading' => false ) ) : '<img src="'. $no_image .'" '. $gallery_srcset_attr .'="'. wp_get_attachment_image_srcset( $image['ID'], $gallery_image_size ) .'" alt="' . $image['alt'] . '">';
  399. } else {
  400. if ( 'true' !== $maybe_lazy ) {
  401. $output .= wp_get_attachment_image( $image['ID'], $gallery_image_size, false, array( 'loading' => false, 'srcset' => wp_get_attachment_image_url( $image['ID'], $gallery_image_size ) ) );
  402. } else {
  403. $output .= '<img '. $gallery_src_attr .'="'. wp_get_attachment_image_url( $image['ID'], $gallery_image_size ) .'" alt="' . $image['alt'] . '">';
  404. }
  405.  
  406. }
  407. $output .= $image['caption'] && ('true' === $maybe_captions) ? '<span class="oxy-carousel-builder_caption">'. $image['caption'] .'</span></span>' : '';
  408.  
  409. $output .= ('true' === $maybe_links) ? '</a>' : '</div>';
  410. }
  411. $output .= '</div>';
  412. }
  413.  
  414.  
  415. } else if ( esc_attr($options['carousel_type']) === 'acf_gallery' ) {
  416.  
  417. if ( !function_exists( 'get_field' ) ) {
  418. return;
  419. }
  420.  
  421. $images = get_field($acf_field_name, $post_id) ? get_field($acf_field_name, $post_id) : get_sub_field($acf_field_name);
  422. $size = $gallery_image_size;
  423.  
  424. if( $images ) {
  425.  
  426. if ('true' === $shuffle) {
  427. shuffle($images);
  428. }
  429.  
  430. $output .= '<div class=oxy-carousel-builder_gallery-images>';
  431. foreach( $images as $key => $image_id ):
  432.  
  433. if ('true' === $maybe_links) {
  434. $output .= '<a href="';
  435. $output .= 'array' === $acf_return_format ? $image_id['url'] : wp_get_attachment_url( $image_id );
  436. $output .= '" class="oxy-carousel-builder_gallery-image" id=' . $id . '-' . $key . '>';
  437. } else {
  438. $output .= '<div class="oxy-carousel-builder_gallery-image" id=' . $id . '-' . $key . '>';
  439. }
  440.  
  441. if ('array' === $acf_return_format) {
  442.  
  443. //$output .= 'gallery size: ' . $gallery_image_size;
  444. //$output .= '<br> image src: ' . esc_url($image_id['sizes'][$size]);
  445.  
  446. $image_source = ('full' === $gallery_image_size) ? esc_url($image_id['url']) : esc_url($image_id['sizes'][$gallery_image_size]);
  447.  
  448. $output .= $image_id['caption'] && ('true' === $maybe_captions) ? '<span class="oxy-carousel-builder_gallery-image-wrapper">' : '';
  449. $output .= '<img '. $gallery_src_attr .'="'. $image_source .'" alt="' . $image_id['alt'] . '" />';
  450. $output .= $image_id['caption'] && ('true' === $maybe_captions) ? '<span class="oxy-carousel-builder_caption">'. $image_id['caption'] .'</span></span>' : '';
  451. } else {
  452. $image_alt = get_post_meta( $image_id, '_wp_attachment_image_alt', true);
  453. $output .= ( 'true' !== $maybe_lazy ) ? wp_get_attachment_image( $image_id, $size, '', array( "alt" => $image_alt ), array( 'loading' => false ) ) : '<img '. $gallery_src_attr .'="'. wp_get_attachment_image_url( $image_id, $size ) .'" '. $gallery_srcset_attr .'="'. wp_get_attachment_image_srcset( $image_id, $size ) .'" alt="'. $image_alt .'">';
  454. }
  455.  
  456. $output .= ('true' === $maybe_links) ? '</a>' : '</div>';
  457.  
  458.  
  459. endforeach;
  460. $output .= '</div>';
  461.  
  462. }
  463.  
  464. } else if ( esc_attr($options['carousel_type']) === 'woo_gallery' ) {
  465.  
  466. if (!function_exists('wc_get_product')){
  467. return;
  468. }
  469.  
  470. if (!wc_get_product()) {
  471. return;
  472. }
  473.  
  474. $images = wc_get_product()->get_gallery_image_ids();
  475.  
  476. if ('true' === $maybe_main_product) {
  477. $product_image = wc_get_product()->get_image_id();
  478. array_unshift($images,$product_image);
  479. }
  480.  
  481. if( $images ) {
  482.  
  483. if ('true' === $shuffle) {
  484. shuffle($images);
  485. }
  486.  
  487. $output .= '<div class=oxy-carousel-builder_gallery-images>';
  488.  
  489. foreach( $images as $key => $image_id ) {
  490.  
  491. if ('true' === $maybe_links) {
  492. $output .= '<a href="';
  493. $output .= wp_get_attachment_url( $image_id );
  494. $output .= '" class="oxy-carousel-builder_gallery-image" id=' . $id . '-' . $key . '>';
  495. } else {
  496. $output .= '<div class="oxy-carousel-builder_gallery-image" id=' . $id . '-' . $key . '>';
  497. }
  498.  
  499. $output .= wp_get_attachment_image( $image_id, $gallery_image_size );
  500.  
  501. $output .= ('true' === $maybe_links) ? '</a>' : '</div>';
  502.  
  503. }
  504.  
  505. $output .= '</div>';
  506.  
  507. }
  508.  
  509. } else {
  510.  
  511. $images = explode( ",", $options['media_images'] );
  512. $size = $gallery_image_size;
  513.  
  514. if( $images ) {
  515.  
  516. if ('true' === $shuffle) {
  517. shuffle($images);
  518. }
  519.  
  520. $output .= '<div class=oxy-carousel-builder_gallery-images>';
  521.  
  522. foreach( $images as $key => $image_id ):
  523.  
  524. if ('true' === $maybe_links) {
  525. $output .= '<a href="'. wp_get_attachment_url( $image_id ) . '" class="oxy-carousel-builder_gallery-image" id=' . $id . '-' . $key . '>';
  526. } else {
  527. $output .= '<div class="oxy-carousel-builder_gallery-image" id=' . $id . '-' . $key . '>';
  528. }
  529.  
  530. $output .= wp_get_attachment_caption($image_id) && ('true' === $maybe_captions) ? '<span class="oxy-carousel-builder_gallery-image-wrapper">' : '';
  531.  
  532. if ('false' !== $maybe_srcset) {
  533. $output .= ( 'true' !== $maybe_lazy ) ? wp_get_attachment_image( $image_id, $size, false, array( 'loading' => false ) ) : '<img '. $gallery_srcset_attr .'="'. wp_get_attachment_image_srcset( $image_id, $size ) .'" alt="' . get_post_meta($image_id, '_wp_attachment_image_alt', TRUE) . '">';
  534. } else {
  535. $output .= ( 'true' !== $maybe_lazy ) ? wp_get_attachment_image( $image_id, $size, false, array( 'loading' => false, 'srcset' => wp_get_attachment_image_url( $image_id, $size ) ) ) : '<img '. $gallery_src_attr .'="'. wp_get_attachment_image_url( $image_id, $size ) .'" alt="' . get_post_meta($image_id, '_wp_attachment_image_alt', TRUE) . '">';
  536. }
  537. $output .= wp_get_attachment_caption($image_id) && ('true' === $maybe_captions) ? '<span class="oxy-carousel-builder_caption">'. wp_get_attachment_caption($image_id) .'</span></span>' : '';
  538.  
  539. $output .= ('true' === $maybe_links) ? '</a>' : '</div>';
  540.  
  541. endforeach;
  542. $output .= '</div>';
  543.  
  544. }
  545.  
  546.  
  547. }
  548.  
  549. $output .= '</div>';
  550.  
  551. if ('icon' === $nav_type) {
  552.  
  553. $output .= '<div class="oxy-carousel-builder_icon oxy-carousel-builder_prev"><svg id="prev' . esc_attr($options['selector']) . '"><use xlink:href="#' . $prev_icon .'"></use></svg></span></div>';
  554. $output .= '<div class="oxy-carousel-builder_icon oxy-carousel-builder_next"><svg id="next' . esc_attr($options['selector']) . '"><use xlink:href="#' . $next_icon .'"></use></svg></span></div>';
  555.  
  556. }
  557.  
  558. echo $output;
  559.  
  560. $inline = "jQuery('#%%ELEMENT_ID%%').find('.oxy-inner-content').after('<ol class=flickity-page-dots><li class=dot></li><li class=dot></li><li class=dot></li></ol>');";
  561.  
  562. if (isset( $options['editor_mode'] ) && esc_attr($options['editor_mode']) === 'preview') {
  563.  
  564. if (defined('OXY_ELEMENTS_API_AJAX') && OXY_ELEMENTS_API_AJAX) {
  565. echo '<script type="text/javascript" src="'. plugin_dir_url( __FILE__ ) . 'assets/flickity/flickity.pkgd.min.js?ver=2.2.1'.'" id="flickity-js"></script>';
  566. echo '<script type="text/javascript" src="'. plugin_dir_url( __FILE__ ) . 'assets/flickity/flickity-fade.js?ver=2.2.1'.'" id="flickity-fade-js"></script>';
  567. }
  568.  
  569. $inline .= file_get_contents( plugin_dir_path(__FILE__) . 'assets/flickity/flickity.js' );
  570.  
  571. }
  572.  
  573. if( method_exists('OxygenElement', 'builderInlineJS') ) {
  574. $this->El->builderInlineJS($inline);
  575. }
  576.  
  577. // Only load each JS file once
  578. if ($this->js_added !== true) {
  579. if (!defined('OXY_ELEMENTS_API_AJAX') || !OXY_ELEMENTS_API_AJAX) {
  580. add_action( 'wp_footer', array( $this, 'output_js' ) );
  581. }
  582. }
  583.  
  584. if ( isset( $options['maybe_fullscreen'] ) && esc_attr($options['maybe_fullscreen']) === 'true' ) {
  585.  
  586. if ($this->js_fullscreen_added !== true) {
  587. if (!defined('OXY_ELEMENTS_API_AJAX') || !OXY_ELEMENTS_API_AJAX) {
  588. add_action( 'wp_footer', array( $this, 'output_fullscreen_js' ), 12 );
  589. }
  590. $this->js_fullscreen_added = true;
  591. }
  592.  
  593. }
  594.  
  595. if ( isset( $options['maybe_fade'] ) && esc_attr($options['maybe_fade']) === 'true' ) {
  596.  
  597. if ($this->js_fade_added !== true) {
  598. if (!defined('OXY_ELEMENTS_API_AJAX') || !OXY_ELEMENTS_API_AJAX) {
  599. add_action( 'wp_footer', array( $this, 'output_fade_js' ), 12 );
  600. }
  601. $this->js_fade_added = true;
  602.  
  603. }
  604.  
  605. }
  606.  
  607. if ( isset( $options['maybe_bg_lazy'] ) && esc_attr($options['maybe_bg_lazy']) === 'true' ) {
  608.  
  609. if ($this->bg_lazy_added !== true) {
  610. if (!defined('OXY_ELEMENTS_API_AJAX') || !OXY_ELEMENTS_API_AJAX) {
  611. add_action( 'wp_footer', array( $this, 'output_bg_lazy_js' ), 12 );
  612. }
  613. $this->bg_lazy_added = true;
  614.  
  615. }
  616.  
  617. }
  618.  
  619. if ( isset( $options['maybe_hash'] ) && esc_attr($options['maybe_hash']) === 'true' ) {
  620.  
  621. if ($this->bg_lazy_added !== true) {
  622. if (!defined('OXY_ELEMENTS_API_AJAX') || !OXY_ELEMENTS_API_AJAX) {
  623. add_action( 'wp_footer', array( $this, 'output_hash_js' ), 12 );
  624. }
  625. $this->hash_added = true;
  626.  
  627. }
  628.  
  629. }
  630.  
  631. if ( isset( $options['maybe_sync'] ) && esc_attr($options['maybe_sync']) === 'true' ) {
  632.  
  633. if ($this->sync_added !== true) {
  634. if (!defined('OXY_ELEMENTS_API_AJAX') || !OXY_ELEMENTS_API_AJAX) {
  635. add_action( 'wp_footer', array( $this, 'output_sync_js' ), 13 );
  636. }
  637. $this->sync_added = true;
  638. }
  639.  
  640. }
  641.  
  642. if ($this->js_added !== true) {
  643. if (!defined('OXY_ELEMENTS_API_AJAX') || !OXY_ELEMENTS_API_AJAX) {
  644. add_action( 'wp_footer', array( $this, 'output_init_js' ), 15 );
  645. }
  646. $this->js_added = true;
  647. }
  648.  
  649.  
  650.  
  651. }
  652.  
  653.  
  654. function class_names() {
  655. return array('');
  656. }
  657.  
  658. function controls() {
  659.  
  660. /**
  661. * Selectors
  662. */
  663. $gallery_cell_selector = '.oxy-carousel-builder_gallery-image';
  664. $repeater_div = '.oxy-dynamic-list > .ct-div-block, .oxy-dynamic-list .flickity-slider > .ct-div-block';
  665. $product_list_div = 'ul.products .product, ul.products .flickity-slider > .product';
  666. $easy_posts_div = '.oxy-posts .oxy-post';
  667. $cell_div = '.cell';
  668. $dots_selector = '.flickity-page-dots';
  669. $dot_selector = '.flickity-page-dots .dot';
  670. $dot_selected_selector = '.flickity-page-dots .dot.is-selected';
  671. $cell_selected = '.is-selected';
  672. $cell_previous = '.is-previous';
  673. $cell_next = '.is-next';
  674.  
  675.  
  676.  
  677.  
  678. $editor_mode_control = $this->addOptionControl(
  679. array(
  680. 'type' => 'buttons-list',
  681. 'name' => __('In-Editor Mode'),
  682. 'slug' => 'editor_mode',
  683. )
  684.  
  685. )->setValue(array(
  686. "edit" => "Edit",
  687. "preview" => "Preview",
  688. )
  689. )->setDefaultValue('edit');
  690. $editor_mode_control->setParam("description", __("Always click 'Apply Params' button to apply"));
  691. $editor_mode_control->setParam('ng_show', "!iframeScope.isEditing('state')&&!iframeScope.isEditing('media')");
  692.  
  693.  
  694. $this->addOptionControl(
  695. array(
  696. 'type' => 'dropdown',
  697. 'name' => 'Carousel content',
  698. 'slug' => 'carousel_type',
  699. )
  700. )->setValue(array(
  701. "repeater" => "Repeater",
  702. "easy_posts" => "Easy posts",
  703. "woo" => "Woo components",
  704. "woo_gallery" => "Woo product gallery",
  705. "acf_gallery" => "ACF Gallery",
  706. "metabox_image" => "Meta Box gallery",
  707. "custom" => "Custom elements (.cell)",
  708. "medialibrary" => "Media library gallery",
  709. )
  710. )->setValueCSS( array(
  711. "woo" => "",
  712. "custom" => "
  713. .oxy-inner-content {
  714. display: flex;
  715. flex-direction: row;
  716. flex-wrap: nowrap;
  717. }
  718. .cell {
  719. flex-shrink: 0;
  720. }
  721.  
  722. .oxy-carousel-builder_hidden {
  723. display: none;
  724. }
  725. ",
  726. "acf_gallery" => "
  727. .oxy-inner-content > *:not('.oxy-carousel-builder_gallery-images'){
  728. display: none;
  729. }
  730. ",
  731. "metabox_image" => "
  732. .oxy-inner-content > *:not('.oxy-carousel-builder_gallery-images'){
  733. display: none;
  734. }
  735. ",
  736. "medialibrary" => "
  737. .oxy-inner-content > *:not('.oxy-carousel-builder_gallery-images'){
  738. display: none;
  739. }
  740. ",
  741. "woo_gallery" => "
  742. .oxy-inner-content > *:not('.oxy-carousel-builder_gallery-images'){
  743. display: none;
  744. }
  745. ",
  746.  
  747.  
  748. ) )->setParam('ng_show', "!iframeScope.isEditing('state')");
  749.  
  750.  
  751. $mediaLibraryControl = $this->addCustomControl("
  752. <div class='oxygen-control'>
  753. <div class='oxygen-file-input'
  754. ng-class=\"{'oxygen-option-default':iframeScope.isInherited(iframeScope.component.active.id, 'media_images')}\">
  755. <input type=\"text\" spellcheck=\"false\" ng-model=\"iframeScope.component.options[iframeScope.component.active.id]['model']['media_images']\" ng-model-options=\"{ debounce: 10 }\"
  756. ng-change=\"iframeScope.setOption(iframeScope.component.active.id,'oxy-carousel-builder','media_images');\">
  757. <div class=\"oxygen-file-input-browse\"
  758. data-mediaTitle=\"Select Images\"
  759. data-mediaButton=\"Select Images\"
  760. data-mediaMultiple=\"true\"
  761. data-mediaProperty=\"media_images\"
  762. data-mediaType=\"gallery\">". __("Browse","oxygen") . "
  763. </div>
  764. </div>
  765. </div>",
  766. 'media_images'
  767. );
  768. $mediaLibraryControl->setParam('ng_show', "iframeScope.component.options[iframeScope.component.active.id]['model']['oxy-carousel-builder_carousel_type']=='medialibrary'");
  769. $mediaLibraryControl->setParam('heading', __('Image IDs', 'oxygen'));
  770.  
  771.  
  772. $this->addOptionControl(
  773. array(
  774. 'type' => 'dropdown',
  775. 'name' => __('ACF field source'),
  776. 'slug' => 'acf_post_id',
  777. 'condition' => 'carousel_type=acf_gallery'
  778. )
  779.  
  780. )->setDefaultValue('page')->setValue(array(
  781. "options" => "Options page",
  782. "page" => "Current page",
  783. "custom" => "Custom post ID"
  784. )
  785. );
  786.  
  787. $this->addOptionControl(
  788. array(
  789. 'type' => 'textfield',
  790. 'name' => __('Post ID'),
  791. 'slug' => 'custom_post_id',
  792. 'condition' => 'carousel_type=acf_gallery&&acf_post_id=custom'
  793. )
  794. );
  795.  
  796. $this->addOptionControl(
  797. array(
  798. "type" => 'textfield',
  799. "name" => __('ACF gallery field name'),
  800. "slug" => 'acf_field_name',
  801. "default" => '',
  802. "condition" => 'carousel_type=acf_gallery'
  803. )
  804. );
  805.  
  806. $this->addOptionControl(
  807. array(
  808. 'type' => 'dropdown',
  809. 'name' => __('Data source'),
  810. 'slug' => 'metabox_data_source',
  811. 'condition' => 'carousel_type=metabox_image'
  812. )
  813.  
  814. )->setDefaultValue('page')->setValue(array(
  815. "settings" => "Settings page",
  816. "page" => "Current page",
  817. "custom" => "Post ID"
  818. )
  819. );
  820.  
  821. $this->addOptionControl(
  822. array(
  823. 'type' => 'textfield',
  824. 'name' => __('Option name'),
  825. 'slug' => 'metabox_option_name',
  826. 'condition' => 'carousel_type=metabox_image&&metabox_data_source=settings'
  827. )
  828. );
  829.  
  830. $this->addOptionControl(
  831. array(
  832. 'type' => 'textfield',
  833. 'name' => __('Post ID'),
  834. 'slug' => 'metabox_post_id',
  835. 'default' => '1',
  836. 'condition' => 'carousel_type=metabox_image&&metabox_data_source=custom'
  837. )
  838. )->setParam('dynamicdatacode', '<div optionname="\'oxy-pro-accordion_metabox_post_id\'" class="oxygen-dynamic-data-browse" ctdynamicdata data="iframeScope.dynamicShortcodesContentMode" callback="iframeScope.insertDynamicDataShortcode">data</div>');
  839.  
  840.  
  841.  
  842. $this->addOptionControl(
  843. array(
  844. 'type' => 'buttons-list',
  845. 'name' => __("Image return format"),
  846. 'slug' => 'acf_return_format',
  847. "condition" => 'carousel_type=acf_gallery'
  848. )
  849.  
  850. )->setValue(array(
  851. "array" => "Image Array",
  852. "id" => "Image ID",
  853. )
  854. )->setDefaultValue('id');
  855.  
  856. $this->addOptionControl(
  857. array(
  858. "type" => 'textfield',
  859. "name" => __('Metabox image field'),
  860. "slug" => 'metabox_image_field',
  861. "default" => '',
  862. "condition" => 'carousel_type=metabox_image'
  863. )
  864. );
  865.  
  866. $this->addOptionControl(
  867. array(
  868. "type" => 'textfield',
  869. "name" => __('Group field (leave blank if not in group)'),
  870. "slug" => 'metabox_group_field',
  871. "default" => '',
  872. "condition" => 'carousel_type=metabox_image'
  873. )
  874. );
  875.  
  876.  
  877. $image_sizes = get_intermediate_image_sizes();
  878. $image_sizes[] = "full";
  879.  
  880. $this->addOptionControl(
  881. array(
  882. "type" => "dropdown",
  883. "name" => __("Image Size"),
  884. "slug" => "gallery_image_size",
  885. //"default" => 'full',
  886. "condition" => 'carousel_type=acf_gallery||carousel_type=medialibrary||carousel_type=metabox_image||carousel_type=woo_gallery'
  887. )
  888. )->setValue($image_sizes)
  889. ->rebuildElementOnChange();
  890.  
  891.  
  892. $this->addOptionControl(
  893. array(
  894. 'type' => 'buttons-list',
  895. 'name' => __("Include main product image"),
  896. 'slug' => 'maybe_main_product',
  897. "condition" => 'carousel_type=woo_gallery'
  898. )
  899.  
  900. )->setValue(array(
  901. "true" => "True",
  902. "false" => "False",
  903. )
  904. )->setDefaultValue('false')
  905. ->rebuildElementOnChange();
  906.  
  907.  
  908. $this->addOptionControl(
  909. array(
  910. 'type' => 'buttons-list',
  911. 'name' => __("Add links to images"),
  912. 'slug' => 'maybe_links',
  913. "condition" => 'carousel_type=acf_gallery||carousel_type=medialibrary||carousel_type=metabox_image||carousel_type=woo_gallery'
  914. )
  915.  
  916. )->setValue(array(
  917. "true" => "True",
  918. "false" => "False",
  919. )
  920. )->setDefaultValue('false')
  921. ->setParam("description", __("For lightbox compatibility use the link selector '.oxy-carousel-builder_gallery-image' in the lightbox settings"));
  922.  
  923. $this->addOptionControl(
  924. array(
  925. 'type' => 'buttons-list',
  926. 'name' => __("Random order"),
  927. 'slug' => 'random_order',
  928. "condition" => 'carousel_type=acf_gallery||carousel_type=medialibrary||carousel_type=metabox_image||carousel_type=woo_gallery'
  929. )
  930.  
  931. )->setValue(array(
  932. "true" => "True",
  933. "false" => "False",
  934. )
  935. )->setDefaultValue('false')
  936. ->rebuildElementOnChange();
  937.  
  938.  
  939.  
  940.  
  941. /**
  942. * Cells
  943. */
  944. $cells_section = $this->addControlSection("cells_section", __("Cells"), "assets/icon.png", $this);
  945.  
  946.  
  947. $cells_section->addOptionControl(
  948. array(
  949. 'type' => 'dropdown',
  950. 'name' => __('Prioritize property'),
  951. 'slug' => 'prioritise_width',
  952. "condition" => 'editor_mode!=preview&&carousel_type!=easy_posts&&carousel_type!=custom&&carousel_type!=woo&&carousel_type!=repeater'
  953. )
  954.  
  955. )->setValue(array(
  956. "enable" => "Width (setting the width only)",
  957. "disable" => "Height (setting the height only)",
  958. "none" => "None (setting both)",
  959. )
  960. )->setDefaultValue('none')
  961. ->setValueCSS( array(
  962. "enable" => " .oxy-carousel-builder_gallery-image img {
  963. height: auto;
  964. width: 100%;
  965. }
  966.  
  967. .oxy-carousel-builder_gallery-images {
  968. height: auto;
  969. }",
  970. "none" => " .oxy-carousel-builder_gallery-image {
  971. display: flex;
  972. }",
  973.  
  974. ) )->setParam("description", __("To preserve the image aspect ratio, choose which property you are setting. <a style='color: lightskyblue;' target='_blank' href=https://oxyextras.com/understanding-cell-dimensions-in-the-carousel-builder/ >more info</a>"));
  975.  
  976.  
  977. $cells_section->addOptionControl(
  978. array(
  979. 'type' => 'dropdown',
  980. 'name' => __('Width setting'),
  981. 'slug' => 'maybe_autofit',
  982. "condition" => 'editor_mode!=preview'
  983. )
  984.  
  985. )->setValue(array(
  986. "width" => "Set width value",
  987. "auto" => "Set no. of visible cells",
  988. )
  989. )->setDefaultValue('width')
  990. ->setValueCSS( array(
  991. "auto" => " .oxy-posts .oxy-post {
  992. margin-right: var(--carousel-space-between);
  993. width: var(--carousel-cell-width);
  994. }
  995.  
  996. .cell {
  997. margin-right: var(--carousel-space-between);
  998. width: var(--carousel-cell-width);
  999. }
  1000.  
  1001. .oxy-carousel-builder_gallery-image {
  1002. margin-right: var(--carousel-space-between);
  1003. width: var(--carousel-cell-width);
  1004. }
  1005.  
  1006. .oxy-dynamic-list > .ct-div-block, .oxy-dynamic-list .flickity-slider > .ct-div-block {
  1007. margin-right: var(--carousel-space-between);
  1008. width: var(--carousel-cell-width);
  1009. }
  1010.  
  1011. ul.products .product, ul.products .flickity-slider > .product {
  1012. margin-right: var(--carousel-space-between);
  1013. width: var(--carousel-cell-width);
  1014. }
  1015. ",
  1016. )
  1017. );
  1018.  
  1019.  
  1020. $cells_section->addOptionControl(
  1021. array(
  1022. 'type' => 'buttons-list',
  1023. 'name' => __('No. of visible cells in carousel viewport'),
  1024. 'slug' => 'autofit',
  1025. "condition" => 'editor_mode!=preview&&maybe_autofit=auto'
  1026. )
  1027.  
  1028. )->setValue(array(
  1029. "1" => "1",
  1030. "2" => "2",
  1031. "3" => "3",
  1032. "4" => "4",
  1033. "6" => "6",
  1034. "8" => "8",
  1035. )
  1036. )->setValueCSS( array(
  1037. "1" => " {
  1038. --carousel-cell-width: 100%;
  1039. }
  1040. ",
  1041. "2" => " {
  1042. --carousel-cell-width: calc((100% - var(--carousel-space-between)) / 2);
  1043. }
  1044. ",
  1045. "3" => " {
  1046. --carousel-cell-width: calc((100% - (2 * var(--carousel-space-between))) / 3);
  1047. }
  1048. ",
  1049. "4" => " {
  1050. --carousel-cell-width: calc((100% - (3 * var(--carousel-space-between))) / 4);
  1051. }
  1052. ",
  1053. "6" => " {
  1054. --carousel-cell-width: calc((100% - (5 * var(--carousel-space-between))) / 6);
  1055. }
  1056. ",
  1057. "8" => " {
  1058. --carousel-cell-width: calc((100% - (7 * var(--carousel-space-between))) / 8);
  1059. }
  1060. ",
  1061. ))->whiteList();
  1062.  
  1063.  
  1064. $cells_section->addStyleControl(
  1065. array(
  1066. "name" => __('Cell width'),
  1067. "type" => 'measurebox',
  1068. "property" => 'width',
  1069. "control_type" => 'slider-measurebox',
  1070. "selector" => $repeater_div,
  1071. "condition" => 'editor_mode!=preview&&carousel_type=repeater&&maybe_autofit!=auto'
  1072.  
  1073. )
  1074. )
  1075. ->setUnits('%')
  1076. ->setRange('0','100','.1');
  1077.  
  1078. $cells_section->addStyleControl(
  1079. array(
  1080. "name" => __('Cell width'),
  1081. "type" => 'measurebox',
  1082. "property" => 'width',
  1083. "control_type" => 'slider-measurebox',
  1084. "selector" => $product_list_div,
  1085. "condition" => 'editor_mode!=preview&&carousel_type=woo&&maybe_autofit!=auto'
  1086.  
  1087. )
  1088. )
  1089. ->setUnits('%')
  1090. ->setRange('0','100','.1');
  1091.  
  1092. $cells_section->addStyleControl(
  1093. array(
  1094. "name" => __('Cell width'),
  1095. "type" => 'measurebox',
  1096. "property" => 'width',
  1097. "control_type" => 'slider-measurebox',
  1098. "selector" => $cell_div,
  1099. "condition" => 'editor_mode!=preview&&carousel_type=custom&&maybe_autofit!=auto'
  1100.  
  1101. )
  1102. )
  1103. ->setUnits('%')
  1104. ->setRange('0','100','.1');
  1105.  
  1106.  
  1107.  
  1108.  
  1109. $cells_section->addStyleControl(
  1110. array(
  1111. "name" => __('Cell width'),
  1112. "type" => 'measurebox',
  1113. "property" => 'width',
  1114. "control_type" => 'slider-measurebox',
  1115. "selector" => $easy_posts_div,
  1116. "condition" => 'editor_mode!=preview&&carousel_type=easy_posts&&maybe_autofit!=auto'
  1117.  
  1118. )
  1119. )
  1120. ->setUnits('%')
  1121. ->setRange('0','100','.1');
  1122.  
  1123.  
  1124. $cells_section->addStyleControl(
  1125. array(
  1126. "name" => __('Cell width'),
  1127. "type" => 'measurebox',
  1128. "property" => 'width',
  1129. "control_type" => 'slider-measurebox',
  1130. "selector" => $gallery_cell_selector,
  1131. "condition" => 'editor_mode!=preview&&carousel_type!=easy_posts&&carousel_type!=custom&&carousel_type!=woo&&carousel_type!=repeater&&maybe_autofit!=auto'
  1132.  
  1133. )
  1134. )
  1135. ->setUnits('%')
  1136. ->setRange('0','100','.1');
  1137.  
  1138.  
  1139. $cells_section->addStyleControl(
  1140. array(
  1141. "name" => __('Cell height'),
  1142. "type" => 'measurebox',
  1143. "property" => 'height',
  1144. "control_type" => 'slider-measurebox',
  1145. "selector" => '.oxy-dynamic-list > .ct-div-block, .oxy-dynamic-list .flickity-slider > .ct-div-block, .oxy-inner-content .oxy-dynamic-list',
  1146. "condition" => 'editor_mode!=preview&&carousel_type=repeater'
  1147. )
  1148. )
  1149. ->setUnits('px')
  1150. ->setRange('0','1000','1');
  1151.  
  1152.  
  1153. $cells_section->addStyleControl(
  1154. array(
  1155. "name" => __('Cell height'),
  1156. "type" => 'measurebox',
  1157. "property" => 'height',
  1158. "control_type" => 'slider-measurebox',
  1159. "selector" => '.oxy-carousel-builder_gallery-image img, .oxy-carousel-builder_gallery-images',
  1160. "condition" => 'editor_mode!=preview&&carousel_type!=easy_posts&&carousel_type!=custom&&carousel_type!=woo&&carousel_type!=repeater'
  1161. )
  1162. )
  1163. ->setUnits('px')
  1164. ->setRange('0','1000','1');
  1165.  
  1166.  
  1167.  
  1168. $cells_section->addStyleControl(
  1169. array(
  1170. "name" => __('Cell height'),
  1171. "type" => 'measurebox',
  1172. "property" => 'height',
  1173. "control_type" => 'slider-measurebox',
  1174. "selector" => '.products > .product, .products .flickity-slider > .product, .oxy-inner-content .products',
  1175. "condition" => 'editor_mode!=preview&&carousel_type=woo'
  1176. )
  1177. )
  1178. ->setUnits('px')
  1179. ->setRange('0','1000','1');
  1180.  
  1181. $cells_section->addStyleControl(
  1182. array(
  1183. "name" => __('Cell height'),
  1184. "type" => 'measurebox',
  1185. "property" => 'height',
  1186. "control_type" => 'slider-measurebox',
  1187. "selector" => '.oxy-posts > .oxy-post, .oxy-posts .flickity-slider > .oxy-post, .oxy-inner-content .oxy-posts',
  1188. "condition" => 'editor_mode!=preview&&carousel_type=easy_posts'
  1189. )
  1190. )
  1191. ->setUnits('px')
  1192. ->setRange('0','1000','1');
  1193.  
  1194. $cells_section->addStyleControl(
  1195. array(
  1196. "name" => __('Cell height'),
  1197. "type" => 'measurebox',
  1198. "property" => 'height',
  1199. "control_type" => 'slider-measurebox',
  1200. "selector" => '.cell, .oxy-inner-content .flickity-slider > .cell, .oxy-inner-content',
  1201. "condition" => 'editor_mode!=preview&&carousel_type=custom'
  1202. )
  1203. )
  1204. ->setUnits('px')
  1205. ->setRange('0','1000','1');
  1206.  
  1207. $cells_section->addStyleControl(
  1208. array(
  1209. "name" => __('Space between cells'),
  1210. "type" => 'measurebox',
  1211. "default" => "0",
  1212. "units" => 'px',
  1213. "property" => '--carousel-space-between',
  1214. "control_type" => 'slider-measurebox',
  1215. "condition" => 'editor_mode!=preview&&maybe_autofit=auto'
  1216. )
  1217. )
  1218. ->setUnits('px')
  1219. ->setRange('0','100','1');
  1220.  
  1221. $cells_section->addStyleControl(
  1222. array(
  1223. "name" => __('Space between cells'),
  1224. "type" => 'measurebox',
  1225. "default" => "0",
  1226. "units" => 'px',
  1227. "property" => 'margin-right',
  1228. "control_type" => 'slider-measurebox',
  1229. "selector" => $repeater_div,
  1230. "condition" => 'editor_mode!=preview&&carousel_type=repeater&&maybe_autofit!=auto'
  1231. )
  1232. )
  1233. ->setUnits('px')
  1234. ->setRange('0','100','1');
  1235.  
  1236. $cells_section->addStyleControl(
  1237. array(
  1238. "name" => __('Space between cells'),
  1239. "type" => 'measurebox',
  1240. "default" => "0",
  1241. "units" => 'px',
  1242. "property" => 'margin-right',
  1243. "control_type" => 'slider-measurebox',
  1244. "selector" => $product_list_div,
  1245. "condition" => 'editor_mode!=preview&&carousel_type=woo&&maybe_autofit!=auto'
  1246. )
  1247. )
  1248. ->setUnits('px')
  1249. ->setRange('0','100','1');
  1250.  
  1251. $cells_section->addStyleControl(
  1252. array(
  1253. "name" => __('Space between cells'),
  1254. "type" => 'measurebox',
  1255. "default" => "0",
  1256. "units" => 'px',
  1257. "property" => 'margin-right',
  1258. "control_type" => 'slider-measurebox',
  1259. "selector" => $easy_posts_div,
  1260. "condition" => 'editor_mode!=preview&&carousel_type=easy_posts&&maybe_autofit!=auto'
  1261. )
  1262. )
  1263. ->setUnits('px')
  1264. ->setRange('0','100','1');
  1265.  
  1266. $cells_section->addStyleControl(
  1267. array(
  1268. "name" => __('Space between cells'),
  1269. "type" => 'measurebox',
  1270. "default" => "0",
  1271. "units" => 'px',
  1272. "property" => 'margin-right',
  1273. "control_type" => 'slider-measurebox',
  1274. "selector" => $gallery_cell_selector,
  1275. "condition" => 'editor_mode!=preview&&carousel_type!=easy_posts&&carousel_type!=custom&&carousel_type!=woo&&carousel_type!=repeater&&maybe_autofit!=auto'
  1276. )
  1277. )
  1278. ->setUnits('px')
  1279. ->setRange('0','100','1');
  1280.  
  1281.  
  1282.  
  1283. $cells_section->addStyleControl(
  1284. array(
  1285. "name" => __('Space between cells'),
  1286. "type" => 'measurebox',
  1287. "default" => "0",
  1288. "units" => 'px',
  1289. "property" => 'margin-right',
  1290. "control_type" => 'slider-measurebox',
  1291. "selector" => $cell_div,
  1292. "condition" => 'editor_mode!=preview&&carousel_type=custom&&maybe_autofit!=auto'
  1293. )
  1294. )
  1295. ->setUnits('px')
  1296. ->setRange('0','100','1');
  1297.  
  1298.  
  1299. $cells_section->addStyleControl(
  1300. array(
  1301. "name" => __('Cell Transition'),
  1302. "property" => 'transition-duration',
  1303. "selector" => $repeater_div,
  1304. "control_type" => 'slider-measurebox',
  1305. "default" => '400',
  1306. "condition" => 'editor_mode!=preview&&carousel_type=repeater'
  1307. )
  1308. )->setUnits('ms','ms')
  1309. ->setRange(10, 800, 5);
  1310.  
  1311.  
  1312. $cells_section->addStyleControl(
  1313. array(
  1314. "name" => __('Cell Transition'),
  1315. "property" => 'transition-duration',
  1316. "selector" => $gallery_cell_selector,
  1317. "control_type" => 'slider-measurebox',
  1318. "default" => '400',
  1319. "condition" => 'editor_mode!=preview&&carousel_type!=easy_posts&&carousel_type!=custom&&carousel_type!=woo&&carousel_type!=repeater'
  1320. )
  1321. )->setUnits('ms','ms')
  1322. ->setRange(10, 800, 5);
  1323.  
  1324. $cells_section->addStyleControl(
  1325. array(
  1326. "name" => __('Cell Transition'),
  1327. "property" => 'transition-duration',
  1328. "selector" => $product_list_div,
  1329. "control_type" => 'slider-measurebox',
  1330. "default" => '400',
  1331. "condition" => 'editor_mode!=preview&&carousel_type=woo'
  1332. )
  1333. )->setUnits('ms','ms')
  1334. ->setRange(10, 800, 5);
  1335.  
  1336. $cells_section->addStyleControl(
  1337. array(
  1338. "name" => __('Cell Transition'),
  1339. "property" => 'transition-duration',
  1340. "selector" => $easy_posts_div,
  1341. "control_type" => 'slider-measurebox',
  1342. "default" => '400',
  1343. "condition" => 'editor_mode!=preview&&carousel_type=easy_posts'
  1344. )
  1345. )->setUnits('ms','ms')
  1346. ->setRange(10, 800, 5);
  1347.  
  1348. $cells_section->addStyleControl(
  1349. array(
  1350. "name" => __('Cell Transition'),
  1351. "property" => 'transition-duration',
  1352. "selector" => $cell_div,
  1353. "control_type" => 'slider-measurebox',
  1354. "default" => '400',
  1355. "condition" => 'editor_mode!=preview&&carousel_type=custom'
  1356. )
  1357. )->setUnits('ms','ms')
  1358. ->setRange(10, 800, 5);
  1359.  
  1360.  
  1361. $cells_section->addOptionControl(
  1362. array(
  1363. 'type' => 'buttons-list',
  1364. 'name' => __('Gallery image horizontal align'),
  1365. 'slug' => 'cell_inner_layout',
  1366. "condition" => 'editor_mode!=preview&&carousel_type!=easy_posts&&carousel_type!=custom&&carousel_type!=woo&&carousel_type!=repeater&&prioritise_width!=enable'
  1367. )
  1368.  
  1369. )->setValue(array(
  1370. "a_flexstart" => "Left",
  1371. "b_center" => "Center",
  1372. "c_flexend" => "Right",
  1373. )
  1374. )->setDefaultValue('center')
  1375. ->setValueCSS( array(
  1376. "a_flexstart" => ".oxy-carousel-builder_gallery-image {
  1377. display: flex;
  1378. align-items: flex-start;
  1379. }",
  1380. "c_flexend" => ".oxy-carousel-builder_gallery-image {
  1381. display: flex;
  1382. align-items: flex-end;
  1383. }",
  1384. "b_center" => ".oxy-carousel-builder_gallery-image {
  1385. display: flex;
  1386. align-items: center;
  1387. }",
  1388. ))->whitelist();
  1389.  
  1390.  
  1391. $cells_section->addOptionControl(
  1392. array(
  1393. 'type' => 'buttons-list',
  1394. 'name' => __('Gallery image vertical align'),
  1395. 'slug' => 'cell_inner_alignment',
  1396. "condition" => 'editor_mode!=preview&&carousel_type!=easy_posts&&carousel_type!=custom&&carousel_type!=woo&&carousel_type!=repeater'
  1397. )
  1398.  
  1399. )->setValue(array(
  1400. "a_flexstart" => "Top",
  1401. "c_flexend" => "Bottom",
  1402. "b_center" => "Center",
  1403. )
  1404. )->setDefaultValue('center')
  1405. ->setValueCSS( array(
  1406. "a_flexstart" => ".oxy-carousel-builder_gallery-images,
  1407. .oxy-carousel-builder_gallery-images .flickity-slider {
  1408. display: flex;
  1409. align-items: flex-start;
  1410. }",
  1411. "c_flexend" => " .oxy-carousel-builder_gallery-images,
  1412. .oxy-carousel-builder_gallery-images .flickity-slider {
  1413. display: flex;
  1414. align-items: flex-end;
  1415. }",
  1416. "b_center" => " .oxy-carousel-builder_gallery-images,
  1417. .oxy-carousel-builder_gallery-images .flickity-slider {
  1418. display: flex;
  1419. align-items: center;
  1420. }",
  1421. ))->whitelist();
  1422.  
  1423.  
  1424. $cells_section->addStyleControl(
  1425. array(
  1426. "name" => __('Object fit'),
  1427. "property" => 'object-fit',
  1428. "selector" => '.oxy-carousel-builder_gallery-image img',
  1429. "control_type" => 'dropdown',
  1430. "condition" => 'editor_mode!=preview&&carousel_type!=easy_posts&&carousel_type!=custom&&carousel_type!=woo&&carousel_type!=repeater&&prioritise_width=none'
  1431. )
  1432. )->setValue(array(
  1433. "fill" => "Fill",
  1434. "contain" => "Contain",
  1435. "none" => "None",
  1436. "cover" => "Cover",
  1437. "scale-down" => "Scale-down",
  1438. )
  1439. )->setDefaultValue('none')
  1440. ->setParam("description", __("Changes how the image fits inside of the cell"));
  1441.  
  1442.  
  1443. $cells_section->addOptionControl(
  1444. array(
  1445. 'type' => 'buttons-list',
  1446. 'name' => __('Force image to take up 100% width of cell'),
  1447. 'slug' => 'force_full_width',
  1448. "condition" => 'editor_mode!=preview&&carousel_type!=easy_posts&&carousel_type!=custom&&carousel_type!=woo&&carousel_type!=repeater'
  1449. )
  1450.  
  1451. )->setValue(array(
  1452. "true" => "True",
  1453. "false" => "False"
  1454. )
  1455. )->setDefaultValue('false')
  1456. ->setValueCSS( array(
  1457. "true" => ".oxy-carousel-builder_gallery-images .oxy-carousel-builder_gallery-image img {
  1458. width: 100%;
  1459. }",
  1460. ))->whitelist();
  1461.  
  1462.  
  1463.  
  1464. /**
  1465. * Selected Styles
  1466. */
  1467. $cell_selected_section = $cells_section->addControlSection("cell_selected_section", __("Selected Cells"), "assets/icon.png", $this);
  1468.  
  1469. $cell_selected_section->addStyleControls(
  1470. array(
  1471. array(
  1472. "name" => __('Selected Opacity'),
  1473. "property" => 'opacity',
  1474. "selector" => $cell_selected,
  1475. ),
  1476. array(
  1477. "name" => __('Selected Background Color'),
  1478. "property" => 'background-color',
  1479. "selector" => $cell_selected,
  1480. ),
  1481. array(
  1482. "name" => __('Selected Text Color'),
  1483. "property" => 'color',
  1484. "selector" => $cell_selected,
  1485. ),
  1486. )
  1487. );
  1488.  
  1489.  
  1490. $cell_selected_section->addStyleControl(
  1491. array(
  1492. "name" => __('Selected Scale'),
  1493. "selector" => $cell_selected,
  1494. "property" => '--cell-selected-scale',
  1495. "control_type" => 'slider-measurebox',
  1496. "default" => '1',
  1497. )
  1498. )
  1499. ->setRange('0','2', '.02');
  1500.  
  1501.  
  1502. $cell_selected_section->addStyleControl(
  1503. array(
  1504. "name" => __('Selected Rotate'),
  1505. "selector" => $cell_selected,
  1506. "property" => '--cell-selected-rotate',
  1507. "control_type" => 'slider-measurebox',
  1508. "default" => '0',
  1509. )
  1510. )
  1511. ->setUnits('deg','deg')
  1512. ->setRange('-180','180');
  1513.  
  1514. /**
  1515. * Selected Styles
  1516. */
  1517. $cell_prev_next_section = $cells_section->addControlSection("cell_prev_next_section", __("Prev/Next Cells"), "assets/icon.png", $this);
  1518.  
  1519. $cell_prev_next_section->addCustomControl(
  1520. '<div style="color: #fff; line-height: 1.3; font-size: 13px;">These changes will only be seen inside Oxygen in preview mode</div>','description');
  1521.  
  1522.  
  1523. $cell_prev_next_section->addStyleControl(
  1524. array(
  1525. "name" => __('Previous Scale'),
  1526. "selector" => $cell_previous,
  1527. "property" => '--cell-prev-scale',
  1528. "control_type" => 'slider-measurebox',
  1529. "default" => '1',
  1530. )
  1531. )
  1532. ->setRange('0','2', '.02');
  1533.  
  1534. $cell_prev_next_section->addStyleControl(
  1535. array(
  1536. "name" => __('Previous Rotate'),
  1537. "selector" => $cell_previous,
  1538. "property" => '--cell-prev-rotate',
  1539. "control_type" => 'slider-measurebox',
  1540. "default" => '0',
  1541. )
  1542. )
  1543. ->setUnits('deg','deg')
  1544. ->setRange('-180','180');
  1545.  
  1546. $cell_prev_next_section->addStyleControls(
  1547. array(
  1548. array(
  1549. "name" => __('Previous Opacity'),
  1550. "property" => 'opacity',
  1551. "selector" => $cell_previous,
  1552. ),
  1553. )
  1554. );
  1555.  
  1556. $cell_prev_next_section->addStyleControl(
  1557. array(
  1558. "name" => __('Next Scale'),
  1559. "selector" => $cell_next,
  1560. "property" => '--cell-next-scale',
  1561. "control_type" => 'slider-measurebox',
  1562. "default" => '1',
  1563. )
  1564. )
  1565. ->setRange('0','2', '.02');
  1566.  
  1567.  
  1568.  
  1569. $cell_prev_next_section->addStyleControl(
  1570. array(
  1571. "name" => __('Next Rotate'),
  1572. "selector" => $cell_next,
  1573. "property" => '--cell-next-rotate',
  1574. "control_type" => 'slider-measurebox',
  1575. "default" => '0',
  1576. )
  1577. )
  1578. ->setUnits('deg','deg')
  1579. ->setRange('-180','180');
  1580.  
  1581.  
  1582.  
  1583. $cell_prev_next_section->addStyleControls(
  1584. array(
  1585. array(
  1586. "name" => __('Next Opacity'),
  1587. "property" => 'opacity',
  1588. "selector" => $cell_next,
  1589. ),
  1590. )
  1591. );
  1592.  
  1593.  
  1594.  
  1595.  
  1596.  
  1597.  
  1598.  
  1599.  
  1600.  
  1601. /**
  1602. * Config
  1603. */
  1604. $config_section = $this->addControlSection("config_section", __("Carousel"), "assets/icon.png", $this);
  1605.  
  1606.  
  1607. $config_section->addCustomControl(
  1608. '<div style="color: #eee; line-height: 1.3; font-size: 13px;">Grouping & Alignments<hr></div>','description');
  1609.  
  1610. $config_section->addOptionControl(
  1611. array(
  1612. 'type' => 'dropdown',
  1613. 'name' => __('Group cells by..'),
  1614. 'slug' => 'maybe_group'
  1615. )
  1616.  
  1617. )->setValue(array(
  1618. "true" => __("Auto (Number of cells visible)"),
  1619. "number" => __("Choose a number"),
  1620. "percent" => __("% of carousel viewport"),
  1621. "false" => __("No grouping"),
  1622. )
  1623. )->setDefaultValue('number')
  1624. ->setParam("description", __("Choose how to groups the cells together in slides"));
  1625.  
  1626. $config_section->addOptionControl(
  1627. array(
  1628. "type" => 'slider-measurebox',
  1629. "name" => __('Number of cells grouped together'),
  1630. "slug" => 'group_cells',
  1631. "default" => '1',
  1632. "condition" => 'maybe_group=number'
  1633. )
  1634. )->setRange('1','10','1');
  1635.  
  1636. $config_section->addOptionControl(
  1637. array(
  1638. "type" => 'slider-measurebox',
  1639. "name" => __('Width of carousel viewport to group'),
  1640. "slug" => 'group_percent',
  1641. "default" => '100',
  1642. "condition" => 'maybe_group=percent'
  1643. )
  1644. )->setRange('1','100','1')
  1645. ->setUnits('%','%');
  1646.  
  1647.  
  1648.  
  1649. $config_section->addOptionControl(
  1650. array(
  1651. "type" => 'slider-measurebox',
  1652. "name" => __('Initial cell selected'),
  1653. "slug" => 'initial_index',
  1654. "default" => '1',
  1655. "condition" => 'maybe_hash=false'
  1656. )
  1657. )->setRange('1','10','1');
  1658.  
  1659. $config_section->addOptionControl(
  1660. array(
  1661. 'type' => 'buttons-list',
  1662. 'name' => 'Cell alignment',
  1663. 'slug' => 'cell_align'
  1664. )
  1665.  
  1666. )->setValue(array(
  1667. "left" => "Left",
  1668. "center" => "Center",
  1669. "right" => "Right"
  1670. )
  1671. )->setDefaultValue('center')
  1672. ->setParam("description", __("(Horizontal, relative to the carousel viewport)"));
  1673.  
  1674.  
  1675. $config_section->addOptionControl(
  1676. array(
  1677. 'type' => 'buttons-list',
  1678. 'name' => __('Contain'),
  1679. 'slug' => 'contain',
  1680. 'condition' => 'wrap_around=false&&maybe_fade!=true'
  1681. )
  1682.  
  1683. )->setValue(array(
  1684. "true" => "Enable",
  1685. "false" => "Disable"
  1686. )
  1687. )->setParam("description", __("Prevents excess scroll at beginning or end"));
  1688.  
  1689.  
  1690.  
  1691.  
  1692.  
  1693. $config_section->addOptionControl(
  1694. array(
  1695. 'type' => 'buttons-list',
  1696. 'name' => __('Adaptive height'),
  1697. 'slug' => 'adaptive_height'
  1698. )
  1699.  
  1700. )->setDefaultValue('false')
  1701. ->setValue(array(
  1702. "true" => "Enable",
  1703. "false" => "Disable"
  1704. )
  1705. )->setParam("description", __("Dynamically change carousel height to match each selected cell"));
  1706.  
  1707.  
  1708. $config_section->addStyleControl(
  1709. array(
  1710. "name" => __('Height transition duration'),
  1711. "property" => 'transition-duration',
  1712. "selector" => '.flickity-viewport',
  1713. "control_type" => 'slider-measurebox',
  1714. "condition" => 'adaptive_height=true',
  1715. "default" => '0',
  1716. )
  1717. )->setUnits('ms','ms')
  1718. ->setRange(10, 800, 5);
  1719.  
  1720.  
  1721.  
  1722.  
  1723.  
  1724.  
  1725.  
  1726. /**
  1727. * Config / Behaviour
  1728. */
  1729. $config_behaviour_section = $this->addControlSection("config_behaviour_section", __("Behaviour / Interaction"), "assets/icon.png", $this);
  1730.  
  1731.  
  1732. $config_behaviour_section->addOptionControl(
  1733. array(
  1734. 'type' => 'buttons-list',
  1735. 'name' => __('Transition type'),
  1736. 'slug' => 'maybe_fade'
  1737. )
  1738.  
  1739. )->setDefaultValue('false')
  1740. ->setValue(array(
  1741. "false" => "Slide",
  1742. "true" => "Fade"
  1743. )
  1744. );
  1745.  
  1746.  
  1747. $config_behaviour_section->addOptionControl(
  1748. array(
  1749. "type" => 'slider-measurebox',
  1750. "name" => __('Autoplay'),
  1751. "slug" => 'autoplay',
  1752. "value" => '0',
  1753. )
  1754. )->setRange('0','4000','10')
  1755. ->setUnits('ms','ms')
  1756. ->setParam("description", __("Advance cells every {x} milliseconds (0=disabled)"));
  1757.  
  1758. $config_behaviour_section->addOptionControl(
  1759. array(
  1760. 'type' => 'buttons-list',
  1761. 'name' => __('Resume Autoplay after user interaction'),
  1762. 'slug' => 'maybe_resume_autoplay'
  1763. )
  1764.  
  1765. )->setDefaultValue('false')
  1766. ->setValue(array(
  1767. "true" => "Enable",
  1768. "false" => "Disable"
  1769. )
  1770. );
  1771.  
  1772.  
  1773. $config_behaviour_section->addOptionControl(
  1774. array(
  1775. "type" => 'slider-measurebox',
  1776. "name" => __('Resume autoplay after..'),
  1777. "slug" => 'resume_autoplay',
  1778. "value" => '300',
  1779. "condition" => 'maybe_resume_autoplay=true'
  1780. )
  1781. )->setRange('0','4000','1')
  1782. ->setUnits('ms','ms');
  1783.  
  1784.  
  1785. $config_behaviour_section->addOptionControl(
  1786. array(
  1787. 'type' => 'buttons-list',
  1788. 'name' => __('Wrap around (infinite cells)'),
  1789. 'slug' => 'wrap_around'
  1790. )
  1791.  
  1792. )->setDefaultValue('false')
  1793. ->setValue(array(
  1794. "true" => "Enable",
  1795. "false" => "Disable"
  1796. )
  1797. );
  1798.  
  1799. $config_behaviour_section->addOptionControl(
  1800. array(
  1801. 'type' => 'buttons-list',
  1802. 'name' => __('Free scrolling'),
  1803. 'slug' => 'free_scroll',
  1804. 'condition' => 'maybe_fade=false'
  1805. )
  1806.  
  1807. )
  1808. ->setDefaultValue('false')
  1809. ->setValue(array(
  1810. "true" => "Enable",
  1811. "false" => "Disable"
  1812. )
  1813. )->setParam("description", __("Prevent the cells from snapping into place"));
  1814.  
  1815.  
  1816. $config_behaviour_section->addOptionControl(
  1817. array(
  1818. 'type' => 'buttons-list',
  1819. 'name' => __('Retrigger AOS animations on selected cell'),
  1820. 'slug' => 'trigger_animations'
  1821. )
  1822.  
  1823. )->setValue(array(
  1824. "true" => "Enable",
  1825. "false" => "Disable"
  1826. )
  1827. )->setDefaultValue('false')
  1828. ->setParam("description", __("Scroll animations on inner elements will retrigger when the cell is selected"));
  1829.  
  1830.  
  1831. $config_behaviour_section->addOptionControl(
  1832. array(
  1833. "type" => 'slider-measurebox',
  1834. "name" => __('Delay before triggering'),
  1835. "slug" => 'trigger_animations_delay',
  1836. "default" => '700',
  1837. "condition" => 'trigger_animations=true'
  1838. )
  1839. )->setRange('0','1400','1')
  1840. ->setUnits('ms');
  1841.  
  1842.  
  1843.  
  1844. $config_behaviour_section->addOptionControl(
  1845. array(
  1846. 'type' => 'buttons-list',
  1847. 'name' => __('Ticker (continuous play)'),
  1848. 'slug' => 'maybe_ticker',
  1849. 'condition' => 'wrap_around=true&&maybe_fade=false',
  1850. )
  1851.  
  1852. )->setDefaultValue('false')
  1853. ->setValue(array(
  1854. "true" => "Enable",
  1855. "false" => "Disable"
  1856. )
  1857. );
  1858.  
  1859. $config_behaviour_section->addOptionControl(
  1860. array(
  1861. "type" => 'slider-measurebox',
  1862. "name" => __('Ticker Speed (negative for right-to-left)'),
  1863. "slug" => 'ticker',
  1864. "value" => '0',
  1865. "condition" => 'maybe_ticker=true&&wrap_around=true&&maybe_fade=false'
  1866. )
  1867. )->setRange('-10','10','0.1');
  1868.  
  1869.  
  1870. $config_behaviour_section->addOptionControl(
  1871. array(
  1872. 'type' => 'buttons-list',
  1873. 'name' => __('Ticker paused on hover'),
  1874. 'slug' => 'ticker_hover_pause',
  1875. 'condition' => 'maybe_ticker=true&&wrap_around=true&&maybe_fade=false'
  1876. )
  1877.  
  1878. )->setDefaultValue('true')
  1879. ->setValue(array(
  1880. "true" => "Enable",
  1881. "false" => "Disable"
  1882. )
  1883. );
  1884.  
  1885.  
  1886. $config_behaviour_section->addCustomControl(
  1887. '<div style="color: #eee; line-height: 1.3; font-size: 13px;">User interactions<hr style="opacity: 0.5;"></div>','description');
  1888.  
  1889.  
  1890. $config_behaviour_section->addOptionControl(
  1891. array(
  1892. 'type' => 'buttons-list',
  1893. 'name' => __('Carousel can be dragged'),
  1894. 'slug' => 'draggable',
  1895. )
  1896.  
  1897. )->setDefaultValue('true')
  1898. ->setValue(array(
  1899. "true" => "Enable",
  1900. "false" => "Disable"
  1901. )
  1902. );
  1903.  
  1904.  
  1905. $config_behaviour_section->addOptionControl(
  1906. array(
  1907. 'type' => 'buttons-list',
  1908. 'name' => __('Clicking a cell will select it'),
  1909. 'slug' => 'click_to_select',
  1910. 'condition' => 'maybe_fade=false'
  1911. )
  1912.  
  1913. )->setDefaultValue('false')
  1914. ->setValue(array(
  1915. "true" => "Enable",
  1916. "false" => "Disable"
  1917. )
  1918. )->setValueCSS( array(
  1919. "true" => ".flickity-viewport .oxy-carousel-builder_gallery-image,
  1920. .flickity-viewport .oxy-dynamic-list > .ct-div-block,
  1921. .flickity-viewport .product,
  1922. .flickity-viewport .oxy-post {
  1923. cursor: pointer;
  1924. }
  1925. ",
  1926. ));
  1927.  
  1928.  
  1929. $config_behaviour_section->addOptionControl(
  1930. array(
  1931. 'type' => 'buttons-list',
  1932. 'name' => __('Pause autoplay on hover'),
  1933. 'slug' => 'maybe_pause_autoplay',
  1934.  
  1935. )
  1936. )->setDefaultValue('true')
  1937. ->setValue(array(
  1938. "true" => "Enable",
  1939. "false" => "Disable"
  1940. )
  1941. );
  1942.  
  1943. $config_behaviour_section->addOptionControl(
  1944. array(
  1945. 'type' => 'buttons-list',
  1946. 'name' => __('Hash link to select cells'),
  1947. 'slug' => 'maybe_hash',
  1948.  
  1949. )
  1950. )->setDefaultValue('false')
  1951. ->setValue(array(
  1952. "true" => "Enable",
  1953. "false" => "Disable"
  1954. )
  1955. );
  1956.  
  1957.  
  1958. /**
  1959. * Friction / Drag
  1960. */
  1961. $friction_section = $config_behaviour_section->addControlSection("friction_section", __("Friction / Drag"), "assets/icon.png", $this);
  1962.  
  1963.  
  1964. $friction_section->addOptionControl(
  1965. array(
  1966. "type" => 'slider-measurebox',
  1967. "name" => __('Drag Threshold'),
  1968. "slug" => 'drag_threshold',
  1969. "value" => '3',
  1970. )
  1971. )->setRange('0','40','1')
  1972. ->setParam("description", __("Number of px moved until dragging starts"));
  1973.  
  1974. $friction_section->addOptionControl(
  1975. array(
  1976. "type" => 'slider-measurebox',
  1977. "name" => __('Selected Attraction'),
  1978. "slug" => 'selected_attraction',
  1979. "value" => '0.025',
  1980. )
  1981. )->setRange('0','0.03','.001')
  1982. ->setParam("description", __("Higher attraction makes the slider move faster"));
  1983.  
  1984.  
  1985.  
  1986. $friction_section->addOptionControl(
  1987. array(
  1988. "type" => 'slider-measurebox',
  1989. "name" => __('Friction'),
  1990. "slug" => 'friction',
  1991. "value" => '0.28',
  1992. )
  1993. )->setRange('0','1','.02')
  1994. ->setParam("description", __("Higher friction makes the slider feel stickier and less bouncy"));
  1995.  
  1996.  
  1997. $friction_section->addOptionControl(
  1998. array(
  1999. "type" => 'slider-measurebox',
  2000. "name" => __('Free Scroll Friction'),
  2001. "slug" => 'free_scroll_friction',
  2002. "value" => '0.075',
  2003. "condition" => 'free_scroll=true'
  2004. )
  2005. )->setRange('0','1','.05')
  2006. ->setParam("description", __("Higher friction makes the slider feel stickier"));
  2007.  
  2008.  
  2009.  
  2010.  
  2011.  
  2012.  
  2013. $config_section->addOptionControl(
  2014. array(
  2015. 'type' => 'buttons-list',
  2016. 'name' => 'Enable carousel at this break point (& below)',
  2017. 'slug' => 'watch_css'
  2018. )
  2019.  
  2020. )->setValue(array(
  2021. "true" => "Enable",
  2022. "false" => "Disable"
  2023. )
  2024. )
  2025. ->setDefaultValue('true')
  2026. ->setValueCSS( array(
  2027. "false" => " .oxy-dynamic-list::after {
  2028. content: none;
  2029. }
  2030.  
  2031. ul.products::after {
  2032. content: none;
  2033. }
  2034.  
  2035. .oxy-posts::after {
  2036. content: none;
  2037. }
  2038.  
  2039. .oxy-posts {
  2040. flex-wrap: wrap;
  2041. }
  2042.  
  2043. .oxy-inner-content::after {
  2044. content: none;
  2045. }
  2046.  
  2047. .oxy-carousel-builder_gallery-images::after {
  2048. content: none;
  2049. }
  2050.  
  2051. ul.products {
  2052. flex-wrap: wrap;
  2053. }
  2054.  
  2055. .flickity-page-dots,
  2056. .oxy-carousel-builder_icon {
  2057. display: none;
  2058. }",
  2059.  
  2060. "true" => " .oxy-dynamic-list::after {
  2061. content: 'flickity';
  2062. }
  2063.  
  2064. ul.products::after {
  2065. content: 'flickity';
  2066. }
  2067.  
  2068. .oxy-posts::after {
  2069. content: 'flickity';
  2070. }
  2071.  
  2072. .oxy-posts {
  2073. flex-wrap: nowrap;
  2074. }
  2075.  
  2076. .oxy-inner-content::after {
  2077. content: 'flickity';
  2078. }
  2079.  
  2080. .oxy-carousel-builder_gallery-images::after {
  2081. content: 'flickity';
  2082. }
  2083.  
  2084. ul.products {
  2085. flex-wrap: nowrap;
  2086. }
  2087.  
  2088. .flickity-page-dots,
  2089. .oxy-carousel-builder_icon{
  2090. display: inline-flex;
  2091. }",
  2092. ) )->whiteList();
  2093.  
  2094.  
  2095. $config_section->addOptionControl(
  2096. array(
  2097. 'type' => 'buttons-list',
  2098. 'name' => __('Fullscreen option'),
  2099. 'slug' => 'maybe_fullscreen'
  2100. )
  2101.  
  2102. )
  2103. ->setDefaultValue('false')
  2104. ->setValue(array(
  2105. "true" => "Enable",
  2106. "false" => "Disable"
  2107. )
  2108. );
  2109.  
  2110. $config_section->addOptionControl(
  2111. array(
  2112. 'type' => 'buttons-list',
  2113. 'name' => __('Keep image aspect ratio in fullscreen mode'),
  2114. 'slug' => 'maybe_gallery_fullscreen',
  2115. 'condition' => 'maybe_fullscreen!=false&&carousel_type!=repeater&&carousel_type!=easy_posts&&carousel_type!=repeater&&carousel_type!=custom'
  2116. )
  2117.  
  2118. )
  2119. ->setDefaultValue('false')
  2120. ->setValue(array(
  2121. "true" => "Enable",
  2122. "false" => "Disable"
  2123. )
  2124. )->setValueCSS( array(
  2125. "true" => " .flickity-enabled.is-fullscreen .oxy-carousel-builder_gallery-image {
  2126. height: 100%;
  2127. width: 100%;
  2128. display: flex;
  2129. justify-content: center;
  2130. align-items: center;
  2131. }
  2132.  
  2133. .flickity-enabled.is-fullscreen .oxy-carousel-builder_gallery-image img {
  2134. object-fit: contain;
  2135. width: 100%
  2136. }",
  2137. ) );
  2138.  
  2139.  
  2140. $config_section->addOptionControl(
  2141. array(
  2142. 'type' => 'buttons-list',
  2143. 'name' => __('Force equal cell heights'),
  2144. 'slug' => 'maybe_force_heights'
  2145. )
  2146.  
  2147. )
  2148. ->setDefaultValue('false')
  2149. ->setValue(array(
  2150. "true" => "Enable",
  2151. "false" => "Disable"
  2152. )
  2153. )->setValueCSS( array(
  2154. "true" => " .flickity-resize .flickity-slider > .ct-div-block {
  2155. min-height: 100%;
  2156. }
  2157.  
  2158. .flickity-resize .flickity-slider .product {
  2159. min-height: 100%;
  2160. }
  2161.  
  2162. .flickity-resize .flickity-slider .cell {
  2163. min-height: 100%;
  2164. }
  2165.  
  2166. .flickity-resize .flickity-slider .oxy-post {
  2167. min-height: 100%;
  2168. }
  2169.  
  2170. .flickity-resize .flickity-slider .oxy-inner-content {
  2171. min-height: 100%;
  2172. }
  2173. ",
  2174. ) )->whiteList()
  2175. ->setParam("description", __("Will make each cell the same height as the tallest cell"));
  2176.  
  2177.  
  2178.  
  2179.  
  2180.  
  2181.  
  2182.  
  2183.  
  2184. /**
  2185. * Navigation
  2186. */
  2187. $navigation_section = $this->addControlSection("navigation_section", __("Navigation Arrows"), "assets/icon.png", $this);
  2188.  
  2189. $navigation_section->addOptionControl(
  2190. array(
  2191. 'type' => 'dropdown',
  2192. 'name' => __('Navigation Arrows'),
  2193. 'slug' => 'nav_type'
  2194. )
  2195.  
  2196. )->setValue(array(
  2197. "icon" => "Built-in icons",
  2198. "custom" => "Using custom elements" ,
  2199. "none" => 'None',
  2200. )
  2201. )
  2202. ->setDefaultValue('icon')
  2203. ->setValueCSS( array(
  2204. "custom" => " .oxy-carousel-builder_icon {
  2205. display: none;
  2206. }
  2207. ",
  2208. "none" => " .oxy-carousel-builder_icon {
  2209. display: none;
  2210. }
  2211. "
  2212. ) );
  2213.  
  2214.  
  2215. /* $navigation_section->addOptionControl(
  2216. array(
  2217. 'type' => 'buttons-list',
  2218. 'name' => __('Navigation Visibility'),
  2219. 'slug' => 'nav_visibility'
  2220. )
  2221.  
  2222. )->setValue(array( "hover" => "On Hover", "always" => "Always Visible" ))
  2223. ->setDefaultValue('always')
  2224. ->setValueCSS( array(
  2225. "hover" =>
  2226. " .oxy-carousel-builder_icon {
  2227. opacity: 0;
  2228. visibility: hidden;
  2229. }
  2230.  
  2231. .oxy-inner-content:hover .oxy-carousel-builder_icon {
  2232. opacity: 1;
  2233. visibility: visible;
  2234. }
  2235. "
  2236. ) ); */
  2237.  
  2238.  
  2239.  
  2240. $navigation_section->addCustomControl(
  2241. '<div style="color: #fff; font-size: 13px;">All style controls below are for the built-in icons<hr style="opacity: 0.5;"></div>','description');
  2242.  
  2243. /**
  2244. * Icons
  2245. */
  2246. $prev_icon_section = $navigation_section->addControlSection("prev_icon_section", __("Previous Icon"), "assets/icon.png", $this);
  2247.  
  2248. $navigation_icon_selector = '.oxy-carousel-builder_icon';
  2249.  
  2250. $navigation_section->addStyleControl(
  2251. array(
  2252. "name" => __('Icon Size'),
  2253. "slug" => "icon_size",
  2254. "selector" => $navigation_icon_selector,
  2255. "control_type" => 'slider-measurebox',
  2256. "value" => '14',
  2257. "property" => 'font-size',
  2258. "condition" => 'nav_type=icon',
  2259. )
  2260. )->setRange(1, 72, 1);
  2261.  
  2262. $prev_icon_section->addOptionControl(
  2263. array(
  2264. "type" => 'icon_finder',
  2265. "name" => __('Prev Icon'),
  2266. "slug" => 'prev_icon',
  2267. "value" => 'FontAwesomeicon-chevron-left',
  2268. "condition" => 'nav_type=icon',
  2269. )
  2270. );
  2271.  
  2272.  
  2273. $next_icon_section = $navigation_section->addControlSection("next_icon_section", __("Next Icon"), "assets/icon.png", $this);
  2274.  
  2275. $next_icon_section->addOptionControl(
  2276. array(
  2277. "type" => 'icon_finder',
  2278. "name" => __('Next Icon'),
  2279. "slug" => 'next_icon',
  2280. "value" => 'FontAwesomeicon-chevron-right',
  2281. "condition" => 'nav_type=icon',
  2282. )
  2283. );
  2284.  
  2285.  
  2286. $navigation_spacing_section = $navigation_section->addControlSection("navigation_spacing_section", __("Position / Spacing"), "assets/icon.png", $this);
  2287.  
  2288. $navigation_spacing_section->addPreset(
  2289. "padding",
  2290. "nav_icon_padding",
  2291. __("Padding"),
  2292. $navigation_icon_selector
  2293. )->whiteList();
  2294.  
  2295. $prev_selector = '.oxy-carousel-builder_prev';
  2296. $next_selector = '.oxy-carousel-builder_next';
  2297.  
  2298.  
  2299. $navigation_spacing_section->addCustomControl(
  2300. '<div style="color: #fff; font-size: 13px;">Previous Navigation</div>','description');
  2301. $navigation_spacing_section->addStyleControl(
  2302. array(
  2303. "selector" => $prev_selector,
  2304. "control_type" => 'measurebox',
  2305. "default" => '50',
  2306. "property" => 'top',
  2307. )
  2308. )->setUnits('%', 'px,%,em,auto,vw,vh')
  2309. ->setParam('hide_wrapper_end', true);
  2310.  
  2311. $navigation_spacing_section->addStyleControl(
  2312. array(
  2313. "selector" => $prev_selector,
  2314. "control_type" => 'measurebox',
  2315. "default" => '0',
  2316. "property" => 'bottom',
  2317. )
  2318. )->setParam('hide_wrapper_start', true);
  2319.  
  2320. $navigation_spacing_section->addStyleControl(
  2321. array(
  2322. "selector" => $prev_selector,
  2323. "control_type" => 'measurebox',
  2324. "default" => '0',
  2325. "property" => 'left',
  2326. )
  2327. )->setParam('hide_wrapper_end', true);
  2328.  
  2329. $navigation_spacing_section->addStyleControl(
  2330. array(
  2331. "selector" => $prev_selector,
  2332. "control_type" => 'measurebox',
  2333. "default" => '0',
  2334. "property" => 'right',
  2335. )
  2336. )->setParam('hide_wrapper_start', true);
  2337.  
  2338.  
  2339. $navigation_spacing_section->addCustomControl(
  2340. '<div style="color: #fff; font-size: 13px;">Next Navigation</div>','description');
  2341.  
  2342. $navigation_spacing_section->addStyleControl(
  2343. array(
  2344. "selector" => $next_selector,
  2345. "control_type" => 'measurebox',
  2346. "default" => '50',
  2347. "property" => 'top',
  2348. )
  2349. )->setUnits('%', 'px,%,em,auto,vw,vh')
  2350. ->setParam('hide_wrapper_end', true);
  2351.  
  2352. $navigation_spacing_section->addStyleControl(
  2353. array(
  2354. "selector" => $next_selector,
  2355. "control_type" => 'measurebox',
  2356. "default" => '0',
  2357. "property" => 'bottom',
  2358. )
  2359. )->setParam('hide_wrapper_start', true);
  2360.  
  2361. $navigation_spacing_section->addStyleControl(
  2362. array(
  2363. "selector" => $next_selector,
  2364. "control_type" => 'measurebox',
  2365. "default" => '0',
  2366. "property" => 'left',
  2367. )
  2368. )->setParam('hide_wrapper_end', true);
  2369.  
  2370. $navigation_spacing_section->addStyleControl(
  2371. array(
  2372. "selector" => $next_selector,
  2373. "control_type" => 'measurebox',
  2374. "default" => '0',
  2375. "property" => 'right',
  2376. )
  2377. )->setParam('hide_wrapper_start', true);
  2378.  
  2379.  
  2380.  
  2381. /**
  2382. * Disabled
  2383. */
  2384. $nav_disabled_section = $navigation_section->addControlSection("nav_disabled_section", __("Disabled"), "assets/icon.png", $this);
  2385.  
  2386. $navigation_icon_disabled_selector = '.oxy-carousel-builder_icon_disabled';
  2387.  
  2388. $nav_disabled_section->addStyleControls(
  2389. array(
  2390. array(
  2391. "name" => __('Disabled Background Color'),
  2392. "property" => 'background-color',
  2393. "selector" => $navigation_icon_disabled_selector,
  2394. "condition" => 'wrap_around=false'
  2395. ),
  2396. array(
  2397. "name" => __('Disabled Color'),
  2398. "property" => 'color',
  2399. "selector" => $navigation_icon_disabled_selector,
  2400. "condition" => 'wrap_around=false'
  2401. ),
  2402. array(
  2403. "name" => __('Disabled Border Color'),
  2404. "property" => 'border-color',
  2405. "selector" => $navigation_icon_disabled_selector,
  2406. "condition" => 'wrap_around=false'
  2407. ),
  2408. array(
  2409. "name" => __('Disabled Opacity'),
  2410. "property" => 'opacity',
  2411. "selector" => $navigation_icon_disabled_selector,
  2412. "condition" => 'wrap_around=false'
  2413. )
  2414. )
  2415. );
  2416.  
  2417.  
  2418. $navigation_colors_section = $navigation_section->addControlSection("navigation_colors_section", __("Colors"), "assets/icon.png", $this);
  2419.  
  2420.  
  2421. $navigation_colors_section->addStyleControls(
  2422. array(
  2423. array(
  2424. "name" => __('Background Color'),
  2425. "property" => 'background-color',
  2426. "default" => '#222',
  2427. "selector" => $navigation_icon_selector,
  2428. ),
  2429. array(
  2430. "name" => __('Hover Background Color'),
  2431. "property" => 'background-color',
  2432. "selector" => $navigation_icon_selector.":hover",
  2433. ),
  2434. array(
  2435. "name" => __('Icon Color'),
  2436. "property" => 'color',
  2437. "default" => '#fff',
  2438. "selector" => $navigation_icon_selector,
  2439. ),
  2440. array(
  2441. "name" => __('Hover Icon Color'),
  2442. "property" => 'color',
  2443. "selector" => $navigation_icon_selector.":hover",
  2444. )
  2445. )
  2446. );
  2447.  
  2448. $navigation_colors_section->addStyleControl(
  2449. array(
  2450. "name" => __('Hover Transition Duration'),
  2451. "property" => 'transition-duration',
  2452. "selector" => $navigation_icon_selector,
  2453. "control_type" => 'slider-measurebox',
  2454. "default" => '400',
  2455. )
  2456. )->setUnits('ms','ms')
  2457. ->setRange(10, 800, 5);
  2458.  
  2459. $navigation_section->borderSection('Borders', $navigation_icon_selector,$this);
  2460. $navigation_section->boxShadowSection('Shadows', $navigation_icon_selector,$this);
  2461.  
  2462.  
  2463.  
  2464. $navigation_section->addOptionControl(
  2465. array(
  2466. "type" => 'textfield',
  2467. "name" => __('Previous Selector'),
  2468. "slug" => 'previous_selector',
  2469. "default" => '.prev-btn',
  2470. "condition" => 'nav_type=custom'
  2471. )
  2472. );
  2473.  
  2474. $navigation_section->addOptionControl(
  2475. array(
  2476. "type" => 'textfield',
  2477. "name" => __('Next Selector'),
  2478. "slug" => 'next_selector',
  2479. "default" => '.next-btn',
  2480. "condition" => 'nav_type=custom'
  2481. )
  2482. );
  2483.  
  2484.  
  2485.  
  2486.  
  2487. /**
  2488. * Page Dots
  2489. */
  2490. $dots_section = $this->addControlSection("dots_section", __("Page Dots"), "assets/icon.png", $this);
  2491.  
  2492.  
  2493. $dots_section->addOptionControl(
  2494. array(
  2495. 'type' => 'buttons-list',
  2496. 'name' => 'Dots Display',
  2497. 'slug' => 'page_dots',
  2498. 'default' => 'true'
  2499. )
  2500.  
  2501. )->setValue(array(
  2502. "true" => "Enable",
  2503. "false" => "Disable"
  2504. )
  2505. )->setValueCSS( array(
  2506. "false" => " .flickity-page-dots {
  2507. display: none;
  2508. }",
  2509. ) );
  2510.  
  2511.  
  2512. $dots_section->addOptionControl(
  2513. array(
  2514. "name" => __('Hide Dots Below'),
  2515. "slug" => 'hide_dots_below',
  2516. "type" => 'medialist',
  2517. "default" => 'never',
  2518. "condition" => 'page_dots=true'
  2519. )
  2520. );
  2521.  
  2522. /**
  2523. * Dot Styles
  2524. */
  2525. $dots_styles_section = $dots_section->addControlSection("dots_styles_sectionf", __("Dot Styles"), "assets/icon.png", $this);
  2526.  
  2527. $dots_styles_section->addStyleControls(
  2528. array(
  2529. array(
  2530. "selector" => $dot_selector,
  2531. "property" => 'background-color',
  2532. "condition" => 'page_dots=true'
  2533. ),
  2534. array(
  2535. "selector" => $dot_selector,
  2536. "property" => 'opacity',
  2537. "default" => '0.25',
  2538. "condition" => 'page_dots=true'
  2539. ),
  2540. array(
  2541. "default" => "20",
  2542. "selector" => $dot_selector,
  2543. "property" => 'border-radius',
  2544. "condition" => 'page_dots=true'
  2545. ),
  2546. )
  2547. );
  2548.  
  2549. $dots_styles_section->addStyleControl(
  2550. array(
  2551. "default" => "10",
  2552. "property" => 'height',
  2553. "control_type" => 'slider-measurebox',
  2554. "selector" => $dot_selector,
  2555. "condition" => 'page_dots=true'
  2556. )
  2557. )
  2558. ->setUnits('px','px')
  2559. ->setRange('1','20','1');
  2560.  
  2561. $dots_styles_section->addStyleControl(
  2562. array(
  2563. "default" => "10",
  2564. "property" => 'width',
  2565. "control_type" => 'slider-measurebox',
  2566. "selector" => $dot_selector,
  2567. "condition" => 'page_dots=true'
  2568. )
  2569. )
  2570. ->setUnits('px','px')
  2571. ->setRange('1','30','1');
  2572.  
  2573.  
  2574.  
  2575. $dots_styles_section->addStyleControl(
  2576. array(
  2577. "name" => 'Margin Between',
  2578. "default" => "8",
  2579. "property" => 'margin-left|margin-right',
  2580. "control_type" => 'slider-measurebox',
  2581. "selector" => $dot_selector,
  2582. "condition" => 'page_dots=true'
  2583. )
  2584. )
  2585. ->setUnits('px','px')
  2586. ->setRange('0','10','1');
  2587.  
  2588.  
  2589.  
  2590.  
  2591. /**
  2592. * Selected Page Dots
  2593. */
  2594. $dots_selected_section = $dots_section->addControlSection("dots_selected_section", __("Selected Dot"), "assets/icon.png", $this);
  2595.  
  2596.  
  2597. $dots_selected_section->addStyleControls(
  2598. array(
  2599. array(
  2600. "name" => 'Selected background color',
  2601. "selector" => $dot_selected_selector,
  2602. "property" => 'background-color',
  2603. "condition" => 'page_dots=true'
  2604. ),
  2605. array(
  2606. "name" => 'Selected opacity',
  2607. "selector" => $dot_selected_selector,
  2608. "property" => 'opacity',
  2609. "default" => '1',
  2610. "condition" => 'page_dots=true'
  2611. ),
  2612.  
  2613. )
  2614. );
  2615.  
  2616.  
  2617. $dots_selected_section->addStyleControl(
  2618. array(
  2619. "name" => __('Scale'),
  2620. "selector" => $dot_selected_selector,
  2621. "property" => '--selected-dot-scale',
  2622. "control_type" => 'slider-measurebox',
  2623. "default" => '1',
  2624. )
  2625. )
  2626. ->setRange('0','2', '.02');
  2627.  
  2628. $dots_selected_section->addStyleControl(
  2629. array(
  2630. "name" => __('Transition duration'),
  2631. "property" => 'transition-duration',
  2632. "selector" => $dot_selector,
  2633. "control_type" => 'slider-measurebox',
  2634. "default" => '0',
  2635. )
  2636. )->setUnits('ms','ms')
  2637. ->setRange(10, 800, 5);
  2638.  
  2639.  
  2640.  
  2641. $dots_position_section = $dots_section->addControlSection("dot_position_section", __("Positioning"), "assets/icon.png", $this);
  2642.  
  2643. $dots_position_section->addStyleControl(
  2644. array(
  2645. "name" => __('Position'),
  2646. "selector" => '.oxy-carousel-builder_inner .flickity-page-dots',
  2647. "property" => 'position',
  2648. "control_type" => 'buttons-list',
  2649. )
  2650. )->setValue(array(
  2651. "relative" => "Relative",
  2652. "absolute" => "Absolute",
  2653. )
  2654. )->setDefaultValue('relative');
  2655.  
  2656.  
  2657.  
  2658. $dots_position_section->addStyleControl(
  2659. array(
  2660. "selector" => $dots_selector,
  2661. "control_type" => 'measurebox',
  2662. "value" => '0',
  2663. "property" => 'top',
  2664. "condition" => 'page_dots=true'
  2665. )
  2666. )->setParam('hide_wrapper_end', true);
  2667.  
  2668. $dots_position_section->addStyleControl(
  2669. array(
  2670. "selector" => $dots_selector,
  2671. "control_type" => 'measurebox',
  2672. "value" => '-25',
  2673. "property" => 'bottom',
  2674. "condition" => 'page_dots=true'
  2675. )
  2676. )->setUnits('px', 'px,%,em,auto,vw,vh')
  2677. ->setParam('hide_wrapper_start', true);
  2678.  
  2679. $dots_position_section->addStyleControl(
  2680. array(
  2681. "selector" => $dots_selector,
  2682. "control_type" => 'measurebox',
  2683. "value" => '0',
  2684. "property" => 'left',
  2685. "condition" => 'page_dots=true'
  2686. )
  2687. )->setParam('hide_wrapper_end', true);
  2688.  
  2689. $dots_position_section->addStyleControl(
  2690. array(
  2691. "selector" => $dots_selector,
  2692. "control_type" => 'measurebox',
  2693. "value" => '0',
  2694. "property" => 'right',
  2695. "condition" => 'page_dots=true'
  2696. )
  2697. )->setParam('hide_wrapper_start', true);
  2698.  
  2699.  
  2700.  
  2701.  
  2702.  
  2703.  
  2704. /**
  2705. * Captions
  2706. */
  2707. $caption_section = $this->addControlSection("caption_section", __("Gallery Captions"), "assets/icon.png", $this);
  2708. $caption_selector = '.oxy-carousel-builder_caption';
  2709.  
  2710. $caption_section->addCustomControl(
  2711. '<div style="color: #eee; line-height: 1.3; font-size: 13px;">Captions are available for galleries (if ACF use "Image Array" as return value)</div>','description');
  2712.  
  2713.  
  2714. $caption_section->addOptionControl(
  2715. array(
  2716. 'type' => 'buttons-list',
  2717. 'name' => __("Image captions"),
  2718. 'slug' => 'maybe_captions',
  2719. "condition" => 'carousel_type=acf_gallery||carousel_type=medialibrary||carousel_type=metabox_image'
  2720. )
  2721.  
  2722. )->setValue(array(
  2723. "true" => "Enable",
  2724. "false" => "Disable",
  2725. )
  2726. )->setDefaultValue('false')
  2727. ->setValueCSS( array(
  2728. "true" => " .oxy-carousel-builder_caption {
  2729. display: flex;
  2730. }",
  2731. "false" => " .oxy-carousel-builder_caption {
  2732. display: none;
  2733. }",
  2734.  
  2735. ) );
  2736.  
  2737.  
  2738. $caption_section->addPreset(
  2739. "padding",
  2740. "caption_padding",
  2741. __("Padding"),
  2742. $caption_selector
  2743. )->whiteList();
  2744.  
  2745.  
  2746. $caption_section->addStyleControl(
  2747. array(
  2748. "name" => __('Align'),
  2749. "selector" => $caption_selector,
  2750. "property" => 'justify-content',
  2751. "control_type" => 'buttons-list',
  2752. )
  2753. )->setValue(array(
  2754. "flex-start" => "Left",
  2755. "center" => "Center",
  2756. "flex-end" => "Right",
  2757. )
  2758. )->setDefaultValue('center');
  2759.  
  2760. $caption_section->addStyleControl(
  2761. array(
  2762. "name" => __('Color'),
  2763. "default" => '#fff',
  2764. "property" => 'color',
  2765. "selector" => $caption_selector,
  2766. )
  2767. )->setParam('hide_wrapper_end', true);
  2768.  
  2769. $caption_section->addStyleControl(
  2770. array(
  2771. "name" => __('Hover Color'),
  2772. "property" => 'color',
  2773. "selector" => '.oxy-carousel-builder_gallery-image:hover ' .$caption_selector,
  2774. )
  2775. )->setParam('hide_wrapper_start', true);
  2776.  
  2777.  
  2778. $caption_section->addStyleControl(
  2779. array(
  2780. "name" => __('Background'),
  2781. "default" => 'rgba(50,50,50,0.2)',
  2782. "property" => 'background-color',
  2783. "selector" => $caption_selector,
  2784. )
  2785. )->setParam('hide_wrapper_end', true);
  2786.  
  2787. $caption_section->addStyleControl(
  2788. array(
  2789. "name" => __('Hover background'),
  2790. "property" => 'background-color',
  2791. "selector" => '.oxy-carousel-builder_gallery-image:hover ' .$caption_selector,
  2792. )
  2793. )->setParam('hide_wrapper_start', true);
  2794.  
  2795. $caption_section->typographySection('Typography', $caption_selector, $this);
  2796.  
  2797.  
  2798. /**
  2799. * Loading
  2800. */
  2801. $loading_section = $this->addControlSection("loading_section", __("Loading / Performance"), "assets/icon.png", $this);
  2802.  
  2803.  
  2804. $loading_section->addOptionControl(
  2805. array(
  2806. 'type' => 'buttons-list',
  2807. 'name' => __('Support lazy loading'),
  2808. 'slug' => 'maybe_lazy',
  2809. "condition" => 'carousel_type=repeater||carousel_type=easy_posts||carousel_type=custom||carousel_type=acf_gallery||carousel_type=medialibrary||carousel_type=metabox_image'
  2810. )
  2811.  
  2812. )->setValue(array( "true" => "Enabled", "false" => "Disabled" ))
  2813. ->setDefaultValue('false')
  2814. ->setValueCSS( array(
  2815. "true" => " [data-flickity-lazyload] {
  2816. opacity: 0;
  2817. }
  2818.  
  2819. .flickity-lazyloaded,
  2820. .flickity-lazyerror {
  2821. opacity: 1;
  2822. }
  2823. "
  2824. ) )->setParam("description", __("Add the 'data-flickity-lazyload' attribute with the image URL on the images"));
  2825.  
  2826.  
  2827. $loading_section->addOptionControl(
  2828. array(
  2829. 'type' => 'buttons-list',
  2830. 'name' => __('Support background lazy loading'),
  2831. 'slug' => 'maybe_bg_lazy',
  2832. "condition" => 'carousel_type=repeater||carousel_type=easy_posts||carousel_type=custom'
  2833. )
  2834.  
  2835. )->setValue(array( "true" => "Enabled", "false" => "Disabled" ))
  2836. ->setDefaultValue('false')
  2837. ->setParam("description", __("Add the 'data-flickity-bg-lazyload' attribute with the image URL on elmenents with the background images"));
  2838.  
  2839.  
  2840. $loading_section->addOptionControl(
  2841. array(
  2842. "type" => 'slider-measurebox',
  2843. "name" => __('Lazy loading after how many cells?'),
  2844. "slug" => 'lazy_cells',
  2845. "default" => '2',
  2846. "condition" => 'maybe_lazy=true||maybe_bg_lazy=true'
  2847. )
  2848. )->setRange('1','10','1');
  2849.  
  2850.  
  2851. $loading_section->addStyleControl(
  2852. array(
  2853. "name" => __('Fade duration for lazy images'),
  2854. "property" => 'transition-duration',
  2855. "selector" => '[data-flickity-lazyload]',
  2856. "control_type" => 'slider-measurebox',
  2857. "default" => '400',
  2858. "condition" => 'maybe_lazy=true'
  2859. )
  2860. )->setUnits('ms','ms')
  2861. ->setRange(10, 800, 5);
  2862.  
  2863.  
  2864. $loading_section->addOptionControl(
  2865. array(
  2866. 'type' => 'buttons-list',
  2867. 'name' => __('Browser performance (will-change)'),
  2868. 'slug' => 'maybe_will_change',
  2869. )
  2870.  
  2871. )->setValue(array( "true" => "Enabled", "false" => "Disabled" ))
  2872. ->setDefaultValue('false')
  2873. ->setValueCSS( array(
  2874. "true" => " .oxy-inner-content [data-speed] {
  2875. transition: transform 0s;
  2876. -webkit-transition: transform 0s;
  2877. will-change: transform;
  2878. }
  2879.  
  2880. .flickity-slider {
  2881. will-change: transform;
  2882. }
  2883. "
  2884. ) )
  2885. ->setParam("description", __("Enabling will generally result in a smoother transition"));
  2886.  
  2887.  
  2888. $loading_section->addOptionControl(
  2889. array(
  2890. 'type' => 'buttons-list',
  2891. 'name' => __('SRCSET images?'),
  2892. 'slug' => 'maybe_srcset',
  2893. "condition" => 'carousel_type=medialibrary||carousel_type=metabox_image'
  2894. )
  2895. )->setValue(array( "true" => "Enabled", "false" => "Disabled" ))
  2896. ->setDefaultValue('true');
  2897.  
  2898.  
  2899. $loading_section->addOptionControl(
  2900. array(
  2901. 'type' => 'buttons-list',
  2902. 'name' => __('Fade in carousel only after initialised'),
  2903. 'slug' => 'maybe_fouc',
  2904. )
  2905.  
  2906. )->setValue(array( "true" => "Enabled", "false" => "Disabled" ))
  2907. ->setDefaultValue('false')
  2908. ->setValueCSS( array(
  2909. "true" => " .oxy-carousel-builder_hidden .oxy-carousel-builder_gallery-images {
  2910. display: none;
  2911. }
  2912.  
  2913. .oxy-carousel-builder_hidden .oxy-dynamic-list {
  2914. display: none;
  2915. }
  2916.  
  2917. .oxy-carousel-builder_hidden .oxy-posts {
  2918. display: none;
  2919. }
  2920. .oxy-carousel-builder_hidden ul.products {
  2921. display: none;
  2922. }
  2923. ",
  2924. ) )
  2925. ->setParam("description", __("If using carousel above the fold, will prevent FOUC"));
  2926.  
  2927.  
  2928.  
  2929. $loading_section->addStyleControl(
  2930. array(
  2931. "name" => __('Fade duration'),
  2932. "property" => '--fade-duration',
  2933. "selector" => '.oxy-carousel-builder_fadein',
  2934. "control_type" => 'slider-measurebox',
  2935. "condition" => 'maybe_fouc=true'
  2936. )
  2937. )->setUnits('ms','ms')
  2938. ->setRange(10, 1000, 1);
  2939.  
  2940. $loading_section->addOptionControl(
  2941. array(
  2942. 'type' => 'buttons-list',
  2943. 'name' => __('Overflow'),
  2944. 'slug' => 'viewport_overflow'
  2945. )
  2946.  
  2947. )->setValue(array(
  2948. "visible" => "Visible",
  2949. "hidden" => "Hidden"
  2950. )
  2951. )
  2952. ->setDefaultValue('hidden')
  2953. ->setValueCSS( array(
  2954. "visible" => " .flickity-viewport {
  2955. overflow: unset;
  2956. }",
  2957. "hidden" => " .oxy_dynamic_list:not(.flickity-enabled) {
  2958. overflow-x: hidden;
  2959. }
  2960.  
  2961. .oxy_dynamic_list.flickity-enabled .flickity-viewport {
  2962. overflow-x: hidden;
  2963. }
  2964.  
  2965. ul.products:not(.flickity-enabled) {
  2966. overflow-x: hidden;
  2967. }
  2968.  
  2969. ul.products.flickity-enabled .flickity-viewport {
  2970. overflow-x: hidden;
  2971. }
  2972.  
  2973. ul.products:not(.flickity-enabled) {
  2974. overflow-x: hidden;
  2975. }
  2976.  
  2977. .oxy-carousel-builder_gallery-images:not(.flickity-enabled) {
  2978. overflow-x: hidden;
  2979. }
  2980.  
  2981. ul.products.flickity-enabled .flickity-viewport {
  2982. overflow-x: hidden;
  2983. }
  2984.  
  2985. .oxy-posts:not(.flickity-enabled) {
  2986. overflow-x: hidden;
  2987. }
  2988.  
  2989. .oxy-posts.flickity-enabled .flickity-viewport {
  2990. overflow-x: hidden;
  2991. }",
  2992.  
  2993. ) )->setParam("description", __("Set to hidden to avoid overflow outside of the carousel. (Note if using arrows outside of the carousel, add overflow hidden to parent section instead"));
  2994.  
  2995.  
  2996. /*
  2997. $loading_section->addOptionControl(
  2998. array(
  2999. 'type' => 'buttons-list',
  3000. 'name' => __('Optimise for low CLS'),
  3001. 'slug' => 'maybe_cls'
  3002. )
  3003.  
  3004. )->setValue(array(
  3005. "enable" => "Enable",
  3006. "disable" => "Disable"
  3007. )
  3008. )
  3009. ->setDefaultValue('disable')
  3010. ->setValueCSS( array(
  3011. "disable" => " ",
  3012. "enable" => " .oxy-dynamic-list:not(.flickity-enabled) {
  3013. overflow-x: hidden;
  3014. }
  3015.  
  3016. .oxy-dynamic-list.flickity-enabled .flickity-viewport {
  3017. overflow-x: hidden;
  3018. }
  3019.  
  3020. .oxy-carousel-builder_gallery-images {
  3021. display: block;
  3022. }
  3023.  
  3024. .oxy-carousel-builder_gallery-images:not(.flickity-enabled) {
  3025. display: flex;
  3026. overflow-x: hidden;
  3027. }
  3028.  
  3029. .oxy-carousel-builder_hidden .oxy-carousel-builder_gallery-images:not(.flickity-enabled) {
  3030. display: flex;
  3031. }
  3032.  
  3033. .oxy-carousel-builder_hidden .oxy-dynamic-list:not(.flickity-enabled) {
  3034. display: flex;
  3035. }
  3036.  
  3037. .oxy-carousel-builder_hidden .oxy-posts:not(.flickity-enabled) {
  3038. display: flex;
  3039. }
  3040. .oxy-carousel-builder_hidden ul.products:not(.flickity-enabled) {
  3041. display: flex;
  3042. }
  3043.  
  3044. .oxy-carousel-builder_inner[data-carousel='.oxy-inner-content']:not(.flickity-enabled) {
  3045. overflow-x: hidden;
  3046. }",
  3047.  
  3048. ) )->setParam("description", __("Experimental: this could help reduce Content Layout Shifting"));
  3049. */
  3050.  
  3051. /**
  3052. * Syncing
  3053. */
  3054. $syncing_section = $this->addControlSection("syncing_section", __("Syncing"), "assets/icon.png", $this);
  3055.  
  3056.  
  3057. $syncing_section->addOptionControl(
  3058. array(
  3059. 'type' => 'buttons-list',
  3060. 'name' => __('Use as navigation for another carousel'),
  3061. 'slug' => 'maybe_asnavfor',
  3062. )
  3063. )
  3064. ->setDefaultValue('false')
  3065. ->setValue(array(
  3066. "true" => "Enable",
  3067. "false" => "Disable"
  3068. )
  3069. )->setValueCSS( array(
  3070. "true" => ".flickity-viewport .oxy-carousel-builder_gallery-image,
  3071. .flickity-viewport .oxy-dynamic-list > .ct-div-block,
  3072. .flickity-viewport .product,
  3073. .flickity-viewport .oxy-post {
  3074. cursor: pointer;
  3075. }
  3076. ",
  3077.  
  3078. ) )
  3079. ->setParam("description", __("Clicking the cells will navigate another carousel (one-way sync)"));
  3080.  
  3081.  
  3082. $syncing_section->addOptionControl(
  3083. array(
  3084. "type" => 'textfield',
  3085. "name" => __('Other carousel builder selector'),
  3086. "slug" => 'as_nav_for',
  3087. "default" => '#main-carousel-builder',
  3088. "condition" => 'maybe_asnavfor=true'
  3089. )
  3090. );
  3091.  
  3092.  
  3093. $syncing_section->addOptionControl(
  3094. array(
  3095. 'type' => 'buttons-list',
  3096. 'name' => __('Sync carousels'),
  3097. 'slug' => 'maybe_sync',
  3098. )
  3099.  
  3100. )->setValue(array(
  3101. "true" => "Enable",
  3102. "false" => "Disable"
  3103. )
  3104. )->setDefaultValue('false')
  3105. ->setParam("description", __("Selecting a cell, another carousel will select its matching cell (two-way sync)"));
  3106.  
  3107.  
  3108. $syncing_section->addOptionControl(
  3109. array(
  3110. "type" => 'textfield',
  3111. "name" => __('Other carousel builder selector'),
  3112. "slug" => 'sync_carousel',
  3113. "default" => '#my-other-carousel',
  3114. "condition" => 'maybe_sync=true'
  3115. )
  3116. );
  3117.  
  3118.  
  3119.  
  3120. /**
  3121. * Advanced
  3122. */
  3123. $config_other_section = $this->addControlSection("config_other_section", __("Advanced"), "assets/icon.png", $this);
  3124.  
  3125.  
  3126. $config_other_section->addOptionControl(
  3127. array(
  3128. 'type' => 'buttons-list',
  3129. 'name' => 'Percentage Position',
  3130. 'slug' => 'percentage_position'
  3131. )
  3132.  
  3133. )->setValue(array(
  3134. "true" => "Enable",
  3135. "false" => "Disable"
  3136. )
  3137. )->setDefaultValue('true')->setParam("description", __("Disable only if not using % for cell widths"));
  3138.  
  3139.  
  3140.  
  3141. $config_other_section->addOptionControl(
  3142. array(
  3143. 'type' => 'buttons-list',
  3144. 'name' => 'Keyboard navigation (accessibility)',
  3145. 'slug' => 'maybe_accessibility'
  3146. )
  3147.  
  3148. )
  3149. ->setDefaultValue('true')
  3150. ->setValue(array(
  3151. "true" => "Enable",
  3152. "false" => "Disable"
  3153. )
  3154. );
  3155.  
  3156.  
  3157. $config_other_section->addOptionControl(
  3158. array(
  3159. 'type' => 'buttons-list',
  3160. 'name' => __('Right to left'),
  3161. 'slug' => 'right_to_left'
  3162. )
  3163.  
  3164. )->setDefaultValue('false')
  3165. ->setValue(array(
  3166. "true" => "Enable",
  3167. "false" => "Disable"
  3168. )
  3169. );
  3170.  
  3171.  
  3172. $config_other_section->addOptionControl(
  3173. array(
  3174. 'type' => 'buttons-list',
  3175. 'name' => __('Woo results count'),
  3176. 'slug' => 'woo_results_count',
  3177. 'condition' => 'carousel_type=woo'
  3178. )
  3179.  
  3180. )->setDefaultValue('disable')
  3181. ->setValue(array(
  3182. "enable" => "Show",
  3183. "disable" => "Hide"
  3184. )
  3185. )->setValueCSS( array(
  3186. "enable" => " .woocommerce-result-count {
  3187. display: block;
  3188. }
  3189. ",
  3190. ) );
  3191.  
  3192.  
  3193. $config_other_section->addOptionControl(
  3194. array(
  3195. 'type' => 'buttons-list',
  3196. 'name' => __('Woo sorting dropdown'),
  3197. 'slug' => 'woo_sorting',
  3198. 'condition' => 'carousel_type=woo'
  3199. )
  3200.  
  3201. )->setDefaultValue('disable')
  3202. ->setValue(array(
  3203. "enable" => "Show",
  3204. "disable" => "Hide"
  3205. )
  3206. )->setValueCSS( array(
  3207. "enable" => " .woocommerce-ordering {
  3208. display: block;
  3209. }
  3210. ",
  3211. ) );
  3212.  
  3213.  
  3214. $config_other_section->addOptionControl(
  3215. array(
  3216. 'type' => 'buttons-list',
  3217. 'name' => __('Woo cart buttons'),
  3218. 'slug' => 'woo_cart_buttons',
  3219. 'condition' => 'carousel_type=woo'
  3220. )
  3221.  
  3222. )->setDefaultValue('display')
  3223. ->setValue(array(
  3224. "display" => "Show",
  3225. "hide" => "Hide"
  3226. )
  3227. )->setValueCSS( array(
  3228. "hide" => ".product .add_to_cart_button {
  3229. display: none;
  3230. }
  3231.  
  3232. .product .added_to_cart {
  3233. display: none;
  3234. }
  3235.  
  3236. .product .button {
  3237. display: none;
  3238. }",
  3239. ) );
  3240.  
  3241. $config_other_section->addOptionControl(
  3242. array(
  3243. 'type' => 'buttons-list',
  3244. 'name' => __('Woo prices'),
  3245. 'slug' => 'woo_price',
  3246. 'condition' => 'carousel_type=woo'
  3247. )
  3248.  
  3249. )->setDefaultValue('display')
  3250. ->setValue(array(
  3251. "display" => "Show",
  3252. "hide" => "Hide"
  3253. )
  3254. )->setValueCSS( array(
  3255. "hide" => ".product .price {
  3256. display: none;
  3257. }
  3258. ",
  3259. ) );
  3260.  
  3261.  
  3262. $config_other_section->addOptionControl(
  3263. array(
  3264. 'type' => 'buttons-list',
  3265. 'name' => __('Woo product title'),
  3266. 'slug' => 'woo_title',
  3267. 'condition' => 'carousel_type=woo'
  3268. )
  3269.  
  3270. )->setDefaultValue('display')
  3271. ->setValue(array(
  3272. "display" => "Show",
  3273. "hide" => "Hide"
  3274. )
  3275. )->setValueCSS( array(
  3276. "hide" => ".product .woocommerce-loop-product__title {
  3277. display: none;
  3278. }
  3279. ",
  3280. ) );
  3281.  
  3282.  
  3283. $config_other_section->addOptionControl(
  3284. array(
  3285. 'type' => 'buttons-list',
  3286. 'name' => 'Parallax Elements',
  3287. 'slug' => 'parallax_bg',
  3288. 'condition' => 'wrap_around=false&&carousel_type!=woo&&carousel_type!=custom&&maybe_fade!=true&&carousel_type!=medialibrary&&carousel_type!=acf_gallery'
  3289. )
  3290.  
  3291. )->setDefaultValue('false')
  3292. ->setValue(array(
  3293. "true" => "Enable",
  3294. "false" => "Disable"
  3295. )
  3296. )->setParam("description", __("Need to add the 'data-speed' attribute on inner elements with a value from 1 - 20"));
  3297.  
  3298. $config_other_section->addOptionControl(
  3299. array(
  3300. 'type' => 'buttons-list',
  3301. 'name' => __('Images loaded'),
  3302. 'slug' => 'images_loaded'
  3303. )
  3304.  
  3305. )->setDefaultValue('true')
  3306. ->setValue(array(
  3307. "true" => "Enable",
  3308. "false" => "Disable"
  3309. )
  3310. )->setParam("description", __("Re-positions cells once their images have loaded."));
  3311.  
  3312.  
  3313. $config_other_section->addOptionControl(
  3314. array(
  3315. 'type' => 'buttons-list',
  3316. 'name' => 'Enable cell selector for repeater',
  3317. 'slug' => 'maybe_cell_selector',
  3318. 'condition' => 'carousel_type=repeater'
  3319. )
  3320.  
  3321. )->setDefaultValue('false')
  3322. ->setValue(array(
  3323. "true" => "Enable",
  3324. "false" => "Disable"
  3325. )
  3326. )->setParam("description", __("To remove dependancy of the repeater IDs, you can give the repeater divs a class"));
  3327.  
  3328. $config_other_section->addOptionControl(
  3329. array(
  3330. "type" => 'textfield',
  3331. "name" => __('Cell selector'),
  3332. "slug" => 'cell_selector',
  3333. "default" => '',
  3334. "condition" => 'carousel_type=repeater&&maybe_cell_selector=true'
  3335. )
  3336. )->setParam("description", __("Add the selector for the class you've added to the repeater div for the cells"));
  3337.  
  3338.  
  3339.  
  3340.  
  3341.  
  3342.  
  3343. }
  3344.  
  3345.  
  3346.  
  3347. function defaultCSS() {
  3348.  
  3349. $css = ".oxygenberg-element.oxy-dynamic-list:empty:after {
  3350. display: block;
  3351. content: attr(gutenberg-placeholder);
  3352. }";
  3353.  
  3354. return $css;
  3355.  
  3356. }
  3357.  
  3358. function customCSS($options, $selector) {
  3359.  
  3360. $css = '';
  3361.  
  3362. if( ! $this->css_added ) {
  3363.  
  3364. $css .= file_get_contents( plugin_dir_path(__FILE__) . 'assets/flickity/flickity.css' );
  3365.  
  3366. $css .= ".oxy-carousel-builder {
  3367. display: flex;
  3368. flex-direction: column;
  3369. position: relative;
  3370. width: 100%;
  3371. --carousel-space-between: 0px;
  3372. --fade-duration: 400ms;
  3373. }
  3374.  
  3375. .oxy-carousel-builder .oxy-dynamic-list.flick:not(.ct-section) {
  3376. display: block;
  3377. }
  3378.  
  3379. .oxygen-builder-body .oxy-carousel-builder .flickity-prev-next-button,
  3380. .oxygen-builder-body .oxy-carousel-builder .flickity-page-dots {
  3381. z-index: 2147483643;
  3382. }
  3383.  
  3384. .oxy-carousel-builder .oxy-dynamic-list > div.flickity-viewport:not(.oxy_repeater_original):first-child {
  3385. display: block;
  3386. }
  3387.  
  3388. .oxy-carousel-builder .oxy-dynamic-list {
  3389. display: flex;
  3390. flex-direction: row;
  3391. flex-wrap: nowrap;
  3392. justify-content: flex-start;
  3393. }
  3394.  
  3395. .oxygen-builder-body .oxy-carousel-builder_gallery-images {
  3396. display: flex;
  3397. flex-direction: row;
  3398. flex-wrap: nowrap;
  3399. }
  3400.  
  3401. .oxy-carousel-builder .oxy-woo-element ul.products {
  3402. display: flex;
  3403. flex-direction: row;
  3404. flex-wrap: nowrap;
  3405. margin: 0;
  3406. }
  3407.  
  3408. .oxy-carousel-builder .oxy-carousel-builder_icon {
  3409. -webkit-tap-highlight-color: transparent;
  3410. -webkit-user-select: none;
  3411. -moz-user-select: none;
  3412. -ms-user-select: none;
  3413. user-select: none;
  3414. }
  3415.  
  3416. .oxy-carousel-builder ul.products::before {
  3417. content: none;
  3418. }
  3419.  
  3420. .oxy-carousel-builder .oxy-woo-element ul.products .product {
  3421. float: none;
  3422. padding: 0;
  3423. flex-shrink: 0;
  3424. }
  3425.  
  3426. .oxy-carousel-builder .oxy-post {
  3427. float: none;
  3428. flex-shrink: 0;
  3429. }
  3430.  
  3431. .oxy-carousel-builder .cell {
  3432. float: none;
  3433. flex-shrink: 0;
  3434. overflow: hidden;
  3435. }
  3436.  
  3437. .oxy-carousel-builder .flickity-viewport {
  3438. transition-property: height;
  3439. }
  3440.  
  3441. .oxy-carousel-builder .flickity-page-dots {
  3442. display: inline-flex;
  3443. align-items: center;
  3444. justify-content: center;
  3445. position: relative;
  3446. }
  3447.  
  3448. .oxy-carousel-builder .dot.is-selected:only-child {
  3449. display: none;
  3450. }
  3451.  
  3452. .oxy-carousel-builder .oxy-dynamic-list::after {
  3453. content: 'flickity';
  3454. display: none;
  3455. }
  3456.  
  3457. .oxy-carousel-builder ul.products::after {
  3458. content: 'flickity';
  3459. display: none;
  3460. }
  3461.  
  3462. .oxy-carousel-builder .oxy-posts::after {
  3463. content: 'flickity';
  3464. display: none;
  3465. }
  3466.  
  3467. .oxy-carousel-builder_gallery-images::after {
  3468. content: 'flickity';
  3469. display: none;
  3470. }
  3471.  
  3472. .oxy-carousel-builder .oxy-inner-content::after {
  3473. content: 'flickity';
  3474. display: none;
  3475. }
  3476.  
  3477. .oxy-carousel-builder .woocommerce-result-count,
  3478. .oxy-carousel-builder .woocommerce-ordering {
  3479. display: none;
  3480. }
  3481.  
  3482. .oxy-carousel-builder .oxy-dynamic-list > .ct-div-block,
  3483. .oxy-carousel-builder .oxy-dynamic-list .flickity-slider > .ct-div-block {
  3484. transition: transform 0.4s ease, background-color 0.4s ease, color 0.4s ease, opacity 0.4s ease;
  3485. -webkit-transition: -webkit-transform 0.4s ease, background-color 0.4s ease, color 0.4s ease, opacity 0.4s ease;
  3486. }
  3487.  
  3488. .oxy-carousel-builder_gallery-image {
  3489. flex-direction: column;
  3490. transition: transform 0.4s ease, background-color 0.4s ease, color 0.4s ease, opacity 0.4s ease;
  3491. -webkit-transition: -webkit-transform 0.4s ease, background-color 0.4s ease, color 0.4s ease, opacity 0.4s ease;
  3492. }
  3493.  
  3494. .oxy-carousel-builder ul.products .product,
  3495. .oxy-carousel-builder ul.products .flickity-slider > .product {
  3496. transition: transform 0.4s ease, background-color 0.4s ease, color 0.4s ease, opacity 0.4s ease;
  3497. -webkit-transition: -webkit-transform 0.4s ease, background-color 0.4s ease, color 0.4s ease, opacity 0.4s ease;
  3498. }
  3499.  
  3500. .oxy-carousel-builder .cell,
  3501. .oxy-carousel-builder .flickity-slider > .cell {
  3502. transition: transform 0.4s ease, background-color 0.4s ease, color 0.4s ease, opacity 0.4s ease;
  3503. -webkit-transition: -webkit-transform 0.4s ease, background-color 0.4s ease, color 0.4s ease, opacity 0.4s ease;
  3504. }
  3505.  
  3506. .oxy-carousel-builder .oxy-dynamic-list > .ct-div-block {
  3507. flex-shrink: 0;
  3508. overflow: hidden;
  3509. }
  3510.  
  3511. .oxy-carousel-builder .oxy-dynamic-list .flickity-slider > .ct-div-block {
  3512. flex-shrink: 0;
  3513. overflow: hidden;
  3514. }
  3515.  
  3516. .oxy-carousel-builder_gallery-image {
  3517. flex-shrink: 0;
  3518. overflow: hidden;
  3519. }
  3520.  
  3521. .oxy-carousel-builder_gallery-image img {
  3522. width: auto;
  3523. max-width: none;
  3524. vertical-align: middle;
  3525. }
  3526.  
  3527. .oxy-carousel-builder_icon {
  3528. background-color: #222;
  3529. color: #fff;
  3530. display: inline-flex;
  3531. font-size: 14px;
  3532. padding: .75em;
  3533. cursor: pointer;
  3534. transition-duration: 400ms;
  3535. transition-property: color, background-color;
  3536. }
  3537.  
  3538.  
  3539. .oxy-carousel-builder_icon {
  3540. top: 50%;
  3541. position: absolute;
  3542. transform: translateY(-50%);
  3543. -webkit-transform: translateY(-50%);
  3544. }
  3545.  
  3546. .oxy-carousel-builder_icon.oxy-carousel-builder_icon-fullscreen {
  3547. position: fixed;
  3548. z-index: 12;
  3549. }
  3550.  
  3551. .oxy-carousel-builder_prev {
  3552. left: 0;
  3553. }
  3554.  
  3555. .oxy-carousel-builder_next {
  3556. right: 0;
  3557. }
  3558.  
  3559. .oxy-carousel-builder_icon svg {
  3560. height: 1em;
  3561. width: 1em;
  3562. fill: currentColor;
  3563. }
  3564.  
  3565. .oxy-carousel-builder .flickity-page-dots .dot {
  3566. --selected-dot-scale: 1;
  3567. flex-shrink: 0;
  3568. }
  3569.  
  3570. .oxy-carousel-builder .oxy-repeater-pages-wrap {
  3571. display: none;
  3572. }
  3573.  
  3574. .oxy-carousel-builder .oxy-easy-posts-pages {
  3575. display: none;
  3576. }
  3577.  
  3578. .oxy-carousel-builder .is-next {
  3579. --cell-next-scale: 1;
  3580. --cell-next-rotate: 0deg;
  3581. }
  3582.  
  3583. .oxy-carousel-builder .is-selected {
  3584. --cell-selected-scale: 1;
  3585. --cell-selected-rotate: 0deg;
  3586. }
  3587.  
  3588. .oxy-carousel-builder .is-previous {
  3589. --cell-prev-scale: 1;
  3590. --cell-prev-rotate: 0deg;
  3591. }
  3592.  
  3593. .oxy-carousel-builder .oxy-inner-content [data-speed] {
  3594. transition: transform 0s;
  3595. -webkit-transition: transform 0s;
  3596. }
  3597.  
  3598.  
  3599. // In builder styles
  3600. .oxygen-builder-body .oxy-carousel-builder .oxy-dynamic-list .flickity-slider > .ct-div-block:not(:first-child) {
  3601. opacity: .4;
  3602. pointer-events: none;
  3603. }
  3604.  
  3605. .oxy-carousel-builder .oxy-inner-content:empty {
  3606. min-height: 80px;
  3607. }
  3608.  
  3609. .admin-bar .flickity-enabled.is-fullscreen .flickity-fullscreen-button {
  3610. top: 42px;
  3611. }
  3612.  
  3613. .flickity-fullscreen-button {
  3614. z-index: 10;
  3615. }
  3616.  
  3617. .oxy-carousel-builder .oxy-inner-content:empty + .flickity-page-dots .dot:not(:first-child) {
  3618. display: none;
  3619. }
  3620.  
  3621. .oxygen-builder-body .oxy-carousel-builder .oxy-dynamic-list.flickity-enabled {
  3622. pointer-events: none;
  3623. }
  3624.  
  3625. .oxygen-builder-body .oxy-carousel-builder .oxy-dynamic-list.flickity-enabled vime-dbl-click-fullscreen.enabled,
  3626. .oxygen-builder-body .oxy-carousel-builder .oxy-dynamic-list.flickity-enabled vime-click-to-play.enabled,
  3627. .oxygen-builder-body .oxy-carousel-builder .oxy-dynamic-list.flickity-enabled vime-controls,
  3628. .oxygen-builder-body .oxy-carousel-builder .oxy-dynamic-list.flickity-enabled vime-volume-control {
  3629. pointer-events: none;
  3630. }
  3631.  
  3632. .oxygen-builder-body .oxy-carousel-builder.ct-active .oxy-dynamic-list:not(.flickity-enabled) > div:not(.oxy_repeater_original) {
  3633. opacity: 0.5;
  3634. }
  3635.  
  3636.  
  3637. .oxygen-builder-body .oxy-carousel-builder .oxy-dynamic-list.flickity-enabled .oxy_repeater_original {
  3638. /* display: none!important; */
  3639. }
  3640.  
  3641. .oxygen-builder-body .oxy-flickity-buttons {
  3642. position: absolute;
  3643. display: block;
  3644. align-items: center;
  3645. color: #fff;
  3646. background-color: rgb(100, 0, 255);
  3647. z-index: 2147483641;
  3648. cursor: default;
  3649. }
  3650.  
  3651. .oxygen-builder-body .oxy-flickity-buttons .hide {
  3652. display: none;
  3653. }
  3654.  
  3655. .oxygen-builder-body .oxy-carousel-builder .oxy-inner-content[data-carousel='.oxy-inner-content'],
  3656. .oxygen-builder-body .oxy-carousel-builder .oxy-inner-content[data-carousel='.oxy-carousel-builder_gallery-images'] .oxy-carousel-builder_gallery-images,
  3657. .oxygen-builder-body .oxy-carousel-builder .oxy-inner-content[data-carousel='.oxy-posts'] .oxy-posts,
  3658. .oxygen-builder-body .oxy-carousel-builder .oxy-inner-content[data-carousel='.oxy-dynamic-list'] .oxy-dynamic-list,
  3659. .oxygen-builder-body .oxy-carousel-builder .oxy-inner-content[data-carousel='ul.products'] ul.products {
  3660. overflow-x: scroll;
  3661. }
  3662.  
  3663. [data-flickity-lazyload] {
  3664. transition: opacity .4s ease;
  3665. }
  3666.  
  3667. .oxy-carousel-builder_gallery-image-wrapper {
  3668. display: flex;
  3669. flex-direction: column;
  3670. position: relative;
  3671. }
  3672.  
  3673. .oxy-carousel-builder_caption {
  3674. display: none;
  3675. position: absolute;
  3676. bottom: 0;
  3677. width: 100%;
  3678. left: 0;
  3679. justify-content: center;
  3680. color: #fff;
  3681. background-color: rgba(66,60,60,0.2);
  3682. }
  3683.  
  3684. a.oxy-carousel-builder_gallery-image {
  3685. text-decoration: none;
  3686. }
  3687.  
  3688. .oxy-carousel-builder_fadein .oxy-carousel-builder_gallery-images,
  3689. .oxy-carousel-builder_fadein .oxy-dynamic-list,
  3690. .oxy-carousel-builder_fadein .oxy-posts,
  3691. .oxy-carousel-builder_fadein ul.products {
  3692. opacity: 0;
  3693. -webkit-transition: opacity;
  3694. transition-property: opacity;
  3695. -webkit-transition-delay: .1s;
  3696. transition-delay: .1s;
  3697. transition-duration: var(--fade-duration);
  3698. -webkit-transition-duration: var(--fade-duration);
  3699. }
  3700.  
  3701. .oxy-carousel-builder_fadein .oxy-carousel-builder_gallery-images.flickity-enabled,
  3702. .oxy-carousel-builder_fadein .oxy-dynamic-list.flickity-enabled,
  3703. .oxy-carousel-builder_fadein .oxy-posts.flickity-enabled,
  3704. .oxy-carousel-builder_fadein ul.products.flickity-enabled {
  3705. opacity: 1;
  3706. }
  3707.  
  3708. .oxygenberg-element.oxy-carousel-builder {
  3709. overflow-x: scroll;
  3710. }
  3711.  
  3712. body:not(.oxygen-builder-body) .oxy-carousel-builder_inner[data-carousel='.oxy-carousel-builder_gallery-images']:empty,
  3713. body:not(.oxygen-builder-body) .oxy-carousel-builder_inner[data-carousel='.oxy-carousel-builder_gallery-images']:empty + .oxy-carousel-builder_prev,
  3714. body:not(.oxygen-builder-body) .oxy-carousel-builder_inner[data-carousel='.oxy-carousel-builder_gallery-images']:empty + .oxy-carousel-builder_prev + .oxy-carousel-builder_next {
  3715. display: none;
  3716. }
  3717.  
  3718. ";
  3719.  
  3720. $this->css_added = true;
  3721.  
  3722. }
  3723.  
  3724. $css .= "$selector .oxy-posts {
  3725. display: flex;
  3726. flex-direction: row;
  3727. flex-wrap: nowrap;
  3728. }
  3729.  
  3730. $selector .is-next {
  3731.  
  3732. transform: scale(var(--cell-next-scale)) rotate(var(--cell-next-rotate));
  3733. -webkit-transform: scale(var(--cell-next-scale)) rotate(var(--cell-next-rotate));
  3734. }
  3735.  
  3736. $selector .is-selected:not(.dot) {
  3737.  
  3738. transform: scale(var(--cell-selected-scale)) rotate(var(--cell-selected-rotate));
  3739. -webkit-transform: scale(var(--cell-selected-scale)) rotate(var(--cell-selected-rotate));
  3740. }
  3741.  
  3742. $selector .is-previous {
  3743.  
  3744. transform: scale(var(--cell-prev-scale)) rotate(var(--cell-prev-rotate));
  3745. -webkit-transform: scale(var(--cell-prev-scale)) rotate(var(--cell-prev-rotate));
  3746. }
  3747.  
  3748. $selector .dot.is-selected {
  3749. transform: scale(var(--selected-dot-scale));
  3750. -webkit-transform: scale(var(--selected-dot-scale));
  3751. }
  3752.  
  3753. $selector .flickity-enabled.is-fullscreen img {
  3754. object-fit: cover;
  3755. }
  3756.  
  3757. $selector .flickity-enabled.is-fullscreen {
  3758. height: 100%!important;
  3759. z-index: 5;
  3760. }
  3761.  
  3762. $selector .flickity-enabled.is-fullscreen .oxy-inner-content {
  3763. height: 100%!important;
  3764. }
  3765.  
  3766. $selector .flickity-enabled.is-fullscreen .cell {
  3767. height: 100%!important;
  3768. }
  3769.  
  3770. $selector .flickity-enabled.is-fullscreen .product {
  3771. height: 100%!important;
  3772. }
  3773.  
  3774. $selector .flickity-enabled.is-fullscreen .oxy-dynamic-list > .ct-div-block {
  3775. height: 100%!important;
  3776. }
  3777.  
  3778. $selector .flickity-enabled.is-fullscreen .oxy-post {
  3779. height: 100%!important;
  3780. }
  3781.  
  3782. $selector .flickity-enabled.is-fullscreen > .ct-div-block,
  3783. $selector .flickity-enabled.is-fullscreen .flickity-slider > .ct-div-block,
  3784. $selector .oxy-inner-content .flickity-enabled.is-fullscreen {
  3785. height: 100%!important;
  3786. }
  3787.  
  3788. $selector .flickity-enabled.is-fullscreen .oxy-carousel-builder_gallery-image {
  3789. height: 100%;
  3790. }
  3791.  
  3792. $selector .flickity-enabled.is-fullscreen .oxy-carousel-builder_gallery-image img {
  3793. height: 100%;
  3794. }
  3795.  
  3796. $selector .flickity-enabled {
  3797. display: block;
  3798. }
  3799.  
  3800. $selector .oxy-dynamic-list.flickity-enabled {
  3801. display: block;
  3802. }
  3803.  
  3804. .oxygen-builder-body $selector [data-flickity-lazyload] {
  3805. opacity: 1;
  3806. }
  3807.  
  3808. ";
  3809.  
  3810. if (!isset($options["oxy-carousel-builder_editor_mode"]) || $options["oxy-carousel-builder_editor_mode"] === "preview") {
  3811.  
  3812. $css .= "
  3813.  
  3814. .oxygen-builder-body $selector .oxy-inner-content {
  3815. cursor: pointer;
  3816. }
  3817.  
  3818. .oxygen-builder-body $selector .oxy-inner-content + .flickity-page-dots {
  3819. display: none;
  3820. }
  3821.  
  3822. ";
  3823.  
  3824. }
  3825.  
  3826. if (!isset($options["oxy-carousel-builder_editor_mode"]) || $options["oxy-carousel-builder_editor_mode"] === "edit") {
  3827.  
  3828. $css .= "
  3829.  
  3830. .oxygen-builder-body $selector .oxy-dynamic-list:after {
  3831. content: '';
  3832. }
  3833.  
  3834.  
  3835. .oxygen-builder-body $selector .flickity-viewport + .flickity-page-dots {
  3836. display: none;
  3837. }
  3838.  
  3839. ";
  3840.  
  3841. }
  3842.  
  3843. if ((isset($options["oxy-carousel-builder_hide_dots_below"]) && $options["oxy-carousel-builder_hide_dots_below"]!="never")) {
  3844. $max_width = oxygen_vsb_get_media_query_size($options["oxy-carousel-builder_hide_dots_below"]);
  3845. $css .= "@media (max-width: {$max_width}px) {
  3846.  
  3847. $selector .flickity-page-dots {
  3848. display: none;
  3849. }
  3850.  
  3851. }";
  3852. }
  3853.  
  3854.  
  3855.  
  3856. return $css;
  3857. }
  3858.  
  3859. function output_js() {
  3860. wp_enqueue_script( 'flickity', plugin_dir_url( __FILE__ ) . 'assets/flickity/flickity.pkgd.min.js', '', '2.2.1' );
  3861. }
  3862.  
  3863. function output_fade_js() {
  3864. wp_enqueue_script( 'flickity-fade', plugin_dir_url( __FILE__ ) . 'assets/flickity/flickity-fade.js', '', '2.2.1' );
  3865. }
  3866.  
  3867. function output_bg_lazy_js() {
  3868. wp_enqueue_script( 'flickity-bg-lazy', plugin_dir_url( __FILE__ ) . 'assets/flickity/bg-lazyload.js', '', '1.0.1' );
  3869. }
  3870.  
  3871. function output_hash_js() {
  3872. wp_enqueue_script( 'flickity-hash', plugin_dir_url( __FILE__ ) . 'assets/flickity/hash.js', '', '1.0.3' );
  3873. }
  3874.  
  3875. function output_fullscreen_js() {
  3876. wp_enqueue_script( 'flickity-fullscreen', plugin_dir_url( __FILE__ ) . 'assets/flickity/flickity-fullscreen.js', '', '2.2.1' );
  3877. }
  3878.  
  3879. function output_sync_js() {
  3880. wp_enqueue_script( 'flickity-sync', plugin_dir_url( __FILE__ ) . 'assets/flickity/flickity-sync.js', '', '2.2.1' );
  3881. }
  3882.  
  3883. function output_init_js() {
  3884. if ( ! function_exists('do_oxygen_elements') ) {
  3885. wp_enqueue_script( 'flickity-init', plugin_dir_url( __FILE__ ) . 'assets/flickity/flickity-init.js', '', '2.3.1' );
  3886. } else {
  3887. wp_enqueue_script( 'flickity-init-js', plugin_dir_url( __FILE__ ) . 'assets/flickity/flickity-init-4.js', '', '2.3.1' );
  3888. }
  3889. }
  3890.  
  3891.  
  3892. }
  3893.  
  3894. new ExtraCarousel();
  3895. Copied
Add Comment
Please, Sign In to add comment
Public Pastes
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!