couchdb-commits mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From robertkowal...@apache.org
Subject [1/2] fauxton commit: updated refs/heads/master to a85eb42
Date Mon, 02 Mar 2015 16:52:50 GMT
Repository: couchdb-fauxton
Updated Branches:
  refs/heads/master 73bacedae -> a85eb42a1


extract components: header-toggle-button-component


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

Branch: refs/heads/master
Commit: b34a64eb78167a95ba767125fb15a236404c87b7
Parents: 73baced
Author: Robert Kowalski <robertkowalski@apache.org>
Authored: Fri Feb 27 14:02:14 2015 +0100
Committer: Robert Kowalski <robertkowalski@apache.org>
Committed: Fri Feb 27 17:49:56 2015 +0100

----------------------------------------------------------------------
 .gitignore                                      |  1 +
 app/addons/components/README.md                 |  3 ++
 .../components/assets/less/components.less      |  3 ++
 .../assets/less/header-togglebutton.less        | 43 +++++++++++++++++
 app/addons/components/base.js                   | 22 +++++++++
 .../components/react-components.react.jsx       | 50 ++++++++++++++++++++
 .../tests/headerTogglebuttonSpec.react.jsx      | 41 ++++++++++++++++
 app/addons/documents/assets/less/header.less    | 44 -----------------
 app/addons/documents/header/header.react.jsx    | 29 ++----------
 app/addons/documents/tests/headerSpec.react.jsx | 19 --------
 settings.json.default                           |  1 +
 11 files changed, 168 insertions(+), 88 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/b34a64eb/.gitignore
