Skip to content

Commit 977f572

Browse files
tareharttarehart
authored
Setting up an upcoming events calendar. (#9)
The events are based on the Google Calendar controlled by our RLBot account. Any other Google account can write to it if we invite them. I opted not to use Google's standard embed because it's fugly and not sensitive to client locale settings, incredibly. See http://sugi.github.io/jquery-gcal-flow/ to understand what's going on here. The parameters, template, and globalization stuff is all explained there. I set up an API key for us on the RLBot Google account.
1 parent 23dffb2 commit 977f572

13 files changed

+2545
-1
lines changed

‎.gitignore

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
*.iml
2+
.idea/

‎index.html

Lines changed: 61 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,16 @@
55
<meta name="viewport" content="width=device-width, initial-scale=1">
66
<title>RLBot</title>
77
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" integrity="sha384-WskhaSGFgHYWDcbwN70/dfYBj47jz9qbsMId/iRN3ewGhXQFZCSftd1LZCfmhktB" crossorigin="anonymous">
8+
<link rel="stylesheet" href="libs/gCalFlow/jquery.gcal_flow.css">
9+
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
10+
11+
<!--en-US appears to be baked into globalize.js already, horay.-->
12+
<script src="libs/globalize/globalize.js" type="text/javascript"></script>
13+
<script src="libs/globalize/cultures/globalize.culture.en-GB.js" type="text/javascript"></script>
14+
<script src="libs/globalize/cultures/globalize.culture.de.js" type="text/javascript"></script>
15+
<script src="libs/globalize/cultures/globalize.culture.nl.js" type="text/javascript"></script>
16+
<script src="libs/globalize/cultures/globalize.culture.pt.js" type="text/javascript"></script>
17+
<script type="text/javascript" src="libs/gCalFlow/jquery.gcal_flow.js"></script>
818

919
<style type="text/css">
1020
html, body {
@@ -62,6 +72,22 @@
6272
.twitch-card .card-title {
6373
color: white;
6474
}
75+
76+
.gCalFlow .gcf-header-block {
77+
background: #7289da;
78+
padding: 10px;
79+
}
80+
81+
.gCalFlow .gcf-item-block {
82+
padding: 2px 8px;
83+
}
84+
85+
.gCalFlow {
86+
width: 350px;
87+
height: 200px;
88+
margin-bottom: 15px;
89+
border: none;
90+
}
6591
</style>
6692
</head>
6793
<body>
@@ -140,12 +166,46 @@ <h5 class="card-title">Tournament</h5>
140166
</a>
141167
</div>
142168
<div class="col-lg-4">
169+
170+
<div id="gcf-simple">
171+
<div class="gcf-header-block">
172+
<div class="gcf-title-block">
173+
<span>Upcoming Events</span>
174+
</div>
175+
</div>
176+
<div class="gcf-item-container-block">
177+
<div class="gcf-item-block">
178+
<div class="gcf-item-header-block">
179+
<div class="gcf-item-date-block">
180+
<span class="gcf-item-daterange"></span>
181+
</div>
182+
<div class="gcf-item-title-block">
183+
<strong class="gcf-item-title"></strong>
184+
</div>
185+
</div>
186+
<div class="gcf-item-body-block">
187+
<div class="gcf-item-description">
188+
</div>
189+
<div class="gcf-item-location">
190+
</div>
191+
</div>
192+
</div>
193+
</div>
194+
</div>
195+
<script type="text/javascript">
196+
$('#gcf-simple').gCalFlow({
197+
calid: 'rlbotofficial%40gmail.com',
198+
auto_scroll: false,
199+
apikey: 'AIzaSyBQ40UqlMPexzWxTNd7EYtTrkoFF_DqpqM'
200+
});
201+
</script>
202+
143203
<iframe src="https://discordapp.com/widget?id=348658686962696195&theme=dark" width="350" height="500" allowtransparency="true" frameborder="0"></iframe>
144204
</div>
145-
146205
</div>
147206

148207
</div>
149208

150209
</body>
210+
151211
</html>

‎libs/gCalFlow/README.asciidoc

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
2+
jQuery gCalFlow plug-in
3+
======================
4+
5+
jQuery plug-in to format your google calendar feeds.
6+
7+
Description
8+
-----------
9+
10+
This plug-in provides a widget to show event list of
11+
your google calendar with configurable options and
12+
fully customizable HTML design template.
13+
14+
See http://sugi.github.io/jquery-gcal-flow/ for details
15+
or check examples.html.
16+
17+
License
18+
-------
19+
20+
MIT (http://www.opensource.org/licenses/MIT)
21+
22+
Author
23+
------
24+
25+
Tatsuki Sugiura <sugi@nemui.org>

‎libs/gCalFlow/ReleaseNote

Lines changed: 69 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,69 @@
1+
== v3.0.1 (2014-11-21)
2+
3+
* Fix logging function (it breaks all by js error)
4+
5+
== v3.0.0 (2014-11-20)
6+
7+
* Updates to use Google Calendar API v3
8+
* Timezone fix (show event date in browser local timezone)
9+
* Add link_item_location option
10+
11+
== v1.2.7 (2013-08-13)
12+
13+
* Set futureevents and singleevents to true on updates mode.
14+
15+
== v1.2.6 (2013-12-13)
16+
17+
* Fix minor typo on default item_description_as_html option.
18+
* Add minified version on dist archive.
19+
* Documentation fixes
20+
* Fix typo on sample code of documentation (gcf-simple).
21+
* Add globalize example.
22+
* Add docs for item_description_as_html and no_items_html
23+
24+
== v1.2.5 (2013-07-18)
25+
26+
* Fix timezone issue on all day event.
27+
(Wrong date was shown on all day event with Firefox
28+
and Chrome when system has negative timezone offset.)
29+
30+
== v1.2.4 (2013-05-25)
31+
32+
* Null update to fix download URL on jQuery Plugin Registry.
33+
34+
== v1.2.3 (2013-05-25)
35+
36+
* Add gh-pages branch as document.
37+
38+
== v1.2.2 (2013-05-25)
39+
40+
* Add date format feature with Globalize.
41+
* Fix design for IE8 & 10.
42+
* Add .gcf-item-location. (By torque)
43+
* Fix document typos. (By torque)
44+
* Add no_items_html option.
45+
46+
== v1.2.1 (2012-04-19)
47+
48+
* Fix timezone, end date on all day.
49+
50+
== v1.2.0 (2012-04-16)
51+
52+
* Fix date parser.
53+
* Add date range formatter.
54+
55+
== v1.1.0 (2012-04-13)
56+
57+
* More js and template options
58+
59+
== v1.0.0 (2012-04-06)
60+
61+
* Add upcoming mode.
62+
63+
== v0.2.0 (2012-04-05)
64+
65+
* Add autoscroll.
66+
67+
== v0.1.0 (2012-04-05)
68+
69+
* Initial version.

‎libs/gCalFlow/jquery.gcal_flow.css

Lines changed: 84 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,84 @@
1+
.gCalFlow {
2+
position: relative;
3+
width: 300px;
4+
height: 400px;
5+
float: left;
6+
font-size: 90%;
7+
overflow: hidden;
8+
text-decoration: none;
9+
padding-bottom: 0.5em; }
10+
.gCalFlow a, .gCalFlow a:visited, .gCalFlow a:hover {
11+
color: inherit;
12+
_color: black;
13+
background-color: transparent;
14+
text-decoration: none; }
15+
.gCalFlow a:hover {
16+
text-decoration: underline; }
17+
.gCalFlow .gcf-header-block {
18+
padding: 5px 4px; }
19+
.gCalFlow .gcf-title-block {
20+
font-weight: bold;
21+
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.3);
22+
color: white; }
23+
.gCalFlow .gcf-title-block a, .gCalFlow .gcf-title-block a:visited, .gCalFlow .gcf-title-block a:hover {
24+
_color: white; }
25+
.gCalFlow .gcf-last-update-block {
26+
font-size: 76%;
27+
text-align: right;
28+
bottom: 0;
29+
right: 0;
30+
padding-right: 4px;
31+
position: absolute; }
32+
.gCalFlow .gcf-item-container-block {
33+
position: relative;
34+
overflow: hidden;
35+
overflow-y: auto;
36+
height: 90%; }
37+
.gCalFlow .gcf-item-block {
38+
position: relative;
39+
overflow: hidden;
40+
border-bottom: 1px dashed #ccc;
41+
padding: 2px;
42+
margin: 2px 0; }
43+
.gCalFlow .gcf-item-header-block {
44+
white-space: nowrap;
45+
overflow: hidden; }
46+
.gCalFlow .gcf-item-date-block {
47+
font-size: 76%;
48+
font-weight: bold; }
49+
.gCalFlow .gcf-item-title-block {
50+
text-shadow: 0 1px 0 rgba(255, 255, 255, 0.9); }
51+
.gCalFlow .gcf-item-body-block {
52+
font-size: 80%;
53+
font-color: #999;
54+
max-height: 2.45em; }
55+
56+
.gCalFlow {
57+
border-style: solid;
58+
border-width: 1px;
59+
border-color: #ccc #999 #999 #ccc;
60+
-webkit-border-radius: 4px;
61+
-moz-border-radius: 4px;
62+
border-radius: 4px;
63+
background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#eee));
64+
background: -moz-linear-gradient(top, #fff, #eee);
65+
background: -o-linear-gradient(top, #fff, #eee);
66+
background: linear-gradient(to bottom, #fff, #eee);
67+
filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#ffffffff,EndColorStr=#ffeeeeee);
68+
zoom: 1;
69+
color: blak; }
70+
.gCalFlow .gcf-header-block {
71+
-webkit-border-top-left-radius: 4px;
72+
-webkit-border-top-right-radius: 4px;
73+
-moz-border-top-left-radius: 4px;
74+
-moz-border-top-right-radius: 4px;
75+
border-top-left-radius: 4px;
76+
border-top-right-radius: 4px;
77+
background: -webkit-gradient(linear, left top, left bottom, from(#AAB1DC), to(#3B4CA5));
78+
background: -moz-linear-gradient(top, #AAB1DC, #3B4CA5);
79+
background: -o-linear-gradient(top, #AAB1DC, #3B4CA5);
80+
background: linear-gradient(to bottom, #AAB1DC, #3B4CA5);
81+
filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#ffAAB1DC,EndColorStr=#ff3B4CA5);
82+
zoom: 1; }
83+
.gCalFlow .gcf-item-body-block {
84+
color: #333; }

0 commit comments

Comments
 (0)