|
|
| Line 1: |
Line 1: |
| __TOC__
| | * [[Server/Code/main.js|main.js]] |
| ==main.js==
| | * [[Server/Code/mainscreen.html|mainscreen.html]] |
| <pre>
| |
| /* kJams Project - main.js
| |
| Description: Main screen functionality.
| |
| (c) 2007 kJams and David M. Cotter */
| |
| | |
| var timer = null;
| |
| var allowBackspace = false;
| |
| var inSearch = {
| |
| on: function() {allowBackspace = true;},
| |
| off: function() {allowBackspace = false;}
| |
| }
| |
| | |
| function m_populatePlaylists() {
| |
| //Remove anything that was already there
| |
| divObj = document.getElementById("playlists");
| |
|
| |
| for (var i = 0; i < divObj.childNodes.length; i++) {
| |
| divObj.removeChild(divObj.childNodes[i]);
| |
| }
| |
|
| |
| list = new KJDropList();
| |
| list.create(divObj);
| |
| playlistsList = list;
| |
|
| |
| getPlaylists(url_playlists, m_playlistsLoaded);
| |
| }
| |
| | |
| function m_playlistsLoaded(list) {
| |
| listCtrl = document.getElementById("playlists").childNodes[0].parent;
| |
|
| |
| for (var i = 0; i < list.length; i++) {
| |
| if ((list[i]['name'] == "Library") || (list[i]['name'] == "History"))
| |
| dropTarget = false;
| |
| else
| |
| dropTarget = true;
| |
|
| |
| listCtrl.addItem("p" + list[i]['id'], list[i]['name'], dropTarget, null, false);
| |
|
| |
| //Library and History items are not rearrangeable
| |
| if ((list[i]['name'] == "Library") || (list[i]['name'] == "History"))
| |
| document.getElementById("p" + list[i]['id']).rearrange = false;
| |
| else
| |
| document.getElementById("p" + list[i]['id']).rearrange = true;
| |
|
| |
| //Keep track of ids for 'Tonight' and 'Favorites'
| |
| if (list[i]['name'] == "Tonight") {
| |
| pTonightID = list[i]['id'];
| |
| }
| |
|
| |
| if (list[i]['name'] == "Favorites") {
| |
| pFavoritesID = list[i]['id'];
| |
| }
| |
|
| |
| //Store the playlist name in the DOM object
| |
| document.getElementById("p" + list[i]['id']).name = list[i]['name'];
| |
| }
| |
|
| |
| listCtrl.color();
| |
| listCtrl.evtClick = m_populateSongs;
| |
| listCtrl.evtDropInto = m_playlistDrop;
| |
| }
| |
| | |
| function m_populateSongs(playlist) {
| |
| playlist = playlist.substring(1);
| |
|
| |
| //Hide
| |
| if (songsList) {
| |
| songsList.hide();
| |
|
| |
| if (songsList.playlist != "1") {
| |
| songsList.destroy();
| |
| }
| |
| }
| |
|
| |
| //Hide "No Playlist" message, show waiting message
| |
| document.getElementById("message").style.display = 'none';
| |
| document.getElementById("msg_dosearch").style.display = 'none';
| |
| document.getElementById("msg_error").style.display = 'none';
| |
| document.getElementById("waiting").style.display = '';
| |
|
| |
| //If the list is already loaded, simply display it
| |
| if ((playlist == "1") && (songsLists[playlist] != undefined)) {
| |
| songsList = songsLists[playlist];
| |
| songsList.show();
| |
| document.getElementById("waiting").style.display = 'none';
| |
| }
| |
|
| |
| //If it's the library, request that user do a search first
| |
| else if (playlist == "1") {
| |
| document.getElementById("waiting").style.display = 'none';
| |
| document.getElementById("msg_dosearch").style.display = '';
| |
| }
| |
|
| |
| else {
| |
| //Playlist DOM object
| |
| playlistObj = document.getElementById("p" + playlist);
| |
|
| |
| //Which columns are needed?
| |
| var columns = Array("#", "Song Name", "Artist", "Album");
| |
|
| |
| if (playlistObj.name == "Tonight") {
| |
| columns.push("Pitch");
| |
| columns.push("Add to");
| |
| }
| |
|
| |
| else if (playlistObj.name == "Favorites") {
| |
| columns.push("Add to");
| |
| }
| |
|
| |
| else {
| |
| columns.push("Add to");
| |
| columns.push("Add to");
| |
| }
| |
|
| |
| songsList = new KJList();
| |
| songsList.rearrange = playlistObj.rearrange;
| |
| songsList.playlist = playlist;
| |
| songsList.playlistName = playlistObj.name;
| |
| songsList.create(document.getElementById("songs"));
| |
| songsList.setColumns(columns, 0);
| |
| songsList.evtDrop = m_songRearrange;
| |
| songsLists[playlist] = songsList;
| |
| getSongs(url_songs, m_songsLoaded, "playlist=" + playlist);
| |
|
| |
| if (false) {
| |
| songsList.evtColClick = null;
| |
| }
| |
| else {
| |
| songsList.evtColClick = m_sortSongs;
| |
| }
| |
| }
| |
|
| |
| m_sessionCheckin();
| |
| }
| |
| | |
| function m_songsLoaded(list) {
| |
| //Hide waiting message
| |
| document.getElementById("waiting").style.display = 'none';
| |
|
| |
| //Rearrangeable?
| |
| if (songsList.rearrange)
| |
| var rearrange = true;
| |
| else
| |
| var rearrange = false;
| |
|
| |
| for (var i = 0; i < list.length; i++) {
| |
| //Add to favorites
| |
| var favsButton = document.createElement("INPUT");
| |
| favsButton.type = "button"
| |
| favsButton.name = songsList.playlist + "-" + list[i]['itemId'];
| |
| favsButton.songId = list[i]['id'];
| |
| favsButton.value = "Favorites";
| |
| favsButton.onmousedown = m_addToFavorites;
| |
|
| |
| //Add to Tonight
| |
| var tonightButton = document.createElement("INPUT");
| |
| tonightButton.type = "button";
| |
| tonightButton.name = songsList.playlist + "-" + list[i]['itemId'];
| |
| tonightButton.songId = list[i]['id'];
| |
| tonightButton.value = "Tonight";
| |
| tonightButton.onmousedown = m_addToTonight;
| |
|
| |
| //Columns
| |
| var columns = Array(i, list[i]['name'], list[i]['artist']);
| |
|
| |
| if (typeof(list[i]['album']) == "object") {
| |
| var dropDown = document.createElement("SELECT");
| |
| dropDown.name = list[i]['id'];
| |
|
| |
| for (var j = 0; j < list[i]['album']['items'].length; j++) {
| |
| var optionObj = document.createElement("OPTION");
| |
| optionObj.value = list[i]['album']['items'][j];
| |
| optionObj.innerHTML = optionObj.value;
| |
|
| |
| if (list[i]['album']['default'] == j) {
| |
| optionObj.selected = true;
| |
| }
| |
|
| |
| dropDown.appendChild(optionObj);
| |
| }
| |
|
| |
| columns.push(dropDown);
| |
| }
| |
|
| |
| else {
| |
| columns.push(list[i]['album']);
| |
| }
| |
|
| |
| if (songsList.playlistName == "Tonight") {
| |
| //Drop-down
| |
| var options = {"+6" : 6, "+5" : 5, "+4" : 4, "+3" : 3, "+2" : 2, "+1" : 1, "0" : 0, "-1" : -1, "-2" : -2, "-3" : -3, "-4" : -4, "-5" : -5, "-6" : -6}
| |
| var dropDown = document.createElement("SELECT");
| |
| dropDown.name = list[i]['itemId'];
| |
| dropDown.songId = list[i]['id'];
| |
| dropDown.onchange = m_changePitch;
| |
| for (option in options) {
| |
| var optionObj = document.createElement("OPTION");
| |
| optionObj.value = options[option];
| |
| optionObj.innerHTML = option;
| |
|
| |
| if(list[i]['pitch'] == options[option]) {
| |
| optionObj.selected = true;
| |
| }
| |
|
| |
| dropDown.appendChild(optionObj);
| |
| }
| |
|
| |
| columns.push(dropDown);
| |
| columns.push(favsButton);
| |
| }
| |
|
| |
| else if (songsList.playlistName == "Favorites") {
| |
| columns.push(tonightButton);
| |
| }
| |
|
| |
| else {
| |
| columns.push(tonightButton);
| |
| columns.push(favsButton);
| |
| }
| |
|
| |
| index = songsList.addItem(songsList.playlist + "-" + list[i]['itemId'], columns, rearrange, null, false);
| |
|
| |
| document.getElementById(songsList.getByIndex(index)).songName = list[i]['name'];
| |
| document.getElementById(songsList.getByIndex(index)).songId = list[i]['id'];
| |
| document.getElementById(songsList.getByIndex(index)).piIx = list[i]['itemId'];
| |
| }
| |
|
| |
| songsList.color();
| |
|
| |
| if (songsList.playlistName != "Tonight" && songsList.playlistName != "History") {
| |
| songsList.evtColClick = m_sortSongs;
| |
| }
| |
| else {
| |
| songsList.evtColClick = null;
| |
| }
| |
| }
| |
| | |
| function m_songRearrange(list, song, index, oldIndex) {
| |
| sendData(url_rearrange, "playlist=" + list.playlist + "&index=" + index + "&oldIndex=" + oldIndex);
| |
| m_sessionCheckin();
| |
| }
| |
| | |
| function m_playlistDrop(song, index, nodeId) {
| |
| playlists = document.getElementById("playlists").childNodes[0].parent;
| |
| item = songsList.getByID(song);
| |
|
| |
| if (songsLists[playlists.getByIndex(index).substring(1)]) { songsLists[playlists.getByIndex(index).substring(1)].destroy(); }
| |
| songsLists[playlists.getByIndex(index).substring(1)] = null;
| |
| sendData(url_drop, "playlist=" + playlists.getByIndex(index).substring(1) + "&song=" + songsList.getByID(song).songId);
| |
|
| |
| m_setStatus("Added \"" + item.songName + "\" to \"" + m_getPlaylistName(playlists.getByIndex(index)) + "\" ...");
| |
| m_sessionCheckin();
| |
| }
| |
| | |
| function m_addToTonight(event) {
| |
| playlists = document.getElementById("playlists").childNodes[0].parent;
| |
| m_playlistDrop(event.target.name, playlists.getIndex("p" + pTonightID), event.target.name);
| |
| }
| |
| | |
| function m_addToFavorites(event) {
| |
| playlists = document.getElementById("playlists").childNodes[0].parent
| |
| m_playlistDrop(event.target.name, playlists.getIndex("p" + pFavoritesID), event.target.name);
| |
| }
| |
| | |
| function m_sortSongs(list, column) {
| |
| list.removeAll();
| |
| list.setPrimaryCol(column);
| |
| document.getElementById("waiting").style.display = '';
| |
|
| |
| if (document.getElementById("searchfield").value) {
| |
| search = "&search=" + document.getElementById("searchfield").value;
| |
| }
| |
|
| |
| getSongs(url_sort, m_songsLoaded, "playlist=" + list.playlist + "&orderby=" + column + search);
| |
| m_sessionCheckin();
| |
| }
| |
| | |
| function m_changePitch(event) {
| |
| sendData(url_pitch, "song=" + event.target.songId + "&pitch=" + event.target.value);
| |
| m_sessionCheckin();
| |
| }
| |
| | |
| function m_doSearch() {
| |
| //Remove old search list if it's there
| |
| if (songsLists["1"]) {
| |
| songsLists["1"].parentObj.removeChild(songsLists["1"].container);
| |
| songsLists["1"].parentObj.removeChild(songsLists["1"].columnsObj);
| |
| }
| |
|
| |
| //Hide currently loaded list
| |
| if (songsList) {
| |
| songsList.hide();
| |
| }
| |
|
| |
| document.getElementById("msg_dosearch").style.display = 'none';
| |
| document.getElementById("message").style.display = 'none';
| |
| document.getElementById("msg_error").style.display = 'none';
| |
| document.getElementById("waiting").style.display = '';
| |
| | |
| var columns = Array("#", "Song Name", "Artist", "Album", "Add to", "Add to");
| |
|
| |
| songsList = new KJList();
| |
| songsList.rearrange = false;
| |
| songsList.playlist = "1";
| |
| songsList.playlistName = "Library";
| |
| songsList.create(document.getElementById("songs"));
| |
| songsList.setColumns(columns, 1);
| |
| songsLists["1"] = songsList;
| |
|
| |
| getSongs(url_search, m_songsLoaded, "search=" + document.getElementById("searchfield").value);
| |
| m_sessionCheckin();
| |
| }
| |
| | |
| function searchKeyPressed(event) {
| |
| if (event.keyCode == 13) {
| |
| m_doSearch();
| |
| }
| |
| }
| |
| | |
| function m_getSongName(id) {
| |
| songObj = document.getElementById(id);
| |
| return songObj.songName;
| |
| }
| |
| | |
| function m_getPlaylistName(id) {
| |
| playlistObj = document.getElementById(id);
| |
| return playlistObj.name;
| |
| }
| |
| | |
| function kj_data_error(id, desc) {
| |
| songsLists[songsList.id] = null;
| |
| songsList.hide();
| |
| document.getElementById("waiting").style.display = 'none';
| |
|
| |
| document.getElementById("msg_error").innerHTML = "Error: " + desc
| |
| document.getElementById("msg_error").style.display = '';
| |
| }
| |
| | |
| function m_setStatus(status, revert) {
| |
| statusObj = document.getElementById("status");
| |
| statusObj.innerHTML = status;
| |
| }
| |
| function trapDelete() {
| |
| var keyID = (window.event) ? event.keyCode : e.keyCode;
| |
| if (keyID==8 && !allowBackspace){
| |
| return false;
| |
| }
| |
| return true;
| |
| }
| |
| function m_keyPressed(event) {
| |
| //This is not IE-compliant code.
| |
| if (event.keyCode == 46 || event.keyCode ==8) {
| |
| if (!songsList.selection) {
| |
| return;
| |
| }
| |
|
| |
| playlistName = songsList.playlistName;
| |
| | |
| if (playlistName != "Library" && playlistName != "History") {
| |
| selection = songsList.selection;
| |
| item = songsList.getByID(selection);
| |
|
| |
| songsList.select(null);
| |
| sendData(url_remove, "playlist=" + songsList.playlist + "&piIx=" + item.piIx);
| |
| m_setStatus("Removed \"" + item.songName + "\" ...");
| |
| songsList.removeItem(selection);
| |
| }
| |
| }
| |
| }
| |
| | |
| function m_sessionCheckin() {
| |
| /* A true or false value is set by the server before delivering this script
| |
| depending on preference.
| |
| if (!{auto_logout}) {
| |
| return;
| |
| }
| |
|
| |
| if (timer == null) {
| |
| timer = setInterval("m_sessionLogout()", {timeout} * 1000);
| |
| }
| |
| else {
| |
| clearInterval(timer);
| |
| timer = null;
| |
| return m_sessionCheckin();
| |
| }
| |
| */
| |
| }
| |
| | |
| function m_sessionLogout() {
| |
| // window.location=url_login;
| |
| }
| |
| </pre>
| |
| ==mainscreen.html==
| |
| <pre>
| |
| <html>
| |
| <head>
| |
| <title>kJams Server</title>
| |
|
| |
| <script src="spry/xpath.js"></script>
| |
| <script src="spry/SpryData.js"></script>
| |
| <script src="ui.js"></script>
| |
| <script src="data.js"></script>
| |
| <script src="main.js"></script>
| |
| <script src="common.js"></script>
| |
|
| |
| <style type="text/css">
| |
| #main {
| |
| padding: 10px;
| |
| margin-right: 20px;
| |
| margin-left: 20px;
| |
| border-style: solid;
| |
| border-color: #000000;
| |
| border-width: 1px;
| |
| background: url('metal.jpg');
| |
| cursor: default;
| |
| }
| |
|
| |
| #title {
| |
| padding-right: 30px;
| |
| text-align: left;
| |
| font-family: Arial Black;
| |
| font-size: 24pt;
| |
| font-weight: bold;
| |
| margin-bottom: 5px;
| |
| }
| |
|
| |
| #search {
| |
| width: 100%;
| |
| text-align: center;
| |
| }
| |
|
| |
| #searchfield {
| |
| height: 21px;
| |
| width: 144px;
| |
| background: url('search.png');
| |
| border-width: 0px;
| |
| padding-left: 7px;
| |
| padding-right: 7px;
| |
| padding-top: 2px;
| |
| }
| |
|
| |
| #left {
| |
| float: left;
| |
| width: 200px;
| |
| margin: 0px;
| |
| margin-left: 0px;
| |
| }
| |
|
| |
| #status {
| |
| text-align: center;
| |
| color: #333333;
| |
| padding: 0px;
| |
| margin: 0px;
| |
| }
| |
|
| |
| #playlists .KJList {
| |
| overflow: auto;
| |
| height: 240px;
| |
| padding: 0px;
| |
| background-color: #FFFFFF;
| |
| border-style: solid;
| |
| border-color: #999999;
| |
| border-width: 1px;
| |
| padding: 0px;
| |
| }
| |
|
| |
| #playlists .KJList td {
| |
| padding: 0px;
| |
| margin: 0px;
| |
| }
| |
|
| |
| #playlists .KJList table {
| |
| margin: 0px;
| |
| padding: 0px;
| |
| }
| |
|
| |
| #photo {
| |
| padding: 3px;
| |
| width: 190px;
| |
| height: 143px;
| |
| max-height: 150px;
| |
| overflow: hidden;
| |
| margin-top: 5px;
| |
| background-color: #FFFFFF;
| |
| border-style: solid;
| |
| border-color: #999999;
| |
| border-width: 1px;
| |
| }
| |
|
| |
| #songs {
| |
| /*position: relative;
| |
| z-index: 1;*/
| |
| border-style: solid/
| |
| border-color: #999999;
| |
| border-width: 1px;
| |
| margin-left: 220px;
| |
| background-color: #FFFFFF;
| |
| min-height: 400px;
| |
| background-image:url(/media/Images/kjams.jpg);
| |
| background-repeat: no-repeat;
| |
| background-position: center;
| |
| /*filter: alpha (opacity=50);
| |
| -moz-opacity:0.5;
| |
| opacity: 0.5;*/
| |
|
| |
| }
| |
| #songsbackground{
| |
| positon: absolute;
| |
| z-index: 10;
| |
| min-height: 400px;
| |
| background-image:url(kjams.jpg);
| |
| background-repeat: no-repeat;
| |
| background-position: center;
| |
| filter: alpha (opacity=50);/*for those yet to get with the program*/
| |
| -moz-opacity:0.5;
| |
| opacity: 0.5;
| |
| }
| |
|
| |
| #message, #waiting, #msg_dosearch, #msg_error {
| |
| /*position: relative;
| |
| z-index: 11
| |
| top: 0;
| |
| left: 0;*/
| |
| text-align: center;
| |
| font-size: 14pt;
| |
| }
| |
|
| |
| #songs .KJList {
| |
| padding: 0px;
| |
| height: 400px;
| |
| overflow: auto;
| |
| <!background-color: #FFFFFF;>
| |
| }
| |
|
| |
| .KJListColumn {
| |
| padding: 0px;
| |
| margin: 0px;
| |
| background: url('column-bg.jpg');
| |
| cursor: default;
| |
| }
| |
|
| |
| .KJListColumn td {
| |
| border-style: solid;
| |
| border-color: #999999;
| |
| border-width: 0px;
| |
| border-right-width: 1px;
| |
| }
| |
|
| |
| .KJListColumn .primary {
| |
| background: url('column-selected-bg.jpg');
| |
| }
| |
|
| |
| .KJListItem, .KJListItem_alt, .KJListItem_selected, .KJListItem_drag, .KJListItem_target, .KJListItem_alt_target {
| |
| padding: 0px;
| |
| padding-top: 0px;
| |
| padding-bottom: 0px;
| |
| margin: 0px;
| |
| cursor: default;
| |
| border-style: solid;
| |
| border-color: #FFFFFF;
| |
| border-width: 0px;
| |
| border-bottom-width: 1px;
| |
| }
| |
|
| |
| .KJListItem_alt {
| |
| background-color: #EEEEFF;
| |
| opacity: 0.7;
| |
| }
| |
|
| |
| .KJListItem_selected {
| |
| background-color: #4444FF;
| |
| color: #FFFFFF;
| |
| }
| |
|
| |
| .KJListItem_target, .KJListItem_alt_target {
| |
| border-style: solid;
| |
| border-color: #000000;
| |
| border-width: 0px;
| |
| border-top-width: 1px;
| |
| }
| |
|
| |
| .KJListItem_alt_target {
| |
| background-color: #EEEEFF;
| |
| }
| |
|
| |
| .KJListItem_drag {
| |
| position: absolute;
| |
| border-style: solid;
| |
| border-color: #000000;
| |
| border-width: 1px;
| |
| background-color: #DDDDDD;
| |
| filter:alpha(opacity=40); /* for IE */
| |
| -moz-opacity:0.4;
| |
| opacity: 0.4;
| |
| }
| |
|
| |
| .KJList input {
| |
| padding: 0px;
| |
| margin: 0px;
| |
| border-style: solid;
| |
| border-color: #000000;
| |
| border-width: 1px;
| |
| }
| |
|
| |
| .KJList input:active {
| |
| background-color: #000000;
| |
| color: #FFFFFF;
| |
| }
| |
|
| |
| #playlists .KJListItem, #playlists .KJListItem_alt, #playlists .KJListItem_selected, #playlists .KJListItem_target, #playlists .KJListItem_alt_target {
| |
| background: url('playlist-icon.gif');
| |
| background-repeat: no-repeat;
| |
| padding: 0px;
| |
| padding-left: 20px;
| |
| border-style: solid;
| |
| border-color: #FFFFFF;
| |
| border-width: 3px;
| |
| }
| |
|
| |
|
| |
| #playlists .KJListItem_alt {
| |
| background-color: #EEEEFF;
| |
| }
| |
|
| |
| #playlists .KJListItem_selected {
| |
| background-color: #4444FF;
| |
| color: #FFFFFF;
| |
| }
| |
|
| |
| #playlists .KJListItem_target, #playlists .KJListItem_alt_target {
| |
| border-color: #000000;
| |
| background-color: #9999FF;
| |
| }
| |
| | |
| .clear {
| |
| clear: both;
| |
| }
| |
| </style>
| |
| </head>
| |
|
| |
| <body>
| |
| <div id="main">
| |
| <table><tr><td id="title"><nobr>{singer}</nobr></td><td id="search"><nobr>Search Library: <input type="search" id="searchfield" name="search" onkeypress=searchKeyPressed(event) onblur="inSearch.off()" onfocus="inSearch.on()" /> <input type="submit" style="" name="dosearch" value="Go" onclick=m_doSearch() /></nobr></td><td id="help"><nobr>[ <a id="helplink" href="">Help</a> ] [ <a id="logoutlink" href="">Logout</a> ]</nobr></td></tr></table>
| |
| <div>
| |
| <div id="left">
| |
| <div id="playlists"></div>
| |
| <div id="photo"><img src="kjams-main.jpg"></div>
| |
| </div>
| |
| <div id="songs"><p id="msg_error"></p><p id="msg_dosearch">Please enter a search.</p><p id="message">No Playlist Selected.</p><p id="waiting">Please wait, loading playlist...</p></div>
| |
| <div class="clear"> </div>
| |
| <div id="status">Welcome to kJams!</div>
| |
| </div>
| |
| </div>
| |
|
| |
| <script language="javascript">
| |
| //Bind key press function
| |
| document.onkeyup = m_keyPressed;
| |
| //Prevent browser from seeing the Delete key press
| |
| document.onkeydown=trapDelete;
| |
|
| |
| //Hide message fields
| |
| document.getElementById("waiting").style.display = 'none';
| |
| document.getElementById("msg_dosearch").style.display = 'none';
| |
| document.getElementById("msg_error").style.display = 'none';
| |
|
| |
| //Plug in help and logout URLs
| |
| document.getElementById("helplink").href = url_help;
| |
| document.getElementById("logoutlink").href = url_login;
| |
|
| |
| //Playlists
| |
| m_populatePlaylists();
| |
|
| |
| if (0) {
| |
| //Song list
| |
| var songs = new KJList();
| |
| songs.create(document.getElementById("songs"));
| |
| songs.setColumns(Array("#", "Song Name", "Artist", "Pitch", "Add to", "Add to"), 1);
| |
|
| |
| //Set clipping
| |
| songs.setClipping({'right' : songs.getColumnWidth(5) + songs.getColumnWidth(4) + songs.getColumnWidth(3)});
| |
|
| |
| getSongs(url_songs, populateList, 'playlist=1');
| |
|
| |
| function populateList(songList) {
| |
| for(var i = 0; i < songList.length; i++) {
| |
| songs.addItem(songList[i]['number'], Array(songList[i]['number'], songList[i]['name'], songList[i]['artist'], "<select><option>+6</option><option>+5</option><option>+4</option><option>+3</option><option>+2</option><option>+1</option><option selected>0</option><option>-1</option><option>-2</option><option>-3</option><option>-4</option><option>-5</option></select>", "<input type=\"submit\" value=\"Tonight\" />", "<input type=\"submit\" value=\"Favorites\" />"), null, null, false);
| |
| }
| |
|
| |
| songs.color();
| |
| }
| |
| }
| |
| </script>
| |
| </body>
| |
| </html>
| |
| </pre>
| |