Updated schedule template

This commit is contained in:
Oleh Zasadnyy 2014-08-15 17:02:40 +03:00
parent 5c8e326daa
commit c0f7dc3215
27 changed files with 232 additions and 144 deletions

View file

@ -1,10 +1,10 @@
-
group: 'Main organizer'
group: "Main organizer"
elements:
- {name: 'GDG Lviv', description: 'GDG Lviv - Open and volunteer geek community', link: 'http://lviv.gdg.org.ua', imageUrl: 'gdg-lviv.svg'}
- {name: "GDG Lviv", description: "GDG Lviv - Open and volunteer geek community", link: "http://lviv.gdg.org.ua", imageUrl: "gdg-lviv.svg"}
-
group: 'Co-organizers'
group: "Co-organizers"
elements:
- {name: 'GDG Lviv', description: 'GDG Kyiv - Open and volunteer geek community', link: 'http://kyiv.gdg.org.ua', imageUrl: 'gdg-kyiv.png'}
- {name: 'GDG Cherkassy', description: 'GDG Cherkassy - Open and volunteer geek community', link: 'http://cherkassy.gdg.org.ua', imageUrl: 'gdg-cherkassy.png'}
- {name: 'GDG Dnipropetrovsk', description: 'GDG Dnipropetrovsk - Open and volunteer geek community', link: 'http://dnipro.gdg.org.ua', imageUrl: 'gdg-dnipropetrovsk.png'}
- {name: "GDG Lviv", description: "GDG Kyiv - Open and volunteer geek community", link: "http://kyiv.gdg.org.ua", imageUrl: "gdg-kyiv.png"}
- {name: "GDG Cherkassy", description: "GDG Cherkassy - Open and volunteer geek community", link: "http://cherkassy.gdg.org.ua", imageUrl: "gdg-cherkassy.png"}
- {name: "GDG Dnipropetrovsk", description: "GDG Dnipropetrovsk - Open and volunteer geek community", link: "http://dnipro.gdg.org.ua", imageUrl: "gdg-dnipropetrovsk.png"}

View file

