diff --git a/angular/src/app/components/modal-questionnaire-viewer/modal-questionnaire-viewer.component.ts b/angular/src/app/components/modal-questionnaire-viewer/modal-questionnaire-viewer.component.ts index d27ab96b..38715d31 100644 --- a/angular/src/app/components/modal-questionnaire-viewer/modal-questionnaire-viewer.component.ts +++ b/angular/src/app/components/modal-questionnaire-viewer/modal-questionnaire-viewer.component.ts @@ -19,7 +19,8 @@ export class ModalQuestionnaireViewerComponent implements OnInit { ngOnInit() { this.projectService.activeProject.subscribe((p) => { this.geoDataService.getFeatureAssetSource(this.feature, '/questionnaire.rq').subscribe((featureSource: any) => { - const questionnaire = QuestionnaireBuilder.renderQuestionnaire(featureSource); + const asset_path = this.geoDataService.getFeatureAssetSourcePath(this.feature); + const questionnaire = QuestionnaireBuilder.renderQuestionnaire(featureSource, asset_path); $('#questionnaire-view').after(questionnaire); // Insert new elements after }); }); diff --git a/angular/src/app/services/geo-data.service.ts b/angular/src/app/services/geo-data.service.ts index 61d9baed..508b7943 100644 --- a/angular/src/app/services/geo-data.service.ts +++ b/angular/src/app/services/geo-data.service.ts @@ -536,10 +536,31 @@ export class GeoDataService { }); } - getFeatureAssetSource(feature: Feature, optionalPath = null) { + /** + * Get the source path for a feature asset. + * + * @param feature - The feature for which to get the source path (assumes that there is a single asset). + * @param optionalPath - An optional additional path to append to the source path. + * @returns The source path for the feature asset. + */ + getFeatureAssetSourcePath(feature: Feature, optionalPath: string | null = null): string { const baseFeatureSource = this.envService.apiUrl + '/assets/' + feature.assets[0].path; - const featureSource = optionalPath ? baseFeatureSource + optionalPath : baseFeatureSource; - return this.http.get(featureSource, { headers: { 'content-type': 'application/json' } }); + const featureSourcePath = optionalPath ? baseFeatureSource + optionalPath : baseFeatureSource; + return featureSourcePath; + } + + /** + * Get the feature source + * + * Note: only supports json + * + * @param feature - The feature for which to get the source path (assumes that there is a single asset). + * @param optionalPath - An optional additional path to append to the source path. + * @returns The source path for the feature asset. + */ + getFeatureAssetSource(feature: Feature, optionalPath = null) { + const featureSourcePath = this.getFeatureAssetSourcePath(feature, optionalPath); + return this.http.get(featureSourcePath, { headers: { 'content-type': 'application/json' } }); } public get qmsSearchResults(): Observable> { diff --git a/angular/src/app/utils/questionnaireBuilder.ts b/angular/src/app/utils/questionnaireBuilder.ts index 2dbc1ce4..6c2d8ad0 100644 --- a/angular/src/app/utils/questionnaireBuilder.ts +++ b/angular/src/app/utils/questionnaireBuilder.ts @@ -560,7 +560,7 @@ QuestionnaireBuilder.ASSET_EMBEDDING_DEFAULT = true; QuestionnaireBuilder.ALLOW_BACK_DEFAULT = true; QuestionnaireBuilder.EDITABLE_DEFAULT = false; -QuestionnaireBuilder.renderQuestionnaire = function(questionnaire_json) { +QuestionnaireBuilder.renderQuestionnaire = function(questionnaire_json, asset_path) { /** Method to generate read only questionnaire for viewing in DesignSafe * * Takes a json object containing questionnaire structure and responses @@ -569,7 +569,7 @@ QuestionnaireBuilder.renderQuestionnaire = function(questionnaire_json) { * * **/ - const questionnaire = new Questionnaire(questionnaire_json); + const questionnaire = new Questionnaire(questionnaire_json, asset_path); if (questionnaire) { return questionnaire.renderView(); } }; @@ -583,10 +583,17 @@ class Questionnaire { MAP_ADDED_TO_PANEL; embedded_asset_map; embedded_asset_uuids; + asset_path; + + constructor(metadata, asset_path) { + - constructor(metadata) { - // add metadata const qnaire = this; + + // add base path to assets + qnaire.asset_path = asset_path + + // add metadata for (const property in metadata) { qnaire[property] = metadata[property]; } qnaire.num_questions = 0; @@ -901,7 +908,7 @@ class Question { parent_question; decline; responseStrings; - assetUuids; + assets; constructor( metadata, @@ -1075,24 +1082,16 @@ class Question { /** !!!!! This method will need to be updated to get embedded assets to work in designsafe !!!!! **/ addEmbeddedAssets(container) { const question = this; - - if (question.hasOwnProperty('assetUuids')) { - if (question.assetUuids) { - if (question.assetUuids.length) { - for (const uuid of question.assetUuids) { - // let asset = Assets.getAsset(uuid); - - // TODO modify this url path to work with DesingSafe - // let url = - // Parameters.deployment === 'live' - // ? 'https://rapid.apl.uw.edu' + asset.file_url - // : 'https://rapid2.apl.uw.edu' + asset.file_url; + if (question.hasOwnProperty('assets')) { + if (question.assets) { + if (question.assets.length) { + for (const asset of question.assets) { + const url = question.parent_template.asset_path + '/' + asset.filename; DOM.new({ tag: 'img', class: 'embeddedAssetViewImg', - // src: url, - src: 'https://google.com', + src: url, parent: container, children: [ { @@ -1610,7 +1609,7 @@ class SingleAnswer extends Question { * has been added * **/ - // question.addEmbeddedAssets(container) + question.addEmbeddedAssets(container) } } class MultiAnswer extends SingleAnswer { @@ -1727,7 +1726,7 @@ class MultiAnswer extends SingleAnswer { $(view).insertAfter($(option_element)); } - // question.addEmbeddedAssets(container) + question.addEmbeddedAssets(container) } getResponse(viewer_option) { @@ -2165,7 +2164,7 @@ class MultiText extends Question { i++; } - // question.addEmbeddedAssets(container) + question.addEmbeddedAssets(container) if (!question.is_sub_question) { $(view).appendTo($(container)); @@ -2400,7 +2399,7 @@ class NumberField extends Question { parent: item, }); - // question.addEmbeddedAssets(container) + question.addEmbeddedAssets(container) if (!question.is_sub_question) { $(view).appendTo($(container)); @@ -2737,7 +2736,7 @@ class LocationField extends Question { question.responseStrings[2] ); - // question.addEmbeddedAssets(container) + question.addEmbeddedAssets(container) } } class RangeAnswer extends Question { @@ -2990,7 +2989,7 @@ class RangeAnswer extends Question { 'optionSelected' ); - // question.addEmbeddedAssets(container) + question.addEmbeddedAssets(container) if (!question.is_sub_question) { $(view).appendTo($(container)); @@ -3296,7 +3295,7 @@ class Matrix extends Question { } } - // question.addEmbeddedAssets(container) + question.addEmbeddedAssets(container) $(view).appendTo(container); } @@ -3403,7 +3402,7 @@ class TextPage extends Question { const question = this; const view = $(this.read_only_view); $(view).find('p.questionNumber').html(question.scroll_label); - // question.addEmbeddedAssets(container) + question.addEmbeddedAssets(container) $(view).appendTo(container); } }