Skip to content

Commit 031fd6b

Browse files
agualisagualis
committed
Translate labels to english
1 parent de6121e commit 031fd6b

File tree

10 files changed

+76
-34
lines changed

10 files changed

+76
-34
lines changed

‎src/app/pages/Days/Day.vue‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@
1212

1313
<script>
1414
import { MosicaRouter } from '../../services/MosicaRouter'
15-
import { spanishFromIso } from '../../services/date-utils'
15+
import { localizedFromIso } from '../../services/date-utils'
1616
1717
export default {
1818
props: {day: Object, isLoading: Boolean},
@@ -26,7 +26,7 @@
2626
},
2727
computed: {
2828
dateLabel() {
29-
return spanishFromIso(this.day.date)
29+
return localizedFromIso(this.day.date)
3030
}
3131
}
3232
}

‎src/app/pages/Days/__test__/Day.spec.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import Day from '@/app/pages/Days/Day.vue'
22
import { FIRST_DAY } from '../../../services/__mocks__/gigs-sample'
33
import { Wrap } from '../../../../../test/helpers'
44
import DayListPageObject from '../../../__page_objects__/DayPageObject'
5-
import { spanishFromIso } from '../../../services/date-utils';
5+
import { localizedFromIso } from '../../../services/date-utils';
66

