kf-slate-editor
Version:
Another rich text editor using Slate framework with toolbar support
173 lines (132 loc) • 7.45 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _react = require("react");
var React = _interopRequireWildcard(_react);
var _kfXterm = require("kf-xterm");
var _sockjs = require("sockjs-client/dist/sockjs.min");
var _sockjs2 = _interopRequireDefault(_sockjs);
var _jquery = require("jquery");
var _jquery2 = _interopRequireDefault(_jquery);
var _attach = require("kf-xterm/lib/addons/attach");
var attach = _interopRequireWildcard(_attach);
var _fit = require("kf-xterm/lib/addons/fit/fit");
var fit = _interopRequireWildcard(_fit);
var _fullscreen = require("kf-xterm/lib/addons/fullscreen/fullscreen");
var fullscreen = _interopRequireWildcard(_fullscreen);
var _search = require("kf-xterm/lib/addons/search/search");
var search = _interopRequireWildcard(_search);
var _webLinks = require("kf-xterm/lib/addons/webLinks/webLinks");
var webLinks = _interopRequireWildcard(_webLinks);
var _winptyCompat = require("kf-xterm/lib/addons/winptyCompat/winptyCompat");
var winptyCompat = _interopRequireWildcard(_winptyCompat);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } /**
* Created by zhangliqing on 2018/5/18.
*/
//import * as TerminalIcon from 'xterm/lib/xterm';
_kfXterm.Terminal.applyAddon(attach);
_kfXterm.Terminal.applyAddon(fit);
_kfXterm.Terminal.applyAddon(fullscreen);
_kfXterm.Terminal.applyAddon(search);
_kfXterm.Terminal.applyAddon(webLinks);
_kfXterm.Terminal.applyAddon(winptyCompat);
var Xterm = function (_React$Component) {
_inherits(Xterm, _React$Component);
function Xterm(props) {
_classCallCheck(this, Xterm);
var _this = _possibleConstructorReturn(this, (Xterm.__proto__ || Object.getPrototypeOf(Xterm)).call(this, props));
_this.handleClick = function (e) {
e.stopPropagation();
_this.state.xterm.focus();
};
_this.state = {
xterm: null
};
return _this;
}
_createClass(Xterm, [{
key: "componentDidMount",
value: function componentDidMount() {
var _this2 = this;
if (this.props.addons) {
this.props.addons.forEach(function (s) {
var addon = require("kf-xterm/lib/addons/" + s + "/" + s);
_kfXterm.Terminal.applyAddon(addon);
});
}
this.setState({ xterm: new _kfXterm.Terminal({ cursorBlink: true }) }, function () {
_this2.state.xterm.open(_this2.container);
_this2.state.xterm.winptyCompatInit();
_this2.state.xterm.webLinksInit();
_this2.state.xterm.fit();
//this.state.xterm.focus();
var socket;
_jquery2.default.ajax({
method: "GET",
url:
//"http://api.kfcoding.com/cloudware/startContainer?imageName=nginx&type=1",
//"http://api.kfcoding.com/startContainer?imageName=nginx&type=1",
//"http://terminal.wss.kfcoding.com:80/api/v1/pod/kfcoding-alpha/shell-demo/shell/nginx",
"http://terminal.wss.kfcoding.com/api/v1/pod/kfcoding-alpha/terminal-1/shell/application",
success: function success(res) {
res.substring(1, res.length - 1);
var token = res.split("?")[1];
socket = (0, _sockjs2.default)(res); //socket = SockJS("http://wss.kfcoding.com:30081/api/sockjs?" + token);
socket.onopen = function () {
socket.send(JSON.stringify({ Op: "bind", SessionID: token }));
socket.send(JSON.stringify({ Op: "resize", Cols: 80, Rows: 24 }));
_this2.state.xterm.attach(socket);
//this.xterm._initialized = true;
};
},
timeout: 3000
});
});
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
if (this.xterm) {
this.xterm.destroy();
this.xterm = null;
}
}
}, {
key: "shouldComponentUpdate",
value: function shouldComponentUpdate(nextProps) {
var _this3 = this;
if (nextProps.hasOwnProperty("value") && nextProps.value != this.props.value) {
if (this.xterm) {
this.xterm.clear();
setTimeout(function () {
_this3.xterm.write(nextProps.value);
}, 0);
}
}
return false;
}
}, {
key: "render",
value: function render() {
var _this4 = this;
var onClick = function onClick(e) {
return _this4.handleClick(e);
};
return React.createElement("div", {
style: { margin: "10px auto", width: "80%" },
ref: function ref(_ref) {
return _this4.container = _ref;
},
onClick: onClick
});
}
}]);
return Xterm;
}(React.Component);
exports.default = Xterm;