var MyPhotos = (function() {
    'use strict';

    var self = {};

    init();
    function init() {
        bindEvents();
    }


    /**
     *  Binds necessary event handlers.
     */
    function bindEvents() {
        $('.js-select-files').on('click', function(e) {
            $('#select-files').trigger('click');
        });

        $('.js-edit-album').on('click', toggleEditMode);
        $('body').on('click', '.js-photo.is-selectable', function(e) {
            e.preventDefault();
        });
        $('body').on('click', '.js-album-delete', deletePhotos);
    }


    /**
     *  Show/Hide editing controls
     */
    function toggleEditMode(e) {
        var normalControls = $('.js-album-normal-controls');
        var editControls = $('.js-album-edit-controls');
        var photos = $('.js-photo');

        if (editControls.is(':visible')) {
            editControls.hide();
            normalControls.show();
            photos.removeClass('is-selectable');
        }
        else {
            editControls.show();
            normalControls.hide();
            photos.addClass('is-selectable');
        }

        return false;
    }


    /**
     *  Removes the photos from the DOM.
     *  Possible AJAX call could go here.
     */
    function deletePhotos(e) {
        var selectedPhotos = $('.js-photo-select:checked');

        selectedPhotos.closest('.grid__item').fadeOut(100, function() {
            $(this).remove();
        });
    }


    return self;
})();