Skip to content

V
vlc
Commit 6d3f1d60 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>
parent d4a0e2e2
Hide whitespace changes
Inline Side-by-side
Showing with 65 additions and 64 deletions
share/lua/http/css/main.css
View file @ 6d3f1d60
......@@ -3,7 +3,6 @@ root {
}
body{
}
#mainContainer{
text-align: center;
width: 800px;
......@@ -13,10 +12,11 @@ body{
}
#libraryContainer{
width: 800px;
margin-top: 2px;
}
#libraryTree{
height: 300px;
overflow:scroll;
overflow: auto;
white-space: nowrap;
text-align: left;
}
......@@ -25,14 +25,17 @@ body{
}
#mediaViewer{
min-height: 500px;
background-color:#222;
}
#player{
top:0px;
height: 500px;
width: 500px;
background-color:#222;
}
#seekSlider{
width: 98%;
margin-left:10px;
margin-left:5px;
}
#volumeSlider{
width: 100px;
......@@ -41,62 +44,58 @@ body{
#currentVolume{
display: inline-block;
}
#mediaTitle{
overflow: hidden;
padding: 5px;
}
#regular_layout #mediaTitle{
position: absolute;
top: 60px;
left: 0px;
width: 500px;
text-align: left;
}
#mobile_layout #mediaTitle{
top: 0px;
left: 10px;
width: 600px;
text-align: center;
padding: 5px;
overflow: auto;
}
#currentTime{
margin-top:-40px;
float: left;
text-align: left;
}
#totalTime{
margin-top:-40px;
float: right;
text-align: right;
}
#controlTable{
position:relative;
height: 150px;
}
#controlButtons{
text-align: left;
width: 380px;
}
/* div layout */
#regular_layout #controlButtons{
position: absolute;
top: 0;
left: 0;
top: 80px;
left: 10px;
padding: 0;
margin: 0;
text-align: left;
width: 380px;
}
/* still on table layout */
#mobile_layout #controlButtons{
#buttonzone {
position:absolute;
top: 200px;
width: 20px;
margin-left:-20px;
vertical-align:top;
padding:0px;
}
#buttonzone li{
float:left;
}
#buttonszone{
position: absolute;
top: 5px;
left: 388px;
width: 42px;
top: 20px;
width: 20px;
vertical-align: top;
margin: 0;
margin-left:-20px;
padding: 0;
}
#buttonszone li{
......@@ -105,19 +104,21 @@ body{
#volumesliderzone{
position: absolute;
top: 20px;
left: 435px;
top: 105px;
left: 410px;
width: 210px;
}
#volumeSlider{
width: 208px;
}
#libraryTree ul li a {
border:none;
}
#artszone{
position: absolute;
top: 0;
left: 648px;
top: 0px;
right: 10px;
width: 150px;
height: 150px;
vertical-align: top;
......@@ -125,9 +126,9 @@ body{
#seekContainer{
position:absolute;
left: 0;
top: 100px;
width: 645px;
left: 5px;
top: 55px;
width: 79%;
vertical-align: bottom;
}
......@@ -212,6 +213,11 @@ body{
font-size: 11px;
padding: 0px;
}
#window_equalizer {
height:80px !important ;
}
.eqBand{
margin-bottom: 10px;
margin-top: 10px;
......
share/lua/http/dialogs/browse_window.html
View file @ 6d3f1d60
......@@ -35,7 +35,7 @@
</script>
<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">
<li><?vlc gettext("Play List") ?></li>
</ol>
......
share/lua/http/index.html
View file @ 6d3f1d60
......@@ -50,6 +50,9 @@
$('#libraryContainer').animate({
height: 'toggle'
});
$('#buttonzone').animate({
width: 'toggle'
});
return false;
});
$('#buttonViewer').click(function(){
......@@ -194,9 +197,6 @@
<div class="centered">
<div id="mainContainer" class="centered">
<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">
<ul id="controlButtons">
<li id="buttonPrev" class="button48 ui-corner-all" title="<?vlc gettext("Previous") ?>"></li>
......@@ -230,30 +230,25 @@
</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 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 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>
</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">
VLC <?vlc print(vlc.misc.version() .. ' - Lua Web Interface - <a id="mobileintflink" href="/mobile.html">Mobile Interface</a> - ' .. vlc.misc.copyright()) ?>
</div>
......
share/lua/http/mobile_browse.html
View file @ 6d3f1d60
......@@ -24,7 +24,7 @@
<head>
<title><?vlc gettext("VLC media player - Web Interface") ?></title>
<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" />
<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" />
......
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