make swimlane height adjustable

This commit is contained in:
mark 2023-06-13 13:43:09 -05:00
parent 0ec9c4c37b
commit 26d2efdedb
8 changed files with 108 additions and 3 deletions

View file

@ -165,7 +165,7 @@ template(name="setListWidthPopup")
#js-list-width-edit
label {{_ 'set-list-width-value'}}
p
input.list-width-value(type="number" value="{{ listWidthValue }}" min="100" max="800")
input.list-width-value(type="number" value="{{ listWidthValue }}" min="100")
input.list-width-apply(type="submit" value="{{_ 'apply'}}")
input.list-width-error

View file

@ -44,6 +44,9 @@ template(name="swimlaneActionPopup")
li: a.js-set-swimlane-color
i.fa.fa-paint-brush
| {{_ 'select-color'}}
li: a.js-set-swimlane-height
i.fa.fa-arrows-v
| {{_ 'set-swimlane-height'}}
unless this.isTemplateContainer
hr
ul.pop-over-list
@ -82,6 +85,19 @@ template(name="setSwimlaneColorPopup")
button.primary.confirm.js-submit {{_ 'save'}}
button.js-remove-color.negate.wide.right {{_ 'unset-color'}}
template(name="setSwimlaneHeightPopup")
#js-swimlane-height-edit
label {{_ 'set-swimlane-height-value'}}
p
input.swimlane-height-value(type="number" value="{{ swimlaneHeightValue }}" min="100")
input.swimlane-height-apply(type="submit" value="{{_ 'apply'}}")
input.swimlane-height-error
template(name="swimlaneHeightErrorPopup")
.swimlane-height-invalid
p {{_ 'swimlane-height-error-message'}}
button.full.js-back-view(type="submit") {{_ 'cancel'}}
template(name="swimlaneDeletePopup")
p {{_ "swimlane-delete-pop"}}
button.js-confirm.negate.full(type="submit") {{_ 'delete'}}

View file

@ -36,6 +36,7 @@ Template.swimlaneFixedHeader.helpers({
Template.swimlaneActionPopup.events({
'click .js-set-swimlane-color': Popup.open('setSwimlaneColor'),
'click .js-set-swimlane-height': Popup.open('setSwimlaneHeight'),
'click .js-close-swimlane'(event) {
event.preventDefault();
this.archive();
@ -128,3 +129,45 @@ BlazeComponent.extendComponent({
];
},
}).register('setSwimlaneColorPopup');
BlazeComponent.extendComponent({
onCreated() {
this.currentSwimlane = this.currentData();
},
applySwimlaneHeight() {
const swimlane = this.currentData();
const board = swimlane.boardId;
const height = parseInt(
Template.instance()
.$('.swimlane-height-value')
.val(),
10,
);
// FIXME(mark-i-m): where do we put constants?
if (height < 100 || !height) {
Template.instance()
.$('.swimlane-height-error')
.click();
} else {
Meteor.call('applySwimlaneHeight', board, swimlane._id, height);
Popup.back();
}
},
swimlaneHeightValue() {
const swimlane = this.currentData();
const board = swimlane.boardId;
return Meteor.user().getSwimlaneHeight(board, swimlane._id);
},
events() {
return [
{
'click .swimlane-height-apply': this.applySwimlaneHeight,
'click .swimlane-height-error': Popup.open('swimlaneHeightError'),
},
];
},
}).register('setSwimlaneHeightPopup');

View file

@ -116,6 +116,9 @@
left: 87vw;
font-size: 24px;
}
#js-swimlane-height-edit .swimlane-height-error {
display: none;
}
.list-group {
height: 100%;
}

View file

@ -2,7 +2,8 @@ template(name="swimlane")
.swimlane
+swimlaneHeader
unless collapseSwimlane
.swimlane.js-lists.js-swimlane(id="swimlane-{{_id}}")
.swimlane.js-lists.js-swimlane(id="swimlane-{{_id}}"
style="height:{{swimlaneHeight}}px;")
if isMiniScreen
if currentListIsInThisSwimlane _id
+list(currentList)

View file

@ -235,6 +235,12 @@ BlazeComponent.extendComponent({
},
];
},
swimlaneHeight() {
const user = Meteor.user();
const swimlane = Template.currentData();
return user.getSwimlaneHeight(swimlane.boardId, swimlane._id);
},
}).register('swimlane');
BlazeComponent.extendComponent({

View file

@ -87,7 +87,10 @@
"add-card-to-bottom-of-list": "Add Card to Bottom of List",
"set-list-width": "Set List Width",
"set-list-width-value": "List Width (pixels)",
"list-width-error-message": "List width must be a positive integer between 100 and 800. TODO(mark-i-m): hard-coded constants",
"list-width-error-message": "List width must be a positive integer >=100. TODO(mark-i-m): hard-coded constants",
"set-swimlane-height": "Set Swimlane Height",
"set-swimlane-height-value": "Swimlane Height (pixels)",
"swimlane-height-error-message": "Swimlane height must be a positive integer >=100. TODO(mark-i-m): hard-coded constants",
"add-swimlane": "Add Swimlane",
"add-subtask": "Add Subtask",
"add-checklist": "Add Checklist",

View file

@ -791,6 +791,19 @@ Users.helpers({
}
},
getSwimlaneHeights() {
const { swimlaneHeights = {} } = this.profile || {};
return swimlaneHeights;
},
getSwimlaneHeight(boardId, listId) {
const swimlaneHeights = this.getSwimlaneHeights();
if (swimlaneHeights[boardId] && swimlaneHeights[boardId][listId]) {
return swimlaneHeights[boardId][listId];
} else {
return 270; //TODO(mark-i-m): default?
}
},
/** returns all confirmed move and copy dialog field values
* <li> the board, swimlane and list id is stored for each board
*/
@ -1181,6 +1194,19 @@ Users.mutations({
},
};
},
setSwimlaneHeight(boardId, swimlaneId, height) {
let currentHeights = this.getSwimlaneHeights();
if (!currentHeights[boardId]) {
currentHeights[boardId] = {};
}
currentHeights[boardId][swimlaneId] = height;
return {
$set: {
'profile.swimlaneHeights': currentHeights,
},
};
},
});
Meteor.methods({
@ -1231,6 +1257,13 @@ Meteor.methods({
const user = Meteor.user();
user.setListWidth(boardId, listId, width);
},
applySwimlaneHeight(boardId, swimlaneId, height) {
check(boardId, String);
check(swimlaneId, String);
check(height, Number);
const user = Meteor.user();
user.setSwimlaneHeight(boardId, swimlaneId, height);
},
});
if (Meteor.isServer) {