Skip to content

Commit 10edf6f

Browse files
basaratbasarat
committed
working rename variable view
refs #59
1 parent 13cfcf0 commit 10edf6f

12 files changed

+139
-42
lines changed

‎docs/spacepen.md

+3-2
Original file line numberDiff line numberDiff line change
@@ -3,5 +3,6 @@ Official docs : https://github.com/atom/space-pen / http://atom.github.io/space-
33

44
## Gotchas
55

6-
* outlet does not work on root. `this` is the root jq element
7-
* `initialize` is called after the view is attached to the DOM
6+
* The `outlet` option does not work on root. `this` is the root jq element
7+
* `initialize` is called after the view is attached to the DOM. The body of the `constructor` executes *after* `initialize` gets called (due to `super()`) so you cannot do `public something` as an argument to constructor. Our workaround is to have an `init` function called from the base view *after* the call to space-pen's `super`. So `init` is where we have the dom available in the clients. There is no point in having a `constructor` in your view
8+
* Tip: You generally want views to be singletons and *not* take options. So don't have an `init` function. I just did it during exploration.

‎lib/main/atom/commands.js

+9
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ var atomUtils = require('./atomUtils');
44
var autoCompleteProvider = require('./autoCompleteProvider');
55
var path = require('path');
66
var documentationView = require('./views/documentationView');
7+
var renameView = require('./views/renameView');
78
var apd = require('../../../apd');
89
function commandForTypeScript(e) {
910
var editor = atom.workspace.getActiveTextEditor();
@@ -80,5 +81,13 @@ function registerCommands() {
8081
documentationView.docView.autoPosition();
8182
documentationView.docView.show();
8283
});
84+
atom.commands.add('atom-text-editor', 'typescript:rename-variable', function (e) {
85+
atom.notifications.addInfo('coming soon. UI test only');
86+
renameView.panelView.renameThis({
87+
text: 'someText',
88+
onCancel: function () { return console.log('cancel'); },
89+
onCommit: function (newText) { return console.log(newText); }
90+
});
91+
});
8392
}
8493
exports.registerCommands = registerCommands;

‎lib/main/atom/commands.ts

+14-2
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,8 @@ import ts = require('typescript');
1111

1212
///ts:import=documentationView
1313
import documentationView = require('./views/documentationView'); ///ts:import:generated
14+
///ts:import=renameView
15+
import renameView = require('./views/renameView'); ///ts:import:generated
1416
var apd = require('../../../apd'); // Moved here because I customized it
1517

