Skip to content
Snippets Groups Projects
Commit d5c0487a authored by smmercuri's avatar smmercuri
Browse files

Code tidy

parent a99d5e4a
Branches
No related tags found
No related merge requests found
......@@ -22,7 +22,8 @@ export const SUPPORTED_CALLBACK_FUNCTIONS = [
"onMove",
"onClone",
"onChange"
]
];
/**
* Preprocess and validate proof steps, block user options, and sortable user options ready for use in `stack_sortable` class.
*
......@@ -77,7 +78,7 @@ export function preprocess_steps(proofSteps, blockUserOpts, sortableUserOpts) {
proofSteps = proofSteps["steps"];
// Process block user options for the 'header' setting
if (userOpts.header != null) {
if (userOpts.header !== undefined) {
blockUserOpts = {used: {header: userOpts.header[0]}, available: {header: userOpts.header[1]}};
}
......@@ -97,7 +98,8 @@ export function preprocess_steps(proofSteps, blockUserOpts, sortableUserOpts) {
/**
* Convert a JSON-formatted stack string array of format '[["key", "value"], ..., ["key", "value"]]' into a JavaScript object.
*
* @param {string} stackjson_string - The JSON-formatted stack string array of format '[["key", "value"], ..., ["key", "value"]]'.
* @param {string} stackjson_array_string - The JSON-formatted stack string array of format
* '[["key", "value"], ..., ["key", "value"]]'.
* @returns {Object} - The JavaScript object created from the stack string.
*
* @example
......@@ -333,14 +335,14 @@ export const stack_sortable = class {
this.proofSteps = proofSteps;
this.inputId = inputId;
this.state = this._generate_state(this.proofSteps, this.inputId);
if (inputId != null) {
if (inputId !== null) {
this.input = document.getElementById(this.inputId);
};
}
this.availableId = availableId;
this.available = document.getElementById(this.availableId);
this.usedId = usedId;
this.used = document.getElementById(this.usedId);
this.clone = clone
this.clone = clone;
// TODO : additional default options?
this.defaultOptions = {used: {animation: 50}, available: {animation: 50}};
......@@ -390,7 +392,7 @@ export const stack_sortable = class {
if (!keysRecognised) {
err += unknownErr+ invalidKeys.join(", ") + ". ";
}
// If option is one of those we overwrite warn user (we have to use this.userOptions as this.options will contain these keys)
// If option is overwritten warn user (we have to use this.userOptions as this.options will contain these keys)
var overwrittenKeys = [];
var keysPreserved = true;
["ghostClass", "group", "onSort"].forEach(key =>
......@@ -407,7 +409,7 @@ export const stack_sortable = class {
if (!keysRecognised || !keysPreserved) {
this._display_warning(err);
}
};
}
/**
* Generates the available list based on the current state.
......@@ -451,10 +453,10 @@ export const stack_sortable = class {
*/
update_state(newUsed, newAvailable) {
var newState = {used: newUsed.toArray(), available: newAvailable.toArray()};
if (this.inputId != null) {
if (this.inputId !== null) {
this.input.value = JSON.stringify(newState);
this.input.dispatchEvent(new Event('change'));
};
}
this.state = newState;
}
......@@ -473,7 +475,7 @@ export const stack_sortable = class {
var li = this._get_moveable_parent_li(e.target);
li = (this.clone === "true") ? li.cloneNode(true) : this.available.removeChild(li);
this.used.append(li);
this.update_state(newUsed, newAvailable)
this.update_state(newUsed, newAvailable);
}
});
this.used.addEventListener('dblclick', (e) => {
......@@ -515,8 +517,8 @@ export const stack_sortable = class {
*/
_generate_state(proofSteps, inputId) {
let stateStore = document.getElementById(inputId);
if (stateStore == null) {
return {used: [], available: [...Object.keys(proofSteps)]}
if (stateStore === null) {
return {used: [], available: [...Object.keys(proofSteps)]};
}
return (stateStore.value && stateStore.value != "") ?
JSON.parse(stateStore.value) :
......@@ -551,12 +553,12 @@ export const stack_sortable = class {
*/
_set_user_options(options) {
var userOptions;
if (options == null) {
if (options === null) {
userOptions = this.defaultOptions;
} else {
userOptions = {used: Object.assign(this.defaultOptions.used, options.used),
available: Object.assign(this.defaultOptions.available, options.available)};
};
}
return userOptions;
}
......
export const SUPPORTED_CALLBACK_FUNCTIONS=["onChoose","onUnchoose","onStart","onEnd","onAdd","onUpdate","onSort","onRemove","onFilter","onMove","onClone","onChange"]
export function preprocess_steps(proofSteps,blockUserOpts,sortableUserOpts){if(typeof proofSteps==="string"){proofSteps=_stackstring_objectify(proofSteps);}
var valid=_validate_parsons_JSON(proofSteps);if(JSON.stringify(Object.keys(proofSteps))===JSON.stringify(["steps","options"])){var userOpts=proofSteps["options"];proofSteps=proofSteps["steps"];if(userOpts.header!=null){blockUserOpts={used:{header:userOpts.header[0]},available:{header:userOpts.header[1]}};}
export const SUPPORTED_CALLBACK_FUNCTIONS=["onChoose","onUnchoose","onStart","onEnd","onAdd","onUpdate","onSort","onRemove","onFilter","onMove","onClone","onChange"];export function preprocess_steps(proofSteps,blockUserOpts,sortableUserOpts){if(typeof proofSteps==="string"){proofSteps=_stackstring_objectify(proofSteps);}
var valid=_validate_parsons_JSON(proofSteps);if(JSON.stringify(Object.keys(proofSteps))===JSON.stringify(["steps","options"])){var userOpts=proofSteps["options"];proofSteps=proofSteps["steps"];if(userOpts.header!==undefined){blockUserOpts={used:{header:userOpts.header[0]},available:{header:userOpts.header[1]}};}
delete userOpts.header;sortableUserOpts={used:userOpts,available:userOpts};}
if(typeof proofSteps==="string"){proofSteps=_stackstring_objectify(proofSteps);}
return[proofSteps,blockUserOpts,sortableUserOpts,valid];}
......@@ -15,22 +14,25 @@ return Object.values(proofSteps).every((val)=>typeof(val)=='string');}
function _flip_orientation(usedId,availableId){var usedList=document.getElementById(usedId);var availableList=document.getElementById(availableId);var newClass=usedList.className=='list-group row'?'list-group col':'list-group row';usedList.setAttribute('class',newClass);availableList.setAttribute('class',newClass);}
export function add_orientation_listener(buttonId,usedId,availableId){const button=document.getElementById(buttonId);button.addEventListener('click',()=>_flip_orientation(usedId,availableId));}
export function get_iframe_height(){return document.documentElement.offsetHeight;}
export const stack_sortable=class{constructor(proofSteps,availableId,usedId,inputId=null,options=null,clone=false){this.proofSteps=proofSteps;this.inputId=inputId;this.state=this._generate_state(this.proofSteps,this.inputId);if(inputId!=null){this.input=document.getElementById(this.inputId);};this.availableId=availableId;this.available=document.getElementById(this.availableId);this.usedId=usedId;this.used=document.getElementById(this.usedId);this.clone=clone
this.defaultOptions={used:{animation:50},available:{animation:50}};this.userOptions=this._set_user_options(options);this.options=this._set_ghostClass_and_group();}
export const stack_sortable=class{constructor(proofSteps,availableId,usedId,inputId=null,options=null,clone=false){this.proofSteps=proofSteps;this.inputId=inputId;this.state=this._generate_state(this.proofSteps,this.inputId);if(inputId!==null){this.input=document.getElementById(this.inputId);}
this.availableId=availableId;this.available=document.getElementById(this.availableId);this.usedId=usedId;this.used=document.getElementById(this.usedId);this.clone=clone;this.defaultOptions={used:{animation:50},available:{animation:50}};this.userOptions=this._set_user_options(options);this.options=this._set_ghostClass_and_group();}
validate_options(possibleOptionKeys,unknownErr,overwrittenErr){var err='';var keysRecognised=true;var invalidKeys=[];Object.keys(this.options.used).forEach(key=>{if(!this._validate_option_key(key,possibleOptionKeys)){keysRecognised=false;if(!invalidKeys.includes(key)){invalidKeys.push(key);}}});Object.keys(this.options.available).forEach(key=>{if(!this._validate_option_key(key,possibleOptionKeys)){keysRecognised=false;if(!invalidKeys.includes(key)){invalidKeys.push(key);}}});if(!keysRecognised){err+=unknownErr+invalidKeys.join(", ")+". ";}
var overwrittenKeys=[];var keysPreserved=true;["ghostClass","group","onSort"].forEach(key=>{if(Object.keys(this.userOptions.used).includes(key)||Object.keys(this.userOptions.available).includes(key))
{keysPreserved=false;overwrittenKeys.push(key);}});if(!keysPreserved){err+=overwrittenErr+overwrittenKeys.join(", ")+".";}
if(!keysRecognised||!keysPreserved){this._display_warning(err);}};generate_available(){this.state.available.forEach(key=>this.available.append(this._create_li(key)));}
if(!keysRecognised||!keysPreserved){this._display_warning(err);}}
generate_available(){this.state.available.forEach(key=>this.available.append(this._create_li(key)));}
generate_used(){this.state.used.forEach(key=>this.used.append(this._create_li(key)));}
add_headers(headers){this.used.append(this._create_header(headers.used.header,"usedHeader"));this.available.append(this._create_header(headers.available.header,"availableHeader"));}
update_state(newUsed,newAvailable){var newState={used:newUsed.toArray(),available:newAvailable.toArray()};if(this.inputId!=null){this.input.value=JSON.stringify(newState);this.input.dispatchEvent(new Event('change'));};this.state=newState;}
add_dblclick_listeners(newUsed,newAvailable){this.available.addEventListener('dblclick',(e)=>{if(this._double_clickable(e.target)){var li=this._get_moveable_parent_li(e.target);li=(this.clone==="true")?li.cloneNode(true):this.available.removeChild(li);this.used.append(li);this.update_state(newUsed,newAvailable)}});this.used.addEventListener('dblclick',(e)=>{if(this._double_clickable(e.target)){var li=this._get_moveable_parent_li(e.target);this.used.removeChild(li);if(this.clone!=="true"){this.available.insertBefore(li,this.available.children[1]);}
update_state(newUsed,newAvailable){var newState={used:newUsed.toArray(),available:newAvailable.toArray()};if(this.inputId!==null){this.input.value=JSON.stringify(newState);this.input.dispatchEvent(new Event('change'));}
this.state=newState;}
add_dblclick_listeners(newUsed,newAvailable){this.available.addEventListener('dblclick',(e)=>{if(this._double_clickable(e.target)){var li=this._get_moveable_parent_li(e.target);li=(this.clone==="true")?li.cloneNode(true):this.available.removeChild(li);this.used.append(li);this.update_state(newUsed,newAvailable);}});this.used.addEventListener('dblclick',(e)=>{if(this._double_clickable(e.target)){var li=this._get_moveable_parent_li(e.target);this.used.removeChild(li);if(this.clone!=="true"){this.available.insertBefore(li,this.available.children[1]);}
this.update_state(newUsed,newAvailable);}});}
add_delete_all_listener(buttonId,newUsed,newAvailable){const button=document.getElementById(buttonId);button.addEventListener('click',()=>{this._delete_all_from_used();this.update_state(newUsed,newAvailable);});}
_generate_state(proofSteps,inputId){let stateStore=document.getElementById(inputId);if(stateStore==null){return{used:[],available:[...Object.keys(proofSteps)]}}
_generate_state(proofSteps,inputId){let stateStore=document.getElementById(inputId);if(stateStore===null){return{used:[],available:[...Object.keys(proofSteps)]};}
return(stateStore.value&&stateStore.value!="")?JSON.parse(stateStore.value):{used:[],available:[...Object.keys(proofSteps)]};}
_validate_option_key(key,possibleOptionKeys){return possibleOptionKeys.includes(key);}
_set_user_options(options){var userOptions;if(options==null){userOptions=this.defaultOptions;}else{userOptions={used:Object.assign(this.defaultOptions.used,options.used),available:Object.assign(this.defaultOptions.available,options.available)};};return userOptions;}
_set_user_options(options){var userOptions;if(options===null){userOptions=this.defaultOptions;}else{userOptions={used:Object.assign(this.defaultOptions.used,options.used),available:Object.assign(this.defaultOptions.available,options.available)};}
return userOptions;}
_set_ghostClass_and_group(){var group_val={used:{name:"sortableUsed",pull:true,put:true}};group_val.available=(this.clone==="true")?{name:"sortableAvailable",pull:"clone",revertClone:true,put:false}:{name:"sortableAvailable",put:true};var options={used:Object.assign(Object.assign({},this.userOptions.used),{ghostClass:"list-group-item-info",group:group_val.used}),available:Object.assign(Object.assign({},this.userOptions.available),{ghostClass:"list-group-item-info",group:group_val.available})};return options;}
_display_warning(msg){var warning=document.createElement("div");warning.className="sortable-warning";var exclamation=document.createElement("i");exclamation.className="icon fa fa-exclamation-circle text-danger fa-fw";warning.append(exclamation);var warningMessage=document.createElement("span");warningMessage.textContent=msg;warning.append(warningMessage);document.body.insertBefore(warning,document.getElementById("sortableContainer"));}
_create_li(proofKey){let li=document.createElement("li");li.innerHTML=this.proofSteps[proofKey];li.setAttribute("data-id",proofKey);li.className="list-group-item";return li;}
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment