diff --git a/src/core/css/webcaosdb.css b/src/core/css/webcaosdb.css index 2d26538254923437d34b05dde3d02578d54a1a34..2816e3f7491d3ccedf71235882c223def9f19eb9 100644 --- a/src/core/css/webcaosdb.css +++ b/src/core/css/webcaosdb.css @@ -385,6 +385,10 @@ h5 { display: None; } +.caosdb-v-entity-being-edited .caosdb-v-hidden-property { + display: unset; +} + .caosdb-v-edit-drag { padding: 5px; } diff --git a/src/core/js/edit_mode.js b/src/core/js/edit_mode.js index 63b28b08a6c07d4c5b00795f5e9f87d1965e4031..792e0fc360001d8c42ccaccceb6258fc483ce6f0 100644 --- a/src/core/js/edit_mode.js +++ b/src/core/js/edit_mode.js @@ -1359,6 +1359,8 @@ var edit_mode = new function () { doc.firstElementChild.appendChild(newrecord.firstElementChild); // TODO I dunno whats wrong here: xml -> str -> xml ??? var x = await transformation.transformEntities(str2xml(xml2str(doc))); + console.log(x); + $(x[0]).addClass("caosdb-v-entity-being-edited"); return x[0]; } @@ -1618,6 +1620,8 @@ var edit_mode = new function () { app.entity = $(entity).clone(true)[0]; // remove preview stuff $(app.entity).find(".caosdb-preview-container").remove(); + // add class for styling the entity that's being edited + $(app.entity).addClass("caosdb-v-entity-being-edited"); edit_mode.smooth_replace(app.old, app.entity); edit_mode.add_save_button(app.entity, () => app.update(app.entity)); @@ -1897,7 +1901,9 @@ var edit_mode = new function () { this.create_new_entity = async function (role) { var empty_entity = str2xml('<Response><' + role + '/></Response>'); - return (await transformation.transformEntities(empty_entity))[0]; + var ent_element = await transformation.transformEntities(empty_entity); + $(ent_element).addClass("caosdb-v-entity-being-edited"); + return ent_element[0]; } this.remove_cancel_button = function (entity) { @@ -2097,4 +2103,4 @@ var edit_mode = new function () { */ $(document).ready(function () { edit_mode.init(); -}); \ No newline at end of file +}); diff --git a/src/core/js/ext_prop_display.js b/src/core/js/ext_prop_display.js index a9cdb8e5bfb8f3f43cb20f271f4d1b74b633ebca..a65399afb413e93e1a1737acd5544baacfc905f2 100644 --- a/src/core/js/ext_prop_display.js +++ b/src/core/js/ext_prop_display.js @@ -25,7 +25,7 @@ * @requires log (singleton from loglevel library) * @requires load_config (function from webcaosdb.js) */ -var prop_display = new function ($, getEntityName, getEntityRole, getPropertyElements, getPropertyName, getUserName, getUserRoles, logger, load_config, query) { +var prop_display = new function ($, edit_mode, getEntityName, getEntityRole, getPropertyElements, getPropertyName, getUserName, getUserRoles, logger, load_config, query) { /** * Return the property-display config file; `ext_prop_display.json` by @@ -46,12 +46,12 @@ var prop_display = new function ($, getEntityName, getEntityRole, getPropertyEle return conf; } - this._get_entities_in_view = function () { + this.getEntitiesInView = function () { // Use all entities, both in entity panel and in preview. - return $(".caosdb-entity-panel,.caosdb-entity-preview") + return $(".caosdb-entity-panel,.caosdb-entity-preview"); } - this._unhide_properties = function (entities, conf, allTypes) { + this.unhideProperties = function (entities, conf, allTypes) { const userName = getUserName(); const userRoles = getUserRoles(); @@ -137,23 +137,61 @@ var prop_display = new function ($, getEntityName, getEntityRole, getPropertyEle }; } - this._unhide_all_properties = function () { + this.unhideAllProperties = function () { // Just show all initially hidden properties $(".caosdb-v-hidden-property").removeClass("caosdb-v-hidden-property"); } + this._unhideAllPropertiesWrapper = function (original) { + // construct a function that wirst does the original work, then unhides + // all properties, then returns the original return values. + const result = function (entity) { + var original_return = undefined; + if (typeof original === "function") { + original_return = original(entity); + } + prop_display.unhideAllProperties(); + return original_return; + } + + return result; + } + + this._unhidePropertiesWrapper = function (original, conf, allTypes) { + // Same as above, but for when there actually may be something to hide + // (i.e., build variable is set and config is non-empty). + const result = function (entitiy) { + var original_return = undefined; + if (typeof original === "function") { + original_return = original(entitiy); + } + var entities = prop_display.getEntitiesInView(); + prop_display.unhideProperties(entities, conf, allTypes); + return original_return; + } + + return result; + } + this.init = async function () { const conf = await this.load_config(); if (("${BUILD_MODULE_EXT_PROPERTY_DISPLAY}" == "ENABLED") && Object.keys(conf).length > 0) { // There are properties to be hidden, so make this clear in HTML body $("body").attr("data-hidden-properties", "true") const allTypes = await this._getRecordTypes(conf); - var entities = this._get_entities_in_view(); - this._unhide_properties(entities, conf, allTypes); + var entities = this.getEntitiesInView(); + this.unhideProperties(entities, conf, allTypes); + edit_mode.app.onAfterShowResults = this._unhidePropertiesWrapper(edit_mode.app.onAfterShowResults, conf, allTypes); } else { - this._unhide_all_properties(); + this.unhideAllProperties(); + // also unhide properties when leaving the edit mode + // TODO(fspreck): We're lacking a proper state/event here in the + // edit mode, so do this on "init", since this is the state to which + // the state machine returns after either successfully saving an + // entity or canceling the edit. + edit_mode.app.onAfterShowResults = this._unhideAllPropertiesWrapper(edit_mode.app.onAfterShowResults); } } -}($, getEntityName, getEntityRole, getPropertyElements, getPropertyName, getUserName, getUserRoles, log.getLogger("ext_prop_display"), load_config, query); +}($, edit_mode, getEntityName, getEntityRole, getPropertyElements, getPropertyName, getUserName, getUserRoles, log.getLogger("ext_prop_display"), load_config, query); $(document).ready(() => caosdb_modules.register(prop_display));