Adding initial style.
This commit is contained in:
sergiotarxz
parent
16240d9567
commit
a03a7f947c
GPG Key ID:
E5903508B6510AC2
|
|
@ -25,10 +25,7 @@ post '/api' => sub {
|
|||
my $render_returned;
|
||||
eval {
|
||||
$render_returned = $c->render(
|
||||
json => Peertube::DL::URLHandler::getDownloadDataFromURL(
|
||||
$url, { format => 18 }
|
||||
)
|
||||
);
|
||||
json => Peertube::DL::URLHandler::getDownloadDataFromURL($url) );
|
||||
};
|
||||
if ($@) {
|
||||
return $c->render( text => $@, status => 500 );
|
||||
|
|
|
|||
|
|
@ -108,6 +108,15 @@ sub youtube {
|
|||
filename => $microformat->{title}{simpleText} . '.' . $extension,
|
||||
};
|
||||
} else {
|
||||
say Data::Dumper::Dumper [
|
||||
scalar @{ $ytInitialPlayerResponse->{adaptiveFormats} }
|
||||
? @{ $ytInitialPlayerResponse->{adaptiveFormats} }
|
||||
: (),
|
||||
scalar @{ $ytInitialPlayerResponse->{formats} }
|
||||
? @{ $ytInitialPlayerResponse->{formats} }
|
||||
: ()
|
||||
];
|
||||
|
||||
return {
|
||||
options => { list_formats => 1 },
|
||||
title => $microformat->{title}{simpleText},
|
||||
|
|
|
|||
|
|
@ -149,6 +149,7 @@ h2 {
|
|||
max-height: 95%;
|
||||
overflow-y: scroll;
|
||||
}
|
||||
|
||||
.poping-notice.active {
|
||||
display: block;
|
||||
}
|
||||
|
|
@ -177,9 +178,88 @@ h2 {
|
|||
color: white;
|
||||
}
|
||||
|
||||
#modal-format-selector {
|
||||
display: none;
|
||||
background: white;
|
||||
position: fixed;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
transform: translate(-50%, -50%);
|
||||
border: black 1px solid;
|
||||
flex-direction: column;
|
||||
overflow-y: scroll;
|
||||
}
|
||||
|
||||
#modal-format-selector.active {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
#modal-format-selector > h2 {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
#modal-format-selector > p {
|
||||
margin-left: 2rem;
|
||||
}
|
||||
|
||||
#modal-format-selector .format-list {
|
||||
box-sizing: border-box;
|
||||
background: #fff;
|
||||
margin: 2rem;
|
||||
}
|
||||
|
||||
#close-modal-format-selector {
|
||||
margin-top: 0.50rem;
|
||||
margin-right: 0.50rem;
|
||||
border: 1px solid black;
|
||||
background: grey;
|
||||
color: white;
|
||||
width: 25px;
|
||||
height: 25px;
|
||||
text-align: center;
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
#close-modal-format-selector:hover,#close-modal-format-selector:focus {
|
||||
background: black;
|
||||
}
|
||||
|
||||
.format-list > div {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.format-list > div > a {
|
||||
border: 1px solid black;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 5rem;
|
||||
text-decoration: none;
|
||||
color: black;
|
||||
background: grey;
|
||||
}
|
||||
|
||||
.format-list > div > a:hover {
|
||||
background: black;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.format-list > div > a:after {
|
||||
padding-bottom: 100%;
|
||||
display: block;
|
||||
content: "";
|
||||
}
|
||||
|
||||
div.video-formats a {
|
||||
background: #f00;
|
||||
}
|
||||
|
||||
@media (min-width: 668px) {
|
||||
.poping-notice {
|
||||
width: 629px;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -17,7 +17,7 @@
|
|||
</div>
|
||||
<div id="modal-video-container">
|
||||
<div class="video-container-bar">
|
||||
<a id="close-and-reset-video-container">X</a>
|
||||
<a id="close-and-reset-video-container">x</a>
|
||||
</div>
|
||||
<div id="video-container">
|
||||
<div class="block">
|
||||
|
|
@ -30,12 +30,26 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="poping-notice">
|
||||
<div class="poping-notice-content">
|
||||
<p>This webpage is free as in freedom software, it is offered to you with the hope it will be useful, but without any warranty,
|
||||
you can find the source code at <a href="https://gitea.sergiotarxz.freemyip.com/sergiotarxz/Peertube-dl">my gitea</a> with docs to setup your own
|
||||
webpage like this, this software is licensed under the AGPLv3 license which means you MUST convey the source code in a human readable form
|
||||
if you distribute this software or use it as an service to users of service or distributees.<p>
|
||||
<div id="modal-format-selector" class="active">
|
||||
<div class="video-container-bar">
|
||||
<a id="close-modal-format-selector">x</a>
|
||||
</div>
|
||||
<h2>Example video</h2>
|
||||
<p>Example description</p>
|
||||
<div class="format-list">
|
||||
<div class="video-formats">
|
||||
<a href="18">18</a>
|
||||
</div>
|
||||
<div class="audio-formats">
|
||||
<a href="251">251</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="poping-notice">
|
||||
<p>This webpage is free as in freedom software, it is offered to you with the hope it will be useful, but without any warranty,
|
||||
you can find the source code at <a href="https://gitea.sergiotarxz.freemyip.com/sergiotarxz/Peertube-dl">my gitea</a> with docs to setup your own
|
||||
webpage like this, this software is licensed under the AGPLv3 license which means you MUST convey the source code in a human readable form
|
||||
if you distribute this software or use it as an service to users of service or distributees.<p>
|
||||
|
||||
<p>I hope that if you find a non supported url which should be supported, a bug, or a feature you would like this webpage to have you file an issue in
|
||||
<a href="https://gitea.sergiotarxz.freemyip.com/sergiotarxz/Peertube-dl/issues">https://gitea.sergiotarxz.freemyip.com/sergiotarxz/Peertube-dl/issues</a>
|
||||
|
|
|
|||
Loading…
Reference in New Issue