gaspersic/freeCodeCamp
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

fix: scroll to editable region on mount

Browse Source
This commit is contained in:
Oliver Eyton-Williams
2020-07-24 15:29:46 +02:00
committed by Mrugesh Mohapatra
parent a4c836c6d4
commit 78c3b42770
1 changed files with 13 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
client/src/templates/Challenges/classic/Editor.js
View File

@@ -2,7 +2,6 @@ import React, { Component } from 'react';
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
import { connect } from 'react-redux'; import { connect } from 'react-redux';
import { createSelector } from 'reselect'; import { createSelector } from 'reselect';
import isEqual from 'lodash/isEqual';
import Loadable from '@loadable/component'; import Loadable from '@loadable/component';
import { import {
@@ -291,8 +290,6 @@ class Editor extends Component {
]; ];
if (editableBoundaries.length === 2) { if (editableBoundaries.length === 2) {
this.showEditableRegion(editableBoundaries);
// TODO: is there a nicer approach/way of organising everything that // TODO: is there a nicer approach/way of organising everything that
// avoids the binds? babel-plugin-transform-class-properties ? // avoids the binds? babel-plugin-transform-class-properties ?
const getViewZoneTop = this.getViewZoneTop.bind(this); const getViewZoneTop = this.getViewZoneTop.bind(this);
@@ -349,6 +346,7 @@ class Editor extends Component {
editor.layoutOverlayWidget(this._overlayWidget); editor.layoutOverlayWidget(this._overlayWidget);
editor.layoutOverlayWidget(this._outputWidget); editor.layoutOverlayWidget(this._outputWidget);
}); });
this.showEditableRegion(editableBoundaries);
} }
}; };
@@ -501,18 +499,21 @@ class Editor extends Component {
showEditableRegion(editableBoundaries) { showEditableRegion(editableBoundaries) {
if (editableBoundaries.length !== 2) return; if (editableBoundaries.length !== 2) return;
// TODO: The heuristic has been commented out for now because the cursor
// position is not saved at the moment, so it's redundant. I'm leaving it
// here for now, in case we decide to save it in future.
// this is a heuristic: if the cursor is at the start of the page, chances // this is a heuristic: if the cursor is at the start of the page, chances
// are the user has not edited yet. If so, move to the start of the editable // are the user has not edited yet. If so, move to the start of the editable
// region. // region.
if ( // if (
isEqual({ ...this._editor.getPosition() }, { lineNumber: 1, column: 1 }) // isEqual({ ...this._editor.getPosition() }, { lineNumber: 1, column: 1 })
) { // ) {
this._editor.setPosition({ this._editor.setPosition({
lineNumber: editableBoundaries[0] + 1, lineNumber: editableBoundaries[0] + 1,
column: 1 column: 1
}); });
this._editor.revealLines(...editableBoundaries); this._editor.revealLinesInCenter(...editableBoundaries);
} // }
} }
highlightLines(stickiness, target, range, oldIds = []) { highlightLines(stickiness, target, range, oldIds = []) {