Skip to content

Commit

Permalink
New UI thanks to @gregsqueeb
Browse files Browse the repository at this point in the history
  • Loading branch information
Carlos authored and Carlos committed Oct 25, 2014
1 parent fe07dfe commit 5b98bcc
Show file tree
Hide file tree
Showing 4 changed files with 56 additions and 57 deletions.
4 changes: 2 additions & 2 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -43,10 +43,10 @@
"title": "TorrenTV",
"icon": "src/app/images/icon.png",
"frame": true,
"resizable": true,
"resizable": false,
"show": true,
"fullscreen": false,
"toolbar": true,
"toolbar": false,
"width": 300,
"always-on-top": true,
"height": 300
Expand Down
19 changes: 16 additions & 3 deletions src/app/app.js
Original file line number Diff line number Diff line change
Expand Up @@ -382,6 +382,13 @@ function toggleStop(n){
function forward30(n){
self.devices[n].deltaSeek(30, function(time, status){
console.log('Forwarded 30secs!'+status)
if(self.devices[n].playing == true){
console.log(status)
console.log('paused!')
self.devices[n].stopped = false
self.devices[n].togglePlayIcon()
}

})

}
Expand All @@ -390,6 +397,12 @@ function rewind30(n){

self.devices[n].deltaSeek(-30, function(time){
console.log('Rewinded 30secs!'+time)
if(self.devices[n].playing == true){
console.log(status)
console.log('paused!')
self.devices[n].stopped = false
self.devices[n].togglePlayIcon()
}
})

}
Expand Down Expand Up @@ -468,7 +481,7 @@ function addChromecastDeviceElement(label){
document.getElementById('dropmessage').style.height = '100px';
//var htmlDevice = ' <div class="device" style="margin-top:22px;"> <div class="chromecontrols"> <div onclick="togglePlay('+(ips.length-1)+');"><img id="playbutton'+(ips.length-1)+'" class="controlbutton" class="playbutton"/></div> <div id="stopbutton'+(ips.length-1)+'"class="controlbutton hidden" onclick="toggleStop('+(ips.length-1)+');"><img class="stopbutton"/></div> </div><img onclick="toggleChromecastDevice('+(ips.length-1)+');" id="airplay-icon'+(ips.length-1)+'" class="chromeicon"/> <p style="margin-top:-3px;">'+label+'</p> <div onclick="toggleChromecastDevice('+(ips.length-1)+');"><p id="off'+(ips.length-1)+'" class="offlabel" style="margin-top:-36px;margin-left:-8px;" >OFF</p> </div></div> </div>'
//document.getElementById('airplay').innerHTML += htmlDevice
document.getElementById('airplay').innerHTML += '<div class="device"><img onclick="toggleChromecastDevice('+(ips.length-1)+');" id="airplay-icon'+(ips.length-1)+'" style="margin-left:-8px;" class="chromeicon ChromedeviceiconOff"/> <p style="margin-top:-10px;">'+label+'</p> <p id="off'+(ips.length-1)+'" class="offlabel" style="margin-top:-60px;">OFF</p>'+
document.getElementById('airplay').innerHTML += '<div class="device"><img onclick="toggleChromecastDevice('+(ips.length-1)+');" id="airplay-icon'+(ips.length-1)+'" style="margin-left:-4px;" class="chromeicon ChromedeviceiconOff"/> <p style="margin-top:-10px;">'+label+'</p> <p id="off'+(ips.length-1)+'" class="offlabel" style="margin-top:-60px;">OFF</p>'+
'<div>'+
//'<img style="float:left; margin-top:34px; margin-left:0px;margin-right:0px;" class="rewindbutton hidden " id="rewindbutton'+(ips.length-1)+'" />'+
'<img style="float:left; margin-top:34px; margin-left:0px;margin-right:0px;" class="rewindbutton hidden " id="rewindbutton'+(ips.length-1)+'" onclick="rewind30('+(ips.length-1)+');"/>'+
Expand Down Expand Up @@ -565,8 +578,8 @@ var gotTorrent = function (this_torrent){
showMessage("Processing Torrent")

if(!loading){
document.getElementById('arrow').classList.toggle('visible');
document.getElementById('arrow').classList.toggle('hidden');
document.getElementById('topimages').classList.toggle('visible');
document.getElementById('topimages').classList.toggle('hidden');
document.getElementById('processing').classList.toggle('processing-icon');
}
loading = true
Expand Down
46 changes: 24 additions & 22 deletions src/app/index.css
Original file line number Diff line number Diff line change
Expand Up @@ -20,9 +20,8 @@

body{
font-family: 'Open Sans Semibold';
background: linear-gradient(rgba(1,1,1,0.2), rgba(1,1,1,0.2), rgba(0,0,0,0));
-webkit-user-select: none;
height: 260px;
background-color: white;
height: 275px;
}
body div{

Expand All @@ -35,9 +34,9 @@ body div{

#top-message{
text-align:center;
color: rgba(1,1,1,0.25);
color: rgba(1,1,1,0.45);
height: 20px;
/*text-shadow: 0 1px 2px rgba(1,1,1,0.15);*/
margin-top:25px;
}

#info-message{
Expand All @@ -55,36 +54,34 @@ body div{
font-size: 0.8em;
}
#dropmessage{
width:200px;
width:265px;
height:200px;
position:fixed;
z-index: 2;
margin-top: 25px;
}

#droparea{
height: 100px;
}

#droplogo{
height: 200px;
width: 200px;
height: 260px;
width: 260px;
/*box-shadow: 0px 0px 12px grey;*/
border-radius: 2em;
border-radius: 0.7em;
margin: 0 auto;
margin-top: 30px;
margin-top: 17px;
/*margin-bottom: 30px;*/
border: 6px dashed rgba(1,1,1,0.15);
}

#droplogo:hover {
border-color: rgba(1,1,1,0.35);
border: 3px dashed rgba(1,1,1,0.15);
background-color: #f5f5f5;
}

