Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

New: Added toggleClass to AdaptModel and ItemModel #593

Merged
merged 2 commits into from
Oct 22, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
32 changes: 32 additions & 0 deletions js/modelHelpers.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,32 @@
/**
* Toggle a className in the _classes attribute of any Backbone.Model
* @param model {Backbone.Model} Model with a _classes attribute to modify
* @param className {string} Name or names of class to add/remove to _classes attribute, space separated list
* @param hasClass {boolean|null|undefined} true to add a class, false to remove, null or undefined to toggle
*/
export function toggleModelClass(model, className, hasClass) {
// split the string of classes into an array of classNames
const currentClassNames = (model.get('_classes') || '').split(' ').filter(Boolean);
// capture all existing classes as a unique list
const classesObject = currentClassNames.reduce((classesObject, className) => ({ ...classesObject, [className]: true }), {});
// update the list according to arguments
const shouldToggleExisting = (hasClass === null || hasClass === undefined);
// allow multiple classes to be added and removed together
className
.split(' ')
.filter(Boolean)
.forEach(className => {
// toggle class
classesObject[className] = shouldToggleExisting
? !classesObject[className]
: Boolean(hasClass);
});
// flatten back into a string of classes
const outputClasses = Object
.entries(classesObject)
.filter(([, hasClass]) => hasClass)
.map(([className]) => className)
.join(' ');
// update the model
model.set('_classes', outputClasses);
}
11 changes: 11 additions & 0 deletions js/models/adaptModel.js
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@ import data from 'core/js/data';
import ModelEvent from 'core/js/modelEvent';
import LockingModel from 'core/js/models/lockingModel';
import logging from 'core/js/logging';
import { toggleModelClass } from '../modelHelpers';

export default class AdaptModel extends LockingModel {

Expand Down Expand Up @@ -116,6 +117,16 @@ export default class AdaptModel extends LockingModel {
];
}

/**
* Toggle a className in the _classes attribute
* @param className {string} Name or names of class to add/remove to _classes attribute, space separated list
* @param hasClass {boolean|null|undefined} true to add a class, false to remove, null or undefined to toggle
*/
toggleClass(className, hasClass) {
toggleModelClass(this, className, hasClass);
return this;
}

setupModel() {
if (this.hasManagedChildren) {
this.setupChildListeners();
Expand Down
12 changes: 12 additions & 0 deletions js/models/itemModel.js
Original file line number Diff line number Diff line change
@@ -1,15 +1,27 @@
import LockingModel from 'core/js/models/lockingModel';
import { toggleModelClass } from '../modelHelpers';

export default class ItemModel extends LockingModel {

defaults() {
return {
_classes: '',
_isActive: false,
_isVisited: false,
_score: 0
};
}

/**
* Toggle a className in the _classes attribute
* @param className {string} Name or names of class to add/remove to _classes attribute, space separated list
* @param hasClass {boolean|null|undefined} true to add a class, false to remove, null or undefined to toggle
*/
toggleClass(className, hasClass) {
toggleModelClass(this, className, hasClass);
return this;
}

reset() {
this.set({ _isActive: false, _isVisited: false });
}
Expand Down