Skip to content

Commit

Permalink
web ui climate data explorer with added diagram end date selection
Browse files Browse the repository at this point in the history
  • Loading branch information
@swoellauer
swoellauer committed Oct 5, 2020
1 parent 9b6e9a0 commit c1e2741
Show file tree
Hide file tree
Showing 5 changed files with 195 additions and 17 deletions.
2 changes: 1 addition & 1 deletion src/tsdb/TsDB.java
View file
Original file line number Diff line number Diff line change
Expand Up @@ -33,7 +33,7 @@
public class TsDB implements AutoCloseable {
private static final Logger log = LogManager.getLogger();

public static final String tubedb_version = "1.17.1";
public static final String tubedb_version = "1.17.2";

/**
* map regionName -> Region
Expand Down
4 changes: 2 additions & 2 deletions tsdb_paths.ini
View file
Original file line number Diff line number Diff line change
Expand Up @@ -112,14 +112,14 @@ WEBFILES_PATH = C:/timeseriesdatabase_webFiles
#WEB_SERVER_PREFIX_BASE_URL =
#WEB_SERVER_PORT = 8080

JUST_ONE_REGION = BE
#JUST_ONE_REGION = BE
#JUST_ONE_REGION = BEf
#JUST_ONE_REGION = KI
#JUST_ONE_REGION = SA
#JUST_ONE_REGION = SA_OWN
#JUST_ONE_REGION = MM
#JUST_ONE_REGION = BA
#JUST_ONE_REGION = BALE
JUST_ONE_REGION = BALE
#JUST_ONE_REGION = BURGWALD
#JUST_ONE_REGION = CALDERN
#JUST_ONE_REGION = TREETALKER_TEST
Expand Down
23 changes: 23 additions & 0 deletions webcontent/visualisation_meta/visualisation_meta.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -256,3 +256,26 @@ tr:nth-child(even){background-color: rgba(132, 104, 76, 0.1);}
top: 2px;
right: 2px;
}

.time-box-table {
border-spacing: 0px;
border-collapse: collapse;

}
.time-box-table tr {
background-color: rgba(0, 0, 0, 0);
}

.time-box-table thead tr th {
text-decoration: underline;
font-weight: normal;
}

.time-box-table tbody tr td {
font-weight: normal;
text-align: center;
}

#time-from-row td:not(:first-child) {
border-bottom:1px solid black;
}
85 changes: 83 additions & 2 deletions webcontent/visualisation_meta/visualisation_meta.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -468,9 +468,66 @@ <h3>plots</h3>

<div :class="[ { just_hide: (timeHover || timeHoverStay)}]" class="state">{{timeText}}</div>

<div v-show="(timeHover || timeHoverStay)" style="position: absolute; top: 20px; left: 0px;" class="overlay_settings">
<table class="time-box-table">
<thead>
<tr>
<th></th>
<th>Year</th>
<th>Month</th>
<th>Day</th>
</tr>
</thead>
<tbody>
<tr id="time-from-row">
<td>From</td>
<td>
<select @focus="timeHoverStay = true" @blur="timeHoverStay = false" v-model="timeYear">
<option>*</option>
<option v-for="y in timeYears">{{y}}</option>
</select>
</td>
<td>
<select @focus="timeHoverStay = true" @blur="timeHoverStay = false" v-model="timeMonth" :class="[ { just_hide: timeYear === '*'}]">
<option>*</option>
<option v-for="m in timeMonths">{{m}}</option>
</select>
</td>
<td>
<select @focus="timeHoverStay = true" @blur="timeHoverStay = false" v-model="timeDay" :class="[ { just_hide: timeYear === '*' || timeMonth === '*'}]">
<option>*</option>
<option v-for="d in timeDays">{{d}}</option>
</select>
</td>
</tr>
<tr>
<td>To</td>
<td>
<select @focus="timeHoverStay = true" @blur="timeHoverStay = false" v-model="timeYearEnd">
<option></option>
<option v-for="y in timeYearEnds">{{y}}</option>
</select>
</td>
<td>
<select @focus="timeHoverStay = true" @blur="timeHoverStay = false" v-model="timeMonthEnd" :class="[ { just_hide: timeYearEnd === ''}]">
<option></option>
<option v-for="m in timeMonthEnds">{{m}}</option>
</select>
</td>
<td>
<select @focus="timeHoverStay = true" @blur="timeHoverStay = false" v-model="timeDayEnd" :class="[ { just_hide: timeYearEnd === '' || timeMonthEnd === ''}]">
<option></option>
<option v-for="d in timeDays">{{d}}</option>
</select>
</td>
</tr>
</tbody>
</table>
</div>

<div v-show="(timeHover || timeHoverStay)" style="position: absolute; top: 20px; left: 0px; white-space: nowrap;" class="overlay_settings">
<!--<div v-show="(timeHover || timeHoverStay)" style="position: absolute; top: 20px; left: 0px; white-space: nowrap;" class="overlay_settings">
<div style="display: inline-block;">
<b>from</b>
<div class="centered title">year</div>
<select @focus="timeHoverStay = true" @blur="timeHoverStay = false" v-model="timeYear">
<option>*</option>
Expand All @@ -493,7 +550,31 @@ <h3>plots</h3>
<option v-for="d in timeDays">{{d}}</option>
</select>
</div>
</div>
<br><b>to</b><br>
<div style="display: inline-block;">
<div class="centered title">year</div>
<select @focus="timeHoverStay = true" @blur="timeHoverStay = false" v-model="timeYear">
<option>*</option>
<option v-for="y in timeYears">{{y}}</option>
</select>
</div>
-
<div style="display: inline-block;">
<div class="centered title">month</div>
<select @focus="timeHoverStay = true" @blur="timeHoverStay = false" v-model="timeMonth" :class="[ { just_hide: timeYear === '*'}]">
<option>*</option>
<option v-for="m in timeMonths">{{m}}</option>
</select>
</div>
-
<div style="display: inline-block;">
<div class="centered title">day</div>
<select @focus="timeHoverStay = true" @blur="timeHoverStay = false" v-model="timeDay" :class="[ { just_hide: timeYear === '*' || timeMonth === '*'}]">
<option>*</option>
<option v-for="d in timeDays">{{d}}</option>
</select>
</div>
</div>-->
</div>

</div>
Expand Down
98 changes: 86 additions & 12 deletions webcontent/visualisation_meta/visualisation_meta.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -114,12 +114,15 @@ data: function () {
timeHover: false,
timeHoverStay: false,
timeYear: "*",
timeYearEnd: "",
timeYears: [2000],
timeMonths: ["jan","feb","mar","apr","may","jun","jul","aug","sep","oct","nov","dec"],
timeMonthsNumber: {"*":0, "jan":1, "feb":2, "mar":3, "apr":4, "may":5, "jun":6, "jul":7, "aug":8, "sep":9, "oct":10 ,"nov":11, "dec":12},
timeMonth: "*",
timeMonthEnd: "",
timeDays: ["1","2","3","4","5","6","7","8","9","10","11","12","13","14","15","16","17","18","19","20","21","22","23","24","25","26","27","28","29","30","31"],
timeDay: "*",
timeDayEnd: "",

qualityHover: false,
qualityHoverStay: false,
Expand Down Expand Up @@ -284,22 +287,64 @@ computed: {
}
return s;
},
timeParameters: function() {
timeParameters: function() {
var params = {};
if(this.timeYear === '*') {
if(this.groupViewYearRange === undefined) {
return {};
if(this.groupViewYearRange !== undefined) {
params.year = this.groupViewYearRange.start;
}
if(this.timeYearEnd === '') {
if(this.groupViewYearRange !== undefined) {
params.end_year = this.groupViewYearRange.end;
}
} else {
return {year: this.groupViewYearRange.start, end_year: this.groupViewYearRange.end};
params.end_year = this.timeYearEnd;
if(this.timeMonthEnd !== '') {
params.end_month = this.timeMonthsNumber[this.timeMonthEnd];
if(this.timeDayEnd !== '') {
params.end_day = this.timeDayEnd;
}
}
}
} else {
params.year = this.timeYear;
if(this.timeMonth === '*') {
if(this.timeYearEnd !== '') {
params.end_year = this.timeYearEnd;
if(this.timeMonthEnd !== '') {
params.end_month = this.timeMonthsNumber[this.timeMonthEnd];
if(this.timeDayEnd !== '') {
params.end_day = this.timeDayEnd;
}
}
}
} else {
params.month = this.timeMonthsNumber[this.timeMonth];
if(this.timeDay === '*') {
if(this.timeYearEnd !== '') {
params.end_year = this.timeYearEnd;
if(this.timeMonthEnd !== '') {
params.end_month = this.timeMonthsNumber[this.timeMonthEnd];
if(this.timeDayEnd !== '') {
params.end_day = this.timeDayEnd;
}
}
}
} else {
params.day = this.timeDay;
if(this.timeYearEnd !== '') {
params.end_year = this.timeYearEnd;
if(this.timeMonthEnd !== '') {
params.end_month = this.timeMonthsNumber[this.timeMonthEnd];
if(this.timeDayEnd !== '') {
params.end_day = this.timeDayEnd;
}
}
}
}
}
}
if(this.timeMonth === '*') {
return {year: this.timeYear};
}
if(this.timeDay === '*') {
return {year: this.timeYear, month: this.timeMonthsNumber[this.timeMonth]};
}
console.log("day "+this.timeDay);
return {year: this.timeYear, month: this.timeMonthsNumber[this.timeMonth], day: this.timeDay};
return params;
},
groupViewYearRange: function() {
if(this.groupID === '*') {
Expand Down Expand Up @@ -446,6 +491,27 @@ computed: {
}
return sensors;
},
timeYearEnds: function() {
if(this.timeYear === '*') {
return this.timeYears;
}
return this.timeYears.filter(y => y >= this.timeYear);
},
timeMonthEnds: function() {
if(this.timeYearEnd === '') {
return this.timeMonths;
}
if(this.timeYear === '*') {
return this.timeMonths;
}
if(this.timeYear !== this.timeYearEnd) {
return this.timeMonths;
}
if(this.timeMonth === '*') {
return this.timeMonths;
}
return this.timeMonths.filter(m => this.timeMonthsNumber[m] >= this.timeMonthsNumber[this.timeMonth]);
},
}, //end computed

mounted: function () {
Expand Down Expand Up @@ -582,7 +648,9 @@ methods: {
if(a.year !== b.year) return false;
if(a.end_year !== b.end_year) return false;
if(a.month !== b.month) return false;
if(a.end_month !== b.end_month) return false;
if(a.day !== b.day) return false;
if(a.end_day !== b.end_day) return false;
if(a.quality !== b.quality) return false;
if(a.interpolated !== b.interpolated) return false;
if(a.byYear !== b.byYear) return false;
Expand Down Expand Up @@ -650,9 +718,15 @@ methods: {
if(view.hasOwnProperty('month')) {
params.month = view.month;
}
if(view.hasOwnProperty('end_month')) {
params.end_month = view.end_month;
}
if(view.hasOwnProperty('day')) {
params.day = view.day;
}
if(view.hasOwnProperty('end_day')) {
params.end_day = view.end_day;
}
if(view.hasOwnProperty('value_min')) {
params.value_min = view.value_min;
}
Expand Down

0 comments on commit c1e2741

Please sign in to comment.