@ -1,23 +1,23 @@
-
group: 'General sponsor'
group: "General sponsor"
elements:
- {name: 'Google', description: 'Google', link: 'https://www.google.com.ua/intl/en/about/', imageUrl: 'google.svg'}
- {name: 'GDG Lviv', description: 'GDG Lviv - Open and volunteer geek community', link: 'http://lviv.gdg.org.ua', imageUrl: 'gdg-lviv.svg'}
- {name: "Google", description: "Google", link: "https://www.google.com.ua/intl/en/about/", imageUrl: "google.svg"}
- {name: "GDG Lviv", description: "GDG Lviv - Open and volunteer geek community", link: "http://lviv.gdg.org.ua", imageUrl: "gdg-lviv.svg"}
-
group: 'With support of'
group: "With support of"
elements:
- {name: 'Google', description: 'Google', link: 'https://www.google.com.ua/intl/en/about/', imageUrl: 'google.svg'}
- {name: 'GDG Lviv', description: 'GDG Lviv - Open and volunteer geek community', link: 'http://lviv.gdg.org.ua', imageUrl: 'gdg-lviv.svg'}
- {name: 'GDG[x]', description: 'GDG[x] - Yeah, we can fix that', link: 'https://github.com/gdg-x', imageUrl: 'gdg-x.svg'}
- {name: "Google", description: "Google", link: "https://www.google.com.ua/intl/en/about/", imageUrl: "google.svg"}
- {name: "GDG Lviv", description: "GDG Lviv - Open and volunteer geek community", link: "http://lviv.gdg.org.ua", imageUrl: "gdg-lviv.svg"}
- {name: "GDG[x]", description: "GDG[x] - Yeah, we can fix that", link: "https://github.com/gdg-x", imageUrl: "gdg-x.svg"}
-
group: 'Information partners'
group: "Information partners"
elements:
- {name: 'Google', description: 'Google', link: 'https://www.google.com.ua/intl/en/about/', imageUrl: 'google.svg'}
- {name: 'GDG Lviv', description: 'GDG Lviv - Open and volunteer geek community', link: 'http://lviv.gdg.org.ua', imageUrl: 'gdg-lviv.svg'}
- {name: 'GDG[x]', description: 'GDG[x] - Yeah, we can fix that', link: 'https://github.com/gdg-x', imageUrl: 'gdg-x.svg'}
- {name: 'Google', description: 'Google', link: 'https://www.google.com.ua/intl/en/about/', imageUrl: 'google.svg'}
- {name: 'GDG Lviv', description: 'GDG Lviv - Open and volunteer geek community', link: 'http://lviv.gdg.org.ua', imageUrl: 'gdg-lviv.svg'}
- {name: 'GDG[x]', description: 'GDG[x] - Yeah, we can fix that', link: 'https://github.com/gdg-x', imageUrl: 'gdg-x.svg'}
- {name: 'Google', description: 'Google', link: 'https://www.google.com.ua/intl/en/about/', imageUrl: 'google.svg'}
- {name: 'GDG Lviv', description: 'GDG Lviv - Open and volunteer geek community', link: 'http://lviv.gdg.org.ua', imageUrl: 'gdg-lviv.svg'}
- {name: 'GDG[x]', description: 'GDG[x] - Yeah, we can fix that', link: 'https://github.com/gdg-x', imageUrl: 'gdg-x.svg'}
- {name: "Google", description: "Google", link: "https://www.google.com.ua/intl/en/about/", imageUrl: "google.svg"}
- {name: "GDG Lviv", description: "GDG Lviv - Open and volunteer geek community", link: "http://lviv.gdg.org.ua", imageUrl: "gdg-lviv.svg"}
- {name: "GDG[x]", description: "GDG[x] - Yeah, we can fix that", link: "https://github.com/gdg-x", imageUrl: "gdg-x.svg"}
- {name: "Google", description: "Google", link: "https://www.google.com.ua/intl/en/about/", imageUrl: "google.svg"}
- {name: "GDG Lviv", description: "GDG Lviv - Open and volunteer geek community", link: "http://lviv.gdg.org.ua", imageUrl: "gdg-lviv.svg"}
- {name: "GDG[x]", description: "GDG[x] - Yeah, we can fix that", link: "https://github.com/gdg-x", imageUrl: "gdg-x.svg"}
- {name: "Google", description: "Google", link: "https://www.google.com.ua/intl/en/about/", imageUrl: "google.svg"}
- {name: "GDG Lviv", description: "GDG Lviv - Open and volunteer geek community", link: "http://lviv.gdg.org.ua", imageUrl: "gdg-lviv.svg"}
- {name: "GDG[x]", description: "GDG[x] - Yeah, we can fix that", link: "https://github.com/gdg-x", imageUrl: "gdg-x.svg"}

View file

@ -2,45 +2,54 @@
date: "2014-10-24"
dateReadable: "October 24"
tracks:
- {title: "Android"}
- {title: "Web & Cloud"}
- {title: "Community"}
- {title: "Android", color: "#90be4e"}
- {title: "Web & Cloud", color: "#03a9f4"}
- {title: "Community", color: "#e91e63"}
timeslots:
- {
startTime: "09:00",
endTime: "10:00",
slots: [001]
sessionIds: [001]
}
- {
startTime: "10:00",
endTime: "10:45",
slots: [002, 003, 004]
sessionIds: [002, 003, 004]
}
- {
startTime: "11:00",
endTime: "11:45",
slots: [003, 004]
sessionIds: [003, 404, 004]
}
- {
startTime: "12:00",
endTime: "11:45",
sessionIds: [307]
}
-
date: "2014-10-25"
dateReadable: "October 25"
tracks:
- {title: "Android"}
- {title: "Web & Cloud"}
- {title: "Community"}
- {title: "Android", color: "#90be4e"}
- {title: "Web & Cloud", color: "#03a9f4"}
timeslots:
- {
startTime: "10:00",
endTime: "10:45",
slots: [001, 002, 003]
sessionIds: [404, 002]
}
- {
startTime: "11:00",
endTime: "11:45",
slots: [002, 003]
sessionIds: [002, 003]
}
- {
startTime: "13:00",
endTime: "13:45",
slots: [003]
sessionIds: [003]
}
- {
startTime: "14:00",
endTime: "15:00",
sessionIds: [503]
}

View file

