tvolkmann/travopti
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Improve wording

Browse Source
This commit is contained in:
Patrick Gebhardt 2020-06-25 00:16:43 +02:00
parent 2077aeebf8
commit 24ad736091
9 changed files with 168 additions and 59 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
frontend/src/app/components/multi-tag-select/multi-tag-select.component.html
View File

@ -1,5 +1,5 @@
<mat-chip-list>
<!--suppress AngularInvalidExpressionResultType -->
<mat-chip (click)="onChipClick(tag)" *ngFor="let tag of availableTags" [color]="isSelected(tag) ? 'accent' : 'none'"
selected>{{tag}}</mat-chip>
selected>{{tag|translate}}</mat-chip>
</mat-chip-list>

3
frontend/src/app/components/result/result.component.html
View File

@ -17,6 +17,7 @@
</div>
<mat-divider *ngIf="result.scores.length > 0"></mat-divider>
<div class="searched-params">
<div class="result-desc">Estimated values for your chosen travel dates</div>
<table>
<tr *ngFor="let score of result.scores" [ngClass]="{'undefined': score.value == undefined}">
<td>
@ -27,7 +28,7 @@
</td>
<td>
<div class="cell right">
<span>{{score.value != undefined ? (score.value|number:'1.2-2') : 'N/A'}}</span>
<span>{{score.value != undefined ? (score.value|number:PROPERTY_VIS_DEF[score.type].decimals) : 'N/A'}}</span>
</div>
</td>
<td>

11
frontend/src/app/components/result/result.component.scss
View File

@ -67,6 +67,17 @@
.undefined {
color: #8f8f8f;
}
.result-desc {
text-transform: uppercase;
font-size: small;
margin-right: 0.25rem;
margin-bottom: 0.5rem;
overflow-y: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
}
}

13
frontend/src/app/components/search-input/search-input.component.html
View File

@ -10,7 +10,7 @@
<mat-vertical-stepper>
<!-- Date input -->
<mat-step>
<ng-template matStepLabel>When is your trip?</ng-template>
<ng-template matStepLabel>When do you want to travel?</ng-template>
<div class="vertical-wrap">
<mat-form-field appearance="outline">
<mat-label>Start</mat-label>
@ -24,7 +24,7 @@
</mat-step>
<!-- Multi presets -->
<mat-step>
<ng-template matStepLabel>Which climate would you prefer?</ng-template>
<ng-template matStepLabel>Which climate makes you feel comfortable?</ng-template>
<div *ngFor="let key of multiPresetsKeys" class="sub-group">
<span class="label">{{key|translate}}:</span><br>
<mat-radio-group [ngModel]="multiPresetSelection[key]" [value]="undefined">
@ -89,14 +89,17 @@
</section>
<!-- Climate Params -->
<section class="group">
<span class="title">Climate</span>
<app-toggle-slider [(model)]="temperatureMeanMax" [label]="'Max Temp'" [max]="45" [min]="0"></app-toggle-slider>
<span class="title small-bottom-margin">Climate</span>
<span class="desc">Choose your sweetspot</span>
<app-toggle-slider [(model)]="temperatureMeanMax" [label]="'Temperature'" [max]="45"
[min]="0"></app-toggle-slider>
<app-toggle-slider [(model)]="precipitation" [label]="'Precipitation'" [max]="500"
[min]="0"></app-toggle-slider>
</section>
<!-- Financial -->
<section class="group">
<span class="title">Fincancial</span>
<span class="title small-bottom-margin">Fincancial</span>
<span class="desc">Choose your sweetspot</span>
<app-toggle-slider [(model)]="accommodation" [label]="'Accommodation'" [max]="60" [min]="0"></app-toggle-slider>
</section>
</mat-tab>

7
frontend/src/app/components/search-input/search-input.component.scss
View File

@ -83,3 +83,10 @@
}
}
.desc {
font-size: smaller;
}
.small-bottom-margin {
margin-bottom: 0.4rem !important;
}

23
frontend/src/app/containers/region-details/region-details.component.html
View File