1618
// Utility functions for commands
@@ -106,7 +108,17 @@ export function registerCommands() {
106108
documentationView.docView.autoPosition();
107109
documentationView.docView.show();
108110
});
109-
111+
112+
atom.commands.add('atom-text-editor', 'typescript:rename-variable',(e) => {
113+
// TODO: get text
114+
atom.notifications.addInfo('coming soon. UI test only');
115+
renameView.panelView.renameThis({
116+
text: 'someText',
117+
onCancel: () => console.log('cancel'),
118+
onCommit: (newText) => console.log(newText)
119+
});
120+
});
121+
110122
/// Register autocomplete commands to show documentations
111123
/*atom.packages.activatePackage('autocomplete-plus').then(() => {
112124
var autocompletePlus = apd.require('autocomplete-plus');
@@ -125,7 +137,7 @@ export function registerCommands() {
125137
currentSuggestionIndex = 0;
126138
}
127139
documentationView.docView.show();
128-
documentationView.docView.autoPosition(); // TODO: only first time
140+
documentationView.docView.autoPosition(); // TODO: only first time
129141
});
130142
131143
autocompletePlus.autocompleteManager.suggestionList.emitter.on('did-select-previous',() => {

‎lib/main/atom/views/awesomePanelView.js

+3-3
Original file line numberDiff line numberDiff line change
@@ -8,14 +8,14 @@ var view = require('./view');
88
var $ = view.$;
99
var AwesomePanelView = (function (_super) {
1010
__extends(AwesomePanelView, _super);
11-
function AwesomePanelView(options) {
12-
_super.call(this);
11+
function AwesomePanelView() {
12+
_super.apply(this, arguments);
1313
}
1414
AwesomePanelView.content = function () {
1515
var _this = this;
1616
return this.div({ class: 'awesome' }, function () { return _this.div({ class: 'dude', outlet: 'something' }); });
1717
};
18-
AwesomePanelView.prototype.initialize = function () {
18+
AwesomePanelView.prototype.init = function () {
1919
this.something.html('<div>tada</div>');
2020
};
2121
return AwesomePanelView;

‎lib/main/atom/views/awesomePanelView.ts

+2-6
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import view = require('./view');
22
var $ = view.$;
33

4-
export class AwesomePanelView extends view.View {
4+
export class AwesomePanelView extends view.View<any> {
55

66
private something: JQuery;
77
static content() {
@@ -10,11 +10,7 @@ export class AwesomePanelView extends view.View {
1010
);
1111
}
1212

13-
constructor(options?: any) {
14-
super();
15-
}
16-
17-
initialize() {
13+
init() {
1814
this.something.html('<div>tada</div>');
1915
}
2016
}

‎lib/main/atom/views/documentationView.js

+2-4
Original file line numberDiff line numberDiff line change
@@ -8,8 +8,8 @@ var view = require('./view');
88
var $ = view.$;
99
var DocumentationView = (function (_super) {
1010
__extends(DocumentationView, _super);
11-
function DocumentationView(options) {
12-
_super.call(this);
11+
function DocumentationView() {
12+
_super.apply(this, arguments);
1313
this.shown = false;
1414
}
1515
DocumentationView.content = function () {
@@ -19,8 +19,6 @@ var DocumentationView = (function (_super) {
1919
_this.p({ outlet: 'documentation' });
2020
}); });
2121
};
22-
DocumentationView.prototype.initialize = function () {
23-
};
2422
DocumentationView.prototype.show = function () {
2523
this.$.addClass('active');
2624
this.shown = true;

‎lib/main/atom/views/documentationView.ts

+2-6
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import view = require('./view');
22
var $ = view.$;
33

4-
export class DocumentationView extends view.View {
4+
export class DocumentationView extends view.View<any> {
55

66
private header: JQuery;
77
private documentation: JQuery;
@@ -15,10 +15,6 @@ export class DocumentationView extends view.View {
1515
);
1616
}
1717

18-
constructor(options?: any) {
19-
super();
20-
}
21-
initialize() { }
2218

2319
private shown = false;
2420
show() { this.$.addClass('active'); this.shown = true; }
@@ -79,4 +75,4 @@ function testDocumentationView() {
7975
`, filePath: "some filepath"
8076
});
8177
docView.show();
82-
}
78+
}

‎lib/main/atom/views/renameView.js

+39-5
Original file line numberDiff line numberDiff line change
@@ -9,19 +9,53 @@ var $ = view.$;
99
var html = require('./renameView.html');
1010
var RenameView = (function (_super) {
1111
__extends(RenameView, _super);
12-
function RenameView(options) {
13-
_super.call(this);
12+
function RenameView() {
13+
_super.apply(this, arguments);
1414
}
15-
RenameView.prototype.initialize = function () {
15+
RenameView.prototype.init = function () {
16+
var _this = this;
17+
$(atom.views.getView(atom.workspace)).on('keydown', function (e) {
18+
if (e.keyCode == 27) {
19+
if (_this.options.onCancel) {
20+
_this.options.onCancel();
21+
_this.clearView();
22+
}
23+
}
24+
});
25+
this.newNameEditor.on('keydown', function (e) {
26+
if (e.keyCode == 13) {
27+
if (_this.options.onCommit) {
28+
_this.options.onCommit(_this.newNameEditor.model.getText());
29+
_this.clearView();
30+
}
31+
}
32+
if (e.keyCode == 27) {
33+
if (_this.options.onCancel) {
34+
_this.options.onCancel();
35+
_this.clearView();
36+
}
37+
}
38+
});
39+
};
40+
RenameView.prototype.clearView = function () {
41+
panel.hide();
42+
this.options = {};
43+
};
44+
RenameView.prototype.renameThis = function (options) {
45+
this.options = options;
46+
panel.show();
47+
this.newNameEditor.model.setText(options.text);
48+
this.newNameEditor.model.selectAll();
49+
this.newNameEditor.focus();
1650
};
1751
RenameView.content = html;
1852
return RenameView;
1953
})(view.View);
2054
exports.RenameView = RenameView;
2155
exports.panelView;
22-
exports.panel;
56+
var panel;
2357
function attach() {
2458
exports.panelView = new RenameView();
25-
exports.panel = atom.workspace.addModalPanel({ item: exports.panelView, priority: 1000, visible: false });
59+
panel = atom.workspace.addModalPanel({ item: exports.panelView, priority: 1000, visible: false });
2660
}
2761
exports.attach = attach;

‎lib/main/atom/views/renameView.ts

+49-9
Original file line numberDiff line numberDiff line change
@@ -2,26 +2,66 @@ import view = require('./view');
22
var $ = view.$;
33
var html = require('./renameView.html');
44

5-
export class RenameView extends view.View {
5+
interface EditorView extends JQuery {
6+
model: AtomCore.IEditor;
7+
}
8+
9+
interface RenameViewOptions {
10+
text: string;
11+
onCommit: (newValue: string) => any;
12+
onCancel: () => any;
13+
}
14+
15+
export class RenameView
16+
extends view.View<RenameViewOptions> {
617

7-
private something: JQuery;
18+
private newNameEditor: EditorView;
819
static content = html;
920

10-
constructor(options?: any) {
11-
super();
21+
public init() {
22+
$(atom.views.getView(atom.workspace)).on('keydown',(e) => {
23+
if (e.keyCode == 27) { // escape
24+
if (this.options.onCancel) {
25+
this.options.onCancel();
26+
this.clearView();
27+
}
28+
}
29+
});
30+
31+
this.newNameEditor.on('keydown',(e) => {
32+
if (e.keyCode == 13) { // enter
33+
if (this.options.onCommit) {
34+
this.options.onCommit(this.newNameEditor.model.getText());
35+
this.clearView();
36+
}
37+
}
38+
if (e.keyCode == 27) { // escape
39+
if (this.options.onCancel) {
40+
this.options.onCancel();
41+
this.clearView();
42+
}
43+
}
44+
});
45+
}
46+
47+
public clearView() {
48+
panel.hide();
49+
this.options = <any>{};
1250
}
1351

14-
initialize() {
52+
public renameThis(options: RenameViewOptions) {
1553

54+
this.options = options;
55+
panel.show();
56+
this.newNameEditor.model.setText(options.text);
57+
this.newNameEditor.model.selectAll();
58+
this.newNameEditor.focus();
1659
}
1760
}
1861

1962
export var panelView: RenameView;
20-
export var panel: AtomCore.Panel;
63+
var panel: AtomCore.Panel;
2164
export function attach() {
2265
panelView = new RenameView();
2366
panel = atom.workspace.addModalPanel({ item: panelView, priority: 1000, visible: false });
24-
25-
// Test
26-
// panel.show();
2767
}

‎lib/main/atom/views/tooltipView.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ interface Rect {
88
bottom: number;
99
}
1010

11-
export class TooltipView extends view.View {
11+
export class TooltipView extends view.View<any> {
1212

1313
constructor(public rect:Rect) {
1414
super();

‎lib/main/atom/views/view.js

+7-2
Original file line numberDiff line numberDiff line change
@@ -7,8 +7,11 @@ var __extends = this.__extends || function (d, b) {
77
var atom = require('atom');
88
var View = (function (_super) {
99
__extends(View, _super);
10-
function View() {
11-
_super.apply(this, arguments);
10+
function View(options) {
11+
if (options === void 0) { options = {}; }
12+
_super.call(this);
13+
this.options = options;
14+
this.init();
1215
}
1316
Object.defineProperty(View.prototype, "$", {
1417
get: function () {
@@ -20,6 +23,8 @@ var View = (function (_super) {
2023
View.content = function () {
2124
throw new Error('Must override the base View static content member');
2225
};
26+
View.prototype.init = function () {
27+
};
2328
return View;
2429
})(atom.View);
2530
exports.View = View;

‎lib/main/atom/views/view.ts

+8-2
Original file line numberDiff line numberDiff line change
@@ -3,14 +3,20 @@
33

44
import atom = require('atom');
55

6-
export class View extends atom.View {
6+
export class View<Options> extends atom.View {
77
get $(): JQuery {
88
return <any>this;
99
}
10-
10+
1111
static content() {
1212
throw new Error('Must override the base View static content member');
1313
}
14+
15+
constructor(public options: Options = <any>{}) {
16+
super();
17+
this.init();
18+
}
19+
init() { }
1420
}
1521

1622
export var $: JQueryStatic = atom.$;

0 commit comments

Comments
 (0)