Skip to content

V
vlc-gpu
Commit 6972c01c authored by Konstantin Bogdanov's avatar Konstantin Bogdanov Committed by Jean-Baptiste Kempf
Browse files
Options

Improvements on the main Web Interface 

Signed-off-by: default avatarJean-Baptiste Kempf <jb@videolan.org>
(cherry picked from commit 6d3f1d60)
Signed-off-by: default avatarJean-Baptiste Kempf <jb@videolan.org>
parent 658d91e9
Show whitespace changes
Inline Side-by-side
Showing with 65 additions and 64 deletions
share/lua/http/css/main.css
View file @ 6972c01c
...@@ -3,7 +3,6 @@ root { ...@@ -3,7 +3,6 @@ root {
} }
body{ body{
} }
#mainContainer{ #mainContainer{
text-align: center; text-align: center;
width: 800px; width: 800px;
...@@ -13,10 +12,11 @@ body{ ...@@ -13,10 +12,11 @@ body{
} }
#libraryContainer{ #libraryContainer{
width: 800px; width: 800px;
margin-top: 2px;
} }
#libraryTree{ #libraryTree{
height: 300px; height: 300px;
overflow:scroll; overflow: auto;
white-space: nowrap; white-space: nowrap;
text-align: left; text-align: left;
} }
...@@ -25,14 +25,17 @@ body{ ...@@ -25,14 +25,17 @@ body{
} }
#mediaViewer{ #mediaViewer{
min-height: 500px; min-height: 500px;
background-color:#222;
} }
#player{ #player{
top:0px;
height: 500px; height: 500px;
width: 500px; width: 500px;
background-color:#222;
} }
#seekSlider{ #seekSlider{
width: 98%; width: 98%;
margin-left:10px; margin-left:5px;
} }
#volumeSlider{ #volumeSlider{
width: 100px; width: 100px;
...@@ -41,62 +44,58 @@ body{ ...@@ -41,62 +44,58 @@ body{
#currentVolume{ #currentVolume{
display: inline-block; display: inline-block;
} }
#mediaTitle{ #mediaTitle{
overflow: hidden;
padding: 5px;
}
#regular_layout #mediaTitle{
position: absolute; position: absolute;
top: 60px; top: 0px;
left: 0px; left: 10px;
width: 500px; width: 600px;
text-align: left; text-align: center;
} padding: 5px;
overflow: auto;
#mobile_layout #mediaTitle{
} }
#currentTime{ #currentTime{
margin-top:-40px;
float: left; float: left;
text-align: left; text-align: left;
} }
#totalTime{ #totalTime{
margin-top:-40px;
float: right; float: right;
text-align: right; text-align: right;
} }
#controlTable{ #controlTable{
position:relative; position:relative;
height: 150px; height: 150px;
} }
#controlButtons{ #controlButtons{
text-align: left;
width: 380px;
}
/* div layout */
#regular_layout #controlButtons{
position: absolute; position: absolute;
top: 0; top: 80px;
left: 0; left: 10px;
padding: 0; padding: 0;
margin: 0; margin: 0;
text-align: left;
width: 380px;
} }
#buttonzone {
/* still on table layout */ position:absolute;
#mobile_layout #controlButtons{ top: 200px;
width: 20px;
margin-left:-20px;
vertical-align:top;
padding:0px;
}
#buttonzone li{
float:left;
} }
#buttonszone{ #buttonszone{
position: absolute; position: absolute;
top: 5px; top: 20px;
left: 388px; width: 20px;
width: 42px;
vertical-align: top; vertical-align: top;
margin: 0; margin-left:-20px;
padding: 0; padding: 0;
} }
#buttonszone li{ #buttonszone li{
...@@ -105,19 +104,21 @@ body{ ...@@ -105,19 +104,21 @@ body{
#volumesliderzone{ #volumesliderzone{
position: absolute; position: absolute;
top: 20px; top: 105px;
left: 435px; left: 410px;
width: 210px; width: 210px;
} }
#volumeSlider{ #volumeSlider{
width: 208px; width: 208px;
} }
#libraryTree ul li a {
border:none;
}
#artszone{ #artszone{
position: absolute; position: absolute;
top: 0; top: 0px;
left: 648px; right: 10px;
width: 150px; width: 150px;
height: 150px; height: 150px;
vertical-align: top; vertical-align: top;
...@@ -125,9 +126,9 @@ body{ ...@@ -125,9 +126,9 @@ body{
#seekContainer{ #seekContainer{
position:absolute; position:absolute;
left: 0; left: 5px;
top: 100px; top: 55px;
width: 645px; width: 79%;
vertical-align: bottom; vertical-align: bottom;
} }
...@@ -212,6 +213,11 @@ body{ ...@@ -212,6 +213,11 @@ body{
font-size: 11px; font-size: 11px;
padding: 0px; padding: 0px;
} }
#window_equalizer {
height:80px !important ;
}
.eqBand{ .eqBand{
margin-bottom: 10px; margin-bottom: 10px;
margin-top: 10px; margin-top: 10px;
......
share/lua/http/dialogs/browse_window.html
View file @ 6972c01c
...@@ -35,7 +35,7 @@ ...@@ -35,7 +35,7 @@
</script> </script>
<div id="window_browse" title="<?vlc gettext("Media Browser") ?>"> <div id="window_browse" title="<?vlc gettext("Media Browser") ?>">
<div style="height:500px;overflow: scroll;"> <div style="height:500px;overflow: auto;">
<ol id='browse_elements' selectable="selectable"> <ol id='browse_elements' selectable="selectable">
<li><?vlc gettext("Play List") ?></li> <li><?vlc gettext("Play List") ?></li>
</ol> </ol>
......
share/lua/http/index.html
View file @ 6972c01c
...@@ -50,6 +50,9 @@ ...@@ -50,6 +50,9 @@
$('#libraryContainer').animate({ $('#libraryContainer').animate({
height: 'toggle' height: 'toggle'
}); });
$('#buttonzone').animate({
width: 'toggle'
});
return false; return false;
}); });
$('#buttonViewer').click(function(){ $('#buttonViewer').click(function(){
...@@ -194,9 +197,6 @@ ...@@ -194,9 +197,6 @@
<div class="centered"> <div class="centered">
<div id="mainContainer" class="centered"> <div id="mainContainer" class="centered">
<div id="controlContainer" class="ui-widget"> <div id="controlContainer" class="ui-widget">
<div class="ui-widget-header" style="text-align: left;">
<img src="images/vlc16x16.png" alt="VLC" width="16" height="16"/><?vlc gettext("Controls") ?>
</div>
<div id="controlTable" class="ui-widget-content"> <div id="controlTable" class="ui-widget-content">
<ul id="controlButtons"> <ul id="controlButtons">
<li id="buttonPrev" class="button48 ui-corner-all" title="<?vlc gettext("Previous") ?>"></li> <li id="buttonPrev" class="button48 ui-corner-all" title="<?vlc gettext("Previous") ?>"></li>
...@@ -230,30 +230,25 @@ ...@@ -230,30 +230,25 @@
</div> </div>
</div> </div>
</div> </div>
<div id="libraryContainer" class="ui-widget">
<ul id="buttonzone" align="left" class="ui-widget-content" style="overflow:hidden; white-space: nowrap;">
<li id="buttonShuffle" class="button ui-widget ui-state-default ui-corner-all" title="<?vlc gettext("Shuffle") ?>"><span class="ui-icon ui-icon-shuffle"></span></li>
<li id="buttonLoop" class="button ui-widget ui-state-default ui-corner-all" title="<?vlc gettext("Loop") ?>"><span class="ui-icon ui-icon-refresh"></span></li>
<li id="buttonRepeat" class="button ui-widget ui-state-default ui-corner-all" title="<?vlc gettext("Repeat") ?>"><span class="ui-icon ui-icon-arrowreturnthick-1-w"></span></li>
<li id="buttonPlEmpty" class="button ui-widget ui-state-default ui-corner-all" title="<?vlc gettext("Empty Playlist") ?>"><span class="ui-icon ui-icon-trash"></span></li>
<li id="buttonPlAdd" class="button ui-widget ui-state-default ui-corner-all" title="<?vlc gettext("Queue Selected") ?>"><span class="ui-icon ui-icon-plus"></span></li>
<li id="buttonPlPlay" class="button ui-widget ui-state-default ui-corner-all" title="<?vlc gettext("Play Selected") ?>"><span class="ui-icon ui-icon-play"></span></li>
<li id="buttonRefresh" class="button ui-widget ui-state-default ui-corner-all" title="<?vlc gettext("Refresh List") ?>"><span class="ui-icon ui-icon-arrowrefresh-1-n"></span></li>
</ul>
<div id="libraryTree" class="ui-widget-content"></div>
</div>
<div id="viewContainer" class="ui-widget"> <div id="viewContainer" class="ui-widget">
<div class="ui-widget-header" style="text-align: left;"><img src="images/vlc16x16.png" alt="VLC" width="16" height="16"/><?vlc gettext("Viewer") ?></div>
<div id="mediaViewer" class="ui-widget-content"> <div id="mediaViewer" class="ui-widget-content">
<div href="http://localhost:8081/stream.flv" style="display:block; width:100%" id="player"> <div href="http://localhost:8081/stream.flv" style="display:block; width:100%" id="player">
<p><?vlc gettext("Loading flowplayer...") ?><br/><?vlc gettext("If nothing appears, check your internet connection.") ?></p> <p><?vlc gettext("Loading flowplayer...") ?><br/><?vlc gettext("If nothing appears, check your internet connection.") ?></p>
</div> </div>
</div> </div>
</div> </div>
<div id="libraryContainer" class="ui-widget">
<div class="ui-widget-header" style="text-align: left;">
<img src="images/vlc16x16.png" alt="VLC" width="16" height="16"/><?vlc gettext("Library") ?>
</div>
<div align="left" class="ui-widget-content" style="overflow:hidden; white-space: nowrap;">
<div id="buttonShuffle" class="button ui-widget ui-state-default ui-corner-all" title="<?vlc gettext("Shuffle") ?>"><span class="ui-icon ui-icon-shuffle"></span></div>
<div id="buttonLoop" class="button ui-widget ui-state-default ui-corner-all" title="<?vlc gettext("Loop") ?>"><span class="ui-icon ui-icon-refresh"></span></div>
<div id="buttonRepeat" class="button ui-widget ui-state-default ui-corner-all" title="<?vlc gettext("Repeat") ?>"><span class="ui-icon ui-icon-arrowreturnthick-1-w"></span></div>
<div id="buttonPlEmpty" class="button ui-widget ui-state-default ui-corner-all" title="<?vlc gettext("Empty Playlist") ?>"><span class="ui-icon ui-icon-trash"></span></div>
<div id="buttonPlAdd" class="button ui-widget ui-state-default ui-corner-all" title="<?vlc gettext("Queue Selected") ?>"><span class="ui-icon ui-icon-plus"></span></div>
<div id="buttonPlPlay" class="button ui-widget ui-state-default ui-corner-all" title="<?vlc gettext("Play Selected") ?>"><span class="ui-icon ui-icon-play"></span></div>
<div id="buttonRefresh" class="button ui-widget ui-state-default ui-corner-all" title="<?vlc gettext("Refresh List") ?>"><span class="ui-icon ui-icon-arrowrefresh-1-n"></span></div>
</div>
<div id="libraryTree" class="ui-widget-content"></div>
</div>
<div class="footer"> <div class="footer">
VLC <?vlc print(vlc.misc.version() .. ' - Lua Web Interface - <a id="mobileintflink" href="/mobile.html">Mobile Interface</a> - ' .. vlc.misc.copyright()) ?> VLC <?vlc print(vlc.misc.version() .. ' - Lua Web Interface - <a id="mobileintflink" href="/mobile.html">Mobile Interface</a> - ' .. vlc.misc.copyright()) ?>
</div> </div>
......
share/lua/http/mobile_browse.html
View file @ 6972c01c
...@@ -24,7 +24,7 @@ ...@@ -24,7 +24,7 @@
<head> <head>
<title><?vlc gettext("VLC media player - Web Interface") ?></title> <title><?vlc gettext("VLC media player - Web Interface") ?></title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="viewport" content="width=device-width; user-scalable=no" /> <meta name="viewport" content="width=device-width" />
<link href="favicon.ico" type="image/x-icon" rel="shortcut icon" /> <link href="favicon.ico" type="image/x-icon" rel="shortcut icon" />
<script type="text/javascript" src="js/common.js"></script> <script type="text/javascript" src="js/common.js"></script>
<link type="text/css" href="css/ui-lightness/jquery-ui-1.8.13.custom.css" rel="stylesheet" /> <link type="text/css" href="css/ui-lightness/jquery-ui-1.8.13.custom.css" rel="stylesheet" />
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment