Skip to content

Commit

Permalink
updated navigation
Browse files Browse the repository at this point in the history 
* `flyTo` has temporarily been replaced by `actions.panTo`
  • Loading branch information
@almereyda
almereyda committed Oct 9, 2015
1 parent 57183f3 commit d877d04
Show file tree
Hide file tree
Showing 2 changed files with 74 additions and 17 deletions.
35 changes: 33 additions & 2 deletions index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -50,10 +50,11 @@
</head>

<body>
<input type="checkbox" id="drawer-toggle" name="drawer-toggle" />
<input type="checkbox" id="drawer-toggle" name="drawer-toggle" checked />
<label for="drawer-toggle" id="drawer-toggle-label"></label>
<div id="drawer">
<iframe width="100%" height="166" scrolling="no" frameborder="no" src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/226287454&amp;color=7b2ed7&amp;auto_play=false&amp;hide_related=true&amp;show_comments=true&amp;show_user=true&amp;show_reposts=false"></iframe>
<!-- <iframe width="100%" height="166" scrolling="no" frameborder="no" src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/226287454&amp;color=7b2ed7&amp;auto_play=false&amp;hide_related=true&amp;show_comments=true&amp;show_user=true&amp;show_reposts=false"></iframe> -->
<iframe width="100%" height="166" scrolling="no" frameborder="no" src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/226856704&amp;color=a331e6&amp;auto_play=false&amp;hide_related=true&amp;show_comments=true&amp;show_user=true&amp;show_reposts=false"></iframe>
</div>

<div id="map"></div>
Expand Down Expand Up @@ -82,6 +83,21 @@ <h2>alleins im Mellow Park</h2>
<div class="slide">
<h2>circus homo novus</h2>
<img src="/circus_blak.svg" alt="Der Circus!" />
<h3>timetable</h3>
<h4>dj café</h4>
<p>
<div>16-18 almereyda</div>
<div>18-22 dub "<a href="http://goldmund.berlin" target="_blank">goldmund</a>" peteph</div>
</p>
<h4>rambazamba</h4>
<p>
<div>22-23:30 nicht lars lavendel</div>
<div>23:30 ~ 1 ghost notes</div>
<div>1 ~ 2:30 mahäc and the incredible damengedeck</div>
<div>2,5-4,5=-2 unkraut nonkey tunes</div>
<div>⚝ walking whales</div>
</p>
<h1>Zusatznote</h1>
<p>Wer in dieser Bitterkälte gerne draußen ist, kann auch schon 18 Uhr zum DJ Café eintrudeln.</p>
<p>Zum Fingerfoodbuffet wird eine Suppe gereicht.</p>
</div>
Expand Down Expand Up @@ -126,6 +142,21 @@ <h1>Bis gleich</h1>
<!-- Demo module -->
<script src="main.js"></script>

<!-- Piwik -->
<script type="text/javascript">
var _paq = _paq || [];
_paq.push(['trackPageView']);
_paq.push(['enableLinkTracking']);
(function() {
var u="//piwik.allmende.io/";
_paq.push(['setTrackerUrl', u+'piwik.php']);
_paq.push(['setSiteId', 12]);
var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
g.type='text/javascript'; g.async=true; g.defer=true; g.src=u+'piwik.js'; s.parentNode.insertBefore(g,s);
})();
</script>
<noscript><p><img src="//piwik.allmende.io/piwik.php?idsite=12" style="border:0;" alt="" /></p></noscript>
<!-- End Piwik Code -->

