alm
Version:
The best IDE for TypeScript
98 lines (97 loc) • 3.65 kB
JavaScript
;
var __extends = (this && this.__extends) || (function () {
var extendStatics = Object.setPrototypeOf ||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
return function (d, b) {
extendStatics(d, b);
function __() { this.constructor = d; }
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
})();
Object.defineProperty(exports, "__esModule", { value: true });
var React = require("react");
var csx = require("../base/csx");
var ui_1 = require("../ui");
var utils = require("../../common/utils");
var styles = require("../styles/styles");
var commands = require("../commands/commands");
var tipStyle = {
fontSize: '2rem',
color: styles.successColor,
fontWeight: 'bold',
userSelect: 'none',
whiteSpace: 'pre',
};
var tipKeyboardStyle = {
border: '2px solid',
borderRadius: '6px'
};
var Tips = /** @class */ (function (_super) {
__extends(Tips, _super);
function Tips(props) {
var _this = _super.call(this, props) || this;
_this.tips = [
{
message: 'Find a file to work with',
keyboard: commands.modName + "+P"
},
{
message: 'Set active project',
keyboard: "Alt+Shift+P"
},
{
message: 'Close a tab',
keyboard: 'Alt+W'
},
{
message: 'Undo close tab',
keyboard: 'Alt+Shift+W'
},
{
message: 'Editor keybindings:',
keyboard: 'Sublime Text'
},
{
message: 'Editor focus from anywhere',
keyboard: 'Escape'
}
];
_this.state = {
selected: 0
};
return _this;
}
Tips.prototype.componentDidMount = function () {
var _this = this;
var next = function () { return utils.rangeLimited({ num: _this.state.selected + 1, min: 0, max: _this.tips.length - 1, loopAround: true }); };
var loop = setInterval(function () { return _this.setState({ selected: next() }); }, 5000);
this.disposible.add({ dispose: function () { return clearInterval(loop); } });
};
Tips.prototype.componentWillUnmount = function () {
this.disposible.dispose();
};
Tips.prototype.render = function () {
var tip = this.tips[this.state.selected];
{
/**
* To use velocity animation group
* - The first sub element must change ... hence `key` otherwise react reuses DOM
* - The first sub element will be forced to have `display:block`
* (velocity does that for some reason ... so no flexbox ... we use newLayer)
* - Restore flexbox using newLayer + some flex root
*/
}
return (React.createElement("div", { key: this.state.selected, style: csx.extend(csx.newLayer) },
React.createElement("span", { style: csx.extend(csx.newLayer, csx.flexRoot) },
React.createElement("span", { style: csx.extend(csx.flex, csx.centerCenter, tipStyle) },
tip.message,
"\u00A0",
React.createElement("span", { style: tipKeyboardStyle },
" ",
tip.keyboard,
" ")))));
};
return Tips;
}(ui_1.BaseComponent));
exports.Tips = Tips;