Skip to content

Commit

Permalink
Merge pull request #1812 from OpenEnergyPlatform/feature-enhance-oeox…
Browse files Browse the repository at this point in the history 
…-ui-and-fix-bugs

Enhance oeox UI and fix bugs
  • Loading branch information
@jh-RLI
jh-RLI authored Sep 3, 2024
2 parents dce821b + 0c71f79 commit d9795d1
Show file tree
Hide file tree
Showing 7 changed files with 109 additions and 41 deletions.
4 changes: 2 additions & 2 deletions oeo_ext/oeo_extended_store/oeox_template/oeo_ext_template_empty.owl
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,12 +5,12 @@
xmlns:owl="http://www.w3.org/2002/07/owl#"
xml:base="http://openenergy-platform.org/ontology/oeox"
xmlns="http://openenergy-platform.org/ontology/oeox#"
xmlns:x_1.1="http://purl.org/dc/elements/1.1/"
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:term="http://purl.org/dc/terms/">

<owl:Ontology rdf:about="http://openenergy-platform.org/ontology/oeox">
<owl:imports rdf:resource="http://openenergy-platform.org/ontology/oeo/releases/2.4.0/oeo-full.owl"/>
<x_1.1:description rdf:datatype="http://www.w3.org/2001/XMLSchema#string">The Open Energy Ontology Extended (OEOX) extends the Open Energy Ontology. It contains compositions of terms that are too specific for the OEO.</x_1.1:description>
<dc:description rdf:datatype="http://www.w3.org/2001/XMLSchema#string">The Open Energy Ontology Extended (OEOX) extends the Open Energy Ontology. It contains compositions of terms that are too specific for the OEO.</dc:description>
<term:license rdf:datatype="http://www.w3.org/2001/XMLSchema#string">http://creativecommons.org/publicdomain/zero/1.0/</term:license>
<term:title rdf:datatype="http://www.w3.org/2001/XMLSchema#string">Open Energy Ontology Extended (OEOX)</term:title>
</owl:Ontology>
Expand Down
106 changes: 75 additions & 31 deletions oeo_ext/templates/oeo_ext/partials/oeo-ext-plugin-ui.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,14 +8,13 @@ <h3>Result</h3>
</div>
</div>
<hr>
<form class="htmxFormComponent" id="oeo-ext-form" hx-post="{% url 'oeo_ext:oeo-ext-plugin-ui-create' %}" hx-target=".htmxComponent" hx-swap="outerHTML" class="needs-validation" novalidate>
<form class="htmxFormComponent" id="oeo-ext-form" hx-post="{% url 'oeo_ext:oeo-ext-plugin-ui-create' %}" hx-target=".htmxFormComponent" hx-swap="outerHTML" class="needs-validation" novalidate>
{% csrf_token %}

<div class="nominator-section mb-4">
<h3>Numerator</h3>
<div id="nominator-elements" class="mb-3">
<!-- Elements will be added here -->

</div>
<button type="button" class="btn btn-primary" hx-get="{% url 'oeo_ext:add_unit_element' %}" hx-target="#nominator-elements" hx-swap="beforeend">Add Numerator oeo-Unit</button>
</div>
Expand Down Expand Up @@ -47,6 +46,7 @@ <h3>Denominator</h3>

<button type="submit" class="btn btn-success">Save</button>
</form>

</div>

<script>
Expand Down Expand Up @@ -147,35 +147,79 @@ <h3>Denominator</h3>
// });
// });

// document.addEventListener('htmx:afterRequest', function (event) {
// if (event.detail.xhr.status === 400) {
// let response = JSON.parse(event.detail.xhr.responseText);
// if (!response.success) {
// for (const [field, message] of Object.entries(response.errors)) {
// let errorDiv = document.getElementById(`${field}_error`);
// if (errorDiv) {
// errorDiv.innerText = message;
// errorDiv.style.display = 'block';
// }
// let inputField = document.getElementById(field);
// if (inputField) {
// inputField.classList.add('is-invalid');
// }
// }
// }
// } else {
// // Clear previous errors if any
// let errorFields = document.querySelectorAll('.invalid-feedback');
// errorFields.forEach(function (field) {
// field.style.display = 'none';
// field.innerText = '';
// });
// let inputFields = document.querySelectorAll('.form-control');
// inputFields.forEach(function (field) {
// field.classList.remove('is-invalid');
// });
// }
// });
document.addEventListener('htmx:afterRequest', function (event) {
if (event.detail.xhr.status === 400) {
let response = JSON.parse(event.detail.xhr.responseText);

if (!response.success) {
// Clear previous errors
document.querySelectorAll('.invalid-feedback').forEach(errorDiv => {
errorDiv.innerText = '';
errorDiv.style.display = 'none';
});
document.querySelectorAll('.form-control').forEach(inputField => {
inputField.classList.remove('is-invalid');
});

// Handle nominator errors
response.errors.nominator_errors.forEach((nominatorError, index) => {
const nominatorElement = document.querySelectorAll(`#nominator-elements .unit-element`)[index];

if (nominatorElement && Object.keys(nominatorError).length > 0) {
Object.entries(nominatorError).forEach(([field, messages]) => {
let inputField = nominatorElement.querySelector(`.${field}`);
let errorDiv = inputField ? inputField.closest('.mb-2').querySelector('.invalid-feedback') : null;

if (errorDiv && messages.length > 0) {
errorDiv.innerText = messages.join(', ');
errorDiv.style.display = 'block';
}

if (inputField) {
inputField.classList.add('is-invalid');
}
});
}
});

// Handle denominator errors
response.errors.denominator_errors.forEach((denominatorError, index) => {
const denominatorElement = document.querySelectorAll(`#denominator-elements .unit-element`)[index];

if (denominatorElement && Object.keys(denominatorError).length > 0) {
Object.entries(denominatorError).forEach(([field, messages]) => {
let inputField = denominatorElement.querySelector(`.${field}`);
let errorDiv = inputField ? inputField.closest('.mb-2').querySelector('.invalid-feedback') : null;

if (errorDiv && messages.length > 0) {
errorDiv.innerText = messages.join(', ');
errorDiv.style.display = 'block';
}

if (inputField) {
inputField.classList.add('is-invalid');
}
});
}
});
}
} else {
// Clear previous errors if any
let errorFields = document.querySelectorAll('.invalid-feedback');
errorFields.forEach(function (field) {
field.style.display = 'none';
field.innerText = '';
});
let inputFields = document.querySelectorAll('.form-control');
inputFields.forEach(function (field) {
field.classList.remove('is-invalid');
});
}
});