</body>
</html>
56 changes: 41 additions & 15 deletions main.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ var map = (function () {
'use strict';

var locations = {
'Mellow Park': [52.455391527403584, 13.563791973750744, 17.574999999999985]
'Mellow Park': [52.455391527403584, 13.563791973750744, 15.574999999999985]
};

var map_start_location = locations['Mellow Park'];
Expand Down Expand Up @@ -63,6 +63,9 @@ function click(el) {
};

// md_template alternative via http://bl.ocks.org/anonymous/b0b6ecf496e4e83db62b

/* map styling */

var mellowpark = (function() {
L.AwesomeMarkers.Icon.prototype.options.prefix = 'ion';

Expand All @@ -88,6 +91,8 @@ var mellowpark = (function() {
};


/* data */

var Zuwegung = new L.geoJson.ajax("zuwegung.geojson", {style:Wege, interactive: false})
.addTo(map);

Expand All @@ -103,6 +108,8 @@ var mellowpark = (function() {
var Koepenick = new L.Marker([52.458577, 13.5815192], {icon: train, interactive: false})
.addTo(map);

/* Odyssey init */

var seq = O.Triggers.Sequential();
// enanle keys to move
O.Triggers.Keys().left().then(seq.prev, seq)
Expand All @@ -112,101 +119,120 @@ var mellowpark = (function() {
click(document.querySelectorAll('.prev')).then(seq.prev, seq)

var slides = O.Actions.Slides('slides');
var progress = O.UI.DotProgress('dots').count(2);
var progress = O.UI.DotProgress('dots').count(6);

/* WiP to stash the 12 blocks below */

/*
var actionTemplate = new O.Parallel
var story = O.Story()
var actions = {
'landing': actionTemplate(
MellowPark.getLatLng()
)
};
*/

/* sequential narration */

var story = O.Story()
.addState(
seq.step(0),
O.Parallel(
map.actions.setView(MellowPark.getLatLng(), 17),
map.actions.panTo(MellowPark.getLatLng(), 15, {duration: 7}),
slides.activate(0),
progress.activate(0)
)
)
.addState(
seq.step(1),
O.Parallel(
map.actions.setView(Pavillion.getLatLng(), 19),
map.actions.panTo(Pavillion.getLatLng(), 19, {duration: 3}),
slides.activate(1),
progress.activate(1)
)
)
.addState(
seq.step(2),
O.Parallel(
map.actions.setView(MellowPark.getLatLng(), 16),
map.actions.panTo(MellowPark.getLatLng(), 16, {duration: 4}),
slides.activate(2),
progress.activate(2)
)
)
.addState(
seq.step(3),
O.Parallel(
map.actions.panTo(Spindlersfeld.getLatLng(), {duration: 1}),
map.actions.panTo(Spindlersfeld.getLatLng(), 13, {duration: 3.3}),
slides.activate(3),
progress.activate(3)
)
)
.addState(
seq.step(4),
O.Parallel(
map.actions.panTo(Koepenick.getLatLng(), {duration: 1}),
map.actions.panTo(Koepenick.getLatLng(), 13, {duration: 1.2}),
slides.activate(4),
progress.activate(4)
)
)
.addState(
seq.step(5),
O.Parallel(
map.actions.setView([52.4530558, 13.5715072], 15.5),
map.actions.panTo([52.4530558, 13.5715072], 15.5, {duration: 1.7}),
slides.activate(5),
progress.activate(5)
)
)

/* progress bar steps */

.addState(
progress.step(0),
O.Parallel(
map.actions.setView(MellowPark.getLatLng(), 17),
map.actions.panTo(MellowPark.getLatLng(), 24, {duration: 7}),
slides.activate(0),
progress.activate(0)
)
)
.addState(
progress.step(1),
O.Parallel(
map.actions.setView(Pavillion.getLatLng(), 19),
map.actions.panTo(Pavillion.getLatLng(), 19, {duration: 3}),
slides.activate(1),
progress.activate(1)
)
)
.addState(
progress.step(2),
O.Parallel(
map.actions.setView(MellowPark.getLatLng(), 16),
map.actions.panTo(MellowPark.getLatLng(), 16, {duration: 4}),
slides.activate(2),
progress.activate(2)
)
)
.addState(
progress.step(3),
O.Parallel(
map.actions.panTo(Spindlersfeld.getLatLng(), {duration: 1}),
map.actions.panTo(Spindlersfeld.getLatLng(), 13, {duration: 3.3}),
slides.activate(3),
progress.activate(3)
)
)
.addState(
progress.step(4),
O.Parallel(
map.actions.panTo(Koepenick.getLatLng(), {duration: 1}),
map.actions.panTo(Koepenick.getLatLng(), 13, {duration: 1.2}),
slides.activate(4),
progress.activate(4)
)
)
.addState(
progress.step(5),
O.Parallel(
map.actions.setView([52.4530558, 13.5715072], 15.5),
map.actions.panTo([52.4530558, 13.5715072], 15.5, {duration: 1.7}),
slides.activate(5),
progress.activate(5)
)
Expand Down

0 comments on commit d877d04

Please sign in to comment.