You are viewing a plain text version of this content. The canonical link for it is here.
Posted to dev@couchdb.apache.org by garrensmith <gi...@git.apache.org> on 2015/04/21 11:56:21 UTC
[GitHub] couchdb-fauxton pull request: [WIP] Fix view bugs
GitHub user garrensmith opened a pull request:
https://github.com/apache/couchdb-fauxton/pull/391
[WIP] Fix view bugs
This fixes some view bugs and converts the Code Editor component to use only React.
You can merge this pull request into a Git repository by running:
$ git pull https://github.com/garrensmith/couchdb-fauxton fix-view-bugs
Alternatively you can review and apply these changes as the patch at:
https://github.com/apache/couchdb-fauxton/pull/391.patch
To close this pull request, make a commit to your master/trunk branch
with (at least) the following in the commit message:
This closes #391
----
commit 6326e38b263c402338cf14597ac44f65b783bd97
Author: Robert Kowalski <ro...@apache.org>
Date: 2015-04-14T15:42:04Z
fix invariant
what happens:
- react renders with the superfluous whitespace.
- the browser removes it in good will
- react wants to rerender, but the diffing is broken
commit ba6761d5b15e343ecc4b40bb1796392da826ac2a
Author: Garren Smith <ga...@gmail.com>
Date: 2015-04-14T07:34:38Z
Fix View save conflict
Saving a view multiple times causes a conflict error
FIXES COUCHDB-2662
commit 32da02ff52ba0177a26ce3bc7246ff3b6b2ee28c
Author: Garren Smith <ga...@gmail.com>
Date: 2015-04-15T10:25:58Z
Remove page limit, its not needed anymore
commit 43c0132dd31fcce8aaef9fa61bf14f0e9a2baaa3
Author: Garren Smith <ga...@gmail.com>
Date: 2015-04-15T13:51:44Z
Convert editor to React
commit 79b52a73d6048b811bed1721f7eef91c08ac5e02
Author: Garren Smith <ga...@gmail.com>
Date: 2015-04-21T08:24:52Z
Fix tests
----
---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---
[GitHub] couchdb-fauxton pull request: [WIP] Fix view bugs
Posted by robertkowalski <gi...@git.apache.org>.
Github user robertkowalski commented on a diff in the pull request:
https://github.com/apache/couchdb-fauxton/pull/391#discussion_r28867923
--- Diff: app/addons/components/react-components.react.jsx ---
@@ -63,7 +64,188 @@ function (app, FauxtonAPI, React, Components, beautifyHelper) {
});
var CodeEditor = React.createClass({
+ getDefaultProps: function () {
+ return {
+ id : 'code-editor',
+ mode : 'javascript',
+ theme : 'idle_fingers',
+ fontSize : 13,
+ code : '',
+ showGutter : true,
+ highlightActiveLine : true,
+ showPrintMargin : false,
+ autoScrollEditorIntoView: true,
+ setHeightWithJS: true,
+ isFullPageEditor: false,
+ };
+ },
+
+ hasChanged: function () {
+ return !_.isEqual(this.props.code, this.getValue());
+ },
+
+ setupAce: function (props) {
+ this.editor = ace.edit(this.getDOMNode(this.refs.ace));
+ // Automatically scrolling cursor into view after selection
+ // change this will be disabled in the next version
+ // set editor.$blockScrolling = Infinity to disable this message
+ this.editor.$blockScrolling = Infinity;
+
+ this.editor.setShowPrintMargin(props.showPrintMargin);
--- End diff --
ah it is passed. then line 101 must get the `this` removed
---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---
[GitHub] couchdb-fauxton pull request: [WIP] Fix view bugs
Posted by robertkowalski <gi...@git.apache.org>.
Github user robertkowalski commented on the pull request:
https://github.com/apache/couchdb-fauxton/pull/391#issuecomment-94846263
i think it is there: https://github.com/garrensmith/couchdb-fauxton/blob/fix-view-bugs/app/addons/documents/index-editor/components.react.jsx#L154
---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---
[GitHub] couchdb-fauxton pull request: [WIP] Fix view bugs
Posted by robertkowalski <gi...@git.apache.org>.
Github user robertkowalski commented on a diff in the pull request:
https://github.com/apache/couchdb-fauxton/pull/391#discussion_r29767681
--- Diff: app/addons/documents/tests/viewIndex.componentsSpec.react.jsx ---
@@ -179,12 +172,12 @@ define([
afterEach(function () {
- Actions.newDesignDoc.restore && Actions.newDesignDoc.restore();
- Actions.designDocChange.restore && Actions.designDocChange.restore();
+ restore(Actions.newDesignDoc);
+ restore(Actions.designDocChange);
React.unmountComponentAtNode(container);
});
- it('calls new design doc on new selected', function () {
+ /*it('calls new design doc on new selected', function () {
--- End diff --
please remove them before merging
---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---
[GitHub] couchdb-fauxton pull request: [WIP] Fix view bugs
Posted by garrensmith <gi...@git.apache.org>.
Github user garrensmith commented on a diff in the pull request:
https://github.com/apache/couchdb-fauxton/pull/391#discussion_r28864941
--- Diff: app/addons/components/tests/codeEditorSpec.js ---
@@ -0,0 +1,139 @@
+// 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;
+ var code = 'function (doc) {\n emit(doc._id, 1);\n}';
+ var code2 = 'function (doc) {\n if(doc._id) { \n emit(doc._id, 2); \n } \n}';
+
+ describe('Code Editor', function () {
+ var container, codeEditorEl;
+
+ beforeEach(function () {
+ container = document.createElement('div');
+ codeEditorEl = TestUtils.renderIntoDocument(
+ React.createElement(ReactComponents.CodeEditor, {code: code}),
+ container
+ );
+ });
+
+ afterEach(function () {
+ React.unmountComponentAtNode(container);
+ });
+
+ describe('Tracking edits', function () {
+
+ it('no change on mount', function () {
+ assert.notOk(codeEditorEl.hasChanged());
+ });
+
+ it('no change on update', function () {
+ codeEditorEl.setProps({code: code2});
+
+ assert.notOk(codeEditorEl.hasChanged());
+ });
+
+ it('detects change on user input', function () {
+ codeEditorEl.editor.setValue(code2, -1);
+
+ assert.ok(codeEditorEl.hasChanged());
+ });
+
+ });
+
+ describe('setHeightToLineCount', function () {
+
+ beforeEach(function () {
+ codeEditorEl = TestUtils.renderIntoDocument(
+ React.createElement(ReactComponents.CodeEditor, {code: code, isFullPageEditor: false, setHeightWithJS: true}),
+ container
+ );
+
+ });
+
+ it('sets line height correctly for non full page', function () {
+ var spy = sinon.spy(codeEditorEl.editor, 'setOptions');
+
+ codeEditorEl.setHeightToLineCount();
+ assert.ok(spy.calledOnce);
+ assert.equal(spy.getCall(0).args[0].maxLines, 3);
+ });
+
+ });
+
+ describe('removeIncorrectAnnotations', function () {
+
+ beforeEach(function () {
+ codeEditorEl = TestUtils.renderIntoDocument(
+ React.createElement(ReactComponents.CodeEditor, {code: code}),
+ container
+ );
+
+ });
+
+ it('removes default errors that do not apply to CouchDB Views', function () {
+ assert.equal(codeEditorEl.getAnnotations(), 0);
+ });
+
+ });
+
+ describe('setEditorValue', function () {
+
+ it('sets new code', function () {
+ codeEditorEl = TestUtils.renderIntoDocument(
+ React.createElement(ReactComponents.CodeEditor, {code: code}),
+ container
+ );
+
+ codeEditorEl.setEditorValue(code2);
+ assert.deepEqual(codeEditorEl.getValue(), code2);
+ });
+
+ });
+
+ //I cannot get these to work as I cannot get the mode-javascript to load
+ /*describe('hadValidCode', function () {
--- End diff --
What are you not sure about?
---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---
[GitHub] couchdb-fauxton pull request: [WIP] Fix view bugs
Posted by robertkowalski <gi...@git.apache.org>.
Github user robertkowalski commented on the pull request:
https://github.com/apache/couchdb-fauxton/pull/391#issuecomment-99515622
i am getting race conditions
---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---
[GitHub] couchdb-fauxton pull request: [WIP] Fix view bugs
Posted by robertkowalski <gi...@git.apache.org>.
Github user robertkowalski commented on a diff in the pull request:
https://github.com/apache/couchdb-fauxton/pull/391#discussion_r28864940
--- Diff: app/addons/documents/tests/viewIndex.componentsSpec.react.jsx ---
@@ -179,12 +172,12 @@ define([
afterEach(function () {
- Actions.newDesignDoc.restore && Actions.newDesignDoc.restore();
- Actions.designDocChange.restore && Actions.designDocChange.restore();
+ restore(Actions.newDesignDoc);
+ restore(Actions.designDocChange);
React.unmountComponentAtNode(container);
});
- it('calls new design doc on new selected', function () {
+ /*it('calls new design doc on new selected', function () {
--- End diff --
these are all commented
---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---
[GitHub] couchdb-fauxton pull request: [WIP] Fix view bugs
Posted by robertkowalski <gi...@git.apache.org>.
Github user robertkowalski commented on a diff in the pull request:
https://github.com/apache/couchdb-fauxton/pull/391#discussion_r28864820
--- Diff: app/addons/components/react-components.react.jsx ---
@@ -63,7 +64,188 @@ function (app, FauxtonAPI, React, Components, beautifyHelper) {
});
var CodeEditor = React.createClass({
+ getDefaultProps: function () {
+ return {
+ id : 'code-editor',
+ mode : 'javascript',
+ theme : 'idle_fingers',
+ fontSize : 13,
+ code : '',
+ showGutter : true,
+ highlightActiveLine : true,
+ showPrintMargin : false,
+ autoScrollEditorIntoView: true,
+ setHeightWithJS: true,
+ isFullPageEditor: false,
+ };
+ },
+
+ hasChanged: function () {
+ return !_.isEqual(this.props.code, this.getValue());
+ },
+
+ setupAce: function (props) {
+ this.editor = ace.edit(this.getDOMNode(this.refs.ace));
+ // Automatically scrolling cursor into view after selection
+ // change this will be disabled in the next version
+ // set editor.$blockScrolling = Infinity to disable this message
+ this.editor.$blockScrolling = Infinity;
+
+ this.editor.setShowPrintMargin(props.showPrintMargin);
+ this.editor.autoScrollEditorIntoView = props.autoScrollEditorIntoView;
+ this.setEditorValue(props.code);
+ this.setHeightToLineCount();
+ this.removeIncorrectAnnotations();
+ this.editor.getSession().setMode("ace/mode/" + props.mode);
+ this.editor.setTheme("ace/theme/" + props.theme);
+ this.editor.setFontSize(this.props.fontSize);
+ },
+
+ setupEvents: function () {
+ $(window).on('beforeunload.editor_' + this.editorId, _.bind(this.quitWarningMsg));
+ FauxtonAPI.beforeUnload('editor_' + this.editorId, _.bind(this.quitWarningMsg, this));
+ },
+
+ quitWarningMsg: function () {
+ if (this.hasChanged()) {
+ return 'Your changes have not been saved. Click cancel to return to the document.';
+ }
+ },
+
+ removeEvents: function () {
+ $(window).off('beforeunload.editor_' + this.editorId);
+ $(window).off('resize.editor', this.onPageResize);
+ FauxtonAPI.removeBeforeUnload('editor_' + this.editorId);
+ },
+
+ setHeightToLineCount: function () {
+ if (!this.props.setHeightWithJS) {
+ return;
+ }
+
+ var lines = this.editor.getSession().getDocument().getLength();
+
+ if (this.props.isFullPageEditor) {
+ var maxLines = this.getMaxAvailableLinesOnPage();
+ lines = lines < maxLines ? lines : maxLines;
+ }
+ this.editor.setOptions({
+ maxLines: lines
+ });
+ },
+
+ // List of JSHINT errors to ignore
+ // Gets around problem of anonymous functions not being a valid statement
+ excludedViewErrors: [
+ "Missing name in function declaration.",
+ "['{a}'] is better written in dot notation."
+ ],
+
+ isIgnorableError: function (msg) {
+ return _.contains(this.excludedViewErrors, msg);
+ },
+
+ removeIncorrectAnnotations: function () {
+ var editor = this.editor,
+ isIgnorableError = this.isIgnorableError;
+
+ this.editor.getSession().on("changeAnnotation", function () {
+ var annotations = editor.getSession().getAnnotations();
+
+ var newAnnotations = _.reduce(annotations, function (annotations, error) {
+ if (!isIgnorableError(error.raw)) {
+ annotations.push(error);
+ }
+ return annotations;
+ }, []);
+
+ if (annotations.length !== newAnnotations.length) {
+ editor.getSession().setAnnotations(newAnnotations);
+ }
+ });
+ },
+
+ componentDidMount: function () {
+ this.setupAce(this.props);
+ this.setupEvents();
+ },
+
+ componentWillUnmount: function () {
+ this.removeEvents();
+ this.editor.destroy();
+ },
+
+ componentWillReceiveProps: function (nextProps) {
+ this.setupAce(nextProps);
+ },
+
+ editSaved: function () {
+ return this.hasChanged();
+ },
+
+ getTitleFragment: function () {
+ if (!this.props.docs) {
+ return <strong>{this.props.title}</strong>;
+ }
+
+ return (
+ <label>
+ <strong>{this.props.title}</strong>
+ <a
+ className="help-link"
+ data-bypass="true"
+ href={this.props.docs}
+ target="_blank"
+ >
+ <i className="icon-question-sign"></i>
+ </a>
+ </label>
+ );
+ },
+
+ getAnnotations: function () {
+ return this.editor.getSession().getAnnotations();
+ },
+
+ hadValidCode: function () {
+ var errors = this.getAnnotations();
+ // By default CouchDB view functions don't pass lint
+ return _.every(errors, function (error) {
+ return this.isIgnorableError(error.raw);
+ }, this);
+ },
+
+ setEditorValue: function (code, lineNumber) {
+ lineNumber = lineNumber ? lineNumber : -1;
+ this.editor.setValue(code, lineNumber);
+ },
+
+ getValue: function () {
+ return this.editor.getValue();
+ },
+
+ getEditor: function () {
+ return this;
+ },
+
render: function () {
+ return (
+ <div className="control-group">
+ {this.getTitleFragment()}
+ <div ref="ace" className="js-editor" id={this.props.id}></div>
+ <Beautify code={this.props.code} beautifiedCode={this.setEditorValue} />
+ </div>
+ );
+ }
+
+ });
+
+ /*var CodeEditor = React.createClass({
--- End diff --
i think we can remove that guy
---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---
[GitHub] couchdb-fauxton pull request: [WIP] Fix view bugs
Posted by michellephung <gi...@git.apache.org>.
Github user michellephung commented on the pull request:
https://github.com/apache/couchdb-fauxton/pull/391#issuecomment-95236935
looks pretty good so far
---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---
[GitHub] couchdb-fauxton pull request: [WIP] Fix view bugs
Posted by robertkowalski <gi...@git.apache.org>.
Github user robertkowalski commented on a diff in the pull request:
https://github.com/apache/couchdb-fauxton/pull/391#discussion_r28864845
--- Diff: app/addons/components/tests/codeEditorSpec.js ---
@@ -0,0 +1,139 @@
+// 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;
+ var code = 'function (doc) {\n emit(doc._id, 1);\n}';
+ var code2 = 'function (doc) {\n if(doc._id) { \n emit(doc._id, 2); \n } \n}';
+
+ describe('Code Editor', function () {
+ var container, codeEditorEl;
+
+ beforeEach(function () {
+ container = document.createElement('div');
+ codeEditorEl = TestUtils.renderIntoDocument(
+ React.createElement(ReactComponents.CodeEditor, {code: code}),
+ container
+ );
+ });
+
+ afterEach(function () {
+ React.unmountComponentAtNode(container);
+ });
+
+ describe('Tracking edits', function () {
+
+ it('no change on mount', function () {
+ assert.notOk(codeEditorEl.hasChanged());
+ });
+
+ it('no change on update', function () {
+ codeEditorEl.setProps({code: code2});
+
+ assert.notOk(codeEditorEl.hasChanged());
+ });
+
+ it('detects change on user input', function () {
+ codeEditorEl.editor.setValue(code2, -1);
+
+ assert.ok(codeEditorEl.hasChanged());
+ });
+
+ });
+
+ describe('setHeightToLineCount', function () {
+
+ beforeEach(function () {
+ codeEditorEl = TestUtils.renderIntoDocument(
+ React.createElement(ReactComponents.CodeEditor, {code: code, isFullPageEditor: false, setHeightWithJS: true}),
+ container
+ );
+
+ });
+
+ it('sets line height correctly for non full page', function () {
+ var spy = sinon.spy(codeEditorEl.editor, 'setOptions');
+
+ codeEditorEl.setHeightToLineCount();
+ assert.ok(spy.calledOnce);
+ assert.equal(spy.getCall(0).args[0].maxLines, 3);
+ });
+
+ });
+
+ describe('removeIncorrectAnnotations', function () {
+
+ beforeEach(function () {
+ codeEditorEl = TestUtils.renderIntoDocument(
+ React.createElement(ReactComponents.CodeEditor, {code: code}),
+ container
+ );
+
+ });
+
+ it('removes default errors that do not apply to CouchDB Views', function () {
+ assert.equal(codeEditorEl.getAnnotations(), 0);
+ });
+
+ });
+
+ describe('setEditorValue', function () {
+
+ it('sets new code', function () {
+ codeEditorEl = TestUtils.renderIntoDocument(
+ React.createElement(ReactComponents.CodeEditor, {code: code}),
+ container
+ );
+
+ codeEditorEl.setEditorValue(code2);
+ assert.deepEqual(codeEditorEl.getValue(), code2);
+ });
+
+ });
+
+ //I cannot get these to work as I cannot get the mode-javascript to load
+ /*describe('hadValidCode', function () {
--- End diff --
not sure about this?
---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---
[GitHub] couchdb-fauxton pull request: [WIP] Fix view bugs
Posted by robertkowalski <gi...@git.apache.org>.
Github user robertkowalski commented on the pull request:
https://github.com/apache/couchdb-fauxton/pull/391#issuecomment-95147684
race condition which happens sometimes:
---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---
[GitHub] couchdb-fauxton pull request: [WIP] Fix view bugs
Posted by benkeen <gi...@git.apache.org>.
Github user benkeen commented on the pull request:
https://github.com/apache/couchdb-fauxton/pull/391#issuecomment-99627486
Since Garren's away the rest of the week, I'm going to finish this PR here: https://github.com/apache/couchdb-fauxton/pull/399
---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---
[GitHub] couchdb-fauxton pull request: [WIP] Fix view bugs
Posted by robertkowalski <gi...@git.apache.org>.
Github user robertkowalski commented on the pull request:
https://github.com/apache/couchdb-fauxton/pull/391#issuecomment-95148310
in ` @ components.react.js:290` (btw that's why i would prefer to name files like `components.indexresultlist.react.js`):
```
Uncaught Error: Invariant Violation: findComponentRoot(..., .1.0.2.2.0.0.0.2): Unable to find element. This probably means the DOM was unexpectedly mutated (e.g., by the browser), usually due to forgetting a <tbody> when using tables, nesting tags like <form>, <p>, or <a>, or using non-SVG elements in an <svg> parent. Try inspecting the child nodes of the element with React ID ``.
```
---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---
[GitHub] couchdb-fauxton pull request: [WIP] Fix view bugs
Posted by michellephung <gi...@git.apache.org>.
Github user michellephung commented on a diff in the pull request:
https://github.com/apache/couchdb-fauxton/pull/391#discussion_r28882270
--- Diff: app/addons/components/react-components.react.jsx ---
@@ -63,15 +64,123 @@ function (app, FauxtonAPI, React, Components, beautifyHelper) {
});
var CodeEditor = React.createClass({
- render: function () {
- var code = this.aceEditor ? this.aceEditor.getValue() : this.props.code;
- return (
- <div className="control-group">
- {this.getTitleFragment()}
- <div className="js-editor" id={this.props.id}>{this.props.code}</div>
- <Beautify code={code} beautifiedCode={this.setEditorValue} />
- </div>
- );
+ getDefaultProps: function () {
+ return {
+ id: 'code-editor',
+ mode: 'javascript',
+ theme: 'idle_fingers',
+ fontSize: 13,
+ code: '',
+ showGutter: true,
+ highlightActiveLine: true,
+ showPrintMargin: false,
+ autoScrollEditorIntoView: true,
+ setHeightWithJS: true,
+ isFullPageEditor: false,
+ };
+ },
+
+ hasChanged: function () {
+ return !_.isEqual(this.props.code, this.getValue());
+ },
+
+ setupAce: function (props) {
+ this.editor = ace.edit(this.getDOMNode(this.refs.ace));
+ // Automatically scrolling cursor into view after selection
+ // change this will be disabled in the next version
+ // set editor.$blockScrolling = Infinity to disable this message
+ this.editor.$blockScrolling = Infinity;
+
+ this.editor.setShowPrintMargin(props.showPrintMargin);
+ this.editor.autoScrollEditorIntoView = props.autoScrollEditorIntoView;
+ this.setEditorValue(props.code);
+ this.setHeightToLineCount();
+ this.removeIncorrectAnnotations();
+ this.editor.getSession().setMode("ace/mode/" + props.mode);
+ this.editor.setTheme("ace/theme/" + props.theme);
+ this.editor.setFontSize(props.fontSize);
+ },
+
+ setupEvents: function () {
+ $(window).on('beforeunload.editor_' + this.props.id, _.bind(this.quitWarningMsg));
+ FauxtonAPI.beforeUnload('editor_' + this.props.id, _.bind(this.quitWarningMsg, this));
+ },
+
+ quitWarningMsg: function () {
+ if (this.hasChanged()) {
+ return 'Your changes have not been saved. Click cancel to return to the document.';
+ }
+ },
+
+ removeEvents: function () {
+ $(window).off('beforeunload.editor_' + this.props.id);
+ FauxtonAPI.removeBeforeUnload('editor_' + this.props.id);
+ },
+
+ setHeightToLineCount: function () {
+ if (!this.props.setHeightWithJS) {
+ return;
+ }
+
+ var lines = this.editor.getSession().getDocument().getLength();
+
+ if (this.props.isFullPageEditor) {
+ var maxLines = this.getMaxAvailableLinesOnPage();
+ lines = lines < maxLines ? lines : maxLines;
+ }
+ this.editor.setOptions({
+ maxLines: lines
+ });
+ },
+
+ // List of JSHINT errors to ignore
+ // Gets around problem of anonymous functions not being a valid statement
+ excludedViewErrors: [
+ "Missing name in function declaration.",
+ "['{a}'] is better written in dot notation."
+ ],
+
+ isIgnorableError: function (msg) {
+ return _.contains(this.excludedViewErrors, msg);
+ },
+
+ removeIncorrectAnnotations: function () {
+ var editor = this.editor,
+ isIgnorableError = this.isIgnorableError;
+
+ this.editor.getSession().on("changeAnnotation", function () {
+ var annotations = editor.getSession().getAnnotations();
+
+ var newAnnotations = _.reduce(annotations, function (annotations, error) {
+ if (!isIgnorableError(error.raw)) {
+ annotations.push(error);
+ }
+ return annotations;
+ }, []);
+
+ if (annotations.length !== newAnnotations.length) {
+ editor.getSession().setAnnotations(newAnnotations);
+ }
+ });
+ },
+
+ componentDidMount: function () {
+ this.setupAce(this.props);
+ this.setupEvents();
+ },
+
+ componentWillUnmount: function () {
+ console.log('hello unmount', this.props.id);
--- End diff --
:koala: console.log
---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---
[GitHub] couchdb-fauxton pull request: [WIP] Fix view bugs
Posted by robertkowalski <gi...@git.apache.org>.
Github user robertkowalski commented on a diff in the pull request:
https://github.com/apache/couchdb-fauxton/pull/391#discussion_r28864887
--- Diff: app/addons/documents/index-editor/stores.js ---
@@ -27,7 +27,7 @@ function (FauxtonAPI, ActionTypes) {
this._designDocs = [];
this._view = {
reduce: this.defaultMap,
- map: this.defaultReduce
--- End diff --
isn't it tthat reduce must get `this.defaultReduce` instead of `this.defaultMap`?
---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---
[GitHub] couchdb-fauxton pull request: [WIP] Fix view bugs
Posted by robertkowalski <gi...@git.apache.org>.
Github user robertkowalski commented on the pull request:
https://github.com/apache/couchdb-fauxton/pull/391#issuecomment-95149138
i think we can delete our old backbone ace now?
---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---
[GitHub] couchdb-fauxton pull request: [WIP] Fix view bugs
Posted by robertkowalski <gi...@git.apache.org>.
Github user robertkowalski commented on the pull request:
https://github.com/apache/couchdb-fauxton/pull/391#issuecomment-99516320
https://cloudup.com/c0VbKefzH9R
---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---
[GitHub] couchdb-fauxton pull request: [WIP] Fix view bugs
Posted by michellephung <gi...@git.apache.org>.
Github user michellephung commented on the pull request:
https://github.com/apache/couchdb-fauxton/pull/391#issuecomment-99523820
i've noticed two things.
1. Uncaught TypeError: this._collection.hasPrevious is not a function <-- happens when i save a view, then try to use the < (back button) next to the db name, and shows a blank screen.
2. New view code editor will pre-fill code with last function
---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---
[GitHub] couchdb-fauxton pull request: [WIP] Fix view bugs
Posted by robertkowalski <gi...@git.apache.org>.
Github user robertkowalski commented on a diff in the pull request:
https://github.com/apache/couchdb-fauxton/pull/391#discussion_r28864718
--- Diff: app/addons/components/react-components.react.jsx ---
@@ -63,7 +64,188 @@ function (app, FauxtonAPI, React, Components, beautifyHelper) {
});
var CodeEditor = React.createClass({
+ getDefaultProps: function () {
+ return {
+ id : 'code-editor',
+ mode : 'javascript',
+ theme : 'idle_fingers',
+ fontSize : 13,
+ code : '',
+ showGutter : true,
+ highlightActiveLine : true,
+ showPrintMargin : false,
+ autoScrollEditorIntoView: true,
+ setHeightWithJS: true,
+ isFullPageEditor: false,
--- End diff --
the `:` are strange aligned sometimes - is there a reason for that?
---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---
[GitHub] couchdb-fauxton pull request: [WIP] Fix view bugs
Posted by garrensmith <gi...@git.apache.org>.
Github user garrensmith closed the pull request at:
https://github.com/apache/couchdb-fauxton/pull/391
---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---
[GitHub] couchdb-fauxton pull request: [WIP] Fix view bugs
Posted by robertkowalski <gi...@git.apache.org>.
Github user robertkowalski commented on a diff in the pull request:
https://github.com/apache/couchdb-fauxton/pull/391#discussion_r28865907
--- Diff: app/addons/components/react-components.react.jsx ---
@@ -63,7 +64,188 @@ function (app, FauxtonAPI, React, Components, beautifyHelper) {
});
var CodeEditor = React.createClass({
+ getDefaultProps: function () {
+ return {
+ id : 'code-editor',
+ mode : 'javascript',
+ theme : 'idle_fingers',
+ fontSize : 13,
+ code : '',
+ showGutter : true,
+ highlightActiveLine : true,
+ showPrintMargin : false,
+ autoScrollEditorIntoView: true,
+ setHeightWithJS: true,
+ isFullPageEditor: false,
+ };
+ },
+
+ hasChanged: function () {
+ return !_.isEqual(this.props.code, this.getValue());
+ },
+
+ setupAce: function (props) {
+ this.editor = ace.edit(this.getDOMNode(this.refs.ace));
+ // Automatically scrolling cursor into view after selection
+ // change this will be disabled in the next version
+ // set editor.$blockScrolling = Infinity to disable this message
+ this.editor.$blockScrolling = Infinity;
+
+ this.editor.setShowPrintMargin(props.showPrintMargin);
+ this.editor.autoScrollEditorIntoView = props.autoScrollEditorIntoView;
+ this.setEditorValue(props.code);
+ this.setHeightToLineCount();
+ this.removeIncorrectAnnotations();
+ this.editor.getSession().setMode("ace/mode/" + props.mode);
+ this.editor.setTheme("ace/theme/" + props.theme);
+ this.editor.setFontSize(this.props.fontSize);
+ },
+
+ setupEvents: function () {
+ $(window).on('beforeunload.editor_' + this.editorId, _.bind(this.quitWarningMsg));
+ FauxtonAPI.beforeUnload('editor_' + this.editorId, _.bind(this.quitWarningMsg, this));
+ },
+
+ quitWarningMsg: function () {
+ if (this.hasChanged()) {
+ return 'Your changes have not been saved. Click cancel to return to the document.';
+ }
+ },
+
+ removeEvents: function () {
+ $(window).off('beforeunload.editor_' + this.editorId);
+ $(window).off('resize.editor', this.onPageResize);
+ FauxtonAPI.removeBeforeUnload('editor_' + this.editorId);
+ },
--- End diff --
seems that the event is not unregistered... make changes to a view... click on "all databases in the sidebar" ... click "ok" ... click on a database in the list: popup still appears
---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---
[GitHub] couchdb-fauxton pull request: [WIP] Fix view bugs
Posted by robertkowalski <gi...@git.apache.org>.
Github user robertkowalski commented on the pull request:
https://github.com/apache/couchdb-fauxton/pull/391#issuecomment-94735478
there is again an invariant-error, if you open http://localhost:8000/#database/animaldb/new_view
looking at the stacktrace it originates from `var Editor = React.createClass({displayName: "Editor",`
---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---
[GitHub] couchdb-fauxton pull request: [WIP] Fix view bugs
Posted by robertkowalski <gi...@git.apache.org>.
Github user robertkowalski commented on the pull request:
https://github.com/apache/couchdb-fauxton/pull/391#issuecomment-99515642
video soon
---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---
[GitHub] couchdb-fauxton pull request: [WIP] Fix view bugs
Posted by robertkowalski <gi...@git.apache.org>.
Github user robertkowalski commented on a diff in the pull request:
https://github.com/apache/couchdb-fauxton/pull/391#discussion_r28865785
--- Diff: app/addons/components/react-components.react.jsx ---
@@ -63,7 +64,188 @@ function (app, FauxtonAPI, React, Components, beautifyHelper) {
});
var CodeEditor = React.createClass({
+ getDefaultProps: function () {
+ return {
+ id : 'code-editor',
+ mode : 'javascript',
+ theme : 'idle_fingers',
+ fontSize : 13,
+ code : '',
+ showGutter : true,
+ highlightActiveLine : true,
+ showPrintMargin : false,
+ autoScrollEditorIntoView: true,
+ setHeightWithJS: true,
+ isFullPageEditor: false,
+ };
+ },
+
+ hasChanged: function () {
+ return !_.isEqual(this.props.code, this.getValue());
+ },
+
+ setupAce: function (props) {
+ this.editor = ace.edit(this.getDOMNode(this.refs.ace));
+ // Automatically scrolling cursor into view after selection
+ // change this will be disabled in the next version
+ // set editor.$blockScrolling = Infinity to disable this message
+ this.editor.$blockScrolling = Infinity;
+
+ this.editor.setShowPrintMargin(props.showPrintMargin);
--- End diff --
must be `this.props.showPrintMargin`
---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---
[GitHub] couchdb-fauxton pull request: [WIP] Fix view bugs
Posted by garrensmith <gi...@git.apache.org>.
Github user garrensmith commented on the pull request:
https://github.com/apache/couchdb-fauxton/pull/391#issuecomment-100937004
This has been fixed in #402
---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---