77
describe('Day', () => {
88

@@ -22,7 +22,7 @@ describe('Day', () => {
2222
})
2323

2424
it('renders gig date in spanish format', async() => {
25-
page.contains(spanishFromIso(FIRST_DAY.date))
25+
page.contains(localizedFromIso(FIRST_DAY.date))
2626
})
2727

2828
describe('When clicking buttons', () => {

‎src/app/pages/Days/__test__/__snapshots__/Day.spec.js.snap‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ exports[`Day matches full snapshot 1`] = `
55
<div class="day">
66
<div class="q-card-primary q-card-container row no-wrap">
77
<div class="col column">
8-
<div class="q-card-title">Lunes, 18 de Septiembre</div>
8+
<div class="q-card-title">Lunes, 18 De Septiembre</div>
99
<div class="q-card-subtitle"></div>
1010
</div>
1111
<div class="col-auto self-center q-card-title-extra"></div>

‎src/app/pages/GigDetail.vue‎

Lines changed: 10 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -8,22 +8,23 @@
88
<q-card-main>
99
<div class="block" v-if="gig.place">
1010
<h4>{{gig.place}}</h4>
11-
{{gig.address}}<br />
11+
<span v-html="gig.address"/>
12+
<br />
1213
</div>
13-
<FormButton :onClick="openMap"><q-icon name="directions"/>¿Cómo llegar?</FormButton>
14+
<FormButton :onClick="openMap"><q-icon name="directions"/> How to get there? </FormButton>
1415
<div class="block" v-if="gig.price">
15-
Precio: {{gig.price}}
16+
Price: {{gig.price}}
1617
</div>
1718
<div class="block">
1819
<div v-for="schedule in gig.schedule">
1920
<strong>{{schedule.day}}</strong> a las <strong>{{schedule.hour}} h.</strong>
2021
</div>
2122
</div>
22-
<FormButton :onClick="downloadICS"><q-icon name="event"/> Añádelo a tu calendario</FormButton>
23+
<FormButton :onClick="downloadICS"><q-icon name="event"/> Add it to youir calendar </FormButton>
2324
<div class="block" v-if="gig.description">
2425
{{gig.description}}
2526
</div>
26-
<FormButton :onClick="share"><q-icon name="share"/> Compártelo con tus amigos</FormButton>
27+
<FormButton :onClick="share"><q-icon name="share"/> Share it with your friends </FormButton>
2728
</q-card-main>
2829
<q-card-media v-if="gig.image_url">
2930
<img :src="gig.image_url"/>
@@ -65,13 +66,16 @@
6566
}
6667
</script>
6768

68-
<style scoped>
69+
<style lang="stylus" type="text/stylus" scoped>
70+
@import '~variables'
71+
6972
img {
7073
max-width: 100%;
7174
max-height: 100%;
7275
}
7376
.block {
7477
margin: 0.5rem;
78+
font-size: 1.1rem;
7579
}
7680
FormButton {
7781
margin: 0.5rem;

‎src/app/pages/NewGig/NewGig.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
<template>
22
<q-card>
33
<div class="layout-padding">
4-
<h4>Add a New Gig to Mosica!</h4>
4+
<h4>Add a New Gig to Jota JS!</h4>
55
<TextInput
66
label="Insert Gig Title"
77
v-model="title"

‎src/app/pages/__test__/Days.spec.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ import { FIRST_DAY, DAY_LIST } from '../../services/__mocks__/gigs-sample'
44
import { fakeGigsByDay2 } from '../../services/__mocks__/gigs-sample2'
55
import DayListPage from '../../__page_objects__/DaysPageObject'
66
import { cloneProductionStore } from '../../../../test/helpers'
7-
import { spanishFromIso } from '../../services/date-utils';
7+
import { localizedFromIso } from '../../services/date-utils';
88
jest.mock('../../services/MosicaCore')
99

1010
describe('Days', () => {
@@ -30,7 +30,7 @@ describe('Days', () => {
3030
*/
3131

3232
it('render days in spanish format', async () => {
33-
const DAYS = DAY_LIST.map((day) => spanishFromIso(day.date))
33+
const DAYS = DAY_LIST.map((day) => localizedFromIso(day.date))
3434
expect(page.dayTitles()).toEqual(DAYS)
3535
})
3636

‎src/app/pages/__test__/__snapshots__/Days.spec.js.snap‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ exports[`Days matches full snapshot 1`] = `
88
<div class="day">
99
<div class="q-card-primary q-card-container row no-wrap">
1010
<div class="col column">
11-
<div class="q-card-title">Lunes, 18 de Septiembre</div>
11+
<div class="q-card-title">Lunes, 18 De Septiembre</div>
1212
<div class="q-card-subtitle"></div>
1313
</div>
1414
<div class="col-auto self-center q-card-title-extra"></div>

‎src/app/services/__mocks__/create-fake-gig.js‎

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,17 +5,23 @@ export function createFakeGig(date) {
55
return {
66
id: faker.random.number().toString(),
77
title: randomTitle(),
8-
description: faker.lorem.paragraph(),
8+
description: faker.lorem.paragraph(15),
99
image_url: randomImageUrl(),
1010
lat_lng: `${faker.address.latitude()},${faker.address.longitude()}`,
11-
address: faker.address.streetAddress(),
11+
address: fakeAddress(),
1212
price: randomNumber(5, 100) + '€',
1313
place: randomPlace(),
1414
hour: randomNumber(4, 11) + 'PM',
1515
day: date
1616
}
1717
}
1818

19+
function fakeAddress() {
20+
return faker.address.streetAddress() +
21+
'<br/>' + faker.address.city() + ', ' + faker.address.country() +
22+
'<br/>' + faker.address.zipCode()
23+
}
24+
1925
function randomNumber(min, max) {
2026
return faker.random.number({min, max})
2127
}

‎src/app/services/__tests__/date-utils.spec.js‎

Lines changed: 30 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,7 @@
1-
import { spanishToday, spanishTomorrow, isoToday, isoTomorrow, spanishFromIso } from '../date-utils'
1+
import {
2+
localizedToday, englishToday, isoToday, isoTomorrow, localizedFromIso, localizedTomorrow,
3+
setLocale
4+
} from '../date-utils'
25
import { stubNow } from '../../../../test/helpers'
36

47
describe('date utils', () => {
@@ -13,16 +16,34 @@ describe('date utils', () => {
1316
expect(isoTomorrow()).toBe('2017-09-19')
1417
})
1518

16-
it('Prints todays date in spanish', () => {
17-
expect(spanishToday()).toBe('Lunes, 18 de Septiembre')
18-
})
19+
describe('When locale is english', () => {
20+
21+
beforeEach(() => setLocale('en'))
1922

20-
it('Prints tomorrows date in spanish', () => {
21-
expect(spanishTomorrow()).toBe('Martes, 19 de Septiembre')
23+
it('Prints todays date', () => {
24+
expect(localizedToday()).toBe('Monday, 18 Of September')
25+
})
26+
27+
it('Prints tomorrows date', () => {
28+
expect(localizedTomorrow()).toBe('Tuesday, 19 Of September')
29+
})
2230
})
2331

24-
it('translate ISO date to Spanish format', () => {
25-
expect(spanishFromIso('2017-09-18')).toBe('Lunes, 18 de Septiembre')
26-
expect(spanishFromIso('2017-11-04')).toBe('Sábado, 04 de Noviembre')
32+
describe('When locale is spanish', () => {
33+
34+
beforeEach(() => setLocale('es'))
35+
36+
it('Prints todays date', () => {
37+
expect(localizedToday()).toBe('Lunes, 18 De Septiembre')
38+
})
39+
40+
it('Prints tomorrows date', () => {
41+
expect(localizedTomorrow()).toBe('Martes, 19 De Septiembre')
42+
})
43+
44+
it('translate ISO date', () => {
45+
expect(localizedFromIso('2017-09-18')).toBe('Lunes, 18 De Septiembre')
46+
expect(localizedFromIso('2017-11-04')).toBe('Sábado, 04 De Noviembre')
47+
})
2748
})
2849
})

‎src/app/services/date-utils.js‎

Lines changed: 19 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,12 @@ const moment = require('moment')
22
require('moment/locale/es')
33
const ISO_FORMAT = 'YYYY-MM-DD'
44

5+
// Default locale:
6+
let locale = 'es'
7+
export function setLocale(localeCode) {
8+
locale = localeCode
9+
}
10+
511
export function isoToday() {
612
return moment().format(ISO_FORMAT)
713
}
@@ -14,20 +20,25 @@ export function isoFuture(daysFromNow) {
1420
return moment().add(daysFromNow, 'days').format(ISO_FORMAT)
1521
}
1622

17-
export function spanishToday() {
18-
return toSpanish(moment())
23+
export function localizedToday() {
24+
return localize(moment())
25+
}
26+
27+
export function localizedTomorrow() {
28+
return localize(moment().add(1, 'days'))
1929
}
2030

21-
export function spanishTomorrow() {
22-
return toSpanish(moment().add(1, 'days'))
31+
export function localizedFromIso(isoDate) {
32+
return localize(moment(isoDate, ISO_FORMAT))
2333
}
2434

25-
export function spanishFromIso(isoDate) {
26-
return toSpanish(moment(isoDate, ISO_FORMAT))
35+
function localize(date) {
36+
return toTitleCase(date.locale(locale).format(`dddd, DD [${localizedSeparator(locale)}] MMMM`))
2737
}
2838

29-
function toSpanish(date) {
30-
return toTitleCase(date.format('dddd, DD [de] MMMM')).replace(' De ', ' de ')
39+
function localizedSeparator(locale) {
40+
if (locale === 'en') return 'of'
41+
return 'de'
3142
}
3243

3344
function toTitleCase(str) {

0 commit comments

Comments
 (0)