-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathIssue1.html
144 lines (120 loc) · 6.54 KB
/
Issue1.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
<!DOCTYPE html>
<html>
<head>
<title>Issue 1</title>
<meta name="DC.title" lang="en" content="Issue 1" />
<meta name="DC.creator" content="Alessia Cioffi" />
<meta name="DCTERMS.issued" scheme="DCTERMS.W3CDTF" content="" />
<meta name="DC.format" scheme="DCTERMS.IMT" content="text/html" />
<meta name="DC.type" scheme="DCTERMS.DCMIType" content="Text" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="https://fonts.googleapis.com/css2?family=Proza+Libre&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<script src="script/info.js"></script>
<script src="script/fileFiller.js"></script>
<script src="script/main.js"></script>
<script>
document.addEventListener('readystatechange', event => {
if (event.target.readyState === "complete") { hidePrevAndNext('issue1'); }
});
</script>
<link rel="stylesheet" type="text/css" href="style/IndexStyle.css">
</head>
<body onload="metadataViewer('issue1'), findOrigin(), verifyCSS()">
<div id="metaDiv" style="display:none">
<div id="darkBackground">
</div>
<div id="aboutMetaContents">
<div id="curDiv">
<h1 id="aboutMetaTitle">About Metadata Viewer</h1>
<button class="btn" onclick="closeMetaContent()"><i class="fa fa-close"></i></button>
</div>
<p id="aboutMetaContent">Each article refers to <span class="toColor">people, places, events, concepts,</span> etc. that are related to each other and create a complex <span class="toColor">network of references</span>. In this section you can find all the metadata of all the articles of the current issue. You can:</p>
<ul id="aboutMetaUl">
<li><span class="toColor">overview</span> the relevant data and metadata and <b>scroll to the relevant part of the article</b>, i.e. where the metadata is located (e.g. metadata location will be temporarily highlighted);</li>
<li><span class="toColor">automatically <b>identify</b></span><b> present data for the current article</b>, whose metadata box background is light blue.</li>
<li><b><span class="toColor">sort</span> them</b> in many ways (i.e. alphabetically, document order, by frequency)</li>
<li>get an idea about some data if you don't know them by reading their wikipedia page, simply by clicking on the <span class="toColor"><b>wikipedia button</b></span>!</li>
</ul>
</div>
</div>
<div id = "flex-container">
<!-- main navigation navbar -->
<div class="header">
<a id="logo" href="index.html">Art&Life</a>
<input class="menu-btn" type="checkbox" id="menu-btn" />
<label class="menu-icon" for="menu-btn">
<span class="navicon"></span>
</label>
<div class="topnav">
<a href="index.html">Home</a>
<a href="disclaimer.html">Disclaimer</a>
<a href="documentation.html">Documentation</a>
<a href="about.html">About</a>
</div>
</div>
<div id="content-meta-wrapper">
<div id="content">
<!-- selector navbar -->
<ul id="selectorNav" class="stickynav">
<li class="dropdown"><a class="dropbtn">Issues</a>
<div class="dropdown-content" id="DynamicGeneratorPowerButton2000">
</div>
</li>
<li class="dropdown"><a class="dropbtn">Articles</a>
<div class="dropdown-content" id="changeArguments">
</div>
</li>
<li class="dropdown"><a class="dropbtn">Themes</a>
<div class="dropdown-content">
<a onclick="changeCSS('../style/IndexStyle.css')">Default Style</a>
<a onclick="changeCSS('../style/bodoni/Bodoni.css')">Bodoni</a>
<a onclick="changeCSS('../style/liberty/Liberty.css')">Liberty</a>
<a onclick="changeCSS('../style/bauhaus/bauhaus.css')">Bauhaus</a>
<a onclick="changeCSS('../style/1980/1980.css')">Early Eighties</a>
<a onclick="changeCSS('../style/nineties/anni90.css')">The Nineties</a>
<a onclick="changeCSS('../style/minimalFuture/futuro.css')">Minimalistic Future (2021-2025)</a>
</div>
</li>
<li><a class="buttonIssue" id="Origin">Source</a></li>
</ul>
<button id="prev" onclick="prevArticle()"/></button>
<button id="next" onclick="nextArticle()"/></button>
<div id="issue1">
<div id="coverPage1">
<iframe src="cover_pages/cover_page1.html" name="coverPage1" frameborder="0" border="0" cellspacing="0"></iframe>
</div>
</div>
</div> <!-- si chiude il div content -->
<script> fillTheGaps();</script>
<div id="metadata"> <!-- div che contiene il metadata viewer -->
<ul id="selectorNav" class="stickynav">
<li class="dropdown"><a class="dropbtn" onclick="showMetaContent()">About Metadata</a>
<!-- <div class="dropdown-content">
<a class="buttonIssue" id="contentToShow" style="display: none;">Each article refers to people, places, events, concepts, etc. that are related to each other and create a complex network of references. In this section you can find all the metadata of all the articles of the current issue. You can:
<ul>
<li>overview the relevant data and metadata and <b>scroll to the relevant part of the article</b>, i.e. where the metadata is located (e.g. metadata location will be temporarily highlighted);</li>
<li>automatically <b>identify present data for the current article</b>, whose metadata box background is light blue.</li>
<li><b>sort them</b> in many ways (i.e. alphabetically, document order, by frequency)</li>
<li>get an idea about some data if you don't know them by reading their wikipedia page, simply by clicking on the <b>wikipedia button</b>!</li>
</ul>
</a>
</div> -->
</li>
<li class="dropdown"><a class="dropbtn">Order by</a>
<div class="dropdown-content">
<a class="buttonIssue" id="sort" onclick="sortOccurrences('class')">Alphabet</a>
<a class="buttonIssue" id="appearanceSort" onclick="sortOccurrences('data-position')">Appearence</a>
<a class="buttonIssue" id="frequencySort" onclick="sortByFreq()">Frequency</a>
</div>
</li>
</ul>
<ul id="listIssue"></ul>
</div> <!-- si chiude il div che contiene il metadata viewer -->
</div> <!-- si chiude il div #content-meta-wrapper -->
<div class="footer">
<h5>© Art&Life: Created by Alessia Cioffi, Sara Coppini and Ariele Santello</h5>
</div>
</div> <!-- si chiude il div flex-container -->
</body>
</html>