headphones/data/interfaces/default/index.html

<%inherit file="base.html"/>
<%!
	from headphones import helpers
%>

<%def name="body()">
	<table class="display" id="artist_table">
		<thead>
			<tr>
				<th id="albumart"></th>
				<th id="name">Artist Name</th>
				<th id="status">Status</th>
				<th id="album">Latest Release</th>
				<th id="have">Have</th>
			</tr>
		</thead>
		<tbody>
		</tbody>
	</table>
</%def>

<%def name="headIncludes()">
	<link rel="stylesheet" href="interfaces/default/css/data_table.css">
</%def>

<%def name="javascriptIncludes()">
    <script src="js/libs/jquery.unveil.min.js"></script>
	<script src="js/libs/jquery.dataTables.min.js"></script>
	<script>
    	function initThisPage() {
    		$('#artist_table').dataTable({
    			"bDestroy": true,
    			"aoColumnDefs": [
                    {
                        "bSortable": false,
                        "aTargets": [0],
                        "mData":"ArtistID",
                        "mRender": function ( data, type, full ) {
                            return '<div id="artistImg"><img class="albumArt" height="50" width="50" alt="" id="'+ data + '" data-src="artwork/thumbs/artist/' + data + '"/></div>';
                        }
                    },
                    {
                       "aTargets":[1],
                       "mDataProp":"ArtistSortName",
                       "mRender":function (data,type,full) {
                            return '<span title="' + full['ArtistID'] + '"></span><a href="artistPage?ArtistID=' + full['ArtistID'] + '">' + full['ArtistName'] + '</a>'
                        }
                    },
                    {
                        "aTargets":[2],"mDataProp":"Status"
                    },
                    {
                       "aTargets":[3],
                       "mDataProp":"LatestAlbum",
                       "mRender":function(data,type,full){
                            artist = full;
                            if (artist['ReleaseDate']  && artist['LatestAlbum'])
                            {
                                releasedate = artist['ReleaseDate'];
                                albumdisplay = '<i>' + artist['LatestAlbum'] + '</i> (' + artist['ReleaseDate'] + ')';
                            }
                            else if(artist['LatestAlbum'])
                            {
                                releasedate = '';
                                albumdisplay = '<i>' + artist['LatestAlbum'] + '</i>';
                            }
                            else
                            {
                                releasedate = '';
                                albumdisplay = '<i>None</i>';
                            }
                            if (artist['ReleaseInFuture'] === 'True')
                            {
                                grade = 'gradeA';
                            }
                            else
                            {
                                grade = 'gradeZ';
                            }
                            artist['Grade'] = grade;
                            return '<span title="' + releasedate + '"></span><a href="albumPage?AlbumID=' + full['AlbumID'] + '">' + albumdisplay + '</a>'
                        }
                   },
                   {
                       "aTargets":[4],
                       "mDataProp":"HaveTracks",
                       "mRender":function(data,type,full){
                            if(full['TotalTracks'] > 0)
                            {
                                percent = (full['HaveTracks']*100.0)/full['TotalTracks']
                                if(percent > 100){
                                    percent = 100;
                                }
                            }
                            else
                            {
                                full['TotalTracks'] = '?';
                                percent = 0;
                            }

                            return '<span title="' + percent + '"></span><div class="progress-container"><div style="width:' + percent + '%"><div class="havetracks">' + full['HaveTracks'] + '/' + full['TotalTracks'] + '</div></div></div>';
                        }
                    },
                ],
    			"oLanguage": {
    				"sSearch": "",
                    "sLengthMenu":"Show _MENU_ artists per page",
    				"sInfo":"Showing _START_ to _END_ of _TOTAL_ artists",
    				"sInfoEmpty":"Showing 0 to 0 of 0 artists",
    				"sInfoFiltered":"(filtered from _MAX_ total artists)",
    				"sEmptyTable": " ",
                },
    			"bStateSave": true,
    			"iDisplayLength": 50,
    			"sPaginationType": "full_numbers",
                "bProcessing": true,
                "bServerSide": true,
                "sAjaxSource": 'getArtists.json',
                "fnRowCallback": function(nRow, aData, iDisplayIndex, iDisplayIndexFull) {
                    $('td', nRow).closest('tr').addClass(aData['Grade'])
                    nRow.children[0].id = 'albumart';
                    nRow.children[1].id = 'name';
                    nRow.children[2].id = 'status'
                    nRow.children[3].id = 'album'
                    nRow.children[4].id = 'have'
                    return nRow;
                },
                "fnServerData": function ( sSource, aoData, fnCallback ) {
                    /* Add some extra data to the sender */
                    $.getJSON( sSource, aoData, function (json) {    fnCallback(json)                }  )
                    },
                "fnInitComplete": function(oSettings, json)
                {
                },
                "fnDrawCallback": function (o) {
                    // Jump to top of page
                    $('html,body').scrollTop(0);
                }
            });
            $('#artist_table').on("draw.dt", function () {
                $("img").unveil();
            });

    		resetFilters("artist or album");
    	}

    	$(document).ready(function() {
    		initThisPage();
    	});
    	$(window).load(function(){
    		initFancybox();
    		refreshLoadArtist();
    	});
	</script>
</%def>