You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@couchdb.apache.org by de...@apache.org on 2014/08/14 22:00:10 UTC

[2/2] fauxton commit: updated refs/heads/secondary-indexes to ee9e78c

Fixed the resizeColumns code that was the worst


Project: http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/repo
Commit: http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/commit/ee9e78c4
Tree: http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/tree/ee9e78c4
Diff: http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/diff/ee9e78c4

Branch: refs/heads/secondary-indexes
Commit: ee9e78c48fb9c2147875980152a62e19e84137f0
Parents: 8fbbb29
Author: deathbearbrown <de...@gmail.com>
Authored: Thu Aug 14 16:00:03 2014 -0400
Committer: deathbearbrown <de...@gmail.com>
Committed: Thu Aug 14 16:00:03 2014 -0400

----------------------------------------------------------------------
 app/addons/databases/templates/list.html        |   2 +-
 app/addons/databases/views.js                   |  19 +--
 .../documents/templates/all_docs_list.html      |   2 +-
 app/addons/documents/views.js                   |   3 +-
 app/addons/fauxton/resizeColumns.js             | 135 ++++++-------------
 app/templates/layouts/two_pane.html             |   8 +-
 6 files changed, 47 insertions(+), 122 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/ee9e78c4/app/addons/databases/templates/list.html
----------------------------------------------------------------------
diff --git a/app/addons/databases/templates/list.html b/app/addons/databases/templates/list.html
index b0569e7..874801c 100644
--- a/app/addons/databases/templates/list.html
+++ b/app/addons/databases/templates/list.html
@@ -24,6 +24,6 @@ the License.
     </tbody>
   </table>
 </div>
-<footer class="pagination-footer window-resizeable">
+<footer class="pagination-footer window-resizeable-full">
   <div id="database-pagination"></div>
 </footer>

http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/ee9e78c4/app/addons/databases/views.js
----------------------------------------------------------------------
diff --git a/app/addons/databases/views.js b/app/addons/databases/views.js
index 29158c8..99a5ea2 100644
--- a/app/addons/databases/views.js
+++ b/app/addons/databases/views.js
@@ -128,6 +128,7 @@ function(app, Components, FauxtonAPI, Databases) {
       this.$el.find(".js-db-graveyard").tooltip();
     }
   });
