Began implementing a centralized CSS file for colors and the like. Modules should not define major styles on their own, but rather extend the CSS defined in main.css with positional data and similar. The largest problem, however, is that elements such as input are multifunctional via their type property and cannot be easily defined in a simple and cross-browser manner. It may be prudent to generalize input elements' style, but add particular classes for types for the Module to use if need be. It may also be wise to enhance(hopefully not bloat) the rendering system so as to allow for module organization and the like. This may be as simple as allowing Modules to be added to other Modules as Submodules. Rendering - and likely processing - would then be called within the context of another Module, thereby allowing greater finesse in element positioning.

master
kts 2014-05-24 18:35:02 -07:00
parent c854c8ab76
commit 54c657aa60
11 changed files with 264 additions and 87 deletions

View File

@ -124,11 +124,13 @@ class MediaServe {
================================
*/
static function renderProgram() {
echo ' <div id="ktk_MediaServe">',PHP_EOL;
foreach(self::$modules as $module) {
if (method_exists('ktk\\MediaServe\\'.$module, 'onRender')) {
call_user_func('ktk\\MediaServe\\'.$module.'::onRender');
}
}
echo ' </div>',PHP_EOL;
}
/*

4
conf/codecs.ini 100644
View File

@ -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"

View File

@ -1,7 +1,7 @@
<?php
include_once 'MediaServe.php';
ktk\MediaServe\MediaServe::loadModule("BasicAuth");
//ktk\MediaServe\MediaServe::loadModule("BasicAuth");
ktk\MediaServe\MediaServe::loadModule("ErrorReporter");
ktk\MediaServe\MediaServe::loadModule("FileBrowser");
ktk\MediaServe\MediaServe::loadModule("Playlist");
@ -17,10 +17,10 @@ ktk\MediaServe\MediaServe::processProgram();
<head>
<meta http-equiv="content-type" content="application/xhtml+xml; charset=UTF-8" />
<title>ktk MediaServe</title>
<?php ktk\MediaServe\MediaServe::renderCss() ?>
<?php ktk\MediaServe\MediaServe::renderCss() ?>
</head>
<body>
<?php ktk\MediaServe\MediaServe::renderProgram() ?>
<?php ktk\MediaServe\MediaServe::renderProgram() ?>
</body>
</html>
<?php ktk\MediaServe\MediaServe::closeProgram() ?>

View File

@ -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;
}

View File

@ -13,13 +13,13 @@ class BasicAuth {
}
}
static public function onRender() {
echo ' <div id="ktk_MediaServe_BasicAuth">'.PHP_EOL;
echo ' <form action="" method="POST">';
echo ' <input type="hidden" name="m" value="BasicAuth" />';
echo ' <input type="hidden" name="c" value="doLogout" />';
echo ' <input type="submit" name="" value="Exit" />';
echo ' </form>';
echo ' </div>';
echo ' <div id="ktk_MediaServe_BasicAuth">',PHP_EOL;
echo ' <form action="" method="POST">',PHP_EOL;
echo ' <input type="hidden" name="m" value="BasicAuth" />',PHP_EOL;
echo ' <input type="hidden" name="c" value="doLogout" />',PHP_EOL;
echo ' <input type="submit" name="" value="Exit" />',PHP_EOL;
echo ' </form>',PHP_EOL;
echo ' </div>',PHP_EOL;
}
static public function doLogout() {
if (ini_get("session.use_cookies")) {

View File

@ -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%;
}

View File

@ -28,7 +28,7 @@ class FileBrowser {
}
static function onRender() {
echo ' <div id="ktk_MediaServe_FileBrowser">'.PHP_EOL;
echo ' <div id="ktk_MediaServe_FileBrowser">',PHP_EOL;
echo ' <h1>',MediaServe::getData('cwd'),'</h1>'.PHP_EOL;
if (MediaServe::checkModule("Playlist")) {
echo ' <form action="" method="POST">';
@ -46,30 +46,30 @@ class FileBrowser {
echo ' <button type="submit" name="c" value="changeFilter">Filter</button>';
echo ' <button type="submit" name="c" value="resetFilter">Reset</button>';
echo ' </form>';
echo ' <table>'.PHP_EOL;
echo ' <form action="" method="POST">';
echo ' <input type="hidden" name="m" value="FileBrowser" />';
echo ' <input type="hidden" name="c" value="changeSort" />';
echo ' <tr><th><input type="submit" name="p[]" value="name" /></th><th><input type="submit" name="p[]" value="ext" /></th></tr>'.PHP_EOL;
echo ' </form>'.PHP_EOL;
echo ' <form action="" method="POST">';
echo ' <input type="hidden" name="m" value="FileBrowser" />';
echo ' <input type="hidden" name="c" value="changeCwd" />';
echo ' <tr><td><input type="submit" name="p[]" value="../"></td><td></td></tr>'.PHP_EOL;
echo ' <table>',PHP_EOL;
echo ' <form action="" method="POST">',PHP_EOL;
echo ' <input type="hidden" name="m" value="FileBrowser" />',PHP_EOL;
echo ' <input type="hidden" name="c" value="changeSort" />',PHP_EOL;
echo ' <tr><th id="sort_name"><input type="submit" name="p[]" value="name" /></th><th id="sort_ext"><input type="submit" name="p[]" value="ext" /></th></tr>',PHP_EOL;
echo ' </form>',PHP_EOL;
echo ' <form action="" method="POST">',PHP_EOL;
echo ' <input type="hidden" name="m" value="FileBrowser" />',PHP_EOL;
echo ' <input type="hidden" name="c" value="changeCwd" />',PHP_EOL;
echo ' <tr><td class="file_name"><input type="submit" name="p[]" value="../"></td><td class="file_ext"></td></tr>',PHP_EOL;
foreach(MediaServe::getData('dirs') as $dir) {
echo ' <tr><td><input type="submit" name="p[]" value="'.$dir[FileBrowser::F_NAME].'/"></td><td></td></tr>'.PHP_EOL;
echo ' <tr><td class="file_name"><input type="submit" name="p[]" value="'.$dir[FileBrowser::F_NAME].'/"></td><td class="file_ext"></td></tr>',PHP_EOL;
}
echo ' </form>'.PHP_EOL;
echo ' </form>',PHP_EOL;
echo ' <form action="" method="POST">';
echo ' <input type="hidden" name="m" value="FileBrowser" />';
echo ' <input type="hidden" name="c" value="openFile" />';
echo ' <form action="" method="POST">',PHP_EOL;
echo ' <input type="hidden" name="m" value="FileBrowser" />',PHP_EOL;
echo ' <input type="hidden" name="c" value="openFile" />',PHP_EOL;
foreach(MediaServe::getData('files') as $file) {
echo ' <tr><td><input type="submit" name="p[]" value="'.$file[FileBrowser::F_NAME].'"/></td><td>'.$file[FileBrowser::F_EXT].'</td></tr>'.PHP_EOL;
echo ' <tr><td class="file_name"><input type="submit" name="p[]" value="'.$file[FileBrowser::F_NAME].'"/></td><td class="file_ext">'.$file[FileBrowser::F_EXT].'</td></tr>',PHP_EOL;
}
echo ' </form>'.PHP_EOL;
echo ' </table>'.PHP_EOL;
echo ' </div>'.PHP_EOL;
echo ' </form>',PHP_EOL;
echo ' </table>',PHP_EOL;
echo ' </div>',PHP_EOL;
}
/* COMMAND FUNCTIONS */

View File

@ -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%;
}

