You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@couchdb.apache.org by ga...@apache.org on 2016/05/18 13:16:37 UTC
[1/2] fauxton commit: updated refs/heads/jump-to-docs to 2d99c7f
Repository: couchdb-fauxton
Updated Branches:
refs/heads/jump-to-docs [created] 2d99c7fd8
integrate react-select
Project: http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/repo
Commit: http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/commit/842baebc
Tree: http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/tree/842baebc
Diff: http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/diff/842baebc
Branch: refs/heads/jump-to-docs
Commit: 842baebc6884715b4f1935d6412843899b03aac4
Parents: 906f138
Author: Garren Smith <ga...@gmail.com>
Authored: Wed May 18 13:57:37 2016 +0200
Committer: Garren Smith <ga...@gmail.com>
Committed: Wed May 18 13:57:37 2016 +0200
----------------------------------------------------------------------
app/addons/documents/assets/less/documents.less | 1 +
app/addons/documents/assets/less/jumptodoc.less | 5 ++
app/addons/documents/jumptodoc.react.jsx | 48 ++++++++++++++++++++
app/addons/documents/views.js | 8 ++--
4 files changed, 59 insertions(+), 3 deletions(-)
----------------------------------------------------------------------
http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/842baebc/app/addons/documents/assets/less/documents.less
----------------------------------------------------------------------
diff --git a/app/addons/documents/assets/less/documents.less b/app/addons/documents/assets/less/documents.less
index 99d616c..8ce8aa6 100644
--- a/app/addons/documents/assets/less/documents.less
+++ b/app/addons/documents/assets/less/documents.less
@@ -21,6 +21,7 @@
@import "doc-editor.less";
@import "header.less";
@import "revision-browser";
+@import "jumptodoc";
.two-sides-toggle-button {
font-size: 15px;
http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/842baebc/app/addons/documents/assets/less/jumptodoc.less
----------------------------------------------------------------------
diff --git a/app/addons/documents/assets/less/jumptodoc.less b/app/addons/documents/assets/less/jumptodoc.less
new file mode 100644
index 0000000..34d8691
--- /dev/null
+++ b/app/addons/documents/assets/less/jumptodoc.less
@@ -0,0 +1,5 @@
+#jump-to-doc-wrapper {
+}
+
+.Select-menu-outer {
+}
http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/842baebc/app/addons/documents/jumptodoc.react.jsx
----------------------------------------------------------------------
diff --git a/app/addons/documents/jumptodoc.react.jsx b/app/addons/documents/jumptodoc.react.jsx
new file mode 100644
index 0000000..2692bd7
--- /dev/null
+++ b/app/addons/documents/jumptodoc.react.jsx
@@ -0,0 +1,48 @@
+// 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',
+ '../../core/api',
+ 'react',
+ 'react-dom',
+ 'react-select',
+], (app, FauxtonAPI, React, ReactDOM, ReactSelect) => {
+
+ const JumpToDoc = ({database, allDocs}) => {
+ const options = allDocs.map(doc => {
+ return {
+ value: doc.get('_id'),
+ label: doc.get('_id')
+ };
+ });
+ console.log('op', options);
+ return (
+ <div id="jump-to-doc-wrapper" class="input-append">
+ <ReactSelect
+ name="jump-to-doc"
+ placeholder="Document ID"
+ className="input-large"
+ options={options}
+ clearable={false}
+ onChange={(val) => {console.log('bbb', val);}} />
+ </div>
+ );
+ };
+
+ return {
+ JumpToDoc,
+ render: (el, database, allDocs) => {
+ ReactDOM.render(<JumpToDoc database={database} allDocs={allDocs} />, $(el)[0]);
+ }
+ };
+});
http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/842baebc/app/addons/documents/views.js
----------------------------------------------------------------------
diff --git a/app/addons/documents/views.js b/app/addons/documents/views.js
index b121bb1..633fbf3 100644
--- a/app/addons/documents/views.js
+++ b/app/addons/documents/views.js
@@ -20,12 +20,13 @@ define([
// Views
"./queryoptions/queryoptions.react",
"./queryoptions/actions",
+ './jumptodoc.react',
//plugins
"../../../assets/js/plugins/prettify"
],
-function (app, FauxtonAPI, Components, Documents, Databases, QueryOptions, QueryActions) {
+function (app, FauxtonAPI, Components, Documents, Databases, QueryOptions, QueryActions, JumpToDoc) {
var Views = {};
@@ -53,14 +54,15 @@ function (app, FauxtonAPI, Components, Documents, Databases, QueryOptions, Query
FauxtonAPI.Events.on('success:bulkDelete', this.selectAllMenu);
// insert the Search Docs field
- this.headerSearch = this.insertView("#header-search", new Views.JumpToDoc({
+ /*this.headerSearch = this.insertView("#header-search", new Views.JumpToDoc({
database: this.database,
collection: this.database.allDocs
- }));
+ }));*/
},
afterRender: function () {
QueryOptions.render('#query-options');
+ JumpToDoc.render('#header-search', this.database, this.database.allDocs);
this.toggleQueryOptionsHeader(this.isHidden);
},
[2/2] fauxton commit: updated refs/heads/jump-to-docs to 2d99c7f
Posted by ga...@apache.org.
working
Project: http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/repo
Commit: http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/commit/2d99c7fd
Tree: http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/tree/2d99c7fd
Diff: http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/diff/2d99c7fd
Branch: refs/heads/jump-to-docs
Commit: 2d99c7fd86e45f25d09b1e45df17f501742103ef
Parents: 842baeb
Author: Garren Smith <ga...@gmail.com>
Authored: Wed May 18 15:16:25 2016 +0200
Committer: Garren Smith <ga...@gmail.com>
Committed: Wed May 18 15:16:25 2016 +0200
----------------------------------------------------------------------
app/addons/documents/jumptodoc.react.jsx | 74 +++++++++++++++++++--------
1 file changed, 53 insertions(+), 21 deletions(-)
----------------------------------------------------------------------
http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/2d99c7fd/app/addons/documents/jumptodoc.react.jsx
----------------------------------------------------------------------
diff --git a/app/addons/documents/jumptodoc.react.jsx b/app/addons/documents/jumptodoc.react.jsx
index 2692bd7..8b25e62 100644
--- a/app/addons/documents/jumptodoc.react.jsx
+++ b/app/addons/documents/jumptodoc.react.jsx
@@ -16,28 +16,60 @@ define([
'react',
'react-dom',
'react-select',
-], (app, FauxtonAPI, React, ReactDOM, ReactSelect) => {
+ 'lodash'
+], (app, FauxtonAPI, React, ReactDOM, ReactSelect, {debounce}) => {
- const JumpToDoc = ({database, allDocs}) => {
- const options = allDocs.map(doc => {
- return {
- value: doc.get('_id'),
- label: doc.get('_id')
- };
- });
- console.log('op', options);
- return (
- <div id="jump-to-doc-wrapper" class="input-append">
- <ReactSelect
- name="jump-to-doc"
- placeholder="Document ID"
- className="input-large"
- options={options}
- clearable={false}
- onChange={(val) => {console.log('bbb', val);}} />
- </div>
- );
- };
+ const JumpToDoc = React.createClass({
+ propTypes: {
+ database: React.PropTypes.object.isRequired,
+ allDocs: React.PropTypes.object.isRequired,
+ },
+ /*
+ This makes me so so so sad,
+ basically we have done something wrong with the positioning of our sidebar,
+ so the only way to get the dropdown to be visible is to make its position absolute
+ and position it relative to the control next to it.
+ */
+ positionSelect () {
+ const el = ReactDOM.findDOMNode(this);
+ const dimensions = $('.control-toggle-include-docs')[0].getBoundingClientRect();
+ $(el).find('.jump-to-doc').css({
+ position: 'absolute',
+ left: dimensions.left + 84 + 'px'
+ });
+ },
+
+ componentDidMount () {
+ this.positionSelect();
+ window.addEventListener("resize", debounce(() => this.positionSelect(), 150));
+ },
+
+ onChange ({value: docId}) {
+ var url = FauxtonAPI.urls('document', 'app', app.utils.safeURLName(this.props.database.id), app.utils.safeURLName(docId) );
+ FauxtonAPI.navigate(url, {trigger: true});
+ },
+
+ render () {
+ const {database, allDocs} = this.props;
+ const options = allDocs.map(doc => {
+ return {
+ value: doc.get('_id'),
+ label: doc.get('_id')
+ };
+ });
+ return (
+ <div id="jump-to-doc" class="input-append">
+ <ReactSelect
+ name="jump-to-doc"
+ placeholder="Document ID"
+ className="input-large jump-to-doc"
+ options={options}
+ clearable={false}
+ onChange={this.onChange} />
+ </div>
+ );
+ }
+ });
return {
JumpToDoc,