Changeset 2291595

Timestamp:

04/25/2020 02:09:01 PM (6 years ago)

Author:

processby

Message:

Responsive sidebar update

Location:

responsive-sidebar/trunk

Files:

• readme.txt (modified) (2 diffs)
• responsive-sidebar.php (modified) (1 diff)
• src/Admin/Settings.php (modified) (2 diffs)
• src/Frontend/Frontend.php (modified) (8 diffs)
• src/ResponsiveSidebarPlugin.php (modified) (2 diffs)
• views/admin/section/main-settings.php (modified) (2 diffs)

responsive-sidebar/trunk/readme.txt

@@ -5 +5 @@
 Requires at least: 5.0.3
 Tested up to: 5.4
-Stable tag: 1.1.1
+Stable tag: 1.2.0
 Requires PHP: 5.6
 License: GPLv2 or later
@@ -39 +39 @@
 == Changelog ==
 
+= 1.2.0 =
+Release Date: Apr 25, 2020
+
+* Support for multiple sidebars
+
+
 = 1.1.1 =
 Release Date: Apr 23, 2020

responsive-sidebar/trunk/responsive-sidebar.php

@@ -8 +8 @@
  * Plugin URI:        https://processby.com/responsive-sidebar-wordpress-plugin/
  * Description:       Makes your sidebar responsive.
- * Version:           1.1.1
+ * Version:           1.2.0
  * Author:            Processby
  * Author URI:        https://processby.com

responsive-sidebar/trunk/src/Admin/Settings.php

@@ -49 +49 @@
             'maxWidth' => $this->getOption('maxWidth'),
             'sidebarSwipe' => $this->getOption('sidebarSwipe'),
+            'sidebars' => $this->getOption('sidebars')
         ));
     }
@@ -69 +70 @@
     public function updateSettings($settings)
     {
+        //dump($settings); die;
         if(!isset($settings['sidebarSwipe']))
             $settings['sidebarSwipe'] = 0;
+
+        if(!isset($settings['sidebars']))
+            $settings['sidebars'] = array();
 
 

responsive-sidebar/trunk/src/Frontend/Frontend.php

@@ -60 +60 @@
         add_action('wp_footer', array($this, 'addButtonHtml'));
         add_action('wp_footer', array($this, 'addInlineScript'));
-
-    }
+        add_action( 'dynamic_sidebar_before', array($this, 'SidebarWrapBefore'), 10, 2 );
+        add_action( 'dynamic_sidebar_after', array($this, 'SidebarWrapAfter'), 10, 2 );
+
+    }
+
+    public function SidebarWrapBefore($index, $has_widgets)
+    {
+
+        foreach ($this->options['sidebars'] as  $sidebarId){
+            if( is_active_sidebar( $sidebarId ) &&  $index == $sidebarId){
+                echo '<div class="resp-sidebar-wrapper">';
+            }
+        }
+
+
+    }
+
+    public function SidebarWrapAfter($index, $has_widgets)
+    {
+
+        foreach ($this->options['sidebars'] as  $sidebarId){
+            if( is_active_sidebar( $sidebarId ) &&  $index == $sidebarId){
+                echo '</div>';
+            }
+        }
+
+
+    }
+
 
     public function enqueueScripts()
     {
-
 
     }
@@ -108 +134 @@
         $hiddenWidth = -$this->settings['sidebarWidth']-10;
 
-        $styles = "<style>
-        @media screen and (max-width: {$this->options['maxWidth']}px){
-            #{$this->options['cssClasses']} {
+
+        $styles = "<style> @media screen and (max-width: {$this->options['maxWidth']}px){";
+
+
+        if(!empty($this->options['sidebars'])){
+            $styles .= ".resp-sidebar-wrapper{
             display: block;
             position: fixed;
@@ -124 +153 @@
             transition-duration: 0.5s;
             transition-property: left;
-            }
-        }
-        #{$this->options['cssClasses']}.opened {
+            }";
+        } elseif(!empty($this->options['cssClasses'])){
+            $styles .=  "#{$this->options['cssClasses']}{
+            display: block;
+            position: fixed;
+            top: 0;
+            bottom: -100px;
+            left: {$hiddenWidth}px;
+            width: {$this->settings['sidebarWidth']}px;
+            overflow: auto;
+            z-index: 9999;
+            background: {$this->settings['sidebarBackground']};
+            $sidebarShadows;
+            padding-bottom: 100px;
+            transition-duration: 0.5s;
+            transition-property: left;
+            }";
+        }
+
+
+        $styles .= "
+        }
+        .resp-sidebar-wrapper.opened {
             left: 0;
         }";