@ -27,40 +27,27 @@
<mat-tab-group>
<mat-tab *ngIf="region.avg_price_relative" label="Price Deviation">
<ng-template matTabContent>
<app-graph
[monthlyDatas]="[region.avg_price_relative]"
class="graph"
formatSting="##,##%"
graphType="column">
<app-graph [monthlyDatas]="[region.avg_price_relative]" class="graph" formatSting="##,##%" graphType="column">
</app-graph>
</ng-template>
</mat-tab>
<mat-tab *ngIf="region.temperature_mean_max && region.temperature_mean_max[0]" label="Temperatures">
<ng-template matTabContent>
<app-graph [colors]="['blue', 'red']"
[labels]="['Min', 'Max']"
[monthlyDatas]="[region.temperature_mean_min, region.temperature_mean_max]"
class="graph"
<app-graph [colors]="['blue', 'red']" [labels]="['Min', 'Max']"
[monthlyDatas]="[region.temperature_mean_min, region.temperature_mean_max]" class="graph"
formatSting="##,##°C">
</app-graph>
</ng-template>
</mat-tab>
<mat-tab *ngIf="region.precipitation && region.precipitation[0]" label="Precipitation">
<ng-template matTabContent>
<app-graph
[monthlyDatas]="[region.precipitation]"
class="graph"
formatSting="####mm">
<app-graph [monthlyDatas]="[region.precipitation]" class="graph" formatSting="####mm">
</app-graph>
</ng-template>
</mat-tab>
<mat-tab *ngIf="region.rain_days && region.rain_days[0]" label="Rain days">
<ng-template matTabContent>
<app-graph
[monthlyDatas]="[region.rain_days]"
class="graph"
formatSting="####"
graphType="column">
<app-graph [monthlyDatas]="[region.rain_days]" class="graph" formatSting="####" graphType="column">
</app-graph>
</ng-template>
</mat-tab>

4
frontend/src/app/containers/search/search.component.ts
View File

