Skip to content

Commit 9e14ef1

Browse files
znckznck
committed
add events on home page
1 parent d752860 commit 9e14ef1

File tree

13 files changed

+278
-30
lines changed

13 files changed

+278
-30
lines changed

‎.vuepress/components/EventPage.vue

+15-2
Original file line numberDiff line numberDiff line change
@@ -21,11 +21,19 @@
2121
</main>
2222

2323
<footer>
24+
<section v-if="date">
25+
<h2>Details</h2>
26+
27+
<p><strong>Date:</strong> {{ date.toDateString() }}</p>
28+
<p><strong>Time:</strong> {{ $page.frontmatter.time }}</p>
29+
<p><strong>Venue:</strong> <a :href="$page.frontmatter.venue.map" target="_blank" rel="noopener noreferrer">{{ $page.frontmatter.venue.name }}</a></p>
30+
</section>
31+
2432
<h2>Sponsors</h2>
25-
<EventSponsor v-for="(item, index) in $page.frontmatter.sponsors" :key="index" v-bind="item" />
33+
<EventSponsor v-for="(item, index) in $page.frontmatter.sponsors" :key="item.sponsor" v-bind="item" />
2634

2735
<h2>Organizers</h2>
28-
<EventSpeaker v-for="(item, index) in $page.frontmatter.organizers" :key="index" :speaker="item" />
36+
<EventSpeaker v-for="(item, index) in $page.frontmatter.organizers" :key="item" :speaker="item" />
2937
</footer>
3038
</div>
3139
</template>
@@ -42,6 +50,11 @@ export default {
4250
case 'Q&A': return 'EventQuestion';
4351
}
4452
}
53+
},
54+
computed: {
55+
date() {
56+
return this.$page.frontmatter.date ? new Date(this.$page.frontmatter.date) : null
57+
}
4558
}
4659
}
4760
</script>

‎.vuepress/components/EventSummary.vue

+32
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
<script>
2+
export default {
3+
props: ["id", "title", "date", "time", "venue", "ticket", "link"],
4+
computed: {
5+
hasDate() {
6+
return this.date instanceof Date
7+
},
8+
isUpcoming() {
9+
return this.date instanceof Date && this.date.getTime() > Date.now();
10+
}
11+
}
12+
};
13+
</script>
14+
15+
<template>
16+
<section>
17+
<h3>
18+
#{{ id }} <a :href="link">{{ title }}</a>
19+
</h3>
20+
21+
<div v-if="hasDate">
22+
<p>
23+
Venue: {{ venue.name }} <br />
24+
Time: {{ date.toDateString() }}, {{ time }}
25+
</p>
26+
27+
<p v-if="isUpcoming && ticket">
28+
<a :href="ticket" target="_blank" rel="noopener noreferrer">Buy tickets</a>
29+
</p>
30+
</div>
31+
</section>
32+
</template>

‎.vuepress/components/EventTalk.vue

+2-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
<template>
22
<section class="talk">
33
<h3 class="title">{{ title }}</h3>
4+
<div v-if="description" v-html="description"></div>
45
<EventSpeaker :speaker="speaker" />
56
<ItemRow v-if="deck">
67
<Icon name="deck" slot="icon" />
@@ -15,7 +16,7 @@
1516

