-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathfoot.html
165 lines (132 loc) · 7.34 KB
/
foot.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
</div> <!-- slides -->
</div> <!-- reveal -->
<!--<img id="timeline" class="timeline" style="display: none;">-->
<div class="timeline" id="line" />
<script src="lib/js/head.min.js"></script>
<script src="js/reveal.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script>
// Full list of configuration options available here:
// https://github.com/hakimel/reveal.js#configuration
Reveal.initialize({
// Display controls in the bottom right corner
controls: false,
// Display a presentation progress bar
progress: true,
center: true,
// Display the page number of the current slide
slideNumber: false,
// Enable the slide overview mode
overview: true,
// Turns fragments on and off globally
fragments: true,
// The "normal" size of the presentation, aspect ratio will be preserved
// when the presentation is scaled to fit different resolutions. Can be
// specified using percentage units.
// width: 960,
// height: 700,
// Factor of the display size that should remain empty around the content
margin: 0.05, // increase?
// Bounds for smallest/largest possible scale to apply to content
minScale: 0.5,
maxScale: 5.0,
theme: Reveal.getQueryHash().theme, // available themes are in /css/theme
transition: Reveal.getQueryHash().transition || 'none', // default/cube/page/concave/zoom/linear/fade/none
// Push each slide change to the browser history
history: true,
// Enable keyboard shortcuts for navigation
keyboard: true,
// Vertical centering of slides
center: true,
// Enables touch navigation on devices with touch input
touch: true,
// Loop the presentation
loop: false,
// Flags if the presentation is running in an embedded mode,
// i.e. contained within a limited portion of the screen
embedded: false,
// Number of milliseconds between automatically proceeding to the
// next slide, disabled when set to 0, this value can be overwritten
// by using a data-autoslide attribute on your slides
autoSlide: 0,
// Stop auto-sliding after user input
autoSlideStoppable: true,
// Enable slide navigation via mouse wheel
mouseWheel: false,
// Hides the address bar on mobile devices
hideAddressBar: true,
// Opens links in an iframe preview overlay
previewLinks: false,
// Transition speed
transitionSpeed: 'default', // default/fast/slow
// Transition style for full page slide backgrounds
backgroundTransition: 'none', // default/none/slide/concave/convex/zoom
// Number of slides away from the current that are visible
viewDistance: 3,
// Parallax background image
//parallaxBackgroundImage: '', // e.g. "'https://s3.amazonaws.com/hakim-static/reveal-js/reveal-parallax-1.jpg'"
// Parallax background size
//parallaxBackgroundSize: '' // CSS syntax, e.g. "2100px 900px"
chalkboard: {
// optionally load pre-recorded chalkboard drawing from file
src: "chalkboard.json",
},
// Optional libraries used to extend on reveal.js
dependencies: [
{ src: 'lib/js/classList.js', condition: function() { return !document.body.classList; } },
{ src: 'plugin/markdown/marked.js', condition: function() { return !!document.querySelector( '[data-markdown]' ); } },
{ src: 'plugin/markdown/markdown.js', condition: function() { return !!document.querySelector( '[data-markdown]' ); } },
{ src: 'plugin/highlight/highlight.js', async: true, callback: function() { hljs.initHighlightingOnLoad(); } },
{ src: 'plugin/zoom-js/zoom.js', async: true, condition: function() { return !!document.body.classList; } },
{ src: 'plugin/notes/notes.js', async: true, condition: function() { return !!document.body.classList; } }
],
keyboard: {
67: function() { RevealChalkboard.toggleNotesCanvas() }, // toggle notes canvas when 'c' is pressed
66: function() { RevealChalkboard.toggleChalkboard() }, // toggle chalkboard when 'b' is pressed
46: function() { RevealChalkboard.clear() }, // clear chalkboard when 'DEL' is pressed
8: function() { RevealChalkboard.reset() }, // reset chalkboard data on current slide when 'BACKSPACE' is pressed
68: function() { RevealChalkboard.download() }, // downlad recorded chalkboard drawing when 'd' is pressed
},
});
Reveal.addEventListener( 'slidechanged', function( event ) {
var timeline = $(event.currentSlide).data('timeline')
if (timeline) {
$("#timeline").attr('src', timeline)
$("#timeline").show()
} else {
$("#timeline").hide()
}
var years = $(event.currentSlide).data('years')
if (years) {
var min_year = 1982
var max_year = 2021
var all_years = String(years).split(" ")
var num_years = all_years.length;
var svg_lines = ['<svg class="timeline" id="line"\
version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve"\
width="100%" height="90">\
<line x1="0" y1="60" x2="100%" y2="60" stroke="#ff7f00" stroke-width="20"/>'];
for (var i = 0; i < num_years; i++) {
year = all_years[i];
x = (year - min_year) / (max_year - min_year) * 100
x_text = x + 0.1
text = year
line = '<circle\
style="fill:#ffffff;stroke:#ff7f00;stroke-width:10;"\
cx="' + x + '%"\
cy="60"\
r="20" />\
<text x="' + x_text + '%" y="32" fill="#ff7f00" font-size="40" font-family="sans-serif" font-weight="bold">' + text + '</text>'
svg_lines.push(line)
}
//$("#line").html('<circle style="fill:#ffffff;stroke:#ff7f00;stroke-width:5;" cx="400" cy="85" r="10" />')
svg_lines.push('</svg>')
$("#line").html(svg_lines.join(' '))
$("#line").show()
} else {
$("#line").hide()
}
} );
</script>
</body>
</html>