App-MHFS
view release on metacpan or search on metacpan
share/public_html/index.html view on Meta::CPAN
<!DOCTYPE html>
<html>
<head>
<style>
body {
color: #ababab;
background: #000;
font-family: Segoe UI, Helvetica, Arial, Sans-Serif;
}
h2 {
display: block;
font-size: 2em;
margin-block-start: 0.67em;
margin-block-end: 0.67em;
margin-inline-start: 0px;
margin-inline-end: 0px;
share/public_html/static/fmp4/music.css view on Meta::CPAN
html, body{
padding: 0px;
margin: 0px;
}
body {
color: #ababab;
background: #000;
font-family: Segoe UI, Helvetica, Arial, Sans-Serif;
}
.header {
position: fixed;
top: 0;
padding-left: 25px;
background-color: #000;
width: 100%;
}
.body {
/*margin-top: 90px;
margin-bottom: 200px;
padding-left: 25px;*/
position:absolute;
top:90px;
bottom: 200px;
left: 25px;
right: 0px;
overflow: auto;
}
#musicdb {
background-color:gray;
padding: 20px;
text-align: center;
}
#videotitle {
color: #000;
}
.track:hover {
background-color: yellow;
}
.footer {
position: fixed;
bottom: 0;
width: 100%;
height: 200px;
padding-left: 25px;
background-color:blue;
}
audio {
width: 80%; margin:20px;
}
#seekbar {
width: 60%; margin:20px;
}
share/public_html/static/hls.js view on Meta::CPAN
};
var NR_ROWS = 15,
NR_COLS = 100;
// Tables to look up row from PAC data
var rowsLowCh1 = { 0x11: 1, 0x12: 3, 0x15: 5, 0x16: 7, 0x17: 9, 0x10: 11, 0x13: 12, 0x14: 14 };
var rowsHighCh1 = { 0x11: 2, 0x12: 4, 0x15: 6, 0x16: 8, 0x17: 10, 0x13: 13, 0x14: 15 };
var rowsLowCh2 = { 0x19: 1, 0x1A: 3, 0x1D: 5, 0x1E: 7, 0x1F: 9, 0x18: 11, 0x1B: 12, 0x1C: 14 };
var rowsHighCh2 = { 0x19: 2, 0x1A: 4, 0x1D: 6, 0x1E: 8, 0x1F: 10, 0x1B: 13, 0x1C: 15 };
var backgroundColors = ['white', 'green', 'blue', 'cyan', 'red', 'yellow', 'magenta', 'black', 'transparent'];
/**
* Simple logger class to be able to write with time-stamps and filter on level.
*/
var cea_608_parser_logger = {
verboseFilter: { 'DATA': 3, 'DEBUG': 3, 'INFO': 2, 'WARNING': 2, 'TEXT': 1, 'ERROR': 0 },
time: null,
verboseLevel: 0, // Only write errors
setTime: function setTime(newTime) {
this.time = newTime;
share/public_html/static/hls.js view on Meta::CPAN
var numArrayToHexArray = function numArrayToHexArray(numArray) {
var hexArray = [];
for (var j = 0; j < numArray.length; j++) {
hexArray.push(numArray[j].toString(16));
}
return hexArray;
};
var PenState = function () {
function PenState(foreground, underline, italics, background, flash) {
cea_608_parser__classCallCheck(this, PenState);
this.foreground = foreground || 'white';
this.underline = underline || false;
this.italics = italics || false;
this.background = background || 'black';
this.flash = flash || false;
}
PenState.prototype.reset = function reset() {
this.foreground = 'white';
this.underline = false;
this.italics = false;
this.background = 'black';
this.flash = false;
};
PenState.prototype.setStyles = function setStyles(styles) {
var attribs = ['foreground', 'underline', 'italics', 'background', 'flash'];
for (var i = 0; i < attribs.length; i++) {
var style = attribs[i];
if (styles.hasOwnProperty(style)) {
this[style] = styles[style];
}
}
};
PenState.prototype.isDefault = function isDefault() {
return this.foreground === 'white' && !this.underline && !this.italics && this.background === 'black' && !this.flash;
};
PenState.prototype.equals = function equals(other) {
return this.foreground === other.foreground && this.underline === other.underline && this.italics === other.italics && this.background === other.background && this.flash === other.flash;
};
PenState.prototype.copy = function copy(newPenState) {
this.foreground = newPenState.foreground;
this.underline = newPenState.underline;
this.italics = newPenState.italics;
this.background = newPenState.background;
this.flash = newPenState.flash;
};
PenState.prototype.toString = function toString() {
return 'color=' + this.foreground + ', underline=' + this.underline + ', italics=' + this.italics + ', background=' + this.background + ', flash=' + this.flash;
};
return PenState;
}();
/**
* Unicode character with styling and background.
* @constructor
*/
var StyledUnicodeChar = function () {
function StyledUnicodeChar(uchar, foreground, underline, italics, background, flash) {
cea_608_parser__classCallCheck(this, StyledUnicodeChar);
this.uchar = uchar || ' '; // unicode character
this.penState = new PenState(foreground, underline, italics, background, flash);
}
StyledUnicodeChar.prototype.reset = function reset() {
this.uchar = ' ';
this.penState.reset();
};
StyledUnicodeChar.prototype.setChar = function setChar(uchar, newPenState) {
this.uchar = uchar;
this.penState.copy(newPenState);
share/public_html/static/hls.js view on Meta::CPAN
}
this.currRow = newRow;
var row = this.rows[this.currRow];
if (pacData.indent !== null) {
var indent = pacData.indent;
var prevPos = Math.max(indent - 1, 0);
row.setCursor(pacData.indent);
pacData.color = row.chars[prevPos].penState.foreground;
}
var styles = { foreground: pacData.color, underline: pacData.underline, italics: pacData.italics, background: 'black', flash: false };
this.setPen(styles);
};
/**
* Set background/extra foreground, but first do back_space, and then insert space (backwards compatibility).
*/
CaptionScreen.prototype.setBkgData = function setBkgData(bkgData) {
cea_608_parser_logger.log('INFO', 'bkgData = ' + JSON.stringify(bkgData));
this.backSpace();
this.setPen(bkgData);
this.insertChar(0x20); // Space
};
share/public_html/static/hls.js view on Meta::CPAN
if (charCodes) {
var hexCodes = numArrayToHexArray(charCodes);
cea_608_parser_logger.log('DEBUG', 'Char codes = ' + hexCodes.join(','));
this.lastCmdA = null;
this.lastCmdB = null;
}
return charCodes;
};
/**
* Parse extended background attributes as well as new foreground color black.
* @returns{Boolean} Tells if background attributes are found
*/
Cea608Parser.prototype.parseBackgroundAttributes = function parseBackgroundAttributes(a, b) {
var bkgData = void 0,
index = void 0,
chNr = void 0,
channel = void 0;
var case1 = (a === 0x10 || a === 0x18) && b >= 0x20 && b <= 0x2f;
var case2 = (a === 0x17 || a === 0x1f) && b >= 0x2d && b <= 0x2f;
if (!(case1 || case2)) {
return false;
}
bkgData = {};
if (a === 0x10 || a === 0x18) {
index = Math.floor((b - 0x20) / 2);
bkgData.background = backgroundColors[index];
if (b % 2 === 1) {
bkgData.background = bkgData.background + '_semi';
}
} else if (b === 0x2d) {
bkgData.background = 'transparent';
} else {
bkgData.foreground = 'black';
if (b === 0x2f) {
bkgData.underline = true;
}
}
chNr = a < 0x18 ? 1 : 2;
channel = this.channels[chNr - 1];
channel.setBkgData(bkgData);
this.lastCmdA = null;
share/public_html/static/music_inc/music.css view on Meta::CPAN
html, body{
padding: 0px;
margin: 0px;
}
body {
color: #ababab;
background: #000;
font-family: Segoe UI, Helvetica, Arial, Sans-Serif;
}
.header {
position: fixed;
top: 0;
padding-left: 25px;
background-color: #000;
width: 100%;
}
.body {
/*margin-top: 90px;
margin-bottom: 200px;
padding-left: 25px;*/
position:absolute;
top:90px;
bottom: 200px;
left: 25px;
right: 0px;
overflow: auto;
}
.track:hover {
background-color: yellow;
}
.footer {
position: fixed;
bottom: 0;
width: 100%;
height: 200px;
padding-left: 25px;
background-color:blue;
}
audio {
width: 80%; margin:20px;
}
#seekbar {
width: 60%; margin:20px;
}
share/public_html/static/music_inc/src/miniaudio.h view on Meta::CPAN
#define MA_SUPPORT_OSS /* Only support OSS on specific platforms with known support. */
#endif
#endif
#if defined(MA_APPLE)
#define MA_SUPPORT_COREAUDIO
#endif
#if defined(MA_EMSCRIPTEN)
#define MA_SUPPORT_WEBAUDIO
#endif
/* Explicitly disable the Null backend for Emscripten because it uses a background thread which is not properly supported right now. */
#if !defined(MA_EMSCRIPTEN)
#define MA_SUPPORT_NULL
#endif
#if !defined(MA_NO_WASAPI) && defined(MA_SUPPORT_WASAPI)
#define MA_ENABLE_WASAPI
#endif
#if !defined(MA_NO_DSOUND) && defined(MA_SUPPORT_DSOUND)
#define MA_ENABLE_DSOUND
share/public_html/static/music_inc/src/miniaudio.h view on Meta::CPAN
pDevice->capture.internalFormat = data.formatOut;
pDevice->capture.internalChannels = data.channelsOut;
pDevice->capture.internalSampleRate = data.sampleRateOut;
MA_COPY_MEMORY(pDevice->capture.internalChannelMap, data.channelMapOut, sizeof(data.channelMapOut));
pDevice->capture.internalPeriodSizeInFrames = data.periodSizeInFramesOut;
pDevice->capture.internalPeriods = data.periodsOut;
#if defined(MA_APPLE_DESKTOP)
/*
If we are using the default device we'll need to listen for changes to the system's default device so we can seemlessly
switch the device in the background.
*/
if (pConfig->capture.pDeviceID == NULL) {
ma_device__track__coreaudio(pDevice);
}
#endif
}
/* Playback. */
if (pConfig->deviceType == ma_device_type_playback || pConfig->deviceType == ma_device_type_duplex) {
ma_device_init_internal_data__coreaudio data;
share/public_html/static/music_inc/src/miniaudio.h view on Meta::CPAN
pDevice->playback.internalFormat = data.formatOut;
pDevice->playback.internalChannels = data.channelsOut;
pDevice->playback.internalSampleRate = data.sampleRateOut;
MA_COPY_MEMORY(pDevice->playback.internalChannelMap, data.channelMapOut, sizeof(data.channelMapOut));
pDevice->playback.internalPeriodSizeInFrames = data.periodSizeInFramesOut;
pDevice->playback.internalPeriods = data.periodsOut;
#if defined(MA_APPLE_DESKTOP)
/*
If we are using the default device we'll need to listen for changes to the system's default device so we can seemlessly
switch the device in the background.
*/
if (pConfig->playback.pDeviceID == NULL && (pConfig->deviceType != ma_device_type_duplex || pConfig->capture.pDeviceID != NULL)) {
ma_device__track__coreaudio(pDevice);
}
#endif
}
pDevice->coreaudio.originalPeriodSizeInFrames = pConfig->periodSizeInFrames;
pDevice->coreaudio.originalPeriodSizeInMilliseconds = pConfig->periodSizeInMilliseconds;
pDevice->coreaudio.originalPeriods = pConfig->periods;
share/public_html/static/music_inc/src/miniaudio.h view on Meta::CPAN
pDevice->playback.internalSampleRate = pDevice->sampleRate;
ma_channel_map_copy(pDevice->playback.internalChannelMap, pDevice->playback.channelMap, pDevice->playback.channels);
result = ma_mutex_init(&pDevice->lock);
if (result != MA_SUCCESS) {
return ma_context_post_error(pContext, NULL, MA_LOG_LEVEL_ERROR, "Failed to create mutex.", result);
}
/*
When the device is started, the worker thread is the one that does the actual startup of the backend device. We
use a semaphore to wait for the background thread to finish the work. The same applies for stopping the device.
Each of these semaphores is released internally by the worker thread when the work is completed. The start
semaphore is also used to wake up the worker thread.
*/
result = ma_event_init(&pDevice->wakeupEvent);
if (result != MA_SUCCESS) {
ma_mutex_uninit(&pDevice->lock);
return ma_context_post_error(pContext, NULL, MA_LOG_LEVEL_ERROR, "Failed to create worker thread wakeup event.", result);
}
share/public_html/static/music_worklet_inprogress/decoder/deps/miniaudio/miniaudio.h view on Meta::CPAN
This relieves the audio thread of time-consuming decoding which can negatively affect scalability
due to the audio thread needing to complete it's work extremely quickly to avoid glitching.
Asynchronous decoding is achieved through a job system. There is a central multi-producer,
multi-consumer, fixed-capacity job queue. When some asynchronous work needs to be done, a job is
posted to the queue which is then read by a job thread. The number of job threads can be
configured for improved scalability, and job threads can all run in parallel without needing to
worry about the order of execution (how this is achieved is explained below).
When a sound is being loaded asynchronously, playback can begin before the sound has been fully
decoded. This enables the application to start playback of the sound quickly, while at the same
time allowing to resource manager to keep loading in the background. Since there may be less
threads than the number of sounds being loaded at a given time, a simple scheduling system is used
to keep decoding time balanced and fair. The resource manager solves this by splitting decoding
into chunks called pages. By default, each page is 1 second long. When a page has been decoded, a
new job will be posted to start decoding the next page. By dividing up decoding into pages, an
individual sound shouldn't ever delay every other sound from having their first page decoded. Of
course, when loading many sounds at the same time, there will always be an amount of time required
to process jobs in the queue so in heavy load situations there will still be some delay. To
determine if a data source is ready to have some frames read, use
`ma_resource_manager_data_source_get_available_frames()`. This will return the number of frames
available starting from the current position.
share/public_html/static/music_worklet_inprogress/decoder/deps/miniaudio/miniaudio.h view on Meta::CPAN
#if defined(MA_APPLE)
#define MA_SUPPORT_COREAUDIO
#endif
#if defined(MA_EMSCRIPTEN)
#define MA_SUPPORT_WEBAUDIO
#endif
/* All platforms should support custom backends. */
#define MA_SUPPORT_CUSTOM
/* Explicitly disable the Null backend for Emscripten because it uses a background thread which is not properly supported right now. */
#if !defined(MA_EMSCRIPTEN)
#define MA_SUPPORT_NULL
#endif
#if defined(MA_SUPPORT_WASAPI) && !defined(MA_NO_WASAPI) && (!defined(MA_ENABLE_ONLY_SPECIFIC_BACKENDS) || defined(MA_ENABLE_WASAPI))
#define MA_HAS_WASAPI
#endif
#if defined(MA_SUPPORT_DSOUND) && !defined(MA_NO_DSOUND) && (!defined(MA_ENABLE_ONLY_SPECIFIC_BACKENDS) || defined(MA_ENABLE_DSOUND))
#define MA_HAS_DSOUND
share/public_html/static/music_worklet_inprogress/decoder/deps/miniaudio/miniaudio.h view on Meta::CPAN
/*
The first thing to do is wait for an operation slot to become available. We only have a single slot for this, but we could extend this later
to support queing of operations.
*/
result = ma_semaphore_wait(&pDevice->null_device.operationSemaphore);
if (result != MA_SUCCESS) {
return result; /* Failed to wait for the event. */
}
/*
When we get here it means the background thread is not referencing the operation code and it can be changed. After changing this we need to
signal an event to the worker thread to let it know that it can start work.
*/
pDevice->null_device.operation = operation;
/* Once the operation code has been set, the worker thread can start work. */
if (ma_event_signal(&pDevice->null_device.operationEvent) != MA_SUCCESS) {
return MA_ERROR;
}
/* We want everything to be synchronous so we're going to wait for the worker thread to complete it's operation. */
share/public_html/static/music_worklet_inprogress/decoder/deps/miniaudio/miniaudio.h view on Meta::CPAN
pDescriptorCapture->sampleRate = data.sampleRateOut;
MA_COPY_MEMORY(pDescriptorCapture->channelMap, data.channelMapOut, sizeof(data.channelMapOut));
pDescriptorCapture->periodSizeInFrames = data.periodSizeInFramesOut;
pDescriptorCapture->periodCount = data.periodsOut;
#if defined(MA_APPLE_DESKTOP)
ma_get_AudioObject_uid(pDevice->pContext, pDevice->coreaudio.deviceObjectIDCapture, sizeof(pDevice->capture.id.coreaudio), pDevice->capture.id.coreaudio);
/*
If we are using the default device we'll need to listen for changes to the system's default device so we can seemlessly
switch the device in the background.
*/
if (pConfig->capture.pDeviceID == NULL) {
ma_device__track__coreaudio(pDevice);
}
#endif
}
/* Playback. */
if (pConfig->deviceType == ma_device_type_playback || pConfig->deviceType == ma_device_type_duplex) {
ma_device_init_internal_data__coreaudio data;
share/public_html/static/music_worklet_inprogress/decoder/deps/miniaudio/miniaudio.h view on Meta::CPAN
pDescriptorPlayback->sampleRate = data.sampleRateOut;
MA_COPY_MEMORY(pDescriptorPlayback->channelMap, data.channelMapOut, sizeof(data.channelMapOut));
pDescriptorPlayback->periodSizeInFrames = data.periodSizeInFramesOut;
pDescriptorPlayback->periodCount = data.periodsOut;
#if defined(MA_APPLE_DESKTOP)
ma_get_AudioObject_uid(pDevice->pContext, pDevice->coreaudio.deviceObjectIDPlayback, sizeof(pDevice->playback.id.coreaudio), pDevice->playback.id.coreaudio);
/*
If we are using the default device we'll need to listen for changes to the system's default device so we can seemlessly
switch the device in the background.
*/
if (pDescriptorPlayback->pDeviceID == NULL && (pConfig->deviceType != ma_device_type_duplex || pDescriptorCapture->pDeviceID != NULL)) {
ma_device__track__coreaudio(pDevice);
}
#endif
}
/*
share/public_html/static/music_worklet_inprogress/decoder/deps/miniaudio/miniaudio.h view on Meta::CPAN
pDevice->playback.channelMixMode = pConfig->playback.channelMixMode;
result = ma_mutex_init(&pDevice->startStopLock);
if (result != MA_SUCCESS) {
return result;
}
/*
When the device is started, the worker thread is the one that does the actual startup of the backend device. We
use a semaphore to wait for the background thread to finish the work. The same applies for stopping the device.
Each of these semaphores is released internally by the worker thread when the work is completed. The start
semaphore is also used to wake up the worker thread.
*/
result = ma_event_init(&pDevice->wakeupEvent);
if (result != MA_SUCCESS) {
ma_mutex_uninit(&pDevice->startStopLock);
return result;
}
share/public_html/static/music_worklet_inprogress/music.css view on Meta::CPAN
html, body{
padding: 0px;
margin: 0px;
}
body {
color: #ababab;
background: #000;
font-family: Segoe UI, Helvetica, Arial, Sans-Serif;
}
.header {
position: fixed;
top: 0;
padding-left: 2%;
background-color: #000;
height: 10%;
width: 100%;
min-height: 110px;
display: block;
}
.navbar {
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
}
.navbar li {
float: left;
background-color: blue;
border-style: solid solid solid solid;
border-color: blue;
border-bottom-color: #ababab;
}
.navbar li a {
display: block;
text-align: center;
text-decoration: none;
padding-right: 16px;
color: #ababab;
}
.navbar li:hover {
background-color: #666666;
border-top-color: #666666;
}
.navbaractive {
background-color: #000 !important;
border-color: #ababab !important;
border-style: solid hidden hidden hidden !important;
font-weight: bold;
}
.navbarright {
border-left-color: #ababab !important;
border-right-style: hidden !important;
}
share/public_html/static/music_worklet_inprogress/music.css view on Meta::CPAN
/* The main views, music library, art view, etc*/
.mainview {
position: fixed;
top: max(10%, 110px);
overflow: auto;
box-sizing: border-box;
padding-left: 2%;
width: 100%;
height: calc(100% - max(20%, 250px) - max(10%, 110px)); /*the whole page minus the header and footer*/
background-color: #000;
}
.track:hover {
background-color: #00796b;
}
#artview {
display: none;
}
.artviewimg {
width: 100%;
height: 100%;
object-fit: contain;
object-position: left;
max-height: inherit;
}
.movableWindow {
position: absolute;
z-index: 9;
background-color: #f1f1f1;
border: 1px solid #d3d3d3;
text-align: center;
box-sizing: border-box;
resize: both;
overflow: hidden;
}
.movableWindowCloseButton {
color: #f1f1f1;
float: right;
font-size: 28px;
font-weight: bold;
line-height: 16px;
}
.movableWindowCloseButton:hover,
.movableWindowCloseButton:focus {
color: #000;
text-decoration: none;
cursor: pointer;
background-color: #e81123
}
.movableWindowTitleBar {
height: 20px;
cursor: move;
z-index: 10;
background-color: blue;/*#2196F3;*/
color: #f1f1f1;
overflow: hidden;
display: flex;
justify-content: space-between;
}
.movableWindowTitleText {
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
share/public_html/static/music_worklet_inprogress/music.css view on Meta::CPAN
/* music player is always shown at the bottom */
.footer {
position: fixed;
box-sizing: border-box;
bottom: 0;
width: 100%;
height: max(20%, 250px);
padding-left: 2%;
padding-top: 10px;
background-color:blue;
}
/* First the prev, current, and next tracks*/
.ptdiv {
position: absolute;
height: 70%;
width: 80%;
overflow: hidden;
display: flex;
flex-direction: row;
share/public_html/static/music_worklet_inprogress/music_inc_module.js view on Meta::CPAN
const clamp = (num, min, max) => Math.min(Math.max(num, min), max);
const WindowManager = function() {
const that = {};
// adds a window to the window stack and updates Z
const AddWindow = function(awindow) {
let zindexToUse = 2;
if(that.windowstack) {
that.windowstack.domwindow.getElementsByClassName("movableWindowTitleBar")[0].style.backgroundColor = "#0095FF";
zindexToUse = parseInt(that.windowstack.domwindow.style.zIndex)+1;
awindow.prev = that.windowstack;
that.windowstack.next = awindow;
}
that.windowstack = awindow;
awindow.domwindow.getElementsByClassName("movableWindowTitleBar")[0].style.backgroundColor = "#0000FF";
awindow.domwindow.style.zIndex = zindexToUse;
};
// removes a window to the window stack and updates Z
const RemoveWindow = function(awindow) {
let nextwindow = awindow.next;
const prevwindow = awindow.prev;
// remove awindow from the list
if(prevwindow) {
awindow.prev = undefined;
share/public_html/static/music_worklet_inprogress/music_inc_module.js view on Meta::CPAN
movableWindow.style.maxWidth = document.getElementsByTagName("body")[0].offsetWidth;
movableWindowContent.style.maxHeight = (footer.offsetTop - headerBottom) - 20;
const fullwindow = { 'domwindow' : movableWindow};
// remove from dom and the window stack
closeButton.addEventListener('click', function() {
movableWindow.remove();
RemoveWindow(fullwindow);
if(that.windowstack) {
that.windowstack.domwindow.getElementsByClassName("movableWindowTitleBar")[0].style.backgroundColor = "#0000FF";
}
});
// on mouse down move window to topmost
const makeTopMost = function() {
const nextwindow = fullwindow.next;
// already topmost if no next window
if(!nextwindow) {
return;
}
share/public_html/static/music_worklet_inprogress/player/mhfsplayer.js view on Meta::CPAN
return that;
};
export default MHFSPlayer;
// CD image svg below
// By derex99 - Own work, CC BY-SA 3.0, https://commons.wikimedia.org/w/index.php?curid=3836116
CDIMAGE = `<?xml version="1.0" encoding="UTF-8"?>
<!-- Generator: Adobe Illustrator 13.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 14948) -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="128px" height="128px" viewBox="0 0 128 128" enable-background="new 0 0 128 128" xml:space="preserve">
<defs>
<filter id="Gaussian_Blur">
<feGaussianBlur in="SourceGraphic" stdDeviation="3"/>
</filter>
<filter id="Gaussian_Blur2">
<feGaussianBlur in="SourceGraphic" stdDeviation="1"/>
</filter>
</defs>
<g id="Layer_3" opacity="0.6">
<g>
share/templates/music_legacy.html view on Meta::CPAN
<head>
<style type="text/css">
html, body{
padding: 0px;
margin: 0px;
}
body {
color: #ababab;
background: #000;
font-family: Segoe UI, Helvetica, Arial, Sans-Serif;
}
.header {
position: fixed;
top: 0;
padding-left: 25px;
background-color: #000;
width: 100%;
}
.body {
margin-top: 90px;
margin-bottom: 200px;
padding-left: 25px;
}
.track:hover {
background-color: yellow;
}
.footer {
position: fixed;
bottom: 0;
width: 100%;
height: 200px;
padding-left: 25px;
}
share/templates/music_legacy.html view on Meta::CPAN
<body>
<div class="header row">
<h1>Music</h1>
</div>
<div class="body row scroll-y">
<div id="musicdb">
<TMPL_VAR NAME="musicdb">
<br><br><br><br><br><br><br><br><br><br><br>
</div>
</div>
<div class="footer row" style="background-color:blue;">
<table border="1" width="80%">
<tr><th>Previous</th><th>Now Playing</th><th>Next</th></tr>
<tr><td><div id="prev_text"></div></td><td><div id="play_text"></div></td><td><div id="next_text"></div></td></tr>
</table>
<input type="button" value="PREV" onclick="playPreviousTrack();"><audio id="mainplayer" controls="controls" preload="none"> <source id="audio_src" src=""></source></audio><input type="button" value="NEXT" onclick="playNextTrack()">
<iframe src="static/250ms_silence.mp3" allow="autoplay" id="audio" style="display:none"></iframe>
</div>
<script>
( run in 0.707 second using v1.01-cache-2.11-cpan-f56aa216473 )