1617
<script>
1718
export default {
18-
props: ['title', 'speaker', 'deck', 'issue'],
19+
props: ['title', 'description', 'speaker', 'deck', 'issue'],
1920
filters: {
2021
filename (value) {
2122
return value.split('/').pop()

‎.vuepress/components/PastEvents.vue

+42
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,42 @@
1+
<script>
2+
import events from '@dynamic/events'
3+
import EventSummary from './EventSummary.vue'
4+
5+
export default {
6+
props: {
7+
limit: Number
8+
},
9+
computed: {
10+
events() {
11+
const now = Date.now()
12+
13+
const past = events.filter(
14+
event => !(event.date instanceof Date) || event.date.getTime() < now
15+
)
16+
17+
if (typeof this.limit === 'number') {
18+
return past.slice(0, this.limit)
19+
}
20+
21+
return past
22+
}
23+
},
24+
components: { EventSummary }
25+
}
26+
</script>
27+
28+
<template>
29+
<div class="events">
30+
<EventSummary class="event" v-for="event in events" :key="event.id" v-bind="event" />
31+
</div>
32+
</template>
33+
34+
<style scoped>
35+
.events {
36+
margin: 1rem 0;
37+
}
38+
39+
.event {
40+
margin-bottom: 1rem;
41+
}
42+
</style>

‎.vuepress/components/UpcomingEvents.vue

+33
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
<script>
2+
import events from '@dynamic/events'
3+
import EventSummary from './EventSummary.vue'
4+
5+
export default {
6+
computed: {
7+
events() {
8+
const now = Date.now()
9+
10+
return events.filter(
11+
event => (event.date instanceof Date) && event.date.getTime() >= now
12+
)
13+
}
14+
},
15+
components: { EventSummary }
16+
}
17+
</script>
18+
19+
<template>
20+
<div class="events">
21+
<EventSummary class="event" v-for="event in events" :key="event.id" v-bind="event" />
22+
</div>
23+
</template>
24+
25+
<style scoped>
26+
.events {
27+
margin: 1rem 0;
28+
}
29+
30+
.event {
31+
margin-bottom: 1rem;
32+
}
33+
</style>

‎.vuepress/config.js

+16-5
Original file line numberDiff line numberDiff line change
@@ -2,15 +2,14 @@ module.exports = {
22
title: 'Vue BLR',
33
description: 'Vue Meetup in Bangalore',
44
ga: 'UA-38503997-3',
5+
plugins: [
6+
require('./plugins/events')
7+
],
58
head: [
69
['link', {
710
rel: 'icon',
811
href: `/icons/icon-152x152.png`
912
}],
10-
['link', {
11-
rel: 'manifest',
12-
href: '/manifest.json'
13-
}],
1413
['meta', {
1514
name: 'theme-color',
1615
content: '#0188DE'
@@ -55,9 +54,21 @@ module.exports = {
5554
items: [{
5655
group: 'Past Events',
5756
items: [
57+
{
58+
text: '#15 State in Design',
59+
link: '/15-state-in-design/'
60+
},
61+
{
62+
text: '#9 In Production',
63+
link: '/09-in-production/'
64+
},
65+
{
66+
text: '#8 State of the Vuenion',
67+
link: '/08-state-of-the-vuenion/'
68+
},
5869
{
5970
text: '#7 Building Mobile Apps',
60-
link: '/07-building-mobile-apps/'
71+
link: '/0-building-mobile-apps/'
6172
},
6273
{
6374
text: '#6 Begin Again',

‎.vuepress/plugins/events.js

+44
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,44 @@
1+
const fs = require('fs')
2+
const path = require('path')
3+
const glob = require('globby')
4+
const frontmatter = require('frontmatter')
5+
6+
const srcDir = path.resolve(__dirname, '../..')
7+
8+
const files = glob.sync('*/README.md', { cwd: srcDir })
9+
const events = files.map(file => {
10+
const content = fs.readFileSync(path.resolve(srcDir, file), 'utf8')
11+
const link = `/${file.replace(/README\.md$/, '')}`
12+
const { data } = frontmatter(content)
13+
14+
return {
15+
id: parseInt(file),
16+
...data,
17+
link
18+
}
19+
})
20+
21+
events.sort((a, b) => b.id - a.id)
22+
23+
module.exports = function eventsPlugin(options, context) {
24+
return {
25+
clientDynamicModules() {
26+
return {
27+
name: 'events.js',
28+
content: `
29+
const dateFormat = /^\\d{4}-\\d{2}-\\d{2}T\\d{2}:\\d{2}:\\d{2}(\\.\\d{3})?Z$/;
30+
function reviver(key, value) {
31+
if (typeof value === "string" && dateFormat.test(value)) {
32+
return new Date(value);
33+
}
34+
35+
return value;
36+
}
37+
38+
export default JSON.parse(\`${JSON.stringify(events)}\`, reviver)
39+
`
40+
}
41+
}
42+
}
43+
}
44+

‎06-begin-again/README.md

+19
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
---
2+
id: 6
3+
title: Begin Again
4+
meetup: 245461697
5+
agenda:
6+
- title: Getting started with Vue
7+
type: workshop
8+
speaker: Rahul Kadyan <@znck0>
9+
sponsors:
10+
- type: venue
11+
sponsor: Anatta <@anattadesign>
12+
photos:
13+
- https://secure.meetupstatic.com/photos/event/9/6/e/highres_467402414.jpeg
14+
organizers:
15+
- Rahul Kadyan <@znck0>
16+
- Swapnil Agarwal <@SwapAgarwal>
17+
---
18+
19+
<EventPage />

‎15-state-in-design/README.md

+41
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,41 @@
1+
---
2+
id: 15
3+
title: State in Design
4+
meetup: 261377797
5+
date: 2019-06-22
6+
time: 14:00 to 17:00
7+
venue:
8+
name: Myntra Designs, Audi A Block
9+
map: https://goo.gl/maps/dBC99A1ae2yKRvVA9
10+
ticket: https://www.townscript.com/e/vueblr-15/booking
11+
agenda:
12+
- title: Vuex - Getting started
13+
type: talk
14+
speaker: Chetan Sachdev <@cksachdev>
15+
description: <p>This would be an introductory talk on Vuex.</p>
16+
- title: Atomic design using Vue
17+
type: talk
18+
speaker: Ruphaa Ganesh <@ruphaa95>
19+
description: >
20+
<p>
21+
Atomic design is an evolutionary approach of breaking down interfaces into fundamental building blocks and build the system bottom-up. It helps us to build consistent, solid and reusable design systems. This has gained a lot of strength and popularity in recent days.
22+
</p>
23+
<p>
24+
The Single File Component structure of Vue makes this approach a powerful ally for developers. Let me demonstrate how the union of the autonomous components of Vue works perfectly with Atomic Design.
25+
</p>
26+
<p>
27+
A Frontend Software Engineer working with Freshworks, Ruphaa is passionate about coding, yoga and books.
28+
</p>
29+
sponsors:
30+
- type: venue
31+
sponsor: Myntra <@myntra>
32+
photos:
33+
- https://secure.meetupstatic.com/photos/event/4/4/a/f/highres_481217583.jpeg
34+
organizers:
35+
- Rahul Kadyan <@znck0>
36+
- Swapnil Agarwal <@SwapAgarwal>
37+
- Nimit Bhargava <@NimitBhargava>
38+
39+
---
40+
41+
<EventPage />

‎README.md

+18-20
Original file line numberDiff line numberDiff line change
@@ -10,35 +10,33 @@ Vue is the approachable, versatile and performant progressive javascript framewo
1010

1111
What we would like to bring with this meetup:
1212

13-
- More members of the Bangalore Dev community to participate in open source projects, specially connected with Vue.
14-
- Create a iterative feedback cycle, letting members share their experiences and ideas with Vue.
15-
- Have special training events, so everyone gets up to speed with the technology.
13+
- More members of the Bangalore Dev community to participate in open source projects, specially connected with Vue.
14+
- Create a iterative feedback cycle, letting members share their experiences and ideas with Vue.
15+
- Have special training events, so everyone gets up to speed with the technology.
1616

17-
## Meetups
17+
## Upcoming meetups
1818

19-
We use Meetup platform to manage events. You can find past event on [https://www.meetup.com/vue-bangalore/events/past](https://www.meetup.com/vue-bangalore/events/past).
19+
<UpcomingEvents />
2020

21-
## Upcoming meetups
21+
## Meetups
2222

23-
We will be announcing the following meetups as soon as they are ready, please be sure to [sign up on meetup](https://www.meetup.com/vue-bangalore/) to get all the updates and suggest/upvote talks on issues of this repo to select the next talks :)
23+
<PastEvents :limit="5" />
2424

25-
## Get in touch
25+
[See all events](/events)
2626

27-
[![Join the chat at https://gitter.im/vue-bangalore/Lobby](https://badges.gitter.im/vue-bangalore/Lobby.svg)](https://gitter.im/vue-bangalore/Lobby?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge)
27+
## Get in touch
2828

2929
Use any of the following methods to communicate with us:
3030

31-
- Make a pull request.
32-
- Open or comment in an issue.
33-
- Submit a talk proposal (prefix with "Talk: ").
34-
- Submit a workshop proposal (prefix with "Workshop: ").
35-
- Request a talk (prefix with "Request: ").
36-
- Join the group on meetups to stay updated with info of the next meetups.
31+
- Make a pull request.
32+
- Open or comment in an issue.
33+
- Submit a talk proposal (prefix with "Talk: ").
34+
- Submit a workshop proposal (prefix with "Workshop: ").
35+
- Request a talk (prefix with "Request: ").
36+
- Join the group on meetups to stay updated with info of the next meetups.
3737

3838
## Organizers
3939

40-
- Rahul Kadyan - [@znck0](https://github.com/znck)
41-
- Swapnil Agarwal - [@swapagarwal](https://github.com/swapagarwal)
42-
- Nimit Bhargava - [@nimitbhargava](https://github.com/nimitbhargava)
43-
- You - All the help is appreciated. If you would like to become an organizer and help the group grow, please contact us :)
44-
40+
- Rahul Kadyan - [@znck0](https://github.com/znck)
41+
- Swapnil Agarwal - [@swapagarwal](https://github.com/swapagarwal)
42+
- Nimit Bhargava - [@nimitbhargava](https://github.com/nimitbhargava)

‎events.md

+4
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
# Events
2+
3+
<UpcomingEvents />
4+
<PastEvents />

‎package.json

+4-1
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,8 @@
44
"version": "0.0.0",
55
"description": "A Vue meetup in Bangalore, India.",
66
"scripts": {
7-
"build": "vuepress build ."
7+
"build": "vuepress build .",
8+
"serve": "vuepress dev ."
89
},
910
"repository": {
1011
"type": "git",
@@ -17,6 +18,8 @@
1718
},
1819
"homepage": "https://blr.vue.community",
1920
"dependencies": {
21+
"frontmatter": "^0.0.3",
22+
"globby": "^9.2.0",
2023
"vue-carousel": "^0.8.1"
2124
},
2225
"devDependencies": {

0 commit comments

Comments
 (0)