Skip to content

Commit b9136ba

Browse files
phananphanan
authored
Merge pull request #51 from vuejs/migration/team
Migrate Team page
2 parents c1b6d4c + f2ed904 commit b9136ba

File tree

10 files changed

+1690
-30
lines changed

10 files changed

+1690
-30
lines changed

‎src/.vuepress/components/community/team/emeriti.js

Lines changed: 116 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,116 @@
1+
import { shuffle } from 'lodash'
2+
3+
export default shuffle([
4+
{
5+
name: 'Chris Fritz',
6+
title: 'Good Word Putter-Togetherer',
7+
city: 'Durham, NC, USA',
8+
languages: ['en', 'de'],
9+
github: 'chrisvfritz',
10+
twitter: 'chrisvfritz',
11+
work: {
12+
role: 'Educator & Consultant'
13+
},
14+
reposPersonal: [
15+
'vue-enterprise-boilerplate'
16+
]
17+
},
18+
{
19+
name: 'Blake Newman',
20+
title: 'Performance Specializer & Code Deleter',
21+
city: 'London, UK',
22+
languages: ['en'],
23+
work: {
24+
role: 'Software Engineer',
25+
org: 'Attest',
26+
orgUrl: 'https://www.askattest.com/'
27+
},
28+
github: 'blake-newman',
29+
twitter: 'blakenewman'
30+
},
31+
{
32+
name: 'kingwl',
33+
title: 'New Bee',
34+
city: 'Beijing, China',
35+
languages: ['zh'],
36+
work: {
37+
role: 'Software Development Engineer',
38+
org: 'Chaitin',
39+
orgUrl: 'https://chaitin.cn/'
40+
},
41+
github: 'kingwl',
42+
reposOfficial: [
43+
'vue'
44+
]
45+
},
46+
{
47+
name: 'Alan Song',
48+
title: 'Regent of Routing',
49+
city: 'Hangzhou, China',
50+
languages: ['zh', 'en'],
51+
work: {
52+
role: 'Cofounder',
53+
org: 'Futurenda',
54+
orgUrl: 'https://www.futurenda.com/'
55+
},
56+
github: 'fnlctrl',
57+
reposOfficial: [
58+
'vue-router'
59+
]
60+
},
61+
{
62+
name: 'defcc',
63+
title: 'Details Deity & Bug Surgeon',
64+
city: 'Chongqing, China',
65+
languages: ['zh', 'en'],
66+
github: 'defcc',
67+
work: {
68+
org: 'zbj.com',
69+
orgUrl: 'http://www.zbj.com/'
70+
}
71+
},
72+
{
73+
name: 'gebilaoxiong',
74+
title: 'Issue Annihilator',
75+
city: 'Chongqing, China',
76+
languages: ['zh', 'en'],
77+
github: 'gebilaoxiong',
78+
work: {
79+
org: 'zbj.com',
80+
orgUrl: 'http://www.zbj.com/'
81+
}
82+
},
83+
{
84+
name: 'Denis Karabaza',
85+
title: 'Director of Directives (Emoji-Human Hybrid)',
86+
city: 'Dubna, Russia',
87+
languages: ['ru', 'en'],
88+
github: 'simplesmiler',
89+
twitter: 'simplesmiler',
90+
work: {
91+
role: 'Software Engineer',
92+
org: 'Neolant',
93+
orgUrl: 'http://neolant.ru/'
94+
}
95+
},
96+
{
97+
name: 'Edd Yerburgh',
98+
title: 'Testatron Alpha 9000',
99+
city: 'London, UK',
100+
languages: ['en'],
101+
github: 'eddyerburgh',
102+
twitter: 'EddYerburgh',
103+
work: {
104+
role: 'Full Stack Developer'
105+
},
106+
reposOfficial: [
107+
'vue-test-utils'
108+
],
109+
reposPersonal: [
110+
'avoriaz'
111+
],
112+
links: [
113+
'https://www.eddyerburgh.me'
114+
]
115+
}
116+
])

‎src/.vuepress/components/community/team/get-position-button.vue

