WordPress.org
Get WordPress

Plugin Directory

Changeset 2332321


Ignore:
Timestamp:
06/29/2020 11:20:21 AM (5 years ago)
Author:
processby
Message:

Responsive Sidebar update

Location:
responsive-sidebar/trunk
Files:
5 edited

Legend:

Unmodified
Added
Removed

  • responsive-sidebar/trunk/readme.txt

    r2291595 r2332321  
    55Requires at least: 5.0.3
    66Tested up to: 5.4
    7 Stable tag: 1.2.0
     7Stable tag: 1.2.1
    88Requires PHP: 5.6
    99License: GPLv2 or later
    … …  
    3939== Changelog ==
    4040
     41= 1.2.1 =
     42Release Date: June 29, 2020
     43
     44* Improved styles settings
     45
     46
    4147= 1.2.0 =
    4248Release Date: Apr 25, 2020

  • responsive-sidebar/trunk/responsive-sidebar.php

    r2291595 r2332321  
    88 * Plugin URI:        https://processby.com/responsive-sidebar-wordpress-plugin/
    99 * Description:       Makes your sidebar responsive.
    10  * Version:           1.2.0
     10 * Version:           1.2.1
    1111 * Author:            Processby
    1212 * Author URI:        https://processby.com

  • responsive-sidebar/trunk/src/Admin/Customizer.php

    r2290403 r2332321  
    6767
    6868
     69        $selectOptions = array('choices' => array(
     70            'left' => __('Left', 'responsive-sidebar'),
     71            'right' => __('Right', 'responsive-sidebar'),
     72        ),
     73            'default' => 'left',
     74            'label' => __('Sidebar position', 'responsive-sidebar'),
     75        );
     76
     77        $this->addSetting('sidebar_position', 'select', $wp_customize, $selectOptions);
     78
     79
    6980
    7081        $checkboxOptions = array(
    … …  
    7384        );
    7485        $this->addSetting('sidebar_shadows', 'checkbox', $wp_customize, $checkboxOptions);
     86
     87
     88        $checkboxOptions = array(
     89            'label' => __('Blackout', 'responsive-sidebar'),
     90            'default' => 1
     91        );
     92        $this->addSetting('sidebar_blackout', 'checkbox', $wp_customize, $checkboxOptions);
    7593
    7694

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

    r2291595 r2332321  
    3636            'sidebarBackground' => get_theme_mod('sidebar_background_color', '#ffffff'),
    3737            'sidebarWidth' => get_theme_mod('sidebar_width', 280),
     38            'sidebarPosition' => get_theme_mod('sidebar_position', 'left'),
    3839            'sidebarShadows' => get_theme_mod('sidebar_shadows', 1),
     40            'sidebarBlackout' => get_theme_mod('sidebar_blackout', 1),
    3941            'enableButton' => get_theme_mod('enable_button', 1),
    4042            'buttonBackground' => get_theme_mod('button_background_color', '#ffffff'),
    … …  
    131133        }
    132134
    133 
    134135        $hiddenWidth = -$this->settings['sidebarWidth']-10;
    135136
     137        switch ($this->settings['sidebarPosition']){
     138            case 'right':
     139
     140                $sidebar = "
     141                right: {$hiddenWidth}px;
     142                transition-property: right;
     143                ";
     144                $sidebarPosition = "
     145                right: 0;
     146                ";
     147                break;
     148            case 'left':
     149
     150                $sidebar = "
     151                left: {$hiddenWidth}px;
     152                transition-property: left;
     153                ";
     154                $sidebarPosition = "
     155                left: 0;
     156                ";
     157                break;
     158        }
    136159
    137160        $styles = "<style> @media screen and (max-width: {$this->options['maxWidth']}px){";
    … …  
    144167            top: 0;
    145168            bottom: -100px;
    146             left: {$hiddenWidth}px;
     169            $sidebar
    147170            width: {$this->settings['sidebarWidth']}px;
    148171            overflow: auto;
    … …  
    152175            padding-bottom: 100px;
    153176            transition-duration: 0.5s;
    154             transition-property: left;
    155177            }";
    156178        } elseif(!empty($this->options['cssClasses'])){
    … …  
    160182            top: 0;
    161183            bottom: -100px;
    162             left: {$hiddenWidth}px;
     184            $sidebar
    163185            width: {$this->settings['sidebarWidth']}px;
    164186            overflow: auto;
    … …  
    168190            padding-bottom: 100px;
    169191            transition-duration: 0.5s;
    170             transition-property: left;
    171192            }";
    172193        }
    … …  
    176197        }
    177198        .resp-sidebar-wrapper.opened {
    178             left: 0;
    179         }";
     199            $sidebarPosition
     200        }
     201        body{
     202         position: relative;
     203         }
     204         
     205        #responsive-sidebar-close {
     206            display:none;
     207            position: absolute;
     208            width: 100%;
     209            height: 100%;
     210            z-index: 1000;
     211        }
     212         #responsive-sidebar-close.opened {
     213            display: block;
     214            cursor: pointer;
     215        }
     216        ";
     217
     218        if($this->settings['sidebarBlackout']){
     219            $styles .= "#responsive-sidebar-close.opened {
     220           background-color: rgba(0,0,0,.49);
     221            }";
     222        }
    180223
    181224        if(!empty($this->options['cssClasses'])){
    182225            $styles .= "#{$this->options['cssClasses']}.opened {
    183             left: 0;
     226            $sidebarPosition
    184227            }";
    185228        }
    … …  
    228271        }
    229272
     273
    230274        $text = '';
    231275        if($this->settings['button_text'] != ''){
    … …  
    258302
    259303
    260         $ResponsiveSidebarScript .= "var btn = document.getElementById('responsive-sidebar-btn');
     304        $ResponsiveSidebarScript .= "var btn = document.getElementsByClassName('responsive-sidebar-btn');
    261305        var openedClass = 'opened';
    262    
     306       
     307        var close = document.createElement('div');
     308        close.id = 'responsive-sidebar-close'; 
     309        document.body.prepend(close);
     310
    263311        if(wrId != null || wr.length != 0){
    264              btn.style.cssText = '';
     312       
     313        for (var i = 0; i < btn.length; i++) {
     314           btn[i].style.cssText = '';
     315        }
     316       
     317             
     318        }
     319       
     320        for (var i = 0; i < btn.length; i++) {
     321            btn[i].addEventListener('click', function() {
     322              if(!this.classList.contains(openedClass)){
     323                    openMobileSidebar();
     324              }else{
     325                  closeMobileSidebar();
     326              }           
     327            });
    265328        }
    266329       
    267         btn.addEventListener('click', function() {
    268           if(!this.classList.contains(openedClass)){
    269                 openMobileSidebar();
    270           }else{
    271               closeMobileSidebar();
    272           }           
     330        close.addEventListener('click', function() {
     331              closeMobileSidebar();             
    273332        });
    274333       
    275334        function openMobileSidebar() {
    276335       
    277         if(wrId != null){
    278              wrId.classList.add(openedClass);
    279         }
    280         if(wr.length != 0){
    281               wr[0].classList.add(openedClass);
    282         }   
    283             btn.classList.add(openedClass);
    284            
    285         }
     336            close.classList.add(openedClass);
     337       
     338            if(wrId != null){
     339                 wrId.classList.add(openedClass);
     340            }
     341            if(wr.length != 0){
     342                  wr[0].classList.add(openedClass);
     343            }   
     344           
     345                  for (var i = 0; i < btn.length; i++) {
     346                    btn[i].classList.add(openedClass);
     347                }
     348               
     349        }
     350       
    286351        function closeMobileSidebar() {
    287          if(wrId != null){
    288              wrId.classList.remove(openedClass);
    289         }
    290         if(wr.length != 0){
    291               wr[0].classList.remove(openedClass);
    292         }
    293             btn.classList.remove(openedClass);
     352       
     353            close.classList.remove(openedClass);
     354           
     355            if(wrId != null){
     356                 wrId.classList.remove(openedClass);
     357            }
     358            if(wr.length != 0){
     359                  wr[0].classList.remove(openedClass);
     360            }
     361           
     362            for (var i = 0; i < btn.length; i++) {
     363               btn[i].classList.remove(openedClass);
     364            }     
    294365        }
    295366       
    … …  
    304375        if ($this->options['sidebarSwipe']) {
    305376
    306             $ResponsiveSidebarScript .= "
     377
     378            switch ($this->settings['sidebarPosition']){
     379                case 'right':
     380
     381                    $ResponsiveSidebarScript .= "
     382            var touchstartX = 0;
     383            var touchstartY = 0;
     384            var touchendX = 0;
     385            var touchendY = 0;
     386            var deltaY = 60;
     387            var deltaX = 10;
     388            var isSwiped;
     389       
     390            document.body.addEventListener('touchstart', function(event) {
     391                isSwiped  = true;
     392                touchstartX = event.changedTouches[0].screenX;
     393                touchstartY = event.changedTouches[0].screenY;
     394               
     395               if(findAncestor (event.target, 'widget_price_filter') != null){
     396               isSwiped = false;
     397               };
     398               
     399             
     400            }, false);
     401       
     402            document.body.addEventListener('touchend', function(event) {
     403                touchendX = event.changedTouches[0].screenX;
     404                touchendY = event.changedTouches[0].screenY;     
     405                handleGesure();
     406            }, false);
     407       
     408             
     409            function handleGesure() {
     410                    var distanceY = Math.abs(touchendY - touchstartY);
     411                    var distanceX = Math.abs(touchendX - touchstartX);
     412         
     413                    if (touchendX > touchstartX && distanceY <= deltaY && distanceX >= deltaX) {   
     414                        if(isSwiped){
     415                             closeMobileSidebar();
     416                        }
     417                    }
     418                    if (touchendX < touchstartX && distanceY <= deltaY && distanceX >= deltaX) {
     419                     
     420                         if(isSwiped && touchstartX > screen.width - 40){
     421                            openMobileSidebar();
     422                         }
     423                    }     
     424                }";
     425
     426                    break;
     427                case 'left':
     428
     429                    $ResponsiveSidebarScript .= "
    307430            var touchstartX = 0;
    308431            var touchstartY = 0;
    … …  
    348471                    }     
    349472                }";
     473
     474                    break;
     475            }
     476
     477
    350478        }
    351479

  • responsive-sidebar/trunk/src/ResponsiveSidebarPlugin.php

    r2291595 r2332321  
    1414class ResponsiveSidebarPlugin {
    1515
    16     const VERSION = '1.2.0';
     16    const VERSION = '1.2.1';
    1717
    1818    /**
Note: See TracChangeset for help on using the changeset viewer.