-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.htm
executable file
·254 lines (235 loc) · 11.6 KB
/
index.htm
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
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
<!DOCTYPE html>
<html lang="pt-br" id="main">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="stylesheet" type="text/css" href="style.css?ver=18">
<link href="https://fonts.googleapis.com/css2?family=Source+Sans+Pro:wght@600&display=swap" rel="stylesheet">
<link href="https://cdn-images.mailchimp.com/embedcode/classic-10_7.css" rel="stylesheet" type="text/css">
<title>Fugere urbem!</title>
<script src="jquery-3.5.1.min.js"></script>
<!-- UserReport Global Tag -->
<script src="https://sak.userreport.com/bucolico/launcher.js" async id="userreport-launcher-script"></script>
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-37240876-3"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-37240876-3');
gtag('config', 'UA-37240876-3', { 'optimize_id': 'GTM-WZHLZWH'});
</script>
<script>
// select the image to show: START
const queryString = window.location.search;
const urlParams = new URLSearchParams(queryString);
theID = Number(urlParams.get('id'));
let everyPicture = [
{id:'1', name:'Bruna Quevedo', link:'https://www.instagram.com/bru.quevedo', imageName:'2017-02-03-DSC_0708'},
{id:'2', name:'Bruna Quevedo', link:'https://www.instagram.com/bru.quevedo', imageName:'BUCOLICO_009'},
{id:'3', name:'Bruna Quevedo', link:'https://www.instagram.com/bru.quevedo', imageName:'BUCOLICO_001'},
{id:'4', name:'Bruna Quevedo', link:'https://www.instagram.com/bru.quevedo', imageName:'BUCOLICO_002'},
{id:'5', name:'Bruna Quevedo', link:'https://www.instagram.com/bru.quevedo', imageName:'BUCOLICO_003'},
{id:'6', name:'Bruna Quevedo', link:'https://www.instagram.com/bru.quevedo', imageName:'BUCOLICO_004'},
{id:'7', name:'Bruna Quevedo', link:'https://www.instagram.com/bru.quevedo', imageName:'BUCOLICO_005'},
{id:'8', name:'Bruna Quevedo', link:'https://www.instagram.com/bru.quevedo', imageName:'BUCOLICO_006'},
{id:'9', name:'Bruna Quevedo', link:'https://www.instagram.com/bru.quevedo', imageName:'BUCOLICO_007'},
{id:'10', name:'Bruna Quevedo', link:'https://www.instagram.com/bru.quevedo', imageName:'BUCOLICO_008'},
{id:'11', name:'Rafa Munduruca', link:'https://www.instagram.com/munduruca', imageName:'MUNDURUCA_001'},
{id:'12', name:'Bruna Quevedo', link:'https://www.instagram.com/bru.quevedo', imageName:'BUCOLICO_011_v2'},
{id:'13', name:'Kitty Yoshioka', link:'https://www.instagram.com/yoshioka.kitty', imageName:'KITTY_YOSHIOKA_001'},
{id:'14', name:'Maisa Coutinho', link:'https://www.instagram.com/maisacoutinho', imageName:'MAISA_COUTINHO_001'}
]
if (theID == '0' || theID == '' || theID == null) {
theID = everyPicture.length;
};
let thePicture = everyPicture.find(picture=> picture.id==theID);
// select the image to show: END
</script>
</head>
<body>
<div id="thecanvas"></div>
<script>
document.getElementById("thecanvas").style.backgroundImage = "url(pictures/"+thePicture['imageName']+".jpg)" ;
</script>
<div id="footer">
<nav id="themenu">
<a class="link-assinar-mc">assinar</a>
<a class="link-feedback" href="https://feedback.userreport.com/8a46b23d-a6fe-4f38-8d4d-0c4affb1b1ec/" onclick="event.preventDefault(); _urq.push(['Feedback_Open'])">feedback</a>
<a class="link-texto-sobre">sobre</a>
<!-- <a class="link-texto-apresentacao">apresentação</a> -->
</nav>
<div class="section">
<div class="icon menu">
<span></span>
<span></span>
<span></span>
</div>
</div>
</div>
<div id="texto-sobre">
<p>Fugere urbem é uma expressão em latim que significa <em>fugir da cidade</em>. Originalmente usada pelo escritor latino Horácio, foi adotada como lema pela literatura árcade para simbolizar o poeta que se desloca da vida agitada da cidade e vai para a calma zona rural.</p>
<p>A proposta de <strong>bucoli.co</strong> é aproveitar alguns instantes do enorme tempo que passamos olhando para telas para fugir da poluição visual urbana. A cada semana, há uma nova imagem de uma paisagem bucólica, de artistas que convidamos. É uma oportunidade de fugir um pouco do estresse do confinamento e <em>voltar às origens</em>.</p>
<p><strong>Fugere urbem!</strong></p>
<p class="credits">Bruna, Tiago e pixel</p>
<p class="credits">Foto: <a id="author" target="_blank"></a></p>
</div>
<script>
var theAuthor = document.getElementById("author");
theAuthor.setAttribute("href", thePicture['link']);
theAuthor.innerHTML = thePicture['name'];
</script>
<div id="texto-apresentacao">
<p>Bem vindo ao bucoli.co!</p>
<p>Experimente parar por alguns instantes e desacelerar o ritmo frenético ao qual o dia a dia e o excesso de informações te levam.</p>
<p>Aqui você verá uma bela imagem de paisagem e sua tela se transformará em um portal para um lugar prazeroso e tranquilo.<br>Contemple, explore, preste atenção aos detalhes. É um momento de quebra da rotina.</p>
<p>Assine (através do menu) nosso e-mail semanal para mergulhar nesta experiência e ser avisado quando houver uma nova imagem.</p>
</div>
<div id="mc_embed_signup">
<form action="https://bucoli.us4.list-manage.com/subscribe/post?u=7a46eb73e2e61d571e0d62cd2&id=41e6c07567" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
<div id="mc_embed_signup_scroll">
<h2>assinar</h2>
<div class="indicates-required"><span class="asterisk">*</span> obrigatório</div>
<div class="mc-field-group">
<label for="mce-EMAIL">Endereço de Email <span class="asterisk">*</span>
</label>
<input type="email" value="" name="EMAIL" class="required email" id="mce-EMAIL">
</div>
<div class="mc-field-group">
<label for="mce-FNAME">Primeiro Nome <span class="asterisk">*</span>
</label>
<input type="text" value="" name="FNAME" class="required" id="mce-FNAME">
</div>
<div class="mc-field-group">
<label for="mce-LNAME">Úlitmo Nome <span class="asterisk">*</span>
</label>
<input type="text" value="" name="LNAME" class="required" id="mce-LNAME">
</div>
<div id="mce-responses" class="clear">
<div class="response" id="mce-error-response" style="display:none"></div>
<div class="response" id="mce-success-response" style="display:none"></div>
</div> <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
<div style="position: absolute; left: -5000px;" aria-hidden="true"><input type="text" name="b_7a46eb73e2e61d571e0d62cd2_41e6c07567" tabindex="-1" value=""></div>
<div class="clear"><input type="submit" value="assinar" name="subscribe" id="mc-embedded-subscribe" class="button"></div>
</div>
</form>
</div>
<script>
// Show and Hide elements: START
$(".icon").on("click", function () {
$(this).toggleClass("open");
$("#themenu").toggleClass("show");
$("#thecanvas").toggleClass("show");
$("#mc_embed_signup").removeClass("show");
$("#texto-sobre").removeClass("show");
$("#texto-apresentacao").removeClass("show");
});
$("#thecanvas").on("click", function () {
$(".icon").removeClass("open");
$("#themenu").removeClass("show");
$("#thecanvas").removeClass("show");
$("#mc_embed_signup").removeClass("show");
$("#texto-sobre").removeClass("show");
$("#texto-apresentacao").removeClass("show");
});
$(".link-assinar-mc").on("click", function () {
$("#mc_embed_signup").toggleClass("show");
$("#texto-sobre").removeClass("show");
$("#texto-apresentacao").removeClass("show");
});
$(".link-texto-sobre").on("click", function () {
$("#texto-sobre").toggleClass("show");
$("#mc_embed_signup").removeClass("show");
$("#texto-apresentacao").removeClass("show");
});
$(".link-texto-apresentacao").on("click", function () {
$("#texto-apresentacao").toggleClass("show");
$("#texto-sobre").removeClass("show");
$("#mc_embed_signup").removeClass("show");
});
$(".link-feedback").on("click", function () {
$("#texto-sobre").removeClass("show");
$("#texto-apresentacao").removeClass("show");
$("#mc_embed_signup").removeClass("show");
});
// Show and Hide elements: END
// to show or not the welcoming text: START
function storageAvailable(type) {
var storage;
try {
storage = window[type];
var x = '__storage_test__';
storage.setItem(x, x);
storage.removeItem(x);
return true;
}
catch(e) {
return e instanceof DOMException && (
// everything except Firefox
e.code === 22 ||
// Firefox
e.code === 1014 ||
// test name field too, because code might not be present
// everything except Firefox
e.name === 'QuotaExceededError' ||
// Firefox
e.name === 'NS_ERROR_DOM_QUOTA_REACHED') &&
// acknowledge QuotaExceededError only if there's something already stored
(storage && storage.length !== 0);
}
}
if ( !Number(urlParams.get('bvd')) ) {
if (storageAvailable('localStorage')) {
if(!localStorage.getItem('firstvisit')) {
document.addEventListener('DOMContentLoaded', function() {
$(".icon").toggleClass("open");
$("#themenu").toggleClass("show");
$("#thecanvas").toggleClass("show");
$("#texto-apresentacao").toggleClass("show");
$("#mc_embed_signup").removeClass("show");
$("#texto-sobre").removeClass("show");
});
}
}
} else {
if ( Number(urlParams.get('bvd')) != 1 ) {
} else {
document.addEventListener('DOMContentLoaded', function() {
$(".icon").toggleClass("open");
$("#themenu").toggleClass("show");
$("#thecanvas").toggleClass("show");
$("#texto-apresentacao").toggleClass("show");
$("#mc_embed_signup").removeClass("show");
$("#texto-sobre").removeClass("show");
});
}
}
localStorage.setItem('firstvisit', 1);
// to show or not the welcoming text: END
</script>
<script src='https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js'></script><script>(function($) {window.fnames = new Array(); window.ftypes = new Array();fnames[0]='EMAIL';ftypes[0]='email';fnames[1]='FNAME';ftypes[1]='text';fnames[2]='LNAME';ftypes[2]='text'; /**
* Translated default messages for the $ validation plugin.
* Locale: PT_PT
*/
$.extend($.validator.messages, {
required: "Campo de preenchimento obrigatório.",
remote: "Por favor, corrija este campo.",
email: "Por favor, introduza um endereço eletrónico válido.",
url: "Por favor, introduza um URL válido.",
date: "Por favor, introduza uma data válida.",
dateISO: "Por favor, introduza uma data válida (ISO).",
number: "Por favor, introduza um número válido.",
digits: "Por favor, introduza apenas dígitos.",
creditcard: "Por favor, introduza um número de cartão de crédito válido.",
equalTo: "Por favor, introduza de novo o mesmo valor.",
accept: "Por favor, introduza um ficheiro com uma extensão válida.",
maxlength: $.validator.format("Por favor, não introduza mais do que {0} caracteres."),
minlength: $.validator.format("Por favor, introduza pelo menos {0} caracteres."),
rangelength: $.validator.format("Por favor, introduza entre {0} e {1} caracteres."),
range: $.validator.format("Por favor, introduza um valor entre {0} e {1}."),
max: $.validator.format("Por favor, introduza um valor menor ou igual a {0}."),
min: $.validator.format("Por favor, introduza um valor maior ou igual a {0}.")
});}(jQuery));var $mcj = jQuery.noConflict(true);</script>
</body>
</html>