Skip to content

Commit ef68673

Browse files
committed
Added script to add static page to HCAT hub
1 parent 4b36134 commit ef68673

File tree

2 files changed

+362
-0
lines changed

2 files changed

+362
-0
lines changed
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
const fs = require('fs');
2+
3+
const pageContent = fs.readFileSync('./html/ref-assess-static.html', 'utf8');
4+
5+
db.setting.updateOne(
6+
{ key: 'hcat.Request_Assessment_Records' },
7+
{
8+
$set: {
9+
key: 'hcat.Request_Assessment_Records',
10+
value: pageContent.replaceAll('\n', '\r\n'),
11+
version: NumberLong(1)
12+
},
13+
$currentDate: {
14+
lastUpdated: true,
15+
dateCreated: true
16+
},
17+
},
18+
{ upsert: true }
19+
);
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,343 @@
1+
<style>
2+
.ref-assess-filters-list {
3+
max-height: 200px;
4+
overflow-y: scroll;
5+
}
6+
7+
.ref-assess-filters-list > div {
8+
cursor: pointer;
9+
}
10+
11+
.ref-assess-filters-list > div.disabled {
12+
cursor: default;
13+
}
14+
15+
.ref-assess-identify-text {
16+
font-family: 'Lato', sans-serif;
17+
font-size: 18px;
18+
}
19+
20+
.ref-assess-identify-card {
21+
transition: all cubic-bezier(0, 0, 0.15, 1) 250ms;
22+
}
23+
</style>
24+
<script type="text/javascript">
25+
var RequestAssessmentRecordsModel = function (mvgMapping, hutchGroups) {
26+
const self = this;
27+
28+
this.mvgs = Object.keys(mvgMapping);
29+
this.mvgSelected = ko.observableArray([]);
30+
this.climates = hutchGroups;
31+
this.climateSelected = ko.observableArray([]);
32+
this.deIdentify = ko.observable(false);
33+
this.privacyPolicy = ko.observable(false);
34+
this.isLoading = ko.observable(false);
35+
36+
this.isMvgSelected = function (filter) {
37+
return self.mvgSelected.indexOf(filter) > -1;
38+
};
39+
40+
this.isClimateSelected = function (filter) {
41+
return self.climateSelected.indexOf(filter) > -1;
42+
};
43+
44+
this.onMvgSelect = function (filter) {
45+
// Only allow for user interaction if we're not already loading a request
46+
if (!self.isLoading()) {
47+
if (self.isMvgSelected(filter)) {
48+
self.mvgSelected.remove(filter);
49+
} else {
50+
self.mvgSelected.push(filter);
51+
}
52+
}
53+
};
54+
55+
this.onClimateSelect = function (filter) {
56+
// Only allow for user interaction if we're not already loading a request
57+
if (!self.isLoading()) {
58+
if (self.isClimateSelected(filter)) {
59+
self.climateSelected.remove(filter);
60+
} else {
61+
self.climateSelected.push(filter);
62+
}
63+
}
64+
};
65+
66+
this.onRequestRecords = function () {
67+
// Update the loading flag
68+
self.isLoading(true);
69+
70+
const selectedMvgGroups = self
71+
.mvgSelected()
72+
.map((filter) => mvgMapping[filter]);
73+
const vegetationStructureGroups = Array.from(new Set(selectedMvgGroups));
74+
const climateGroups = self.climateSelected();
75+
76+
$.ajax('/referenceAssessment/requestRecords', {
77+
method: 'POST',
78+
data: JSON.stringify({
79+
vegetationStructureGroups,
80+
climateGroups,
81+
deIdentify: self.deIdentify(),
82+
}),
83+
contentType: 'application/json',
84+
success: ({ message }) => {
85+
if (message) bootbox.alert(message);
86+
setTimeout(window.location.replace('/hcat/bioActivity/list'), 3000);
87+
},
88+
error: ({ responseJSON }) => {
89+
if (responseJSON && responseJSON.message) {
90+
bootbox.alert(responseJSON.message);
91+
} else {
92+
bootbox.alert('An unknown error occurred, please try again later.');
93+
}
94+
self.isLoading(false);
95+
},
96+
});
97+
98+
console.log(
99+
vegetationStructureGroups,
100+
climateGroups,
101+
self.privacyPolicy(),
102+
self.deIdentify()
103+
);
104+
};
105+
};
106+
</script>
107+
<div class="container">
108+
<div class="row mt-4">
109+
<div class="col-12">
110+
<div class="f-flex flex-column h-100 p-3">
111+
<h2>Select your areas of expertise</h2>
112+
<h4 class="text-secondary">Major Vegetation Groups</h4>
113+
<p>
114+
For the Image Assessment task, we ask that you provide an ecosystem
115+
condition score for a suite of photographic images of different
116+
habitats allocated to you based on the Major Vegetation Groups and
117+
Hutchison geographic agro-climatic classifications that you nominate
118+
as being within your area of expertise. Scoring these images will
119+
enable your Site Condition Assessments to be calibrated with other
120+
participants.
121+
</p>
122+
<p>
123+
Please select all of the Major Vegetation Groups (MVG) and Hutchison
124+
geographic agro-climatic classifications in which you have expertise.
125+
</p>
126+
<p>
127+
After nominating your areas of expertise, please indicate if you would
128+
like your assessments to be de-identified and confirm you have read,
129+
understood, and accepted the privacy, IP and ethics arrangements for
130+
this project. These arrangements are included in the HCAT instructions
131+
manual accessible via the HCAT homepage.
132+
</p>
133+
<div class="d-flex justify-content-center w-100 mb-4">
134+
<img
135+
src="https://biocollect.ala.org.au/document/download/2024-03/mvgs.png"
136+
/>
137+
</div>
138+
<div class="d-flex flex-column card bg-white ref-assess-filters-list">
139+
<!-- ko foreach: mvgs -->
140+
<div
141+
data-bind="click: $parent.onMvgSelect, css: { disabled: $parent.isLoading() }"
142+
class="d-flex flex-row dropdown-item align-items-center"
143+
>
144+
<span
145+
data-bind="style: { opacity: $parent.isMvgSelected($data) ? 1 : 0 }"
146+
class="fa fa-check mr-3"
147+
></span>
148+
<p
149+
data-bind="text: $data"
150+
style="text-wrap: wrap; margin-bottom: 0px"
151+
></p>
152+
</div>
153+
<!-- /ko -->
154+
</div>
155+
<h4 class="text-secondary mt-4">Agro-climatic Classifications</h4>
156+
<div class="d-flex justify-content-center w-100 mb-4">
157+
<img
158+
width="375"
159+
src="https://biocollect.ala.org.au/document/download/2024-03/agroclimate.png"
160+
/>
161+
</div>
162+
<div class="d-flex flex-column card bg-white ref-assess-filters-list">
163+
<!-- ko foreach: climates -->
164+
<div
165+
data-bind="click: $parent.onClimateSelect, css: { disabled: $parent.isLoading() }"
166+
class="d-flex flex-row dropdown-item align-items-center"
167+
>
168+
<span
169+
data-bind="style: { opacity: $parent.isClimateSelected($data) ? 1 : 0 }"
170+
class="fa fa-check mr-3"
171+
></span>
172+
<p
173+
data-bind="text: $data"
174+
style="text-wrap: wrap; margin-bottom: 0px"
175+
></p>
176+
</div>
177+
<!-- /ko -->
178+
</div>
179+
</div>
180+
</div>
181+
</div>
182+
<div class="row">
183+
<div class="col-6">
184+
<div class="py-3 pl-3">
185+
<button
186+
type="button"
187+
data-bind="click: function() { deIdentify(false) }, css: { 'bg-secondary': !deIdentify() }, enable: !isLoading()"
188+
class="card w-100 d-flex flex-column px-4 py-3 ref-assess-identify-card"
189+
>
190+
<span
191+
data-bind="css: { 'text-white': !deIdentify() }"
192+
class="fa fa-user fa-2x"
193+
></span>
194+
<span
195+
data-bind="css: { 'text-white': !deIdentify() }"
196+
class="mt-3 ref-assess-identify-text"
197+
>Identify my data</span
198+
>
199+
</button>
200+
</div>
201+
</div>
202+
<div class="col-6">
203+
<div class="py-3 pr-3">
204+
<button
205+
type="button"
206+
data-bind="click: function() { deIdentify(true) }, css: { 'bg-secondary': deIdentify() }, enable: !isLoading()"
207+
class="card w-100 d-flex flex-column px-4 py-3 ref-assess-identify-card"
208+
>
209+
<span
210+
data-bind="css: { 'text-white': deIdentify() }"
211+
class="fa fa-user-secret fa-2x"
212+
></span>
213+
<span
214+
data-bind="css: { 'text-white': deIdentify() }"
215+
class="mt-3 ref-assess-identify-text"
216+
>De-identify my data</span
217+
>
218+
</button>
219+
</div>
220+
</div>
221+
</div>
222+
<div class="row">
223+
<div class="col-12">
224+
<div class="px-3 mt-2">
225+
<p class="text-secondary" data-bind="if: deIdentify()">
226+
Only members of the HCAT project team will be able to see your name
227+
associated with the condition assessments you provide. When HCAT data
228+
is included in publicly available material (e.g. publications,
229+
reports, presentations, or data repositories) your contributions will
230+
be anonymised. Your Image Aassessments will not be made public
231+
regardless of your selection - they are used for calibration purposes
232+
only
233+
</p>
234+
<p class="text-secondary" data-bind="ifnot: deIdentify()">
235+
Your individual Site Condition Assessments will be credited in
236+
publicly available material. Your Image Aassessments will not be made
237+
public regardless of your selection - they are used for calibration
238+
purposes only
239+
</p>
240+
</div>
241+
</div>
242+
</div>
243+
<div class="row">
244+
<div class="col-12">
245+
<hr />
246+
<div class="px-4 mt-3">
247+
<input
248+
type="checkbox"
249+
class="form-check-input"
250+
data-bind="checked:privacyPolicy"
251+
/>
252+
<label>
253+
<small>
254+
I agree to be a part of this project and have read, understood and
255+
accept the privacy, IP and ethics arrangements for this project.
256+
These arrangements are included in the HCAT instructions manual
257+
accessible via the HCAT homepage.</small
258+
>
259+
</label>
260+
</div>
261+
</div>
262+
</div>
263+
<div class="row">
264+
<div class="col-12 pt-2">
265+
<div class="d-flex justify-content-center p-3">
266+
<button
267+
data-bind="click: onRequestRecords, css: {disabled: mvgSelected().length === 0 || climateSelected().length === 0 || !privacyPolicy() || isLoading()}, enable: mvgSelected().length > 0 && climateSelected().length > 0 && !isLoading() && privacyPolicy()"
268+
class="btn btn-primary justify-self-end full-width"
269+
>
270+
<i data-bind="visible: !isLoading()" class="far fa-copy mr-2"></i>
271+
<span
272+
data-bind="visible: isLoading()"
273+
class="fa fa-spin fa-spinner mr-2"
274+
></span>
275+
Request Records
276+
</button>
277+
</div>
278+
</div>
279+
</div>
280+
<script type="text/javascript">
281+
const mvgMapping = {
282+
'1 - Rainforests and Vine Thickets':
283+
'G1 - Wet and closed forests and thickets',
284+
'2 - Eucalypt Tall Open Forests':
285+
'G1 - Wet and closed forests and thickets',
286+
'3 - Eucalypt Open Forests': 'G2 - Open forest and woodland',
287+
'4 - Eucalypt Low Open Forests': 'G2 - Open forest and woodland',
288+
'5 - Eucalypt Woodlands': 'G2 - Open forest and woodland',
289+
'6 - Acacia Forests and Woodlands': 'G2 - Open forest and woodland',
290+
'7 - Callitris Forests and Woodlands': 'G2 - Open forest and woodland',
291+
'8 - Casuarina Forests and Woodlands': 'G2 - Open forest and woodland',
292+
'9 - Melaleuca Forests and Woodlands': 'G2 - Open forest and woodland',
293+
'10 - Other Forests and Woodlands': 'G2 - Open forest and woodland',
294+
'11 - Eucalypt Open Woodlands': 'G2 - Open forest and woodland',
295+
'12 - Tropical Eucalypt Woodlands/Grasslands':
296+
'G2 - Open forest and woodland',
297+
'13 - Acacia Open Woodlands': 'G3 - Shrublands',
298+
'14 - Mallee Woodlands and Shrublands': 'G3 - Shrublands',
299+
'15 - Low Closed Forests and Tall Closed Shrublands': 'G3 - Shrublands',
300+
'16 - Acacia Shrublands': 'G3 - Shrublands',
301+
'17 - Other Shrublands': 'G3 - Shrublands',
302+
'18 - Heathlands': 'G3 - Shrublands',
303+
'19 - Tussock Grasslands': 'G4 - Grasslands',
304+
'20 - Hummock Grasslands': 'G4 - Grasslands',
305+
'21 - Other Grasslands, Herblands, Sedgelands and Rushlands':
306+
'G4 - Grasslands',
307+
'22 - Chenopod Shrublands, Samphire Shrublands and Forblands':
308+
'G4 - Grasslands',
309+
'23 - Mangroves': 'G3 - Shrublands',
310+
'27 - Naturally Bare - sand, rock, claypan, mudflat': 'G4 - Grasslands',
311+
'32 - Mallee Open Woodlands and Sparse Mallee Shrublands':
312+
'G3 - Shrublands',
313+
'99 - Unknown/No Data': 'G2 - Open forest and woodland',
314+
};
315+
316+
const hutchGroups = [
317+
'B1 - Very cold winters with summers too short for crop growth',
318+
'B2 - Less severe winters and longer moist summers suitable for some crops',
319+
'D5 - Moisture availability high in winter-spring, moderate in summer, most plant growth in spring',
320+
'E1 - Classic "Mediterranean" climate with peaks of growth in winter and spring and moderate growth in winter',
321+
'E2 - "Mediterranean" climate, but with drier cooler winters and less growth than E1',
322+
'E3 - Most plant growth in summer, although summers are moisture limiting. Temperature limits growth in winter',
323+
'E4 - Growth is limited by moisture rather than temperature and the winters are mild. Growth is relatively even through the year',
324+
'E6 - Semi-arid climate that is too dry to support field crops. Soil moisture tends to be greatest in winter',
325+
'E7 - Moisture is the main limit on crop growth. Growth index lowest in spring',
326+
'F3 - Cooler end of the warm, wet sub-tropical climates',
327+
'F4 - Warmer and wetter than F3',
328+
'G - Desert, supporting very little plant growth due to water limitation',
329+
'H - Semi-arid, with some growth in the warm season, but too dry for cropping',
330+
'I1 - Strongly developed wet and dry seasons with plant growth determined by moisture availability',
331+
'I2 - Temperature and moisture are more seasonal than for I1 and the growing season is shorter',
332+
'I3 - This has cooler winters than I1 and I2 with a growing season lasting at least six months',
333+
'J1 - Moisture and temperature regime supports growth for 8-9 months of the year, with a 3-4 month dry season',
334+
];
335+
336+
const requestAssessmentRecordsVM = new RequestAssessmentRecordsModel(
337+
mvgMapping,
338+
hutchGroups
339+
);
340+
341+
ko.applyBindings(requestAssessmentRecordsVM);
342+
</script>
343+
</div>

0 commit comments

Comments
 (0)