diff --git a/MediaServe.php b/MediaServe.php index bc47420..80be3ec 100644 --- a/MediaServe.php +++ b/MediaServe.php @@ -124,11 +124,13 @@ class MediaServe { ================================ */ static function renderProgram() { + echo '
',PHP_EOL; foreach(self::$modules as $module) { if (method_exists('ktk\\MediaServe\\'.$module, 'onRender')) { call_user_func('ktk\\MediaServe\\'.$module.'::onRender'); } } + echo '
',PHP_EOL; } /* diff --git a/conf/codecs.ini b/conf/codecs.ini new file mode 100644 index 0000000..860384b --- /dev/null +++ b/conf/codecs.ini @@ -0,0 +1,4 @@ +mp3 = "audio/mpeg; codecs=mp3" +ogg = "audio/ogg; codecs=vorbis" +webm = "audio/webm; codecs=webm" +wav = "audio/wave; codecs=pcm_u8" diff --git a/index.php b/index.php index 32f368c..dd17cb2 100644 --- a/index.php +++ b/index.php @@ -1,7 +1,7 @@ ktk MediaServe - + - + diff --git a/main.css b/main.css index 4bbed01..108a785 100644 --- a/main.css +++ b/main.css @@ -4,3 +4,91 @@ html,body { height: 100%; width: 100%; } + +/* set base properties */ +#ktk_MediaServe { + position: relative; + font-family: sans-serif; + font-size: 9px; + width: 100%; + height: 100%; +} + +/* Reset general properties */ +#ktk_MediaServe * { + margin: 0; + padding: 0; + border: 0; + text-align: left; + font-size: 100%; +} + +/* Color properties for table elements */ +#ktk_MediaServe table { + background-color: #445; +} + +#ktk_MediaServe th input { + color: #DDB; + background-color: #555; +} + +#ktk_MediaServe div { + background-color: #333; + color: #CCC; +} + +#ktk_MediaServe th, +#ktk_MediaServe td { + background-color: #555 +} + +#ktk_MediaServe button, +#ktk_MediaServe input { + background-color: #666; + color: #CCA; + border-color: #222; +} + +#ktk_MediaServe button:hover, +#ktk_MediaServe input:hover { + background-color: #667; +} + +/* Style properties */ +#ktk_MediaServe button, +#ktk_MediaServe input { + padding: 1%; + border-bottom-width: 1px; + border-bottom-style: solid; + border-right-width: 1px; + border-right-style: solid; +} + +/* header elements */ +h1 { + +} + +/* Table style elements */ + +/* Form submission elements */ +#ktk_MediaServe td { + overflow: hidden; +} + +#ktk_MediaServe label, +#ktk_MediaServe button { + font-size: 100%; +} + +#ktk_MediaServe button:hover, +#ktk_MediaServe input:hover { + cursor: pointer; +} + +#ktk_MediaServe button { + background-color: #777; + color: #CCC; + padding: 1px; +} diff --git a/modules/BasicAuth.php b/modules/BasicAuth.php index ed59607..6906c6b 100644 --- a/modules/BasicAuth.php +++ b/modules/BasicAuth.php @@ -13,13 +13,13 @@ class BasicAuth { } } static public function onRender() { - echo '
'.PHP_EOL; - echo '
'; - echo ' '; - echo ' '; - echo ' '; - echo '
'; - echo '
'; + echo '
',PHP_EOL; + echo '
',PHP_EOL; + echo ' ',PHP_EOL; + echo ' ',PHP_EOL; + echo ' ',PHP_EOL; + echo '
',PHP_EOL; + echo '
',PHP_EOL; } static public function doLogout() { if (ini_get("session.use_cookies")) { diff --git a/modules/FileBrowser.css b/modules/FileBrowser.css index 12ea5f2..c7a3a0b 100644 --- a/modules/FileBrowser.css +++ b/modules/FileBrowser.css @@ -2,70 +2,50 @@ float: left; overflow: auto; margin: auto; - width:200px; + width: 20%; display: block; height:100%; - background-color: #444; overflow-x: hidden; - overflow-y: scroll; -} - -#ktk_MediaServe_FileBrowser * { - margin: 0; - padding: 0; - border: 0; - font-family: console, consolas, terminal; - font-size: 10px; - text-align: left; + overflow-y: auto; } #ktk_MediaServe_FileBrowser h1 { display: block; - height: 24px; + width: 100%; + height: 5%; overflow: hidden; - color: #CCC; } +#ktk_MediaServe_FileBrowser form, #ktk_MediaServe_FileBrowser table { width: 100%; } - -#ktk_MediaServe_FileBrowser table, -#ktk_MediaServe_FileBrowser tr, -#ktk_MediaServe_FileBrowser td, -#ktk_MediaServe_FileBrowser input -{ - background-color: #444; - color: #CCC; +#ktk_MediaServe_FileBrowser table { + table-layout: fixed; } -#ktk_MediaServe_FileBrowser th, +#ktk_MediaServe_FileBrowser tr { + width: 100%; +} + +#ktk_MediaServe_FileBrowser .file_name, +#ktk_MediaServe_FileBrowser #sort_name { + width: 100%; + overflow: hidden; +} + +#ktk_MediaServe_FileBrowser .file_ext, +#ktk_MediaServe_FileBrowser #sort_ext { + width: 15%; + min-width: 20%; +} + +#ktk_MediaServe_FileBrowser th button, #ktk_MediaServe_FileBrowser th input { - min-width: 32px; - background-color:#777; + width: 100%; } +#ktk_MediaServe_FileBrowser td button, #ktk_MediaServe_FileBrowser td input { - width: 160px; - background-color: #111; - color: #CCC; -} - -#ktk_MediaServe_FileBrowser button:hover, -#ktk_MediaServe_FileBrowser input:hover { - background-color: #777; - cursor: pointer; -} - -#ktk_MediaServe_FileBrowser button { - background-color: #777; - color: #CCC; - padding: 1px; -} - - -#ktk_MediaServe_FileBrowser_FilterInput { - border: 1px solid #777; - margin-left: 2px; - width: 115px; + width: 100%; } diff --git a/modules/FileBrowser.php b/modules/FileBrowser.php index 7735bb6..c46d644 100644 --- a/modules/FileBrowser.php +++ b/modules/FileBrowser.php @@ -28,7 +28,7 @@ class FileBrowser { } static function onRender() { - echo '
'.PHP_EOL; + echo '
',PHP_EOL; echo '

',MediaServe::getData('cwd'),'

'.PHP_EOL; if (MediaServe::checkModule("Playlist")) { echo '
'; @@ -46,30 +46,30 @@ class FileBrowser { echo ' '; echo ' '; echo '
'; - echo ' '.PHP_EOL; - echo ' '; - echo ' '; - echo ' '; - echo ' '.PHP_EOL; - echo ' '.PHP_EOL; - echo ' '; - echo ' '; - echo ' '; - echo ' '.PHP_EOL; + echo '
',PHP_EOL; + echo ' ',PHP_EOL; + echo ' ',PHP_EOL; + echo ' ',PHP_EOL; + echo ' ',PHP_EOL; + echo ' ',PHP_EOL; + echo ' ',PHP_EOL; + echo ' ',PHP_EOL; + echo ' ',PHP_EOL; + echo ' ',PHP_EOL; foreach(MediaServe::getData('dirs') as $dir) { - echo ' '.PHP_EOL; + echo ' ',PHP_EOL; } - echo ' '.PHP_EOL; + echo ' ',PHP_EOL; - echo ' '; - echo ' '; - echo ' '; + echo ' ',PHP_EOL; + echo ' ',PHP_EOL; + echo ' ',PHP_EOL; foreach(MediaServe::getData('files') as $file) { - echo ' '.PHP_EOL; + echo ' ',PHP_EOL; } - echo ' '.PHP_EOL; - echo '
'.$file[FileBrowser::F_EXT].'
'.$file[FileBrowser::F_EXT].'
'.PHP_EOL; - echo '
'.PHP_EOL; + echo ' ',PHP_EOL; + echo ' ',PHP_EOL; + echo '
',PHP_EOL; } /* COMMAND FUNCTIONS */ diff --git a/modules/Player.css b/modules/Player.css index beae20c..6baa346 100644 --- a/modules/Player.css +++ b/modules/Player.css @@ -1,4 +1,13 @@ -#ktk_MediaServe_Player { +div #ktk_MediaServe_Player { + position: relative; + float:left; background-color: #111; - height: 65%; + min-height: 60%; + min-width: 80%; + display: block; +} + +#ktk_MediaServe_Player audio { + display: block; + width: 100%; } diff --git a/modules/Player.php b/modules/Player.php index 73178ef..20b6938 100644 --- a/modules/Player.php +++ b/modules/Player.php @@ -3,15 +3,37 @@ namespace ktk\MediaServe; class Player { static public function onInit() { + if (!MediaServe::getData('player_file')) { + MediaServe::storeData('player_file', ""); + MediaServe::storeData('player_seek', 0); + MediaServe::storeData('player_play', FALSE); + } } static public function onProcess() { } static public function onRender() { + $codecs = MediaServe::loadConf('codecs'); + $filename = MediaServe::getData('player_file'); + $filetype = $codecs[pathinfo($filename, PATHINFO_EXTENSION)]; + if (!$filetype) { + $filetype = 'application/octet-stream'; + } echo '
',PHP_EOL; - echo "Player goes here"; + echo '',PHP_EOL; echo '
',PHP_EOL; } static public function onClose() { + // if we've started playing, do not auto play again + if (MediaServe::getData('player_play') == TRUE) { + MediaServe::storeData('player_play', FALSE); + } + } + + static public function openFile($file) { + MediaServe::storeData('player_file', $file); + MediaServe::storeData('player_play', TRUE); } } ?> diff --git a/modules/Playlist.css b/modules/Playlist.css index 1de4bbf..3e8573a 100644 --- a/modules/Playlist.css +++ b/modules/Playlist.css @@ -1,10 +1,31 @@ +#ktk_MediaServe_Playlist_Controls { + display: block; + border 1px solid red; + width: 100%; + height: 5%; +} + +#ktk_MediaServe_Playlist_Controls form { + float: left; + height: 100%; +} + #ktk_MediaServe_Playlist * { - font-size: 10px; } #ktk_MediaServe_Playlist { - background-color: #444; - color: #BBA; height: 35%; + width: 80%; overflow-y: auto; - font-size: 12px; +} + +#ktk_MediaServe_Playlist ul { + margin: 0; + padding: 0; +} + +#ktk_MediaServe_Playlist li { +} + +#ktk_MediaServe_Playlist li button { + width: 100%; } diff --git a/modules/Playlist.php b/modules/Playlist.php index 6ebf26b..e9537b7 100644 --- a/modules/Playlist.php +++ b/modules/Playlist.php @@ -2,19 +2,53 @@ namespace ktk\MediaServe; class Playlist { - static private $playlist; + const PATH_SHORT = 0; + const PATH_FULL = 1; + static public function onInit() { if (!MediaServe::getData('playlist')) { MediaServe::storeData('playlist', array()); + MediaServe::storeData('path_detail', self::PATH_SHORT); } } static public function onProcess() { } static public function onRender() { + $detail = MediaServe::getData('path_detail'); + + echo '
',PHP_EOL; + echo '
'; + echo ' '; + echo ' '; + echo ' '; + echo ' '; + echo ' '; + echo '
'; + echo '
'; + echo ' '; + echo ' '; + echo '
'; + echo '
',PHP_EOL; echo '
',PHP_EOL; - foreach (MediaServe::getData('playlist') as $file) { - echo $file.'
'; + echo '
',PHP_EOL; + echo ' '; + echo ' '; + echo ' ',PHP_EOL; + echo '
',PHP_EOL; echo '
',PHP_EOL; } static public function onClose() { @@ -23,5 +57,22 @@ class Playlist { static public function addFile($file) { array_push(MediaServe::getData('playlist'), $file); } + + static public function openFile($file) { + if (MediaServe::checkModule("Player")) { + Player::openFile($file); + } + } + + static public function clearPlaylist() { + MediaServe::storeData('playlist', array()); + } + + static function changePathDetail($detail) { + if ($detail != self::PATH_SHORT && $detail != self::PATH_FULL) { + return NULL; + } + MediaServe::storeData('path_detail', $detail); + } } ?>