cpui-components
Version:
276 lines (254 loc) • 9.72 kB
JavaScript
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.CPToolbar = undefined;
var _react = require('react');
var _react2 = _interopRequireDefault(_react);
var _CPToolbarSection = require('./../CPToolbarSection');
var _CPToolbarMenu = require('./../CPToolbarMenu');
var _propTypes = require('prop-types');
var _propTypes2 = _interopRequireDefault(_propTypes);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
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; }
var CPToolbar = exports.CPToolbar = function (_Component) {
_inherits(CPToolbar, _Component);
function CPToolbar() {
var _ref;
var _temp, _this, _ret;
_classCallCheck(this, CPToolbar);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_ref = CPToolbar.__proto__ || Object.getPrototypeOf(CPToolbar)).call.apply(_ref, [this].concat(args))), _this), _this.render = function () {
var productName = _this.props.product;
var productClass = void 0;
var productLogo = void 0;
var civicCenter = false;
switch (productName.toLowerCase()) {
case 'civicengage':
productClass = 'cp-Toolbar--civicEngage';
productLogo = _react2.default.createElement(
'svg',
{ className: 'cp-Toolbar-logoSVG cp-Toolbar-logoSVG--product cp-Toolbar-logoSVG--color' },
_react2.default.createElement('use', { xlinkHref: '#iconCivicEngage' })
);
break;
case 'civicready':
productClass = 'cp-Toolbar--civicReady';
productLogo = _react2.default.createElement(
'svg',
{ className: 'cp-Toolbar-logoSVG cp-Toolbar-logoSVG--product cp-Toolbar-logoSVG--color' },
_react2.default.createElement('use', { xlinkHref: '#iconCivicReady' })
);
break;
case 'civichr':
productClass = 'cp-Toolbar--civicHR';
productLogo = _react2.default.createElement(
'svg',
{ className: 'cp-Toolbar-logoSVG cp-Toolbar-logoSVG--product cp-Toolbar-logoSVG--color' },
_react2.default.createElement('use', { xlinkHref: '#iconCivicHR' })
);
break;
case 'civicrec':
productClass = 'cp-Toolbar--civicRec';
productLogo = _react2.default.createElement(
'svg',
{ className: 'cp-Toolbar-logoSVG cp-Toolbar-logoSVG--product cp-Toolbar-logoSVG--color' },
_react2.default.createElement('use', { xlinkHref: '#iconCivicRec' })
);
break;
case 'civicclerk':
productClass = 'cp-Toolbar--civicClerk';
productLogo = _react2.default.createElement(
'svg',
{ className: 'cp-Toolbar-logoSVG cp-Toolbar-logoSVG--product cp-Toolbar-logoSVG--color' },
_react2.default.createElement('use', { xlinkHref: '#iconCivicClerk' })
);
break;
default:
productClass = '';
productLogo = _react2.default.createElement(
'svg',
{ className: 'cp-Toolbar-logoSVG cp-Toolbar-logoSVG--color' },
_react2.default.createElement('use', { xlinkHref: '#CPLogo' })
);
civicCenter = true;
break;
}
return _react2.default.createElement(
'div',
{ className: 'cp-Toolbars', id: 'cp-Toolbars' },
_react2.default.createElement(
'div',
{ className: 'cp-Toolbar cp-AdminWrap ' + productClass },
_react2.default.createElement(
'div',
{ className: 'cp-LayoutWrap cp-LayoutWrap--noLeftNav cp-Toolbar-inner' },
_react2.default.createElement(
_CPToolbarSection.CPToolbarSection,
{ side: 'left' },
_react2.default.createElement(
'div',
{ className: 'cp-Toolbar-item cp-Toolbar-item--narrow' },
_react2.default.createElement(
'a',
{ href: '#sideMenu', className: 'cp-Toolbar-itemLink cp-Toolbar-menuButton' },
_react2.default.createElement(
'svg',
null,
_react2.default.createElement('use', { xlinkHref: '#iconHamburger' })
),
_react2.default.createElement(
'span',
{ className: 'is-vHidden' },
'Menu'
)
)
),
_react2.default.createElement(
'div',
{ className: 'cp-Toolbar-item cp-Toolbar-item--wide cp-Toolbar-item--withMenu cp-Toolbar-item--productsList' },
_react2.default.createElement(
'a',
{ href: '#cpProducts', className: 'cp-Toolbar-itemLink cp-Toolbar-logo cp-Toolbar-products ' + (civicCenter ? 'cp-Toolbar-products--civicCenter' : ''), 'aria-label': 'Navigate to a different product' },
productLogo,
_react2.default.createElement(
'svg',
{ className: 'cp-Toolbar-logoSVG cp-Toolbar-logoSVG--white' },
_react2.default.createElement('use', { xlinkHref: '#CPLogo--mono' })
)
)
),
_react2.default.createElement(
'h2',
{ className: 'cp-Toolbar-item cp-Toolbar-item--narrow cp-Toolbar-title' },
'CivicPlus'
)
),
_react2.default.createElement(
_CPToolbarSection.CPToolbarSection,
{ side: 'right' },
_react2.default.createElement(_CPToolbarMenu.CPToolbarMenu, { id: 'userMenu', type: 'primary', title: 'Paul M', options: ["Settings", "Organizations", "Sign Out"] }),
_react2.default.createElement(
'div',
{ className: 'cp-Toolbar-item cp-Toolbar-item--wide cp-Toolbar-item--withMenu' },
_react2.default.createElement(
'a',
{ href: '#helpMenu', className: 'cp-Toolbar-itemLink cp-Toolbar-help' },
'Help'
)
)
)
)
),
_react2.default.createElement(
'div',
{ className: 'cp-Alerts' },
_react2.default.createElement(
'div',
{ className: 'cp-UIMessage cp-Alert cp-LayoutWrap cp-LayoutWrap--noLeftNav' },
_react2.default.createElement('span', { className: 'cp-UIMessage-text' })
)
),
_react2.default.createElement(
'nav',
{ id: 'sideMenu', className: 'cp-SideMenu cp-AdminWrap' },
_react2.default.createElement('i', null),
' ',
_react2.default.createElement('i', null),
' ',
_react2.default.createElement('i', null),
' ',
_react2.default.createElement(
'h3',
{ className: 'cp-IconGrid-heading' },
'Paul\'s Products'
),
_react2.default.createElement(
'ol',
{ className: 'cp-IconGrid-list' },
_react2.default.createElement(
'li',
{ className: 'cp-IconGrid-item' },
_react2.default.createElement(
'a',
{ href: '../../Areas/Dashboard/Index.html', className: 'cp-IconGrid-itemLink' },
_react2.default.createElement(
'svg',
null,
_react2.default.createElement('use', { xlinkHref: '#iconCivicEngage--mono' })
),
'City of Pensacola'
)
)
),
_react2.default.createElement(
'ol',
{ className: 'cp-NavMenuList' },
_react2.default.createElement(
'li',
{ className: 'cp-NavMenuList-item' },
_react2.default.createElement(
'a',
{ href: '/', className: 'cp-NavMenuList-itemLink cp-NavMenuList-itemLink--myAccount' },
_react2.default.createElement('img', { src: 'http://fillmurray.com/100/100', alt: 'Paul Miller\'s Avatar', className: 'cp-NavMenuList-myAccountThumb' }),
_react2.default.createElement(
'span',
{ className: 'cp-NavMenuList-myAccountName' },
'Paul Miller'
)
)
),
_react2.default.createElement(
'li',
{ className: 'cp-NavMenuList-item' },
_react2.default.createElement(
'a',
{ href: '/', className: 'cp-NavMenuList-itemLink' },
'Sign Out'
)
)
),
_react2.default.createElement(
'ol',
{ className: 'cp-NavMenuList' },
_react2.default.createElement(
'li',
{ className: 'cp-NavMenuList-item' },
_react2.default.createElement(
'button',
{ 'data-accordion': '#sideHelpMenu', className: 'cp-NavMenuList-itemLink' },
'Help'
),
_react2.default.createElement(
'ol',
{ id: 'sideHelpMenu', className: 'cp-NavMenuList cp-AccordionContainer' },
_react2.default.createElement(
'li',
{ className: 'cp-NavMenuList-item' },
_react2.default.createElement(
'a',
{ href: '/', className: 'cp-NavMenuList-itemLink' },
'CivicPlus University'
)
)
)
)
)
)
);
}, _temp), _possibleConstructorReturn(_this, _ret);
}
return CPToolbar;
}(_react.Component);
CPToolbar.propTypes = {
/** Something */
product: _propTypes2.default.string
};
CPToolbar.defaultProps = {
product: 'CivicPlus'
};
exports.default = CPToolbar;