@ -1,45 +1,50 @@
-
id: 307
title: "Coffee Break"
place: "Hall"
service: true
-
id: 503
title: "Lunch break"
place: "Dining room"
service: true
-
id: 001
title: "Material design: Visual style and imagery"
description: "This session will reveal the invisible structures behind the material design system. Designers will show how to use the new color systems, typographic strategies, and the underlying grids that hold it together. They will show how imagery and the new framework material rendering can make apps more interesting and communicate more quickly."
track: "Android"
subtype: workshop
speakers: [3]
language: en
color: "#90be4e"
complexity: "Intermediate"
-
id: 002
title: "Building Cloud-powered wearable Apps"
description: "Android wear extends the Android platform to a new generation of wearable devices. The user experience is designed specifically for wearables. In this session youll see how to use the Android Wear SDK to build a connected cloud-powered application. Using Android Studio and its cloud extensions, youll see how to build an app that listens for changes in stock prices, and notifies a wearable device. Youll also see how to use voice controls on the device to trigger interactions with the app, such as buying or selling the stock after a notification. Call to action: Get the SDK and start building apps today!"
track: "Web & Cloud"
subtype: presentation
speakers: [4, 5]
language: en
color: "#03a9f4"
complexity: "Beginner"
-
id: 003
title: "The world is your playground - go global with Google"
description: "More than ever before, developing for global audience is a necessity than a luxury in today's world. Are you ready ... where to start? what does it entail? how do I do it? how to promote in local markets? This talk will address above questions for android, chrome and web developers. In our journey of the where, what and how, we will take an in-depth look at various internationalization and localization tools & strategies available to you."
track: "Community"
subtype: presentation
speakers: [4]
language: en
color: "#e91e63"
complexity: "Expert"
-
id: 004
title: "Polymer: Interacting with Google Services using nothing but HTML"
description: "Google has 1M APIs and services. Every API is different! Learn how you can interact with Google services without writing code! Designing your UI so it works across multiple screen sizes is no longer a nice to have, it is *the* way to build for the web. Using Polymer, we'll cover how to create robust, responsive elements that work across all platforms."
track: "Web & Cloud"
subtype: keynote
speakers: [6]
language: uk
color: "#03a9f4"
complexity: "Beginner"
-
id: 005
title: "Test: Interacting with Google Services using nothing but HTML"
description: "Google has 1M APIs and services. Every API is different! Learn how you can interact with Google services without writing code! Designing your UI so it works across multiple screen sizes is no longer a nice to have, it is *the* way to build for the web. Using Polymer, we'll cover how to create robust, responsive elements that work across all platforms."
track: "Web & Cloud"
subtype: keynote
speakers: [7]
language: en
color: "#03a9f4"
complexity: "Expert"

View file

