diff options
Diffstat (limited to 'animism-align/frontend/views/media/components')
3 files changed, 75 insertions, 17 deletions
diff --git a/animism-align/frontend/views/media/components/media.form.js b/animism-align/frontend/views/media/components/media.form.js index 9b93788..1463041 100644 --- a/animism-align/frontend/views/media/components/media.form.js +++ b/animism-align/frontend/views/media/components/media.form.js @@ -16,6 +16,7 @@ const newMedia = () => ({ title: '', author: '', pre_title: '', + post_title: '', translated_title: '', date: '', source: '', @@ -38,9 +39,11 @@ export default class MediaForm extends Component { constructor(props) { super(props) + this.handleKeyDown = this.handleKeyDown.bind(this) this.handleSelect = this.handleSelect.bind(this) this.handleChange = this.handleChange.bind(this) this.handleSettingsChange = this.handleSettingsChange.bind(this) + this.handleSettingsChangeEvent = this.handleSettingsChangeEvent.bind(this) this.handleSubmit = this.handleSubmit.bind(this) } @@ -57,6 +60,21 @@ export default class MediaForm extends Component { ...data }, }) + window.addEventListener('keydown', this.handleKeyDown) + } + + componentWillUnmount() { + window.removeEventListener('keydown', this.handleKeyDown) + } + + handleKeyDown(e) { + // console.log(e, e.keyCode) + if ((e.ctrlKey || e.metaKey) && e.keyCode === 83) { + if (e) { + e.preventDefault() + } + this.handleSubmit() + } } handleChange(e) { @@ -78,7 +96,13 @@ export default class MediaForm extends Component { }) } + handleSettingsChangeEvent(e) { + const { name, value } = e.target + this.handleSettingsChange(name, value) + } + handleSettingsChange(name, value) { + console.log(name, value) if (name !== 'multiple') { value = { [name]: value } } @@ -94,11 +118,13 @@ export default class MediaForm extends Component { } handleSubmit(e) { - e.preventDefault() + if (e) { + e.preventDefault() + } const { isNew, onSubmit } = this.props const { data } = this.state const requiredKeys = "author title date".split(" ") - const validKeys = "type tag url title author pre_title translated_title date source medium start_ts settings".split(" ") + const validKeys = "type tag url title author pre_title post_title translated_title date source medium start_ts settings".split(" ") const validData = validKeys.reduce((a,b) => { a[b] = data[b]; return a }, {}) const errorFields = requiredKeys.filter(key => !validData[key]) if (errorFields.length) { @@ -167,7 +193,13 @@ export default class MediaForm extends Component { <TextInput title="Title Prefix" name="pre_title" - required + data={data} + onChange={this.handleChange} + autoComplete="off" + /> + <TextInput + title="Title Suffix" + name="post_title" data={data} onChange={this.handleChange} autoComplete="off" @@ -175,7 +207,6 @@ export default class MediaForm extends Component { <TextInput title="Translated Title" name="translated_title" - required data={data} onChange={this.handleChange} autoComplete="off" @@ -205,6 +236,20 @@ export default class MediaForm extends Component { autoComplete="off" /> <TextArea + title="Citation" + name="bibliography" + placeholder="Use if special HTML formatting needed" + data={data.settings} + onChange={this.handleSettingsChangeEvent} + /> + <Checkbox + label="Hide in list of works" + name="hide_in_bibliography" + checked={data.settings.hide_in_bibliography} + onChange={this.handleSettingsChange} + autoComplete="off" + /> + <TextArea title="Description" name="description" data={data} @@ -217,7 +262,7 @@ export default class MediaForm extends Component { {!!errorFields.size && <label> <span></span> - <span>Please complete the required fields =)</span> + <span>Please complete the required fields</span> </label> } </form> diff --git a/animism-align/frontend/views/media/components/media.formImage.js b/animism-align/frontend/views/media/components/media.formImage.js index abd0f94..4a97112 100644 --- a/animism-align/frontend/views/media/components/media.formImage.js +++ b/animism-align/frontend/views/media/components/media.formImage.js @@ -86,19 +86,23 @@ export default class MediaImageForm extends Component { // when we upload an image, if the image already exists in this "position" // on the record, we should also delete it if (this.props.data.settings[tag] && this.props.data.settings[tag].id) { - return actions.upload.destroy(this.props.data.settings[tag]) - .then(() => { - return this.uploadTaggedSize(image, tag, fn) - }) - .catch(() => { - console.log('error deleting the image') - return this.uploadTaggedSize(image, tag, fn) + return new Promise((resolve, reject) => { + actions.upload.destroy(this.props.data.settings[tag]) + .then(() => { + console.log('destroy successful') + this.uploadTaggedSize(image, tag, fn).then(data => resolve(data)) + }) + .catch(() => { + console.log('error deleting the image') + this.uploadTaggedSize(image, tag, fn).then(data => resolve(data)) + }) }) } return this.uploadTaggedSize(image, tag, fn) } uploadTaggedSize(image, tag, fn) { + console.log('uploading size', tag) const uploadData = { image, tag, diff --git a/animism-align/frontend/views/media/components/media.menu.js b/animism-align/frontend/views/media/components/media.menu.js index 3d7e86a..153a5c1 100644 --- a/animism-align/frontend/views/media/components/media.menu.js +++ b/animism-align/frontend/views/media/components/media.menu.js @@ -28,7 +28,7 @@ const MediaIndexMenu = () => ([ ]) const MediaShowMenu = connect(mapStateToProps)((props) => ([ - <MenuButton key='back' name="back" />, + <MenuButton key='back' name="back" href="/media/" />, <MenuButton key='edit' name="edit" href={"/media/" + props.match.params.id + "/edit/"} />, <MenuButton key='delete' name="delete" onClick={() => { const { res: media } = props.media.show @@ -41,9 +41,18 @@ const MediaShowMenu = connect(mapStateToProps)((props) => ([ ])) const MediaNewMenu = (props) => ([ - <MenuButton key='back' name="back" />, + <MenuButton key='back' name="back" href="/media/" />, ]) -const MediaEditMenu = (props) => ([ - <MenuButton key='back' name="back" />, -]) +const MediaEditMenu = connect(mapStateToProps)((props) => ([ + <MenuButton key='back' name="back" href="/media/" />, + <MenuButton key='copy' name="copy" href={"/media/" + props.match.params.id + '/copy/'} label="Make a copy" />, + <MenuButton key='delete' name="delete" onClick={() => { + const { res: media } = props.media.show + if (confirm("Really delete this media?")) { + actions.media.destroy(media).then(() => { + history.push('/media/') + }) + } + }} />, +])) |