Add chemical analysis image workflow

arches_for_science/media/css/project.css

@@ -729,8 +729,7 @@
 
 .afs-image-service-list-item {
     display: inline-flex;
-    flex-direction: column;
-    align-items: baseline;
+    align-items: center;
     padding-left: 5px;
 }
 

arches_for_science/media/js/views/components/plugins/add-chemical-analysis-images-workflow.js

@@ -0,0 +1,134 @@
+define([
+    'knockout',
+    'jquery',
+    'arches',
+    'viewmodels/workflow',
+    'viewmodels/alert',
+    'templates/views/components/plugins/add-chemical-analysis-images-workflow.htm',
+    'viewmodels/workflow-step',
+    'views/components/workflows/select-observation-step',
+    'views/components/workflows/add-chemical-analysis-images-workflow/add-chemical-analysis-images-image-step',
+    'views/components/workflows/add-chemical-analysis-images-workflow/add-chemical-analysis-images-final-step',
+], function(ko, $, arches, Workflow, AlertViewModel, analysisAreasWorkflowTemplate) {
+    return ko.components.register('add-chemical-analysis-images-workflow', {
+        viewModel: function(params) {
+            this.componentName = 'add-chemical-analysis-images-workflow';
+
+            this.stepConfig = [
+                {
+                    title: 'Project Info',
+                    name: 'select-project',  /* unique to workflow */
+                    required: true,
+                    informationboxdata: {
+                        heading: 'Workflow Goal: Record Locations and Regions of Interest',
+                        text: `
+                            Regions of interest are the areas on a physical object (whole object or sample) in which a measurement -- whether non-invasive or minimally invasive -- was performed.
+                            To be meaningful, you need to describe the location or region of a physical object that is being described/measured.
+                            This workflow will guide you through the steps to document the location of your regions of interest.
+                        `,
+                    },
+                    layoutSections: [
+                        {
+                            componentConfigs: [
+                                { 
+                                    componentName: 'select-observation-step',
+                                    uniqueInstanceName: 'select-observation', /* unique to step */
+                                    parameters: {
+                                        graphids: [
+                                            '615b11ee-c457-11e9-910c-a4d18cec433a', /* Observation */
+                                            '0b9235d9-ca85-11e9-9fa2-a4d18cec433a'/* Project */
+                                        ],  
+                                    },
+                                },
+                            ], 
+                        },
+                    ],
+                },
+                {
+                    title: 'Image',
+                    name: 'image-step', /* unique to workflow */
+                    required: true,
+                    informationboxdata: {
+                        heading: 'Image Services',
+                        text: `
+                            Image Services provide you with picture(s) of an object, often from multiple vantage points, that can be annotated to indicate the location or region of an observation. 
+                            If you wish, you can upload photographs and automatically create a new image service to document the location of your observations of an object.
+                        `,
+                    },
+                    lockableExternalSteps: ['select-project'],
+                    layoutSections: [
+                        {
+                            sectionTitle: 'Image Service',
+                            componentConfigs: [
+                                { 
+                                    componentName: 'add-chemical-analysis-images-image-step',
+                                    uniqueInstanceName: 'image-service-instance', /* unique to step */
+                                    tilesManaged: 'one',
+                                    parameters: {
+                                        graphid: '707cbd78-ca7a-11e9-990b-a4d18cec433a',  /* Digital Resources */
+                                        physicalThingResourceId: "['select-project']['select-observation']['phsyicalThingResourceId']",
+                                        observationResourceId: "['select-project']['select-observation']['observation']"
+                                    },
+                                },
+                            ], 
+                        },
+                    ],
+                },
+                {
+                    title: 'Summary',
+                    name: 'add-chemical-analysis-images-complete',  /* unique to workflow */
+                    description: 'Summary',
+                    layoutSections: [
+                        {
+                            componentConfigs: [
+                                { 
+                                    componentName: 'add-chemical-analysis-images-final-step',
+                                    uniqueInstanceName: 'add-chemical-analysis-images-final',
+                                    tilesManaged: 'none',
+                                    parameters: {
+                                        observationResourceId: "['select-project']['select-observation']['observation']",
+                                        relatedProjectData: "['select-project']['select-observation']",
+                                        imageStepData: "['image-step']['image-service-instance'][0]['data']",
+                                        digitalResourcesIds: "['image-step']['image-service-instance']['digitalResourcesIds']",
+                                        manifestResourceId: "['image-step']['image-service-instance']['manifestResourceId']",
+                                    },
+                                },
+                            ], 
+                        },
+                    ],
+                }
+            ];
+
+            Workflow.apply(this, [params]);
+
+            this.reverseWorkflowTransactions = function() {
+                const quitUrl = this.quitUrl;
+                return $.ajax({
+                    type: "POST",
+                    url: arches.urls.transaction_reverse(this.id())
+                }).then(function() {
+                    params.loading(false);
+                    window.location.href = quitUrl;
+                });
+            };
+
+            this.quitWorkflow = function(){
+                this.alert(
+                    new AlertViewModel(
+                        'ep-alert-red',
+                        'Are you sure you would like to delete this workflow?',
+                        'All data created during the course of this workflow will be deleted.',
+                        function(){}, //does nothing when canceled
+                        () => {
+                            params.loading('Cleaning up...');
+                            this.reverseWorkflowTransactions();
+                        },
+                    )
+                );
+            };
+
+            this.quitUrl = arches.urls.plugin('init-workflow');
+        },
+        template: analysisAreasWorkflowTemplate
+    });
+});