@ -4,17 +4,17 @@
{% for day in site.data.schedule %}
<div class="schedule-table col-lg-8 col-md-10 col-md-offset-1">
<h4 class="schedule-table-heading">{{ day.dateReadable }}</h4>
<div class="timeslot stream-header stick-header">
<div class="stream-header-label">Day {{ forloop.index }}</div>
<div class="timeslot track-header stick-header">
<div class="track-header-label">Day {{ forloop.index }}</div>
<div class="timeslot-elements flexbox-wrapper">
{% for track in day.tracks %}
{% assign trackColWidth = 12 | divided_by: forloop.length %}
<div class="stream-header-slot col-md-{{ trackColWidth }} flexbox-item-height hidden-xs">
<h5 class="stream-header-title">{{ track.title }}</h5>
<div class="track-header-slot col-md-{{ trackColWidth }} flexbox-item-height hidden-xs">
<h5 class="track-header-title">{{ track.title }}</h5>
</div>
{% endfor %}
<div class="stream-header-slot col-xs-12 visible-xs">
<h5 class="slot-detail stream-header-title"></h5>
<div class="track-header-slot col-xs-12 visible-xs">
<h5 class="slot-detail track-header-title"></h5>
</div>
</div>
</div>
@ -31,14 +31,18 @@
</time>
</div>
<div class="timeslot-elements flexbox-wrapper">
{% for slot in timeslot.slots %}
{% for slot in timeslot.sessionIds %}
{% assign slotColWidth = 12 | divided_by: forloop.length %}
{% assign slotIndex = forloop.index0 %}
{% if slot != 404 %}
{% for session in site.data.sessions %}
{% if slot == session.id %}
<div class="slot col-md-{{ slotColWidth }} col-xs-12 flexbox-item-height" data-slot-detail="{{ session.track }}" data-toggle="modal" data-target="#sessionDetail-{{ session.id }}" style="border-top-color: {{ session.color }}">
<div class="slot-content" style="border-right-color: {{ session.color }}">
{% if slot == session.id and session.service == null %}
<div class="slot col-md-{{ slotColWidth }} col-xs-12 flexbox-item-height" data-slot-detail="{{ day.tracks[slotIndex].title }}" data-toggle="modal" data-target="#sessionDetail-{{ session.id }}">
<div class="color-line" style="background: {{ day.tracks[slotIndex].color }}"></div>
<div class="slot-content" style="border-right-color: {{ day.tracks[slotIndex].color }}">
<h5 class="slot-title" itemprop="name">{{ session.title }}</h5>
<span class="slot-language">{{session.language | upcase}}</span>
<p class="slot-complexity">Complexity: <span>{{ session.complexity }}</span></p>
<ul class="slot-speakers">
{% for speaker in site.data.speakers %}
{% for session_speaker in session.speakers %}
@ -54,8 +58,19 @@
</ul>
</div>
</div>
{% elsif slot == session.id and session.service != null %}
<div class="slot col-md-{{ slotColWidth }} col-xs-12 service-slot flexbox-item-height" data-slot-detail="{{ session.place }}">
<div class="color-line"></div>
<div class="slot-content">
<h5 class="slot-title" itemprop="name">{{ session.title }}</h5>
</div>
</div>
{% endif %}
{% endfor %}
{% else %}
<div class="slot col-md-{{ slotColWidth }} hidden-xs blank-col flexbox-item-height"></div>
{% endif %}
{% endfor %}
</div>
</div>

View file

@ -1,4 +1,4 @@
<!-- Begin Speakers Modals -->
<!-- Begin Sessions Modals -->
<div class="modals" class="modals">
{% for session in site.data.sessions %}
<div class="modal fade text-left people-modal" id="sessionDetail-{{ session.id }}" tabindex="-1" role="dialog" aria-labelledby="sessionDetailLabel-{{ session.id }}" aria-hidden="true">

View file

@ -25,7 +25,7 @@
{% endif %}
{% if page.permalink == '/schedule/' %}
{% include session-modals.html %}
{% include sessions-modals.html %}
{% endif %}
{% include analytics.html %}
@ -51,7 +51,7 @@
<script type="text/javascript">
$(document).ready(function () {
var navHeight = $('#top-header').height();
var headerHeight = $('.stream-header').first().height();
var headerHeight = $('.track-header').first().height();
$('.stick-header').stick_in_parent({sticky_class: 'sticky', offset_top: navHeight});
$('.stick-label').stick_in_parent({offset_top: navHeight + headerHeight});
});

View file

