1 files changed, 40 insertions, 24 deletions

diff --git a/src/js/sidebar.js b/src/js/sidebar.js
index 7016678..1e5b621 100755
--- a/src/js/sidebar.js
+++ b/src/js/sidebar.js
@@ -1,4 +1,4 @@
-(function($) {
+(function ($) {
   'use strict';
 
   // Open and close the sidebar by swiping the sidebar and the blog and vice versa
@@ -7,7 +7,7 @@
    * Sidebar
    * @constructor
    */
-  var Sidebar = function() {
+  var Sidebar = function () {
     this.$sidebar = $('#sidebar');
     this.$openBtn = $('#btn-open-sidebar');
     // Elements where the user can click to close the sidebar
@@ -15,7 +15,13 @@
     // Elements affected by the swipe of the sidebar
     // The `pushed` class is added to each elements
     // Each element has a different behavior when the sidebar is opened
-    this.$blog = $('.post-bottom-bar, #header, #main, .post-header-cover');
+    this.$header = $('#header');
+    this.$headerElements = {
+      title: this.$header.find('.header-title'),
+      titleLink: this.$header.find('.header-title-link'),
+      rightPicture: this.$header.find('.header-right-picture')
+    };
+    this.$blog = $('.post-bottom-bar, #main, .post-header-cover, .post, #bottom-bar .post-action-share').add(this.$header).add(this.$headerElements.title).add(this.$headerElements.rightPicture);
     // If you change value of `mediumScreenWidth`,
     // you have to change value of `$screen-min: (md-min)` too
     // in `source/_css/utils/variables.scss`
@@ -28,22 +34,22 @@
      * Run Sidebar feature
      * @return {void}
      */
-    run: function() {
+    run: function () {
       var self = this;
       // Detect the click on the open button
-      this.$openBtn.click(function() {
+      this.$openBtn.click(function () {
         if (!self.$sidebar.hasClass('pushed')) {
           self.openSidebar();
         }
       });
       // Detect the click on close button
-      this.$closeBtn.click(function() {
+      this.$closeBtn.click(function () {
         if (self.$sidebar.hasClass('pushed')) {
           self.closeSidebar();
         }
       });
       // Detect resize of the windows
-      $(window).resize(function() {
+      $(window).resize(function () {
         // Check if the window is larger than the minimal medium screen value
         if ($(window).width() > self.mediumScreenWidth) {
           self.resetSidebarPosition();
@@ -59,7 +65,7 @@
      * Open the sidebar by swiping to the right the sidebar and the blog
      * @return {void}
      */
-    openSidebar: function() {
+    openSidebar: function () {
       this.swipeBlogToRight();
       this.swipeSidebarToRight();
     },
@@ -68,7 +74,7 @@
      * Close the sidebar by swiping to the left the sidebar and the blog
      * @return {void}
      */
-    closeSidebar: function() {
+    closeSidebar: function () {
       this.swipeSidebarToLeft();
       this.swipeBlogToLeft();
     },
@@ -77,7 +83,7 @@
      * Reset sidebar position
      * @return {void}
      */
-    resetSidebarPosition: function() {
+    resetSidebarPosition: function () {
       this.$sidebar.removeClass('pushed');
     },
 
@@ -85,7 +91,7 @@
      * Reset blog position
      * @return {void}
      */
-    resetBlogPosition: function() {
+    resetBlogPosition: function () {
       this.$blog.removeClass('pushed');
     },
 
@@ -93,7 +99,7 @@
      * Swipe the sidebar to the right
      * @return {void}
      */
-    swipeSidebarToRight: function() {
+    swipeSidebarToRight: function () {
       var self = this;
       // Check if the sidebar isn't swiped
       // and prevent multiple click on the open button with `.processing` class
@@ -102,7 +108,7 @@
         this.$sidebar.addClass('processing pushed');
         // add overflow on body to remove horizontal scroll
         this.$body.css('overflow-x', 'hidden');
-        setTimeout(function() {
+        setTimeout(function () {
           self.$sidebar.removeClass('processing');
         }, 250);
       }
@@ -112,14 +118,17 @@
      * Swipe the sidebar to the left
      * @return {void}
      */
-    swipeSidebarToLeft: function() {
+    swipeSidebarToLeft: function () {
+      var self = this;
       // Check if the sidebar is swiped
       // and prevent multiple click on the close button with `.processing` class
       if (this.$sidebar.hasClass('pushed') && !this.$sidebar.hasClass('processing')) {
         // Swipe the sidebar to the left
         this.$sidebar.addClass('processing').removeClass('pushed processing');
         // go back to the default overflow
-        this.$body.css('overflow-x', 'auto');
+        setTimeout(function () {
+          self.$body.css('overflow-x', 'auto');
+        }, 255);
       }
     },
 
@@ -127,16 +136,23 @@
      * Swipe the blog to the right
      * @return {void}
      */
-    swipeBlogToRight: function() {
-      var self = this;
+    swipeBlogToRight: function () {
+      var blog = this.$blog;
+
+      // Check if there is enough place for translating `#header .header-title` and `#header .right-picture`
+      // regarding the size of `#header .header-title-link`
+      if (this.$header.width() - this.$sidebar.width() - this.$headerElements.titleLink.width() < 130) {
+        blog = blog.not(this.$headerElements.title).not(this.$headerElements.rightPicture);
+      }
+
       // Check if the blog isn't swiped
       // and prevent multiple click on the open button with `.processing` class
-      if (!this.$blog.hasClass('pushed') && !this.$blog.hasClass('processing')) {
+      if (!blog.hasClass('pushed') && !blog.hasClass('processing')) {
         // Swipe the blog to the right
-        this.$blog.addClass('processing pushed');
+        blog.addClass('processing pushed');
 
-        setTimeout(function() {
-          self.$blog.removeClass('processing');
+        setTimeout(function () {
+          blog.removeClass('processing');
         }, 250);
       }
     },
@@ -145,7 +161,7 @@
      * Swipe the blog to the left
      * @return {void}
      */
-    swipeBlogToLeft: function() {
+    swipeBlogToLeft: function () {
       var self = this;
       // Check if the blog is swiped
       // and prevent multiple click on the close button with `.processing` class
@@ -153,14 +169,14 @@
         // Swipe the blog to the left
         self.$blog.addClass('processing').removeClass('pushed');
 
-        setTimeout(function() {
+        setTimeout(function () {
           self.$blog.removeClass('processing');
         }, 250);
       }
     }
   };
 
-  $(document).ready(function() {
+  $(document).ready(function () {
     var sidebar = new Sidebar();
     sidebar.run();
   });