-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathwelcome.html
465 lines (422 loc) · 16.5 KB
/
welcome.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
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
<!DOCTYPE html>
<!--
// https://search-id.org
//
// This file is part of search-id.org project.
//
// search-id is free software: you can redistribute it and/or modify
// it under the terms of the GNU General Public License as published by
// the Free Software Foundation, either version 3 of the License, or
// (at your option) any later version.
//
// search-id is distributed in the hope that it will be useful,
// but WITHOUT ANY WARRANTY; without even the implied warranty of
// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
// GNU General Public License for more details.
//
// You should have received a copy of the GNU General Public License
// along with this file. If not, see <http://www.gnu.org/licenses/>.
-->
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>search-id.org Home</title>
<style>
/* W3MOBILE.CSS 4.10 February 2018 by Jan Egil and Borge Refsnes */
html{box-sizing:border-box}*,*:before,*:after{box-sizing:inherit}
/* Extract from normalize.css by Nicolas Gallagher and Jonathan Neal git.io/normalize */
html{-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}
article,aside,details,figcaption,figure,footer,header,main,menu,nav,section,summary{display:block}
audio,canvas,progress,video{display:inline-block}progress{vertical-align:baseline}
audio:not([controls]){display:none;height:0}[hidden],template{display:none}
a{background-color:transparent;-webkit-text-decoration-skip:objects}
a:active,a:hover{outline-width:0}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}
dfn{font-style:italic}mark{background:#ff0;color:#000}
small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}
sub{bottom:-0.25em}sup{top:-0.5em}figure{margin:1em 40px}img{border-style:none}svg:not(:root){overflow:hidden}
code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}hr{box-sizing:content-box;height:0;overflow:visible}
button,input,select,textarea{font:inherit;margin:0}optgroup{font-weight:bold}
button,input{overflow:visible}button,select{text-transform:none}
button,html [type=button],[type=reset],[type=submit]{-webkit-appearance:button}
button::-moz-focus-inner, [type=button]::-moz-focus-inner, [type=reset]::-moz-focus-inner, [type=submit]::-moz-focus-inner{border-style:none;padding:0}
button:-moz-focusring, [type=button]:-moz-focusring, [type=reset]:-moz-focusring, [type=submit]:-moz-focusring{outline:1px dotted ButtonText}
fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:.35em .625em .75em}
legend{color:inherit;display:table;max-width:100%;padding:0;white-space:normal}textarea{overflow:auto}
[type=checkbox],[type=radio]{padding:0}
[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}
[type=search]{-webkit-appearance:textfield;outline-offset:-2px}
[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}
::-webkit-input-placeholder{color:inherit;opacity:0.54}
::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}
/* End extract */
html,body{font-family:Verdana,sans-serif;font-size:15px;line-height:1.5}html{overflow-x:hidden}
h1{font-size:36px}h2{font-size:30px}h3{font-size:24px}h4{font-size:20px}h5{font-size:18px}h6{font-size:16px}.w3-serif{font-family:serif}
h1,h2,h3,h4,h5,h6{font-family:"Segoe UI",Arial,sans-serif;font-weight:400;margin:10px 0}.w3-wide{letter-spacing:4px}
hr{border:0;border-top:1px solid #eee;margin:20px 0}
body
{
margin:0;
padding:0;
}
code
{
display:block;
font-size:0.7em;
padding:0.5em;
margin:0.5m;
border:1px solid gray;
border-left:1em solid gray;
}
a
{
color: rgba(5,103,255,1);
text-decoration: none;
}
a:hover
{
text-decoration: underline;
}
#revision
{
text-align:right;
color:gray;
font-size: 0.6em;
margin:0.2em;
}
.center
{
text-align:center;
}
.subtitle
{
font-size:0.8em;
color:gray;
}
.block0
{
text-align:center;
padding:0.2em;
padding-right:8vw;
background-color:rgba(255,255,255,1);
}
.block1
{
padding:1em;
background-color:rgba(255,255,255,1);
}
.block2
{
padding:1em;
background-color:rgba(243,243,243,1);
}
.box
{
padding:0.5em;
margin:0.5em;
margin-bottom:1em;
box-shadow: 0 6px 26px 0 rgba(0,0,0,.08);
background-color:rgba(255,255,255,1);
}
.tiles
{
display:flex;
flex-wrap: wrap;
align-items: center;
justify-content: center;
}
.tiles > div
{
max-width: 50em;
}
iframe
{
max-width:100%;
}
</style>
</head>
<body>
<div class='block0'>
<p>
<!-- Absolute domain-related link below, otherwise issue if hosted on ipfs.io, localhost etc. -->
This is an APP (as single html file, download <a download href='https://search-id.org/search-id.min.html'>here</a>) that search and show content of an ID (multiple formats supported, see below) only with P2P technologies.
</p>
<p class='subtitle'>
Open the right menu for add content with the + button, and use share links.
</p>
</div>
<!--
<div class='block1'>
<h1>Directories</h1>
<p>I hope i can publish here link to html pages created by the community with this system, to build a network of serverless contents.</p>
<iframe style='width:100%;height:450px;border:0px' src='https://search-id.org/pool/tagcloud'></iframe>
</div>
-->
<div class='block1'>
<h1>Why it rocks</h1>
<p>
It's a single HTML page. Without any external references. It works if opened in localhost (file:///). Download <a download href='search-id.min.html'>here</a>.
<br>
This is a project to promote the decentralization of contents in respect of net-neutrality and freedom.
Feel free to share it or host it on your website.
<br>
Note: This page itself is shared in the same system, it act as home-page. Potentially, it can be a gateway to other HTML content in the same system.
</p>
</div>
<div class='block2'>
<h1>Examples - Case study</h1>
<div class='tiles'>
<div class='box'>
<a href='?08ada5a7a6183aae1e09d831df6748d566095a10'>
Sintel.mp4
</a>
<div class='center'>
<iframe style='width:640px;height:380px;' src='?id=08ada5a7a6183aae1e09d831df6748d566095a10&autoplay=false'></iframe>
</div>
<p>
A video file. Viewed and shared in streaming.
<br>
A group of friends can use this system to share videos or films.
It's possible to click Menu -> + , build an ID of a video file, share the link in a private WhatsApp group.
Who view the content, help others as a seed.
<br>
Note: if opened on another PC in the same lan, is streamed over lan. This system can be used to share files between devices in lan, by sharing only ID/Url via IM like WhatsApp or Telegram.
</p>
</div>
<div class='box'>
<a href='?87bc8ad61c712f57a4dc2410d6b79273ce46f123'>
torbrowser-install-win64-8.5.3_en-US.exe
</a>
<div class='center'>
<iframe style='width:640px;height:200px;' data-id='87bc8ad61c712f57a4dc2410d6b79273ce46f123'></iframe>
</div>
<p>
<a href='https://www.torproject.org/projects/gettor'>GetTor robot</a> provide alternative methods to download Tor Browser, specially for situations where access to Tor Project's official website and mirrors is blocked.
</p>
<p>
The link above (Windows bundle as example) search it in the p2p network. So, people can obtain Tor by know only the above ID and have access to a copy of search-id html page.
</p>
<p>
Can be better: it's possible to use a bitcoin address, and publish updates without need to change the known ID (that will remain fixed in time even if address an updated version). Read below in <i>Types of ID supported</i> section.
</p>
</div>
<div class='box'>
<a href='?9c2add2df784e05278ed7f611b9ecb55da323d89'>
moonscape.html
</a>
<div class='center'>
<iframe style='width:100%;height:400px;' src='?id=9c2add2df784e05278ed7f611b9ecb55da323d89&autoplay=false'></iframe>
</div>
<p>
A demo of an .html content that contain other resources loaded in the same way.
<br>
The html contain code like
<code><code><iframe data-id='4d616494baf69a1ce2a8c00effac986a4c106da4'></iframe></code></code>
and the system automatically convert the data-id attribute for nested contents.
</p>
</div>
<div class='box'>
This system can be used in combo with <a href='https://memo.cash/'>memo.cash</a>, a Social Network based on Dapp build on Bitcoin Cash. Example: <a href='https://memo.cash/post/503af73303569fe6b4e72ec58867a2a241d7c45ebd23bdefd97d25826d18ef78'>A post on memo.cash</a>. The post ID is a BCH transaction, use ID here to render the content.
</div>
</div>
</div>
<div class='block1'>
<h2>Types of ID supported</h2>
<ul>
<li>
<p>Magnet/torrent infohash</p>
<p>
Example: <a href="?08ada5a7a6183aae1e09d831df6748d566095a10">Video MP4, Sintel</a>
</p>
</li>
<li>
<p>Bitcoin (or Bitcoin Cash) address - Torrent hash is extracted from the latest outgoing transaction from the address ID, via OP_RETURN.</p>
<p>This approach is based on <a href='https://github.com/elendirx/web2web'>elendirx/web2web idea.</a></p>
<p>People can share a bitcoin address, that point to the content. After, people can update the content without need to change the ID, by adding a transaction.</p>
<p>Example: This <i>welcome.html</i> you are reading. The ID is always the same, the content changes when we update it.</p>
<p>If you want to publish something with this method, contact us in our Telegram group.</p>
</li>
<li>
<p>
Bitcoin (or Bitcoin Cash) transaction
</p>
<p>
Example: <a href='https://www.blockchain.com/it/btc/tx/f802e59b8aa2640b587489cdbf2477d645f810e4fafd92df549bb288337648d3'> this (link to blockchain.com)</a> Bitcoin transaction
contain <code>EW magnet:?xt=urn:btih:6a9759bffd5c0af65319979fb7832189f4f3c35d</code> (via OP_RETURN), then the torrent is located via WebTorrent.
</p>
<p>
This example was made with <a href='https://eternitywall.it/'>https://eternitywall.it/</a>. Thanks.
</p>
<p>
Example: <a href="?f802e59b8aa2640b587489cdbf2477d645f810e4fafd92df549bb288337648d3">Video MP4, Sintel</a>
</p>
</li>
</ul>
</div>
<div class='block2'>
<h2>Types of content supported (inline viewer)</h2>
<ul>
<li>Video (with SRT and VTT subtitles)</li>
<li>Audio</li>
<li>PDF</li>
<li>Markdown (original + CommonMark + GitHub flavored) - <a href='?07541fec53c1f2dd28516eb0a99b8e71c182a5f6'>sample/reference</a> (Extension: .md , .md.txt)</li>
<li>BB-Code - <a href='?678b5a80842351d44f1850d87ba29caae73cd203'>sample/reference</a> (Extension: .bbc , .bbcode, bbc.txt, bbcode.txt)</li>
<li>Any other kind of files as binary</li>
</ul>
We plan to support other kind of viewer, like gallery, wiki syntax, etc.
</div>
<div class='block1'>
<h2>Parameters</h2>
<ul>
<li><i>autoplay</i> - Recommended to false if used as embedded widget. Default: false</li>
<li><i>trackers</i> - Trackers, for overwrite the defaults in bundle
</ul>
</div>
<div class='block2'>
<h2>Project files structure</h2>
<ul>
<li>
<b>search-id.min.html</b> - Automatically builded by <i>build.php</i>. The unique, minified file that people can share.
</li>
<li>
<b>build.php</b> - Generate <i>search-id.min.html</i> based on <i>search-id.html</i> and resources - Launch to build a release.
</li>
<li>
<b>search-id.html</b> - Development version, HTML
</li>
<li>
<b>embedding/*</b> - Resources. <i>build.php</i> embed it in <i>search-id.min.html</i>
</li>
<li>
<b>welcome.html</b> - Project homepage, development version. It's this page you are reading. Release edition shared in the same system.
</li>
<li>
<b>dev.html</b> - Development tools, generally test links.
</li>
</ul>
<h2>Domain search-id.org</h2>
<p>
The domain search-id.org run:
<ul>
<li>a copy of the above files</li>
<li>a WebTorrent and UDP/TCP tracker</li>
<li>a Pool server instance (experimental)</li>
</ul>
We also run a dedicated server as Pool client (experimental)
<br>
We expose all details <a href='https://search-id.org/stats'>https://search-id.org/stats</a> and <a href='https://search-id.org/stats.json'>https://search-id.org/stats.json</a> here in JSON.
<br>
Remember: anyone can host the single <i>search-id.min.html</i> file, publish a mirror, keep a copy in an usb key.
</p>
<h2>Libraries</h2>
<ul>
<li><a href='https://github.com/webtorrent/webtorrent'>WebTorrent</a> 0.102.0 - P2P contents</li>
<li><a href='https://github.com/feross/p2p-graph'>p2p-graph</a> v1.2.2 - UI, wires list</li>
<li><a href='https://jquery.com/'>jQuery</a> 3.3.1 - UI</li>
<li><a href='https://github.com/bitcoincashjs/bchaddrjs'>bchaddrjs</a> 0.2.2 - BCH Explorer</li>
<li><a href='https://github.com/markedjs'>Marked</a> 0.4.0 - For rendering Markdown</li>
</ul>
<h2>Changelog</h2>
<p>
v0.7
<ul>
<li>Better output of minimized bundle file</h1>
<li>Minor Bugfix</h1>
</ul>
</p>
<p>
v0.6
<ul>
<li>Minor changes</h1>
</ul>
</p>
<p>
v0.5
<ul>
<li>Minor changes</h1>
</ul>
</p>
<p>
v0.4
<ul>
<li>Experimental notification for support pool servers</h1>
<li>Javascript support warning</h1>
<li>Priority to readme.* or index.* files</li>
<li>Markdown support (with GitHub flavored)</li>
<li>BBCodes support (with custom codes)</li>
<li>VTT support</li>
<li>SRT support (built-in conversion to VTT)</li>
<li>Better rendering</li>
<li>Auto-adaption of target container in nested html links</li>
<li>Custom options in url</li>
<li>Libraries list</h1>
<li>Italian translation</h1>
<li>A lots of code cleaning</h1>
<li>Misc bugfix</h1>
</ul>
</p>
<p>
v0.1 - v0.3 - First public release
</p>
</div>
<div class='block1'>
<h2>Limits</h2>
<ul>
<li>
Don't work well with biggest file (>1gb). Depends on browsers.
</li>
</ul>
<h2>TODO</h2>
<ul>
<li>
Experimental status: It's currently under stress-test a pool-server (written in PHP/MySQL) and pool-client (written in NodeJS) of this system.
<br>
Basically, <i>search-id.html</i> talks with pool-servers about the requested contents, and the pool-server coordinate pool-clients that
<ol>
<li>act as a proxy between bittorrent and webtorrent clients</li>
<li>keep alive contents (avoid dead-share).</li>
</ol>
<br>
If you have a dedicated-server and want to contribute with a pool-client (basically an automated seedbox), contact our Telegram group.
</li>
<li>
Implement Direct link to a file inside a torrent
</li>
<li>
Speed charts.
</li>
<li>
More languages/localization.
</li>
<li>
Support other kind of ID
</li>
<li>
More documentation
</li>
<li>
Better support warning. Works in all recent browsers? Enumerate it.
</li>
<li>
Options for opt-out seeding, pool notification etc.
</li>
<li>
Test against Mozilla Observatory, implement CSP where possible.
</li>
</ul>
</div>
<div class='block2'>
<h1>Credit and Contact</h1>
<p>
This project is developed by <a href='https://www.clodo.it'>Clodo</a> and it's a frontend to the great <a href='https://webtorrent.io/'>WebTorrent</a> project.
</p>
<p>
It's released under <a href='https://www.gnu.org/licenses/agpl-3.0.html'>AGPLv3</a>. Thinking about <a href='https://www.kopimi.com/'>Kopimi</a> adoption.
</p>
<p>
Hosted on <a href='https://github.com/Clodo76/search-id'>GitHub</a>. <a href='https://twitter.com/SearchID2'>Twitter</a> and <a href='https://t.me/joinchat/CANCWhA7RdXTISGhvyWKcg'>Telegram Group</a> for testing and feedback.
</p>
</div>
<div id='revision'>welcome.html 0.8 2021/01/17</div>
</body>
</html>