.error {
color: red;
}

#arrow{
#arroww{
/*position: absolute;*/
margin-top:20px;
margin-left:75px;
Expand All @@ -93,7 +90,7 @@ body div{
}


#arrow:before{
#arroww:before{
content:"";
position: absolute;
margin-top:50px;
Expand All @@ -104,7 +101,7 @@ body div{
}


#arrow:after{
#arroww:after{
content:"";
position: absolute;
margin-top:50px;
Expand Down Expand Up @@ -192,6 +189,15 @@ body div{
z-index: 3;
}

#topimages {
background: url(logostop.png) no-repeat;
margin-top: 25px;
margin-bottom: -25px;
height: 100px;
margin-left: 20px;
}


#airplay img{

clear: both;
Expand All @@ -215,7 +221,6 @@ body div{
}

.visible{
background-color: rgba(1,1,1,0.15);
}

.hidden {
Expand All @@ -226,9 +231,6 @@ body div{
height:100px;
}

#magnet {
height:50px;
}

#processing {
height: 32px;
Expand Down
44 changes: 14 additions & 30 deletions src/app/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -16,45 +16,29 @@
</div>
</div>

<div id="arrow" class="visible">
<div id="topimages" class="visible">
</div>

<div id="processing">
</div>
<div id="processing" class="hidden">
</div>

<div id="airplay-container" class="center">
<div id="airplay">



<!-- Design buttons
<div onclick="toggleDevice(0);" class="device"><img id="airplay-icon0" class="deviceicon"/> <p style="margin-top:-10px;">Label1</p> <p id="off0" class="offlabel" style="margin-top:-60px;">OFF</p> </div>
<div onclick="toggleDevice(1);" class="device"><img id="airplay-icon1" class="deviceicon"/> <p style="margin-top:-10px;">Label2</p> <p id="off'1" class="offlabel" style="margin-top:-60px;margin-left:10px;">OFF</p> </div>
<div class="device">
<div class='chromecontrols'>
<div onclick="togglePlay(0);"><img class="playbutton"/></div>
<div onclick="toggleStop(0);"><img class="stopbutton"/></div>
</div>
<img id="airplay-icon0" class="chromeicon"/> <p style="margin-top:-3px;">Label Here</p> <div onclick="toggleDevice(0);"><p id="off3" class="" style="margin-top:-68px;margin-left:-8px;">OFF</p> </div></div>
</div>
-->


</div>

</div>
<div id="info-message">

</div>


<div id="top-message">
Drop Magnet or .torrent
Drag and Drop
</div>
</div>
<div id="info-message">
any Magnet, .Torrent or Video File.
</div>

<div id="airplay-container" class="center">
<div id="airplay">

</div>

<div id="magnet" class="">

Expand Down

0 comments on commit 5b98bcc

Please sign in to comment.