Lines changed: 68 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,68 @@
1+
<template>
2+
<button
3+
v-if="geolocationSupported"
4+
@click="requestPosition"
5+
:disabled="requesting"
6+
class="get-position-button"
7+
>
8+
<i v-if="requesting" class="fa fa-refresh rotating-clockwise"></i>
9+
<template v-else>
10+
<i class="fa fa-map-marker"></i>
11+
<span>
12+
<slot>Find near me</slot>
13+
</span>
14+
</template>
15+
</button>
16+
</template>
17+
18+
<script>
19+
export default {
20+
data: () => ({
21+
geolocationSupported: false,
22+
requesting: false
23+
}),
24+
25+
mounted () {
26+
if ('geolocation' in window.navigator) {
27+
this.geolocationSupported = true
28+
}
29+
},
30+
31+
methods: {
32+
requestPosition () {
33+
this.requesting = true
34+
35+
window.navigator.geolocation.getCurrentPosition(
36+
position => {
37+
this.requesting = false
38+
this.$emit('positionRetrieved', position)
39+
},
40+
error => {
41+
this.requesting = false
42+
this.$emit('positionErrored')
43+
},
44+
{
45+
enableHighAccuracy: true
46+
}
47+
)
48+
}
49+
}
50+
}
51+
</script>
52+
53+
<style lang="scss" scoped>
54+
button {
55+
display: inline-block;
56+
padding: 0.4em 0.7em 0.45em;
57+
font-weight: bold;
58+
font-size: 0.5em;
59+
text-transform: uppercase;
60+
line-height: 1;
61+
border: none;
62+
background: #304455;
63+
color: #fff;
64+
border-radius: 3px;
65+
position: relative;
66+
cursor: pointer;
67+
}
68+
</style>

‎src/.vuepress/components/community/team/index.vue

Lines changed: 208 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,208 @@
1+
<template>
2+
<div>
3+
<div class="team">
4+
<h2 id="active-core-team-members">
5+
Active Core Team Members
6+
<GetPositionButton
7+
v-if="!userPosition"
8+
@positionRetrieved="setUserPosition"
9+
@positionErrored="setUserPositionError"
10+
/>
11+
</h2>
12+
13+
<div v-if="errorGettingLocation" class="danger custom-block">
14+
<p>Failed to get your location.</p>
15+
</div>
16+
17+
<p>
18+
The development of Vue and its ecosystem is guided by an international team, some of whom have chosen to be featured below.
19+
</p>
20+
21+
<div v-if="userPosition" class="tip custom-block">
22+
<p>The core team have been sorted by their distance from you.</p>
23+
</div>
24+
25+
<VuerProfile v-for="profile in members" :key="profile.name" :profile="profile" :use-miles="useMiles"/>
26+
</div>
27+
28+
<div class="team">
29+
<h2 id="core-team-emeriti">
30+
Core Team Emeriti
31+
</h2>
32+
33+
<p>
34+
Here we honor some no-longer-active core team members who have made valuable contributions in the past.
35+
</p>
36+
37+
<VuerProfile v-for="profile in emeriti" :key="profile.name" :profile="profile" :use-miles="useMiles"/>
38+
</div>
39+
40+
<div class="team">
41+
<h2 id="community-partners">
42+
Community Partners
43+
<GetPositionButton
44+
v-if="!userPosition"
45+
@positionRetrieved="setUserPosition"
46+
@positionErrored="setUserPositionError"
47+
/>
48+
</h2>
49+
50+
<div v-if="errorGettingLocation" class="danger custom-block">
51+
<p>Failed to get your location.</p>
52+
</div>
53+
54+
<p>
55+
Some members of the Vue community have so enriched it, that they deserve special mention. We've developed a more intimate relationship with these key partners, often coordinating with them on upcoming features and news.
56+
</p>
57+
58+
<div v-if="userPosition" class="tip custom-block">
59+
<p>The community partners have been sorted by their distance from you.</p>
60+
</div>
61+
62+
<VuerProfile v-for="profile in partners" :key="profile.name" :profile="profile" :use-miles="useMiles"/>
63+
</div>
64+
</div>
65+
</template>
66+
67+
<script>
68+
import { getDistanceFromLatLonInKm } from './utils'
69+
import members from './members'
70+
import emeriti from './emeriti'
71+
import partners from './partners'
72+
73+
const imperialLanguageCodes = ['en-US', 'en-MY', 'en-MM', 'en-BU', 'en-LR', 'my', 'bu']
74+
75+
const cityCoordsFor = {
76+
'Annecy, France': [45.899247, 6.129384],
77+
'Alicante, Spain' : [38.346543, -0.483838],
78+
'Amsterdam, Netherlands': [4.895168, 52.370216],
79+
'Atlanta, GA, USA': [33.749051, -84.387858],
80+
'Bangalore, India': [12.971599, 77.594563],
81+
'Beijing, China': [39.904200, 116.407396],
82+
'Bordeaux, France': [44.837789, -0.579180],
83+
'Bucharest, Romania': [44.426767, 26.102538],
84+
'Chengdu, China': [30.572815, 104.066801],
85+
'Chongqing, China': [29.431586, 106.912251],
86+
'Denver, CO, USA': [39.739236, -104.990251],
87+
'Dublin, Ireland': [53.349918, -6.260174],
88+
'Dubna, Russia': [56.732020, 37.166897],
89+
'East Lansing, MI, USA': [42.736979, -84.483865],
90+
'Fort Worth, TX, USA': [32.755331, -97.325735],
91+
'Hangzhou, China': [30.274084, 120.155070],
92+
'Jersey City, NJ, USA': [40.728157, -74.558716],
93+
'Kingston, Jamaica': [18.017874, -76.809904],
94+
'Krasnodar, Russia': [45.039267, 38.987221],
95+
'Lansing, MI, USA': [42.732535, -84.555535],
96+
'London, UK': [51.507351, -0.127758],
97+
'Lyon, France': [45.764043, 4.835659],
98+
'Mannheim, Germany': [49.487459, 8.466039],
99+
'Moscow, Russia': [55.755826, 37.617300],
100+
'Munich, Germany': [48.137154, 11.576124],
101+
'Orlando, FL, USA': [28.538335, -81.379236],
102+
'Paris, France': [48.856614, 2.352222],
103+
'Poznań, Poland': [52.4006553, 16.761583],
104+
'Seoul, South Korea': [37.566535, 126.977969],
105+
'Shanghai, China': [31.230390, 121.473702],
106+
'Singapore': [1.352083, 103.819839],
107+
'Sydney, Australia': [-33.868820, 151.209290],
108+
'Taquaritinga, Brazil': [-21.430094, -48.515285],
109+
'Tehran, Iran': [35.689197, 51.388974],
110+
'Thessaloniki, Greece': [40.640063, 22.944419],
111+
'Tokyo, Japan': [35.689487, 139.691706],
112+
'Toronto, Canada': [43.653226, -79.383184],
113+
'Wrocław, Poland': [51.107885, 17.038538],
114+
'Boston, MA, USA': [42.360081, -71.058884],
115+
'Kyiv, Ukraine': [50.450100, 30.523399],
116+
'Washington, DC, USA': [38.8935755,-77.0846156,12],
117+
'Kraków, Poland': [50.064650, 19.936579],
118+
'Oslo, Norway': [59.911491, 10.757933],
119+
'Kanagawa, Japan': [35.44778, 139.6425]
120+
}
121+
122+
export default {
123+
components: {
124+
VuerProfile: () => import('./vuer-profile'),
125+
GetPositionButton: () => import('./get-position-button')
126+
},
127+
128+
data: () => ({
129+
emeriti,
130+
geolocationSupported: false,
131+
errorGettingLocation: false,
132+
userPosition: null,
133+
useMiles: false
134+
}),
135+
136+
computed: {
137+
members () {
138+
return this.sortByDistance(members)
139+
},
140+
141+
partners () {
142+
return this.sortByDistance(partners)
143+
}
144+
},
145+
146+
methods: {
147+
setUserPosition (position) {
148+
this.userPosition = position
149+
this.errorGettingLocation = false
150+
},
151+
152+
setUserPositionError () {
153+
this.userPosition = null
154+
this.errorGettingLocation = true
155+
},
156+
157+
sortByDistance (vuers) {
158+
if (!this.userPosition) {
159+
return vuers
160+
}
161+
162+
const vuersWithDistances = vuers.map(vuer => {
163+
const cityCoords = cityCoordsFor[vuer.city]
164+
165+
if (cityCoords) {
166+
return Object.assign({}, vuer, {
167+
distanceInKm: getDistanceFromLatLonInKm(
168+
this.userPosition.coords.latitude,
169+
this.userPosition.coords.longitude,
170+
cityCoords[0],
171+
cityCoords[1]
172+
)
173+
})
174+
}
175+
176+
return Object.assign({}, vuer, {
177+
distanceInKm: null
178+
})
179+
})
180+
181+
vuersWithDistances.sort((a, b) => {
182+
if (a.distanceInKm && b.distanceInKm) return a.distanceInKm - b.distanceInKm
183+
if (a.distanceInKm && !b.distanceInKm) return -1
184+
if (!a.distanceInKm && b.distanceInKm) return 1
185+
if (a.name < b.name) return -1
186+
if (a.name > b.name) return 1
187+
})
188+
189+
return vuersWithDistances
190+
}
191+
},
192+
193+
mounted () {
194+
this.useMiles = imperialLanguageCodes.includes(window.navigator.language)
195+
}
196+
}
197+
</script>
198+
199+
<style lang="scss" scoped>
200+
.vuer+.vuer {
201+
border-top: 1px dotted #ddd;
202+
}
203+
204+
.get-position-button {
205+
float: right;
206+
margin-top: .3em;
207+
}
208+
</style>

0 commit comments

Comments
 (0)