-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathshowFolder.html
235 lines (149 loc) · 8.62 KB
/
showFolder.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
228
229
230
231
232
233
234
235
<!DOCTYPE html>
<html lang="pt">
<head>
<link rel="icon" href="images/codeIcon.png">
<script src="https://rawgit.com/google/code-prettify/master/loader/run_prettify.js?autoload=true&skin=Default&lang=css" defer=""></script>
<!--Import Google Icon Font-->
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<!--Import materialize.css-->
<link type="text/css" rel="stylesheet" href="css/materialize.min.css" media="screen,projection"/>
<!--importar o meu código CSS-->
<link rel="stylesheet" type="text/css" href="css/style.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<!--Let browser know website is optimized for mobile-->
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
</head>
<main>
<!--Side Nav for Mobile-->
<ul id="slide-out" class="side-nav hide-on-large-only">
<br>
<!--
<div class="input-field" style="width: 93%; padding-left: 5%">
<i class="material-icons prefix" style="padding-left: 4%; padding-top: 5%">search</i>
<input type="text" id="autocomplete-input" class="autocomplete">
<label for="autocomplete-input">Search here</label>
</div>-->
<li><a href="https://www.facebook.com/ricardo.petronilho98"><i class="fa fa-facebook-square" style="font-size:36px"></i>My facebook</a></li>
<br>
<li><a href="https://github.com/RicardoPetronilho98"><i class="fa fa-github" style="font-size:36px"></i>My github</a></li>
<br>
<li><a href="https://stackoverflow.com/users/8709667/ricardo-petronilho?"><i class="fa fa-stack-overflow" style="font-size:36px"></i>My stackoveflow</a></li>
<br>
<li><a href="repositories.html"><i class="fa fa-code" style="font-size:36px"></i>My repositories</a></li>
<br>
<li><div class="divider"></div></li>
<br>
<li><a href="settings.html"><i class="material-icons" style="font-size:36px">settings</i>Settings</a></li>
</ul>
<!--Navigation bar for Mobile-->
<nav class="hide-on-large-only">
<!--botão para abrir a Side Bar-->
<a href="#" data-activates="slide-out" class="button-collapse"><i class="material-icons">menu</i></a>
<a href="index.html" class="brand-logo right-align" style="padding-left: 2%">Ricardo Petronilho</a>
</nav>
<!--Navigation bar for Desktop-->
<nav class="hide-on-med-and-down">
<div class="container">
<div class="nav-wrapper">
<a href="index.html" class="brand-logo waves-effect">Ricardo Petronilho</a>
<ul class="right">
<li><a class="waves-effect" href="repositories.html">My repositories</a>
<li><a class="waves-effect" href="https://github.com/RicardoPetronilho98">github</a></li>
<li><a class="waves-effect" href="https://www.facebook.com/ricardo.petronilho98">facebook</a></li>
<li><a class="waves-effect" href="https://stackoverflow.com/users/8709667/ricardo-petronilho?">stackoverflow</a></li>
</ul>
</div>
</div>
</nav>
<div class="container">
<br>
<center>
<!--botão de download dos ficheiros em formato ZIP-->
<a id="downloadButton" class="waves-effect waves-light btn"><i class="material-icons right">file_download</i>Download ALL .ZIP</a>
</center>
<br>
<!--Table for Desktop-->
<table class="highlight bordered hide-on-med-and-down">
<thead>
<tr>
<th>Name</th>
<th>type</th>
</tr>
</thead>
<tbody id="HTMLloop"></tbody>
</table>
<!--Table for Mobile-->
<table class="highlight bordered hide-on-large-only">
<thead>
<tr>
<th>Name</th>
</tr>
</thead>
<tbody id="HTMLloop2"></tbody>
</table>
</div>
<div class="fixed-action-btn" style="bottom: 20px; right: 24px;">
<a href="javascript:history.back()" class="waves-effect waves-light btn"><i class="material-icons right">arrow_back</i>Voltar</a>
</div>
</main>
<!--<div class="footer">
<div>
<span>©2017 Ricardo Petronilho</span>
</div>
</div>-->
<!--Import jQuery before materialize.js-->
<script type="text/javascript" src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<script type="text/javascript" src="js/materialize.min.js"></script>
<script type="text/javascript" src="js/myScript.js"></script>
<script type="text/javascript">
$('document').ready(function(){ //JQuery library functions
$('ul.tabs').tabs();
//side Nav for Mobile
$('.button-collapse').sideNav({
menuWidth: 300, // Default is 300
edge: 'left', // Choose the horizontal origin
closeOnClick: true, // Closes side-nav on <a> clicks, useful for Angular/Meteor
draggable: true, // Choose whether you can drag to open on touch screens,
onOpen: function(el) { }, // 'rounded' is the class I'm applying to the toast) { }, // A function to be called when sideNav is opened
onClose: function(el) { }, // A function to be called when sideNav is closed
});
// Initialize collapse button
$(".button-collapse").sideNav();
//-----------------------------------------------------------------------------------------------------
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function(){
if (this.readyState == 4 && this.status == 200){
//cria um objeto javascript para poder ser obtida a informação dele
var JSONcode = JSON.parse(this.responseText);
var i;
var HTMLcode = "";
var HTMLcode2 = "";
//cria dinamicamente a listagem de ficheiros e pastas para Desktop
for (i = 0; i < JSONcode.length; i++){
//caso seja um ficheiro apresenta a imagem de ficheiro e manda o link para o showFile.html sendo enviado a diretoria e o ficheiro a ser apresentado como argumento no link
if (JSONcode[i].type == "file") HTMLcode += "<tr><td><a href=showFile.html?path=" + getParameterByName("path") + "&file=" + i + "&rep=" + getParameterByName("rep") + ">" + JSONcode[i].name + "</a></td><td>file</td></tr>";
//caso seja uma pasta apresenta a imagem da pasta e manda o link para o este mesmo ficheiro mas com argumentos diferentes no link para que o linkCONTENT se altere dinamicamente
else HTMLcode += "<tr><td><a href=showFolder.html?path=" + JSONcode[i].path + "&rep=" + getParameterByName("rep") + "><i class=material-icons style=font-size:20px>folder</i>" + JSONcode[i].name + "</a></td><td>folder</td></tr>";
}
//cria dinamicamente a listagem de ficheiros e pastas para Mobile
for (i = 0; i < JSONcode.length; i++){
//caso seja um ficheiro apresenta a imagem de ficheiro e manda o link para o showFile.html sendo enviado a diretoria e o ficheiro a ser apresentado como argumento no link
if (JSONcode[i].type == "file") HTMLcode2 += "<tr><td><a href=showFile.html?path=" + getParameterByName("path") + "&file=" + i + "&rep=" + getParameterByName("rep") + ">" + JSONcode[i].name + "</a></td></tr>";
//caso seja uma pasta apresenta a imagem da pasta e manda o link para o este mesmo ficheiro mas com argumentos diferentes no link para que o linkCONTENT se altere dinamicamente
else HTMLcode2 += "<tr><td><a href=showFolder.html?path=" + JSONcode[i].path + "&rep=" + getParameterByName("rep") + "><i class=material-icons style=font-size:20px>folder</i>" + JSONcode[i].name + "</a></td></tr>";
}
//coloca tudo o html dinamico aqui para ser apresentado para Desktop
document.getElementById("HTMLloop").innerHTML = HTMLcode;
//coloca tudo o html dinamico aqui para ser apresentado para Mobile
document.getElementById("HTMLloop2").innerHTML = HTMLcode2;
}
};
//consoante a diretoria e o repositorio onde nos encontramos, o link é gerado
var linkCONTENT = "https://api.github.com/repos/RicardoPetronilho98/" + getParameterByName("rep") + "/contents/" + getParameterByName("path");
xmlhttp.open("GET", linkCONTENT, true);
xmlhttp.send();
//-----------------------------------------------------------------------------------------------------
document.getElementById("downloadButton").href = "https://api.github.com/repos/RicardoPetronilho98/" + getParameterByName("rep") + "/zipball/master";
});
</script>
</html>