our-journey
Version:
Our Journey interactive student journey creator. | © 2018 The Open University (IET-OU).
1,420 lines (1,239 loc) • 103 kB
JavaScript
/*!
* our-journey | 1.6.6
* © 2024 The Open University (IET) | Tim Coughlan {lead}, Glen Darby, Nick Freear | GPL-3.0+.
* Build: 2024-11-25T08:05Z
* https://github.com/IET-OU/our-journey
*/
require=(function(){function r(e,n,t){function o(i,f){if(!n[i]){if(!e[i]){var c="function"==typeof require&&require;if(!f&&c)return c(i,!0);if(u)return u(i,!0);var a=new Error("Cannot find module '"+i+"'");throw a.code="MODULE_NOT_FOUND",a}var p=n[i]={exports:{}};e[i][0].call(p.exports,function(r){var n=e[i][1][r];return o(n||r)},p,p.exports,r,e,n,t)}return n[i].exports}for(var u="function"==typeof require&&require,i=0;i<t.length;i++)o(t[i]);return o}return r})()({1:[function(require,module,exports){
/* Default application | ©The Open University.
*/
module.exports.run = run;
// Run 'check' when Javascript is included, not on 'run()'!
const IS_COMPAT = require('./compat').check();
const CORE = require('./core');
const LAYOUT = require('./layout');
const EVENTS = require('./event');
const SHARE = require('./share-link');
const UI = require('./user-interface');
const UTIL = require('./util');
const VIEWS = require('./views');
function run (config) {
const T_START = Date.now();
console.time('our-journey int');
window.ourJourneySvgLoad = function (ev) {
const T_END = Date.now();
UTIL.config().times = { start: T_START, end: T_END };
console.warn('Svg load, ms:', T_END - T_START, ev);
console.timeLog && console.timeLog('our-journey int');
};
const promise = new Promise(function (resolve, reject) {
if (!IS_COMPAT) {
// This should never be reached!
reject(new Error('our-journey. Browser compatibility error'));
return;
}
const CFG = UTIL.putConfig(config);
console.warn('The our-journey API:', require('../index'), 'config:', CFG);
VIEWS.setup();
console.warn('qs test:', UTIL.qs('#journey-canvas'));
if (CFG.layout === 'scol') {
LAYOUT.setScol();
} else {
LAYOUT.reflow();
}
if (CFG.editor === 'fixed') {
UI.chooseEditor('fixed');
} else {
UI.chooseEditor('float');
}
CORE.initialiseElements(0);
EVENTS.initialise();
if (CFG.demo) {
CORE.demoFill();
UTIL.container().className += ' demo-fill';
}
if (CFG.wholePage) {
document.body.className += ' our-journey-whole-page';
}
CORE.setFocusElement(0);
CORE.changeFocus();
UI.toggleOptions(0);
UI.changeBackground(CFG.background); // Was: 'Wheat'
SHARE.createLink(CORE.getElements());
var loadedJourneyLength = SHARE.loadLink(CORE.getElements());
document.getElementById('group0').focus();
if (loadedJourneyLength > 0) {
// increase length of loaded journey if needed
if (loadedJourneyLength > CORE.getNumElements()) {
var adds = (loadedJourneyLength - CORE.getNumElements()) / 10;
var i;
for (i = 0; i < adds; i++) {
LAYOUT.addElementsToLayout();
}
}
} else {
CORE.editFocus();
}
window.scrollTo(0, 0);
resolve('our-journey: OK');
});
return promise;
}
},{"../index":"our-journey","./compat":3,"./core":5,"./event":7,"./layout":9,"./share-link":16,"./user-interface":17,"./util":18,"./views":19}],2:[function(require,module,exports){
/* Get paths & ALT text for icons & emojis | ©The Open University.
*/
module.exports = {
emoticonCount: emoticonCount,
iconCount: iconCount,
getEmoticonName: getEmoticonName,
getEmoticonPath: getEmoticonPath,
getIconPath: getIconPath,
getIconName: getIconName,
getIconAlt: getIconAlt,
getBackgroundElements: getBackgroundElements,
hasEmoticon: hasEmoticon,
hasIcon: hasIcon
};
const UTIL = require('./util'); // Was: CONFIG = require('./config');
/* eslint-disable */
// Presentation variables
const iconFiles = [ {name: 'achievement', file: 'Achievement_card.png', alt: 'Achievement'}, {name: 'admin', file: 'Admin_card.png', alt: 'Admin and forms'}, {name: 'assessment', file: 'Assessments_card.png', alt: 'Assessment'}, {name: 'barrier', file: 'Barrier_card.png', alt: 'Barrier'}, {name: 'communication', file: 'Communication_card.png', alt: 'Communication'}, {name: 'confidence', file: 'ConfidenceBoost_card.png', alt: 'Confidence boost'}, {name: 'considerstudy', file: 'ConsiderStudy_card.png', alt: 'Considering study'}, {name: 'duedates', file: 'DueDates_card.png', alt: 'Due dates'}, {name: 'employment', file: 'Employment_card.png', alt: 'Jobs and employment'}, {name: 'finances', file: 'Finances_card.png', alt: 'Finances'}, {name: 'helpneeded', file: 'Needed_card.png', alt: 'Help needed'}, {name: 'highpressure', file: 'HighPressure_card.png', alt: 'High pressure'}, {name: 'information', file: 'Information_card.png', alt: 'Finding information'}, {name: 'lostdirection', file: 'LostDirection_card.png', alt: 'Lost direction'}, {name: 'lowenergy', file: 'LowEnergy_card.png', alt: 'Low energy'}, {name: 'lowscores', file: 'LowScores_card.png', alt: 'Low scores'}, {name: 'moving', file: 'Moving_card.png', alt: 'Moving home'}, {name: 'nosupport', file: 'NoSupport_card.png', alt: 'No support'}, {name: 'peersupport', file: 'PeerSupport_card.png', alt: 'Peer support'}, {name: 'problem', file: 'Problem_card.png', alt: 'Problem'}, {name: 'register', file: 'Register_card.png', alt: 'Registering'}, {name: 'repetition', file: 'Repetition_card.png', alt: 'Repetition'}, {name: 'studybreak', file: 'StudyBreak_card.png', alt: 'Break from study'}, {name: 'studyexperience', file: 'StudyExperience_card.png', alt: 'Study experience'}, {name: 'studygoal', file: 'StudyGoal_card.png', alt: 'Goal'}, {name: 'studymilestone', file: 'StudyMilestone_card.png', alt: 'Study milestone'}, {name: 'studysuccess', file: 'StudySuccess_card.png', alt: 'Study success'}, {name: 'studysupport', file: 'StudySupport_card.png', alt: 'Study support'}, {name: 'timelost', file: 'TimeLost_card.png', alt: 'Time lost'} ];
const emoticonFiles = [ {name: 'proud', file: 'Proud_emoji.png'}, {name: 'angry', file: 'Angry_emoji.png'}, {name: 'anxious', file: 'Anxious_emoji.png'}, {name: 'bored', file: 'Bored_emoji.png'}, {name: 'confident', file: 'Confident_emoji.png'}, {name: 'confused', file: 'Confused_emoji.png'}, {name: 'curious', file: 'Curious_emoji.png'}, {name: 'embarrassed', file: 'Embarrassed_emoji.png'}, {name: 'excited', file: 'Excited_emoji.png'}, {name: 'happy', file: 'Happy_emoji.png'}, {name: 'nervous', file: 'Nervous_emoji.png'}, {name: 'scared', file: 'Scared_emoji.png'}, {name: 'unwell', file: 'Unwell_emoji.png'}, {name: 'stressed', file: 'Stressed_emoji.png'}, {name: 'thinking', file: 'Thinking_emoji.png'}, {name: 'tired', file: 'Tired_emoji.png'}, {name: 'unhappy', file: 'Unhappy_emoji.png'}, {name: 'upset', file: 'Upset_emoji.png'} ];
const backgroundElements = ['head_background', 'pencil_background', 'plant_background', 'calc_background', 'biscuits_background', 'glasses_background', 'folder_background', 'coffee_background', 'pens_background', 'graph_background', 'jammie_background', 'pencil_background', 'biscuits_background_2', 'plant_background_2', 'tablet_background', 'calc_background_2', 'tablet_background_2', 'glasses_background_2', 'coffee_background_2', 'pens_background_2', 'folder_background_2', 'graph_background_2', 'jammie_background_2', 'coffee_background_3'];
/* eslint-enable */
const emojiDir = '/emoji/';
const cardDir = '/card/';
function emoticonCount () {
return emoticonFiles.length;
}
function iconCount () {
return iconFiles.length;
}
function getEmoticonPath (j) {
return UTIL.config('assetUrl') + emojiDir + emoticonFiles[ j ].file;
}
function getEmoticonName (j) {
return emoticonFiles[ j ].name;
}
function getIconPath (j) {
return UTIL.config('assetUrl') + cardDir + iconFiles[ j ].file;
}
function getIconName (j) {
return iconFiles[ j ].name;
}
function hasEmoticon (j, element) {
return emoticonFiles[ j ].name === element.emoticon;
}
function hasIcon (j, element) {
return iconFiles[j].name === element.icon;
}
function getIconAlt (j, element) {
return iconFiles[j].alt;
}
function getBackgroundElements () {
return backgroundElements;
}
},{"./util":18}],3:[function(require,module,exports){
/* Browser compatibility | ©The Open University.
*/
module.exports.check = checkAndHandle;
const UA = window.navigator.userAgent;
const DOC = window.document;
const LOC = window.location;
const NO_COMPAT_MSG = [
'<div class="X-ojs-error alert alert-danger" role="alert">',
' <p>Sorry! <i>our-journey</i> does not work on Internet Explorer.</p>',
' <p><a href="https://browsehappy.com">Try a different browser — Browse Happy</a></p>',
'</div>'
];
const COMPAT_REGEX = /(MSIE|Trident\/)/; // Live!
// const COMPAT_REGEX = /(MSIE|Trident\/|Chrome)/; // Test!
function checkAndHandle () {
const IS_COMPAT = (!COMPAT_REGEX.test(UA) || /compatCheck=false/.test(LOC.href));
if (IS_COMPAT) {
console.warn('our-journey. Browser is compatible');
} else {
notCompatibleMessage();
tryHideContainer();
let err = new Error('our-journey. Browser NOT compatible (MSIE ?)');
err.name = 'CompatError';
throw err;
}
return IS_COMPAT;
}
function notCompatibleMessage () {
const DIV = DOC.createElement('div');
DIV.innerHTML = NO_COMPAT_MSG.join('\n');
DIV.className = 'our-journey-js ojs-error ojs-no-compat ojs-msie';
DOC.body.insertBefore(DIV, DOC.body.firstChild);
}
function tryHideContainer () {
// We can't use UTIL.config('container') here, so guess!
const TRY_CTR = DOC.querySelector('#our-journey-tool');
if (TRY_CTR) {
TRY_CTR.style.display = 'none';
}
}
},{}],4:[function(require,module,exports){
/* Default configuration | ©The Open University.
*/
const UTIL = require('./util');
module.exports.DEFAULTS = {
// CSS-style selector for the containing HTML element.
containerSelector: '#our-journey-tool',
// URL to load icons and emoticons from (Default: Unpkg CDN https://unpkg.com/our-journey@^1/assets).
assetUrl: 'https://ourjourney.ac.uk/v1/tool-assets',
// URL of the help page, to use in HTML links.
helpUrl: 'https://ourjourney.ac.uk/v1/help.html',
// @prop {string} privacyUrl Link to a privacy policy, and terms.
privacyUrl: 'https://ourjourney.ac.uk/v1/privacy-ou-generic.html',
// Load a demonstration journey (Default: false)
demo: UTIL.param(/[?&]demo=(1)/, false),
// Use the floating or fixed editor (Default: floating)
editor: UTIL.param(/[?&]edit=(fixed|float)/, 'float'),
// Load a journey. A null (default), base-64 encoded JSON, or an array of journey objects.
journey: UTIL.param(/[?&]j=(base64:[\w%=]+)/),
// Use a single-column or default layout (Default: 'default')
layout: UTIL.param(/[?&]layout=(scol|default)/, 'default'),
// @prop {string} background Set the background colour-name (Default: 'wheat')
// @see {@link https://developer.mozilla.org/en-US/docs/Web/CSS/color_value}
background: UTIL.param(/[?&]bg=([a-z]+)/, 'Wheat'),
// @prop {integer} zoom Set the zoom-level for embeds (50 ... 95)% (Default: 100).
zoom: UTIL.param(/[?&]zoom=([5-9][05])/, 100),
// @prop {boolean} wholePage Does the our-journey tool occupy the whole page? (Default: true)
wholePage: true,
// @readonly {string} version Version.
version: '1.6.6',
// Experimental! Custom events (asynchronous) or callbacks (synchronous) ?
events: [
// Asynchronous custom event fired after each time the share link is re-generated.
'updatesharelink.ourjourney'
],
// Experimental! Synchronous callback fired after each time the share link is re-generated. (Was: 'onRecreate')
onUpdateShareLink: function () {}
};
},{"./util":18}],5:[function(require,module,exports){
/* Core API | ©The Open University.
*/
module.exports = {
// Functions.
initialiseElements: initialiseElements,
updateElements: updateElements,
changeFocus: changeFocus,
demoFill: demoFill,
updateElement: updateElement,
clearElement: clearElement,
moveFwdElement: moveFwdElement,
moveBackElement: moveBackElement,
canvasGotFocus: canvasGotFocus,
canvasLostFocus: canvasLostFocus,
// Properties.
getElements: getElements,
setFocusElement: setFocusElement,
getNumElements: getNumElements,
editFocus: editFocus,
stopFloatingFocus: stopFloatingFocus,
addElements: addElements,
getMaxElements: getMaxElements,
addMoreFocus: addMoreFocus,
setCardColour: setCardColour,
setEmoticonColour: setEmoticonColour,
isPrinting: isPrinting,
cardFocus: cardFocus,
addMoreCardFocus: addMoreCardFocus,
clearFocus: clearFocus,
addCard: addCard,
moveMenuChanged: moveMenuChanged
};
const UI = require('./user-interface');
const ASSET = require('./assets');
const DIM = require('./dimension.json');
const LAYOUT = require('./layout');
const UTIL = require('./util');
// Status variables
var elements = [];
var focusElement = 0;
var canvasInFocus = false;
var floatEditing = false;
var focusOnAddMore = false;
var printed = false;
var cardColour = 'Ivory';
var emoColour = 'White';
// Number of card elements presented in page
var numElements = 15;
var maxElements = 64;
// These variables state which elements are vertical ones for the default layout presentation. On the left (vl) or the right (vr).
var vlElements = [ 0, 9, 10, 19, 20, 29, 30, 39, 40, 49, 50, 59, 60 ];
var vrElements = [ 4, 5, 14, 15, 24, 25, 34, 35, 44, 45, 54, 55, 64 ];
document.addEventListener('keydown', function (event) { // Was: , (event) => {
const keyName = event.key;
var focus = document.activeElement.getAttribute('id');
if (canvasInFocus) {
switch (keyName) {
case 'Enter':
if (focusOnAddMore) {
LAYOUT.addElementsToLayout();
} else if (!floatEditing) {
editFocus();
}
break;
case 'Escape':
if (floatEditing) {
editFocus();
document.getElementById('group' + focusElement).focus();
}
break;
case 'Tab':
if (floatEditing) {
if (focus === 'floating_move_menu') {
if (event.shiftKey === false) {
editFocus();
document.getElementById('group' + focusElement).focus();
}
}
if (focus === 'floating_icon_select') {
if (event.shiftKey === true) {
if (focusElement === 0) {
event.preventDefault();
editFocus();
document.getElementById('help_link').focus();
} else {
editFocus();
document.getElementById('group' + focusElement).focus();
}
}
}
}
}
}
}, false);
window.addEventListener('beforeunload', function (e) {
var confirmationMessage = 'WARNING: If you leave without saving, you will lose changes to your journey.';
(e || window.event).returnValue = confirmationMessage;
return confirmationMessage;
});
function initialiseElements (start) {
for (var i = start; i < numElements; i++) {
var element = { eID: 'place' + i, description: '', emoticon: 'none', icon: 'none', postit: '' };
elements.push(element);
}
updateElements();
}
function demoFill () {
for (var i = 0; i < elements.length; i++) {
elements[i] = { eID: 'place' + i, description: 'test description ' + i, emoticon: 'happy', icon: 'timelost', postit: 'post it text' };
}
updateElements();
}
function elementClick () {
var e = parseInt(this.id.substring(5));
if (e !== focusElement) {
focusElement = e;
if (printed) {
UI.toggleEditor('show');
printed = false;
}
stopFloatingFocus();
} else {
editFocus();
}
}
function cardFocus () {
var e = parseInt(this.id.substring(5));
if (e !== focusElement) {
focusElement = e;
changeFocus();
}
}
function setCardColour (colour) {
cardColour = colour;
updateElements();
document.getElementById('card_colour_select').value = cardColour;
}
function setEmoticonColour (colour) {
emoColour = colour;
updateElements();
document.getElementById('emoticon_colour_select').value = emoColour;
}
function updateElements () {
for (var i = 0; i < numElements; i++) {
var elementGroup = document.getElementById('group' + i);
elementGroup.addEventListener('click', elementClick);
elementGroup.addEventListener('focus', cardFocus);
var card = document.getElementById('place' + i);
var emoticonback = document.getElementById('emoticonback' + i);
card.style.fill = cardColour;
emoticonback.style.fill = emoColour;
if ((LAYOUT.getLayoutStyle() === 'default') && vlElements.includes(i)) {
card.setAttribute('x', DIM.rectXV);
} else {
card.setAttribute('y', DIM.rectY);
}
updateDescription(i);
updateEmoticon(i);
updateIcon(i);
updatePostIt(i);
updateAltText(i);
}
}
function updateDescription (i) {
var eText = document.getElementById('description' + i);
var layout = LAYOUT.getLayoutStyle();
eText.textContent = getElement(i).description;
if ((layout === 'default') && vlElements.includes(i)) {
eText.setAttribute('x', DIM.textXV);
eText.setAttribute('y', DIM.textYV);
} else if ((layout === 'default') && vrElements.includes(i)) {
eText.setAttribute('x', DIM.textXVR);
eText.setAttribute('y', DIM.textYVR);
} else {
eText.setAttribute('x', DIM.textX);
eText.setAttribute('y', DIM.textY);
}
}
function updateEmoticon (i) {
var eEmo = document.getElementById('emoticon' + i);
var emptyEmo = document.getElementById('empty_emoticon');
var emptyEmoText = document.getElementById('empty_emoticon_text');
var backEmo = document.getElementById('emoticonback' + i);
var layoutStyle = LAYOUT.getLayoutStyle();
if (getElement(i).emoticon !== 'none') {
for (var j = 0; j < ASSET.emoticonCount(); j++) {
if (ASSET.hasEmoticon(j, getElement(i))) {
backEmo.setAttribute('visibility', 'visible');
eEmo.setAttribute('height', DIM.emoticonHeight);
eEmo.setAttribute('width', DIM.emoticonWidth);
if ((layoutStyle === 'default') && (vlElements.includes(i))) {
backEmo.setAttribute('cx', DIM.emoticonXV + 36);
backEmo.setAttribute('cy', DIM.emoticonYV + 36);
eEmo.setAttribute('x', DIM.emoticonXV);
eEmo.setAttribute('y', DIM.emoticonYV);
} else if ((layoutStyle === 'default') && (vrElements.includes(i))) {
backEmo.setAttribute('cx', DIM.emoticonXVR + 36);
backEmo.setAttribute('cy', DIM.emoticonYVR + 36);
eEmo.setAttribute('x', DIM.emoticonXVR);
eEmo.setAttribute('y', DIM.emoticonYVR);
} else {
backEmo.setAttribute('cx', DIM.emoticonX + 36);
backEmo.setAttribute('cy', DIM.emoticonY + 36);
eEmo.setAttribute('x', DIM.emoticonX);
eEmo.setAttribute('y', DIM.emoticonY);
}
eEmo.setAttribute('display', 'inline');
eEmo.setAttribute('href', ASSET.getEmoticonPath(j));
eEmo.setAttribute('alt', ASSET.getEmoticonName(j));
emptyEmo.setAttribute('fill-opacity', '0.0');
emptyEmoText.textContent = '';
}
}
} else {
eEmo.setAttribute('display', 'none');
backEmo.setAttribute('visibility', 'collapse');
}
}
function updateIcon (i) {
var eIcon = document.getElementById('icon' + i);
var emptyIcon = document.getElementById('empty_icon');
var emptyIconText = document.getElementById('empty_icon_text');
var layoutStyle = LAYOUT.getLayoutStyle();
if (getElement(i).icon !== 'none') {
for (var j = 0; j < ASSET.iconCount(); j++) {
if (ASSET.hasIcon(j, getElement(i))) {
eIcon.setAttribute('height', DIM.iconHeight);
eIcon.setAttribute('width', DIM.iconWidth);
if ((layoutStyle === 'default') && (vlElements.includes(i))) {
eIcon.setAttribute('x', DIM.iconXV);
eIcon.setAttribute('y', DIM.iconYV);
} else {
eIcon.setAttribute('x', DIM.iconX);
eIcon.setAttribute('y', DIM.iconY);
}
eIcon.setAttribute('display', 'inline');
eIcon.setAttribute('href', ASSET.getIconPath(j));
eIcon.setAttribute('alt', ASSET.getIconName(j));
emptyIcon.setAttribute('fill-opacity', '0.0');
emptyIconText.textContent = '';
}
}
} else {
eIcon.setAttribute('display', 'none');
}
}
function updatePostIt (i) {
var ePostIt = document.getElementById('postit' + i);
var ePostItText = document.getElementById('postittext' + i);
var layoutStyle = LAYOUT.getLayoutStyle();
if (getElement(i).postit !== '') {
ePostIt.setAttribute('visibility', 'visible');
ePostItText.setAttribute('visibility', 'visible');
ePostItText.setAttribute('width', DIM.postitTextWidth);
if (((layoutStyle === 'default') && vlElements.includes(i))) {
ePostIt.setAttribute('y', DIM.postitVY);
ePostIt.setAttribute('x', DIM.postitVX);
ePostItText.setAttribute('y', DIM.postitTextY + DIM.postitVY);
ePostItText.setAttribute('x', DIM.postitTextVX);
ePostItText.setAttribute('y', DIM.postitTextVY);
} else if ((layoutStyle === 'default') && vrElements.includes(i)) {
ePostIt.setAttribute('x', DIM.postitVRX);
ePostIt.setAttribute('y', DIM.postitVRY);
ePostItText.setAttribute('y', DIM.postitTextVRY);
ePostItText.setAttribute('x', DIM.postitTextVRX);
} else if (layoutStyle === 'scol') {
ePostIt.setAttribute('x', DIM.postitScolX);
ePostIt.setAttribute('y', DIM.postitScolY);
ePostItText.setAttribute('y', DIM.postitTextScolY + DIM.postitScolY);
ePostItText.setAttribute('x', DIM.postitTextScolX);
} else if (layoutStyle === 'default') {
ePostIt.setAttribute('x', DIM.postitX);
ePostIt.setAttribute('y', DIM.postitY);
ePostItText.setAttribute('x', DIM.postitTextX);
ePostItText.setAttribute('y', DIM.postitTextY);
}
ePostItText.textContent = getElement(i).postit;
} else {
ePostIt.setAttribute('visibility', 'collapse');
ePostItText.setAttribute('visibility', 'collapse');
}
}
function updateAltText (i) {
var ePlace = document.getElementById('group' + i);
var iconText;
for (var j = 0; j < ASSET.iconCount(); j++) {
if (ASSET.hasIcon(j, getElement(i))) {
iconText = ASSET.getIconAlt(j);
}
}
var alttext = 'Card ' + i + '. Event: ' + iconText + ' : ' + elements[i].description + '. Feeling ' + elements[i].emoticon + '. ' + elements[i].postit;
ePlace.setAttribute('aria-label', alttext);
}
function changeFocus () {
UI.toggleOptions(0);
for (var i = 0; i < elements.length; i++) {
document.getElementById(elements[i].eID).setAttribute('class', 'not-focussed');
}
document.getElementById(elements[focusElement].eID).setAttribute('class', 'focussed');
document.getElementById('group' + focusElement).focus();
if (UI.getEditor() === 'fixed') {
document.getElementById('event_desc').value = elements[focusElement].description;
document.getElementById('icon_select').value = elements[focusElement].icon;
document.getElementById('emoticon_select').value = elements[focusElement].emoticon;
document.getElementById('post_it_text').value = elements[focusElement].postit;
document.getElementById('title').innerHTML = 'Journey Editor: Card ' + focusElement;
} else if (UI.getEditor() === 'float') {
stopFloatingFocus();
addMoreFocus(false);
}
if (focusElement !== -1) {
var focusY = document.getElementById('group' + focusElement).getAttribute('y');
window.scrollTo(window.scrollX, focusY - 200);
}
}
function clearFocus () {
focusElement = -1;
for (var i = 0; i < elements.length; i++) {
document.getElementById(elements[i].eID).setAttribute('class', 'not-focussed');
}
}
function addMoreCardFocus () {
// - Needs improvement - tab focus does not remove focus from previous element
focusOnAddMore = true;
focusElement = -1;
// addMoreFocus(true);
// changeFocus();
var focusY = UTIL.qs('#add_more_card').getAttribute('y');
window.scrollTo(0, focusY);
}
function addMoreFocus (focusin) {
if (focusin) {
UTIL.qs('#add_more_rect').setAttribute('class', 'focussed');
// -causes loop? updateElements();
} else {
UTIL.qs('#add_more_rect').setAttribute('class', 'not-focussed');
focusOnAddMore = false;
}
}
function stopFloatingFocus () {
UTIL.qs('#floating_editor').setAttribute('visibility', 'collapse');
floatEditing = false;
}
function editFocus () {
const FL_EDITOR = UTIL.qs('#floating_editor');
const FL_ED_OUTLINE = UTIL.qs('#floating_editor_outline');
const FL_ICON = UTIL.qs('#floating_icon');
const FL_EMOJI = UTIL.qs('#floating_emoticon');
const FL_DESC = UTIL.qs('#floating_desc');
const FL_POST = UTIL.qs('#floating_post');
const EM_ICON = UTIL.qs('#empty_icon');
const EM_EMOJI = UTIL.qs('#empty_emoticon');
const FL_MOVE = UTIL.qs('#floating_move');
const FOCUS_EL = LAYOUT.getLayoutData()[ LAYOUT.getLayout() ][ focusElement ];
// let newX;
let newY;
if (UI.getEditor() === 'float') {
if (floatEditing) {
stopFloatingFocus();
} else {
if (LAYOUT.getLayoutStyle() === 'scol') {
newY = (focusElement * 130) + 170;
FL_EDITOR.setAttribute('x', '0');
FL_EDITOR.setAttribute('y', newY);
FL_EDITOR.setAttribute('visibility', 'visible');
} else if (LAYOUT.getLayoutStyle() === 'default') {
FL_EDITOR.setAttribute('x', FOCUS_EL[ '{x}' ]);
FL_EDITOR.setAttribute('y', FOCUS_EL[ '{y}' ]);
FL_EDITOR.setAttribute('visibility', 'visible');
if (vlElements.includes(focusElement)) {
FL_ED_OUTLINE.setAttribute('width', DIM.floatEditOutlineVW);
FL_ED_OUTLINE.setAttribute('height', DIM.floatEditOutlineVH);
FL_ED_OUTLINE.setAttribute('x', DIM.floatEditOutlineVX);
FL_ED_OUTLINE.setAttribute('y', DIM.floatEditOutlineVY);
FL_ICON.setAttribute('x', DIM.floatEditIconVX);
FL_ICON.setAttribute('y', DIM.floatEditIconVY);
FL_EMOJI.setAttribute('x', DIM.floatEditEmoVX);
FL_EMOJI.setAttribute('y', DIM.floatEditEmoVY);
FL_DESC.setAttribute('x', DIM.floatEditDescVX);
FL_DESC.setAttribute('y', DIM.floatEditDescVY);
EM_ICON.setAttribute('x', DIM.floatEmptyIconVX);
EM_ICON.setAttribute('y', DIM.floatEmptyIconVY);
EM_EMOJI.setAttribute('x', DIM.floatEmptyEmoVX);
EM_EMOJI.setAttribute('y', DIM.floatEmptyEmoVY);
FL_POST.setAttribute('x', DIM.floatPostItVX);
FL_POST.setAttribute('y', DIM.floatPostItVY);
FL_MOVE.setAttribute('x', DIM.floatMoveMenuVX);
FL_MOVE.setAttribute('y', DIM.floatMoveMenuVY);
} else if (vrElements.includes(focusElement)) {
FL_ED_OUTLINE.setAttribute('width', DIM.floatEditOutlineVRW);
FL_ED_OUTLINE.setAttribute('height', DIM.floatEditOutlineVRH);
FL_ED_OUTLINE.setAttribute('x', DIM.floatEditOutlineVRX);
FL_ED_OUTLINE.setAttribute('y', DIM.floatEditOutlineVRY);
FL_ICON.setAttribute('x', DIM.floatEditIconVRX);
FL_ICON.setAttribute('y', DIM.floatEditIconVRY);
FL_EMOJI.setAttribute('x', DIM.floatEditEmoVRX);
FL_EMOJI.setAttribute('y', DIM.floatEditEmoVRY);
FL_DESC.setAttribute('x', DIM.floatEditDescVRX);
FL_DESC.setAttribute('y', DIM.floatEditDescVRY);
EM_ICON.setAttribute('x', DIM.floatEmptyIconVRX);
EM_ICON.setAttribute('y', DIM.floatEmptyIconVRY);
EM_EMOJI.setAttribute('x', DIM.floatEmptyEmoVRX);
EM_EMOJI.setAttribute('y', DIM.floatEmptyEmoVRY);
FL_POST.setAttribute('x', DIM.floatPostItVRX);
FL_POST.setAttribute('y', DIM.floatPostItVRY);
FL_MOVE.setAttribute('x', DIM.floatMoveMenuVRX);
FL_MOVE.setAttribute('y', DIM.floatMoveMenuVRY);
} else {
FL_ED_OUTLINE.setAttribute('width', DIM.floatEditOutlineW);
FL_ED_OUTLINE.setAttribute('height', DIM.floatEditOutlineH);
FL_ED_OUTLINE.setAttribute('x', DIM.floatEditOutlineX);
FL_ED_OUTLINE.setAttribute('y', DIM.floatEditOutlineY);
FL_ICON.setAttribute('x', DIM.floatEditIconX);
FL_ICON.setAttribute('y', DIM.floatEditIconY);
FL_EMOJI.setAttribute('x', DIM.floatEditEmoX);
FL_EMOJI.setAttribute('y', DIM.floatEditEmoY);
FL_DESC.setAttribute('x', DIM.floatEditDescX);
FL_DESC.setAttribute('y', DIM.floatEditDescY);
EM_ICON.setAttribute('x', DIM.floatEmptyIconX);
EM_ICON.setAttribute('y', DIM.floatEmptyIconY);
EM_EMOJI.setAttribute('x', DIM.floatEmptyEmoX);
EM_EMOJI.setAttribute('y', DIM.floatEmptyEmoY);
FL_POST.setAttribute('x', DIM.floatPostItX);
FL_POST.setAttribute('y', DIM.floatPostItY);
FL_MOVE.setAttribute('x', DIM.floatMoveMenuX);
FL_MOVE.setAttribute('y', DIM.floatMoveMenuY);
}
}
const ICON_VALUE = elements[focusElement].icon;
const EMO_VALUE = elements[focusElement].emoticon;
const emptyIconText = UTIL.qs('#empty_icon_text');
const emptyEmoText = UTIL.qs('#empty_emoticon_text');
UTIL.qs('#floating_icon_select').value = ICON_VALUE;
if (ICON_VALUE === 'none') {
EM_ICON.setAttribute('fill-opacity', '0.9');
emptyIconText.textContent = '1. What happened?';
} else {
EM_ICON.setAttribute('fill-opacity', '0.0');
emptyIconText.textContent = '';
}
UTIL.qs('#floating_emoticon_select').value = EMO_VALUE;
if (EMO_VALUE === 'none') {
EM_EMOJI.setAttribute('fill-opacity', '0.9');
emptyEmoText.textContent = '3. How did you feel?';
} else {
EM_EMOJI.setAttribute('fill-opacity', '0.0');
emptyEmoText.textContent = '';
}
UTIL.qs('#floating_event_desc').value = elements[focusElement].description;
UTIL.qs('#floating_post_it_text').value = elements[focusElement].postit;
floatEditing = true;
UTIL.qs('#floating_icon_select').focus();
}
} else if (UI.getEditor() === 'fixed') {
UTIL.qs('#event_desc').focus();
}
}
function canvasGotFocus () {
canvasInFocus = true;
}
function canvasLostFocus () {
canvasInFocus = false;
}
function updateElement () {
if (UI.getEditor() === 'fixed') {
elements[focusElement].description = document.getElementById('event_desc').value;
elements[focusElement].icon = document.getElementById('icon_select').value;
elements[focusElement].emoticon = document.getElementById('emoticon_select').value;
elements[focusElement].postit = document.getElementById('post_it_text').value;
} else if (UI.getEditor() === 'float') {
elements[focusElement].icon = document.getElementById('floating_icon_select').value;
elements[focusElement].emoticon = document.getElementById('floating_emoticon_select').value;
elements[focusElement].description = document.getElementById('floating_event_desc').value;
elements[focusElement].postit = document.getElementById('floating_post_it_text').value;
}
updateElements();
}
function clearElement () {
// clears the information contained in the focused on element.
elements[focusElement] = { eID: 'place' + focusElement, description: '', emoticon: 'none', icon: 'none', postit: '' };
updateElements();
changeFocus();
}
function moveMenuChanged () {
var itemSelected = UTIL.qs('#floating_move_menu');
if (itemSelected.value === 'SwapBack') {
moveBackElement();
} else if (itemSelected.value === 'SwapFwd') {
moveFwdElement();
} else if (itemSelected.value === 'AddNew') {
addCard();
}
itemSelected.value = 'Move';
}
function moveBackElement () {
// moves the focused on element back towards the start
if (focusElement > 0) {
// swap the elements
var swap = elements[focusElement - 1];
elements[focusElement - 1] = elements[focusElement];
elements[focusElement] = swap;
// swap the eID strings for the elements to maintain correct link to the locations
var swapeIDfore = elements[focusElement].eID;
var swapeIDback = elements[focusElement - 1].eID;
elements[focusElement - 1].eID = swapeIDfore;
elements[focusElement].eID = swapeIDback;
// return focus to the same element as at the start of this process
focusElement--;
changeFocus();
editFocus();
}
updateElements();
}
function moveFwdElement () {
// moves the focused on element forward from its current position
if (focusElement < (elements.length - 1)) {
// swap the elements
var swap = elements[focusElement + 1];
elements[focusElement + 1] = elements[focusElement];
elements[focusElement] = swap;
// swap the eID strings for the elements to maintain correct link to the locations
var swapeIDfore = elements[focusElement].eID;
var swapeIDback = elements[focusElement + 1].eID;
elements[focusElement + 1].eID = swapeIDfore;
elements[focusElement].eID = swapeIDback;
focusElement++;
changeFocus();
editFocus();
}
updateElements();
}
function addCard () {
// adds in a new card after the one currently in focus
if (focusElement < (maxElements - 1)) {
// check if last card is used, if so, extend number of cards (if not already at maximum)
if ((elements[elements.length - 1].icon !== 'none') || (elements[elements.length - 1].description !== '') || (elements[elements.length - 1].emoticon !== 'none') || (elements[elements.length - 1].postit !== '')) {
if (elements.length < maxElements) {
LAYOUT.addElementsToLayout();
} else {
// TODO: alert the user to failure?
return;
}
}
// loop through all cards and move them forward one in the list
for (var i = elements.length - 2; i > focusElement; i--) {
elements[i + 1] = elements[i];
elements[i + 1].eID = 'place' + (i + 1);
}
// add the new card into place
elements[focusElement + 1] = { eID: 'place' + (focusElement + 1), description: '', emoticon: 'none', icon: 'none', postit: '' };
}
updateElements();
}
function setFocusElement (num) {
focusElement = num;
}
function getElements () {
return elements;
}
function getElement (idx) {
return elements[ idx ];
}
function getNumElements () {
return numElements;
}
function addElements (addition) {
numElements = numElements + addition;
}
function getMaxElements () {
return maxElements;
}
function isPrinting () {
printed = true;
}
},{"./assets":2,"./dimension.json":6,"./layout":9,"./user-interface":17,"./util":18}],6:[function(require,module,exports){
module.exports={
"#": "Sizes & positions of card and Post-it components.",
"iconWidth": 111,
"iconHeight": 111,
"iconXV": 110,
"iconYV": 5,
"iconX": 10,
"iconY": 110,
"emoticonWidth": 72,
"emoticonHeight": 72,
"emoticonXV": 30,
"emoticonYV": 160,
"emoticonXVR": 130,
"emoticonYVR": 262,
"emoticonX": 145,
"emoticonY": 215,
"textXV": 108,
"textYV": 120,
"textXVR": 8,
"textYVR": 225,
"textX": 122,
"textY": 108,
"rectY": 100,
"rectXV": 100,
"postitX": 72,
"postitY": 12,
"postitVX": 7,
"postitVY": 40,
"postitVRY": 150,
"postitVRX": 125,
"postitTextX": 78,
"postitTextVX": 12,
"postitTextVRX": 130,
"postitTextY": 27,
"postitTextVY": 57,
"postitTextVRY": 167,
"postitTextWidth": 85,
"postitScolX": 245,
"postitTextScolX": 250,
"postitScolY": 100,
"postitTextScolY": 15,
"floatEditOutlineW": 240,
"floatEditOutlineH": 165,
"floatEditOutlineVW": 140,
"floatEditOutlineVH": 270,
"floatEditOutlineX": 0,
"floatEditOutlineY": 95,
"floatEditOutlineVX": 95,
"floatEditOutlineVY": 0,
"floatEditIconVX": 110,
"floatEditIconVY": 90,
"floatEditIconX": 10,
"floatEditIconY": 195,
"floatEditEmoVX": 10,
"floatEditEmoVY": 240,
"floatEditEmoX": 125,
"floatEditEmoY": 300,
"floatEditDescX": 125,
"floatEditDescY": 105,
"floatEditDescVX": 110,
"floatEditDescVY": 120,
"floatEmptyIconVX": 110,
"floatEmptyIconVY": 5,
"floatEmptyIconX": 10,
"floatEmptyIconY": 105,
"floatEmptyEmoVX": 21,
"floatEmptyEmoVY": 150,
"floatEmptyEmoX": 135,
"floatEmptyEmoY": 205,
"floatBackX": 0,
"floatBackY": 68,
"floatFwdX": 30,
"floatFwdY": 68,
"floatBackVX": 40,
"floatBackVY": 0,
"floatFwdVX": 70,
"floatFwdVY": 0,
"floatPostItX": 77,
"floatPostItY": 30,
"floatPostItVX": 5,
"floatPostItVY": 50,
"floatPostItVRX": 130,
"floatPostItVRY": 178,
"floatEditOutlineVRW": 140,
"floatEditOutlineVRH": 270,
"floatEditOutlineVRX": 95,
"floatEditOutlineVRY": 0,
"floatEditIconVRX": 10,
"floatEditIconVRY": 195,
"floatEditEmoVRX": 110,
"floatEditEmoVRY": 342,
"floatEditDescVRX": 10,
"floatEditDescVRY": 225,
"floatEmptyIconVRX": 10,
"floatEmptyIconVRY": 105,
"floatEmptyEmoVRX": 120,
"floatEmptyEmoVRY": 252,
"floatBackVRX": 135,
"floatBackVRY": 100,
"floatFwdVRX": 165,
"floatFwdVRY": 100,
"floatAddButtonX": 215,
"floatAddButtonY": 68,
"floatAddButtonVX": 100,
"floatAddButtonVY": 205,
"floatAddButtonVRX": 135,
"floatAddButtonVRY": 310,
"floatMoveMenuX": 175,
"floatMoveMenuY": 70,
"floatMoveMenuVX": 25,
"floatMoveMenuVY": 5,
"floatMoveMenuVRX": 133,
"floatMoveMenuVRY": 95
}
},{}],7:[function(require,module,exports){
/*!
Setup form & SVG 'canvas' event handlers | © 2018 The Open University (IET-OU).
*/
module.exports = {
initialise: initialiseEventHandlers
};
const CORE = require('./core');
const FILE = require('./file');
const UI = require('./user-interface');
const LAYOUT = require('./layout');
const SHARE = require('./share-link');
// Initialises the event handlers for form submit buttons.
function initialiseEventHandlers () {
attachEvent('#updateform', 'submit', function (e) {
e.preventDefault();
CORE.updateElement();
});
attachEvent('#deleteform', 'submit', function (e) {
e.preventDefault();
CORE.clearElement();
});
attachEvent('#backform', 'submit', function (e) {
e.preventDefault();
CORE.moveBackElement();
});
attachEvent('#forwardform', 'submit', function (e) {
e.preventDefault();
CORE.moveFwdElement();
});
attachEvent('#floating_move_menu', 'change', function (e) {
e.preventDefault();
CORE.moveMenuChanged();
});
attachEvent('#optionsform', 'submit', function (e) {
e.preventDefault();
UI.toggleOptions();
// SHARE.createLink();
});
attachEvent('#float_optionsform', 'submit', function (e) {
e.preventDefault();
UI.toggleOptions();
SHARE.createLink();
});
attachEvent('#background_select', 'change', function (e) {
e.preventDefault();
UI.changeBackground();
});
attachEvent('#background_elements_select', 'change', function (e) {
e.preventDefault();
UI.changeBackgroundElements();
});
attachEvent('#card_colour_select', 'change', function (e) {
e.preventDefault();
UI.changeCardColour();
});
attachEvent('#emoticon_colour_select', 'change', function (e) {
e.preventDefault();
UI.changeEmoticonColour();
});
attachEvent('#printform', 'submit', function (e) {
e.preventDefault();
UI.printJourney();
});
attachEvent('#loadform', 'submit', function (e) {
e.preventDefault();
FILE.loadJourney();
});
attachEvent('#float_simplesaveform', 'submit', function (e) {
e.preventDefault();
FILE.saveJourney();
});
attachEvent('#saveform', 'submit', function (e) {
e.preventDefault();
FILE.saveJourney();
});
attachEvent('#journey-canvas', 'focusin', function (e) {
CORE.canvasGotFocus();
});
attachEvent('#journey-canvas', 'focusout', function (e) {
CORE.canvasLostFocus();
});
attachEvent('#floating_icon_select', 'change', function (e) {
CORE.updateElement();
});
attachEvent('#floating_emoticon_select', 'change', function (e) {
CORE.updateElement();
});
attachEvent('#floating_event_desc', 'change', function (e) {
CORE.updateElement();
});
attachEvent('#floating_post_it_text', 'change', function (e) {
CORE.updateElement();
});
attachEvent('#icon_select', 'change', function (e) {
CORE.updateElement();
});
attachEvent('#emoticon_select', 'change', function (e) {
CORE.updateElement();
});
attachEvent('#event_desc', 'keyup', function (e) {
CORE.updateElement();
});
attachEvent('#post_it_text', 'keyup', function (e) {
CORE.updateElement();
});
attachEvent('#add_more_rect', 'click', function (e) {
LAYOUT.addElementsToLayout();
});
attachEvent('#add_more_img', 'click', function (e) {
LAYOUT.addElementsToLayout();
});
attachEvent('#add_more_card', 'focusin', function (e) {
CORE.addMoreCardFocus();
});
attachEvent('#journey-background', 'click', function (e) {
UI.toggleOptions(0);
CORE.stopFloatingFocus();
});
}
function attachEvent (selector, eventName, callback) {
document.querySelector(selector).addEventListener(eventName, function (ev) {
callback(ev);
});
}
},{"./core":5,"./file":8,"./layout":9,"./share-link":16,"./user-interface":17}],8:[function(require,module,exports){
/*!
Save and load journeys to file, in the browser. | © 2018 The Open University (IET-OU).
*/
module.exports = {
saveJourneyJson: saveJourneyJson, // Was: saveJourney()
saveJourney: saveJourneyHtml,
loadJourney: loadJourney
};
const CORE = require('./core');
const LAYOUT = require('./layout');
const VIEW = require('./views');
const alert = window.alert;
const FileReader = window.FileReader;
function saveJourneyHtml () {
var savebutton = document.getElementById('float_simplesavebutton');
savebutton.value = 'Saving...';
const FILE_NAME = document.getElementById('filenamearea').value + '.html';
const DATA = VIEW.getRedirectHtml();
let anchor = document.createElement('a');
anchor.setAttribute('href', 'data:text/html;charset=utf-u,' + encodeURIComponent(DATA));
anchor.setAttribute('download', FILE_NAME);
anchor.click();
savebutton.value = 'Save';
}
function saveJourneyJson () {
var filename = document.getElementById('filenamearea').value + '.json';
// Pretty print JSON.
var data = JSON.stringify(CORE.getElements(), null, 2);
var a = document.createElement('a');
a.setAttribute('href', 'data:text/plain;charset=utf-u,' + encodeURIComponent(data));
a.setAttribute('download', filename);
a.click();
}
function loadJourney () {
var input, file, fr;
if (typeof FileReader !== 'function') {
alert("The file API isn't supported on this browser yet.");
return;
}
input = document.getElementById('fileinput');
if (!input) {
alert("Couldn't find the fileinput element.");
} else if (!input.files) {
alert("This browser doesn't seem to support the `files` property of file inputs.");
} else if (!input.files[0]) {
alert("Please select a file before clicking 'Load'");
} else {
file = input.files[0];
fr = new FileReader();
fr.onload = receivedText;
fr.readAsText(file);
}
}
function receivedText (ev) {
let lines = ev.target.result;
const newArr = JSON.parse(lines);
var elements = CORE.getElements();
var additionalElements = newArr.length - CORE.getNumElements();
if (additionalElements > 0) {
var addIterations = additionalElements / 10;
for (var j = 0; j < addIterations; j++) {
LAYOUT.addElementsToLayout();
}
}
for (var i = 0; i < newArr.length; i++) {
elements[i] = { eID: newArr[i].eID, description: newArr[i].description, emoticon: newArr[i].emoticon, icon: newArr[i].icon, postit: newArr[i].postit };
}
CORE.updateElements();
}
},{"./core":5,"./layout":9,"./views":19}],9:[function(require,module,exports){
/* Layout the SVG journey cards | ©The Open University.
*/
module.exports = {
reflow: reflow,
getLayout: getLayout,
getLayoutData: getLayoutData,
addElementsToLayout: addElementsToLayout,
setScol: setScol,
getLayoutStyle: getLayoutStyle
};
const LAYOUTS = require('./layouts.json');
const SVG_TEMPLATE = require('./views').cardTemplate;
const HOLDER_SELECTOR = '#journey-canvas .card-holder';
const CORE = require('./core');
const UI = require('./user-interface');
const UTIL = require('./util');
var layoutStyle = 'default';
var setLayout = 'default';
function setScol () {
layoutStyle = 'scol';
setLayout = 'scol';
document.getElementById('journey-canvas').setAttribute('height', '2400');
document.getElementById('journey-canvas').setAttribute('width', '500');
reflow(setLayout);
UI.chooseEditor('float');
UI.changeBackgroundElements('none');
document.getElementById('journey_logo').setAttribute('visibility', 'collapse');
document.getElementById('add_more_card').setAttribute('x', 55);
document.getElementById('start_point').setAttribute('visibility', 'collapse');
document.getElementById('scol_start_point').setAttribute('visibility', 'visible');
}
function reflow (layout) {
layout = layout || 'default';
const HOLDER = UTIL.qs(HOLDER_SELECTOR);
console.warn('layout:', layout, LAYOUTS[ layout ], /* SVG_TEMPLATE, */ HOLDER);
let cards = [];
if (layout === 'scol') {
var scolLayout = [];
for (var i = 0; i < CORE.getNumElements(); i++) {
scolLayout.push({ '{j}': i, '{x}': 0, '{y}': (i * 130) + 70, '{w}': 240, '{h}': 130, '{orient}': 'horiz' });
}
scolLayout.forEach(function (elem) {
elem[ '{assets}' ] = UTIL.config('assetUrl');
cards.push(UTIL.replace(SVG_TEMPLATE, elem));
});
document.getElementById('add_more_card').setAttribute('y', (CORE.getNumElements() * 130) + 170);
} else {
LAYOUTS[ layout ].forEach(function (elem) {
if (elem[ '{orient}' ] === 'vert') {
elem[ '{w}' ] = 130;
elem[ '{h}' ] = 240;
} else {
elem[ '{w}' ] = 240;
elem[ '{h}' ] = 130;
}
elem[ '{assets}' ] = UTIL.config('assetUrl');
cards.push(UTIL.replace(SVG_TEMPLATE, elem));
});
document.getElementById('scol_start_point').setAttribute('visibility', 'collapse');
}
HOLDER.innerHTML = cards.join('\n');
}
function addElementsToLayout () {
if (CORE.getNumElements() < CORE.getMaxElements()) {
var numExistingElements = CORE.getNumElements();
var newHeight;
var newAddMoreY;
CORE.addElements(10);
if (layoutStyle === 'default') {
setLayout = 'default' + CORE.getNumElements();
reflow(setLayout);
newHeight = parseInt(document.getElementById('journey-canvas').getAttribute('height')) + 720;
if (CORE.getNumElements() < CORE.getMaxElements()) {
newAddMoreY = parseInt(document.getElementById('add_more_card').getAttribute('y')) + 710;
document.getElementById('add_more_card').setAttribute('y', newAddMoreY);
} else {
document.getElementById('add_more_card').setAttribute('visibility', 'collapse');
}
} else if (layoutStyle === 'scol') {
reflow('scol');
newHeight = parseInt(document.getElementById('journey-canvas').getAttribute('height')) + 1400;
if (CORE.getNumElements() < CORE.getMaxElements()) {
newAddMoreY = parseInt(document.getElementById('add_more_card').getAttribute('y'));
document.getElementById('add_more_card').setAttribute('y', newAddMoreY);
} else {
document.getElementById('add_more_card').setAttribute('visibility', 'collapse');
}
}
document.getElementById('journey-canvas').setAttribute('height', newHeight);
document.getElementById('journey-background').setAttribute('height', newHeight);
CORE.initialiseElements(numExistingElements);
}
}
function getLayout () {
return setLayout;
}
function getLayoutStyle () {
return layoutStyle;
}
function getLayoutData () {
return LAYOUTS;
}
},{"./core":5,"./layouts.json":10,"./user-interface":17,"./util":18,"./views":19}],10:[function(require,module,exports){
module.exports={
"#": "Position data for the SVG cards.",
"default": [
{ "{j}": 0, "{x}": 20, "{y}": 285, "{orient}": "vert" },
{ "{j}": 1, "{x}": 255, "{y}": 295, "{orient}": "horiz" },
{ "{j}": 2, "{x}": 500, "{y}": 295, "{orient}": "horiz" },
{ "{j}": 3, "{x}": 745, "{y}": 295, "{orient}": "horiz" },
{ "{j}": 4, "{x}": 990, "{y}": 295, "{orient}": "vert" },
{ "{j}": 5, "{x}": 990, "{y}": 540, "{orient}": "vert" },
{ "{j}": 6, "{x}": 745, "{y}": 650, "{orient}": "horiz" },
{ "{j}": 7, "{x}": 500, "{y}": 650, "{orient}": "horiz" },
{ "{j}": 8, "{x}": 255, "{y}": 650, "{orient}": "horiz" },
{ "{j}": 9, "{x}": 20, "{y}": 750, "{orient}": "vert" },
{ "{j}": 10, "{x}": 20, "{y}": 995, "{orient}": "vert" },
{ "{j}": 11, "{x}": 255, "{y}": 1005, "{orient}": "horiz" },
{ "{j}": 12, "{x}": 500, "{y}": 1005, "{orient}": "horiz" },
{ "{j}": 13, "{x}": 745, "{y}": 1005, "{orient}": "horiz" },
{ "{j}": 14, "{x}": 990, "{y}": 1005, "{orient}": "vert" }
],
"default25": [
{ "{j}": 0, "{x}": 20, "{y}": 285, "{orient}": "vert" },
{ "{j}": 1, "{x}": 255, "{y}": 295, "{orient}": "horiz" },
{ "{j}": 2, "{x}": 500, "{y}": 295, "{orient}": "horiz" },
{ "{j}": 3, "{x}": 745, "{y}": 295, "{orient}": "horiz" },
{ "{j}": 4, "{x}": 990, "{y}": 295, "{orient}": "vert" },
{ "{j}": 5, "{x}": 990, "{y}": 540, "{orient}": "vert" },
{ "{j}": 6, "{x}": 745, "{y}": 650, "{orient}": "horiz" },
{ "{j}": 7, "{x}": 500, "{y}": 650, "{orient}": "horiz" },
{ "{j}": 8, "{x}": 255, "{y}": 650, "{orient}": "horiz" },
{ "{j}": 9, "{x}": 20, "{y}": 750, "{orient}": "vert" },
{ "{j}": 10, "{x}": 20, "{y}": 995, "{orient}": "vert" },
{ "{j}": 11, "{x}": 255, "{y}": 1005, "{orient}": "horiz" },
{ "{j}": 12, "{x}": 500, "{y}": 1005, "{orient}": "horiz" },
{ "{j}": 13, "{x}": 745, "{y}": 1005, "{orient}": "horiz" },
{ "{j}": 14, "{x}": 990, "{y}": 1005, "{orient}": "vert" },
{ "{j}": 15, "{x