94 lines
2.4 KiB
JavaScript
94 lines
2.4 KiB
JavaScript
(function(context,$) {
|
|
|
|
"use strict";
|
|
context.JK = context.JK || {};
|
|
context.JK.GenreSelectorDialog = function(app, type, genres, callback) {
|
|
var logger = context.JK.logger;
|
|
var rest = context.JK.Rest();
|
|
var $dialog = null;
|
|
var dialogId = 'genre-selector-dialog';
|
|
var $screen = $('#' + dialogId);
|
|
var $btnSelect = $screen.find(".btn-select-genres");
|
|
var $instructions = $screen.find('#instructions');
|
|
var $genres = $screen.find('.genres');
|
|
var GENRES_PER_COLUMN = 12;
|
|
|
|
function beforeShow(data) {
|
|
}
|
|
|
|
function afterShow(data) {
|
|
var genreList = context.JK.genres;
|
|
|
|
$genres.empty();
|
|
|
|
if (genreList) {
|
|
var columns = genreList.length / GENRES_PER_COLUMN;
|
|
columns = Math.floor((genreList.length % GENRES_PER_COLUMN) === 0 ? columns : columns + 1);
|
|
|
|
var columnWidthPct = 100/columns;
|
|
|
|
$.each(genreList, function(index, val) {
|
|
if (index === 0 || index % GENRES_PER_COLUMN === 0) {
|
|
$genres.append('<div class="left" style="width:"' + columnWidthPct + '%;"><table>');
|
|
}
|
|
|
|
$genres.append('<tr>');
|
|
var checked = '';
|
|
if (genres && $.inArray(val.id, genres) > -1) {
|
|
checked = 'checked';
|
|
}
|
|
|
|
$genres.append('<td><input type="checkbox" value="' + val.id + '" ' + checked + ' />' + val.description + '</td>');
|
|
$genres.append('</tr>');
|
|
|
|
if (index === genreList.length-1 || (index+1) % GENRES_PER_COLUMN === 0) {
|
|
$genres.append('</table></div>')
|
|
}
|
|
});
|
|
}
|
|
}
|
|
|
|
function afterHide() {
|
|
}
|
|
|
|
function showDialog() {
|
|
return app.layout.showDialog(dialogId);
|
|
}
|
|
|
|
function events() {
|
|
$btnSelect.click(function(evt) {
|
|
|
|
var selectedGenres = [];
|
|
$genres.find('input[type=checkbox]:checked').each(function(index) {
|
|
selectedGenres.push($(this).val());
|
|
});
|
|
|
|
if (callback) {
|
|
callback(selectedGenres);
|
|
}
|
|
|
|
app.layout.closeDialog(dialogId);
|
|
|
|
});
|
|
}
|
|
|
|
function initialize() {
|
|
var dialogBindings = {
|
|
'beforeShow' : beforeShow,
|
|
'afterShow' : afterShow,
|
|
'afterHide': afterHide
|
|
};
|
|
|
|
app.bindDialog(dialogId, dialogBindings);
|
|
|
|
$instructions.html('Select one or more genres for ' + type + ':');
|
|
|
|
events();
|
|
}
|
|
|
|
this.initialize = initialize;
|
|
this.showDialog = showDialog;
|
|
}
|
|
|
|
return this;
|
|
})(window,jQuery); |