couchdb-commits mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From gar...@apache.org
Subject [3/5] fauxton commit: updated refs/heads/master to 14224ea
Date Wed, 30 Nov 2016 13:42:24 GMT
remove two_pane


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

Branch: refs/heads/master
Commit: 75b8eb4167c82d48d2a494104002b0ec5a54537d
Parents: 26b797a
Author: Garren Smith <garren.smith@gmail.com>
Authored: Wed Nov 23 16:54:53 2016 +0200
Committer: Garren Smith <garren.smith@gmail.com>
Committed: Wed Nov 30 11:38:39 2016 +0200

----------------------------------------------------------------------
 app/addons/components/assets/less/layouts.less |  8 ++
 app/addons/components/layouts.js               |  2 +-
 app/addons/documents/mangolayout.js            | 97 +++++++++++++++++++++
 app/addons/documents/routes-mango.js           | 50 +++++------
 app/templates/layouts/two_pane.html            | 33 -------
 5 files changed, 128 insertions(+), 62 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/75b8eb41/app/addons/components/assets/less/layouts.less
----------------------------------------------------------------------
diff --git a/app/addons/components/assets/less/layouts.less b/app/addons/components/assets/less/layouts.less
index adfe63a..99c1730 100644
--- a/app/addons/components/assets/less/layouts.less
+++ b/app/addons/components/assets/less/layouts.less
@@ -19,3 +19,11 @@
   flex-direction: row;
   height: 100%;
 }
+
+//yes !important!!! We have to overridde some styles I can't override any other way for now
+div.faux__breadcrumbs-mango-header {
+  height: 64px !important;
+  -ms-flex: 0 0 440px !important;
+  flex: 0 0 440px !important;
+  overflow: hidden !important;
+}

http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/75b8eb41/app/addons/components/layouts.js
----------------------------------------------------------------------
diff --git a/app/addons/components/layouts.js b/app/addons/components/layouts.js
index 234e305..5deb24c 100644
--- a/app/addons/components/layouts.js
+++ b/app/addons/components/layouts.js
@@ -17,7 +17,7 @@ import {ApiBarController} from './components/apibar';
 import {Breadcrumbs} from './header-breadcrumbs';
 import ComponentActions from './actions';
 