View File

@ -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 '<div id="ktk_MediaServe_Player">',PHP_EOL;
echo "Player goes here";
echo '<audio src="',MediaServe::getData('player_file'),'" type="',$filetype,'" preload="metadata" ',(MediaServe::getData('player_play') == TRUE ? 'autoplay' : ''),' controls="controls">',PHP_EOL;
echo 'TODO: Fallback to Flash or something similar here, I suppose',PHP_EOL;
echo '</audio>',PHP_EOL;
echo '</div>',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);
}
}
?>

View File

@ -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%;
}

View File

@ -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 ' <div id="ktk_MediaServe_Playlist_Controls">',PHP_EOL;
echo ' <form action="" method="POST">';
echo ' <input type="hidden" name="m" value="Playlist" />';
echo ' <input type="hidden" name="c" value="changePathDetail" />';
echo ' <label for="p">Pathnames: </label>';
echo ' <button type="submit" name="p" value="',self::PATH_SHORT,'">Short</button>';
echo ' <button type="submit" name="p" value="',self::PATH_FULL,'">Full</button>';
echo ' </form>';
echo ' <form action="" method="POST">';
echo ' <input type="hidden" name="m" value="Playlist" />';
echo ' <button type="submit" name="c" value="clearPlaylist">Clear Playlist</button>';
echo ' </form>';
echo ' </div>',PHP_EOL;
echo ' <div id="ktk_MediaServe_Playlist">',PHP_EOL;
foreach (MediaServe::getData('playlist') as $file) {
echo $file.'<br />';
echo ' <form action="" method="POST">',PHP_EOL;
echo ' <input type="hidden" name="m" value="Playlist" />';
echo ' <input type="hidden" name="c" value="openFile" />';
echo ' <ul>';
if ($detail == self::PATH_FULL) {
foreach (MediaServe::getData('playlist') as $file) {
echo ' <li>';
echo '<button type="submit" name="p" value="',$file,'">',$file,'</button>';
echo ' </li>';
}
} else {
foreach (MediaServe::getData('playlist') as $file) {
echo ' <li>';
echo '<button type="submit" name="p" value="',$file,'">',basename($file),'</button>';
echo ' </li>';
}
}
echo ' </ul>',PHP_EOL;
echo ' </form>',PHP_EOL;
echo ' </div>',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);
}
}
?>