aboutsummaryrefslogtreecommitdiffhomepage
path: root/client
diff options
context:
space:
mode:
authorChocobozzz <me@florianbigard.com>2019-12-06 11:28:55 +0100
committerChocobozzz <me@florianbigard.com>2019-12-06 11:40:35 +0100
commitd8232bac6abfb70953229a4164395f05cec90b35 (patch)
treed19c5bc461c6c32d6c3f06a3494ac2d71519c422 /client
parent3d216ea0f74cfa47312b97bae0e24885b563dd6d (diff)
downloadPeerTube-d8232bac6abfb70953229a4164395f05cec90b35.tar.gz
PeerTube-d8232bac6abfb70953229a4164395f05cec90b35.tar.zst
PeerTube-d8232bac6abfb70953229a4164395f05cec90b35.zip
Add peertube applications links in about page
Diffstat (limited to 'client')
-rw-r--r--client/src/app/+about/about-peertube/about-peertube-contributors.component.html8
-rw-r--r--client/src/app/+about/about-peertube/about-peertube-contributors.component.scss12
-rw-r--r--client/src/app/+about/about-peertube/about-peertube.component.html239
-rw-r--r--client/src/app/+about/about-peertube/about-peertube.component.scss45
4 files changed, 183 insertions, 121 deletions
diff --git a/client/src/app/+about/about-peertube/about-peertube-contributors.component.html b/client/src/app/+about/about-peertube/about-peertube-contributors.component.html
index de60754cb..4e7d2389b 100644
--- a/client/src/app/+about/about-peertube/about-peertube-contributors.component.html
+++ b/client/src/app/+about/about-peertube/about-peertube-contributors.component.html
@@ -1,11 +1,9 @@
1<div class="peertube-contributors"> 1<div class="peertube-contributors">
2 <h3 i18n class="section-title">Who made this software?</h3> 2 <p class="framasoft">
3 3 <strong i18n>Developed with &#10084; by <a target="_blank" rel="noopener noreferrer" href="https://framasoft.org">Framasoft</a></strong>
4 <p align="center">
5 <strong>Developed with &#10084; by <a target="_blank" rel="noopener noreferrer" href="https://framasoft.org">Framasoft</a></strong>
6 </p> 4 </p>
7 5
8 <p align="center"> 6 <p>
9 <a target="_blank" rel="noopener noreferrer" href="https://framasoft.org"> 7 <a target="_blank" rel="noopener noreferrer" href="https://framasoft.org">
10 <img width="150px" src="/client/assets/images/framasoft.png" alt="Framasoft logo"/> 8 <img width="150px" src="/client/assets/images/framasoft.png" alt="Framasoft logo"/>
11 </a> 9 </a>
diff --git a/client/src/app/+about/about-peertube/about-peertube-contributors.component.scss b/client/src/app/+about/about-peertube/about-peertube-contributors.component.scss
index 6a22f569f..03e6ce8c8 100644
--- a/client/src/app/+about/about-peertube/about-peertube-contributors.component.scss
+++ b/client/src/app/+about/about-peertube/about-peertube-contributors.component.scss
@@ -2,12 +2,24 @@
2@import '_mixins'; 2@import '_mixins';
3 3
4.peertube-contributors { 4.peertube-contributors {
5 .framasoft {
6 font-size: 18px;
7 }
8
9 > p {
10 text-align: center;
11 }
12
5 /deep/ h1 { 13 /deep/ h1 {
6 font-size: 1rem; 14 font-size: 1rem;
15 text-align: center;
16 font-weight: $font-semibold;
17 margin-top: 20px;
7 } 18 }
8 19
9 /deep/ ul { 20 /deep/ ul {
10 padding: 0; 21 padding: 0;
22 text-align: center;
11 23
12 li { 24 li {
13 display: inline-block; 25 display: inline-block;
diff --git a/client/src/app/+about/about-peertube/about-peertube.component.html b/client/src/app/+about/about-peertube/about-peertube.component.html
index c6f21d35a..53aee5634 100644
--- a/client/src/app/+about/about-peertube/about-peertube.component.html
+++ b/client/src/app/+about/about-peertube/about-peertube.component.html
@@ -1,111 +1,158 @@
1<h1 i18n class="about-peertube-title"> 1<div class="root">
2 What is PeerTube? 2 <h1 i18n class="about-peertube-title">
3</h1> 3 What is PeerTube?
4 </h1>
4 5
5<img class="mascot" width="121px" height="147px" src="/client/assets/images/mascot/default.png" alt="mascot" /> 6 <img class="mascot" width="121px" height="147px" src="/client/assets/images/mascot/default.png" alt="mascot"/>
6
7<div class="description">
8 <p i18n>
9 PeerTube is a self hosted federated (ActivityPub) video streaming platform using P2P directly in the web browser.
10 </p>
11
12 <p i18n>
13 It is a free and open-source software, under the <a href="https://github.com/Chocobozzz/PeerTube/blob/develop/LICENSE">AGPLv3 licence</a>.
14 </p>
15
16 <p i18n>
17 For more information, please visit <a target="_blank" rel="noopener noreferrer" href="https://joinpeertube.org">joinpeertube.org</a>.
18 </p>
19</div>
20
21<div class="documentation">
22
23
24</div>
25
26<div class="privacy-contributors">
27 <my-about-peertube-contributors></my-about-peertube-contributors>
28
29 <div class="p2p-privacy">
30 <h3 i18n class="section-title">P2P & Privacy</h3>
31
32 <p i18n>
33 PeerTube uses the BitTorrent protocol to share bandwidth between users.
34 This implies that your IP address is stored in the instance's BitTorrent tracker as long as you download or watch the video.
35 </p>
36
37 <h6 i18n class="p2p-privacy-title">What are the consequences?</h6>
38
39 <p i18n>
40 In theory, someone with enough technical skills could create a script that tracks which IP is downloading which video.
41 In practice, this is much more difficult because:
42 </p>
43
44 <ul>
45 <li i18n>
46 An HTTP request has to be sent on each tracker for each video to spy.
47 If we want to spy all PeerTube's videos, we have to send as many requests as there are videos (so potentially a lot)
48 </li>
49
50 <li i18n>
51 For each request sent, the tracker returns random peers at a limited number.
52 For instance, if there are 1000 peers in the swarm and the tracker sends only 20 peers for each request, there must be at least 50 requests sent to know every peers in the swarm
53 </li>
54
55 <li i18n>
56 Those requests have to be sent regularly to know who starts/stops watching a video. It is easy to detect that kind of behaviour
57 </li>
58
59 <li i18n>
60 If an IP address is stored in the tracker, it doesn't mean that the person behind the IP (if this person exists) has watched the video
61 </li>
62
63 <li i18n>
64 The IP address is a vague information: usually, it regularly changes and can represent many persons or entities
65 </li>
66
67 <li i18n>
68 Web peers are not publicly accessible: because we use WebRTC inside the web browser (<a href="https://webtorrent.io/">with the WebTorrent library</a>), the protocol is different from classic BitTorrent.
69 When you are in a web browser, you send a signal containing your IP address to the tracker that will randomly choose other peers to forward the information to.
70 See <a href="https://github.com/yciabaud/webtorrent/blob/beps/bep_webrtc.rst">this document</a> for more information
71 </li>
72 </ul>
73 7
8 <div class="description">
74 <p i18n> 9 <p i18n>
75 The worst-case scenario of an average person spying on their friends is quite unlikely. 10 PeerTube is a self hosted federated (ActivityPub) video streaming platform using P2P directly in the web browser.
76 There are much more effective ways to get that kind of information.
77 </p> 11 </p>
78 12
79 <h6 i18n class="p2p-privacy-title">How does PeerTube compare with YouTube?</h6>
80
81 <p i18n> 13 <p i18n>
82 The threats to privacy in YouTube are different from PeerTube's. 14 It is a free and open-source software, under the <a href="https://github.com/Chocobozzz/PeerTube/blob/develop/LICENSE">AGPLv3
83 In YouTube's case, the platform gathers a huge amount of your personal information (not only your IP) to analyze them and track you. 15 licence</a>.
84 Moreover, YouTube is owned by Google/Alphabet, a company that tracks you across many websites (via AdSense or Google Analytics).
85 </p> 16 </p>
86 17
87 <h6 i18n class="p2p-privacy-title">What can I do to limit the exposure of my IP address?</h6>
88
89 <p i18n> 18 <p i18n>
90 Your IP address is public so every time you consult a website, there is a number of actors (in addition to the final website) seeing your IP in their connection logs: ISP/routers/trackers/CDN and more. 19 For more information, please visit <a target="_blank" rel="noopener noreferrer" href="https://joinpeertube.org">joinpeertube.org</a>.
91 PeerTube is transparent about it: we warn you that if you want to keep your IP private, you must use a VPN or Tor Browser.
92 Thinking that removing P2P from PeerTube will give you back anonymity doesn't make sense.
93 </p> 20 </p>
21 </div>
94 22
95 <h6 i18n class="p2p-privacy-title">What will be done to mitigate this problem?</h6> 23 <div class="documentation">
24
25 <div class="card">
26 <div class="card-body">
27 <h5 class="card-title">
28 <a i18n target="_blank" rel="noopener noreferrer" href="https://docs.joinpeertube.org/#/use-setup-account">Use PeerTube
29 documentation</a>
30 </h5>
31
32 <div i18n class="card-text">
33 Discover how to setup your account, what is a channel, how to create a playlist and more!
34 </div>
35 </div>
36 </div>
37
38 <div class="card">
39 <div class="card-body">
40 <h5 class="card-title">
41 <a i18n target="_blank" rel="noopener noreferrer" href="https://docs.joinpeertube.org/#/use-third-party-application">PeerTube
42 Applications</a>
43 </h5>
44
45 <div i18n class="card-text">
46 Discover unofficial Android applications or browser addons!
47 </div>
48 </div>
49 </div>
50
51 <div class="card">
52 <div class="card-body">
53 <h5 class="card-title">
54 <a i18n target="_blank" rel="noopener noreferrer" href="https://docs.joinpeertube.org/#/contribute-getting-started">Contribute on
55 PeerTube</a>
56 </h5>
57
58 <div i18n class="card-text">
59 Want to help to improve PeerTube? You can translate the web interface, give your feedback or directly contribute to the code!
60 </div>
61 </div>
62 </div>
63 </div>
96 64
97 <p i18n> 65 <div class="privacy-contributors">
98 PeerTube is in its early stages, and want to deliver the best countermeasures possible by the time the stable is released. 66 <my-about-peertube-contributors></my-about-peertube-contributors>
99 In the meantime, we want to test different ideas related to this issue: 67
100 </p> 68 <div class="p2p-privacy">
69 <h3 i18n class="section-title">P2P & Privacy</h3>
70
71 <p i18n>
72 PeerTube uses the BitTorrent protocol to share bandwidth between users.
73 This implies that your IP address is stored in the instance's BitTorrent tracker as long as you download or watch the video.
74 </p>
75
76 <h6 i18n class="p2p-privacy-title">What are the consequences?</h6>
77
78 <p i18n>
79 In theory, someone with enough technical skills could create a script that tracks which IP is downloading which video.
80 In practice, this is much more difficult because:
81 </p>
82
83 <ul>
84 <li i18n>
85 An HTTP request has to be sent on each tracker for each video to spy.
86 If we want to spy all PeerTube's videos, we have to send as many requests as there are videos (so potentially a lot)
87 </li>
88
89 <li i18n>
90 For each request sent, the tracker returns random peers at a limited number.
91 For instance, if there are 1000 peers in the swarm and the tracker sends only 20 peers for each request, there must be at least 50
92 requests sent to know every peers in the swarm
93 </li>
94
95 <li i18n>
96 Those requests have to be sent regularly to know who starts/stops watching a video. It is easy to detect that kind of behaviour
97 </li>
98
99 <li i18n>
100 If an IP address is stored in the tracker, it doesn't mean that the person behind the IP (if this person exists) has watched the
101 video
102 </li>
103
104 <li i18n>
105 The IP address is a vague information: usually, it regularly changes and can represent many persons or entities
106 </li>
107
108 <li i18n>
109 Web peers are not publicly accessible: because we use WebRTC inside the web browser (<a href="https://webtorrent.io/">with the
110 WebTorrent library</a>), the protocol is different from classic BitTorrent.
111 When you are in a web browser, you send a signal containing your IP address to the tracker that will randomly choose other peers
112 to forward the information to.
113 See <a href="https://github.com/yciabaud/webtorrent/blob/beps/bep_webrtc.rst">this document</a> for more information
114 </li>
115 </ul>
116
117 <p i18n>
118 The worst-case scenario of an average person spying on their friends is quite unlikely.
119 There are much more effective ways to get that kind of information.
120 </p>
121
122 <h6 i18n class="p2p-privacy-title">How does PeerTube compare with YouTube?</h6>
123
124 <p i18n>
125 The threats to privacy in YouTube are different from PeerTube's.
126 In YouTube's case, the platform gathers a huge amount of your personal information (not only your IP) to analyze them and track you.
127 Moreover, YouTube is owned by Google/Alphabet, a company that tracks you across many websites (via AdSense or Google Analytics).
128 </p>
129
130 <h6 i18n class="p2p-privacy-title">What can I do to limit the exposure of my IP address?</h6>
131
132 <p i18n>
133 Your IP address is public so every time you consult a website, there is a number of actors (in addition to the final website) seeing
134 your IP in their connection logs: ISP/routers/trackers/CDN and more.
135 PeerTube is transparent about it: we warn you that if you want to keep your IP private, you must use a VPN or Tor Browser.
136 Thinking that removing P2P from PeerTube will give you back anonymity doesn't make sense.
137 </p>
138
139 <h6 i18n class="p2p-privacy-title">What will be done to mitigate this problem?</h6>
140
141 <p i18n>
142 PeerTube is in its early stages, and want to deliver the best countermeasures possible by the time the stable is released.
143 In the meantime, we want to test different ideas related to this issue:
144 </p>
145
146 <ul>
147 <li i18n>Set a limit to the number of peers sent by the tracker</li>
148 <li i18n>Set a limit on the request frequency received by the tracker (being tested)</li>
149 <li i18n>Ring a bell if there are unusual requests (being tested)</li>
150 <li i18n>Disable P2P from the administration interface</li>
151 <li i18n>An automatic video redundancy program: we wouldn't know if the IP downloaded the video on purpose or if it was the
152 automatized program
153 </li>
154 </ul>
155 </div>
101 156
102 <ul>
103 <li i18n>Set a limit to the number of peers sent by the tracker</li>
104 <li i18n>Set a limit on the request frequency received by the tracker (being tested)</li>
105 <li i18n>Ring a bell if there are unusual requests (being tested)</li>
106 <li i18n>Disable P2P from the administration interface</li>
107 <li i18n>An automatic video redundancy program: we wouldn't know if the IP downloaded the video on purpose or if it was the automatized program</li>
108 </ul>
109 </div> 157 </div>
110
111</div> 158</div>
diff --git a/client/src/app/+about/about-peertube/about-peertube.component.scss b/client/src/app/+about/about-peertube/about-peertube.component.scss
index cd1364c14..a43eb6fe1 100644
--- a/client/src/app/+about/about-peertube/about-peertube.component.scss
+++ b/client/src/app/+about/about-peertube/about-peertube.component.scss
@@ -1,6 +1,11 @@
1@import '_variables'; 1@import '_variables';
2@import '_mixins'; 2@import '_mixins';
3 3
4.root {
5 max-width: 1200px;
6 margin: auto;
7}
8
4.about-peertube-title { 9.about-peertube-title {
5 font-size: 25px; 10 font-size: 25px;
6 text-align: center; 11 text-align: center;
@@ -20,10 +25,22 @@
20} 25}
21 26
22.description { 27.description {
23 margin-bottom: 100px;
24 text-align: center; 28 text-align: center;
25} 29}
26 30
31.documentation {
32 display: flex;
33 flex-wrap: wrap;
34 margin: 50px 0;
35 justify-content: center;
36
37 .card {
38 margin: 30px;
39 flex-basis: 300px;
40 font-size: 15px;
41 }
42}
43
27.description, 44.description,
28.p2p-privacy, 45.p2p-privacy,
29my-about-peertube-contributors { 46my-about-peertube-contributors {
@@ -34,31 +51,19 @@ my-about-peertube-contributors {
34 } 51 }
35} 52}
36 53
37.p2p-privacy-title {
38 margin-top: 15px;
39}
40
41.privacy-contributors { 54.privacy-contributors {
42 display: flex; 55 display: flex;
43 flex-direction: row; 56 flex-direction: column;
44
45 > div,
46 > my-about-peertube-contributors {
47 flex-basis: 100%;
48 display: block;
49 }
50 57
51 .p2p-privacy { 58 .p2p-privacy {
59 .section-title {
60 margin: 50px 0 20px;
61 text-align: center;
62 }
63
52 h6 { 64 h6 {
53 font-size: 20px; 65 font-size: 20px;
66 margin-top: 15px;
54 } 67 }
55 } 68 }
56
57 my-about-peertube-contributors {
58 margin: 0 40px 40px 0;
59 }
60
61 @media screen and (max-width: $small-view) {
62 flex-direction: column;
63 }
64} 69}