Skip to content
GitLab
Projects
Groups
Snippets
/
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
Menu
Open sidebar
tails
tails
Commits
cc31a974
Commit
cc31a974
authored
Sep 23, 2017
by
sajolida
Browse files
Add first interaction with JavaScript when clicking on direct download
parent
b900668a
Changes
4
Hide whitespace changes
Inline
Side-by-side
wiki/src/install/download_2.html
View file @
cc31a974
...
...
@@ -5,6 +5,6 @@
[[!meta stylesheet="install/inc/stylesheets/dave_2" rel="stylesheet" title=""]]
[[!meta stylesheet="install/inc/stylesheets/steps" rel="stylesheet" title=""]]
[[!meta stylesheet="install/inc/stylesheets/download-only" rel="stylesheet" title=""]]
[[!meta script="install/inc/js/dave"]]
[[!meta script="install/inc/js/dave
_2
"]]
[[!inline pages="install/inc/steps/download_2.inline" raw="yes" sort="age"]]
wiki/src/install/inc/js/dave_2.js
0 → 100644
View file @
cc31a974
document
.
addEventListener
(
'
DOMContentLoaded
'
,
function
()
{
function
opaque
(
elm
)
{
elm
.
style
.
opacity
=
"
1.0
"
;
var
siblings
=
elm
.
querySelectorAll
(
'
a
'
);
for
(
let
i
=
0
;
i
<
siblings
.
length
;
i
++
)
{
siblings
[
i
].
classList
.
remove
(
"
disabled
"
);
}
}
function
transparent
(
elm
)
{
elm
.
style
.
opacity
=
"
0.3
"
;
var
siblings
=
elm
.
querySelectorAll
(
'
a
'
);
for
(
let
i
=
0
;
i
<
siblings
.
length
;
i
++
)
{
siblings
[
i
].
classList
.
add
(
"
disabled
"
);
}
}
function
toggleOpacity
(
elm
,
mode
)
{
for
(
var
i
=
0
;
i
<
elm
.
length
;
i
++
)
{
if
(
mode
==
"
opaque
"
)
{
opaque
(
elm
[
i
]);
}
else
{
transparent
(
elm
[
i
]);
}
}
}
function
hide
(
elm
)
{
elm
.
style
.
display
=
"
none
"
;
}
function
show
(
elm
)
{
elm
.
style
.
display
=
"
block
"
;
}
function
toggleDisplay
(
elm
,
mode
)
{
for
(
var
i
=
0
;
i
<
elm
.
length
;
i
++
)
{
if
(
mode
==
"
hide
"
)
{
hide
(
elm
[
i
]);
}
else
{
show
(
elm
[
i
]);
}
}
}
// Show initial screen for supported browser
toggleDisplay
(
document
.
getElementsByClassName
(
'
no-js
'
),
"
hide
"
);
toggleDisplay
(
document
.
getElementsByClassName
(
'
supported-browser
'
),
"
show
"
);
transparent
(
document
.
getElementById
(
'
step-verify-direct
'
),
"
transparent
"
);
transparent
(
document
.
getElementById
(
'
step-continue-direct
'
),
"
transparent
"
);
transparent
(
document
.
getElementById
(
'
step-verify-bittorrent
'
),
"
transparent
"
);
// Display "Verify with your browser" when "Direct download is clicked"
document
.
getElementById
(
"
direct-download
"
).
onclick
=
function
()
{
opaque
(
document
.
getElementById
(
'
step-verify-direct
'
));
hide
(
document
.
getElementById
(
'
skip-download-direct
'
));
show
(
document
.
getElementById
(
'
skip-verification-direct
'
));
transparent
(
document
.
getElementById
(
'
skip-download-bittorrent
'
));
transparent
(
document
.
getElementById
(
'
step-continue-bittorrent
'
));
}
});
wiki/src/install/inc/steps/download_2.inline.html
View file @
cc31a974
...
...
@@ -5,20 +5,32 @@
<div
class=
"supported-browser no-js"
>
<h3><span
class=
"step-number"
>
1.
</span>
Download Tails
</h3>
<a
class=
"btn btn-primary indent"
>
Download Tails 3.1 ISO image (1.2 GB)
</a>
<a
id=
"direct-download"
class=
"btn btn-primary indent"
>
Download Tails 3.1 ISO image (1.2 GB)
</a>
<h3><span
class=
"step-number"
>
2.
</span>
Verify your download using your browser
</h3>
<div
class=
"caution indent"
>
<p><b>
For your security, always verify your download!
</b><br/>
Our browser extension makes it quick and easy.
</p>
<p><a>
Why?
</a></p>
<div
id=
"step-verify-direct"
>
<h3><span
class=
"step-number"
>
2.
</span>
Verify your download using your browser
</h3>
<div
class=
"caution indent"
>
<p><b>
For your security, always verify your download!
</b><br/>
Our browser extension makes it quick and easy.
</p>
<p><a>
Why?
</a></p>
</div>
<p
class=
"supported-browser"
><a
class=
"btn btn-primary indent"
>
Install
<u>
Tails verification
</u>
extension (no restart)
</a></p>
<p
class=
"no-js"
><a
class=
"btn btn-primary indent"
>
Install extension for
<u>
Firefox and Tor Browser
</u>
(no restart)
</a></p>
<p
class=
"no-js"
><a
class=
"btn btn-primary indent"
>
Install extension for
<u>
Chrome and Chromium
</u>
(no restart)
</a></p>
</div>
<p
class=
"supported-browser"
><a
class=
"btn btn-primary indent"
>
Install
<u>
Tails verification
</u>
extension (no restart)
</a></p>
<p
class=
"no-js"
><a
class=
"btn btn-primary indent"
>
Install extension for
<u>
Firefox and Tor Browser
</u>
(no restart)
</a></p>
<p
class=
"no-js"
><a
class=
"btn btn-primary indent"
>
Install extension for
<u>
Chrome and Chromium
</u>
(no restart)
</a></p>
<h3><span
class=
"step-number"
>
3.
</span>
Continue installing
</h3>
<a
class=
"indent"
>
Skip download
</a>
<div
id=
"step-continue-direct"
>
<h3><span
class=
"step-number"
>
3.
</span>
Continue installing
</h3>
</div>
<div
id=
"skip-download-direct"
>
<a
class=
"indent"
>
Skip download
</a>
</div>
<div
id=
"skip-verification-direct"
>
<a
class=
"indent"
>
Skip verification
</a>
</div>
<div
id=
"next-direct"
>
<a
class=
"btn btn-primary indent"
>
Next
</a>
</div>
</div>
<div
class=
"outdated-browser unsupported-browser"
>
...
...
@@ -51,11 +63,23 @@
<h3><span
class=
"step-number"
>
1.
</span>
Download Tails (Torrent file)
</h3>
<a
class=
"btn btn-primary indent"
>
Download Tails 3.1 Torrent file
</a>
<h3><span
class=
"step-number"
>
2.
</span>
Verify your download using BitTorrent
</h3>
<p
class=
"indent"
>
Your BitTorrent client will automatically verify your download when it is complete.
</p>
<div
id=
"step-verify-bittorrent"
>
<h3><span
class=
"step-number"
>
2.
</span>
Verify your download using BitTorrent
</h3>
<p
class=
"indent"
>
Your BitTorrent client will automatically verify your download when it is complete.
</p>
</div>
<h3><span
class=
"step-number"
>
3.
</span>
Continue installing
</h3>
<a
class=
"indent"
>
Skip download
</a>
<div
id=
"step-continue-bittorrent"
>
<h3><span
class=
"step-number"
>
3.
</span>
Continue installing
</h3>
</div>
<div
id=
"skip-download-bittorrent"
>
<a
class=
"indent"
>
Skip download
</a>
</div>
<div
id=
"skip-verification-bittorrent"
>
<a
class=
"indent"
>
Skip verification
</a>
</div>
<div
id=
"next-bittorrent"
>
<a
class=
"btn btn-primary indent"
>
Next
</a>
</div>
</div>
</div>
wiki/src/install/inc/stylesheets/dave_2.css
View file @
cc31a974
.unsupported-browser
{
display
:
inline-block
!important
;
}
.supported-browser
,
.outdated-browser
,
.unsupported-browser
,
.unsupported-browser
{
display
:
none
;
}
.no-js
{
display
:
block
;
}
#skip-verification-direct
,
#skip-verification-bittorrent
,
#next-direct
,
#next-bittorrent
{
display
:
none
;
}
...
...
@@ -25,3 +33,7 @@ span.step-number {
.indent
{
margin-left
:
30px
!important
;
}
.disabled
{
pointer-events
:
none
;
}
Write
Preview
Supports
Markdown
0%
Try again
or
attach a new file
.
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment