dj_manage_albums.html

{% extends "base.html" %}

{% block extra_scripts %}
<script type='text/javascript'>
    var newalbumlookup = "";
    var oldalbumlookup = "";
    var newalbumtimeout = null;
    var oldalbumtimeout = null;
    $(function() {
	$('#manual-album-form').submit(addManualAlbum);
        $("#album-lookup").keyup(function(e) {
            if ($("#album-lookup").val() == "") {
                $("#add-album-update").hide("slow");
            } else if ($("#album-lookup").val() != newalbumlookup || e.keyCode == 13) {
                clearTimeout(newalbumtimeout);
                newalbumlookup = $("#album-lookup").val();
                newalbumtimeout = setTimeout("amazonlookup(\"" + newalbumlookup + "\")", 300);
            }
        });
    });

    
    function amazonlookup(keywords) {
        $.get('/ajax/albuminfo',
        {
            'keywords': keywords,
        },
        function(data) {
            $("#add-album-update").hide("fast", function() {
                $("#add-album-update").html(data.updatehtml);
                $("#add-album-list li").click(addAmazonAlbum);
            });
            $("#add-album-update").show("slow");
        });
    };
    
    function addAmazonAlbum() {
        $(this).addClass("album-processing")
        $.post("/dj/albums", 
        {
            'asin': $(this).attr("id"),
            'action': "add",
        },
        function(data) {
            if (data.err) {
                this.removeClass("album-processing");
                alert(data.err);
            } else {
                $("#add-album-update").hide("slow");
                $("#msgbox").html(data.msg);
            }
        });
    }

    function addManualAlbum() {
        $(this).addClass("album-processing");
	$.post("/dj/albums",
	       {
		   'ajax': 1,
		   'action': 'manual',
		   'title': $("#manual-title").val(),
		   'artist': $("#manual-artist").val(),
		   'cover_url': $("#manual-url").val(),
		   'track-list': $("#manual-track-list").val(),
	       },
	       function(data) {
		   if (parseInt(data.result) != 0) {
		       $("#manual-album-form").removeClass("album-processing");
		       $("#msgbox").html(data.msg);
		   } else {
		       $("#manual-album-form").removeClass("album-processing");
		       $("#msgbox").html(data.msg);
		       $("#manual-album-form").clearForm();
		       $("#manual-cover-preview-image").attr("src", '/static/images/noalbumart.png');
		   }
	       });
	return false;
    }

    
    function toggleNew() {
        var checkbox = this.getElementsByTagName("input");
        var li = $(this);
        if (li.hasClass("newalbum")) {
            li.removeClass("newalbum").addClass("workingalbum");
            $.post("/dj/albums/", { 'action': "makeOld", 'key': li.attr("id") },
                function(data) {
                    li.removeClass("workingalbum").addClass("oldalbum");
                    $(checkbox).attr("checked", false);
                    $("#msgbox").html(data.msg);
                }
            );
        } else if (li.hasClass("oldalbum")) {
            li.removeClass("oldalbum").addClass("workingalbum");
            $.post("/dj/albums/", { 'action': "makeNew", 'key': li.attr("id") },
                function(data) {
                    li.removeClass("workingalbum").addClass("newalbum");                
                    $(checkbox).attr("checked", true);
                    $("#msgbox").html(data.msg);
                }
            );
        }        
    }
    
    $(function() {
        $("#manage-albums-list li").click(toggleNew);
        $("#manual-url").change(function() {
            $("#manual-cover-preview-image").attr("src", $(this).val());
        });
    });
    
</script>
{% endblock %}

{% block left_column %}
    <div id='add-album'>
        <h4>Add Album from Amazon</h4>
        <label>Keywords: <input type='text' id='album-lookup' /></label>
        <div id='add-album-update'></div>
    </div>
    <div id='new-albums'>
        <h4>On the New Shelf</h4>
        {% if new_album_html %}
        {{ new_album_html|safe }}
        {% else %}
        {% include "dj_manage_new_albums_list.html"}
        {% endif %}
    </div>
{% endblock %}


{% block right_column %}
    <div>
        <a href='/dj/'>Return to main index</a>
    </div>
    <div id='add-album-manual'>
        <h4>Add Album Manually</h4>
        <form id='manual-album-form' action='/dj/albums' method='post'>
            <input type='hidden' name='action' value='manual'>
            <table class='balancedtable'>
                <tr>
                    <td><label for='manual-title'>Title: </label></td>
                    <td><input type='text' name='title' id='manual-title' /></td>
                </tr>
                <tr>
                    <td><label for='manual-artist'>Artist: </label></td>
                    <td><input type='text' class='artist-autocomplete' name='artist' id='manual-artist'></td>
                </tr>
                <tr>
                    <td><label for='manual-url'>URL to artwork: </label></td>
                    <td><input type='text' name='cover_url' id='manual-url' value='/static/images/noalbumart.png'></td>
                </tr>
            </table>
            <div id='manual-cover-preview'><img src='/static/images/noalbumart.png' id='manual-cover-preview-image' /></div>
            <h5>Track List</h5>
	    <textarea id='manual-track-list' name='track-list' style="width:100%; height: 120pt"></textarea>
            <input id='manual-album-submit' type='submit' name='submit' value='Add'>
        </form>
    </div>
{% endblock %}