+
+        if(!empty($this->options['cssClasses'])){
+            $styles .= "#{$this->options['cssClasses']}.opened {
+            left: 0;
+            }";
+        }
+
 
         if ($this->settings['enableButton']) {
@@ -192 +248 @@
     public function addInlineScript()
     {
-
+        if(!empty($this->options['sidebars'])){
+
+        }
         $ResponsiveSidebarScript = "<script type='text/javascript'>
 
-        var wr = document.getElementById('{$this->options['cssClasses']}');
-        var btn = document.getElementById('responsive-sidebar-btn');
+        var wrId = document.getElementById('{$this->options['cssClasses']}');  
+        var wr = document.getElementsByClassName('resp-sidebar-wrapper');
+        ";
+
+
+        $ResponsiveSidebarScript .= "var btn = document.getElementById('responsive-sidebar-btn');
         var openedClass = 'opened';
     
-        if(wr != null){
+        if(wrId != null || wr.length != 0){
              btn.style.cssText = '';
         }
@@ -212 +274 @@
         
         function openMobileSidebar() {
-            wr.classList.add(openedClass);
+        
+        if(wrId != null){
+             wrId.classList.add(openedClass);
+        }
+        if(wr.length != 0){
+              wr[0].classList.add(openedClass);
+        }    
             btn.classList.add(openedClass);
            
         }
         function closeMobileSidebar() {
-            wr.classList.remove(openedClass);
+         if(wrId != null){
+             wrId.classList.remove(openedClass);
+        }
+        if(wr.length != 0){
+              wr[0].classList.remove(openedClass);
+        }
             btn.classList.remove(openedClass);
-        }";
+        }
+        
+        function findAncestor (el, cls) {
+            while ((el = el.parentElement) && !el.classList.contains(cls));
+            return el;
+        }      
+        ";
+
+
 
         if ($this->options['sidebarSwipe']) {
+
             $ResponsiveSidebarScript .= "
             var touchstartX = 0;
@@ -227 +309 @@
             var touchendX = 0;
             var touchendY = 0;
-            var deltaY = 45;
+            var deltaY = 60;
             var deltaX = 10;
             var isSwiped;
@@ -235 +317 @@
                 touchstartX = event.changedTouches[0].screenX;
                 touchstartY = event.changedTouches[0].screenY;
-                event.path.forEach(function(element) {      
-                    if(element.classList.contains('widget_price_filter')){ 
-                        isSwiped = false;
-                    }
-                });
+                
+               if(findAncestor (event.target, 'widget_price_filter') != null){
+               isSwiped = false;
+               };
+               
              
             }, false);
@@ -256 +338 @@
                     if (touchendX < touchstartX && distanceY <= deltaY && distanceX >= deltaX) {   
                         if(isSwiped){
-                              wr.classList.remove(openedClass);
-                        btn.classList.remove(openedClass);
+                             closeMobileSidebar();
                         } 
                     }
-                    if (touchendX > touchstartX && distanceY <= deltaY && distanceX >= deltaX) {   
-                         if(isSwiped){
-                        wr.classList.add(openedClass);
-                        btn.classList.add(openedClass);
-                        }
+                    if (touchendX > touchstartX && distanceY <= deltaY && distanceX >= deltaX) { 
+                      
+                         if(isSwiped && touchstartX < 40){
+                            openMobileSidebar();
+                         }
                     }     
                 }";

responsive-sidebar/trunk/src/ResponsiveSidebarPlugin.php

@@ -14 +14 @@
 class ResponsiveSidebarPlugin {
 
-    const VERSION = '1.1.1';
+    const VERSION = '1.2.0';
 
     /**
@@ -64 +64 @@
         $options['maxWidth'] = Settings::MAX_WIDTH;
         $options['sidebarSwipe'] = Settings::SIDEBAR_SWIPE;
+        $options['sidebars'] = array();
         update_option(Settings::OPTIONS, $options);
     }

responsive-sidebar/trunk/views/admin/section/main-settings.php

@@ -6 +6 @@
 
 use  ResponsiveSidebar\Admin\Settings;
+
+
+$sidebarsWidgets = wp_get_sidebars_widgets();
+global $wp_registered_sidebars;
+
 
 echo '<h3>'.__('Appearance settings', 'responsive-sidebar').' <a href="' .
@@ -26 +31 @@
 
     <tr>
-        <th scope="row"><?php _e('Responsive sidebar id','responsive-sidebar') ?></th>
+        <th scope="row"><?php _e('Select a sidebar','responsive-sidebar') ?></th>
+        <td>
+            <?php
+
+            foreach ($sidebarsWidgets as $key => $sidebar) {
+                if(!empty($sidebar) && $key != 'wp_inactive_widgets'){ ?>
+                    <label>
+                        <input type="checkbox" name="<?php echo Settings::OPTIONS; ?>[sidebars][]" value="<?= $key; ?>" <?= array_search($key, $sidebars) !== false?'checked':''; ?>>
+                        <?= $wp_registered_sidebars[$key]['name']; ?>
+                    </label><br>
+                    <p><?= $wp_registered_sidebars[$key]['description']; ?></p><br>
+               <?php }
+
+            }
+            ?>
+        </td>
+    </tr>
+
+    <tr>
+        <th scope="row"><?php _e('Or enter the ID of the sidebar','responsive-sidebar') ?></th>
         <td>
             <input type="text"  name="<?=Settings::OPTIONS?>[cssClasses]" size="26" value="<?php echo esc_attr( $cssClasses ) ?>" />