UNPKG

@bigfishtv/cockpit

Version:

166 lines (132 loc) 6.1 kB
'use strict'; exports.__esModule = true; exports.default = undefined; var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; var _class, _temp; var _propTypes = require('prop-types'); var _propTypes2 = _interopRequireDefault(_propTypes); var _react = require('react'); var _react2 = _interopRequireDefault(_react); var _AssetFinder = require('../asset/AssetFinder'); var _AssetFinder2 = _interopRequireDefault(_AssetFinder); var _MainContent = require('../container/MainContent'); var _MainContent2 = _interopRequireDefault(_MainContent); var _Bulkhead = require('../page/Bulkhead'); var _Bulkhead2 = _interopRequireDefault(_Bulkhead); var _Upload = require('../upload/Upload'); var _Upload2 = _interopRequireDefault(_Upload); 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 Toolbar = function Toolbar(props) { return _react2.default.createElement(_Upload2.default, { style: 'primary', size: 'large', onReceivedFiles: props.toolbarProps.handleReceivedFiles }); }; /** * For displaying AssetFinder in a page format */ var MediaPage = (_temp = _class = function (_Component) { _inherits(MediaPage, _Component); function MediaPage(props) { _classCallCheck(this, MediaPage); var _this = _possibleConstructorReturn(this, _Component.call(this)); _this.handleQueryChange = function (query) { _this.setState({ query: query }); }; _this.handleGlobalSearchToggle = function (checked) { _this.setState({ globalSearch: checked }); }; _this.handleViewModeChange = function (viewMode) { _this.setState({ viewMode: viewMode }); }; _this.handleAssetTypeChange = function (assetType) { var filters = [{ property: 'kind', value: assetType }]; _this.setState({ assetType: assetType, filters: filters }); }; _this.handleFolderChange = function (currentFolder) { if (!_this.state.currentFolder && currentFolder || _this.state.currentFolder && !currentFolder || _this.state.currentFolder && currentFolder && _this.state.currentFolder.id != currentFolder.id) { var newState = { currentFolder: currentFolder }; if (_this.state.query !== '' && _this.state.query !== null) newState.query = null; _this.setState(newState); } }; _this.handleSelectionChange = function (selectedAssets) { _this.setState({ selectedAssets: selectedAssets }); }; _this.handleReceivedFiles = function (receivedFiles) { _this.setState({ receivedFiles: receivedFiles }); }; _this.state = { viewMode: 'grid', query: '', filters: [], globalSearch: false, currentFolder: null, assetType: null, allData: [], data: [], selectedAssets: [], receivedFiles: [] }; return _this; } MediaPage.prototype.render = function render() { var _state = this.state, viewMode = _state.viewMode, query = _state.query, filters = _state.filters, globalSearch = _state.globalSearch, assetType = _state.assetType, currentFolder = _state.currentFolder, selectedAssets = _state.selectedAssets, receivedFiles = _state.receivedFiles; var toolbarProps = { handleReceivedFiles: this.handleReceivedFiles }; return _react2.default.createElement( _MainContent2.default, null, _react2.default.createElement(_Bulkhead2.default, { title: 'Media', Toolbar: Toolbar, toolbarProps: toolbarProps }), _react2.default.createElement(_AssetFinder2.default, _extends({}, this.props, { uncontrolled: false, allowSelection: true, receivedFiles: receivedFiles, viewMode: viewMode, query: query, assetType: assetType, filters: filters, globalSearch: globalSearch, onGlobalSearchToggle: this.handleGlobalSearchToggle, onQueryChange: this.handleQueryChange, onViewModeChange: this.handleViewModeChange, onAssetTypeChange: this.handleAssetTypeChange, currentFolderId: currentFolder && currentFolder.id, selectedAssets: selectedAssets, onFolderChange: this.handleFolderChange, onSelectionChange: this.handleSelectionChange })) ); }; return MediaPage; }(_react.Component), _class.propTypes = { defaultFolderId: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.number]), assetGetUrl: _propTypes2.default.string, assetUpdateUrl: _propTypes2.default.string, assetDeleteUrl: _propTypes2.default.string, folderGetUrl: _propTypes2.default.string, folderUpdateUrl: _propTypes2.default.string, folderDeleteUrl: _propTypes2.default.string, showUnsortedFolder: _propTypes2.default.bool }, _class.defaultProps = { defaultFolderId: null, assetGetUrl: '/tank/assets.json', assetNewUrl: '/tank/assets.json', assetUpdateUrl: '/tank/assets/', assetDeleteUrl: '/tank/assets/delete.json', folderGetUrl: '/admin/tank/asset_folders/tree.json', folderAddUrl: '/tank/asset_folders.json', folderUpdateUrl: '/tank/asset_folders/', folderDeleteUrl: '/tank/asset_folders/delete.json', showUnsortedFolder: true }, _temp); exports.default = MediaPage;