Actualizar plugin Checklists a 3.1.18 light
This commit is contained in:
parent
a26f5567af
commit
24560c8598
55 changed files with 992 additions and 307 deletions
|
@ -110,15 +110,11 @@ Redmine.Checklist = $.klass({
|
|||
event.returnValue = false
|
||||
},
|
||||
|
||||
addChecklistFields: function(templateDiv) {
|
||||
addChecklistFields: function() {
|
||||
var new_id = new Date().getTime();
|
||||
var regexp = new RegExp("new_checklist", "g");
|
||||
if (templateDiv) {
|
||||
appended = $(this.content.replace(regexp, new_id)).insertBefore(templateDiv)
|
||||
} else {
|
||||
appended = $(this.content.replace(regexp, new_id)).appendTo(this.root)
|
||||
}
|
||||
appended.find('.edit-box').focus()
|
||||
appended = $(this.content.replace(regexp, new_id)).appendTo(this.root);
|
||||
appended.find('.edit-box').focus();
|
||||
},
|
||||
|
||||
findSpan: function(event) {
|
||||
|
@ -129,13 +125,16 @@ Redmine.Checklist = $.klass({
|
|||
return elem.prevAll('span.checklist-item.new')
|
||||
},
|
||||
|
||||
transformItem: function(event, elem, valueToSet) {
|
||||
transformItem: function(event, elem, valueToSet, isSection) {
|
||||
var checklistItem;
|
||||
if (event) {
|
||||
checklistItem = this.findSpan(event)
|
||||
} else {
|
||||
} else if (elem) {
|
||||
checklistItem = this.findSpanBefore(elem)
|
||||
} else {
|
||||
checklistItem = this.root.find('span.checklist-item.new')
|
||||
}
|
||||
|
||||
var val;
|
||||
if (valueToSet) {
|
||||
val = valueToSet
|
||||
|
@ -143,11 +142,17 @@ Redmine.Checklist = $.klass({
|
|||
} else {
|
||||
val = checklistItem.find('input.edit-box').val()
|
||||
}
|
||||
|
||||
checklistItem.find('.checklist-subject').text(val)
|
||||
checklistItem.find('.checklist-subject-hidden').val(val)
|
||||
checklistItem.removeClass('edit')
|
||||
checklistItem.removeClass('new')
|
||||
checklistItem.addClass('show')
|
||||
|
||||
if (isSection) {
|
||||
checklistItem.addClass('checklist-section');
|
||||
checklistItem.children('.checklist-item-is_section').val(true);
|
||||
}
|
||||
},
|
||||
|
||||
resetItem: function(item) {
|
||||
|
@ -157,12 +162,9 @@ Redmine.Checklist = $.klass({
|
|||
},
|
||||
|
||||
addChecklistItem: function(event) {
|
||||
this.preventEvent(event)
|
||||
this.transformItem(event)
|
||||
if ($('.template-wrapper').length)
|
||||
this.addChecklistFields($('.template-wrapper'))
|
||||
else
|
||||
this.addChecklistFields()
|
||||
this.preventEvent(event);
|
||||
this.transformItem(event);
|
||||
this.addChecklistFields();
|
||||
},
|
||||
|
||||
canSave: function(span) {
|
||||
|
@ -193,6 +195,57 @@ Redmine.Checklist = $.klass({
|
|||
}, this))
|
||||
},
|
||||
|
||||
onClickAddChecklistItemMenuButton: function() {
|
||||
$('#checklist-menu .add-checklist-item').on('click', $.proxy(function(event) {
|
||||
this.preventEvent(event);
|
||||
var span = $('#checklist_form_items > span.checklist-item.new');
|
||||
if (this.canSave(span)) {
|
||||
this.transformItem();
|
||||
this.addChecklistFields();
|
||||
this.$plusButtonMenu.hide();
|
||||
}
|
||||
}, this))
|
||||
},
|
||||
|
||||
onClickNewSectionMenuButton: function() {
|
||||
$('#checklist-menu .add-checklist-section').on('click', $.proxy(function(event) {
|
||||
this.preventEvent(event);
|
||||
var span = $('#checklist_form_items > span.checklist-item.new');
|
||||
if (this.canSave(span)) {
|
||||
this.transformItem(null, null, null, true);
|
||||
this.addChecklistFields();
|
||||
this.$plusButtonMenu.hide();
|
||||
}
|
||||
}, this))
|
||||
},
|
||||
|
||||
onMouseEnterLeavePlusButton: function() {
|
||||
var hideMenuTimer;
|
||||
var $menu = this.$plusButtonMenu;
|
||||
|
||||
this.root.on('mouseenter', '.save-new-by-button', function() {
|
||||
var $plusButton = $(this);
|
||||
var position = $plusButton.position();
|
||||
$menu.css('left', (position.left + 'px'));
|
||||
$menu.css('top', (position.top + $plusButton.height() + 'px'));
|
||||
$menu.show();
|
||||
});
|
||||
|
||||
this.root.on('mouseleave', '.save-new-by-button', function() {
|
||||
hideMenuTimer = setTimeout(function() {
|
||||
$menu.hide();
|
||||
}, 500);
|
||||
});
|
||||
|
||||
$('#checklist-menu').on('mouseenter', function() {
|
||||
clearTimeout(hideMenuTimer);
|
||||
});
|
||||
|
||||
$('#checklist-menu').on('mouseleave', function() {
|
||||
$menu.hide();
|
||||
});
|
||||
},
|
||||
|
||||
onIssueFormSubmitRemoveEmptyChecklistItems: function() {
|
||||
$('body').on('submit', '#issue-form', function(){
|
||||
$('.checklist-subject-hidden').each(function(i, elem) {
|
||||
|
@ -206,16 +259,19 @@ Redmine.Checklist = $.klass({
|
|||
|
||||
onChecklistRemove: function() {
|
||||
this.root.on('click', '.checklist-remove a', $.proxy(function(event){
|
||||
this.preventEvent(event)
|
||||
removed = this.findSpan(event)
|
||||
removed.find('.checklist-remove input[type=hidden]').val('1')
|
||||
removed.fadeOut(200)
|
||||
}, this))
|
||||
this.preventEvent(event);
|
||||
var itemToRemove = this.findSpan(event);
|
||||
var checkbox = itemToRemove.find(".checklist-remove input[type=hidden]");
|
||||
|
||||
if (checkbox.val() === "false") {
|
||||
checkbox.val("1");
|
||||
itemToRemove.fadeOut(200);
|
||||
}
|
||||
}, this));
|
||||
},
|
||||
|
||||
makeChecklistsSortable: function() {
|
||||
$('#checklist_form_items').sortable({
|
||||
revert: true,
|
||||
items: '.checklist-item.show',
|
||||
helper: "clone",
|
||||
stop: function (event, ui) {
|
||||
|
@ -265,13 +321,33 @@ Redmine.Checklist = $.klass({
|
|||
},
|
||||
|
||||
onChangeCheckbox: function(){
|
||||
this.root.on('change', 'input.checklist-checkbox', $.proxy(function(event){
|
||||
this.root.on('change', 'input.checklist-checkbox', $.proxy(function(event) {
|
||||
this.darkenCompletedSections();
|
||||
checkbox = $(event.target)
|
||||
url = checkbox.attr('data_url')
|
||||
$.ajax({type: "PUT", url: url, data: { is_done: checkbox.prop('checked') }, dataType: 'script'})
|
||||
}, this))
|
||||
},
|
||||
|
||||
darkenCompletedSections: function() {
|
||||
var isCompletedSection = true;
|
||||
var reversedChecklistItems = $('#checklist_items li').get().reverse();
|
||||
|
||||
$(reversedChecklistItems).each(function(index, element) {
|
||||
var $element = $(element);
|
||||
if ($element.hasClass('checklist-section')) {
|
||||
if (isCompletedSection) {
|
||||
$element.addClass('completed-section')
|
||||
} else {
|
||||
$element.removeClass('completed-section')
|
||||
}
|
||||
isCompletedSection = true;
|
||||
} else {
|
||||
isCompletedSection = isCompletedSection && $element.children('.checklist-checkbox').is(':checked')
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
enableUniquenessValidation: function() {
|
||||
this.root.on('keyup', 'input.edit-box', $.proxy(function(event) {
|
||||
value = $(event.target).val()
|
||||
|
@ -303,39 +379,39 @@ Redmine.Checklist = $.klass({
|
|||
},
|
||||
|
||||
assignTemplateSelectedEvent: function() {
|
||||
var item;
|
||||
this.root.on('change', '#checklist_template', $.proxy(function(){
|
||||
value = $('#checklist_template').val()
|
||||
selected = $('#checklist_template option[value='+value+']').data('template-items')
|
||||
items = selected.split(/\n/)
|
||||
for(i = 0; i<items.length; i++)
|
||||
{
|
||||
item = items[i]
|
||||
if (!this.hasAlreadyChecklistWithName(item))
|
||||
{
|
||||
this.transformItem(null, $('#checklist_template'), item)
|
||||
this.addChecklistFields($('#template-link').closest('span'))
|
||||
this.$plusButtonMenu.on('click', 'li a.checklist-template', $.proxy(function(event) {
|
||||
this.preventEvent(event);
|
||||
items = $(event.target).data('template-items').split(/\n/);
|
||||
for(var i = 0; i < items.length; i++) {
|
||||
var item = items[i];
|
||||
var isSection = item.slice(0, 2) === '--';
|
||||
if (isSection) { item = item.slice(2) }
|
||||
if (!this.hasAlreadyChecklistWithName(item)) {
|
||||
this.transformItem(null, null, item, isSection);
|
||||
this.addChecklistFields();
|
||||
}
|
||||
}
|
||||
$('#checklist_template').val('')
|
||||
$('#template-link').show()
|
||||
$('#checklist_template').hide()
|
||||
|
||||
}, this))
|
||||
},
|
||||
|
||||
clickSelectTemplateLink: function() {
|
||||
this.root.on('click', '#template-link', function(){
|
||||
$('#template-link').hide()
|
||||
$('#checklist_template').show()
|
||||
})
|
||||
},
|
||||
|
||||
init: function(element) {
|
||||
this.root = element
|
||||
this.content = element.data('checklist-fields')
|
||||
this.onEnterInNewChecklistItemForm()
|
||||
this.onClickPlusInNewChecklistItem()
|
||||
|
||||
if (this.content) {
|
||||
this.$plusButtonMenu = $('#checklist-menu').menu();
|
||||
if (this.$plusButtonMenu.length > 0) {
|
||||
this.onMouseEnterLeavePlusButton();
|
||||
this.onClickAddChecklistItemMenuButton();
|
||||
this.assignTemplateSelectedEvent();
|
||||
this.onClickNewSectionMenuButton();
|
||||
}
|
||||
} else {
|
||||
this.darkenCompletedSections()
|
||||
}
|
||||
|
||||
this.onIssueFormSubmitRemoveEmptyChecklistItems()
|
||||
this.onChecklistRemove()
|
||||
this.makeChecklistsSortable()
|
||||
|
@ -343,12 +419,59 @@ Redmine.Checklist = $.klass({
|
|||
this.onCheckboxChanged()
|
||||
this.onChangeCheckbox()
|
||||
this.enableUniquenessValidation()
|
||||
this.assignTemplateSelectedEvent()
|
||||
this.clickSelectTemplateLink()
|
||||
}
|
||||
|
||||
})
|
||||
|
||||
$.fn.checklist = function(element){
|
||||
new Redmine.Checklist(this);
|
||||
}
|
||||
};
|
||||
|
||||
Redmine.ChecklistToggle = $.klass({
|
||||
manageToggling: function (t_val) {
|
||||
var checkedCheckboxes = $('.checklist-checkbox:checkbox:checked');
|
||||
|
||||
if(localStorage.getItem("hide_closed_checklists") === t_val){
|
||||
$($(checkedCheckboxes).closest('li')).hide();
|
||||
$(this.switch_link).text(this.show_text + '(' + checkedCheckboxes.length + ')');
|
||||
} else {
|
||||
$($(checkedCheckboxes).closest('li')).show();
|
||||
$(this.switch_link).text(this.hide_text);
|
||||
}
|
||||
},
|
||||
switch_link_click: function(){
|
||||
var th = $(this)[0];
|
||||
this.switch_link.click(function (e) {
|
||||
e.preventDefault();
|
||||
th.manageToggling("1");
|
||||
var setVal = (localStorage.getItem("hide_closed_checklists") === "1") ? "0" : "1";
|
||||
localStorage.setItem("hide_closed_checklists", setVal);
|
||||
});
|
||||
},
|
||||
hide_switch_link: function(){
|
||||
if($('.checklist-checkbox:checkbox:checked').length < 1){
|
||||
this.switch_link.hide();
|
||||
}
|
||||
},
|
||||
init: function(show_text, hide_text) {
|
||||
this.show_text = show_text;
|
||||
this.hide_text = hide_text;
|
||||
this.switch_link = $('#switch_link');
|
||||
this.manageToggling("0");
|
||||
this.switch_link_click();
|
||||
this.hide_switch_link();
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
$(document).ready(function () {
|
||||
if (typeof(contextMenuCheckSelectionBox) === 'function') {
|
||||
var originContextMenuCheckSelectionBox = contextMenuCheckSelectionBox;
|
||||
contextMenuCheckSelectionBox = function (tr, checked) {
|
||||
var $td = tr.find('td.checklist_relations');
|
||||
var $checklist = $td.find('.checklist').detach();
|
||||
originContextMenuCheckSelectionBox(tr, checked);
|
||||
$checklist.appendTo($td);
|
||||
};
|
||||
}
|
||||
});
|
||||
|
|
|
@ -1,3 +1,7 @@
|
|||
#checklist_form_items input[type="checkbox"],
|
||||
#checklist_items input[type="checkbox"] {
|
||||
height: initial;
|
||||
}
|
||||
|
||||
div#checklist ul {
|
||||
list-style: none;
|
||||
|
@ -10,6 +14,8 @@ div#checklist li {
|
|||
margin-left: 10px;
|
||||
}
|
||||
|
||||
.checklist-checkbox {height: inherit}
|
||||
|
||||
#checklist li:hover a.delete {opacity: 1;}
|
||||
|
||||
#checklist a.delete {opacity: 0.4;}
|
||||
|
@ -74,4 +80,65 @@ span.checklist-item.edit .checklist-show-only {
|
|||
div#checklist ol {
|
||||
display: inline-block;
|
||||
padding-left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.checklist-section {
|
||||
padding-top: 10px;
|
||||
font-weight: bold;
|
||||
border-bottom-width: 1px;
|
||||
border-bottom-style: solid;
|
||||
border-bottom-color: #eee;
|
||||
}
|
||||
|
||||
.checklist-item.checklist-section > .checklist-checkbox { display: none; }
|
||||
|
||||
#checklist_items li.checklist-section {
|
||||
padding-bottom: 5px;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
.completed-section { color: #999; }
|
||||
|
||||
.save-new-by-button { cursor: pointer; }
|
||||
|
||||
table.list td.checklist_relations { text-align: left }
|
||||
|
||||
/* ========================================================================= */
|
||||
/* Checklist context menu */
|
||||
/* ========================================================================= */
|
||||
|
||||
#checklist-menu ul, #checklist-menu li, #checklist-menu a {
|
||||
display:block;
|
||||
margin:0;
|
||||
padding:0;
|
||||
border:0;
|
||||
}
|
||||
|
||||
#checklist-menu {
|
||||
display: none;
|
||||
position: absolute;
|
||||
font-size: 0.9em;
|
||||
}
|
||||
|
||||
#checklist-menu, #checklist-menu ul {
|
||||
width: 150px;
|
||||
border: 1px solid #ccc;
|
||||
background: white;
|
||||
list-style: none;
|
||||
padding: 2px;
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
#checklist-menu li {
|
||||
position: relative;
|
||||
padding: 1px;
|
||||
border: 1px solid white;
|
||||
}
|
||||
|
||||
#checklist-menu a {
|
||||
text-decoration: none !important;
|
||||
padding: 2px 0px 2px 20px;
|
||||
}
|
||||
|
||||
#checklist-menu a:hover { color:#2A5685; }
|
||||
#checklist-menu li:hover { border:1px solid #628db6; background-color:#eef5fd; border-radius:3px; }
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue