function advancedSearch() { return { gopen: false, bopen: false, dopen: false, copen: false, loading: false, submitDisabled: true, g: {}, b: {}, d: {}, c: {}, tagName(type, id) { if (type === 'b') { return this.b.find(i => i.id == id).label; } else if (type === 'c') { return this.c.find(i => i.id == id).code; } else if (type === 'g') { try { return this.g.find(i => i.id == id).label; } catch(err) { return; } } else if (type === 'd') { try { return this.d.find(i => i.id == id).code; } catch (err) { return; } } }, gid: null, bid: [], did: null, cid: [], date: {}, search() { generateRequest(this.did, this.cid, this.date.from, this.date.to, this.bid); }, // Triggers when an entry is selected from any of the dropdowns selectEntry(element, entry) { const selType = element.id.split('-')[1]; console.debug(selType); if (selType === 'group') { element.parentElement.querySelectorAll('a').forEach(el => el.classList.remove('is-active')); element.classList.add('is-active'); // update variables; this.bid = []; this.gid = entry; this.gopen = false; } else if (selType === 'body') { // toggle element.classList.toggle('is-active'); // update variables; this.bid.indexOf(entry) === -1 ? this.bid.push(entry) : this.bid = this.bid.filter(function(id) { return id !== entry}); this.bopen = false; // add tag } else if (selType === 'desc') { // highlight element.parentElement.querySelectorAll('a').forEach(el => el.classList.remove('is-active')); element.classList.add('is-active'); // update variables; this.cid = []; this.did = entry; console.debug(this.did); this.dopen = false; } else if (selType === 'crit') { // toggle element.classList.toggle('is-active'); // update variables; this.cid.indexOf(entry) === -1 ? this.cid.push(entry) : this.cid = this.cid.filter(function(id) { return id !== entry}); this.copen = false; // add tag } this.submitDisabled = !(this.bid.length > 0 && this.cid.length > 0); }, getDropdownData(dropdown) { this.loading = true; let url = BASE_URL; switch(dropdown) { case 'g': url += '/interface/dropdowns/watergroups'; break; case 'b': url += '/interface/dropdowns/waterbodies?group_id=' + this.gid; break; case 'd': url += '/interface/dropdowns/descriptors?body_id=' + this.bid; break; case 'c': url += '/interface/dropdowns/criterias?desc_id=' + this.did; break; } fetch(url) .then(res => res.json()) .then(data => { this.isLoading = false; eval('this.' + dropdown + '=data'); console.debug(data); }); }, loadCal() { const calendars = bulmaCalendar.attach('[type=date]', {dateFormat: 'dd/MM/yyyy', isRange: true, minDate: '01/01/1990'}); // Loop on each calendar initialized calendars.forEach(calendar => { calendar.on('save', data => { this.date = { from: calendar.startDate.toLocaleDateString(), to: calendar.endDate.toLocaleDateString() } }); }); } }; } function refreshRequestGrid() { requestsGrid.forceRender(); } function downloadOneFile(fileUUID) { const url = BASE_URL + '/actions/data/download?uuid=' + fileUUID; fetch(url,{ "credentials": "include", "headers": { "Accept": "application/zip", "Accept-Language": "en-US,en;q=0.5", "Sec-Fetch-Dest": "empty", "Sec-Fetch-Mode": "cors", "Pragma": "no-cache", "Cache-Control": "no-cache" }, "method": "GET", "mode": "cors"} ) .then(res => { return res.blob(); }) .then(data => { var a = document.createElement("a"); a.href = window.URL.createObjectURL(data); a.download = fileUUID; a.click(); }); } /** * Submit a request to the server and returns the entry inserted * @param {number} desc * @param {number} crit * @return {json} */ function generateRequest(desc, crit, from, to, bodyId=null) { console.debug('requesting data'); const url = BASE_URL + `/actions/data/search?bodyId=${bodyId}&dateFrom=${from}&dateTo=${to}&critId=${crit}`; fetch(url) .then(res => { return res.json(); }).then(data => { db.requests.add({ uuid: data.uuid, parameters: data.parameters, status: data.status }).then(d => { alert('Request complete. Check the request tab'); requestsGrid.forceRender(); }); }); } /** * Function to request data for a specific entity such as station or cruise * @param {number} desc - The descriptor id * @param {number} crit - The criteria id * @param {string} from - The start date for which the data is to be requested * @param {string} to - The end date for which the data is to be requested * @param {string} entityGroup - The entity group (e.g. cruise station, argo, wfd station) * @param {string} entityId - The entity feature id (e.g. station id) * @return {null} */ function requestEntityData(desc, crit, from, to, entityGroup, entityId) { const url = BASE_URL + `/actions/data/search?entityGroup=${entityGroup}&entityId=${entityId}&dateFrom=${from}&dateTo=${to}&critId=${crit}`; fetch(url) .then(res => { return res.json(); }).then(data => { db.requests.add({ uuid: data.uuid, parameters: data.parameters, status: data.status }).then(d => { alert('Request complete. Check the request tab'); requestsGrid.forceRender(); }); }); } /** * Function to request data for a specific entity that has an external source * @param {number} desc - The descriptor id * @param {number} crit - The criteria id * @param {string} from - The start date for which the data is to be requested * @param {string} to - The end date for which the data is to be requested * @param {string} entityGroup - The entity group (e.g. cruise station, argo, wfd station) * @param {string} entityId - The entity feature id (e.g. station id) * @return {null} */ function requestExternalData(desc, crit, from, to, entityGroup, entityId) { console.debug('requesting external data'); const url = BASE_URL + `/src/data/request_external_data.php?entityGroup=${entityGroup}&entityId=${entityId}&dateFrom=${from}&dateTo=${to}&critId=${crit}`; fetch(url) .then(res => { return res.blob(); }).then(data => { const url = window.URL.createObjectURL(data); const a = document.createElement('a'); a.href = url; a.download = `external_data-${entityId}.json`; a.click(); }); } function clearRequests() { let url = BASE_URL + `/actions/requests/`; if (confirm('Clear requests list?')) { fetch(url, { method: 'DELETE' }) .then(response => { if (response.ok) requestsGrid.forceRender(); }); } else { console.log('Cancel'); } } // function moreInfo() { // return { // entityGroup: selectedEntityGroup, // entityId: selectedEntityId || Alpine.store('entity').id, // dopen: false, // copen: false, // loading: false, // isGrid: Alpine.store('entity').hasOwnProperty('cellcode'), // d: {}, // c: {}, // tagName(type, id) { // if (id == null) // return; // if (type === 'd') { // return this.d.find(i => i.id == id).code; // } else if (type === 'c') { // return this.c.find(i => i.id == id).code; // } // }, // did: null, // cid: [], // date: {}, // search() { // this.drawDataChart(); // // check if entity has an external source // if (this.$store.entity.hasOwnProperty('ctStationCode')) { // requestExternalData(this.did, this.cid, this.date.from, this.date.to, this.entityGroup, this.entityId); // } else { // requestEntityData(this.did, this.cid, this.date.from, this.date.to, this.entityGroup, this.entityId); // } // }, // selectEntry(element, entry) { // console.debug(element.text.substr(0, element.text.indexOf(' '))); // if (element.id.split('-')[1] === 'desc') { // // highlight // element.parentElement.querySelectorAll('a').forEach(el => el.classList.remove('is-active')); // element.classList.add('is-active'); // // update variables; // this.cid = []; // this.did = entry; // this.dopen = false; // } else if (element.id.split('-')[1] === 'crit') { // // toggle // element.classList.toggle('is-active'); // // update variables; // this.cid.indexOf(entry) === -1 ? this.cid.push(entry) : this.cid = this.cid.filter(function(id) { return id !== entry}); // this.copen = false; // // add tag // } // }, // getDropdownData(dropdown) { // this.loading = true; // let url = BASE_URL; // let gridCode; // if (this.isGrid) { // gridCode = Alpine.store('entity').cellcode.substr(0,4); // } // // switch(dropdown) { // case 'd': // url += '/interface/dropdowns/descriptors?entity_id=' + this.entityId + '&cellcode=' + gridCode; // break; // case 'c': // url += '/interface/dropdowns/criterias?desc_id=' + this.did + '&cellcode=' + gridCode; // break; // } // // fetch(url) // .then(res => res.json()) // .then(data => { // this.isLoading = false; // eval('this.' + dropdown + '=data'); // }); // }, // loadCal() { // const calendars = bulmaCalendar.attach('[type=date]', {dateFormat: 'dd/MM/yyyy', isRange: true}); // // Loop on each calendar initialized // calendars.forEach(calendar => { // calendar.on('save', data => { // this.date = { // from: calendar.startDate.toLocaleDateString(), // to: calendar.endDate.toLocaleDateString() // } // }); // }); // }, // populateFeatureGrid(grid) { // const features = Alpine.store('entity'); // console.debug(features); // const featureCols = Object.getOwnPropertyNames(Alpine.store('entity')).filter(name => aliasMap.has(name)); // const featureVals = featureCols.map(col => {return {feature: aliasMap.get(col), value: features[col]}}); // console.debug(featureVals); // new gridjs.Grid({ // data: featureVals // }).render(grid); // }, // drawDataChart() { // if (this.entityGroup != 'POSEIDON') // return; // const url = `/data/external/POSEIDON/${Alpine.store('entity').tspr}_${Alpine.store('entity').type}_${Alpine.store('entity').pid}`; // fetch(url) // .then(res => res.json()) // .then(data => { // this.isLoading = false; // console.debug(data); // }); // // const config = { // type: 'line', // data: data, // options: { // responsive: true, // plugins: { // legend: { // position: 'top', // }, // title: { // display: true, // text: 'Chart.js Line Chart' // } // } // }, // }; // } // }; // } // function mruInfo() { // return { // dopen: false, // copen: false, // loading: false, // d: {}, // c: {}, // tagName(type, id) { // if (id == null) // return; // if (type === 'd') { // return this.d.find(i => i.id == id).code; // } else if (type === 'c') { // return this.c.find(i => i.id == id).code; // } // }, // bid: Alpine.store('mru').objectid, // did: null, // cid: [], // date: {}, // search() { // generateRequest(this.did, this.cid, this.date.from, this.date.to, this.bid); // }, // selectEntry(element, entry) { // console.debug(element.text.substr(0, element.text.indexOf(' '))); // if (element.id.split('-')[1] === 'desc') { // // highlight // element.parentElement.querySelectorAll('a').forEach(el => el.classList.remove('is-active')); // element.classList.add('is-active'); // // update variables; // this.cid = []; // this.did = entry; // this.dopen = false; // } else if (element.id.split('-')[1] === 'crit') { // // toggle // element.classList.toggle('is-active'); // // update variables; // this.cid.indexOf(entry) === -1 ? this.cid.push(entry) : this.cid = this.cid.filter(function(id) { return id !== entry}); // this.copen = false; // // add tag // } // }, // getDropdownData(dropdown) { // this.loading = true; // let url = BASE_URL; // switch(dropdown) { // case 'd': // url += '/interface/dropdowns/descriptors?body_id=' + this.bid; // break; // case 'c': // url += '/interface/dropdowns/criterias?desc_id=' + this.did; // break; // } // fetch(url) // .then(res => res.json()) // .then(data => { // this.isLoading = false; // eval('this.' + dropdown + '=data'); // }); // }, // loadCal() { // const calendars = bulmaCalendar.attach('[type=date]', {dateFormat: 'dd/MM/yyyy', isRange: true}); // // Loop on each calendar initialized // calendars.forEach(calendar => { // calendar.on('save', data => { // this.date = { // from: calendar.startDate.toLocaleDateString(), // to: calendar.endDate.toLocaleDateString() // } // }); // }); // }, // populateFeatureGrid(grid) { // console.debug(grid); // const features = Alpine.store('mru'); // const featureCols = Object.getOwnPropertyNames(Alpine.store('mru')).filter(name => aliasMap.has(name)); // const featureVals = featureCols.map(col => {return {feature: aliasMap.get(col), value: features[col]}}); // console.debug(featureVals); // new gridjs.Grid({ // data: featureVals // }).render(grid); // } // }; // }