From 4903a204e4c4aeeb1ec7f7bb1e5d6549c6aa6073 Mon Sep 17 00:00:00 2001 From: Matthew Dillon Date: Fri, 1 Dec 2017 10:58:17 -0700 Subject: [PATCH] ENH: Collection attachments (#51) --- app/adapters/datasheet-attachment.js | 19 ++++++ app/components/collection/create-container.js | 55 ++++++++++++---- app/controllers/collections/create.js | 2 + app/controllers/collections/detail/edit.js | 2 + app/mixins/file-upload.js | 63 +++++++++++++++++++ app/models/collection.js | 1 + app/models/datasheet-attachment.js | 9 +++ app/routes/collections/detail.js | 4 +- app/templates/collections/create.hbs | 3 +- app/templates/collections/detail/edit.hbs | 3 +- .../collection/create-container.hbs | 41 +++++++++++- app/transforms/file.js | 11 ++++ app/validations/datasheet.js | 8 +++ tests/unit/transforms/file-test.js | 12 ++++ 14 files changed, 217 insertions(+), 16 deletions(-) create mode 100644 app/adapters/datasheet-attachment.js create mode 100644 app/mixins/file-upload.js create mode 100644 app/models/datasheet-attachment.js create mode 100644 app/transforms/file.js create mode 100644 app/validations/datasheet.js create mode 100644 tests/unit/transforms/file-test.js diff --git a/app/adapters/datasheet-attachment.js b/app/adapters/datasheet-attachment.js new file mode 100644 index 0000000..a89c329 --- /dev/null +++ b/app/adapters/datasheet-attachment.js @@ -0,0 +1,19 @@ +import ApplicationAdapter from './application'; +import FileUploadAdapter from 'ccdb-web/mixins/file-upload'; + +export default ApplicationAdapter.extend(FileUploadAdapter, { + getFormFields(data) { + return { + 'datasheet': data['data']['attributes']['datasheet'], + 'collection': JSON.stringify(data['data']['relationships']['collection']['data']), + } + }, + + getFormKey(key) { + return key; + }, + + getFormValue(key, value) { + return value; + }, +}); diff --git a/app/components/collection/create-container.js b/app/components/collection/create-container.js index 219c0fb..0f5ab1c 100644 --- a/app/components/collection/create-container.js +++ b/app/components/collection/create-container.js @@ -20,18 +20,27 @@ export default Component.extend({ lookupValidator(validations['collection']), validations['collection']); - // TODO: gross, just grab these data in the route. - model.get('collectionSpecies').then((collectionSpecies) => { - let collectionSpeciesChangesets = []; - collectionSpecies.forEach((cs) => { - const changeset = new Changeset(cs, - lookupValidator(validations['collectionSpecies']), - validations['collectionSpecies']); - collectionSpeciesChangesets.push({ model: cs, changeset: changeset }); - }); - changesets['hasMany']['collectionSpecies'] = collectionSpeciesChangesets; - this.set('changesets', changesets); + let collectionSpeciesChangesets = []; + const collectionSpecies = model.get('collectionSpecies'); + collectionSpecies.forEach((cs) => { + const changeset = new Changeset(cs, + lookupValidator(validations['collectionSpecies']), + validations['collectionSpecies']); + collectionSpeciesChangesets.push({ model: cs, changeset: changeset }); }); + changesets['hasMany']['collectionSpecies'] = collectionSpeciesChangesets; + + let datasheetsChangesets = []; + const datasheets = model.get('datasheets'); + datasheets.forEach((d) => { + const changeset = new Changeset(d, + lookupValidator(validations['datasheet']), + validations['datasheet']); + datasheetsChangesets.push({ model: d, changeset: changeset }); + }); + changesets['hasMany']['datasheets'] = datasheetsChangesets; + + this.set('changesets', changesets); }, actions: { @@ -54,5 +63,29 @@ export default Component.extend({ changesets['delete'].pushObject(changesetRecord.model); changesets['hasMany']['collectionSpecies'].removeObject(changesetRecord); }, + + updateDatasheet(changeset, event) { + changeset.set('datasheet', event.target.files[0]); + }, + + addDatasheet() { + const store = this.get('store'); + let changesets = this.get('changesets'); + const validations = this.get('validations'); + const collection = this.get('model'); + const d = store.createRecord('datasheet-attachment', { collection: collection }); + collection.get('datasheets').pushObject(d); + changesets['new'].pushObject(d); + const changeset = new Changeset(d, + lookupValidator(validations['datasheets']), + validations['datasheets']); + changesets['hasMany']['datasheets'].pushObject({ model: d, changeset: changeset }); + }, + + deleteDatasheet(changesetRecord) { + let changesets = this.get('changesets'); + changesets['delete'].pushObject(changesetRecord.model); + changesets['hasMany']['datasheets'].removeObject(changesetRecord); + }, }, }); diff --git a/app/controllers/collections/create.js b/app/controllers/collections/create.js index 40a753e..37192de 100644 --- a/app/controllers/collections/create.js +++ b/app/controllers/collections/create.js @@ -1,6 +1,7 @@ import Ember from 'ember'; import CollectionValidations from 'ccdb-web/validations/collection'; import CollectionSpeciesValidations from 'ccdb-web/validations/collection-species'; +import DatasheetValidations from 'ccdb-web/validations/datasheet'; import ValidationMixin from 'ccdb-web/mixins/validation'; const { Controller, computed } = Ember; @@ -8,6 +9,7 @@ const { Controller, computed } = Ember; export default Controller.extend(ValidationMixin, { CollectionValidations, CollectionSpeciesValidations, + DatasheetValidations, options: computed('projectOptions', 'studyLocationOptions', 'collectionTypeOptions', 'collectionMethodOptions', diff --git a/app/controllers/collections/detail/edit.js b/app/controllers/collections/detail/edit.js index 60842ea..72c586c 100644 --- a/app/controllers/collections/detail/edit.js +++ b/app/controllers/collections/detail/edit.js @@ -1,6 +1,7 @@ import Ember from 'ember'; import CollectionValidations from 'ccdb-web/validations/collection'; import CollectionSpeciesValidations from 'ccdb-web/validations/collection-species'; +import DatasheetValidations from 'ccdb-web/validations/datasheet'; import ValidationMixin from 'ccdb-web/mixins/validation'; const { Controller, computed } = Ember; @@ -8,6 +9,7 @@ const { Controller, computed } = Ember; export default Controller.extend(ValidationMixin, { CollectionValidations, CollectionSpeciesValidations, + DatasheetValidations, options: computed('projectOptions', 'studyLocationOptions', 'collectionTypeOptions', 'collectionMethodOptions', diff --git a/app/mixins/file-upload.js b/app/mixins/file-upload.js new file mode 100644 index 0000000..d078638 --- /dev/null +++ b/app/mixins/file-upload.js @@ -0,0 +1,63 @@ +import Ember from 'ember'; + +const { Mixin, isArray } = Ember; +const { keys } = Object; + +// Portions borrowed from https://github.com/funtusov/ember-cli-form-data +// (that project has an MIT license listed, but no copyright holder explicitly identified) +export default Mixin.create({ + formDataTypes: ['POST', 'PUT', 'PATCH'], + + ajaxOptions(url, type, options) { + let data; + if (options && 'data' in options) { data = options.data; } + let hash = this._super.apply(this, arguments); + + if (typeof FormData !== 'undefined' && data && this.formDataTypes.indexOf(type) >= 0) { + hash.processData = false; + hash.contentType = false; + hash.data = this._getFormData(data); + } + return hash; + }, + + getFormFields(data) { + this._root = this._root || keys(data)[0]; + return data[this._root]; + }, + + getFormKey(key) { + return `${this._root}[${key}]`; + }, + + getFormValue(key, value) { + return value; + }, + + _getFormData(data) { + let formData = new FormData(); + const fields = this.getFormFields(data); + + keys(fields).forEach((key) => { + this._appendValue( + this.getFormValue(key, fields[key]), + this.getFormKey(key, fields[key]), + formData); + }); + return formData; + }, + + _appendValue(value, formKey, formData) { + if (isArray(value)) { + value.forEach((item) => { + this._appendValue(item, `${formKey}[]`, formData); + }); + } else if (value && value.constructor === Object) { + keys(value).forEach((key) => { + this._appendValue(value[key], `${formKey}[${key}]`, formData); + }); + } else if (typeof value !== 'undefined'){ + formData.append(formKey, value === null ? '' : value); + } + }, +}); diff --git a/app/models/collection.js b/app/models/collection.js index ab4eac4..4056cd3 100644 --- a/app/models/collection.js +++ b/app/models/collection.js @@ -19,6 +19,7 @@ export default Model.extend({ adfgPermit: belongsTo('adfg-permit'), collectionSpecies: hasMany('collection-species'), + datasheets: hasMany('datasheet-attachment'), // computed species: computed.mapBy('collectionSpecies', 'species'), diff --git a/app/models/datasheet-attachment.js b/app/models/datasheet-attachment.js new file mode 100644 index 0000000..2c02202 --- /dev/null +++ b/app/models/datasheet-attachment.js @@ -0,0 +1,9 @@ +import DS from 'ember-data'; + +const { Model, attr, belongsTo } = DS; + +export default Model.extend({ + datasheet: attr('file'), + + collection: belongsTo('collection'), +}); diff --git a/app/routes/collections/detail.js b/app/routes/collections/detail.js index cff1611..11517f6 100644 --- a/app/routes/collections/detail.js +++ b/app/routes/collections/detail.js @@ -5,7 +5,9 @@ const { Route, RSVP } = Ember; export default Route.extend({ model(params) { return RSVP.all([ - this.get('store').findRecord('collection', params.collection_id) + this.get('store').findRecord('collection', params.collection_id, { + include: 'collection-species,datasheets', + }) ]); }, }); diff --git a/app/templates/collections/create.hbs b/app/templates/collections/create.hbs index 859ce4b..7705ee7 100644 --- a/app/templates/collections/create.hbs +++ b/app/templates/collections/create.hbs @@ -3,7 +3,8 @@ model=model validations=(hash collection=CollectionValidations - collectionSpecies=CollectionSpeciesValidations) + collectionSpecies=CollectionSpeciesValidations + datasheet=DatasheetValidations) options=options onSave=(action 'onSave') onCancel=(action 'onCancel') diff --git a/app/templates/collections/detail/edit.hbs b/app/templates/collections/detail/edit.hbs index 859ce4b..7705ee7 100644 --- a/app/templates/collections/detail/edit.hbs +++ b/app/templates/collections/detail/edit.hbs @@ -3,7 +3,8 @@ model=model validations=(hash collection=CollectionValidations - collectionSpecies=CollectionSpeciesValidations) + collectionSpecies=CollectionSpeciesValidations + datasheet=DatasheetValidations) options=options onSave=(action 'onSave') onCancel=(action 'onCancel') diff --git a/app/templates/components/collection/create-container.hbs b/app/templates/components/collection/create-container.hbs index 4a8ac9e..760be91 100644 --- a/app/templates/components/collection/create-container.hbs +++ b/app/templates/components/collection/create-container.hbs @@ -137,14 +137,51 @@ {{input value=cs.changeset.sex}} {{/validated-field}} - + {{action-button isDanger=true isXSmall=true label='X' onClick=(action 'deleteCollectionSpecies' cs)}} - + {{/each}} +
+
+
+ + + + + + + + + + {{#each changesets.hasMany.datasheets as |d|}} + + + + + {{/each}} + +
+ Attachments + {{action-button isSuccess=true isXSmall=true label='+' onClick=(action 'addDatasheet')}} +
FileDelete
+ {{#if d.model.isNew}} + {{#validated-field property='datasheet' changeset=d.changeset}} + + {{/validated-field}} + {{else}} + {{ d.model.datasheet }} + {{/if}} + + {{action-button isDanger=true isXSmall=true label='X' onClick=(action 'deleteDatasheet' d)}} +
+
+ +
+
{{f.save}} {{f.cancel}} {{/crud-form}} diff --git a/app/transforms/file.js b/app/transforms/file.js new file mode 100644 index 0000000..7224087 --- /dev/null +++ b/app/transforms/file.js @@ -0,0 +1,11 @@ +import DS from 'ember-data'; + +export default DS.Transform.extend({ + deserialize(serialized) { + return serialized; + }, + + serialize(deserialized) { + return deserialized; + } +}); diff --git a/app/validations/datasheet.js b/app/validations/datasheet.js new file mode 100644 index 0000000..e645d04 --- /dev/null +++ b/app/validations/datasheet.js @@ -0,0 +1,8 @@ +import { + validatePresence, +} from 'ember-changeset-validations/validators'; + +export default { + datasheet: validatePresence(true), + collection: validatePresence(true), +} diff --git a/tests/unit/transforms/file-test.js b/tests/unit/transforms/file-test.js new file mode 100644 index 0000000..fd68276 --- /dev/null +++ b/tests/unit/transforms/file-test.js @@ -0,0 +1,12 @@ +import { moduleFor, test } from 'ember-qunit'; + +moduleFor('transform:file', 'Unit | Transform | file', { + // Specify the other units that are required for this test. + // needs: ['serializer:foo'] +}); + +// Replace this with your real tests. +test('it exists', function(assert) { + let transform = this.subject(); + assert.ok(transform); +});