@ -53,8 +53,8 @@ export class SearchComponent implements OnInit {
this.sortOptions = [
{name: 'Relevance', property: 'score', descending: true},
{name: 'Name', property: 'name'},
{name: 'Accommodation', property: 'accommodation_costs'}
{name: 'Region name', property: 'name'},
{name: 'Accommodation price', property: 'accommodation_costs'}
];
if (this.results.length > 0) {

115
frontend/src/app/services/data.service.ts
View File

@ -90,60 +90,144 @@ export class DataService {
export const REGION_PARAM_VIS: RegionParamVisLookup = {
temperature_mean: {
icon: 'wb_sunny',
unit: '°C'
unit: '°C',
decimals: '1.0-0'
},
temperature_mean_min: {
icon: 'wb_sunny',
unit: '°C'
unit: '°C',
decimals: '1.0-0'
},
temperature_mean_max: {
icon: 'wb_sunny',
unit: '°C'
unit: '°C',
decimals: '1.0-0'
},
precipitation: {
icon: 'opacity',
unit: 'mm'
unit: 'mm',
decimals: '1.0-0'
},
humidity: {
icon: 'grain',
unit: '%'
unit: '%',
decimals: '1.0-0'
},
sun_hours: {
icon: 'flare',
unit: 'h'
unit: 'h',
decimals: '1.0-0'
},
rain_days: {
icon: 'date_range',
unit: ''
unit: '',
decimals: '1.0-0'
},
food_costs: {
icon: 'local_dining',
unit: '€/day'
unit: '€/day',
decimals: '1.0-0'
},
alcohol_costs: {
icon: 'local_bar',
unit: '€/day'
unit: '€/day',
decimals: '1.2-2'
},
water_costs: {
icon: 'local_cafe',
unit: '€/day'
unit: '€/day',
decimals: '1.2-2'
},
local_transportation_costs: {
icon: 'commute',
unit: '€/day'
unit: '€/day',
decimals: '1.2-2'
},
entertainment_costs: {
icon: 'local_activity',
unit: '€/day'
unit: '€/day',
decimals: '1.2-2'
},
accommodation_costs: {
icon: 'hotel',
unit: '€/day'
unit: '€/day',
decimals: '1.2-2'
},
average_per_day_costs: {
icon: 'euro',
unit: '€/day'
}
unit: '€/day',
decimals: '1.2-2'
},
avg_price_relative: {
icon: 'hotel',
unit: '%',
decimals: '1.1-1'
},
beach: {
icon: 'stars',
unit: '%',
decimals: '1.0-0'
},
history: {
icon: 'stars',
unit: '%',
decimals: '1.0-0'
},
nature: {
icon: 'stars',
unit: '%',
decimals: '1.0-0'
},
art: {
icon: 'stars',
unit: '%',
decimals: '1.0-0'
},
culture: {
icon: 'stars',
unit: '%',
decimals: '1.0-0'
},
mountains: {
icon: 'stars',
unit: '%',
decimals: '1.0-0'
},
architecture: {
icon: 'stars',
unit: '%',
decimals: '1.0-0'
},
rainforest: {
icon: 'stars',
unit: '%',
decimals: '1.0-0'
},
nightlife: {
icon: 'stars',
unit: '%',
decimals: '1.0-0'
},
desert: {
icon: 'stars',
unit: '%',
decimals: '1.0-0'
},
food: {
icon: 'stars',
unit: '%',
decimals: '1.0-0'
},
shopping: {
icon: 'stars',
unit: '%',
decimals: '1.0-0'
},
volcanoes: {
icon: 'stars',
unit: '%',
decimals: '1.0-0'
},
};
export interface RegionParamVisLookup {
@ -153,4 +237,5 @@ export interface RegionParamVisLookup {
export interface RegionParamVis {
icon: string;
unit: string;
decimals: string;
}

49
frontend/src/assets/i18n/en.json
View File

@ -1,33 +1,48 @@
{
"temperature_mean_max": "Max Temperature Average",
"temperature_mean_max": "Day temperature",
"temperature": "Temperature",
"rain_days": "Rainy days",
"sun_hours": "Sunny hours",
"rain_days": "Rain days",
"sun_hours": "Sunshine",
"precipitation": "Precipitation",
"humidity": "Humidity",
"alcohol_costs": "Alcohol",
"food_costs": "Food",
"water_costs": "Water",
"cheap_alcohol": "Cheap alcohol",
"cheap_alcohol": "cheap alcohol",
"local_transportation_costs": "Public transport",
"average_per_day_costs": "Total costs",
"entertainment_costs": "Entertainment",
"accommodation_costs": "Accommodation",
"cheap_food": "Cheap food",
"cheap_water": "Cheap water",
"cheap_transportations": "Cheap public transport",
"cheap_entertainment": "Cheap entertainment",
"cheap_accommodation": "Cheap accommodation",
"off_season": "Off-season",
"accommodation_costs": "Accommodation price",
"avg_price_relative": "Price tendency",
"cheap_food": "cheap food",
"cheap_water": "cheap water",
"cheap_transportations": "cheap public transport",
"cheap_entertainment": "cheap entertainment",
"cheap_accommodation": "cheap accommodation",
"off_season": "low season",
"warm": "warm",
"chilly": "cold",
"mild:": "mild",
"cold": "freezing",
"sunny": "sunny",
"dark": "dark",
"almost_no_rain": "almost none",
"little_rain": "little",
"floodlike_rain": "flooding",
"sunny": "all day long",
"dark": "the sun scares me",
"normal": "better not so much",
"almost_no_rain": "no rain",
"little_rain": "a little is good",
"floodlike_rain": "i like it pouring",
"few_raindays": "few",
"many_raindays": "many"
"many_raindays": "many",
"art": "Art",
"beach": "Beach",
"history": "History",
"nature": "Nature",
"culture": "Culture",
"mountains": "Mountains",
"architecture": "Architecture",
"rainforest": "Rainforest",
"desert": "Desert",
"food": "Food",
"shopping": "Shopping",
"volcanoes": "Volcanoes",
"nightlife": "Nightlife"
}