@ -1,3 +1,9 @@
$speaker-image-size: 40px;
$schedule-border: 1px solid #e7e7e7;
$title-font-size: 25px;
$label-width: 100px;
$small-label-width: 80px;
.schedule {
.schedule-table {
margin-bottom: 90px;
@ -15,30 +21,30 @@
}
.timeslot {
background: #fff;
border-top: 1px solid #e7e7e7;
border-left: 1px solid #e7e7e7;
border-top: $schedule-border;
border-left: $schedule-border;
&:last-child {
border-bottom: 1px solid #e7e7e7;
border-bottom: $schedule-border;
}
}
.stream-header {
.track-header {
z-index: 10;
transition: $base-transition;
&.sticky {
box-shadow: 0 0 5px rgba(0, 0, 0, .2), 0 1px 0 rgba(255, 255, 255, .15);
}
}
.stream-header-label {
.track-header-label {
position: absolute;
padding: 10px 15px 20px;
max-width: 137px;
width: $label-width;
text-align: left;
margin: 0;
font-size: 25px;
font-size: $title-font-size;
line-height: 1;
@media (max-width: 767px) {
font-size: 18px;
max-width: 90px;
width: $small-label-width;
}
span {
font-size: 20px;
@ -48,7 +54,7 @@
}
}
.timeslot-label {
@extend .stream-header-label;
@extend .track-header-label;
position: relative;
float: left;
display: block;
@ -65,11 +71,11 @@
}
.timeslot-elements {
overflow: hidden;
margin-left: 100px;
margin-left: $label-width;
transition: $base-transition;
@media (max-width: 767px) {
display: block;
margin-left: 80px;
margin-left: $small-label-width;
}
}
.slot-title {
@ -81,87 +87,104 @@
font-size: 18px;
}
}
.stream-header-title {
.track-header-title {
@extend .slot-title;
}
.stream-header-slot {
.track-header-slot {
padding: 10px 15px 10px;
text-align: left;
transition: $base-transition;
border-right: 1px solid #e7e7e7;
border-right: $schedule-border;
user-select: none;
@media (max-width: 767px) {
border-top: 0;
border-left: 1px solid #e7e7e7;
border-left: $schedule-border;
}
&:first-child {
border-left: 1px solid #e7e7e7;
border-left: $schedule-border;
@media (max-width: 767px) {
border-top: 0;
}
}
}
.slot {
@extend .stream-header-slot;
@extend .track-header-slot;
padding: 0;
border-top-width: 5px;
border-top-style: solid;
@media (max-width: 767px) {
border-top: 1px solid #e7e7e7 !important;
}
&:first-child {
@media (max-width: 767px) {
border-top: 0;
}
}
&:hover {
cursor: pointer;
@media (max-width: 767px) {
border-top: $schedule-border;
}
&.blank-col {
cursor: default;
}
&.service-slot {
@extend .blank-col;
min-height: 120px;
@media (max-width: 767px) {
min-height: 90px;
}
}
}
.color-line {
height: 5px;
position: absolute;
display: block;
width: 100%;
top: 0;
background: #ccc;
}
.slot-content {
padding: 20px 15px 30px;
background: #fff;
transform: translateY(-5px);
transform: translateY(0);
transition: $base-transition;
@media (max-width: 767px) {
padding-bottom: 20px;
border-right-width: 5px;
border-right-style: solid;
transform: translateY(0);
}
border-right-color: #ccc;
&:hover {
transform: translateY(0);
}
}
&:hover {
transform: translateY(5px);
}
}
.slot-language {
position: absolute;
font-size: 11px;
right: 15px;
top: 20px;
}
.slot-complexity {
font-size: 13px;
span {
color: #555;
}
}
ul {
list-style: none;
padding: 0;
margin-top: 20px;
margin-top: 15px;
}
li {
font-size: 16px;
margin-bottom: 5px;
min-height: 40px;
@media (max-width: 767px) {
font-size: 14px;
}
}
.speaker-img {
width: 40px;
height: 40px;
width: $speaker-image-size;
height: $speaker-image-size;
border: 2px solid #fff;
position: absolute;
box-shadow: 0 1px 0 rgba(0,0,0,.15),0 1px 2px rgba(0,0,0,.2);
}
.speaker-name {
line-height: 30px;
margin-left: 48px;
line-height: $speaker-image-size - 12;
margin-left: $speaker-image-size + 8;
}
.speaker-position {
color: #555;

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View file

@ -21,8 +21,13 @@
});
$('.stream-header').each(function() {
var scheduleFirstSlotText = $(this).closest('.schedule-table').find('.slot').first().data('slotDetail');
$('.track-header').each(function() {
var slot = $(this).closest('.schedule-table').find('.slot').first();
var scheduleFirstSlotText;
while(scheduleFirstSlotText === undefined) {
scheduleFirstSlotText = slot.data('slotDetail');
slot = slot.next();
}
$(this).find('.slot-detail').html(scheduleFirstSlotText);
});
@ -48,7 +53,7 @@
var header = $('#top-header');
var logo = $('#logo-header .logo');
var buyButton = $('#right-nav-button');
var topOffset = header.height() + $('.stream-header').height();
var topOffset = header.height() + $('.track-header').height();
if (scroll >= 100) {
header.addClass('after-scroll');
@ -69,7 +74,7 @@
var offsetActivator = topOffset + $(this).find('.slot-title').height();
if(currentPosition <= offsetActivator && currentPosition >= 0) {
$('.stream-header.sticky').find('.slot-detail').html($(this).data('slotDetail'));
$('.track-header.sticky').find('.slot-detail').html($(this).data('slotDetail'));
}
});
});

File diff suppressed because one or more lines are too long

View file

@ -140,6 +140,10 @@
<li class="title slider-item animated fadeInRight hidden">Material design: Visual style and imagery</li>
@ -193,6 +197,10 @@
<li class="title slider-item animated fadeInRight hidden">Building Cloud-powered wearable Apps</li>
@ -260,6 +268,10 @@
<li class="title slider-item animated fadeInRight hidden">Building Cloud-powered wearable Apps</li>
@ -324,6 +336,10 @@
<li class="title slider-item animated fadeInRight hidden">Polymer: Interacting with Google Services using nothing but HTML</li>
@ -383,6 +399,10 @@
@ -506,6 +526,10 @@
<h4>Material design: Visual style and imagery</h4>
<span class="theme-language"><span class="caption">Language: </span>en</span>
<p class="theme-description">This session will reveal the invisible structures behind the material design system. Designers will show how to use the new color systems, typographic strategies, and the underlying grids that hold it together. They will show how imagery and the new framework material rendering can make apps more interesting and communicate more quickly.</p>
@ -582,6 +606,10 @@
<h4>Building Cloud-powered wearable Apps</h4>
<span class="theme-language"><span class="caption">Language: </span>en</span>
<p class="theme-description">Android wear extends the Android platform to a new generation of wearable devices. The user experience is designed specifically for wearables. In this session youll see how to use the Android Wear SDK to build a connected cloud-powered application. Using Android Studio and its cloud extensions, youll see how to build an app that listens for changes in stock prices, and notifies a wearable device. Youll also see how to use voice controls on the device to trigger interactions with the app, such as buying or selling the stock after a notification. Call to action: Get the SDK and start building apps today!</p>
@ -676,6 +704,10 @@
<h4>Building Cloud-powered wearable Apps</h4>
<span class="theme-language"><span class="caption">Language: </span>en</span>
<p class="theme-description">Android wear extends the Android platform to a new generation of wearable devices. The user experience is designed specifically for wearables. In this session youll see how to use the Android Wear SDK to build a connected cloud-powered application. Using Android Studio and its cloud extensions, youll see how to build an app that listens for changes in stock prices, and notifies a wearable device. Youll also see how to use voice controls on the device to trigger interactions with the app, such as buying or selling the stock after a notification. Call to action: Get the SDK and start building apps today!</p>
@ -770,6 +802,10 @@
<h4>Polymer: Interacting with Google Services using nothing but HTML</h4>
@ -857,6 +893,10 @@

File diff suppressed because one or more lines are too long

4
css/main.min.css vendored

File diff suppressed because one or more lines are too long

View file

@ -21,8 +21,13 @@
});
$('.stream-header').each(function() {
var scheduleFirstSlotText = $(this).closest('.schedule-table').find('.slot').first().data('slotDetail');
$('.track-header').each(function() {
var slot = $(this).closest('.schedule-table').find('.slot').first();
var scheduleFirstSlotText;
while(scheduleFirstSlotText === undefined) {
scheduleFirstSlotText = slot.data('slotDetail');
slot = slot.next();
}
$(this).find('.slot-detail').html(scheduleFirstSlotText);
});
@ -48,7 +53,7 @@
var header = $('#top-header');
var logo = $('#logo-header .logo');
var buyButton = $('#right-nav-button');
var topOffset = header.height() + $('.stream-header').height();
var topOffset = header.height() + $('.track-header').height();
if (scroll >= 100) {
header.addClass('after-scroll');
@ -69,7 +74,7 @@
var offsetActivator = topOffset + $(this).find('.slot-title').height();
if(currentPosition <= offsetActivator && currentPosition >= 0) {
$('.stream-header.sticky').find('.slot-detail').html($(this).data('slotDetail'));
$('.track-header.sticky').find('.slot-detail').html($(this).data('slotDetail'));
}
});
});

2
js/scripts.min.js vendored

File diff suppressed because one or more lines are too long