@bigfishtv/cockpit
Version:
166 lines (132 loc) • 6.1 kB
JavaScript
'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;