Skip to content

Commit 9ac5ca9

Browse files
committed
Render references in the Attribute Editor
Issue #2652
1 parent 98214de commit 9ac5ca9

File tree

6 files changed

+316
-77
lines changed

6 files changed

+316
-77
lines changed

src/css/metacatui-common.css

Lines changed: 22 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -44,6 +44,13 @@ a:hover {
4444
text-shadow: none;
4545
font-weight: normal;
4646
}
47+
.label {
48+
text-shadow: none;
49+
letter-spacing: 0.04em;
50+
padding: 2px 6px;
51+
border-radius: 4px;
52+
opacity: 0.95;
53+
}
4754
.danger,
4855
.error {
4956
color: #dc0000;
@@ -178,7 +185,12 @@ footer {
178185
/** Keeps the footer down **/
179186
min-height: 100%;
180187
}
181-
188+
.right-aligned-flex-container {
189+
display: flex;
190+
margin-top: 1rem;
191+
flex-direction: column;
192+
align-items: flex-end;
193+
}
182194
/******************************************
183195
** Navigation ***
184196
******************************************/
@@ -321,6 +333,11 @@ header .citation {
321333
#Content > .login > .alert-container {
322334
font-size: inherit;
323335
}
336+
.button-help-text {
337+
font-size: 12px;
338+
margin-top: 2px;
339+
color: #555;
340+
}
324341

325342
/******************************************
326343
** Download Buttons ***
@@ -9054,11 +9071,6 @@ textarea.medium {
90549071
margin-bottom: 0.8rem;
90559072
}
90569073

9057-
.autofill-attributes__button-container {
9058-
display: flex;
9059-
justify-content: end;
9060-
margin-top: 1rem;
9061-
}
90629074
.tab-content {
90639075
margin-top: 1rem;
90649076
}
@@ -9082,6 +9094,10 @@ textarea.medium {
90829094
}
90839095
}
90849096

9097+
.references-panel {
9098+
padding: 1rem;
9099+
}
9100+
90859101
/*******************************************
90869102
Pager View
90879103
******************************************/

src/js/models/metadata/eml211/EMLReferences.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -71,7 +71,7 @@ define(["jquery", "backbone"], ($, Backbone) => {
7171
* @returns {EML} - The parent EML model.
7272
*/
7373
getParentEML() {
74-
return this.get("parentEML") || this.get("parentModel").getParentEML();
74+
return this.get("parentEML") || this.get("parentModel")?.getParentEML();
7575
},
7676

7777
/**

src/js/views/metadata/AutofillAttributesView.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,7 @@ define([
2222
// Class names used in this view
2323
const CLASS_NAMES = {
2424
view: "autofill-attributes",
25-
buttonContainer: "autofill-attributes__button-container",
25+
buttonContainer: "right-aligned-flex-container",
2626
tabDynamicContent: "autofill-attributes_tab-dynamic-content",
2727
notificationContainer: "autofill-attributes__notification",
2828
checkboxeContainer: "autofill-attributes__checkbox-list",

src/js/views/metadata/EML211EditorView.js

Lines changed: 78 additions & 52 deletions
Original file line numberDiff line numberDiff line change
@@ -853,7 +853,6 @@ define([
853853

854854
// Set a beforeunload event only if there isn't one already
855855
if (!this.beforeunloadCallback) {
856-
const view = this;
857856
// When the Window is about to be closed, show a confirmation message
858857
this.beforeunloadCallback = (e) => {
859858
if (!view.canClose()) {
@@ -1103,71 +1102,98 @@ define([
11031102
*/
11041103
showEntity(e) {
11051104
if (!e || !e.target) return;
1105+
if (this.model.type !== "EML") return;
11061106

1107-
// For EML metadata docs
1108-
if (this.model.type === "EML") {
1109-
// Get the Entity View
1110-
const row = $(e.target).parents(".data-package-item");
1111-
let entityView = row.data("entityView");
1112-
const dataONEObject = row.data("model");
1107+
// Get the Entity View
1108+
const row = $(e.target).parents(".data-package-item");
1109+
let entityView = row.data("entityView");
1110+
const dataONEObject = row.data("model");
11131111

1114-
if (
1115-
dataONEObject.get("uploadStatus") === "p" ||
1116-
dataONEObject.get("uploadStatus") === "l" ||
1117-
dataONEObject.get("uploadStatus") === "e"
1118-
)
1119-
return;
1120-
1121-
// If there isn't a view yet, create one
1122-
if (!entityView) {
1123-
// Get the entity model for this data package item
1124-
let entityModel = this.model.getEntity(row.data("model"));
1125-
1126-
// Create a new EMLOtherEntity if it doesn't exist
1127-
if (!entityModel) {
1128-
entityModel = new EMLOtherEntity({
1129-
entityName: dataONEObject.get("fileName"),
1130-
entityType:
1131-
dataONEObject.get("formatId") ||
1132-
dataONEObject.get("mediaType"),
1133-
parentModel: this.model,
1134-
xmlID: dataONEObject.getXMLSafeID(),
1135-
});
1112+
if (
1113+
dataONEObject.get("uploadStatus") === "p" ||
1114+
dataONEObject.get("uploadStatus") === "l" ||
1115+
dataONEObject.get("uploadStatus") === "e"
1116+
)
1117+
return;
11361118

1137-
if (!dataONEObject.get("fileName")) {
1138-
// Listen to changes to required fields on the otherEntity
1139-
// models
1140-
this.listenTo(entityModel, "change:entityName", () => {
1141-
if (!entityModel.isValid()) return;
1119+
// If there isn't a view yet, create one
1120+
if (!entityView) {
1121+
// Get the entity model for this data package item
1122+
let entityModel = this.model.getEntity(row.data("model"));
1123+
1124+
// Create a new EMLOtherEntity if it doesn't exist
1125+
if (!entityModel) {
1126+
entityModel = new EMLOtherEntity({
1127+
entityName: dataONEObject.get("fileName"),
1128+
entityType:
1129+
dataONEObject.get("formatId") || dataONEObject.get("mediaType"),
1130+
parentModel: this.model,
1131+
xmlID: dataONEObject.getXMLSafeID(),
1132+
});
11421133

1143-
// Get the position this entity will be in
1144-
const position = $(".data-package-item.data").index(row);
1134+
if (!dataONEObject.get("fileName")) {
1135+
// Listen to changes to required fields on the otherEntity
1136+
// models
1137+
this.listenTo(entityModel, "change:entityName", () => {
1138+
if (!entityModel.isValid()) return;
11451139

1146-
this.model.addEntity(entityModel, position);
1147-
});
1148-
} else {
11491140
// Get the position this entity will be in
11501141
const position = $(".data-package-item.data").index(row);
11511142

11521143
this.model.addEntity(entityModel, position);
1153-
}
1154-
} else {
1155-
entityView = new EMLEntityView({
1156-
model: entityModel,
1157-
DataONEObject: dataONEObject,
1158-
edit: true,
11591144
});
1145+
} else {
1146+
// Get the position this entity will be in
1147+
const position = $(".data-package-item.data").index(row);
1148+
1149+
this.model.addEntity(entityModel, position);
11601150
}
1151+
} else {
1152+
entityView = new EMLEntityView({
1153+
model: entityModel,
1154+
DataONEObject: dataONEObject,
1155+
edit: true,
1156+
parentView: this,
1157+
});
1158+
}
11611159

1162-
// Attach the view to the edit button so we can access it again
1163-
row.data("entityView", entityView);
1160+
// Attach the view to the edit button so we can access it again
1161+
row.data("entityView", entityView);
11641162

1165-
// Render the view
1166-
entityView.render();
1167-
}
1163+
// Render the view
1164+
entityView.render();
1165+
}
11681166

1169-
// Show the modal window editor for this entity
1170-
if (entityView) entityView.show();
1167+
// Show the modal window editor for this entity
1168+
if (entityView) entityView.show();
1169+
},
1170+
1171+
/**
1172+
* Show the entity editor for a model
1173+
* @param {EMLEntity|EMLOtherEntity} model - The model to show
1174+
* @param {boolean} [switchToAttrTab] - Set to true to automatically
1175+
* switch to the attributes tab instead of default overview tab
1176+
* @since 0.0.0
1177+
*/
1178+
showEntityFromModel(model, switchToAttrTab = false) {
1179+
const pid = model.get("dataONEObject").get("id");
1180+
const rows = this.$(".data-package-item");
1181+
const row = rows.filter((i, el) => {
1182+
const rowModel = $(el).data("model");
1183+
const rowId = $(el).data("id");
1184+
return rowId === pid || rowModel === model;
1185+
});
1186+
if (row.length) {
1187+
// Get button to mock a click event which calls showEntity(e)
1188+
const button = row.find("button.edit");
1189+
if (button?.length) {
1190+
button.click();
1191+
if (switchToAttrTab) {
1192+
setTimeout(() => {
1193+
row.data("entityView")?.showAttributesTab();
1194+
}, 100);
1195+
}
1196+
}
11711197
}
11721198
},
11731199

0 commit comments

Comments
 (0)