initializeUnitElement(document); // Initialize existing elements
</script>
Expand Down
11 changes: 11 additions & 0 deletions oeo_ext/templates/oeo_ext/partials/success.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
<div id="success-message">
{% if response_data.success %}
<h2>{{ response_data.message }}</h2>
<p>Your new unit has been created successfully.</p>
<p><strong>New Composed Unit URI:</strong></p>
<p>{{ response_data.newComposedUnitURI }}</p>
{% else %}
<h2>{{ response_data.message }}</h2>
<p>{{ response_data.errors.error }}</p>
{% endif %}
</div>
4 changes: 2 additions & 2 deletions oeo_ext/utils.py
View file
Original file line number Diff line number Diff line change
Expand Up @@ -146,8 +146,8 @@ def get_new_iri(

# Generate the new IRI using the count + 1
new_counter = generate_id(existing_count + 1)
# Build URI of pattern: oeox-base:ConceptLike<ComposedUnit>#ConceptID
new_uri = URIRef(f"{base}{concept_type.value}/{id_prefix}{new_counter}")
# Build URI of pattern: oeox-base/ConceptID
new_uri = URIRef(f"{base}{id_prefix}{new_counter}")

return new_uri

Expand Down
15 changes: 12 additions & 3 deletions oeo_ext/views.py
View file
Original file line number Diff line number Diff line change
Expand Up @@ -59,14 +59,23 @@ def post(self, request):
# error is either dict with key:value or None
new_unit, error = create_new_unit(numerator=n, denominator=d)
if error:
response_data = error
# response_data = error
response_data = {
"success": False,
"message": "Form data is not valid!",
"errors": error,
}
else:
data["newComposedUnitURI"] = new_unit
response_data = data
return JsonResponse(response_data, status=200)
return render(
request,
"oeo_ext/partials/success.html",
{"response_data": response_data},
)
# return JsonResponse(response_data, status=200)
else:
errors = {
# "form": form,
"form_errors": form.errors,
"nominator_errors": [f.errors for f in nominator_forms],
"denominator_errors": [f.errors for f in denominator_forms],
Expand Down
5 changes: 4 additions & 1 deletion ontology/views.py
View file
Original file line number Diff line number Diff line change
Expand Up @@ -149,7 +149,10 @@ def get(
if ontology in [OPEN_ENERGY_ONTOLOGY_NAME]:
ontology_data = OEO_COMMON_DATA
elif ontology in [OEO_EXT_NAME]:
ontology_data = OEOX_COMMON_DATA
# ontology_data = OEOX_COMMON_DATA
ontology_data = get_common_data(
OEO_EXT_NAME, file=OEO_EXT_OWL_NAME, path=OEO_EXT_PATH
)

sub_classes = []
super_classes = []
Expand Down
5 changes: 3 additions & 2 deletions versions/changelogs/current.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,8 +2,8 @@

## Changes


- Enhance embargo area feature (UI & API) [(#1804)](https://github.com/OpenEnergyPlatform/oeplatform/pull/1804)

- Refactor code
- The REST API raises an error when creating a table with embargo period but false date time for start/end data
- Update the table creation http "put" endpoint to handle embargo periods
Expand All @@ -12,11 +12,12 @@

- Enhance the ontology pages, remove the modules page and fully rework the about page and oeo download capabilities. Additionally add the oeox and make its URIs available, also add more cases where a Http404 is raised to make [1807](https://github.com/OpenEnergyPlatform/oeplatform/pull/1807)


## Features

- Add the OEP-extended (oeo-ext) feature. It enables users to create new composed units (ontology classes) that extent the units available in the OEO. The feature is implemented as a plugin html form, it can be easily added to any Webpage of the oeplatform. [(#1680)](https://github.com/OpenEnergyPlatform/oeplatform/pull/1680)

- Add error message display to oeox-plugin view. [(#1812)](https://github.com/OpenEnergyPlatform/oeplatform/pull/1812)

## Bugs

## Documentation updates
Expand Down

0 comments on commit d9795d1

Please sign in to comment.