catreact
Version:
Catavolt Core React Components
118 lines (117 loc) • 4.71 kB
JavaScript
/**
* Created by rburson on 3/15/16.
*/
"use strict";
var React = require('react');
var catreact_core_1 = require('./../core/catreact-core');
var catavolt_sdk_1 = require('catavolt-sdk');
/*
***************************************************
* Render a Workbench with Icons
***************************************************
*/
exports.CvGraphicalWorkbench = React.createClass({
mixins: [catreact_core_1.CvBaseMixin],
componentDidMount: function () {
this.refresh(this.props);
},
componentWillReceiveProps: function (nextProps) {
this.refresh(nextProps);
},
appWinDef: function () {
return this.props.appWinDef || this.firstInScope(catavolt_sdk_1.AppWinDef);
},
getDefaultProps: function () {
return {
appWinDef: null,
launchListeners: [],
actionListeners: [],
numCols: 3,
selectionProvider: null,
initialWorkbench: null,
initialWorkbenchId: null
};
},
getInitialState: function () {
return { workbench: null };
},
getChildContext: function () {
var ctx = this.getDefaultChildContext();
ctx.cvContext.scopeCtx.scopeObj = this.workbench();
return ctx;
},
refresh: function (props) {
if (props.initialWorkbench) {
this.setState({ workbench: props.initialWorkbench });
}
else if (props.initialWorkbenchId) {
var workbench = this._workbenchForId(props.initialWorkbenchId);
if (workbench) {
this.setState({ workbench: workbench });
}
else {
this.setState({ workbench: this.appWinDef().workbenches[0] });
}
}
else {
this.setState({ workbench: this.appWinDef().workbenches[0] });
}
var selectionProvider = props.selectionProvider;
if (selectionProvider) {
selectionProvider.subscribe(this._updateWorkbench);
}
},
render: function () {
var _this = this;
var workbench = this.workbench();
if (workbench) {
return (React.createElement(catreact_core_1.CvWorkbench, {workbench: workbench, appWinDef: this.appWinDef(), renderer: function (cvContext) {
var cssCols = Math.floor(12 / _this.props.numCols);
var workbench = cvContext.scopeCtx.scopeObj;
var newChildren = [];
var rowElems = [];
workbench.workbenchLaunchActions.forEach(function (launchAction, i) {
rowElems.push(React.createElement(catreact_core_1.CvLauncher, {launchAction: launchAction, key: launchAction.actionId, launchListeners: _this.props.launchListeners, actionListeners: _this.props.actionListeners, renderer: function (cvContext, callback) {
var launcher = cvContext.scopeCtx.scopeObj;
return (React.createElement("div", {onClick: callback.fireLaunchAction, className: "col-sm-" + cssCols + " cv-launcher-container cv-target animated fadeIn"}, React.createElement("img", {className: "cv-launcher-icon img-responsive center-block", src: launcher.iconBase, onError: _this._loadPlaceholder}), React.createElement("h4", {className: "cv-launcher-text small text-center"}, launcher.name)));
}}));
if (i % _this.props.numCols == _this.props.numCols - 1) {
newChildren.push(React.createElement('div', { className: 'row', key: i }, rowElems));
rowElems = [];
}
});
if (rowElems.length > 0) {
newChildren.push(React.createElement('div', { className: 'row', key: '00' }, rowElems));
}
return React.createElement("div", null, newChildren);
}}));
}
else {
return null;
}
},
workbench: function () {
return this.state.workbench;
},
_loadPlaceholder: function (e) {
e.preventDefault();
e.target.src = 'http://cdn.churchm.ag/wp-content/uploads/2013/06/404-Space-Invaders.png';
},
_updateWorkbench: function (workbench) {
this.setState({ workbench: workbench });
},
_workbenchForId: function (id) {
var appWinDef = this.appWinDef();
var workbench = null;
appWinDef.workbenches.some(function (wb) {
if (wb.workbenchId == id) {
workbench = wb;
return true;
}
else {
return false;
}
});
return workbench;
}
});