function createMediaBrowser()
{
var mainDiv = document.createElement('div');
divToContainer(mainDiv);
mainDiv.initalized = false;
mainDiv.onvisible = function()
{
if (!this.initalized)
{
initMediaFileBrowser(this);
this.initalized = true;
}
}
mainDiv.buttonTitle = "MEDIA";
return mainDiv;
}
function initMediaBrowser(div, exitFn)
{
while(div.childNodes.length != 0)
{
div.removeChild(div.childNodes[0]);
}
var title = document.createElement('div');
title.className = 'media_browser_title';
title.appendChild(document.createTextNode('Media Browser'));
div.appendChild(title);
var mediaDiv = document.createElement('div');
div.appendChild(mediaDiv);
div.style['overflow'] = 'auto';
var browser = new mediaBrowser(mediaDiv, exitFn);
app.addComponent('mediaBrowser', browser);
}
function mediaBrowser(loc, exitFn)
{
this.exitFn = exitFn;
this.loc = loc;
this.userStatusLoc = document.createElement('div');
this.userStatusLoc.className = "media_browser_desc media_browser_listing";
this.loc.appendChild(this.userStatusLoc);
this.dirTreeLoc = document.createElement('div');
this.loc.appendChild(this.dirTreeLoc);
this.userStatusLoc.appendChild(document.createTextNode('Below, click on the bold names to expand tree. ['));
var link = document.createElement('span');
link.className = 'media_browser_link';
link.appendChild(document.createTextNode('View Directories'));
link.parent = this.parent;
this.rootDir = new mediaDirectory(0, this.dirTreeLoc, true);
var parent = this;
link.onclick = function()
{
parent.exitFn.run();
}
this.userStatusLoc.appendChild(link);
this.userStatusLoc.appendChild(document.createTextNode(']'));
/*
this.readUserStatus = function(userObj)
{
while(this.userStatusLoc.childNodes.length != 0)
{
this.userStatusLoc.removeChild(this.userStatusLoc.childNodes[0]);
}
if(app.auth.inGroup('media_browser_admin'))
{
this.userStatusLoc.appendChild(document.createTextNode('You are a media browser admin. ['));
var link = document.createElement('span');
link.className = 'media_browser_link';
link.appendChild(document.createTextNode('Edit Directories'));
link.parent = this;
link.onclick = function()
{
while(this.parent.userStatusLoc.childNodes.length != 0)
{
this.parent.userStatusLoc.removeChild(this.parent.userStatusLoc.childNodes[0]);
}
this.parent.userStatusLoc.appendChild(document.createTextNode('Below, click on the bold names to expand tree. ['));
var link = document.createElement('span');
link.className = 'media_browser_link';
link.appendChild(document.createTextNode('View Directories'));
link.parent = this.parent;
this.parent.rootDir = new mediaDirectory(0, this.parent.dirTreeLoc, true);
link.onclick = function()
{
this.parent.readUserStatus(app.cach.get('userInfo'));
this.parent.rootDir = new mediaDirectory(0, this.parent.dirTreeLoc, false);
}
this.parent.userStatusLoc.appendChild(link);
this.parent.userStatusLoc.appendChild(document.createTextNode(']'));
}
this.userStatusLoc.appendChild(link);
this.userStatusLoc.appendChild(document.createTextNode('] ['));
var link = document.createElement('a');
link.className = 'media_browser_link';
link.appendChild(document.createTextNode('Edit Media'));
link.href = 'editmedia.php';
link.target = '_blank';
this.userStatusLoc.appendChild(link);
this.userStatusLoc.appendChild(document.createTextNode(']'));
this.editable = true;
}else
{
if (this.editable == true)
{
this.rootDir = new mediaDirectory(0, this.dirTreeLoc, false);
}
this.userStatusLoc.appendChild(document.createTextNode('Below, click on the bold names to expand tree.'));
this.editable = false;
}
}
app.cach.bind('userInfo', new objfn('readUserStatus', this));
*/
}
function mediaDirectory(folderID, loc, editable)
{
this.folderID = folderID;
this.loc = loc;
this.editable = editable;
loc.className = 'media_browser_listing';
while(loc.childNodes.length != 0)
{
loc.removeChild(loc.childNodes[0]);
}
var loading = document.createElement('div');
loading.appendChild(document.createTextNode('Loading...'));
loading.className = 'media_browser_text';
loc.appendChild(loading);
this.loadListing = function()
{
var rsp = new phpRequest(new objfn('readListing', this), 'getListing', 'media_browser_responder', 'app/jsresponder.php');
rsp.run(this.folderID);
}
this.loadListing();
this.readListing = function(listing)
{
while(this.loc.childNodes.length != 0)
{
this.loc.removeChild(this.loc.childNodes[0]);
}
if (listing.length == 0 && !this.editable)
{
var loading = document.createElement('div');
loading.appendChild(document.createTextNode('Empty'));
loading.className = 'media_browser_text';
this.loc.appendChild(loading);
}
var folderDiv;
var nameDiv;
var descDiv;
var childDiv;
var editDiv;
for(var i = 0; i < listing.length; i++)
{
if (listing[i]['type'] == 'folder')
{
folderDiv = document.createElement('div');
folderDiv.className = 'media_browser_element';
nameDiv = document.createElement('span');
nameDiv.className = 'media_browser_link';
nameDiv.appendChild(document.createTextNode(listing[i]['name']));
descDiv = document.createElement('div');
descDiv.className = 'media_browser_desc';
descDiv.appendChild(document.createTextNode(listing[i]['description']));
folderDiv.appendChild(nameDiv);
if (this.editable)
{
editDiv = document.createElement('span');
editDiv.className = 'media_browser_link';
editDiv.appendChild(document.createTextNode('edit'));
editDiv.parent = this;
editDiv.folderDiv = folderDiv;
editDiv.folderInfo = listing[i];
editDiv.onclick = function()
{
clearChildNodes(this.folderDiv);
this.nameInput = document.createElement('input');
this.nameInput.type = 'text';
this.nameInput.value = this.folderInfo['name'];
this.nameInput.className = 'media_browser_input_box';
this.descInput = document.createElement('input');
this.descInput.type = 'text';
this.descInput.value = this.folderInfo['description'];
this.descInput.className = 'media_browser_input_box';
this.cancelInput = document.createElement('input');
this.cancelInput.type = 'button';
this.cancelInput.value = 'Cancel';
this.cancelInput.className = 'media_browser_input_button';
this.cancelInput.parent = this;
this.cancelInput.onclick = function()
{
this.parent.parent.loadListing();
}
this.deleteInput = document.createElement('input');
this.deleteInput.type = 'button';
this.deleteInput.value = 'Delete';
this.deleteInput.className = 'media_browser_input_button';
this.deleteInput.parent = this;
this.deleteInput.onclick = function()
{
var rsp = new phpRequest(new objfn('loadListing', this.parent.parent), 'deleteFolder', 'media_browser_responder', 'app/jsresponder.php');
rsp.run(this.parent.folderInfo['id']);
this.value = 'Deleting...';
this.disabled = true;
}
this.saveInput = document.createElement('input');
this.saveInput.type = 'button';
this.saveInput.value = 'Save';
this.saveInput.className = 'media_browser_input_button';
this.saveInput.parent = this;
this.saveInput.onclick = function()
{
var rsp = new phpRequest(new objfn('loadListing', this.parent.parent), 'setFolderInfo', 'media_browser_responder', 'app/jsresponder.php');
rsp.run(this.parent.folderInfo['id'], {'name':this.parent.nameInput.value, 'description':this.parent.descInput.value});
this.value = 'Saving...';
this.disabled = true;
}
this.folderDiv.appendChild(this.nameInput);
this.folderDiv.appendChild(this.cancelInput);
this.folderDiv.appendChild(this.deleteInput);
this.folderDiv.appendChild(document.createElement('br'));
this.folderDiv.appendChild(this.descInput);
this.folderDiv.appendChild(this.saveInput);
}
folderDiv.appendChild(document.createTextNode(' ['));
folderDiv.appendChild(editDiv);
folderDiv.appendChild(document.createTextNode(']'));
}
folderDiv.appendChild(descDiv);
this.loc.appendChild(folderDiv);
childDiv = document.createElement('div');
nameDiv.childDiv = childDiv;
nameDiv.childID = listing[i]['id'];
nameDiv.parent = this;
folderDiv.appendChild(childDiv);
nameDiv.onclick = this.showDir;
}else if(listing[i]['type'] == 'file' && !this.editable)
{
var mediaDiv = document.createElement('div');
mediaDiv.className = 'media_browser_desc';
// mediaDiv.appendChild(document.createTextNode('['));
// var playDiv = document.createElement('span');
// playDiv.appendChild(document.createTextNode('Play'));
// playDiv.className = 'media_browser_link';
// mediaDiv.appendChild(playDiv);
// mediaDiv.appendChild(document.createTextNode('] '));
nameDiv = document.createElement('span');
nameDiv.appendChild(document.createTextNode(listing[i]['name']));
nameDiv.className = 'media_browser_link';
nameDiv.mediaID = listing[i]['id'];
nameDiv.onclick = function()
{
app.getFunction('mediaManager', 'loadMedia').run(this.mediaID);
}
mediaDiv.appendChild(nameDiv);
if (listing[i]['description'] != '')
{
descDiv = document.createElement('span');
descDiv.appendChild(document.createTextNode(' - ' + listing[i]['description']));
mediaDiv.appendChild(descDiv);
}
this.loc.appendChild(mediaDiv);
}
}
if (this.editable)
{
var div = document.createElement('div');
div.className = 'media_browser_element';
var addNew = document.createElement('span');
addNew.appendChild(document.createTextNode('Add New'));
addNew.className = 'media_browser_link';
addNew.parent = div;
div.parent = this;
addNew.onclick = function()
{
clearChildNodes(this.parent);
this.nameInput = document.createElement('input');
this.nameInput.type = 'text';
this.nameInput.value ='';
this.nameInput.className = 'media_browser_input_box';
this.descInput = document.createElement('input');
this.descInput.type = 'text';
this.descInput.value = '';
this.descInput.className = 'media_browser_input_box';
this.saveInput = document.createElement('input');
this.saveInput.type = 'button';
this.saveInput.value = 'Save';
this.saveInput.className = 'media_browser_input_button';
this.saveInput.parent = this;
this.saveInput.onclick = function()
{
var rsp = new phpRequest(new objfn('loadListing', this.parent.parent.parent), 'addNew', 'media_browser_responder', 'app/jsresponder.php');
rsp.run(this.parent.parent.parent.folderID, {'name':this.parent.nameInput.value, 'description':this.parent.descInput.value});
this.value = 'Saving...';
this.disabled = true;
}
this.parent.appendChild(this.nameInput);
this.parent.appendChild(document.createElement('br'));
this.parent.appendChild(this.descInput);
this.parent.appendChild(this.saveInput);
}
div.appendChild(addNew);
this.loc.appendChild(div);
}
}
this.showDir = function()
{
var t = document.createElement('div');
this.childDiv.appendChild(t);
this.subDir = new mediaDirectory(this.childID, t, this.parent.editable);
this.onclick = this.parent.hideDir;
}
this.hideDir = function()
{
while(this.childDiv.childNodes.length != 0)
{
this.childDiv.removeChild(this.childDiv.childNodes[0]);
}
this.onclick = this.parent.showDir;
}
}
function createPlayerPlaylistManager()
{
var sidePadding = 20;
var mainDiv = divToContainer(document.createElement('div'));
var plDS = app.getFunction('mediaManager', 'getPlaylistDS').run();
var playlistRowRenderer = function(input, inputRow, inputColPos, inputRowPos)
{
var rootDiv = document.createElement('div');
rootDiv.onmouseover = function()
{
app.getFunction('mediaManager', 'mouseOverObj').run(inputRow['plid']);
}
rootDiv.style['height'] = "100%";
rootDiv.style['width'] = "100%";
var nameDiv = document.createElement('div');
var descDiv = document.createElement('div');
nameDiv.appendChild(document.createTextNode((inputRow['pos']+1)+". "+inputRow['name']));
nameDiv.className = "player_playlist_media_name";
nameDiv.onclick = function()
{
app.getFunction('mediaManager', 'playFromPLID').run(inputRow['plid']);
}
descDiv.appendChild(document.createTextNode(inputRow['description']));
descDiv.className = "player_playlist_media_desc";
rootDiv.appendChild(nameDiv);
rootDiv.appendChild(descDiv);
return rootDiv;
}
var playlistStateRenderer = function(input, inputRow, inputColPos, inputRowPos)
{
var rootDiv = document.createElement('div');
if (input == 1)
{
rootDiv.className = "player_playlist_media_status";
rootDiv.style['text-align'] = "center";
rootDiv.appendChild(document.createTextNode("Playing"));
return rootDiv;
}else
{
var delButton = document.createElement('div');
delButton.appendChild(document.createTextNode("Remove"));
divToButton(delButton, "player_media_button_up", "player_media_button_down", "player_media_button_hl", "50", "15");
var fn = function()
{
app.getFunction('mediaManager', 'deleteFromPlaylist').run(inputRow['plid']);
}
delButton.broadcasterOnMouseup.addHook(new objfn(fn));
rootDiv.appendChild(delButton);
return rootDiv;
}
}
var playlistDragerRenderer = function(input, inputRow, inputColPos, inputRowPos)
{
var rootDiv = document.createElement('div');
rootDiv.onmouseover = function()
{
app.getFunction('mediaManager', 'mouseOverObj').run(inputRow['plid']);
}
rootDiv.style['height'] = "100%";
rootDiv.style['width'] = "100%";
var dragButton = document.createElement('div');
dragButton.className = "player_playlist_drag_button";
dragButton.onmousedown = function()
{
app.getFunction('mediaManager', 'startDragging').run(inputRow['plid']);
}
rootDiv.appendChild(dragButton);
return rootDiv;
}
var columns = {
0:{
'label':'',
'attr':'pos',
'width':20,
'widthType':'.',
'renderer':playlistDragerRenderer,
'labelClick':null
},
1:{
'label':'',
'attr':'name',
'width':20,
'widthType':'%',
'renderer':playlistRowRenderer,
'labelClick':null
},
2:{
'label':'',
'attr':'state',
'width':65,
'widthType':'.',
'renderer':playlistStateRenderer,
'labelClick':null
}
};
var plOptions = divToContainer(document.createElement('div'));
var plEnableOpt = document.createElement('select');
plEnableOpt.className = "player_playlist_media_dropdown";
var select;
select = document.createElement('option');
select.value = 0;
select.appendChild(document.createTextNode("Off"));
plEnableOpt.appendChild(select);
select = document.createElement('option');
select.value = 1;
select.appendChild(document.createTextNode("On"));
plEnableOpt.appendChild(select);
plOptions.className = "player_playlist_options_text";
plOptions.appendChild(document.createTextNode('Playlist: '));
plOptions.appendChild(plEnableOpt);
plEnableOpt.onchange = function()
{
app.getFunction('mediaManager', 'setPlaylistState').run((this.value==1?true:false));
}
plEnableOpt.onmousemove = function()
{
var text;
if (this.value == 0)
{
text = "When you try to play a media (eg. shabads/katha), it will automatically start to play.";
}else
{
text = "When you try to play a media (eg. shabads/katha), it will automatically get queued to play.";
}
app.tip.request(this, text);
}
plEnableOpt.onmouseout = function()
{
app.tip.clear();
}
var plEndOfPlayOpt = document.createElement('select');
plEndOfPlayOpt.className = "player_playlist_media_dropdown";
var select;
select = document.createElement('option');
select.value = 0;
select.appendChild(document.createTextNode("Loop"));
plEndOfPlayOpt.appendChild(select);
select = document.createElement('option');
select.value = 1;
select.appendChild(document.createTextNode("Stop"));
plEndOfPlayOpt.appendChild(select);
plEndOfPlayOpt.onchange = function()
{
app.getFunction('mediaManager', 'setPlaylistEndLoopState').run((this.value==1?true:false));
}
plOptions.appendChild(document.createTextNode(' At end of playlist:'));
plOptions.appendChild(plEndOfPlayOpt);
listView(mainDiv, plDS, columns, 400, 400, 0, 30, "");
app.getFunction('mediaManager', 'bindPlaylistBroadcaster').run(new objfn('refreshData', mainDiv));
var spliter = divToHorizontalSplitContainer(document.createElement('div'));
spliter.addContainer(plOptions, 20);
spliter.addContainer(mainDiv);
var layout = divToVerticalSplitContainer(document.createElement('div'));
layout.addContainer(divToContainer(document.createElement('div')), sidePadding);
layout.addContainer(spliter);
layout.addContainer(divToContainer(document.createElement('div')), sidePadding);
return layout;
}
function audioPlayer(playerLocation)
{
while(playerLocation.childNodes.length != 0)
{
playerLocation.removeChild(playerLocation.childNodes[0]);
}
this.player = null;
if (isExplorer())
{
playerLocation.innerHTML = '';
this.player = playerLocation.childNodes[0];
this.setUrl = function(url)
{
this.player.URL = url;
}
this.play = function()
{
this.player.controls.play();
if (this.state() != 3 && window.app != null)
{
if (this.playTimerID != null)
{
return;
}
this.playTimerID = app.timer.addTimer(new objfn('forcePlay', this), 100);
}
}
this.stop = function()
{
this.player.controls.stop();
}
this.pause = function()
{
this.player.controls.pause();
}
this.state = function()
{
var conversion = new Array(0,0,4,3,5,5,2,2,0,1,0,1)
return conversion[this.player.playState];
}
this.textState = function()
{
var states = new Array('Stopped', 'Contacting', 'Buffering', 'Playing', 'Paused', 'Seeking');
return states[this.state()];
}
this.getPosition = function()
{
return this.player.controls.currentPosition*1000;
}
this.getClipLength = function()
{
try
{
return this.player.currentMedia.duration*1000;
}catch(e)
{
return 0;
}
}
this.setPosition = function(pos)
{
return this.player.controls.currentPosition = pos/1000;
}
}else if (isMozilla())
{
playerLocation.innerHTML = '';
this.player = playerLocation.childNodes[0];
this.setUrl = function(url)
{
playerLocation.innerHTML = '';
this.player = playerLocation.childNodes[0];
/*
this.requestedURL = url;
this.player.SetSource(url);
this.stop();
this.player.SetSource(url);
var parent = this;
var fn = function()
{
parent.player.SetSource(url);
var fn2 = function()
{
parent.player.SetSource(url);
parent.play();
}
// setTimeout(fn2, 100);
}
setTimeout(fn, 100);
*/
// this.checkUrlChanged();
}
this.checkUrlChanged = function()
{
if (this.player.GetSource() == this.oldRealURL)
{
this.player.SetSource(this.requestedURL);
var parent = this;
var fn = function()
{
parent.checkUrlChanged();
}
setTimeout(fn, 200);
}else
{
this.oldRealURL = this.player.GetSource();
this.play();
}
}
this.play = function()
{
this.player.DoPlay();
// if (this.player.GetPlayState() != 3 && window.app != null)
// {
// this.playTimerID = app.timer.addTimer(new objfn('forcePlay', this), 100);
// }
}
this.stop = function()
{
this.player.DoStop();
}
this.pause = function()
{
this.player.DoPause();
}
this.state = function()
{
var result = null;
try
{
result = this.player.GetPlayState();
}catch(e)
{
result = 0;
}
return result;
}
this.textState = function()
{
var states = new Array('Stopped', 'Contacting', 'Buffering', 'Playing', 'Paused', 'Seeking');
return states[this.player.GetPlayState()];
}
this.getPosition = function()
{
var result = null;
try
{
result = this.player.GetPosition();
}catch(e)
{
result = 0;
}
return result;
}
this.getClipLength = function()
{
var result = null;
try
{
result = this.player.GetLength();
}catch(e)
{
result = 0;
}
return result;
}
this.setPosition = function(pos)
{
return this.player.SetPosition(pos);
}
}
this.monitorEvents = function()
{
if (this.oldClipLength != this.getClipLength())
{
this.oldClipLength = this.getClipLength();
if (this.clipLenMon != null)
{
this.clipLenMon.run(this.oldClipLength);
}
}
if (this.oldState != this.state())
{
this.oldState = this.state();
if (this.stateMon != null)
{
this.stateMon.run(this.oldState, this.textState());
}
}
}
this.forcePlay = function()
{
if (this.state() != 3)
{
this.play();
return;
}
if (this.playTimerID == null)
{
return;
}
app.timer.removeTimer(this.playTimerID);
this.playTimerID = null;
}
this.oldClipLength = 0;
this.oldState = -1;
if (window.app != null)
{
this.monEventTimerID = app.timer.addTimer(new objfn('monitorEvents', this), 100);
}
}
function createMainPage()
{
var main = divToHorizontalSplitContainer(document.createElement('div'));
main.buttonTitle = 'MAIN';
// main.style['background'] = "#FF0000";
var intro = divToContainer(document.createElement('div'));
var title = document.createElement('div');
title.className = 'main_page_title_text';
title.appendChild(document.createTextNode('Welcome to SikhShabads.com!'));
intro.appendChild(title);
var about = document.createElement('div');
about.className = 'main_page_paragraph';
about.appendChild(document.createTextNode('Welcome to SikhShabads.com. This site is designed to help you understand the meanings behind the shabads and prayers that we read and listen to everyday. We are creating "captions": for each one of the shabads and prayers. Captions are lines of text that change according to the audio that is currently being played. In these captions, we try to place Gurmukhi, English pronunciation, and translations. Thus, as the audio is being played, we can, at a quick glance, understand its meaning. If you would like to contribute or if you have questions, please visit the "How To" section located in the top menu. For comments you can e-mail us at SikhShabads@gmail.com.'));
intro.appendChild(about);
intro.style['overflow'] = 'auto';
main.addContainer(intro, 200);
var updatedMediaInfo = divToContainer(document.createElement('div'));
var rowRenderer = function(input, inputRow, inputColPos, inputRowPos)
{
var tmp = document.createElement('div');
tmp.className = (inputRowPos%2==0?'sslistview_cell_even':'sslistview_cell_odd');
tmp.appendChild(document.createTextNode(input.toString()));
return tmp;
}
var toolTipRowRenderer = function(input, inputRow, inputColPos, inputRowPos)
{
var tmp = document.createElement('div');
tmp.className = (inputRowPos%2==0?'sslistview_cell_even':'sslistview_cell_odd');
tmp.appendChild(document.createTextNode(input.toString()));
tmp.onmouseover = function()
{
app.tip.request(tmp.parentNode);
}
tmp.onmouseout = function()
{
app.tip.clear();
}
return tmp;
}
var sortByTimestamp = function(column, listView)
{
var attr = 'timestamp';
var prevSort = listView.dataSet.getSort(attr);
var prevSortPos = listView.dataSet.getSortPos(attr);
if (prevSortPos != 0)
{
prevSort = null;
}
if (prevSort == 'asc')
{
listView.dataSet.setSort(attr, false);
}else
{
listView.dataSet.setSort(attr, true);
}
listView.refreshData();
}
var playShabadRenderer = function(input, inputRow, inputColPos, inputRowPos)
{
var tmp = document.createElement('div');
tmp.className = (inputRowPos%2==0?'sslistview_cell_even':'sslistview_cell_odd');
var spn = document.createElement('div');
spn.className = 'sslistview_link';
spn.appendChild(document.createTextNode(input.toString()));
spn.onclick = function()
{
app.getFunction('mediaManager', 'loadMedia').run(inputRow['shabadid']);
}
tmp.onmouseover = function()
{
app.tip.request(tmp.parentNode);
}
tmp.onmouseout = function()
{
app.tip.clear();
}
tmp.appendChild(spn);
return tmp;
}
var columns = {
0:{
'label':'',
'attr':'position',
'width':20,
'widthType':'.',
'renderer':rowRenderer
},
1:{
'label':'Name',
'attr':'name',
'width':70,
'widthType':'%',
'renderer':playShabadRenderer
},
2:{
'label':'By',
'attr':'user',
'width':100,
'widthType':'.',
'renderer':rowRenderer
},
3:{
'label':'Added',
'attr':'date',
'width':70,
'widthType':'.',
'renderer':rowRenderer,
'labelClick':sortByTimestamp
}
};
var newCaptions = divToContainer(document.createElement('div'));
var numericSorter = function(a, b)
{
a = parseFloat(a);
b = parseFloat(b);
if (a == b)
{
return 0;
}
if (a < b)
{
return -1;
}
return 1;
}
var numericSorterRev = function(a, b)
{
a = parseFloat(a);
b = parseFloat(b);
if (a == b)
{
return 0;
}
if (a > b)
{
return -1;
}
return 1;
}
listView(
newCaptions,
new ssdataset('dataset_newcaptions', 'app/jsresponder.php', false, {'position':numericSorter, 'timestamp':numericSorterRev}),
columns,
75,
300,
13,
15,
'sslistview_label',
0,
10
);
columns = {
0:{
'label':'',
'attr':'position',
'width':20,
'widthType':'.',
'renderer':rowRenderer
},
1:{
'label':'Name',
'attr':'name',
'width':50,
'widthType':'%',
'renderer':playShabadRenderer
},
2:{
'label':'Location',
'attr':'directory',
'width':50,
'widthType':'%',
'renderer':toolTipRowRenderer
},
3:{
'label':'Added',
'attr':'date',
'width':70,
'widthType':'.',
'renderer':rowRenderer,
'labelClick':sortByTimestamp
}
};
var newMedia = divToContainer(document.createElement('div'));
listView(
newMedia,
new ssdataset('dataset_newmedia', 'app/jsresponder.php', false, {'position':numericSorter, 'timestamp':numericSorterRev}),
columns,
75,
300,
13,
15,
'sslistview_label',
0,
10
);
var name = document.createElement('div');
name.appendChild(document.createTextNode('Newly Added Captions'));
name.className = "sslistview_title";
name.style['position'] = 'relative';
name.style['left'] = '10px';
newCaptions.style['position'] = 'relative';
newCaptions.style['left'] = '10px';
updatedMediaInfo.appendChild(name);
updatedMediaInfo.appendChild(newCaptions);
name = document.createElement('div');
name.appendChild(document.createTextNode('Newly Added Media'));
name.className = "sslistview_title";
name.style['position'] = 'relative';
name.style['left'] = '10px';
newMedia.style['position'] = 'relative';
newMedia.style['left'] = '10px';
updatedMediaInfo.appendChild(name);
updatedMediaInfo.appendChild(newMedia);
updatedMediaInfo.lists = new Array();
updatedMediaInfo.lists[0] = newCaptions;
updatedMediaInfo.lists[1] = newMedia;
updatedMediaInfo.resizeChildren = function()
{
var height = (this.currY-40)/this.lists.length;
for(var i = 0; i < this.lists.length; i++)
{
this.lists[i].setSize(this.currX-20, height);
}
}
main.addContainer(updatedMediaInfo);
return main;
}
function createPlayer()
{
var mainDiv = document.createElement('div');
divToContainer(mainDiv);
mainDiv.initalized = false;
mainDiv.onvisible = function()
{
if (!this.initalized)
{
intPlayer(this);
this.initalized = true;
}
}
mainDiv.buttonTitle = "PLAYER";
var manager = new mediaManager(mainDiv);
app.addComponent('mediaManager', manager);
app.addFunction('mediaManager', 'loadMedia', new objfn('loadMedia', manager));
app.addFunction('mediaManager', 'getPlaylistDS', new objfn('getPlaylistDS', manager));
app.addFunction('mediaManager', 'bindPlaylistBroadcaster', new objfn('bindPlaylistBroadcaster', manager));
app.addFunction('mediaManager', 'setPlaylistTabInfo', new objfn('setPlaylistTabInfo', manager));
app.addFunction('mediaManager', 'deleteFromPlaylist', new objfn('deleteFromPlaylist', manager));
app.addFunction('mediaManager', 'playFromPLID', new objfn('playFromPLID', manager));
app.addFunction('mediaManager', 'startDragging', new objfn('startDragging', manager));
app.addFunction('mediaManager', 'mouseOverObj', new objfn('mouseOverObj', manager));
app.addFunction('mediaManager', 'setPlaylistState', new objfn('setPlaylistState', manager));
app.addFunction('mediaManager', 'setPlaylistEndLoopState', new objfn('setPlaylistEndLoopState', manager));
return mainDiv;
}
function mediaManager(mainDiv)
{
this.mainDiv = mainDiv;
this.playlistUpdateBC = new eventBroadcaster();
this.playlistDS = new dataset(new Array("id", "plid", "infoObj", "pos", "state", "name", "description"));
this.playlistDS.setSort("pos", true);
this.uniqueplid = 0;
this.playingPLID = null;
this.plTabManager = null;
this.plLayerId = null;
this.playingPos = null;
this.draggingObj = false;
this.draggingObjID = null;
this.plEnabled = false;
this.timerID = null;
this.plEndLoop = false;
this.setPlaylistState = function(state)
{
this.plEnabled = state;
}
this.setPlaylistEndLoopState = function(state)
{
this.plEndLoop = state;
}
this.startDragging = function(plid)
{
this.draggingObj = true;
this.draggingObjID = plid;
this.docMouseUpID = app.docEvents.addEvent("mouseup", new objfn('stopDragging', this));
document.onselectstart = function() {return false;}
}
this.stopDragging = function()
{
if (!this.draggingObj)
{
return;
}
this.draggingObj = false;
app.docEvents.removeEvent("mouseup", this.docMouseUpID);
document.onselectstart = function() {return true;}
}
this.mouseOverObj = function(plid)
{
if (!this.draggingObj || this.draggingObjID == plid)
{
return;
}
var targetPos = this.playlistDS.selectArray(new Array("pos"), {"plid":plid})[0]['pos'];
this.repositionObj(this.draggingObjID, targetPos);
}
this.repositionObj = function(plid, pos)
{
var currPos = this.playlistDS.selectArray(new Array("pos"), {"plid":plid})[0]['pos'];
if (currPos < pos)
{
while(currPos < pos)
{
this.playlistDS.update({"pos":currPos+1}, {"pos":currPos});
currPos++;
}
this.playlistDS.update({"plid":plid}, {"pos":pos});
}else
{
while(currPos > pos)
{
this.playlistDS.update({"pos":currPos-1}, {"pos":currPos});
currPos--;
}
this.playlistDS.update({"plid":plid}, {"pos":pos});
}
this.playlistDS.resortData();
this.playlistUpdateBC.broadcast();
this.playingPos = this.playlistDS.selectArray(new Array("pos"), {"plid":this.playingPLID})[0]['pos'];
}
this.monitorPlayState = function()
{
/* if (!this.plEnabled)
{
return;
}
if (app.getFunction('player', 'getPosition') == null)
{
return;
}
var playState = app.getFunction('player', 'state').run();
if (playState != 3)
{
return;
}
var currPos = app.getFunction('player', 'getPosition').run();
var mediaLen = app.getFunction('player', 'getClipLength').run();
if (mediaLen == 0)
{
return;
}
if ((mediaLen - currPos) < 3000)
{
this.audioTrackFinishedPlaying();
}*/
}
this.audioTrackFinishedPlaying = function()
{
if (!this.plEnabled)
{
return;
}
var nextPos = this.playingPos+1;
if (this.playlistDS.length == nextPos)
{
if (this.plEndLoop)
{
app.getFunction('player', 'stop').run();
return;
}
nextPos = 0;
}
app.getFunction('player', 'stop').run();
var parent = this;
var fn = function()
{
parent.playFromPos(nextPos);
}
setTimeout(fn, 100);
}
this.loadMedia = function(id)
{
if (!this.plEnabled)
{
this.playlistDS.clear();
}
app.getFunction('mainTabHandler', 'selectTab').run(this.mainDiv.layerID);
var rsp = new phpRequest(new objfn('readMediaInfo' ,this), 'getMediaInfo', 'media_responder', 'app/jsresponder.php');
rsp.run(id);
}
this.setPlaylistTabInfo = function(tabManager, layerID)
{
this.plTabManager = tabManager;
this.plLayerId = layerID;
}
this.getPlaylistDS = function()
{
return this.playlistDS;
}
this.bindPlaylistBroadcaster = function(fn)
{
this.playlistUpdateBC.addHook(fn);
}
this.deleteFromPlaylist = function(plid)
{
var mediaPos = this.playlistDS.selectArray(new Array("pos"), {"plid":plid})[0]['pos'];
for(var i = mediaPos; i < this.playlistDS.length; i++)
{
this.playlistDS.update({"pos":i}, {"pos":(i-1)});
}
this.playlistDS.deleteRows({"plid":plid});
var parent = this;
var fn = function()
{
parent.playlistUpdateBC.broadcast();
}
setTimeout(fn, 1);
}
this.readMediaInfo = function(info)
{
var row = {
"id":info['id'],
"plid":this.uniqueplid++,
"infoObj":info,
"pos":this.playlistDS.length,
"state":0,
"name":info['name'],
"description":info['description']
};
this.playlistDS.insert(row);
this.playlistUpdateBC.broadcast();
if (this.playlistDS.length == 1)
{
this.playFromPos(0);
}else
{
this.showPlaylist();
}
}
this.showPlaylist = function()
{
app.getFunction('mainTabHandler', 'selectTab').run(this.mainDiv.layerID);
this.plTabManager.selectTab(this.plLayerId);
}
this.playFromPos = function(pos)
{
var currMedia = this.playlistDS.selectArray(new Array("plid"), {"pos":pos});
this.playFromPLID(currMedia[0]['plid']);
}
this.playFromPLID = function(plid)
{
if (this.playingPLID != null)
{
this.playlistDS.update({"plid":this.playingPLID}, {"state":0});
}
this.playingPLID = plid;
var currMedia = this.playlistDS.selectArray(new Array("infoObj", "pos"), {"plid":plid});
this.playFromInfo(currMedia[0]['infoObj']);
this.playingPos = currMedia[0]['pos'];
this.playlistDS.update({"plid":plid}, {"state":1});
this.playlistUpdateBC.broadcast();
if (this.timerID == null)
{
// this.timerID = app.timer.addTimer(new objfn('monitorPlayState', this), 100);
}
}
this.playFromInfo = function(info)
{
// app.getFunction('player', 'stop').run();
app.cach.setVariable('currentMedia', info);
//This function should also play the media.
app.getFunction('player', 'setUrl').run(info['file']);
// app.getFunction('player', 'play').run();
}
}
function intPlayer(div)
{
divToHorizontalSplitContainer(div);
var ctrls = createPlayerControls();
var playerSections = new Array();
var playerTabs = divToContainer(document.createElement('div'));
var playerLayers = createLayeredContainer();
var tabs = new tabHandler(playerLayers);
var playerTabLeftPadding = document.createElement('div');
playerTabLeftPadding.className = "player_tab_left_padding";
playerTabs.appendChild(playerTabLeftPadding);
playerTabs.className = "player_tab";
playerSections[playerSections.length] = {'layer':createPlayerCaptionDisplay(), 'name':'Captions'};
playerSections[playerSections.length] = {'layer':createPlayerPlaylistManager(), 'name':'Playlist'};
for(var i = 0; i < playerSections.length; i++)
{
var button = divToButton(document.createElement('div'), "player_tab_button_up", "player_tab_button_down", "player_tab_button_hl", 60, 15);
button.appendChild(document.createTextNode(playerSections[i]['name']));
playerTabs.appendChild(button);
playerSections[i]['layer'].layerID = playerLayers.addContainer(playerSections[i]['layer']);
tabs.addTab(button, playerSections[i]['layer'].layerID);
if (playerSections[i]['name'] == "Playlist")
{
app.getFunction('mediaManager', 'setPlaylistTabInfo').run(tabs, playerSections[i]['layer'].layerID);
}
}
tabs.selectTab(0);
div.addContainer(divToContainer(document.createElement('div')), 10);
div.addContainer(playerTabs, 17);
div.addContainer(playerLayers);
div.addContainer(ctrls, 70);
return div;
}
function createPlayerControls()
{
//Init Main DIV
var div = document.createElement('div');
// div.style['background'] = '#DDEEFF';
div = divToContainer(div);
div.style['position'] = 'relative';
//Create the slider handle
var slideHandle = document.createElement('div');
slideHandle.style['height'] = '20px';
slideHandle.style['width'] = '20px';
// slideHandle.style['background'] = '#FFFF00';
slideHandle.className = 'player_media_slider_button';
//Create the position Slider.
var positionSlider = createHorizontalSlider(100, 0, 20, 400, slideHandle, 20, null);
positionSlider.style['top'] = '10px';
positionSlider.style['left'] = '20px';
positionSlider.style['position'] = 'absolute';
positionSlider.className = 'player_media_slider_bar';
//Set Position slider functions.
positionSlider.posToTextFn = new objfn('intToTime', div);
positionSlider.posMonFn = new objfn('readPosSlideChange', div);
//Remember stuff
div.positionSlider = positionSlider;
//Add the slider to this div.
div.appendChild(positionSlider);
// app.addComponent("player", div);
div.readPosSlideChange = function(pos)
{
div.player.setPosition(pos);
}
//Function for converting time.
div.intToTime = function(number)
{
number = number / 1000;
var minutes = Math.floor(number/60);
var seconds = number - (minutes * 60);
seconds = Math.round(seconds*100)/100;
if (seconds < 10)
{
seconds = '0' + seconds.toString();
}else
{
seconds = seconds.toString();
}
return minutes.toString() + ':' + seconds;
}
//Tell the slider its new size.
div.resizeChildren = function()
{
this.positionSlider.setWidth(this.currX-40);
}
var buttonCnt = document.createElement('div');
buttonCnt.style['position'] = 'absolute';
buttonCnt.style['top'] = '35px';
buttonCnt.style['left'] = '20px';
buttonCnt.style['width'] = '500px';
buttonCnt.style['height'] = '20px';
var playButton = document.createElement('div');
playButton.appendChild(document.createTextNode('Play'));
divToButton(playButton, 'player_media_button_up', 'player_media_button_down', 'player_media_button_hl', 50, 15);
playButton.broadcasterOnMouseup.addHook(new objfn(function(){app.getFunction('player', 'play').run();}));
buttonCnt.appendChild(playButton);
div.playButton = playButton;
var pauseButton = document.createElement('div');
pauseButton.appendChild(document.createTextNode('Pause'));
divToButton(pauseButton, 'player_media_button_up', 'player_media_button_down', 'player_media_button_hl', 50, 15);
var pauseFn = function()
{
if (app.getFunction('player', 'state').run() != 4)
{
app.getFunction('player', 'pause').run();
}else
{
app.getFunction('player', 'play').run();
}
}
pauseButton.broadcasterOnMouseup.addHook(new objfn(pauseFn));
buttonCnt.appendChild(pauseButton);
div.pauseButton = pauseButton;
var stopButton = document.createElement('div');
stopButton.appendChild(document.createTextNode('Stop'));
divToButton(stopButton, 'player_media_button_up', 'player_media_button_down', 'player_media_button_hl', 50, 15);
stopButton.broadcasterOnMouseup.addHook(new objfn(function(){app.getFunction('player', 'stop').run();}));
buttonCnt.appendChild(stopButton);
div.stopButton = stopButton;
/*
button = document.createElement('span');
button.className = 'player_media_button';
button.appendChild(document.createTextNode('Play'));
button.onclick = function()
{
app.getFunction('player', 'play').run();
}
buttonCnt.appendChild(button);
button = document.createElement('span');
button.className = 'player_media_button';
button.appendChild(document.createTextNode('Pause'));
button.onclick = function()
{
app.getFunction('player', 'pause').run();
}
buttonCnt.appendChild(button);
button = document.createElement('span');
button.className = 'player_media_button';
button.appendChild(document.createTextNode('Stop'));
button.onclick = function()
{
app.getFunction('player', 'stop').run();
}
buttonCnt.appendChild(button);
*/
var status = null;
status = document.createElement('span');
status.className = 'player_media_info_text';
var statText = document.createTextNode('0:00/0:00');
div.playerPosText = statText;
status.appendChild(statText);
buttonCnt.appendChild(status);
status = document.createElement('span');
status.className = 'player_media_info_text';
var statText = document.createTextNode('Waiting Init.');
div.playerStatText = statText;
status.appendChild(statText);
buttonCnt.appendChild(status);
div.appendChild(buttonCnt);
// div.player = new audioPlayer(document.getElementById('PlayerLoc'));
div.player = new flashaudioplayer(document.getElementById('PlayerLoc'));
div.player.clipLenMon = new objfn('clipLenChange' ,div);
div.player.stateMon = new objfn('clipStateChange' ,div);
div.player.clipEndCB = new objfn('audioTrackFinishedPlaying', app.getComponent('mediaManager'));
div.clipLenChange = function(len)
{
this.positionSlider.sliderMax = len;
}
div.clipStateChange = function(intState, strState)
{
this.playerStatText.nodeValue = strState;
if (intState == 3)
{
this.playButton.setState(1);
this.pauseButton.setState(0);
this.stopButton.setState(0);
}else if(intState == 0)
{
this.playButton.setState(0);
this.pauseButton.setState(0);
this.stopButton.setState(1);
}else if(intState == 4)
{
this.playButton.setState(0);
this.pauseButton.setState(1);
this.stopButton.setState(0);
}else
{
this.playButton.setState(0);
this.pauseButton.setState(0);
this.stopButton.setState(0);
}
}
div.updatePlayerPos = function()
{
var playerPos = this.player.getPosition();
if (this.oldPlayerOptimizePos == playerPos)
{
return;
}
this.oldPlayerOptimizePos = playerPos;
if (!this.positionSlider.draging)
{
this.positionSlider.setPos(playerPos);
}
var timeText = this.intToTime(playerPos);
if (timeText.indexOf('.') != -1)
{
timeText = timeText.substring(0, timeText.indexOf('.'));
}
var maxTime = this.intToTime(this.player.getClipLength());
if (maxTime.indexOf('.') != -1)
{
maxTime = maxTime.substring(0, maxTime.indexOf('.'));
}
var finalText = timeText+'/'+maxTime;
if (this.playerPosText.nodeValue != finalText)
{
this.playerPosText.nodeValue = finalText;
}
}
div.playPosMonTimerID = app.timer.addTimer(new objfn('updatePlayerPos', div), 100);
div.setUrl = function(url)
{
this.player.setUrl(url);
}
// div.player.play();
app.addComponent('player', div.player);
app.addFunction('player', 'play', new objfn('play', div.player));
app.addFunction('player', 'pause', new objfn('pause', div.player));
app.addFunction('player', 'stop', new objfn('stop', div.player));
app.addFunction('player', 'setUrl', new objfn('setUrl', div.player));
app.addFunction('player', 'getPosition', new objfn('getPosition', div.player));
app.addFunction('player', 'setPosition', new objfn('setPosition', div.player));
app.addFunction('player', 'getClipLength', new objfn('getClipLength', div.player));
app.addFunction('player', 'state', new objfn('state', div.player));
// div.setUrl('media/Nanak%20Dukhia%20Sab%20Sansar.mp3');
return div;
}
function createHowTo()
{
var howTo = divToContainer(document.createElement('div'));
howTo.buttonTitle = 'HOW TO';
howTo.style['overflow'] = 'auto';
var title = document.createElement('div');
title.className = 'main_page_title_text';
title.appendChild(document.createTextNode('SikhShabads.com, How To?'));
howTo.appendChild(title);
var howTos = new Array();
howTos[howTos.length] = {'question':'How to use the media browser?', 'answer':'In the top menu, clicking the "MEDIA" button, will load up the media browser. The browser is a simple tree like structure that makes categorizing and finding shabads and other media simple and easy. Clicking on the bold names will either expand or contract that branch of the tree. Under the different branches of the tree, clicking on a media will load that media into the player.'};
howTos[howTos.length] = {'question':'How to use the player?', 'answer':'The player is accessible by the button in the top menu labeled "PLAYER." When a media is loaded into the player, it will also load up all of the information associated with that media, such as captions. On top of the player is a dropdown labeled "Captions." If someone has submitted captions for the media, they will appear their. Towards the bottom of the player there are two sliders. The bottom slider is a normal slider that allows a user to browse the media like sliders in most players. The top slider however, is used to browse the media more accurately. This slider is useful when you are reading captions and you need to listen to a line over again or when you are editing captions. On top of the top slider is where the caption lines can be visually seen relative to their times. The lines are grey squares that move across the top slider. The line in the black square is the currently displayed line.'};
howTos[howTos.length] = {'question':'How to use the user menu?', 'answer':'The user menu is used to track users and their privileges. If you are not contributing captions or other help, you do not need to sign up in order to use SikhShabads.com. In the future we will use these accounts to create a community.'};
howTos[howTos.length] = {'question':'How to contribute?', 'answer':'If you would like to contribute please e-mail us at thecheatah@gmail.com or instant message us using AOL instant messenger screen name: "thecheatah." We currently need help in creating captions for Shabads and Paath. If you find a Shabad or other media for which you would like to create captions for not on this site, contact us and we will gladly place it on SikhShabads.com.'};
howTos[howTos.length] = {'question':'', 'answer':''};
for(var i = 0; i < howTos.length; i++)
{
title = document.createElement('div');
title.className = 'main_page_info_title';
title.appendChild(document.createTextNode(howTos[i]['question']));
howTo.appendChild(title);
title = document.createElement('div');
title.className = 'main_page_paragraph';
title.appendChild(document.createTextNode(howTos[i]['answer']));
howTo.appendChild(title);
}
return howTo;
}
function lineSlideMonitor(slideCnt, precisionSlider, capMan)
{
this.slideCnt = slideCnt;
this.capMan = capMan;
this.precisionSlider = precisionSlider;
this.lines = new Array();
this.searchNewLines = function(currPos)
{
var workingWidth = this.precisionSlider.sliderMax;
var halfTimeSpan = ((workingWidth/2)*app.cach.get('precisionSliderMillisecondsPerPixel'))/1000;
var minTime = (currPos - halfTimeSpan);
var maxTime = (currPos + halfTimeSpan);
var startingIndex = this.capMan.getCurrentCaption(minTime);
if (startingIndex == null)
{
startingIndex = 0;
}else
{
startingIndex++;
}
if (startingIndex < this.capMan.captions.length)
{
var currMaxTime = this.capMan.captions[startingIndex]['time'];
while (currMaxTime < maxTime)
{
this.addLine(startingIndex);
startingIndex++;
if (startingIndex == this.capMan.captions.length)
{
break;
}
currMaxTime = this.capMan.captions[startingIndex]['time'];
}
}
this.updateCurrentLines(minTime, maxTime, workingWidth);
}
this.updateCurrentLines = function(minTime, maxTime, workingWidth)
{
for(var i = 0; i < this.lines.length; i++)
{
if (this.lines[i] != null)
{
this.lines[i].updateSelf(minTime, maxTime, workingWidth);
}
}
}
this.addLine = function(index)
{
var freeLine = null;
for(var i = 0; i < this.lines.length; i++)
{
if (this.lines[i] == null)
{
if (freeLine == null)
{
freeLine = i;
}
}else
{
if (this.lines[i].lineIndex == index)
{
return;
}
}
}
if (freeLine == null)
{
freeLine = i;
}
this.lines[freeLine] = new captionLineSlider(this.slideCnt, this, index, this.capMan.captions[index]);
}
this.removeLine = function(index)
{
for(var i = 0; i < this.lines.length; i++)
{
if (this.lines[i] != null)
{
if (this.lines[i].lineIndex == index)
{
this.lines[i] = null;
}
}
}
}
this.clearLines = function()
{
for(var i = 0; i < this.lines.length; i++)
{
if (this.lines[i] != null)
{
this.lines[i].updateSelf(0, -1, 10);
}
}
}
}
function captionLineSlider(sliderLoc, slideMon, lineIndex, capLine)
{
this.sliderLoc = sliderLoc;
this.slideMon = slideMon;
this.lineIndex = lineIndex;
this.capLine = capLine;
this.pointerDiv = document.createElement('div');
this.pointerDiv.style['position'] = 'absolute';
this.pointerDiv.style['height'] = '20px';
this.pointerDiv.style['width'] = '20px';
this.sliderLoc.appendChild(this.pointerDiv);
this.pointerDiv.parent = this;
this.sliderInfo = document.createElement('div');
this.sliderInfo.style['height'] = '20px';
this.sliderInfo.style['width'] = '100px';
this.sliderInfo.style['top'] = '-24px';
this.sliderInfo.style['left'] = '5px';
this.sliderInfo.style['position'] = 'absolute';
this.sliderInfo.style['display'] = 'none';
var styler = document.createElement('span');
styler.className = 'player_media_popup_text';
this.labelText = document.createTextNode('test');
styler.appendChild(this.labelText);
this.sliderInfo.appendChild(styler);
this.pointerDiv.appendChild(this.sliderInfo);
this.draging = false;
this.pointerDiv.onmousedown = function(evnt)
{
if (isExplorer())
{
evnt = event;
}
if (!this.parent.slideMon.capMan.editMode)
{
app.getFunction('player', 'setPosition').run(this.parent.capLine['time']*1000+10);
return;
}
if (this.parent.slideMon.capMan.previousRenderedCap == this.parent.lineIndex && this.parent.slideMon.capMan.editing)
{
if (this.parent.mousemoveid != null)
{
app.docEvents.removeEvent('mousemove', this.parent.mousemoveid);
}
if (this.parent.mouseupid != null)
{
app.docEvents.removeEvent('mouseup', this.parent.mouseupid);
}
this.parent.mouseupid = app.docEvents.addEvent('mouseup', new objfn('mouseup', this));
this.parent.mousemoveid = app.docEvents.addEvent('mousemove', new objfn('mousemove', this));
this.parent.prevClientX = evnt.clientX;
this.parent.draging = true;
this.parent.sliderInfo.style['display'] = 'block';
this.parent.labelText.nodeValue = this.parent.slideMon.precisionSlider.posToTextFn.run(this.parent.currPixelPos);
return;
}
if (this.parent.slideMon.capMan.didEditorChangeLineCaptions())
{
alert('You are currently editing another line. Please save or cancel it before editing another.');
return;
}
this.parent.slideMon.capMan.setEditingLine(this.parent.lineIndex);
}
this.pointerDiv.mousemove = function(evnt)
{
if (!this.parent.draging) {return;}
if (isExplorer())
{
evnt = event;
}
var xChange = evnt.clientX - this.parent.prevClientX;
this.parent.prevClientX = evnt.clientX;
this.parent.currPixelPos = this.parent.currPixelPos + xChange;
var pixelPos = this.parent.currPixelPos.toString() + 'px';
if (this.style['left'] != pixelPos)
{
this.style['left'] = pixelPos;
}
this.parent.labelText.nodeValue = this.parent.slideMon.precisionSlider.posToTextFn.run(this.parent.currPixelPos);
}
this.pointerDiv.mouseup = function(evnt)
{
if (!this.parent.draging) {return;}
if (isExplorer())
{
evnt = event;
}
this.parent.draging = false;
if (this.parent.mousemoveid != null)
{
app.docEvents.removeEvent('mousemove', this.parent.mousemoveid);
}
if (this.parent.mouseupid != null)
{
app.docEvents.removeEvent('mouseup', this.parent.mouseupid);
}
this.parent.sliderInfo.style['display'] = 'none';
var timeText = this.parent.slideMon.precisionSlider.posToTextFn.run(this.parent.currPixelPos);
this.parent.slideMon.capMan.timeInput.value = timeText;
this.parent.slideMon.capMan.timeInput.onblur();
}
this.updateSelf = function(minTime, maxTime, workingWidth)
{
if (this.capLine['time'] < minTime || this.capLine['time'] > maxTime)
{
this.sliderLoc.removeChild(this.pointerDiv);
this.slideMon.removeLine(this.lineIndex);
return;
}
if (this.draging)
{
return;
}
var offSetTime = this.capLine['time'] - minTime;
maxTime = maxTime - minTime;
this.currPixelPos = Math.round((offSetTime/maxTime)*workingWidth);
var pixelPos = this.currPixelPos.toString() + 'px';
if (this.pointerDiv.style['left'] != pixelPos)
{
this.pointerDiv.style['left'] = pixelPos;
}
var className;
if (this.slideMon.capMan.previousRenderedCap == this.lineIndex)
{
className = 'player_media_slider_line_button_hl';
}else
{
className = 'player_media_slider_line_button';
}
if (this.pointerDiv.className != className)
{
this.pointerDiv.className = className;
}
}
}
function initMediaFileBrowser(mainDiv)
{
clearChildNodes(mainDiv);
createLayeredContainer(null, null, mainDiv);
var editorDiv = document.createElement('div');
divToContainer(editorDiv);
var div = document.createElement('div');
divToVerticalSplitContainer(div);
div.myLayerID = mainDiv.addContainer(div);
div.editorDivID = mainDiv.addContainer(editorDiv);
div.layerManger = mainDiv;
initMediaBrowser(editorDiv, new objfn('viewMode', div));
div.viewMode = function()
{
this.rootFolder = new mediaBrowserFolderChildren(0, new objfn('reloadFolderDS', this));
this.layerManger.selectContainer(this.myLayerID);
}
div.editMode = function()
{
this.layerManger.selectContainer(this.editorDivID);
}
var leftPadding = document.createElement('div');
var rightPadding = document.createElement('div');
var center = document.createElement('div');
divToHorizontalSplitContainer(center);
divToContainer(leftPadding);
divToContainer(rightPadding);
div.addContainer(leftPadding, 20);
div.addContainer(center);
div.addContainer(rightPadding, 20);
var title = document.createElement('div');
divToContainer(title);
title.className = 'media_browser_title';
title.appendChild(document.createTextNode('Media Browser'));
center.addContainer(title, 22);
var folderTitle = document.createElement('div');
divToContainer(folderTitle);
folderTitle.className = 'media_browser_desc';
var folderListTitle = document.createElement('div');
folderListTitle.className = 'media_browser_list_title';
folderListTitle.appendChild(document.createTextNode('Folders: '));
folderTitle.appendChild(folderListTitle);
div.folderListInfo = document.createElement('div');
div.folderListInfo.className = 'media_browser_list_info';
folderTitle.appendChild(div.folderListInfo);
div.readUserStatus = function(userObj)
{
clearChildNodes(this.folderListInfo);
if (app.auth.inGroup('media_browser_admin'))
{
this.folderListInfo.appendChild(document.createTextNode('['));
var link = document.createElement('span');
link.className = 'media_browser_link';
link.appendChild(document.createTextNode('Edit Directories'));
var parent = this;
link.onclick = function()
{
parent.editMode();
}
this.folderListInfo.appendChild(link);
this.folderListInfo.appendChild(document.createTextNode('] ['));
var link = document.createElement('a');
link.className = 'media_browser_link';
link.appendChild(document.createTextNode('Edit Media'));
link.href = 'editmedia.php';
link.target = '_blank';
this.folderListInfo.appendChild(link);
this.folderListInfo.appendChild(document.createTextNode(']'));
}else
{
this.folderListInfo.appendChild(document.createTextNode('Click folder to expand tree. Click name to load media.'));
}
this.viewMode();
}
center.addContainer(folderTitle, 14);
div.folderDS = new dataset(new Array('id', 'depth', 'open', 'name', 'description', 'media'), null);
var folderColRenderer = function(input, inputRow, inputColPos, inputRowPos)
{
var cell = document.createElement('div');
var spacing = document.createElement('div');
var spacing2 = document.createElement('div');
var image = document.createElement('img');
var text = document.createElement('div');
cell.className = 'sslistview_cell';
spacing.className = 'media_browser_cell_element_small_spacing';
spacing2.className = 'media_browser_cell_element_small_spacing';
image.className = 'media_browser_cell_element_image';
text.className = 'media_browser_cell_folder_text';
spacing.style['width'] = (inputRow['depth']*16).toString() + 'px';
spacing.style['height'] = '2px';
spacing2.style['width'] = '2px';
spacing2.style['height'] = '2px';
image.style['width'] = '16px';
image.style['height'] = '16px';
text.appendChild(document.createTextNode(input.toString()));
if (inputRow['open'] == 1)
{
image.src = 'app/images/icons/open_folder.gif';
image.onclick = function()
{
div.rootFolder.closeFolder(inputRow['id']);
}
}else if(inputRow['open'] == 0)
{
image.src = 'app/images/icons/closed_folder.gif';
image.onclick = function()
{
div.rootFolder.openFolder(inputRow['id']);
}
}else if(inputRow['open'] == -1)
{
text.className = 'media_browser_cell_element_dimstate';
cell.appendChild(spacing);
cell.appendChild(text);
return cell;
}
text.onclick = function()
{
div.loadMediaFromFolder(inputRow['id']);
}
cell.appendChild(spacing);
cell.appendChild(image);
cell.appendChild(spacing2);
cell.appendChild(text);
cell.onmouseover = function()
{
app.tip.request(cell);
}
cell.onmouseout = function()
{
app.tip.clear();
}
return cell;
}
var normalColRenderer = function(input, inputRow, inputColPos, inputRowPos)
{
if (input == null)
{
input = "";
}
var cell = document.createElement('div');
cell.className = 'sslistview_cell';
cell.appendChild(document.createTextNode(input.toString()));
cell.onmouseover = function()
{
app.tip.request(cell);
}
cell.onmouseout = function()
{
app.tip.clear();
}
return cell;
}
var centerColRenderer = function(input, inputRow, inputColPos, inputRowPos)
{
if (input == null)
{
input = "";
}
var cell = document.createElement('div');
cell.className = 'sslistview_cell_centered';
cell.appendChild(document.createTextNode(input.toString()));
return cell;
}
var nullLabelClick = function(column, listView) {};
var columns = {
0:{
'label':'Name',
'attr':'name',
'width':35,
'widthType':'%',
'renderer':folderColRenderer,
'labelClick':nullLabelClick
},
1:{
'label':'Description',
'attr':'description',
'width':65,
'widthType':'%',
'renderer':normalColRenderer,
'labelClick':nullLabelClick
},
2:{
'label':'Media',
'attr':'media',
'width':45,
'widthType':'.',
'renderer':centerColRenderer,
'labelClick':nullLabelClick
}
};
div.folderView = document.createElement('div');
listView(
div.folderView,
div.folderDS,
columns,
0,
0,
13,
17,
'sslistview_label',
0,
null
);
center.addContainer(div.folderView, 150);
div.reloadFolderDS = function(folder, depth)
{
if (depth == null)
{
folder = (this.rootFolder!=null?this.rootFolder:folder);
depth = 0;
this.folderDS.clearSort();
this.folderDS.clear();
}
var folderSet = null;
///*
if (folder.children.length == 0 && folder.loading == false)
{
folderSet = {
'id':null,
'depth':depth,
'open':-1,
'name':'No Sub Folders',
'description':''
};
this.folderDS.add(folderSet);
}
//*/
if (folder.children.length == 0 && folder.loading == true)
{
folderSet = {
'id':null,
'depth':depth,
'open':-1,
'name':'Loading...',
'description':''
};
this.folderDS.add(folderSet);
}
for (var i = 0; i < folder.children.length; i++)
{
folderSet = {
'id':folder.children[i]['id'],
'depth':depth,
'open':(folder.children[i]['children']==null?0:1),
'name':folder.children[i]['name'],
'description':folder.children[i]['description'],
'media':folder.children[i]['media']
};
this.folderDS.add(folderSet);
if (folder.children[i]['children'] != null)
{
this.reloadFolderDS(folder.children[i]['children'], depth+1);
}
}
if (depth == 0)
{
this.folderView.refreshData();
}
}
div.rootFolder = new mediaBrowserFolderChildren(0, new objfn('reloadFolderDS', div));
var fileTitle = document.createElement('div');
divToContainer(fileTitle);
fileTitle.className = 'media_browser_desc';
var listTitle = document.createElement('div');
listTitle.className = 'media_browser_list_title';
listTitle.appendChild(document.createTextNode('Media: '));
fileTitle.appendChild(listTitle);
div.fileListInfo = document.createElement('div');
div.fileListInfo.className = 'media_browser_list_info';
div.fileListInfo.appendChild(document.createTextNode('Folder: /'));
fileTitle.appendChild(div.fileListInfo);
center.addContainer(fileTitle, 14);
var fileColRenderer = function(input, inputRow, inputColPos, inputRowPos)
{
var cell = document.createElement('div');
var image = document.createElement('img');
var text = document.createElement('div');
var spacing2 = document.createElement('div');
cell.className = 'sslistview_cell';
image.className = 'media_browser_cell_element_image';
text.className = 'media_browser_cell_folder_text';
image.style['width'] = '16px';
image.style['height'] = '16px';
text.appendChild(document.createTextNode(input.toString()));
image.src = 'app/images/icons/media.gif';
if (inputRow['id'] == null)
{
text.className = 'media_browser_cell_element_dimstate';
cell.appendChild(text);
return cell;
}
image.onclick = function()
{
app.getFunction('mediaManager', 'loadMedia').run(inputRow['id']);
}
text.onclick = function()
{
app.getFunction('mediaManager', 'loadMedia').run(inputRow['id']);
}
cell.appendChild(image);
cell.appendChild(spacing2);
cell.appendChild(text);
cell.onmouseover = function()
{
app.tip.request(cell);
}
cell.onmouseout = function()
{
app.tip.clear();
}
return cell;
}
var numericSorter = function(a, b)
{
a = parseFloat(a);
b = parseFloat(b);
if (a == b)
{
return 0;
}
if (a < b)
{
return -1;
}
return 1;
}
var numericSorterRev = function(a, b)
{
a = parseFloat(a);
b = parseFloat(b);
if (a == b)
{
return 0;
}
if (a > b)
{
return -1;
}
return 1;
}
div.fileDS = new dataset(new Array('id', 'name', 'description', 'timestamp', 'date', 'captions', 'downloadURL'), {'timestamp':numericSorterRev});
div.fileView = document.createElement('div');
var sortByTimestamp = function(column, listView)
{
var attr = 'timestamp';
var prevSort = listView.dataSet.getSort(attr);
var prevSortPos = listView.dataSet.getSortPos(attr);
if (prevSortPos != 0)
{
prevSort = null;
}
if (prevSort == 'asc')
{
listView.dataSet.setSort(attr, false);
}else
{
listView.dataSet.setSort(attr, true);
}
listView.refreshData();
}
var downloadRenderer = function(input, inputRow, inputColPos, inputRowPos)
{
var cell = document.createElement('div');
if (inputRow['id'] == null)
{
return cell;
}
var a = document.createElement('a');
a.appendChild(document.createTextNode('Download'));
a.target = "_blank";
a.href = inputRow['downloadURL'];
cell.className = "sslistview_cell";
cell.appendChild(a);
cell.onmouseover = function()
{
app.tip.request(cell, "Right click. Then click 'Save Target As...'!");
}
cell.onmouseout = function()
{
app.tip.clear();
}
return cell;
}
columns = {
0:{
'label':'Name',
'attr':'name',
'width':40,
'widthType':'%',
'renderer':fileColRenderer,
'labelClick':null
},
1:{
'label':'Description',
'attr':'description',
'width':60,
'widthType':'%',
'renderer':normalColRenderer,
'labelClick':null
},
2:{
'label':'Caps',
'attr':'captions',
'width':35,
'widthType':'.',
'renderer':centerColRenderer,
'labelClick':null
},
3:{
'label':'Added',
'attr':'date',
'width':75,
'widthType':'.',
'renderer':normalColRenderer,
'labelClick':sortByTimestamp
},
4:{
'label':'',
'attr':null,
'width':65,
'widthType':'.',
'renderer':downloadRenderer,
'labelClick':function(c, lv){}
}
};
listView(
div.fileView,
div.fileDS,
columns,
0,
0,
13,
17,
'sslistview_label',
0,
null
);
center.addContainer(div.fileView);
div.loadMediaFromFolder = function(id)
{
this.fileDS.clear();
var file = {
'id':null,
'name':'Loading...',
'description':'',
'timestamp':0,
'date':''
};
this.fileDS.add(file);
this.fileView.refreshData();
var rsp = new phpRequest(new objfn('loadMedia', this), 'getFolderMedia', 'media_browser_responder', 'app/jsresponder.php');
rsp.run(id);
}
div.loadMedia = function(mediaInfo)
{
clearChildNodes(this.fileListInfo);
this.fileListInfo.appendChild(document.createTextNode(mediaInfo['location']));
media = mediaInfo['listing'];
this.fileDS.clear();
this.fileDS.clearSort();
var file = null;
if (media.length == 0)
{
file = {
'id':null,
'name':'Empty',
'description':'',
'timestamp':0,
'date':''
};
this.fileDS.add(file);
}
if (mediaInfo['folderID'] != null)
{
this.rootFolder.openFolder(mediaInfo['folderID']);
}
for (var i = 0; i < media.length; i++)
{
file = {
'id':media[i]['id'],
'name':media[i]['name'],
'description':media[i]['description'],
'timestamp':media[i]['added'],
'captions':media[i]['captions'],
'date':media[i]['date'],
'downloadURL':media[i]['downloadURL']
};
this.fileDS.add(file);
}
this.fileView.refreshData();
}
app.cach.bind('userInfo', new objfn('readUserStatus', div));
div.loadMediaFromFolder(0);
}
function mediaBrowserFolderChildren(id, monitor)
{
this.id = id;
this.children = new Array();
this.monitor = monitor;
this.loading = true;
var rsp = new phpRequest(new objfn('readChildren', this), 'getFolderChildren', 'media_browser_responder', 'app/jsresponder.php');
rsp.run(id);
}
mediaBrowserFolderChildren.prototype.readChildren = function(result)
{
var child = null;
for (var i = 0; i < result.length; i++)
{
child = {
'id':result[i]['id'],
'name':result[i]['name'],
'description':result[i]['description'],
'media':result[i]['media'],
'children':null
};
this.children[this.children.length] = child;
}
this.loading = false;
this.monitor.run(this);
}
mediaBrowserFolderChildren.prototype.openFolder = function(id)
{
for (var i = 0; i < this.children.length; i++)
{
if (this.children[i]['id'] == id)
{
if (this.children[i]['children'] == null)
{
this.children[i]['children'] = new mediaBrowserFolderChildren(id, this.monitor);
this.monitor.run(this);
}
return true;
}else
{
if (this.children[i]['children'] != null)
{
if (this.children[i]['children'].openFolder(id))
{
return true;
}
}
}
}
return false;
}
mediaBrowserFolderChildren.prototype.closeFolder = function(id)
{
for (var i = 0; i < this.children.length; i++)
{
if (this.children[i]['id'] == id)
{
this.children[i]['children'] = null;
this.monitor.run(this);
return true;
}else
{
if (this.children[i]['children'] != null)
{
if (this.children[i]['children'].closeFolder(id))
{
return true;
}
}
}
}
return false;
}
function initApplication(buttonCont, contentCont)
{
var tabs = new tabHandler(contentCont);
app.addComponent('mainTabHandler', tabs);
app.addFunction('mainTabHandler', 'selectTab', new objfn('selectTab', tabs));
var tabPages = new Array();
tabPages[tabPages.length] = createMainPage();
tabPages[tabPages.length] = createMediaBrowser();
tabPages[tabPages.length] = createPlayer();
tabPages[tabPages.length] = createHowTo();
for(var i = 0; i < tabPages.length; i++)
{
var button = document.createElement('div');
var text = document.createElement('div');
text.appendChild(document.createTextNode(tabPages[i].buttonTitle));
text.className = 'main_button_text';
button.appendChild(text);
divToButton(button, 'main_button_up', 'main_button_down', 'main_button_hl', 100, 22);
buttonCont.addContainer(button, 100);
tabPages[i].layerID = contentCont.addContainer(tabPages[i]);
tabs.addTab(button, tabPages[i].layerID);
}
tabs.selectTab(0);
}
function createPlayerCaptionDisplay()
{
var div = document.createElement('div');
divToHorizontalSplitContainer(div);
var infoDisplay = document.createElement('div');
divToContainer(infoDisplay);
infoDisplay.appendChild(document.createTextNode('Caption Info'));
div.addContainer(infoDisplay, 50);
var captionDisplay = document.createElement('div');
divToContainer(captionDisplay);
captionDisplay.className = 'centered';
captionDisplay.appendChild(document.createTextNode('Caption Container'));
div.addContainer(captionDisplay);
var editorCnt = document.createElement('div');
divToContainer(editorCnt);
// editorCnt.style['background'] = '#FFEEFF';
div.addContainer(editorCnt, 25);
editorCnt.style['position'] = 'relative';
var precisionSliderCnt = document.createElement('div');
divToContainer(precisionSliderCnt);
// precisionSliderCnt.style['background'] = '#FFEEFF';
div.addContainer(precisionSliderCnt, 60);
precisionSliderCnt.style['position'] = 'relative';
var slideHandle = document.createElement('div');
slideHandle.style['height'] = '20px';
slideHandle.style['width'] = '20px';
// slideHandle.style['background'] = '#FFFF00';
slideHandle.className = 'player_media_slider_button';
var positionSlider = createHorizontalSlider(100, 0, 20, 400, slideHandle, 20, null);
positionSlider.style['top'] = '40px';
positionSlider.style['left'] = '20px';
positionSlider.style['position'] = 'absolute';
positionSlider.className = 'player_media_slider_bar';
var lineSlider = document.createElement('div');
divToContainer(lineSlider);
// lineSlider.style['background'] = "#AAAAFF";
lineSlider.style['position'] = 'absolute';
lineSlider.style['height'] = '20px';
lineSlider.style['width'] = '20px';
lineSlider.style['top'] = '20px';
lineSlider.style['left'] = '21px';
var zoomDropDown = document.createElement('div');
zoomDropDown.style['position'] = 'absolute';
zoomDropDown.style['height'] = '20px';
zoomDropDown.style['top'] = '0px';
zoomDropDown.style['left'] = '20px';
zoomDropDown.className = 'player_captionInfo';
zoomDropDown.appendChild(document.createTextNode('Zoom: '));
var zoomSelect = document.createElement('select');
zoomSelect.onchange = function()
{
app.cach.setVariable('precisionSliderMillisecondsPerPixel', this.value);
}
zoomSelect.className = 'player_media_dropdown';
var zoomOptions = new Array(10, 20, 30, 40, 50, 60, 70, 80, 90, 100);
var zoomOption;
for(var i = 0; i < zoomOptions.length; i++)
{
zoomOption = document.createElement('option');
zoomOption.value = zoomOptions[i];
zoomOption.appendChild(document.createTextNode(zoomOptions[i].toString() + ' milliseconds/pixel'));
zoomSelect.appendChild(zoomOption);
}
zoomDropDown.appendChild(zoomSelect);
zoomSelect.onchange();
precisionSliderCnt.sliderToSeconds = function(number)
{
var sliderHalf = (this.positionSlider.sliderMax)/2;
var numberOffset = number - sliderHalf;
var currPos = app.getFunction('player', 'getPosition').run();
var finalPos = currPos + (numberOffset*app.cach.get('precisionSliderMillisecondsPerPixel'));
if (finalPos < 0)
{
finalPos = 0;
}
var maxPos = app.getFunction('player', 'getClipLength').run();
if (finalPos > maxPos)
{
finalPos = maxPos;
}
return finalPos;
}
precisionSliderCnt.intToTime = function(number)
{
number = this.sliderToSeconds(number);
if (number < 0) {number = 0;}
number = number / 1000;
var minutes = Math.floor(number/60);
var seconds = number - (minutes * 60);
seconds = Math.round(seconds*100)/100;
if (seconds < 10)
{
seconds = '0' + seconds.toString();
}else
{
seconds = seconds.toString();
}
return minutes.toString() + ':' + seconds;
}
precisionSliderCnt.readPosSlideChange = function(pos)
{
app.getFunction('player', 'setPosition').run(this.sliderToSeconds(pos));
this.resizeChildren();
}
positionSlider.posToTextFn = new objfn('intToTime', precisionSliderCnt);
positionSlider.posMonFn = new objfn('readPosSlideChange', precisionSliderCnt);
precisionSliderCnt.appendChild(zoomDropDown);
precisionSliderCnt.appendChild(lineSlider);
precisionSliderCnt.appendChild(positionSlider);
precisionSliderCnt.lineSlider = lineSlider;
precisionSliderCnt.positionSlider = positionSlider;
precisionSliderCnt.resizeChildren = function()
{
this.positionSlider.sliderMax = (this.currX-40)-this.positionSlider.sliderWidth;
this.positionSlider.setPos((this.positionSlider.sliderMax)/2);
this.positionSlider.setWidth(this.currX-40);
this.lineSlider.setSize((this.currX-40), 20);
}
var capMan = new captionManager(infoDisplay, captionDisplay, precisionSliderCnt, editorCnt);
app.addComponent('captionManager', capMan);
return div;
}
function captionManager(infoDiv, capDiv, precisionSliderCnt, editorCnt)
{
this.infoDiv = infoDiv;
this.capDiv = capDiv;
this.editorCnt = editorCnt;
this.lineSlider = new lineSlideMonitor(precisionSliderCnt.lineSlider, precisionSliderCnt.positionSlider, this);
clearChildNodes(capDiv);
clearChildNodes(infoDiv);
clearChildNodes(editorCnt);
capDiv.className = 'centered';
this.textContainer = document.createElement('span');
this.gurmukhiTextSpan = document.createElement('span');
this.gurmukhiText = document.createTextNode('<>');
this.gurmukhiTextSpan.appendChild(this.gurmukhiText);
this.gurmukhiTextSpan.className = 'player_media_gurmukhi_text';
this.englishTextSpan = document.createElement('span');
this.englishText = document.createTextNode('Ik On-ankar');
this.englishTextSpan.appendChild(this.englishText);
this.englishTextSpan.className = 'player_media_english_text';
this.translationTextSpan = document.createElement('span');
this.translationText = document.createTextNode('One God');
this.translationTextSpan.appendChild(this.translationText);
this.translationTextSpan.className = 'player_media_english_text';
this.editButtonCnt = document.createElement('span');
this.textContainer.appendChild(this.gurmukhiTextSpan);
this.textContainer.appendChild(document.createElement('br'));
this.textContainer.appendChild(this.englishTextSpan);
this.textContainer.appendChild(document.createElement('br'));
this.textContainer.appendChild(this.translationTextSpan);
this.editTextContainer = document.createElement('span');
this.editTextContainer.className = 'player_media_edit_text_container';
this.editTextContainer.style['visibility'] = 'hidden';
this.editTextContainer.style['display'] = 'none';
this.timeInput = document.createElement('input');
this.timeInput.className = 'player_media_input_box player_media_english_text';
this.timeInput.style['width'] = '100px';
makeInputTimeReader(this.timeInput);
this.timeInput.monitorChange = new objfn('monitorEditingTimeInput', this);
this.gurmukhiInput = document.createElement('input');
this.gurmukhiInput.className = 'player_media_input_box player_media_gurmukhi_text';
this.gurmukhiInput.style['width'] = '390px';
this.englishInput = document.createElement('input');
this.englishInput.className = 'player_media_input_box player_media_english_text';
this.englishInput.style['width'] = '390px';
this.translationInput = document.createElement('input');
this.translationInput.className = 'player_media_input_box player_media_english_text';
this.translationInput.style['width'] = '390px';
this.editTextContainer.appendChild(this.timeInput);
this.editTextContainer.appendChild(document.createElement('br'));
this.editTextContainer.appendChild(this.gurmukhiInput);
this.editTextContainer.appendChild(document.createElement('br'));
this.editTextContainer.appendChild(this.englishInput);
this.editTextContainer.appendChild(document.createElement('br'));
this.editTextContainer.appendChild(this.translationInput);
capDiv.appendChild(this.editTextContainer);
capDiv.appendChild(this.textContainer);
capDiv.appendChild(document.createElement('br'));
capDiv.appendChild(this.editButtonCnt);
infoDiv.className = 'player_captionInfo';
this.captions = new Array();
this.editable = false;
this.editMode = false;
this.editing = false;
this.editingLine = -1;
this.optPrevTimeCheck = -1;
this.optNextTimeCheck = -1;
this.previousRenderedCap = -1;
this.addNewLine = function()
{
var line = {};
var match = new RegExp("^([\\x20-\\xFF]*)$");
if (!match.test(this.gurmukhiInput.value))
{
alert("The following line contains invalid characters:\n"+this.gurmukhiInput.value);
return;
}
if (!match.test(this.englishInput.value))
{
alert("The following line contains invalid characters:\n"+this.englishInput.value);
return;
}
if (!match.test(this.translationInput.value))
{
alert("The following line contains invalid characters:\n"+this.translationInput.value);
return;
}
line['time'] = this.timeInput.currVal;
line['gurmukhi'] = this.gurmukhiInput.value;
line['english'] = this.englishInput.value;
line['translation'] = this.translationInput.value;
line['captionid'] = this.currentCaptionID;
this.captions[this.captions.length] = line;
this.newlyAddedLineID = this.fixLinePosition(this.captions.length-1);
clearChildNodes(this.editButtonCnt);
var rsp = new phpRequest(new objfn('finishedAddlingCaption', this), 'addCaption', 'caption_responder', 'app/jsresponder.php');
rsp.run(this.captions[this.newlyAddedLineID]);
}
this.finishedAddlingCaption = function(newID)
{
this.captions[this.newlyAddedLineID]['id'] = newID;
this.finishedSavingCaption();
}
this.monitorEditingTimeInput = function(time)
{
if (!this.editing){return;}
if (this.editingLine == -1) {return;}
this.updateCaptionLine(time, this.gurmukhiInput.value, this.englishInput.value, this.translationInput.value);
this.editingLine = this.fixLinePosition(this.editingLine);
this.optPrevTimeCheck = -1;
this.optNextTimeCheck = -1;
this.previousRenderedCap = this.editingLine;
}
this.didEditorChangeLineCaptions = function()
{
if (!this.editing){return false;}
if (this.editingLine == -1) {return false;}
if (this.timeInput.currVal != this.editorOriginalTime ||
this.gurmukhiInput.value != this.editorOriginalGurmukhi ||
this.englishInput.value != this.editorOriginalEnglish ||
this.translationInput.value != this.editorOriginalTranslation)
{
return true;
}
return false;
}
this.updateCaptionLine = function(time, gurmukhi, english, translation)
{
if (!this.editing) {return;}
this.captions[this.editingLine]['time'] = time;
this.captions[this.editingLine]['gurmukhi'] = gurmukhi;
this.captions[this.editingLine]['english'] = english;
this.captions[this.editingLine]['translation'] = translation;
}
this.fixLinePosition = function(index)
{
if (index != 0)
{
if (this.captions[index]['time'] < this.captions[index-1]['time'])
{
return this.fixLinePositionBack(index);
}
}
if(index != this.captions.length-1)
{
if (this.captions[index]['time'] > this.captions[index+1]['time'])
{
return this.fixLinePositionForward(index);
}
}
return index;
}
this.fixLinePositionForward = function(index)
{
var tmp;
while(index != this.captions.length-1 && this.captions[index]['time'] > this.captions[index+1]['time'])
{
tmp = this.captions[index+1];
this.captions[index+1] = this.captions[index];
this.captions[index] = tmp;
index++;
}
this.lineSlider.clearLines();
return index;
}
this.fixLinePositionBack = function(index)
{
var tmp;
while(index != 0 && this.captions[index]['time'] < this.captions[index-1]['time'])
{
tmp = this.captions[index-1];
this.captions[index-1] = this.captions[index];
this.captions[index] = tmp;
index--;
}
this.lineSlider.clearLines();
return index;
}
this.updateCaptions = function()
{
var currPos = app.getFunction('player', 'getPosition').run()/1000;
this.lineSlider.searchNewLines(currPos);
if (this.editing)
{
return;
}
if (currPos >= this.optPrevTimeCheck && currPos < this.optNextTimeCheck)
{
return;
}
var currCap = this.getCurrentCaption(currPos);
if (currCap == null)
{
this.optPrevTimeCheck = -1;
this.optNextTimeCheck = -1;
this.previousRenderedCap = -1;
this.gurmukhiText.nodeValue = '';
this.englishText.nodeValue = '';
this.translationText.nodeValue = '';
clearChildNodes(this.editButtonCnt);
this.textContainer.style['visibility'] = 'visible';
this.textContainer.style['display'] = 'block';
this.editTextContainer.style['visibility'] = 'hidden';
this.editTextContainer.style['display'] = 'none';
return;
}
if (currCap != this.captions.length-1)
{
this.optNextTimeCheck = this.captions[currCap+1]['time'];
this.optPrevTimeCheck = this.captions[currCap]['time'];
}else
{
this.optNextTimeCheck = -1;
this.optPrevTimeCheck = -1;
}
if (this.previousRenderedCap != currCap)
{
this.previousRenderedCap = currCap;
this.gurmukhiText.nodeValue = this.captions[currCap]['gurmukhi'];
this.englishText.nodeValue = this.captions[currCap]['english'];
this.translationText.nodeValue = this.captions[currCap]['translation'];
this.textContainer.style['visibility'] = 'visible';
this.textContainer.style['display'] = 'block';
this.editTextContainer.style['visibility'] = 'hidden';
this.editTextContainer.style['display'] = 'none';
clearChildNodes(this.editButtonCnt);
if (this.editMode)
{
var editButton = document.createElement('input');
editButton.type = 'button';
editButton.value = 'Edit';
editButton.className = 'player_media_input_button';
editButton.parent = this;
editButton.onclick = function()
{
this.parent.setEditingLine(this.parent.previousRenderedCap);
}
this.editButtonCnt.appendChild(editButton);
}
}
}
this.setEditingLine = function(index)
{
this.previousRenderedCap = index;
this.editing = true;
this.editingLine = index;
this.textContainer.style['visibility'] = 'hidden';
this.textContainer.style['display'] = 'none';
this.editTextContainer.style['visibility'] = 'visible';
this.editTextContainer.style['display'] = 'block';
clearChildNodes(this.editButtonCnt);
this.editorOriginalTime = this.captions[index]['time'];
this.editorOriginalGurmukhi = this.captions[index]['gurmukhi'];
this.editorOriginalEnglish = this.captions[index]['english'];
this.editorOriginalTranslation = this.captions[index]['translation'];
this.timeInput.setValue(this.captions[index]['time']);
this.gurmukhiInput.value = this.captions[index]['gurmukhi'];
this.englishInput.value = this.captions[index]['english'];
this.translationInput.value = this.captions[index]['translation'];
var save = document.createElement('input');
save.type = 'button';
save.className = 'player_media_input_button';
save.value = 'Save';
save.parent = this;
save.onclick = function()
{
var match = new RegExp("^([\\x20-\\xFF]*)$");
if (!match.test(this.parent.gurmukhiInput.value))
{
alert("The following line contains invalid characters:\n"+this.parent.gurmukhiInput.value);
return;
}
if (!match.test(this.parent.englishInput.value))
{
alert("The following line contains invalid characters:\n"+this.parent.englishInput.value);
return;
}
if (!match.test(this.parent.translationInput.value))
{
alert("The following line contains invalid characters:\n"+this.parent.translationInput.value);
return;
}
this.parent.updateCaptionLine(this.parent.timeInput.currVal, this.parent.gurmukhiInput.value, this.parent.englishInput.value, this.parent.translationInput.value);
var rsp = new phpRequest(new objfn('finishedSavingCaption' ,this.parent), 'updateCaption', 'caption_responder', 'app/jsresponder.php');
rsp.run(this.parent.captions[this.parent.editingLine]);
this.parent.fixLinePosition(this.parent.editingLine);
clearChildNodes(this.parent.editButtonCnt);
}
var cancel = document.createElement('input');
cancel.type = 'button';
cancel.className = 'player_media_input_button';
cancel.value = 'Cancel';
cancel.parent = this;
cancel.onclick = function()
{
this.parent.updateCaptionLine(this.parent.editorOriginalTime, this.parent.editorOriginalGurmukhi, this.parent.editorOriginalEnglish, this.parent.editorOriginalTranslation);
this.parent.fixLinePosition(this.parent.editingLine);
this.parent.editing = false;
this.parent.optPrevTimeCheck = -1;
this.parent.optNextTimeCheck = -1;
this.parent.previousRenderedCap = -1;
}
var deleteButton = document.createElement('input');
deleteButton.type = 'button';
deleteButton.className = 'player_media_input_button';
deleteButton.value = 'Delete';
deleteButton.parent = this;
deleteButton.onclick = function()
{
if (!confirm('Are you sure you want to delete this line?'))
{
return;
}
this.parent.captions[this.parent.editingLine]['time'] = this.parent.captions[this.parent.captions.length-1]['time']+1;
this.parent.fixLinePosition(this.parent.editingLine);
var removed = this.parent.captions.pop();
var rsp = new phpRequest(new objfn('finishedSavingCaption', this.parent), 'removeCaption', 'caption_responder', 'app/jsresponder.php');
rsp.run(removed['id']);
clearChildNodes(this.parent.editButtonCnt);
}
this.editButtonCnt.appendChild(save);
this.editButtonCnt.appendChild(deleteButton);
this.editButtonCnt.appendChild(cancel);
}
this.finishedSavingCaption = function()
{
this.editing = false;
this.optPrevTimeCheck = -1;
this.optNextTimeCheck = -1;
this.previousRenderedCap = -1;
}
this.getCurrentCaption = function(currPos)
{
if (this.captions == null || this.captions.length == 0)
{
return null;
}
return this.binarySearchCaptions(this.captions, currPos, 0, this.captions.length-1);
/*
for(var i = 0; i < this.captions.length-1; i++)
{
if (currPos >= this.captions[i].time && currPos < this.captions[i+1].time)
{
break;
}
}
if (i == 0)
{
return null;
}
return i;
*/
}
this.binarySearchCaptions = function(arr, search, start, end)
{
if (search >= arr[end]['time'])
{
return end;
}
if (search < arr[start]['time'])
{
return null;
}
if (start == end)
{
return null;
}
var mid = Math.floor((start+end)/2);
if (search >= arr[mid]['time'] && search < arr[mid+1]['time'])
{
return mid;
}
if (search < arr[mid]['time'])
{
return this.binarySearchCaptions(arr, search, start, mid);
}else
{
return this.binarySearchCaptions(arr, search, mid, end);
}
}
this.loadCaptions = function(id)
{
if (id == null || id == '')
{
this.captions = new Array();
this.editable = false;
this.currentCaptionID = null;
this.captionReader({'editable':'0', 'captions':new Array()});
return;
}
this.currentCaptionID = id;
var rsp = new phpRequest(new objfn('captionReader' ,this), 'getCaptions', 'caption_responder', 'app/jsresponder.php');
rsp.run(id);
}
this.captionReader = function(result)
{
if(result.editable == '1')
{
this.editable = true;
}else
{
this.editable = false;
}
this.captionInfo = result['captionInfo'];
var media = app.cach.get('currentMedia');
clearChildNodes(this.captionCreateSubmitCnt);
if (this.editable && !app.auth.inGroup('caption_admin'))
{
if (this.captionInfo != null && this.captionInfo['submitted'] == 'N')
{
var newCap = document.createElement('input');
newCap.className = 'media_browser_input_normal_button';
newCap.type = 'button';
newCap.value = 'Submit Captions';
newCap.parent = this;
newCap.onclick = function()
{
if (!confirm("Submitting captions alerts the admins that you have finished working on this caption. The admins will look over the captions and either suggest improvements, or make the caption public. If you have any questions you can always e-mail us at sikhshabads@gmail.com.\nContinue?"))
{
return;
}
var rsp = new phpRequest(new objfn('userChange' ,this.parent), 'submitCaption', 'caption_responder', 'app/jsresponder.php');
rsp.run(this.parent.captionInfo['id']);
}
this.captionCreateSubmitCnt.appendChild(newCap);
}
if (this.captionInfo['submitted'] == 'Y')
{
var capStatus = document.createElement('span');
capStatus.appendChild(document.createTextNode('Caption Submitted'));
capStatus.className = 'media_browser_link';
capStatus.onclick = function()
{
alert('Your captions have been submitted. You can continue to make minor changes to your captions, but once your captions goes public, you will no longer be able to modify them. If you want to cancel your request, please e-mail sikhshabads@gmail.com.');
}
this.captionCreateSubmitCnt.appendChild(capStatus);
}
}else
{
if (media['createCap'] == '1' || app.auth.inGroup('caption_admin'))
{
var newCap = document.createElement('input');
newCap.className = 'media_browser_input_normal_button';
newCap.type = 'button';
newCap.value = 'Create Captions';
newCap.parent = this;
newCap.onclick = function()
{
var media = app.cach.get('currentMedia');
if (media == null)
{
return;
}
if (!confirm("Creating a new caption allows you to make your own captions for this media.\nContinue?"))
{
return;
}
var rsp = new phpRequest(new objfn('userChange' ,this.parent), 'createCaption', 'media_responder', 'app/jsresponder.php');
rsp.run(media['id']);
}
this.captionCreateSubmitCnt.appendChild(newCap);
}
}
this.editMode = false;
this.editing = false;
this.optPrevTimeCheck = -1;
this.optNextTimeCheck = -1;
this.previousRenderedCap = -1;
this.lineSlider.clearLines();
this.captions = result['captions'];
for(var i = 0; i < this.captions.length; i++)
{
this.captions[i]['time'] = parseFloat(this.captions[i]['time']);
}
this.redrawEditorContainer();
}
this.redrawEditorContainer = function()
{
clearChildNodes(this.editorCnt);
if (!this.editable)
{
return;
}
this.optPrevTimeCheck = -1;
this.optNextTimeCheck = -1;
this.previousRenderedCap = -1;
var modeSwitch;
modeSwitch = document.createElement('input');
modeSwitch.type = 'button';
modeSwitch.className = 'user_menu_input_button';
modeSwitch.parent = this;
if (!this.editMode)
{
modeSwitch.value = 'Edit Mode';
modeSwitch.onclick = function()
{
this.parent.editMode = true;
this.parent.editing = false;
this.parent.redrawEditorContainer();
}
this.editorCnt.appendChild(modeSwitch);
}else
{
modeSwitch.value = 'View Mode';
modeSwitch.onclick = function()
{
if (this.parent.didEditorChangeLineCaptions())
{
alert('You are currently editing a line. Save or cancel it before switching to view mode.');
return;
}
this.parent.editing = false;
this.parent.editMode = false;
this.parent.redrawEditorContainer();
}
this.editorCnt.appendChild(modeSwitch);
var addLine = document.createElement('input');
addLine.type = 'button';
addLine.className = 'user_menu_input_button';
addLine.parent = this;
addLine.value = 'Add Line';
addLine.onclick = function()
{
this.parent.setAddNewLine();
}
this.editorCnt.appendChild(addLine);
if (app.auth.inGroup('caption_admin') && this.captionInfo != null)
{
var modifyCapPublic = document.createElement('input');
modifyCapPublic.type = 'button';
modifyCapPublic.className = 'user_menu_input_button';
modifyCapPublic.parent = this;
if (this.captionInfo['public'] == 'Y')
{
modifyCapPublic.value = 'Make Private';
modifyCapPublic.onclick = function()
{
if (!confirm('Are you sure you want to make this caption private?'))
{
return;
}
var rsp = new phpRequest(new objfn('userChange' ,this.parent), 'setCaptionPublic', 'caption_responder', 'app/jsresponder.php');
rsp.run(this.parent.captionInfo['id'], 'N');
}
}else
{
modifyCapPublic.value = 'Make Public';
modifyCapPublic.onclick = function()
{
if (!confirm('Are you sure you want to make this caption public?'))
{
return;
}
var rsp = new phpRequest(new objfn('userChange' ,this.parent), 'setCaptionPublic', 'caption_responder', 'app/jsresponder.php');
rsp.run(this.parent.captionInfo['id'], 'Y');
}
}
this.editorCnt.appendChild(modifyCapPublic);
}
}
}
this.setAddNewLine = function()
{
this.editing = true;
this.editingLine = -1;
this.textContainer.style['visibility'] = 'hidden';
this.textContainer.style['display'] = 'none';
this.editTextContainer.style['visibility'] = 'visible';
this.editTextContainer.style['display'] = 'block';
clearChildNodes(this.editButtonCnt);
this.timeInput.setValue(app.getFunction('player', 'getPosition').run()/1000);
this.gurmukhiInput.value = 'gurmuKI';
this.englishInput.value = 'English Pronunciation';
this.translationInput.value = 'Translation';
var cancel = document.createElement('input');
cancel.type = 'button';
cancel.className = 'player_media_input_button';
cancel.value = 'Cancel';
cancel.parent = this;
cancel.onclick = function()
{
this.parent.editing = false;
this.parent.optPrevTimeCheck = -1;
this.parent.optNextTimeCheck = -1;
this.parent.previousRenderedCap = -1;
}
var addLine = document.createElement('input');
addLine.type = 'button';
addLine.className = 'player_media_input_button';
addLine.value = 'Add';
addLine.parent = this;
addLine.onclick = function()
{
this.parent.addNewLine();
}
var copyLine = document.createElement('input');
copyLine.type = 'button';
copyLine.className = 'player_media_input_button';
copyLine.value = 'Copy Existing';
copyLine.parent = this;
copyLine.onclick = function()
{
this.parent.editCopyLine();
}
this.editButtonCnt.appendChild(addLine);
this.editButtonCnt.appendChild(copyLine);
this.editButtonCnt.appendChild(cancel);
}
this.editCopyLine = function()
{
if (this.captions == null || this.captions.length == 0)
{
alert('This is the first line being added. There are no other lines to copy from!');
return;
}
if (this.editingLine == -1)
{
this.editingLine = this.previousRenderedCap;
}
this.copyCurrentLineIntoNewLine();
clearChildNodes(this.editButtonCnt);
var cancel = document.createElement('input');
cancel.type = 'button';
cancel.className = 'player_media_input_button';
cancel.value = 'Cancel Copy';
cancel.parent = this;
cancel.onclick = function()
{
this.parent.setAddNewLine();
}
var addLine = document.createElement('input');
addLine.type = 'button';
addLine.className = 'player_media_input_button';
addLine.value = 'Add';
addLine.parent = this;
addLine.onclick = function()
{
this.parent.addNewLine();
}
var prevLine = document.createElement('input');
prevLine.type = 'button';
prevLine.className = 'player_media_input_button';
prevLine.value = 'Previous Line';
prevLine.parent = this;
prevLine.onclick = function()
{
if (this.parent.editingLine == 0)
{
return;
}
this.nextLine.disabled = false;
this.parent.editingLine = this.parent.editingLine - 1;
if (this.parent.editingLine == 0)
{
this.disabled = true;
}
this.parent.copyCurrentLineIntoNewLine();
}
if (this.editingLine == 0)
{
prevLine.disabled = true;
}
var nextLine = document.createElement('input');
nextLine.type = 'button';
nextLine.className = 'player_media_input_button';
nextLine.value = 'Next Line';
nextLine.parent = this;
nextLine.onclick = function()
{
if (this.parent.editingLine == this.parent.captions.length-1)
{
return;
}
this.prevLine.disabled = false;
this.parent.editingLine = this.parent.editingLine + 1;
if (this.parent.editingLine == this.parent.captions.length-1)
{
this.disabled = true;
}
this.parent.copyCurrentLineIntoNewLine();
}
if (this.editingLine == this.captions.length-1)
{
nextLine.disabled = true;
}
prevLine.nextLine = nextLine;
nextLine.prevLine = prevLine;
this.editButtonCnt.appendChild(prevLine);
this.editButtonCnt.appendChild(nextLine);
this.editButtonCnt.appendChild(document.createElement('br'));
this.editButtonCnt.appendChild(addLine);
this.editButtonCnt.appendChild(cancel);
}
this.copyCurrentLineIntoNewLine = function()
{
this.gurmukhiInput.value = this.captions[this.editingLine]['gurmukhi'];
this.englishInput.value = this.captions[this.editingLine]['english'];
this.translationInput.value = this.captions[this.editingLine]['translation'];
}
this.newMedia = function(info)
{
clearChildNodes(this.infoDiv);
var status = document.createElement('div');
status.className = 'player_media_info';
status.appendChild(document.createTextNode('Name: ' + info['name']));
status.appendChild(document.createElement('br'));
status.appendChild(document.createTextNode('Description: ' + info['description']));
this.infoDiv.appendChild(status);
var captionInfo = document.createElement('div');
captionInfo.className = 'player_media_info';
captionInfo.appendChild(document.createTextNode('Captions: '));
var capDropDown = document.createElement('select');
capDropDown.className = 'player_media_dropdown';
captionInfo.appendChild(capDropDown);
capDropDown.parent = this;
capDropDown.onchange = function()
{
this.parent.loadCaptions(this.value);
}
var captions = info['captions'];
for(var i = 0; i < captions.length; i++)
{
var option = document.createElement('option');
option.value = captions[i]['id'];
if (captions[i]['public'] == '1')
{
option.appendChild(document.createTextNode('by ' + captions[i]['username'] +'['+captions[i]['id'].toString()+']'));
}else if(captions[i]['public'] == '0')
{
option.appendChild(document.createTextNode('-by ' + captions[i]['username'] +'['+ captions[i]['id'].toString() + ']'));
}
capDropDown.appendChild(option);
}
this.captionCreateSubmitCnt = document.createElement('div');
captionInfo.appendChild(this.captionCreateSubmitCnt);
this.infoDiv.appendChild(captionInfo);
capDropDown.onchange();
}
this.userChange = function()
{
var media = app.cach.get('currentMedia');
if (media == null)
{
return;
}
var rsp = new phpRequest(new objfn('setNewMediaInfo' ,this), 'getMediaInfo', 'media_responder', 'app/jsresponder.php');
rsp.run(media['id']);
}
this.setNewMediaInfo = function(info)
{
app.cach.setVariable('currentMedia', info);
}
app.cach.bind('currentMedia', new objfn('newMedia', this));
app.cach.bind('userInfo', new objfn('userChange', this));
app.timer.addTimer(new objfn('updateCaptions', this), 100);
}
function makeInputTimeReader(input)
{
input.setValue = function(seconds)
{
if (seconds < 0)
{
seconds = 0;
}
this.currVal = seconds;
var minutes = Math.floor(seconds/60);
seconds = seconds - (minutes * 60);
seconds = Math.round(seconds*100)/100;
if (seconds < 10)
{
seconds = '0' + seconds.toString();
}else
{
seconds = seconds.toString();
}
this.value = minutes.toString() + ':' + seconds;
}
input.onblur = function()
{
var failure = true;
try
{
var text = this.value;
var colPos = text.indexOf(':');
var seconds;
var minutes;
if (colPos == -1)
{
minutes = 0;
seconds = parseFloat(text);
}else
{
minutes = parseFloat(text.substring(0, colPos));
seconds = parseFloat(text.substring(colPos+1));
}
if (!isNaN(minutes) && !isNaN(seconds))
{
this.setValue(minutes*60 + seconds);
failure = false;
}
}catch(e)
{
}
if (failure)
{
alert("Unable to recognize time format.\nUse minutes:seconds.\nEG. 2:30.5");
this.setValue(this.currVal);
}
if (this.monitorChange != null)
{
this.monitorChange.run(this.currVal);
}
}
}
function initUserMenu(menu_title, menu_cnt)
{
var title = document.createElement('div');
title.appendChild(document.createTextNode('User Menu'));
title.className = 'user_menu_title';
menu_title.appendChild(title);
var login = new loginManager(menu_cnt);
menu_cnt.appendChild(document.createTextNode(' Loading...'));
app.addComponent('loginManager', login);
app.addFunction('loginManager', 'login', new objfn('login', login));
app.addFunction('loginManager', 'logout', new objfn('logout', login));
app.cach.bind('userInfo', new objfn('updateUserInfo', login));
login.repollUserInfo();
}
function loginManager(menu_cnt)
{
this.menu_cnt = menu_cnt;
this.repollUserInfo = function()
{
var rsp = new phpRequest(new objfn('incommingData', app.cach), 'status', 'user_responder', 'app/jsresponder.php');
rsp.run();
}
this.updateUserInfo = function(userInfo)
{
if(userInfo['loggedin'] == '0')
{
this.renderLogin();
}else
{
this.renderLoggedIn();
}
}
this.renderNewAccount = function()
{
clearChildNodes(this.menu_cnt);
var formFields = new Array();
formFields[formFields.length] = {'fieldname':'user', 'nametext':'User Name', 'type':'text'};
formFields[formFields.length] = {'fieldname':'first_name', 'nametext':'First Name', 'type':'text'};
formFields[formFields.length] = {'fieldname':'last_name', 'nametext':'Last Name', 'type':'text'};
formFields[formFields.length] = {'fieldname':'e-mail', 'nametext':'E-Mail', 'type':'text'};
formFields[formFields.length] = {'fieldname':'password', 'nametext':'Password', 'type':'password'};
formFields[formFields.length] = {'fieldname':'re-password', 'nametext':'Pass Again', 'type':'password'};
var mainDiv = document.createElement('div');
mainDiv.className = 'user_menu_text_area';
var text;
var input;
this.newAccountForm = new Array();
for(var i = 0; i < formFields.length; i++)
{
text = document.createElement('div');
text.className = 'user_menu_info_box';
text.appendChild(document.createTextNode(formFields[i]['nametext']+':'));
mainDiv.appendChild(text);
input = document.createElement('input');
this.newAccountForm[formFields[i]['fieldname']] = input;
input.type = formFields[i]['type'];
input.className = 'user_menu_input_box';
mainDiv.appendChild(input);
}
var createAccount = document.createElement('input');
createAccount.className = 'user_menu_input_button';
createAccount.type = 'button';
createAccount.value = 'Create';
createAccount.parent = this;
createAccount.onclick = function()
{
var submitVals = new Array();
for(var i in this.parent.newAccountForm)
{
if (this.parent.newAccountForm[i].type != 'button')
{
submitVals[i] = this.parent.newAccountForm[i].value;
if (this.parent.newAccountForm[i].type == 'password')
{
this.parent.newAccountForm[i].value = '';
}
}
this.parent.newAccountForm[i].disabled = true;
}
var rsp = new phpRequest(new objfn('readAccountCreateResult', this.parent), 'create', 'user_responder', 'app/jsresponder.php');
rsp.run(submitVals);
}
this.newAccountForm['create'] = createAccount;
var cancel = document.createElement('input');
cancel.className = 'user_menu_input_button';
cancel.type = 'button';
cancel.value = 'Cancel';
cancel.parent = this;
cancel.onclick = function()
{
this.parent.renderLogin();
}
this.newAccountForm['cancel'] = cancel;
mainDiv.appendChild(createAccount);
mainDiv.appendChild(cancel);
this.menu_cnt.appendChild(mainDiv);
}
this.readAccountCreateResult = function(result)
{
if (result['success'] == '1')
{
alert(result['message']);
this.renderLogin();
}else
{
var msg = "We were unable to create a new account.\nPlease fix the following errors:";
for(var i = 0; i < result['errors'].length; i++)
{
msg = msg + "\n - " + result['errors'][i];
}
alert(msg);
for(var i in this.newAccountForm)
{
this.newAccountForm[i].disabled = false;
}
}
}
this.renderLoggedIn = function()
{
while (this.menu_cnt.childNodes.length != 0)
{
this.menu_cnt.removeChild(this.menu_cnt.childNodes[0]);
}
var mainDiv = document.createElement('div');
mainDiv.className = 'user_menu_text_area';
var userObj = app.cach.get('userInfo');
mainDiv.appendChild(document.createTextNode('Welcome ' + userObj['name'] + ' to SikhShabads.com! '));
var a = document.createElement('span');
a.className = 'user_menu_anchors';
a.appendChild(document.createTextNode('Log Out'));
a.onclick = function()
{
app.getFunction('loginManager', 'logout').run();
}
mainDiv.appendChild(a);
this.menu_cnt.appendChild(mainDiv);
}
this.renderLogin = function()
{
while (this.menu_cnt.childNodes.length != 0)
{
this.menu_cnt.removeChild(this.menu_cnt.childNodes[0]);
}
var mainDiv = document.createElement('div');
mainDiv.className = 'user_menu_text_area';
var text;
var text = document.createElement('div');
text.className = 'user_menu_info_box';
text.appendChild(document.createTextNode('User:'));
mainDiv.appendChild(text);
var input = document.createElement('input');
this.userBox = input;
input.className = 'user_menu_input_box';
mainDiv.appendChild(input);
var text = document.createElement('div');
text.className = 'user_menu_info_box';
text.appendChild(document.createTextNode('Password:'));
mainDiv.appendChild(text);
var input = document.createElement('input');
this.passwordBox = input;
input.type = 'password';
input.className = 'user_menu_input_box';
mainDiv.appendChild(input);
var submit = document.createElement('input');
this.loginSubmit = submit;
submit.type = 'button';
submit.value = 'Login';
submit.className = 'user_menu_input_button';
submit.onclick = function()
{
app.getFunction('loginManager', 'login').run();
}
this.newAccountSubmit = document.createElement('input');
this.newAccountSubmit.className = 'user_menu_input_button';
this.newAccountSubmit.type = 'button';
this.newAccountSubmit.value = 'New Account';
this.newAccountSubmit.parent = this;
this.newAccountSubmit.onclick = function()
{
this.parent.renderNewAccount();
}
mainDiv.appendChild(submit);
mainDiv.appendChild(this.newAccountSubmit);
this.menu_cnt.appendChild(mainDiv);
}
this.logout = function()
{
var rsp = new phpRequest(new objfn('repollUserInfo', this), 'logout', 'user_responder', 'app/jsresponder.php');
rsp.run();
}
this.login = function()
{
if (this.userBox.value == "")
{
alert('User field is empty!');
return;
}
if (this.passwordBox.value == "")
{
alert('Password field is empty!');
return;
}
var rsp = new phpRequest(new objfn('readLoginResult', this), 'login', 'user_responder', 'app/jsresponder.php');
rsp.run(this.userBox.value, this.passwordBox.value);
this.passwordBox.value = '';
this.userBox.disabled = true;
this.passwordBox.disabled = true;
this.loginSubmit.disabled = true;
}
this.readLoginResult = function(result)
{
if (result['loggedIn'] == '0')
{
alert(result['msg']);
this.userBox.disabled = false;
this.passwordBox.disabled = false;
this.loginSubmit.disabled = false;
return;
}
this.repollUserInfo();
}
}
function flashaudioplayer(playerLocation)
{
while(playerLocation.childNodes.length != 0)
{
playerLocation.removeChild(playerLocation.childNodes[0]);
}
this.flashObjectName = "FlashAudioPlayerIdentifier";
this.soundCompleteCBName = this.flashObjectName + "_complete_cb";
var parent = this;
window[this.soundCompleteCBName] = function()
{
parent.soundCompleteFlashCB();
}
if (isExplorer())
{
playerLocation.innerHTML = '';
}else
{
playerLocation.innerHTML = '