arches_for_science/media/js/views/components/workflows/add-chemical-analysis-images-workflow/add-chemical-analysis-images-final-step.js

@@ -0,0 +1,58 @@
+define([
+    'knockout',
+    'underscore',
+    'uuid',
+    'arches',
+    'views/components/workflows/summary-step',
+    'templates/views/components/workflows/add-chemical-analysis-images-workflow/add-chemical-analysis-images-final-step.htm',
+    'views/components/annotation-summary',
+], function(ko, _, uuid, arches, SummaryStep, addChemicalAnalysisImagesFinalStepTemplate) {
+
+    function viewModel(params) {
+        var self = this;
+        params.form.resourceId(params.relatedProjectData.observation);
+        self.relatedDigitalResources = ko.observableArray()
+        self.workflowDigitalResources = ko.observableArray()
+        self.workflowManifestResource = ko.observable()
+        self.digitalResourcesIds = params.digitalResourcesIds.digitalResourceInstancesIds;
+        self.manifestResourceId = params.manifestResourceId.ManifestResourceId;
+
+        SummaryStep.apply(this, [params]);
+
+        self.loading(true);
+
+        this.resourceData.subscribe(async function(val){
+            this.displayName = val['displayname'] || 'unnamed';
+            this.reportVals = {
+                projectName: {'name': 'Project', 'value': params.relatedProjectData.projectName, 'resourceid': params.relatedProjectData.project},
+                observationName: {'name': 'Observation', 'value': params.relatedProjectData.observationName, 'resourceid': params.relatedProjectData.observation},
+            };
+
+            await getWorkflowDigitalResources();
+            await getWorkflowManifestResource();
+
+            this.loading(false);
+        }, this);
+
+        this.getWorkflowResourceData = async function(resourceid) {
+            const response = await window.fetch(this.urls.api_resources(resourceid) + '?format=json&compact=false&v=beta')
+            return await response.json()
+        };
+
+        async function getWorkflowDigitalResources() {
+            self.workflowDigitalResources(await Promise.all(self.digitalResourcesIds.map( async function(resourceid){
+                return await self.getWorkflowResourceData(resourceid);
+            })));
+        };
+
+        async function getWorkflowManifestResource() {
+            self.workflowManifestResource(await self.getWorkflowResourceData(self.manifestResourceId))
+        };
+    }
+
+    ko.components.register('add-chemical-analysis-images-final-step', {
+        viewModel: viewModel,
+        template: addChemicalAnalysisImagesFinalStepTemplate
+    });
+    return viewModel;
+});