+
   Views.List = FauxtonAPI.View.extend({
     dbLimit: 20,
     perPage: 20,
@@ -187,24 +188,6 @@ function(app, Components, FauxtonAPI, Databases) {
     setPage: function(page) {
       this.page = page || 1;
     },
-
-    afterRender: function() {
-      var that = this,
-          AllDBsArray = _.map(this.collection.toJSON(), function(item, key){
-            return item.name;
-          });
-
-      this.dbSearchTypeahead = new Components.Typeahead({
-        el: "input.search-autocomplete",
-        source: AllDBsArray,
-        onUpdate: function (item) {
-          that.switchDatabase(null, item);
-        }
-      });
-      this.dbSearchTypeahead.render();
-      this.$el.find(".js-db-graveyard").tooltip();
-    },
-
     selectAll: function(evt){
       $("input:checkbox").attr('checked', !$(evt.target).hasClass('active'));
     }

http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/ee9e78c4/app/addons/documents/templates/all_docs_list.html
----------------------------------------------------------------------
diff --git a/app/addons/documents/templates/all_docs_list.html b/app/addons/documents/templates/all_docs_list.html
index bf7e250..4a9482d 100644
--- a/app/addons/documents/templates/all_docs_list.html
+++ b/app/addons/documents/templates/all_docs_list.html
@@ -24,7 +24,7 @@ the License.
     </div>
   <% } %>
 </div>
-<footer class="pagination-footer window-resizeable">
+<footer class="pagination-footer window-resizeable<%=resizeLayout%>">
   <div id="item-numbers"> </div>
   <div id="documents-pagination"></div>
 </footer>

http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/ee9e78c4/app/addons/documents/views.js
----------------------------------------------------------------------
diff --git a/app/addons/documents/views.js b/app/addons/documents/views.js
index d0e5142..446253a 100644
--- a/app/addons/documents/views.js
+++ b/app/addons/documents/views.js
@@ -507,8 +507,7 @@ function(app, FauxtonAPI, Components, Documents, Databases, Views, QueryOptions,
 
     serialize: function() {
       return {
-        viewList: this.viewList,
-        expandDocs: this.expandDocs,
+        resizeLayout: this.viewList?"-half":"",
         endOfResults: !this.pagination.canShowNextfn()
       };
     },

http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/ee9e78c4/app/addons/fauxton/resizeColumns.js
----------------------------------------------------------------------
diff --git a/app/addons/fauxton/resizeColumns.js b/app/addons/fauxton/resizeColumns.js
index 210ae4b..f88a3aa 100644
--- a/app/addons/fauxton/resizeColumns.js
+++ b/app/addons/fauxton/resizeColumns.js
@@ -23,129 +23,72 @@ define([
 
 function(FauxtonAPI) {
 
-
-// Lets think about what this needs to do, so it can be rewritten.
-/*
-  I have 3 types of resizable layouts:
-    - full size which will span across the content area that is
-     window.innerWidth - primaryNavWidth
-    - 2 panel which is the above divided by 2 with the left set on the second div
-    - "sidebar" which is window.innerWidth - primaryNavWidth - sidebarwidth
-    Also everything needs to account for border width
-
-    Step 1:
-    - getPrimaryNavWidth
-    - get window.innerWidth
-    - get appContainerWidth AKA full width
-    - getPanelWidth (app container / 2)
-    - sidebarwidth (app container - sidebar)
-*/
-
-
   var Resize = function(options){
     this.options = options;
   };
 
   Resize.prototype = {
-    getPrimaryNavWidth: function(){
-      var primaryNavWidth  = $('body').hasClass('closeMenu') ? 64 : 220;
-      return primaryNavWidth;
-    },
-
-    getSidebarWidth: function(){},
-
-    getSinglePanelWidth: function(){
-      var sidebarWidth = $('#sidebar-content').length > 0 ? $('#sidebar-content').outerWidth() : 0,
-          borders = parseInt($('#dashboard').css('border-left-width'), 10) +
-                    parseInt($('#dashboard-content').css('border-left-width'), 10) +
-                    parseInt($('#dashboard-content').css('border-right-width'), 10);
-
-      return (this.getPrimaryNavWidth() + sidebarWidth + borders);
-    },
-
-    getTwoPanelWidth: function(){
-      var borders = parseInt($('#dashboard').css('border-left-width'), 10) +
-          parseInt($('#right-content').css('border-left-width'), 10) +
-          parseInt($('#left-content').css('border-right-width'), 10)+
-          parseInt($('#left-content').css('border-left-width'), 10) +
-          parseInt($('#right-content').css('border-right-width'), 10);
-      return (this.getPrimaryNavWidth()+ borders);
-    },
 
     initialize: function(){
-     // $(window).off('resize');
-      var that = this;
       //add throttler :)
+      var that = this;
       this.lazyLayout = _.debounce(that.onResizeHandler, 300).bind(this);
       FauxtonAPI.utils.addWindowResize(this.lazyLayout,"animation");
       FauxtonAPI.utils.initWindowResize();
       this.onResizeHandler();
     },
 
-    updateOptions:function(options){
-      this.options = {};
-      this.options = options;
-    },
+    onResizeHandler: function (){
+      var fullWidth = this.getFullWidth(),
+          halfWidth = this.getHalfWidth(),
+          sidebarWidth = this.getSidebarContentWidth(),
+          left = $('.window-resizeable-half').length > 0? halfWidth : sidebarWidth;
+
+      $('.window-resizeable').innerWidth(sidebarWidth);
+      $('.window-resizeable-half').innerWidth(halfWidth);
+      $('.window-resizeable-full').innerWidth(fullWidth);
 
-    turnOff:function(){
-      FauxtonAPI.utils.removeWindowResize("animation");
+      //set left
+      this.setLeftPosition(left);
+      //if there is a callback, run that
+      this.options.callback && this.options.callback();
+      this.trigger('resize');
     },
 
     cleanupCallback: function(){
       this.callback = null;
     },
 
-    singlePanelResize: function(){
-      var combinedWidth = window.innerWidth - this.getSinglePanelWidth(),
-      smallWidthConstraint = ($('#sidebar-content').length > 0)? 470:800,
-      panelWidth;
-
-      if (combinedWidth > smallWidthConstraint) {
-        panelWidth = combinedWidth;
-      } else if (combinedWidth < smallWidthConstraint){
-        panelWidth = smallWidthConstraint;
-      }
-      return panelWidth;
+    getPrimaryNavWidth: function(){
+      var primaryNavWidth  = $('body').hasClass('closeMenu') ? 64 : $('#primary-navbar').outerWidth();
+      //$('body').hasClass('closeMenu') ? 64 : 220;
+      return primaryNavWidth;
     },
 
-    getPanelWidth: function(){
-      var panelWidth;
-      if ($('#dashboard').hasClass('two-pane')){
-        panelWidth = (window.innerWidth - this.getTwoPanelWidth())/2;
-      } else {
-        panelWidth = this.singlePanelResize();
-      }
-      return panelWidth;
+    getWindowWidth: function(){
+      return window.innerWidth;
     },
 
-    setPosition: function(panelWidth){
-      var primary = this.getPrimaryNavWidth();
-      $('.set-left-position').css('left',panelWidth+primary+4);
+    getFullWidth: function(){
+      return this.getWindowWidth() - this.getPrimaryNavWidth();
     },
 
-    onResizeHandler: function (){
-      //if there is an override, do that instead
-      if (this.options.onResizeHandler){
-        this.options.onResizeHandler();
-      } else {
-        /*
-          Just so we all are aware:
-          This entire file and the html of the layouts is bonkers
-          crazy. I hate what horrible things happened in this file.
-          It will change soon with a layout overhaul.
-        */
-
-        var panelWidth = this.getPanelWidth();
-        var fullWidth = this.getPanelWidth();
-        this.setPosition(panelWidth);
-        $('.window-resizeable').innerWidth(panelWidth);
-        $('.window-resizeable-full').innerWidth(fullWidth);
-      }
-      //if there is a callback, run that
-      if(this.options.callback) {
-        this.options.callback();
-      }
-      this.trigger('resize');
+    getSidebarWidth: function(){
+      return $('#breadcrumbs').length > 0 ? $('#breadcrumbs').outerWidth() : 0;
+    },
+
+    getSidebarContentWidth: function(){
+      return this.getFullWidth() - this.getSidebarWidth() -5;
+    },
+
+    getHalfWidth: function(){
+      var fullWidth = this.getFullWidth();
+      return fullWidth/2;
+    },
+
+    setLeftPosition: function(panelWidth){
+      var primary = this.getPrimaryNavWidth();
+      $('.set-left-position').css('left',panelWidth+primary+4);
     }
   };
 

http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/ee9e78c4/app/templates/layouts/two_pane.html
----------------------------------------------------------------------
diff --git a/app/templates/layouts/two_pane.html b/app/templates/layouts/two_pane.html
index 053285a..aa7e30e 100644
--- a/app/templates/layouts/two_pane.html
+++ b/app/templates/layouts/two_pane.html
@@ -16,12 +16,12 @@ the License.
 <div id="dashboard" class="container-fluid two-pane">
   <div id="global-notifications" class="container errors-container window-resizeable set-left-position"></div>
   <header class="fixed-header row-fluid">
-    <div id="breadcrumbs" class="window-resizeable"></div>
-    <div id="api-navbar" class="window-resizeable"></div>
+    <div id="breadcrumbs" class="window-resizeable-half"></div>
+    <div id="api-navbar" class="window-resizeable-half"></div>
   </header>
 
   <div class="content-area two-pane">
-    <div id="left-content" class="span6 window-resizeable"></div>
-    <div id="right-content" class="span6 window-resizeable set-left-position"></div>
+    <div id="left-content" class="span6 window-resizeable-half"></div>
+    <div id="right-content" class="span6 window-resizeable-half set-left-position"></div>
   </div>
 </div>