2016-02-12 23:52:43 +08:00
|
|
|
// Place all the behaviors and hooks related to the matching controller here.
|
|
|
|
// All this logic will automatically be available in application.js.
|
|
|
|
|
|
|
|
// TODO
|
|
|
|
// - error handling of assigning user to project, check XHR data.errors
|
|
|
|
// - error handling of removing user from project, check XHR data.errors
|
|
|
|
// - refresh project users tab after manage user modal is closed
|
|
|
|
// - refactor view handling using library, ex. backbone.js
|
|
|
|
|
2018-09-27 16:43:44 +08:00
|
|
|
/* global Comments CounterBadge animateSpinner initFormSubmitLinks HelperModule */
|
2016-02-12 23:52:43 +08:00
|
|
|
|
2018-09-24 22:25:04 +08:00
|
|
|
//= require comments
|
|
|
|
(function() {
|
2016-02-12 23:52:43 +08:00
|
|
|
var newProjectModal = null;
|
|
|
|
var newProjectModalForm = null;
|
2016-07-21 19:11:15 +08:00
|
|
|
var newProjectModalBody = null;
|
2016-02-12 23:52:43 +08:00
|
|
|
var newProjectBtn = null;
|
|
|
|
|
|
|
|
var editProjectModal = null;
|
|
|
|
var editProjectModalTitle = null;
|
2016-11-14 21:27:35 +08:00
|
|
|
var editProjectModalBody = null;
|
2016-02-12 23:52:43 +08:00
|
|
|
var editProjectBtn = null;
|
|
|
|
|
2018-06-01 22:14:50 +08:00
|
|
|
var projectActionsModal = null;
|
|
|
|
var projectActionsModalHeader = null;
|
|
|
|
var projectActionsModalBody = null;
|
|
|
|
var projectActionsModalFooter = null;
|
2016-02-12 23:52:43 +08:00
|
|
|
|
2018-09-24 22:25:04 +08:00
|
|
|
var projectsViewMode = 'cards';
|
|
|
|
var projectsViewFilter = $('.projects-view-filter.active').data('filter');
|
2018-09-27 16:43:44 +08:00
|
|
|
var projectsViewSort = 'new';
|
2016-11-14 21:27:35 +08:00
|
|
|
|
2016-02-12 23:52:43 +08:00
|
|
|
/**
|
|
|
|
* Initialize the JS for new project modal to work.
|
|
|
|
*/
|
|
|
|
function initNewProjectModal() {
|
2018-09-24 22:25:04 +08:00
|
|
|
newProjectModal.on('hidden.bs.modal', function() {
|
|
|
|
var teamSelect = newProjectModalForm.find('select#project_team_id');
|
|
|
|
var teamHidden = newProjectModalForm.find('input#project_visibility_hidden');
|
|
|
|
var teamVisible = newProjectModalForm.find('input#project_visibility_visible');
|
2016-02-12 23:52:43 +08:00
|
|
|
// When closing the new project modal, clear its input vals
|
|
|
|
// and potential errors
|
2016-08-11 22:05:23 +08:00
|
|
|
newProjectModalForm.clearFormErrors();
|
2016-02-12 23:52:43 +08:00
|
|
|
|
|
|
|
// Clear input fields
|
2016-08-11 22:05:23 +08:00
|
|
|
newProjectModalForm.clearFormFields();
|
2017-01-25 19:12:27 +08:00
|
|
|
teamSelect.val(0);
|
|
|
|
teamSelect.selectpicker('refresh');
|
|
|
|
|
2018-09-24 22:25:04 +08:00
|
|
|
teamHidden.prop('checked', true);
|
|
|
|
teamHidden.attr('checked', 'checked');
|
|
|
|
teamHidden.parent().addClass('active');
|
|
|
|
teamVisible.prop('checked', false);
|
|
|
|
teamVisible.parent().removeClass('active');
|
|
|
|
}).on('show.bs.modal', function() {
|
2017-01-25 19:12:27 +08:00
|
|
|
var teamSelect = newProjectModalForm.find('select#project_team_id');
|
|
|
|
teamSelect.selectpicker('refresh');
|
2016-02-12 23:52:43 +08:00
|
|
|
});
|
|
|
|
|
|
|
|
newProjectModalForm
|
2018-09-24 22:25:04 +08:00
|
|
|
.on('ajax:beforeSend', function() {
|
|
|
|
animateSpinner(newProjectModalBody);
|
|
|
|
})
|
|
|
|
.on('ajax:success', function(data, status) {
|
|
|
|
// Redirect to response page
|
|
|
|
$(location).attr('href', status.url);
|
|
|
|
})
|
|
|
|
.on('ajax:error', function(jqxhr, status) {
|
|
|
|
$(this).renderFormErrors('project', status.responseJSON);
|
|
|
|
})
|
|
|
|
.on('ajax:complete', function() {
|
|
|
|
animateSpinner(newProjectModalBody, false);
|
|
|
|
});
|
2016-02-12 23:52:43 +08:00
|
|
|
|
2018-09-24 22:25:04 +08:00
|
|
|
newProjectBtn.click(function() {
|
2016-02-12 23:52:43 +08:00
|
|
|
// Show the modal
|
2018-09-24 22:25:04 +08:00
|
|
|
newProjectModal.modal('show');
|
2016-02-12 23:52:43 +08:00
|
|
|
return false;
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Initialize the JS for edit project modal to work.
|
|
|
|
*/
|
|
|
|
function initEditProjectModal() {
|
|
|
|
// Edit button click handler
|
|
|
|
editProjectBtn.click(function() {
|
|
|
|
// Submit the modal body's form
|
2018-09-24 22:25:04 +08:00
|
|
|
editProjectModalBody.find('form').submit();
|
2016-02-12 23:52:43 +08:00
|
|
|
});
|
|
|
|
|
|
|
|
// On hide modal handler
|
2018-09-24 22:25:04 +08:00
|
|
|
editProjectModal.on('hidden.bs.modal', function() {
|
|
|
|
editProjectModalBody.html('');
|
2016-02-12 23:52:43 +08:00
|
|
|
});
|
|
|
|
|
|
|
|
$(".panel-project a[data-action='edit']")
|
2018-09-24 22:25:04 +08:00
|
|
|
.on('ajax:success', function(ev, data) {
|
|
|
|
// Update modal title
|
|
|
|
editProjectModalTitle.html(data.title);
|
|
|
|
|
|
|
|
// Set modal body
|
|
|
|
editProjectModalBody.html(data.html);
|
|
|
|
|
|
|
|
// Add modal body's submit handler
|
|
|
|
editProjectModal.find('form')
|
|
|
|
.on('ajax:beforeSend', function() {
|
|
|
|
animateSpinner(this);
|
|
|
|
})
|
|
|
|
.on('ajax:success', function(ev2, data2) {
|
|
|
|
// Hide modal
|
|
|
|
editProjectModal.modal('hide');
|
2018-09-27 16:43:44 +08:00
|
|
|
|
|
|
|
HelperModule.flashAlertMsg(data2.message, 'success');
|
|
|
|
|
|
|
|
// Project saved, reload cards view
|
|
|
|
loadCardsView();
|
2018-09-24 22:25:04 +08:00
|
|
|
})
|
|
|
|
.on('ajax:error', function(ev2, data2) {
|
2018-09-27 16:43:44 +08:00
|
|
|
$(this).renderFormErrors('project', data2.responseJSON.errors);
|
2018-09-24 22:25:04 +08:00
|
|
|
})
|
|
|
|
.on('ajax:complete', function() {
|
|
|
|
animateSpinner(this, false);
|
|
|
|
});
|
|
|
|
|
|
|
|
// Show the modal
|
|
|
|
editProjectModal.modal('show');
|
2016-07-21 19:11:15 +08:00
|
|
|
})
|
2018-09-24 22:25:04 +08:00
|
|
|
.on('ajax:error', function() {
|
|
|
|
// TODO
|
2016-02-12 23:52:43 +08:00
|
|
|
});
|
|
|
|
}
|
|
|
|
|
|
|
|
function initManageUsersModal() {
|
|
|
|
// Reload users tab HTML element when modal is closed
|
2018-09-24 22:25:04 +08:00
|
|
|
projectActionsModal.on('hide.bs.modal', function() {
|
|
|
|
var projectEl = $('#' + $(this).attr('data-project-id'));
|
2016-02-12 23:52:43 +08:00
|
|
|
|
|
|
|
// Load HTML to refresh users list
|
|
|
|
$.ajax({
|
2018-09-24 22:25:04 +08:00
|
|
|
url: projectEl.attr('data-project-users-tab-url'),
|
|
|
|
type: 'GET',
|
|
|
|
dataType: 'json',
|
|
|
|
success: function(data) {
|
|
|
|
projectEl.find('#users-' + projectEl.attr('id')).html(data.html);
|
|
|
|
CounterBadge.updateCounterBadge(
|
|
|
|
data.counter, data.project_id, 'users'
|
|
|
|
);
|
2016-02-12 23:52:43 +08:00
|
|
|
initUsersEditLink(projectEl);
|
|
|
|
},
|
2018-09-24 22:25:04 +08:00
|
|
|
error: function() {
|
2016-02-12 23:52:43 +08:00
|
|
|
// TODO
|
|
|
|
}
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
// Remove modal content when modal window is closed.
|
2018-09-24 22:25:04 +08:00
|
|
|
projectActionsModal.on('hidden.bs.modal', function() {
|
|
|
|
projectActionsModalHeader.html('');
|
|
|
|
projectActionsModalBody.html('');
|
|
|
|
projectActionsModalFooter.html('');
|
2016-02-12 23:52:43 +08:00
|
|
|
});
|
|
|
|
}
|
|
|
|
|
|
|
|
// Initialize users editing modal remote loading.
|
|
|
|
function initUsersEditLink($el) {
|
2018-09-24 22:25:04 +08:00
|
|
|
$el.find('.manage-users-link')
|
|
|
|
.on('ajax:before', function() {
|
|
|
|
var projectId = $(this).closest('.panel-default').attr('id');
|
|
|
|
projectActionsModal.attr('data-project-id', projectId);
|
|
|
|
projectActionsModal.modal('show');
|
|
|
|
})
|
|
|
|
.on('ajax:success', function(e, data) {
|
|
|
|
$('#manage-users-modal-project').text(data.project.name);
|
|
|
|
initUsersModalBody(data);
|
|
|
|
});
|
2016-02-12 23:52:43 +08:00
|
|
|
}
|
|
|
|
|
|
|
|
// Initialize reloading manage user modal content after posting new
|
|
|
|
// user.
|
2016-09-27 15:00:02 +08:00
|
|
|
|
2016-02-12 23:52:43 +08:00
|
|
|
function initAddUserForm() {
|
2018-09-24 22:25:04 +08:00
|
|
|
projectActionsModalBody.find('.add-user-form')
|
|
|
|
.on('ajax:success', function(e, data) {
|
|
|
|
var errorBlock;
|
2016-02-12 23:52:43 +08:00
|
|
|
initUsersModalBody(data);
|
|
|
|
if (data.status === 'error') {
|
2018-09-24 22:25:04 +08:00
|
|
|
$(this).addClass('has-error');
|
|
|
|
errorBlock = $(this).find('span.help-block');
|
|
|
|
if (errorBlock.length && errorBlock.length > 0) {
|
2016-07-21 19:11:15 +08:00
|
|
|
errorBlock.html(data.error);
|
|
|
|
} else {
|
2018-09-24 22:25:04 +08:00
|
|
|
$(this).append("<span class='help-block col-xs-8'>" + data.error + '</span>');
|
2016-07-21 19:11:15 +08:00
|
|
|
}
|
2016-02-12 23:52:43 +08:00
|
|
|
}
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
|
|
|
// Initialize remove user from project links.
|
|
|
|
function initRemoveUserLinks() {
|
2018-09-24 22:25:04 +08:00
|
|
|
projectActionsModalBody.find('.remove-user-link')
|
|
|
|
.on('ajax:success', function(e, data) {
|
2016-02-12 23:52:43 +08:00
|
|
|
initUsersModalBody(data);
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
|
|
|
//
|
|
|
|
function initUserRoleForms() {
|
2018-09-24 22:25:04 +08:00
|
|
|
projectActionsModalBody.find('.update-user-form select')
|
|
|
|
.on('change', function() {
|
|
|
|
$(this).parents('form').submit();
|
2016-02-12 23:52:43 +08:00
|
|
|
});
|
|
|
|
|
2018-09-24 22:25:04 +08:00
|
|
|
projectActionsModalBody.find('.update-user-form')
|
|
|
|
.on('ajax:success', function(e, data) {
|
2016-02-12 23:52:43 +08:00
|
|
|
initUsersModalBody(data);
|
|
|
|
})
|
2018-09-24 22:25:04 +08:00
|
|
|
.on('ajax:error', function() {
|
2016-02-12 23:52:43 +08:00
|
|
|
// TODO
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
|
|
|
// Initialize ajax listeners and elements style on modal body. This
|
|
|
|
// function must be called when modal body is changed.
|
|
|
|
function initUsersModalBody(data) {
|
2018-06-01 22:14:50 +08:00
|
|
|
projectActionsModalHeader.html(data.html_header);
|
|
|
|
projectActionsModalBody.html(data.html_body);
|
|
|
|
projectActionsModalFooter.html(data.html_footer);
|
2018-09-24 22:25:04 +08:00
|
|
|
projectActionsModalBody.find('.selectpicker').selectpicker();
|
2016-02-12 23:52:43 +08:00
|
|
|
initAddUserForm();
|
|
|
|
initRemoveUserLinks();
|
|
|
|
initUserRoleForms();
|
|
|
|
}
|
|
|
|
|
2018-09-24 22:25:04 +08:00
|
|
|
/**
|
|
|
|
* Initializes page
|
|
|
|
*/
|
|
|
|
function init() {
|
|
|
|
newProjectModal = $('#new-project-modal');
|
|
|
|
newProjectModalForm = newProjectModal.find('form');
|
|
|
|
newProjectModalBody = newProjectModal.find('.modal-body');
|
|
|
|
newProjectBtn = $('#new-project-btn');
|
|
|
|
|
|
|
|
editProjectModal = $('#edit-project-modal');
|
|
|
|
editProjectModalTitle = editProjectModal.find('#edit-project-modal-label');
|
|
|
|
editProjectModalBody = editProjectModal.find('.modal-body');
|
|
|
|
editProjectBtn = editProjectModal.find(".btn[data-action='submit']");
|
|
|
|
|
|
|
|
projectActionsModal = $('#project-actions-modal');
|
|
|
|
projectActionsModalHeader = projectActionsModal.find('.modal-title');
|
|
|
|
projectActionsModalBody = projectActionsModal.find('.modal-body');
|
|
|
|
projectActionsModalFooter = projectActionsModal.find('.modal-footer');
|
|
|
|
|
|
|
|
initNewProjectModal();
|
|
|
|
initEditProjectModal();
|
|
|
|
initManageUsersModal();
|
|
|
|
Comments.initCommentOptions('ul.content-comments', true);
|
|
|
|
Comments.initEditComments('.panel-project .tab-content');
|
|
|
|
Comments.initDeleteComments('.panel-project .tab-content');
|
|
|
|
|
2018-09-27 16:43:44 +08:00
|
|
|
$('.project-card-selector').click(function() {
|
|
|
|
if (this.checked) {
|
|
|
|
$(this).closest('.panel-project').addClass('selected');
|
|
|
|
} else {
|
|
|
|
$(this).closest('.panel-project').removeClass('selected');
|
|
|
|
}
|
|
|
|
});
|
|
|
|
|
|
|
|
// init project archive/restore function
|
|
|
|
$('.panel-project .panel-heading form')
|
|
|
|
.on('ajax:beforeSend', function() {
|
|
|
|
animateSpinner($('#projects-cards-view'));
|
|
|
|
})
|
|
|
|
.on('ajax:success', function(ev, data) {
|
|
|
|
HelperModule.flashAlertMsg(data.message, 'success');
|
|
|
|
// Project saved, reload cards view
|
|
|
|
loadCardsView();
|
|
|
|
})
|
|
|
|
.on('ajax:error', function(ev, data) {
|
|
|
|
HelperModule.flashAlertMsg(data.responseJSON.message, 'danger');
|
|
|
|
})
|
|
|
|
.on('ajax:complete', function() {
|
|
|
|
animateSpinner($('#projects-cards-view'), false);
|
|
|
|
});
|
|
|
|
|
2018-09-24 22:25:04 +08:00
|
|
|
// initialize project tab remote loading
|
|
|
|
$('.panel-project .active').removeClass('active');
|
|
|
|
$('.panel-project .panel-footer [role=tab]')
|
|
|
|
.on('ajax:before', function() {
|
|
|
|
var $this = $(this);
|
|
|
|
var parentNode = $this.parents('li');
|
|
|
|
var targetId = $this.attr('aria-controls');
|
|
|
|
|
|
|
|
if (parentNode.hasClass('active')) {
|
|
|
|
// TODO move to fn
|
|
|
|
parentNode.removeClass('active');
|
|
|
|
$('#' + targetId).removeClass('active');
|
|
|
|
return false;
|
|
|
|
}
|
|
|
|
return true;
|
|
|
|
})
|
|
|
|
.on('ajax:success', function(e, data) {
|
|
|
|
var $this = $(this);
|
|
|
|
var targetId = $this.attr('aria-controls');
|
|
|
|
var target = $('#' + targetId);
|
|
|
|
var parentNode = $this.parents('ul').parent();
|
|
|
|
|
|
|
|
target.html(data.html);
|
|
|
|
initUsersEditLink(parentNode);
|
|
|
|
Comments.form(parentNode);
|
|
|
|
Comments.moreComments(parentNode);
|
|
|
|
|
|
|
|
// TODO move to fn
|
|
|
|
parentNode.find('.active').removeClass('active');
|
|
|
|
$this.parents('li').addClass('active');
|
|
|
|
target.addClass('active');
|
|
|
|
|
|
|
|
Comments.scrollBottom(parentNode);
|
|
|
|
})
|
|
|
|
.on('ajax:error', function() {
|
|
|
|
// TODO
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
2018-09-27 16:43:44 +08:00
|
|
|
function loadCardsView() {
|
|
|
|
// Load HTML with projects list
|
|
|
|
var viewContainer = $('#projects-cards-view');
|
|
|
|
animateSpinner(viewContainer, true);
|
|
|
|
$.ajax({
|
|
|
|
url: $('#projects-cards-view').data('projects-url'),
|
|
|
|
type: 'GET',
|
|
|
|
dataType: 'json',
|
|
|
|
data: {
|
|
|
|
filter: projectsViewFilter,
|
|
|
|
sort: projectsViewSort
|
|
|
|
},
|
|
|
|
success: function(data) {
|
|
|
|
viewContainer.html(data.html);
|
|
|
|
initFormSubmitLinks(viewContainer);
|
|
|
|
init();
|
|
|
|
},
|
|
|
|
error: function() {
|
|
|
|
viewContainer.html('Error loading project list');
|
|
|
|
}
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
|
|
|
function initProjectsViewFilter() {
|
|
|
|
$('.projects-view-filter').click(function(event) {
|
|
|
|
event.preventDefault();
|
|
|
|
event.stopPropagation();
|
|
|
|
$('.projects-view-filter').removeClass('active');
|
|
|
|
$(this).addClass('active');
|
|
|
|
if ($(this).data('filter') === projectsViewFilter) {
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
projectsViewFilter = $(this).data('filter');
|
|
|
|
if ($('#projects-cards-view').hasClass('active')) {
|
|
|
|
loadCardsView();
|
|
|
|
}
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
|
|
|
function initProjectsViewModeSwitch() {
|
|
|
|
$('input[name=projects-view-mode-selector]').on('change', function() {
|
|
|
|
if ($(this).val() === projectsViewMode) {
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
projectsViewMode = $(this).val();
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
|
|
|
function initSorting() {
|
|
|
|
$('#sortMenuDropdown a').click(function(event) {
|
|
|
|
event.preventDefault();
|
|
|
|
event.stopPropagation();
|
|
|
|
if (projectsViewSort !== $(this).data('sort')) {
|
|
|
|
$('#sortMenuDropdown a').removeClass('disabled');
|
|
|
|
projectsViewSort = $(this).data('sort');
|
|
|
|
loadCardsView();
|
|
|
|
$(this).addClass('disabled');
|
|
|
|
$('#sortMenu').dropdown('toggle');
|
|
|
|
}
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
|
|
|
initProjectsViewFilter();
|
|
|
|
initProjectsViewModeSwitch();
|
|
|
|
initSorting();
|
|
|
|
loadCardsView();
|
2016-08-11 18:40:16 +08:00
|
|
|
}());
|