----------------------------------------------------------------------
diff --git a/.gitignore b/.gitignore
index 7d5a71f..f6f8a2e 100644
--- a/.gitignore
+++ b/.gitignore
@@ -6,6 +6,7 @@ app/load_addons.js
 app/addons/*
 !app/addons/activetasks
 !app/addons/config
+!app/addons/components
 !app/addons/plugins
 !app/addons/replication
 !app/addons/auth

http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/b34a64eb/app/addons/components/README.md
----------------------------------------------------------------------
diff --git a/app/addons/components/README.md b/app/addons/components/README.md
new file mode 100644
index 0000000..01bf4b5
--- /dev/null
+++ b/app/addons/components/README.md
@@ -0,0 +1,3 @@
+# Components
+
+small building blocks for Fauxton built using React

http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/b34a64eb/app/addons/components/assets/less/components.less
----------------------------------------------------------------------
diff --git a/app/addons/components/assets/less/components.less b/app/addons/components/assets/less/components.less
new file mode 100644
index 0000000..b85f5f7
--- /dev/null
+++ b/app/addons/components/assets/less/components.less
@@ -0,0 +1,3 @@
+@import "../../../../../assets/less/variables.less";
+
+@import "header-togglebutton.less";

http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/b34a64eb/app/addons/components/assets/less/header-togglebutton.less
----------------------------------------------------------------------
diff --git a/app/addons/components/assets/less/header-togglebutton.less b/app/addons/components/assets/less/header-togglebutton.less
new file mode 100644
index 0000000..807a0ef
--- /dev/null
+++ b/app/addons/components/assets/less/header-togglebutton.less
@@ -0,0 +1,43 @@
+.header-control-box {
+  color: #666;
+  font-size: 13px;
+  line-height: 33px;
+  padding: 12px 20px 12px 20px;
+  height: @collapsedNavWidth;
+  background-color: transparent;
+  border: none;
+  border-right: 1px solid @btnBorder;
+  text-decoration: none;
+  float: left;
+  .icon {
+    font-size: 20px;
+  }
+}
+
+.header-control-box:hover {
+  .icon, span {
+    color: #e33f3b;
+  }
+}
+
+button.header-control-box:focus {
+  outline: 0;
+}
+
+.js-headerbar-togglebutton-selected {
+  .icon, span {
+    color: #e33f3b;
+  }
+}
+
+.control-toggle-alternative-header {
+  .icon {
+    padding: 0px 8px 0px 0px;
+  }
+}
+
+.header-control-square {
+  height: @collapsedNavWidth;
+  width: @collapsedNavWidth;
+  float: left;
+}

http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/b34a64eb/app/addons/components/base.js
----------------------------------------------------------------------
diff --git a/app/addons/components/base.js b/app/addons/components/base.js
new file mode 100644
index 0000000..4a4a892
--- /dev/null
+++ b/app/addons/components/base.js
@@ -0,0 +1,22 @@
+// Licensed under the Apache License, Version 2.0 (the "License"); you may not
+// use this file except in compliance with the License. You may obtain a copy of
+// the License at
+//
+//   http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+// WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+// License for the specific language governing permissions and limitations under
+// the License.
+
+define([
+
+],
+
+function () {
+  var Components = {};
+  Components.initialize = function () {};
+
+  return Components;
+});

http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/b34a64eb/app/addons/components/react-components.react.jsx
----------------------------------------------------------------------
diff --git a/app/addons/components/react-components.react.jsx b/app/addons/components/react-components.react.jsx
new file mode 100644
index 0000000..c783e94
--- /dev/null
+++ b/app/addons/components/react-components.react.jsx
@@ -0,0 +1,50 @@
+// Licensed under the Apache License, Version 2.0 (the "License"); you may not
+// use this file except in compliance with the License. You may obtain a copy of
+// the License at
+//
+//   http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+// WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+// License for the specific language governing permissions and limitations under
+// the License.
+
+define([
+  'app',
+  'api',
+
+  'react',
+],
+
+function (app, FauxtonAPI, React) {
+
+  var ToggleHeaderButton = React.createClass({
+    render: function () {
+      var iconClasses = 'icon ' + this.props.fonticon + ' ' + this.props.innerClasses,
+          containerClasses = 'button ' + this.props.containerClasses;
+
+      if (this.props.setEnabledClass) {
+        containerClasses = containerClasses + ' js-headerbar-togglebutton-selected';
+      }
+
+      return (
+        <button
+          title={this.props.title}
+          disabled={this.props.disabled}
+          onClick={this.props.toggleCallback}
+          className={containerClasses}
+          >
+          <i className={iconClasses}></i><span>{this.props.text}</span>
+        </button>
+      );
+    }
+  });
+
+  var Components = {
+    ToggleHeaderButton: ToggleHeaderButton
+  };
+
+  return Components;
+
+});

http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/b34a64eb/app/addons/components/tests/headerTogglebuttonSpec.react.jsx
----------------------------------------------------------------------
diff --git a/app/addons/components/tests/headerTogglebuttonSpec.react.jsx b/app/addons/components/tests/headerTogglebuttonSpec.react.jsx
new file mode 100644
index 0000000..14523f3
--- /dev/null
+++ b/app/addons/components/tests/headerTogglebuttonSpec.react.jsx
@@ -0,0 +1,41 @@
+// Licensed under the Apache License, Version 2.0 (the "License"); you may not
+// use this file except in compliance with the License. You may obtain a copy of
+// the License at
+//
+//   http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+// WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+// License for the specific language governing permissions and limitations under
+// the License.
+define([
+  'api',
+  'addons/components/react-components.react',
+
+  'testUtils',
+  'react'
+], function (FauxtonAPI, ReactComponents, utils, React) {
+
+  var assert = utils.assert;
+  var TestUtils = React.addons.TestUtils;
+
+  describe('Header Togglebutton', function () {
+    var container, toggleEl, toggleCallback;
+    beforeEach(function () {
+      container = document.createElement('div');
+      toggleCallback = sinon.spy();
+      toggleEl = TestUtils.renderIntoDocument(<ReactComponents.ToggleHeaderButton fonticon={'foo'}
+        classString={'bar'} toggleCallback={toggleCallback} />, container);
+    });
+
+    afterEach(function () {
+      React.unmountComponentAtNode(container);
+    });
+
+    it('should call the passed callback', function () {
+      TestUtils.Simulate.click(toggleEl.getDOMNode());
+      assert.ok(toggleCallback.calledOnce);
+    });
+  });
+});

http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/b34a64eb/app/addons/documents/assets/less/header.less
----------------------------------------------------------------------
diff --git a/app/addons/documents/assets/less/header.less b/app/addons/documents/assets/less/header.less
index 9c3c15d..7675510 100644
--- a/app/addons/documents/assets/less/header.less
+++ b/app/addons/documents/assets/less/header.less
@@ -1,51 +1,7 @@
-.header-control-box {
-  color: #666;
-  font-size: 13px;
-  line-height: 33px;
-  padding: 12px 20px 12px 20px;
-  height: @collapsedNavWidth;
-  background-color: transparent;
-  border: none;
-  border-right: 1px solid @btnBorder;
-  text-decoration: none;
-  float: left;
-  .icon {
-    font-size: 20px;
-  }
-}
-
-.header-control-box:hover {
-  .icon, span {
-    color: #e33f3b;
-  }
-}
-
-button.header-control-box:focus {
-  outline: 0;
-}
-
-.js-headerbar-togglebutton-selected {
-  .icon, span {
-    color: #e33f3b;
-  }
-}
-
-.control-toggle-alternative-header {
-  .icon {
-    padding: 0px 8px 0px 0px;
-  }
-}
-
 .control-cancel {
   border-right: none;
 }
 
-.header-control-square {
-  height: @collapsedNavWidth;
-  width: @collapsedNavWidth;
-  float: left;
-}
-
 .alternative-header {
   float: left;
 }

http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/b34a64eb/app/addons/documents/header/header.react.jsx
----------------------------------------------------------------------
diff --git a/app/addons/documents/header/header.react.jsx b/app/addons/documents/header/header.react.jsx
index faf46bc..efdf75f 100644
--- a/app/addons/documents/header/header.react.jsx
+++ b/app/addons/documents/header/header.react.jsx
@@ -15,36 +15,15 @@ define([
   'api',
   'react',
   'addons/documents/header/header.stores',
-  'addons/documents/header/header.actions'
+  'addons/documents/header/header.actions',
+  'addons/components/react-components.react',
 ],
 
-function (app, FauxtonAPI, React, Stores, Actions) {
+function (app, FauxtonAPI, React, Stores, Actions, ReactComponents) {
   var ReactCSSTransitionGroup = React.addons.CSSTransitionGroup;
   var headerBarStore = Stores.headerBarStore;
   var bulkDocumentHeaderStore = Stores.bulkDocumentHeaderStore;
-
-  // this will be a global component
-  var ToggleHeaderButton = React.createClass({
-    render: function () {
-      var iconClasses = 'icon ' + this.props.fonticon + ' ' + this.props.innerClasses,
-          containerClasses = 'button ' + this.props.containerClasses;
-
-      if (this.props.setEnabledClass) {
-        containerClasses = containerClasses + ' js-headerbar-togglebutton-selected';
-      }
-
-      return (
-        <button
-          title={this.props.title}
-          disabled={this.props.disabled}
-          onClick={this.props.toggleCallback}
-          className={containerClasses}
-          >
-          <i className={iconClasses}></i><span>{this.props.text}</span>
-        </button>
-      );
-    }
-  });
+  var ToggleHeaderButton = ReactComponents.ToggleHeaderButton;
 
   var BulkDocumentHeaderController = React.createClass({
     getStoreState: function () {

http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/b34a64eb/app/addons/documents/tests/headerSpec.react.jsx
----------------------------------------------------------------------
diff --git a/app/addons/documents/tests/headerSpec.react.jsx b/app/addons/documents/tests/headerSpec.react.jsx
index 83edada..052bc9c 100644
--- a/app/addons/documents/tests/headerSpec.react.jsx
+++ b/app/addons/documents/tests/headerSpec.react.jsx
@@ -28,25 +28,6 @@ define([
   var assert = utils.assert;
   var TestUtils = React.addons.TestUtils;
 
-  describe('Header Togglebutton', function () {
-    var container, toggleEl, toggleCallback;
-    beforeEach(function () {
-      container = document.createElement('div');
-      toggleCallback = sinon.spy();
-      toggleEl = TestUtils.renderIntoDocument(<Views.ToggleHeaderButton fonticon={'foo'}
-        classString={'bar'} toggleCallback={toggleCallback} />, container);
-    });
-
-    afterEach(function () {
-      React.unmountComponentAtNode(container);
-    });
-
-    it('should call the passed callback', function () {
-      TestUtils.Simulate.click(toggleEl.getDOMNode());
-      assert.ok(toggleCallback.calledOnce);
-    });
-  });
-
   describe('Header Controller', function () {
     var container, toggleEl;
     beforeEach(function () {

http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/b34a64eb/settings.json.default
----------------------------------------------------------------------
diff --git a/settings.json.default b/settings.json.default
index 35ed88e..775dfb9 100644
--- a/settings.json.default
+++ b/settings.json.default
@@ -1,6 +1,7 @@
 {
   "deps": [
   { "name": "fauxton" },
+  { "name": "components" },
   { "name": "databases" },
   { "name": "documents" },
   { "name": "activetasks" },


Mime
View raw message