-
Notifications
You must be signed in to change notification settings - Fork 1
/
index.html
227 lines (197 loc) · 10.3 KB
/
index.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
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
{% extends '_base.html' %}
{% from '_macros.html' import barhead, photoside %}
{#
{% block extra_css %}
<style>
/* stuff here */
</style>
{% endblock extra_css %}
#}
{% block header %}
<div id="header">
{% if hero == 'gallery' %}
<div id="gallery"><div id="gallery-inner"></div></div>
{% else %}
<div class='map-bump'>
<div id="eclipse-map"></div>
</div>
{% endif %}
<section id="masthead" class="wrap">
<div class="core">
<h2>View of a lifetime</h2>
<h1>Coverage of the 2017 total solar eclipse above Oregon</h1>
<div class="sharing">
<a title="Share on Facebook" class="social social-facebook fa-stack fa-lg" href="http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fcloud.registerguard.com%2Feclipse%2F" target="_blank" rel="nofollow">
<i class="fa fa-circle fa-stack-2x" aria-hidden="true"></i><i class="fa fa-facebook fa-stack-1x fa-inverse" aria-hidden="true"></i>
<span class="off">Share on Facebook</span>
</a>
<a title="Tweet this" class="social social-twitter fa-stack fa-lg" href="https://twitter.com/intent/tweet?text=Coverage%20of%20the%202017%20solar%20eclipse%20above%20Oregon%20%7C%20%23Eclipse2017&url=http%3A%2F%2Fcloud.registerguard.com%2Feclipse%2F&via=registerguard" target="_blank" rel="nofollow">
<i class="fa fa-circle fa-stack-2x" aria-hidden="true"></i><i class="fa fa-twitter fa-stack-1x fa-inverse" aria-hidden="true"></i>
<span class="off">Tweet this</span>
</a>
<a title="Share on Reddit" class="social social-reddit fa-stack fa-lg" href="https://www.reddit.com/submit?url=http%3A%2F%2Fcloud.registerguard.com%2Feclipse%2F" target="_blank" rel="nofollow">
<i class="fa fa-circle fa-stack-2x" aria-hidden="true"></i><i class="fa fa-reddit-alien fa-stack-1x fa-inverse" aria-hidden="true"></i>
<span class="off">Share on Reddit</span>
</a>
<a title="Share on LinkedIn" class="social social-tumblr fa-stack fa-lg" href="https://www.linkedin.com/shareArticle?url=http%3A%2F%2Fcloud.registerguard.com%2Feclipse%2F&title=Eclipse%202017" target="_blank" rel="nofollow">
<i class="fa fa-circle fa-stack-2x" aria-hidden="true"></i><i class="fa fa-linkedin fa-stack-1x fa-inverse" aria-hidden="true"></i>
<span class="off">Share on LinkedIn</span>
</a>
<a title="Eclipse mode" class="social eclipse fa-stack fa-lg" href="#eclipse" rel="nofollow" onClick="toggle();ga('send', 'event', 'eclipse', 'eclipse-mode', 'toggle');">
<i class="fa fa-circle fa-stack-2x" aria-hidden="true"></i><i id="do-not-press" class="fa fa-moon-o fa-stack-1x fa-inverse" aria-hidden="true"></i>
<span class="off">Eclipse mode</span>
</a>
</div>
</div> <!-- /.core -->
</section> <!-- /#masthead -->
</div><!-- /#header -->
{% endblock header %}
{% block content %}
<div class="flex">
<div class="flex-left">
<section id="intro">
{% if intro %}
<h3 class="head">Introduction</h3>
<p>Those in the right spot just after 10 a.m. on Monday, Aug. 21 will be treated to a rare sight. The shadow of the Moon will move from the north-central Oregon coast, over Corvallis and Salem, right through Madras, and out of the state into Idaho before 10:30.</p>
<div id="countdown"></div>
<p>Getting into place might be tricky, however, thanks to the <a href="http://registerguard.com/rg/news/local/35704820-75/eclipse-apocalypse.html.csp">one million estimated visitors</a> to the state. Heavy traffic is expected within the path of totality, the 70-mile-wide swath where a full solar eclipse will be visible. Campsites in and near the path have been <a href="http://registerguard.com/rg/news/local/35499966-75/new-oregon-eclipse-campsites-quickly-sell-out.html.csp">booked</a> for months, even after state parks officials opened up an extra 1,000 spots. Likewise, hotel rooms have been in high demand.</p>
<p>Would-be viewers that can't make it into place for the eclipse will still be able to see a partial eclipse of 90 percent or more throughout the state.</p>
<p>Regardless of where you are in Oregon, experts are cautioning observers to not look directly at the sun without <a href="https://eclipse2017.nasa.gov/safety">proper eye protection</a>. Only during "totality" is it safe to look at an eclipse without specialized glasses.</p>
<p>The Register-Guard will have several reporters and photographers spread throughout the state to bring you the latest information. If you're not able to witness the eclipse in totality, be sure to follow along as we share photos and reports. If you are able to see the event, check back for a full recap in the afternoon.</p>
<p class="off-credit">Background photo: An eclipse on July 11, 2010 captured by Jay M. Pasachoff, Muzhou Lu, and Craig Malamut Williams College Eclipse Expedition. (Williams College/<a href="https://www.nasa.gov/topics/solarsystem/sunearthsystem/main/News071510-Eclipse-composite.html" target="_blank">NASA</a>)</p>
{% else %}
<h3 class="head">Scenes from social media</h3>
<div class="storify-wrapper">
<div class="storify"><iframe src="//storify.com/registerguard/2017-total-solar-eclipse-over-oregon/embed?header=false&border=false" width="100%" height="750" frameborder="no" allowtransparency="true"></iframe><script src="//storify.com/registerguard/2017-total-solar-eclipse-over-oregon.js?header=false&border=false"></script><noscript>[<a href="//storify.com/registerguard/2017-total-solar-eclipse-over-oregon" target="_blank">View the story "2017 total solar eclipse over Oregon" on Storify</a>]</noscript></div> <p class="off-credit">Background photo: An eclipse on July 11, 2010 captured by Jay M. Pasachoff, Muzhou Lu, and Craig Malamut Williams College Eclipse Expedition. (Williams College/<a href="https://www.nasa.gov/topics/solarsystem/sunearthsystem/main/News071510-Eclipse-composite.html" target="_blank">NASA</a>)</p>
</div> <!-- /.storify-wraper -->
{% endif %}
</section><!-- /#intro -->
{% if ads == 1 %}
<hr>
<!-- //////////////////// Medium Rectangle 1 \\\\\\\\\\\\\\\\\\\\ -->
<p class="tip">Advertisement</p>
<div class="advert">
<div id="medium-rectangle-1">
<script>googletag.cmd.push(function() { googletag.display('medium-rectangle-1'); });</script>
</div>
</div>
<!-- \\\\\\\\\\\\\\\\\\\\ Medium Rectangle 1 //////////////////// -->
{% endif %}
</div><!-- /.left -->
<hr class="mobile">
<div class="flex-middle">
<h3 class="head">Latest … </h3>
<section id="stories">
{% for s in stories %}
{% if s.template == "photo-side" %}
{{ photoside(s.headline, s.url, s.img, s.tease, s.pubdate) }}
{% elif s.template == "bar-head" %}
{{ barhead(s.headline, s.url, s.img, s.tease, s.pubdate) }}
{% endif %}
{% endfor %}
<button id="show">Show more</button>
</section><!-- /#stories -->
</div><!-- /.middle -->
<hr class="mobile">
<div class="flex-right">
<section id="resources">
<h3 class="head">Resources</h3>
<ul class="li1">
{% for r in resources %}
{% if r.status == 'on' %}
<li><a href="{{ r.url }}" target="_blank">{{ r.info }}</a></li>
{% endif %}
{% endfor %}
</ul>
</section><!-- /#resources -->
<hr>
<section id="videos">
<h3 class="head">Eclipse videos</h3>
{% if brightcove_or_youtube == 'BC' %}
<div style="display: block; position: relative; max-width: 100%; margin-top: 10px;">
<div style="padding-top: 56.25%;">
<video
id='brightcove-5460247434001'
data-playlist-id='{{ bc_playlist }}'
data-account='4350897271001'
data-player='S1xKuygiXZ'
data-embed='default'
data-application-id
class='video-js'
controls
style='width: 100%; height: 100%; position: absolute; top: 0px; bottom: 0px; right: 0px; left: 0px;'>
</video>
</div>
</div>
<ol class="vjs-playlist"></ol>
<script type="text/javascript">
var player;
function setupIMA(){
player.ima3({
serverUrl: 'https://pubads.g.doubleclick.net/gampad/ads?sz=1280x720&iu=/30582678/RGM/news/local&impl=s&gdfp_req=1&env=vp&output=vast&unviewed_position_start=1&url=%5Breferrer_url%5D&description_url=%5Bdescription_url%5D&correlator=%5Btimestamp%5D',
prerollTimeout: 5000,
postrollTimeout: 5000,
loadingSpinner: true,
debug: false,
adTechOrder: ['html5']
});
player.one('play', function(){
player.on('contentupdate', function(){
player.ima3.adsLoader.contentComplete();
})
});
}
document.addEventListener("DOMContentLoaded", function() {
videojs('brightcove-5460247434001').ready(function() {
player = this;
setupIMA();
player.on('adstart', function(event) {
ga('send', 'event', 'video', 'videoAd', 'videoAd');
});
player.on("play", function(event) {
ga('send', 'event', 'video', 'videoStart', 'videoStart');
});
});
});
</script>
<script src="//players.brightcove.net/4350897271001/S1xKuygiXZ_default/index.min.js"></script>
{% else %}
<div class="mm">
<iframe width="560" height="315" src="https://www.youtube-nocookie.com/embed/videoseries?list=PL3_irPfizGSQ6iwYUeqQFxk4rlEUATWFG" frameborder="0" allowfullscreen></iframe>
</div><!-- /.mm -->
{% endif %}
<footer>
<p class="jump"><a href="http://registerguard.com/rg/news/local/35684029-75/eclipse-101-your-introduction-to-the-aug.-21-total-solar-eclipse-in-oregon.csp" target="_blank">More <span>eclipse videos</span> »</a></p>
</footer>
</section><!-- /#videos -->
{% if ads == 1 %}
<hr>
<!-- //////////////////// Medium Rectangle 2 \\\\\\\\\\\\\\\\\\\\ -->
<p class="tip">Advertisement</p>
<div class="advert">
<div id="medium-rectangle-2">
<script>googletag.cmd.push(function() { googletag.display('medium-rectangle-2'); });</script>
</div>
</div>
<!-- \\\\\\\\\\\\\\\\\\\\ Medium Rectangle 2 //////////////////// -->
{% endif %}
</div><!-- /.right -->
</div><!-- /.flex -->
{% if hero == 'gallery' %}
{# photos up top, map down below #}
<h3 class="head map-head-shove">
Aug. 21, 2017, path of totality
</h3>
<div id="eclipse-map"></div>
{% endif %}
<div class="tagline">
<hr>
<p>Page designed by <a href="mailto:[email protected]">Rob Denton</a>. Follow him on Twitter <a href="http://twitter.com/robertrdenton">@robertrdenton</a>.</p>
</div>
{% endblock %}
{% block extra_js %}
<script>
/* stuff here */
getGal({{ gallery }});
</script>
{% endblock extra_js %}