-const ApiBarWrapper = ({docURL, endpoint}) => {
+export const ApiBarWrapper = ({docURL, endpoint}) => {
   //TODO once all modules are using this remove actions and make them props
   setTimeout(() => {
     ComponentActions.updateAPIBar({

http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/75b8eb41/app/addons/documents/mangolayout.js
----------------------------------------------------------------------
diff --git a/app/addons/documents/mangolayout.js b/app/addons/documents/mangolayout.js
new file mode 100644
index 0000000..6da0a83
--- /dev/null
+++ b/app/addons/documents/mangolayout.js
@@ -0,0 +1,97 @@
+// 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.
+
+import React from 'react';
+import app from "../../app";
+import FauxtonAPI from "../../core/api";
+import ReactPagination from "./pagination/pagination.react";
+import ReactHeader from "./header/header.react";
+import {Breadcrumbs} from '../components/header-breadcrumbs';
+import {NotificationCenterButton} from '../fauxton/notifications/notifications.react';
+import {ApiBarController} from '../components/components/apibar';
+import {ApiBarWrapper} from '../components/layouts';
+import MangoComponents from "./mango/mango.components.react";
+import IndexResultsComponents from "./index-results/index-results.components.react";
+
+export const MangoFooter = () => {
+  return (
+    <div id="footer">
+        <ReactPagination.Footer />
+    </div>
+  );
+};
+
+export const MangoHeader = ({showIncludeAllDocs, crumbs, docURL, endpoint}) => {
+  return (
+    <div className="header-wrapper flex-layout flex-row">
+      <div className='flex-body faux__breadcrumbs-mango-header'>
+        <Breadcrumbs crumbs={crumbs}/>
+      </div>
+      <div className="right-header-wrapper flex-layout flex-row flex-body">
+        <div id="react-headerbar" className="flex-body">
+          <ReactHeader.BulkDocumentHeaderController showIncludeAllDocs={showIncludeAllDocs}
/>
+        </div>
+        <div id="right-header" className="flex-body">
+        </div>
+        <ApiBarWrapper docURL={docURL} endpoint={endpoint} />
+        <div id='notification-center-btn'>
+          <NotificationCenterButton />
+        </div>
+      </div>
+    </div>
+  );
+};
+
+MangoHeader.defaultProps = {
+  crumbs: []
+};
+
+const MangoContent = ({edit}) => {
+  const leftContent = edit ?
+    <MangoComponents.MangoIndexEditorController
+      description={app.i18n.en_US['mango-descripton-index-editor']}
+    /> :
+    <MangoComponents.MangoQueryEditorController
+      description={app.i18n.en_US['mango-descripton']}
+      editorTitle={app.i18n.en_US['mango-title-editor']}
+      additionalIndexesText={app.i18n.en_US['mango-additional-indexes-heading']}
+    />;
+
+  return (
+    <div id="two-pane-content" className="flex-layout flex-row flex-body">
+      <div id="left-content" className="flex-body">
+          {leftContent}
+      </div>
+      <div id="right-content" className="flex-body flex-layout flex-col">
+        <div id="dashboard-lower-content" className="flex-body">
+          <IndexResultsComponents.List />
+        </div>
+        <MangoFooter  />
+      </div>
+    </div>
+  );
+};
+
+
+export const MangoLayout = ({edit, showIncludeAllDocs, docURL, endpoint, crumbs}) => {
+  return (
+    <div id="dashboard" className="two-pane flex-layout flex-col">
+      <MangoHeader
+        showIncludeAllDocs={showIncludeAllDocs}
+        docURL={docURL}
+        endpoint={endpoint}
+        crumbs={crumbs}
+      />
+    <MangoContent edit={edit} />
+    </div>
+  );
+};

http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/75b8eb41/app/addons/documents/routes-mango.js
----------------------------------------------------------------------
diff --git a/app/addons/documents/routes-mango.js b/app/addons/documents/routes-mango.js
index c1e63da..6a0cecb 100644
--- a/app/addons/documents/routes-mango.js
+++ b/app/addons/documents/routes-mango.js
@@ -28,9 +28,12 @@ import MangoStores from "./mango/mango.stores";
 import IndexResultsComponents from "./index-results/index-results.components.react";
 import SidebarActions from "./sidebar/actions";
 import RightAllDocsHeader from './components/header-docs-right';
+import {MangoLayout} from './mangolayout';
 
 const MangoIndexEditorAndQueryEditor = FauxtonAPI.RouteObject.extend({
-  layout: 'two_pane',
+  layout: 'empty',
+  hideApiBar: true,
+  hideNotificationCenter: true,
   routes: {
     'database/:database/_index': {
       route: 'createIndex',
@@ -69,8 +72,6 @@ const MangoIndexEditorAndQueryEditor = FauxtonAPI.RouteObject.extend({
     });
 
     SidebarActions.selectNavItem('mango-query');
-    this.setComponent('#react-headerbar', ReactHeader.BulkDocumentHeaderController, {showIncludeAllDocs:
false});
-    this.setComponent('#footer', ReactPagination.Footer);
 
     IndexResultsActions.newMangoResultsList({
       collection: mangoResultCollection,
@@ -82,25 +83,22 @@ const MangoIndexEditorAndQueryEditor = FauxtonAPI.RouteObject.extend({
       indexList: mangoIndexList
     });
 
-    this.setComponent('#left-content', MangoComponents.MangoQueryEditorController, {
-      description: app.i18n.en_US['mango-descripton'],
-      editorTitle: app.i18n.en_US['mango-title-editor'],
-      additionalIndexesText: app.i18n.en_US['mango-additional-indexes-heading']
-    });
-    this.setComponent('#dashboard-lower-content', IndexResultsComponents.List);
-
-    this.apiUrl = function () {
-      return [mangoResultCollection.urlRef('query-apiurl', ''), FauxtonAPI.constants.DOC_URLS.MANGO_SEARCH];
-    };
-
     const url = FauxtonAPI.urls(
       'allDocs', 'app', this.database.safeID(), '?limit=' + FauxtonAPI.constants.DATABASES.DOCUMENT_LIMIT
     );
 
-    this.crumbs = [
+    const crumbs = [
       {name: database, link: url},
       {name: app.i18n.en_US['mango-title-editor']}
     ];
+
+    this.setComponent('.template', MangoLayout, {
+      showIncludeAllDocs: false,
+      crumbs: crumbs,
+      docURL: FauxtonAPI.constants.DOC_URLS.MANGO_SEARCH,
+      endpoint: mangoResultCollection.urlRef('query-apiurl', ''),
+      edit: false
+    });
   },
 
   createIndex: function (database) {
@@ -118,26 +116,22 @@ const MangoIndexEditorAndQueryEditor = FauxtonAPI.RouteObject.extend({
       typeOfIndex: 'mango'
     });
 
-    this.setComponent('#react-headerbar', ReactHeader.BulkDocumentHeaderController, {showIncludeAllDocs:
false});
-    this.setComponent('#footer', ReactPagination.Footer);
-
-    this.setComponent('#dashboard-lower-content', IndexResultsComponents.List);
-    this.setComponent('#left-content', MangoComponents.MangoIndexEditorController, {
-      description: app.i18n.en_US['mango-descripton-index-editor']
-    });
-
-    this.apiUrl = function () {
-      return [mangoIndexCollection.urlRef('index-apiurl', ''), FauxtonAPI.constants.DOC_URLS.MANGO_INDEX];
-    };
-
     const url = FauxtonAPI.urls(
       'allDocs', 'app', this.database.safeID(), '?limit=' + FauxtonAPI.constants.DATABASES.DOCUMENT_LIMIT
     );
 
-    this.crumbs = [
+    const crumbs = [
       {name: database, link: url},
       {name: app.i18n.en_US['mango-indexeditor-title']}
     ];
+
+    this.setComponent('.template', MangoLayout, {
+      showIncludeAllDocs: false,
+      crumbs: crumbs,
+      docURL: FauxtonAPI.constants.DOC_URLS.MANGO_INDEX,
+      endpoint: mangoIndexCollection.urlRef('index-apiurl', ''),
+      edit: true
+    });
   }
 });
 

http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/75b8eb41/app/templates/layouts/two_pane.html
----------------------------------------------------------------------
diff --git a/app/templates/layouts/two_pane.html b/app/templates/layouts/two_pane.html
deleted file mode 100644
index 2b8d154..0000000
--- a/app/templates/layouts/two_pane.html
+++ /dev/null
@@ -1,33 +0,0 @@
-<%/*
-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.
-*/%>
-<div id="dashboard" class="two-pane flex-layout flex-col">
-
-  <div class="header-wrapper flex-layout flex-row">
-    <div id="breadcrumbs"></div>
-    <div class="right-header-wrapper flex-layout flex-row flex-body">
-      <div id="react-headerbar" class="flex-body"></div>
-      <div id="right-header" class="flex-body"></div>
-      <div id="api-navbar"></div>
-      <div id="notification-center-btn"></div>
-    </div>
-  </div>
-
-  <div id="two-pane-content" class="flex-layout flex-row flex-body">
-    <div id="left-content" class="flex-body"></div>
-    <div id="right-content" class="flex-body flex-layout flex-col">
-      <div id="dashboard-lower-content" class="flex-body"></div>
-      <div id="footer"></div>
-    </div>
-  </div>
-</div>


Mime
View raw message