Global

Members

(constant) MIN_WIDTH

Description:
  • set the size of the nodes proportional to the selected metric

Source:

set the size of the nodes proportional to the selected metric

(constant) SHORTLABELLEN

Description:
  • shorten the label if necessary and add an ellipsis

Source:

shorten the label if necessary and add an ellipsis

(constant) bigWidth

Description:
  • save the map as a PNG image file

Source:

save the map as a PNG image file

inAddMode :string|boolean

Source:
Type:
  • string | boolean

legendData

Description:
  • Draw the legend floating above the 3d display

Source:

Draw the legend floating above the 3d display

(constant) makeColor

Description:
  • closure to generate a sequence of colours (as rgb strings, e.g. 'rgb(246,121,16)') based on https://krazydad.com/tutorials/makecolors.php

Source:

closure to generate a sequence of colours (as rgb strings, e.g. 'rgb(246,121,16)') based on https://krazydad.com/tutorials/makecolors.php

oldUserNames

Description:
  • Create a set of options for the select menu of the currently online users

Source:

Create a set of options for the select menu of the currently online users

portrait

Description:
  • Hack to get window size when orientation changes. Should use screen.orientation, but this is not implemented by Safari

Source:

Hack to get window size when orientation changes. Should use screen.orientation, but this is not implemented by Safari

(constant) resizeBox

Description:
  • ImageHandler works differently. The image is read from a file and put into a element as a dataURI. When the user is satisfied, indicated by clicking outside the image, it is drawn on the main canvas.

    Selecting the file is handled within the selectTool fn, not here, because of the restriction that file dialogs can only be opended from direct user action.

Source:

ImageHandler works differently. The image is read from a file and put into a element as a dataURI. When the user is satisfied, indicated by clicking outside the image, it is drawn on the main canvas.

Selecting the file is handled within the selectTool fn, not here, because of the restriction that file dialogs can only be opended from direct user action.

startzoom

Description:
  • zoom using a pinch/zoom gesture on a tablet note the starting point

Source:

zoom using a pinch/zoom gesture on a tablet note the starting point

Methods

DOMtoCanvasX()

Description:
  • allow for the canvas being translated, returning a coordinate adjusted for the current translation and zoom, so that it is relative to the origin at the centre with scale = 1.

Source:

addColumn()

Description:
  • user has clicked the button to add a column for a user-defined attribute

Source:

addContextMenu(elem, menu)

Description:
  • Create a context menu that pops up when elem is right clicked

Source:
Parameters:
Name Type Description
elem HTMLElement

click this to get a context menu

menu array

array of menu options: ([{label: string, action: function to call when this option selected} {...}])

addEventListeners()

Description:
  • Set up all the permanent event listeners

Source:

addLabel(item, cancelAction, callback)

Description:
  • A factor is being created: get its label from the user

Source:
Parameters:
Name Type Description
item Object

the node

cancelAction function
callback function

(async) addRollbackIcon(e)

Description:
  • add a button for rolling back if there is state data corresponding to this log record

Source:
Parameters:
Name Type Description
e HTMLElement

history record

addVec(v1, v2) → {array}

Description:
  • v1 + v2

Source:
Parameters:
Name Type Description
v1 array
v2 array
Returns:
Type
array

analyse()

Description:
  • Hide factors and links to show only those closest to the selected factors and/or those up/downstream and/or those on paths between the selected factors

Source:

anon()

Description:
  • anonymise a map by removing all user names

Source:

antMarch(left, top, width, height)

Description:
  • draw 'marching ants' around a rectangle

Source:
Parameters:
Name Type Description
left Number
top Number
width Number
height Number

applyOptions(ctx, options)

Description:
  • apply the canvas options to the context

Source:
Parameters:
Name Type Description
ctx CanvasRenderingContext2D
options object

object with options as properties

arrayBufferToString(contents)

Description:
  • convert an ArrayBuffer to String

Source:
Parameters:
Name Type Description
contents arrayBuffer
Returns:

string

asleep(isSleeping)

Description:
  • Set the awareness local state to show whether this client is sleeping (no mouse movement for 15 minutes)

Source:
Parameters:
Name Type Description
isSleeping Boolean

autoLayout()

Description:
  • Choose and apply a layout algorithm

Source:

buttonIsDisabled(id)

Description:
  • Returns true if the button is not disabled

Source:
Parameters:
Name Type Description
id String
Returns:

Boolean

cancelAdd(callback)

Description:
  • User has pressed 'cancel' - abandon adding a node and hide the dialog

Source:
Parameters:
Name Type Description
callback function

cancelEdit(item, callbackopt)

Description:
  • User has pressed 'cancel' - abandon the edit and hide the dialog

Source:
Parameters:
Name Type Attributes Description
item object
callback function <optional>

cancelLoading()

Description:
  • After the Factor tab is loaded, cancel the Loading... dots

Source:

cancelViewOnly()

Description:
  • cancel View Only mode (only available via the console)

Source:

changeCursor(newCursorStyle)

Description:
  • Change the cursor style for the net pane and nav bar

Source:
Parameters:
Name Type Description
newCursorStyle object

changeRoom(event)

Description:
  • User has clicked one of the previous map titles - confirm and change to the web page for that room

Source:
Parameters:
Name Type Description
event Event

checkKey(e)

Description:
  • catch and branch to a handler for special Key commands Delete, ^z (undo) and ^y (redo)

Source:
Parameters:
Name Type Description
e event

circleIntersectsRect(circle, rect)

Description:
  • tests whether any part of the circle overlaps the rectangle

Source:
Parameters:
Name Type Description
circle object

an object with x,y as the circle's centre and r, the circle's radius

rect object

an object with the rects x,y for its top left, and width and height

Returns:

Boolean

clean(source, propsToRemove)

Description:
  • return a copy of an object, with the properties in the object propsToRemove removed

Source:
Parameters:
Name Type Description
source Object
propsToRemove Object

cleanArray(arr, propsToRemove)

Description:
  • remove the given properties from all the objects in the array

Source:
Parameters:
Name Type Description
arr Array

array of objects

propsToRemove string

clearLegend()

Description:
  • remove the legend from the map

Source:

clearMap()

Description:
  • clear the map by destroying all nodes and edges

Source:

clearPopUp()

Description:
  • Hide the editing dialog box

Source:

clearStatusBar()

Description:
  • remove any previous message from the status bar

Source:

closeFilter()

Description:
  • Close the filter dialog and remove the filter (i.e. display all rows)

Source:

closeOptionsDialogs()

Description:
  • remove any option dialog that is open

Source:

closeOptionsDialogs()

Description:
  • remove any option dialog that is open

Source:

clusterByAttribute(attribute)

Source:
Parameters:
Name Type Description
attribute String

collapseColGroup(table, field)

Description:
  • hides (or shows) all but the first column in the column group and replaces the column group header

Source:
Parameters:
Name Type Description
table Object

table with this col group

field String

field name of column group

collapseNotes(table, field)

Description:
  • reduce (and shorten the notes text) or expand the width of the Notes column

Source:
Parameters:
Name Type Default Description
table Tabulator
field string Notes

colorEditor(cell, onRendered, success) → {HTMLElement}

Description:
  • Use the browser standard color picker to edit the cell colour

Source:
Parameters:
Name Type Description
cell object

the cell component for the editable cell

onRendered function

function to call when the editor has been rendered

success function

function to call to pass the successfully updated value to Tabulator

Returns:

the editor element

Type
HTMLElement

configSamples()

Description:
  • assemble configurations by merging the specifics into the default

Source:

connected(a)

Description:
  • check that all nodes are connected to at least one other node i.e. every row includes at least one 1

Source:
Parameters:
Name Type Description
a Array.<array>

connectedComponents(data)

Description:
  • given a complete set of edges, returns a list of lists of edges, each list being the edges of a connected component

Source:
Parameters:
Name Type Description
data object

convertDashes(val)

Description:
  • Convert from dashed menu selection to style object properties

Source:
Parameters:
Name Type Description
val string

convertData() → {object}

Description:
  • Convert the map data from PRSM format to 3d display format Avoid cluster nodes Add lists of links and neighbours to each node

Source:
Returns:

{nodes; links}

Type
object

convertEdge(edge)

Description:
  • Convert an edge from the normal PRSM format to the one required by the 3d display

Source:
Parameters:
Name Type Description
edge object
Returns:

object

convertEdge(edge) → {object}

Description:
  • spread some deep values to the top level to suit the requirements of the Tabulator package better NB: any such converted values cannot then be edited without special attention (in updateEdgeCellData)

Source:
Parameters:
Name Type Description
edge object
Returns:

the node augmented with new properties

Type
object

convertEdgeBack(edge, field, value)

Description:
  • Convert the properties of the edge back into the format required by vis-network

Source:
Parameters:
Name Type Description
edge object
field string
value any

convertNode(node)

Description:
  • Convert a node from the normal PRSM format to the one required by the 3d display

Source:
Parameters:
Name Type Description
node Object
Returns:

Object

convertNode(node) → {object}

Description:
  • spread some deep values to the top level to suit the requirements of the Tabulator package better NB: any such converted values cannot then be edited without special attention (in updateEdgeCellData)

Source:
Parameters:
Name Type Description
node Object
Returns:

the node augmented with new properties

Type
object

convertNodeBack(node, field, value)

Description:
  • Convert the properties of the node back into the format required by vis-network

Source:
Parameters:
Name Type Description
node object
field string
value any

copyBackgroundToClipboard(event)

Description:
  • Copy the selected objects to the clipboard NB this doesn't yet work in Firefox, as they haven't implemented the Clipboard API and Permissions yet.

Source:
Parameters:
Name Type Description
event Event

copyHistoryToClipboard(event)

Description:
  • copy the contents of the history log to the clipboard

Source:
Parameters:
Name Type Description
event object

copyTable()

Description:
  • Copy the all or filtered rows of the table to the clipboard If some rows are selected, only those will be copied (see the clipboardCopyRowRange option in the table definitions)

Source:

copyToClipboard(event)

Description:
  • Copy the selected nodes and links to the clipboard NB this doesn't yet work in Firefox, as they haven't implemented the Clipboard API and Permissions yet.

Source:
Parameters:
Name Type Description
event Event

createTitleDropDown()

Description:
  • Create a drop down list of previous maps used for user selection

Source:

deepCopy(obj)

Description:
  • returns a deep copy of the object original replaced by new built-in

Source:
Parameters:
Name Type Description
obj Object

deleteActiveObjects()

Description:
  • makes the active object invisible (unless it is a group, which is actually deleted) this allows 'undo' to re-instate the object, by making it visible

Source:

deleteColumn(column)

Description:
  • delete the column from the table and mark the data as deleted

Source:
Parameters:
Name Type Description
column object

deleteNode()

Description:
  • Delete the selected node, plus all the edges that connect to it (so no edge is left dangling)

Source:

deselectTool()

Description:
  • unmark the selected tool, unselect the active object, close the option dialog and set tool to null

Source:

deselectTool()

Description:
  • unmark the selected tool, close the option dialog and set tool to null

Source:

diag(v) → {Array.<array>}

Description:
  • create a zero matrix with v as the leading diagonal

Source:
Parameters:
Name Type Description
v array
Returns:
Type
Array.<array>

diffMaps()

Description:
  • Print to console the differences between the given map and the current map

Source:

display(backColor)

Description:
  • Display the map as a 3D network

Source:
Parameters:
Name Type Description
backColor string

background color: white or black

displayHelp()

Description:
  • display help page in a separate window

Source:

displayHelp()

Description:
  • display help page in a separate window

Source:

displayNetPane(msg)

Description:
  • Once any existing map has been loaded, fit it to the pane and reveal it

Source:
Parameters:
Name Type Description
msg string

message for console

displayWhatsNew()

Description:
  • show the What's New modal dialog unless this is a new user or user has already seen this dialog for this (Major.Minor) version

Source:

doSearch()

Description:
  • do the search using the string in the search bar and, when found, focus on that node

Source:

dragElement(el, header)

Description:
  • allow user to drag the element that has a header element that acts as the handle

Source:
Parameters:
Name Type Description
el HTMLElement
header HTMLElement

draw()

Description:
  • draw the network, after setting the vis-network options

Source:

drawBadges(ctx)

Description:
  • draw badges (icons) around Factors and Links

Source:
Parameters:
Name Type Description
ctx CanvasRenderingContext2D

NetPane canvas context

drawGrid(grid_size)

Description:
  • draw a grid on the drawing canvas

Source:
Parameters:
Name Type Default Description
grid_size Integer 25

pixels between grid lines

drawGrid(netctx)

Description:
  • draw a faint evenly spaced grid over the drawing area

Source:
Parameters:
Name Type Description
netctx CanvasRenderingContext2D

duplEdge(from, to)

Description:
  • if there is already a link from the 'from' node to the 'to' node, return it

Source:
Parameters:
Name Type Description
from Object

A node

to Object

Another node

edgeListToAdjMatrix(v, nodes)

Description:
  • convert a vector of objects, each an edge referencing from and to nodes to an adjacency matrix. nodes is a list of nodes that acts as the index for the adj. matrix.

Source:
Parameters:
Name Type Description
v array

list of edges

nodes array

list of node Ids

Returns:

matrix

editEdge(item, point, cancelAction, callback)

Description:
  • Draw a dialog box for user to edit an edge

Source:
Parameters:
Name Type Description
item Object

the edge

point Object

the centre of the edge

cancelAction function

what to do if the edit is cancelled

callback function

what to do if the edit is saved

editLinkStyle(styleElement, groupId)

Description:
  • open the dialog to edit a link style

Source:
Parameters:
Name Type Description
styleElement HTMLElement
groupId string

editNode(item, point, cancelAction, callback)

Description:
  • Draw a dialog box for user to edit a node

Source:
Parameters:
Name Type Description
item Object

the node

point Object

the centre of the node

cancelAction function

what to do if the edit is cancelled

callback function

what to do if the edit is saved

editNodeStyle(styleElement, groupId)

Description:
  • open the dialog to edit a node style

Source:
Parameters:
Name Type Description
styleElement HTMLElement
groupId number

elem(id)

Description:
  • return the HTML element with the id

Source:
Parameters:
Name Type Description
id string

eraser()

Description:
  • Simulate the effect of the v1 eraser by deleting all rects and textboxes that are overlapped by the white circles produced by the v1 eraser

Source:
Returns:

a filtered version of yPointsArray, with 'erased' rects, texts and white marker circles omitted

exactTime()

Source:
Returns:

a string with current time to the nearest millisecond

exportDOT()

Description:
  • Save the map as GraphViz file See https://graphviz.org/doc/info/lang.html

Source:

exportExcel()

Description:
  • Save the map in an Excel workbook, with two sheets: Factors and Links

Source:

exportGML()

Description:
  • Save the map as a GML file See https://web.archive.org/web/20190303094704/http://www.fim.uni-passau.de:80/fileadmin/files/lehrstuhl/brandenburg/projekte/gml/gml-technical-report.pdf for the format

Source:

exportNotes()

Description:
  • save a local file containing all the node and edge notes, plus the map description, as a Word document

Source:

factorSizeToPercent(size) → {Integer}

Description:
  • Convert a factor size into a percent (with any size below 30 as zero), for the input range slider

Source:
Parameters:
Name Type Description
size Integer
Returns:

percent

Type
Integer

fit()

Description:
  • rescale and redraw the network so that it fits the pane

Source:

follow(event)

Description:
  • User has clicked on an avatar. Start following this avatar

Source:
Parameters:
Name Type Description
event event

followUser()

Description:
  • move the map so that the followed cursor is always in the centre of the pane

Source:

generateName()

Description:
  • return a random fancy name for an avatar, with a random colour

Source:

generateRoom()

Description:
  • create a random string of the form AAA-BBB-CCC-DDD

Source:

getArrows(prop)

Description:
  • Convert from style object properties to arrow menu selection

Source:
Parameters:
Name Type Description
prop Object

getButtonStatus()

Description:
  • return an object with the current Network panel setting for saving settings for link radius and up/down stream are not saved

Source:
Returns:

an object with the Network panel settings

getContext(canvas) → {CanvasRenderingContext2D}

Description:
  • return the context for the provided canvas

Source:
Parameters:
Name Type Description
canvas HTMLCanvasElement
Returns:
Type
CanvasRenderingContext2D

getDashes(bDashes, bWidth)

Description:
  • convert from style object properties to dashed border menu selection

Source:
Parameters:
Name Type Description
bDashes any

select menu value

bWidth number

border width

getLastPath()

Description:
  • called after a pencil or marker has been used to retrieve the path object that it created

Source:
Returns:

fabric path object

getNodeGroupFromGroupLabel(groupLabel)

Description:
  • Given a label for a style, return the style's group id. Assumes that the style label is unique

Source:
Parameters:
Name Type Description
groupLabel String

getRadioVal(name)

Source:
Parameters:
Name Type Description
name String

of Radio button group

Returns:

value of the button that is checked

getRandomData(nNodes)

Description:
  • randomly create some nodes and edges as a binary tree, mainly used for testing

Source:
Parameters:
Name Type Description
nNodes number

getScaleFreeNetwork()

Description:
  • Create a random scale free network, used only for testing and demoing Taken from the vis-network distribution

    Created by Alex on 5/20/2015.

Source:

getSelectedAndFixedNodes()

Description:
  • Return an array of the node Ids of Factors that are selected or are locked

Source:
Returns:

Array

getWidthOfTitle(text, fontname, fontsize) → {number}

Description:
  • return the length of the string in pixels when displayed using given font

Source:
Parameters:
Name Type Default Description
text string
fontname string Oxygen
fontsize number 13.33
Returns:

pixels

Type
number

get_trophic_levels(a) → {array}

Description:
  • This is the Trophic Levels Algorithm

Source:
Parameters:
Name Type Description
a Array.<array>

square adjacency matrix

Returns:

levels (heights)

Type
array

ghostCursor()

Description:
  • show a box attached to the cursor to guide where the Factor will be placed when the user clicks.

Source:

ghostFactor(pos)

Description:
  • broadcast to other users that a new factor is being added here

Source:
Parameters:
Name Type Description
pos Object

offset coordinates of Add Factor dialog

groupTitle(field, collapse)

Description:
  • return HTML string for column group header, with embedded collapse/reveal icon

Source:
Parameters:
Name Type Default Description
field String

field name of column group

collapse Boolean true

which header 9and which collapse/reveal icon) to use

Returns:

HTML string

headerTickToggle(e, id)

Description:
  • Toggle the displayed state of the checkbox in a TickCross column

Source:
Parameters:
Name Type Description
e Event
id String

id of checkbox in header of a tickCross column

hideNavButtons()

Description:
  • in View Only mode, hide all the Nav Bar buttons except the search button and make the map title not editable

Source:

hideNodeAndEdges(node, value)

Description:
  • Set the node's hidden property to true, and hide all the connected edges (or the reverse if value is false)

Source:
Parameters:
Name Type Description
node object
value boolean

new value (hidden or not hidden)

hideNotes()

Description:
  • Hide the Node or Edge Data panel

Source:

hideWhatsNew()

Description:
  • hide the What's New dialog when the user has clicked Continue, and note tha the user has seen it

Source:

htmlEntities(str)

Description:
  • replace special characters with their HTML entity codes

Source:
Parameters:
Name Type Description
str string

humanSize(bytes, si) → {string}

Source:
Parameters:
Name Type Description
bytes number

integer to convert

si boolean

use base 10 (true) or base 2 (false)

Returns:

e.g. humanFileSize(1929637) => 1.9MB

Type
string

in_degree(a) → {array}

Description:
  • return a vector of the number of edges into a node

Source:
Parameters:
Name Type Description
a Array.<array>
Returns:
Type
array

initDraw()

Description:
  • set up the fabric context, the grid drawn on it and the tools

Source:

initPopUp(popUpTitle, height, item, cancelAction, saveAction, callback)

Description:
  • Initialise the dialog for creating nodes/edges

Source:
Parameters:
Name Type Description
popUpTitle string
height number
item object
cancelAction function
saveAction function
callback function

initSample(wrapper, sampleData)

Description:
  • create the sample network

Source:
Parameters:
Name Type Description
wrapper HTMLElement
sampleData object

initialiseFactorTable() → {Tabulator}

Description:
  • define the Factor table

Source:
Returns:

the table

Type
Tabulator

initialiseLinkTable() → {Tabulator}

Description:
  • define the Link table

Source:
Returns:

the table

Type
Tabulator

initials(name)

Description:
  • return the initials of the given name as a string: Nigel Gilbert -> NG

Source:
Parameters:
Name Type Description
name string

initiateClone()

Description:
  • load cloned data from localStorage

Source:

initySamplesMap()

Description:
  • Load ySamplesMap with the current styles (for possible rollback)

Source:

inline(label)

Description:
  • replace all white space with single space characters

Source:
Parameters:
Name Type Description
label string
Returns:

string

intersect(circle, shape)

Description:
  • returns true iff the circle overlaps the shape (tests only rects and text boxes, not lines or pencil)

Source:
Parameters:
Name Type Description
circle array

a marker item from yPointsArray

shape array

an item form yPointsArray

Returns:

Boolean

invertColor(color)

Description:
  • return the inverse/complementary colour

Source:
Parameters:
Name Type Description
color string

as a hex string

Returns:

hex string

isEmpty(obj)

Description:
  • return true if obj has no properties, i.e. is {}

Source:
Parameters:
Name Type Description
obj Object
Returns:

true or false

isQuillEmpty(quill)

Description:
  • test whether the editor has any content (could be an empty string or a Quill insert operation of just a single newline character)

Source:
Parameters:
Name Type Description
quill object

editor

Returns:

boolean

keepPaneInWindow(pane)

Description:
  • when the window is resized, make sure that the pane is still visible

Source:
Parameters:
Name Type Description
pane HTMLelement

legend(warn)

Description:
  • display a legend on the map (but only if the styles have been given names)

Source:
Parameters:
Name Type Description
warn Boolean

true if user is switching display legend on, but there is nothing to show

lightOrDark(color)

Description:
  • Determine whether a color is light or dark (so text in a contrasting color can be overlaid) from https://awik.io/determine-color-bright-dark-using-javascript/

Source:
Parameters:
Name Type Description
color string
Returns:

'light' or 'dark'

linkEditCancel()

Description:
  • cancel any editing of the style and revert to what it was previously

Source:

linkEditSave()

Description:
  • save changes to the style made with the edit dialog to the style object

Source:

linkEditSubmit()

Description:
  • save the edited style and close the style editor. Update the links in the map and the legend to the current style

Source:

linkEditUpdateStyleSample(group)

Description:
  • update the style sample to show changes to style

Source:
Parameters:
Name Type Description
group Object

linkEditorHide()

Description:
  • hide the link style editor dialog

Source:

linkEditorShow()

Description:
  • show the link style editor dialog

Source:

listFactors(factors, suppressType)

Description:
  • return a string listing the labels of the given nodes, with nice connecting words

Source:
Parameters:
Name Type Description
factors Array

List of node Ids

suppressType Boolean

If true, don't start string with 'Factors'

Description:
  • return a string listing the number of Links, or if just one, the starting and ending factors

Source:
Parameters:
Name Type Description
links Array

listen(id, event, callback, options)

Description:
  • attach an event listener

Source:
Parameters:
Name Type Description
id string

id of the element on which to hang the event listener

event string
callback function
options object

loadCSV(csv)

Description:
  • Read a comma separated values file consisting of 'From' label and 'to' label, on each row, with a header row (ignored) optional, cols 3 and 4 can include the groups (styles) of the from and to nodes, column 5 can include the style of the edge. All these must be integers between 1 and 9

Source:
Parameters:
Name Type Description
csv string

loadDOTfile(graph)

Description:
  • parse and load a GraphViz (.DOT or .GV) file uses the vis-network DOT parser, which is pretty hopeless - e.g. it does not manage dotted or dashed node borders and requires some massaging of the parameters it does recognise

Source:
Parameters:
Name Type Description
graph string

contents of DOT file

Returns:

nodes and edges as an object

loadExcelfile(contents)

Description:
  • Reads map data from an Excel file. The file must have two spreadsheets in the workbook, named Factors and Links In the spreadsheet, there must be a header row, and columns for (minimally) Label (and for links, also From and To, with entries with the exact same text as the Labels in the Factor sheet. There may be a Style column, which is used to specify the style for the Factor or Link (numbered from 1 to 9). There may be a Description (or note or Note) column, the contents of which are treated as a Factor or Link note. Any other columns are treated as holding values for additional Attributes.

    Uses https://sheetjs.com/

Source:
Parameters:
Name Type Description
contents *
Returns:

nodes and edges data

loadFile(contents)

Description:
  • determine what kind of file it is, parse it and replace any current map with the one read from the file

Source:
Parameters:
Name Type Description
contents string

what is in the file

loadGML(gml)

Description:
  • Parse and load a GML file

Source:
Parameters:
Name Type Description
gml string

loadGraphML(graphML)

Description:
  • parse and load a graphML file

Source:
Parameters:
Name Type Description
graphML string

loadPRSMfile(str)

Description:
  • Parse and load a PRSM map file, or a JSON file exported from Gephi

Source:
Parameters:
Name Type Description
str string

lockNode(item)

Description:
  • User is about to edit the node. Make sure that no one else can edit it simultaneously

Source:
Parameters:
Name Type Description
item Node

logHistory(action)

Description:
  • push a record that action has been taken on to the end of the history log also record current state of the map for possible roll back and note changes have been made to the map

Source:
Parameters:
Name Type Description
action String

makeOptionsDialog(tool)

Description:
  • Create an HTMLElement that will hold the options dialog

Source:
Parameters:
Name Type Description
tool String
Returns:

HTMLElement

mapTitle(e)

Description:
  • User has set or changed the map title: update the UI and broadcast the new title

Source:
Parameters:
Name Type Description
e event

markMapSaved()

Description:
  • note that the map has been saved to file and so user does not need to be warned about quitting without saving

Source:

mergeTranspose(a) → {Array.<array>}

Description:
  • Add matrix a to its transpose, but normalise the cell values resulting to 0/1

Source:
Parameters:
Name Type Description
a Array.<array>
Returns:

a copy of the result

Type
Array.<array>

mouseDespatch(event)

Description:
  • all mouse and touch events for the canvas are handled here - despatch to the selected tool

Source:
Parameters:
Name Type Description
event PointerEvent

nodeEditCancel()

Description:
  • cancel any editing of the style and revert to what it was previously

Source:

nodeEditSave()

Description:
  • save changes to the style made with the edit dialog to the style object

Source:

nodeEditSubmit()

Description:
  • save the edited style and close the style editor. Update the nodes in the map and the legend to the current style

Source:

nodeEditUpdateStyleSample(group)

Description:
  • update the style sample to show changes to style

Source:
Parameters:
Name Type Description
group Object

nodeEditorHide()

Description:
  • hide the node style editor dialog

Source:

nodeEditorShow()

Description:
  • show the node style editor dialog

Source:

nodeIdToLabel(id)

Description:
  • find a node with the given id and return its label

Source:
Parameters:
Name Type Description
id string
Returns:

string

nodeList(v)

Description:
  • returns a list of the node Ids mentioned in a vector of edges

Source:
Parameters:
Name Type Description
v array

edges

noteFilter(data, params)

Description:
  • Custom filter for Notes -first converts Quill format to string and then checks the string

Source:
Parameters:
Name Type Description
data object

a row

params object

{type of comparison, str: string to match}

Returns:

Boolean

object_equals(x, y)

Description:
  • compare two objects for deep equality fast but doesn't cater for obscure cases adapted from https://stackoverflow.com/questions/1068834/object-comparison-in-javascript

Source:
Parameters:
Name Type Description
x Object
y Object

onexit(callback)

Description:
  • store the cleanup function until needed

Source:
Parameters:
Name Type Description
callback function

openCluster(clusterNodeId)

Description:
  • Hide the cluster node and unhide the nodes it was clustering (and their edges) called by right clicking the cluster node

Source:
Parameters:
Name Type Description
clusterNodeId string

openNotesWindow()

Description:
  • open another window (popupWindow) in which Notes can be edited

Source:

out_degree(a) → {array}

Description:
  • return a vector of the number of edges out of a node

Source:
Parameters:
Name Type Description
a Array.<array>
Returns:
Type
array
Description:
  • react to the user pressing the Add Link button handles cases when the button is disabled; has previously been pressed; and the Add Node button is active, as well as the normal case

Source:

plusNode()

Description:
  • react to the user pressing the Add node button handles cases when the button is disabled; has previously been pressed; and the Add link button is active, as well as the normal case

Source:

positionNotes(panel)

Description:
  • ensure that the panel is not outside the net pane, nor obscuring the Settings panel

Source:
Parameters:
Name Type Description
panel HTMLElement

positionPopUp(point)

Description:
  • Position the editing dialog box so that it is to the left of the item being edited, but not outside the window

Source:
Parameters:
Name Type Description
point Object

progressBar(sliderEl)

Description:
  • draw the solid bar to the left of the thumb on a slider

Source:
Parameters:
Name Type Description
sliderEl HTMLElement

input[type=range] element

quillAccessor(note)

Description:
  • Used to convert Quill formatted notes into HTML ready for copying to the clipboard

Source:
Parameters:
Name Type Description
note array

Quill delta

Returns:

note in HTML format

quillEditor(cell, onRendered, success)

Description:
  • start up a Quill editor for the note in this cell

Source:
Parameters:
Name Type Description
cell object
onRendered function

not used

success function

function to call when user has finished editing

Returns:

HTMLElement placeholder for the cell while it is being edited elsewhere

quillFormatter(cell)

Description:
  • returns the note for this factor in HTML format, shortening it with ellipses if the column is collapsed

Source:
Parameters:
Name Type Description
cell object
Returns:

HTML string

randomColour() → {Object}

Description:
  • return a random colour, with a flag to show whether the color is light or dark, to suggest whether text applied should be white or black

Source:
Returns:

{color: string, isLight: boolean}

Type
Object
Description:
  • update all links in the map with this style to the current style features

Source:
Parameters:
Name Type Attributes Description
groupIds Array.<number>
force boolean <optional>

override any existing individual edge styling

reApplySampleToNodes(groupIds, forceopt)

Description:
  • update all nodes in the map with this style to the current style features

Source:
Parameters:
Name Type Attributes Description
groupIds Array.<number>
force boolean <optional>

override any existing individual node styling

readSingleFile(e)

Description:
  • Get the name of a map file to read and load it

Source:
Parameters:
Name Type Description
e event

rebase(v)

Description:
  • subtract the minimum value of any cell from each cell of the vector

Source:
Parameters:
Name Type Description
v array

recalculateStats()

Description:
  • Ask the web worker to recalculate network statistics

Source:

receiveEvent(event)

Description:
  • Despatch to deal with event

Source:
Parameters:
Name Type Description
event object

from yAwareness.on('change')

recreateClusteringMenu(obj)

Description:
  • recreate the Clustering drop down menu to include user attributes as clustering options

Source:
Parameters:
Name Type Description
obj object

{menu value, menu text}

redraw()

Description:
  • redraw the objects on the canvas and the grid

Source:

redraw()

Description:
  • redraw the main canvas, using the stored commands in yPointsArray[]

Source:

refreshFromMap(keys)

Description:
  • add or refresh objects that have the given list of id, using data in yDrawingMap

Source:
Parameters:
Name Type Description
keys array
Description:
  • ensure that the styles displayed in the link styles panel display the styles defined in the styles array

Source:

refreshSampleNodes()

Description:
  • ensure that the styles displayed in the node styles panel display the styles defined in the styles array

Source:

removeAvatar(ava)

Description:
  • destroy the avatar - the user is no longer on line

Source:
Parameters:
Name Type Description
ava HTMLelement

removeFactorCursor()

Description:
  • remove the factor cursor if it exists

Source:

removeTitleDropDown()

Description:
  • Remove the drop down list of previous maps if user clicks on the net-pane or on a map title.

Source:

resizeCanvas()

Description:
  • resize the drawing canvas when the window changes size

Source:

rgbIsLight(r, g, b, differencePoint) → {boolean}

Description:
  • Determine whether the RGB color is light or not http://www.w3.org/TR/AERT#color-contrast

Source:
Parameters:
Name Type Description
r number

Red

g number

Green

b number

Blue

differencePoint number
Returns:
Type
boolean

rgba()

Description:
  • convert an rgb(a) string to rgba with given alpha value

Source:

(async) rollback(event)

Description:
  • Restores the state of the map to a previous one

Source:
Parameters:
Name Type Description
event Event
Returns:

null if no rollback possible or cancelled

round(v, places)

Description:
  • Round the cell values of v to the given number of decimal places

Source:
Parameters:
Name Type Description
v array
places number

roundTripTimer()

Description:
  • measure the time taken to send an update to another Y.doc responds to updates sent as 'pkt' objects every 20 seconds (see above)

Source:

saveChange(obj, params, op)

Description:
  • Broadcast the changes to other clients and save the current state of the object on the undo stack

Source:
Parameters:
Name Type Description
obj String

the object

params Object

the current state

op String

insert|delete|update|null (if null, don't save on the undo stack)

saveEdge(item, callback)

Description:
  • save the edge format details that have been edited

Source:
Parameters:
Name Type Description
item Object

the edge that has been edited

callback function

saveLabel(node, callback)

Description:
  • called when a node has been added. Save the label provided

Source:
Parameters:
Name Type Description
node Object

the item that has been added

callback function

saveNode(item, callback)

Description:
  • save the node format details that have been edited

Source:
Parameters:
Name Type Description
item Object

the node that has been edited

callback function

savePRSMfile()

Description:
  • save the current map as a PRSM file (in JSON format)

Source:

saveState()

Description:
  • Generate a compressed dump of the current state of the map, sufficient to reproduce it

Source:
Returns:

binary string

saveStr(str, extn)

Description:
  • Save the string to a local file

Source:
Parameters:
Name Type Description
str string

file contents

extn string

file extension

Browser will only ask for name and location of the file to be saved if it has a user setting to do so. Otherwise, it is saved at a default download location with a default name.

Description:
  • Open an input for user to type label of node to search for and generate suggestions when user starts typing

Source:

searchTargets()

Description:
  • generate and display a set of suggestions - nodes with labels that include the substring that the user has typed

Source:

selectClustering(e)

Description:
  • User has chosen a clustering option

Source:
Parameters:
Name Type Description
e Event

selectTool(event)

Description:
  • When the user clicks a tool icon unselect previous tool, select this one and remember which tool is now selected The undo, redo, delete and image tools are special, because they act immediately when the icon is clicked

Source:
Parameters:
Name Type Description
event object

selectTool(event)

Description:
  • event listener: when user clicks a tool icon unselect previous tool, select this one and remember which tool is now selected The undo and image tools are special, because they act immediately when the icon is clicked

Source:
Parameters:
Name Type Description
event object

selectUsersItems()

Description:
  • Selects all the nodes and edges that have been created or modified by a user

Source:

selectedLabels() → {String}

Description:
  • returns string of currently selected labels of links and factors, nicely formatted

Source:
Returns:

string of labels of links and factors, nicely formatted

Type
String

setAnalysisButtonsFromRemote()

Description:
  • Sets the Analysis radio buttons and Factor selection according to values in global hiddenNodes (which is set when yNetMap is loaded, or when a file is read in)

Source:

setButtonDisabledStatus(id, state)

Description:
  • Change the visible state of a button

Source:
Parameters:
Name Type Description
id String
state Boolean

true to make the button disabled

setButtonDisabledStatus(id, state)

Description:
  • Change the visible state of a button

Source:
Parameters:
Name Type Description
id String
state Boolean

true to make the button disabled

setButtonStatus(settings)

Description:
  • Set the Network panel buttons to their values loaded from a file

Source:
Parameters:
Name Type Description
settings Object

setCanvasBackground(canvas)

Description:
  • draw the background on the given canvas (which will be a magnified version of the net pane)

Source:
Parameters:
Name Type Description
canvas HTMLElement
Returns:

canvas

setEdgeHidden(edge, hide)

Description:
  • set this edge to its 'hidden' appearance (very faint), or restore it to its usual appearance

Source:
Parameters:
Name Type Description
edge object
hide boolean

setEndOfContenteditable(contentEditableElement)

Description:
  • positions the caret at the end of text in a contenteditable div

Source:
Parameters:
Name Type Description
contentEditableElement *

setFactorSizeFromPercent(node, percent)

Description:
  • Set the factor size according to the input range slider value (less then 5% is treated as the normal size)

Source:
Parameters:
Name Type Description
node object
percent integer

setFileName(extn)

Description:
  • resets lastFileName to a munged version of the map title, with the supplied extension if lastFileName is null, uses the map title, or if no map title, 'network' as the filename

Source:
Parameters:
Name Type Description
extn string

filename extension to apply

setFixed()

Description:
  • User has clicked the padlock. Toggle padlock state and fix the location of the node

Source:

setMapTitle(title)

Description:
  • Format the map title

Source:
Parameters:
Name Type Description
title string

setNodeHidden(node, hide)

Description:
  • set this node to its 'hidden' appearance (very faint), or restore it to its usual appearance

Source:
Parameters:
Name Type Description
node object
hide boolean

setParams(obj, params)

Description:
  • Collect the parameters that would allow the reproduction of the object

Source:
Parameters:
Name Type Description
obj object

fabric object

params object

initial parameters

Returns:

params

setRadioVal(name, value)

Source:
Parameters:
Name Type Description
name String

of the radio button group

value *

check the button with this value

setUpAwareness()

Description:
  • set up user monitoring (awareness)

Source:

setUpBackground()

Description:
  • Initialise the canvas and toolbox

Source:

setUpCanvas(id) → {HTMLCanvasElement}

Description:
  • set up the dimensions of and return the canvas at the id

Source:
Parameters:
Name Type Description
id string

canvas id

Returns:
Type
HTMLCanvasElement

setUpChat()

Description:
  • create DOM elements for the chat box

Source:

setUpFilter()

Description:
  • Display a dialog box to get the filter parameters

Source:

setUpPage()

Description:
  • create all the DOM elements on the web page

Source:

setUpPaint()

Description:
  • create the canvases and add listeners for mouse and touch events initialise the array holding drawing commands

Source:

setUpSamples()

Description:
  • The samples are each a mini vis-network showing just one node or two nodes and a link

Source:

setUpShareDialog()

Description:
  • set up the modal dialog that opens when the user clicks the Share icon in the nav bar

Source:

setUpShareDialog()

Description:
  • set up the modal dialog that opens when the user clicks the Share icon in the nav bar

Source:

setUpTabs()

Description:
  • add event listeners for the Factor and Link tabs

Source:

setUpToolbox()

Description:
  • add event listeners to the tools to receive user clicks to select a tool

Source:

setUpToolbox()

Description:
  • add listeners for when the tool buttons are clicked

Source:

setUpTutorial()

Description:
  • if this is the user's first time, show them how the user interface works

Source:

setvh()

Description:
  • to handle iOS weirdness in fixing the vh unit (see https://css-tricks.com/the-trick-to-viewport-units-on-mobile/)

Source:

showAvatars()

Description:
  • Place a circle at the top left of the net pane to represent each user who is online Also create a cursor (a div) for each of the users

Source:
Description:
  • Create links to cluster nodes and hide links that are now inside clustered nodes

Source:

showGhostFactor(userId, addingFactor)

Description:
  • show a ghost box where another user is adding a factor addingFactor is an object with properties: state: adding', or 'done' to indicate that the ghost box should be removed pos: a position (of the Add Factor dialog); 'done' name: the name of the other user

Source:
Parameters:
Name Type Description
userId Integer

other user's client Id

addingFactor object

showHistory()

Description:
  • display the history log in a window

Source:

showNavButtons()

Description:
  • restore all the Nav Bar buttons when leaving view only mode (e.g. when going back online)

Source:

showNodeData()

Description:
  • Show the notes box, the fixed node check box and the node statistics

Source:

showNodeOrEdgeData()

Description:
  • Display a panel to show info about the selected edge or node

Source:

showNotesSwitch(e)

Description:
  • Globally either display or don't display notes when a factor or link is selected

Source:
Parameters:
Name Type Description
e Event

showOtherMouse()

Description:
  • Display another user's mouse pointers (if they are inside the canvas)

Source:

showPressed(el, action)

Description:
  • Add or remove the CSS style showing that the button has been pressed

Source:
Parameters:
Name Type Description
el string

the Id of the button

action *

whether to add or remove the style

showSelected()

Description:
  • show the nodes and links selected in the status bar

Source:

snapToGrid(node)

Description:
  • Move the node to the nearest spot that it on the grid

Source:
Parameters:
Name Type Description
node object

solve(A, B)

Description:
  • solve Ax=B by Gauss-Jordan elimination method adapted from https://www.npmjs.com/package/linear-equation-system

Source:
Parameters:
Name Type Description
A Array.<array>
B array

splitText(txt, width)

Description:
  • divide txt into lines to make it roughly square, with a maximum width of width characters, but not breaking words and respecting embedded line breaks (\n).

Source:
Parameters:
Name Type Description
txt string
width number

standardize_color(str)

Description:
  • return the hex value for the CSS color in str (which may be a color name, e.g. white, or a hex number or any other legal CSS color value)

Source:
Parameters:
Name Type Description
str string

start(start)

Description:
  • initialise the step counter and display the first step

Source:
Parameters:
Name Type Description
start number

optional step to start at (if not provided, start at the lowest numbered step)

startY()

Description:
  • create a new shared document and connect to the WebSocket provider

Source:

startY()

Description:
  • create a new shared document and start the WebSocket provider

Source:

startY()

Description:
  • create a new shared document and connect to the WebSocket provider

Source:

statusMsg(msg, statusopt)

Description:
  • show status messages at the bottom of the window if status is info, warn or error, msg is displayed in a bubble that fades in and out

Source:
Parameters:
Name Type Attributes Description
msg string
status string <optional>

type of msg - info, warn, error or other

stepFinish()

Description:
  • destroy the tutorial dialog, remove the border around the item being explained, and and call stepStart() to display the next one

Source:

stepStart()

Description:
  • create a tutorial element and position it

Source:

stepsEnd()

Description:
  • called on exit

Source:

stopEdit()

Description:
  • cancel adding node and links

Source:

strip(obj, allowed)

Description:
  • return a copy of an object that only includes the properties that are in allowed

Source:
Parameters:
Name Type Description
obj Object

the object to copy

allowed array

list of allowed properties

stripNL(str)

Description:
  • Replace all \n, \r with a space

Source:
Parameters:
Name Type Description
str string
Returns:

string

styleEdgeNames()

Source:
Returns:

list of Factor Style names (omitting those called the default, 'Sample')

styleNodeNames()

Source:
Returns:

list of Factor Style names (omitting those called the default, 'Sample')

subVec(v1, v2) → {array}

Description:
  • v1 - v2

Source:
Parameters:
Name Type Description
v1 array
v2 array
Returns:
Type
array

subtract(a, b)

Description:
  • subtract matrix b from a

Source:
Parameters:
Name Type Description
a Array.<array>
b Array.<array>

sumVec(v) → {number}

Description:
  • returns the summation of the values in the vector

Source:
Parameters:
Name Type Description
v array
Returns:
Type
number

svg(icon)

Description:
  • return the SVG code for the given icon (see Bootstrap Icons)

Source:
Parameters:
Name Type Description
icon String

tickToggle(e, cell)

Description:
  • Toggle the value of a cell in a TickCross column

Source:
Parameters:
Name Type Description
e event
cell object

timeAndDate(utc, full)

Description:
  • Returns a nicely formatted Date (or time if the date is today), given a Time value (from Date() )

Source:
Parameters:
Name Type Description
utc number
full boolean

if true, don't use Today in date

timestamp()

Description:
  • return an object with the current time as an integer date and the current user's name

Source:

titleDropDown(title)

Description:
  • Add this title to the local record of maps used

Source:
Parameters:
Name Type Description
title String

toggleDeleteButton()

Description:
  • un fade the delete button to show that it can be used when something is selected

Source:

togglePanel()

Description:
  • show or hide the side panel

Source:

toolHandler(tool) → {object}

Description:
  • return the correct instance of toolHandler for the given tool

Source:
Parameters:
Name Type Description
tool string
Returns:
Type
object

toolHandler(tool) → {object}

Description:
  • return the correct instance of toolHandler for the given tool

Source:
Parameters:
Name Type Description
tool string
Returns:
Type
object

traceUsers(event)

Description:
  • display the awareness events

Source:
Parameters:
Name Type Description
event object

transpose(a) → {Array.<array>}

Description:
  • swap cell values across the leading diagonal

Source:
Parameters:
Name Type Description
a Array.<array>
Returns:

a transposed copy of a

Type
Array.<array>

trophic(data)

Description:
  • shift the positions of nodes according to the trophic 'height' (actually, here, the x coordinate)

Source:
Parameters:
Name Type Description
data object
Returns:

list of nodes whose positions have been altered

unFollow()

Description:
  • User was following another user, but has now clicked off the avatar, so stop following

Source:

unSelect()

Description:
  • unselect all nodes and edges

Source:

undirected(a) → {Array.<array>}

Description:
  • convert a directed adjacency matrix to an undirected one mirror the elements above the leading diagonal to below it

Source:
Parameters:
Name Type Description
a Array.<array>
Returns:

a copy of a

Type
Array.<array>

unlockAll()

Description:
  • ensure that all factors and links are unlocked (called only when user leaves the page, to clear up for others)

Source:

unlockEdge(item)

Description:
  • User has finished editing the edge. Unlock it.

Source:
Parameters:
Name Type Description
item object

unlockNode(item)

Description:
  • User has finished editing the node. Unlock it.

Source:
Parameters:
Name Type Description
item Node

unselectTool()

Description:
  • unselect the current tool

Source:

updateActiveButtons()

Description:
  • show whether some buttons are active or disabled, depending on whether anything is selected and whether undo or redo is possible

Source:

updateColumnTitle(column)

Description:
  • store the user's new title for the column

Source:
Parameters:
Name Type Description
column object

updateEdgeCellData(cell)

Description:
  • store the user's edit to the cell value

Source:
Parameters:
Name Type Description
cell object

updateFactorsHiddenByStyle(obj)

Description:
  • Hide or reveal all the Factors with the given style

Source:
Parameters:
Name Type Description
obj Object

{sample: state}

updateFilter()

Description:
  • Update the table to show only the rows that pass the filter

Source:

updateFromAndToLabels(nodes)

Description:
  • When a node is updated, the update may include a change of its label. Make the corresponding changes to the references to that node in the Links table

Source:
Parameters:
Name Type Description
nodes Array

array of updated nodes

updateFromDrawingMap()

Description:
  • redisplay the objects on the canvas, using the data in yDrawingMap

Source:

updateFromRemote(event)

Description:
  • observe remote changes, sent as a set of parameters that are used to update the existing or new basic Fabric objects Also import the remote undo and redo stacks

Source:
Parameters:
Name Type Description
event object

updateLastSamples(nodeId, linkId)

Description:
  • Remember the last style sample that the user clicked and use this for future factors/links Mark the sample with a light blue border

Source:
Parameters:
Name Type Description
nodeId number
linkId number

updateLegend()

Description:
  • redraw the legend (to show updated styles)

Source:

updateLinkEditor(groupId)

Description:
  • ensure that the edit link style dialog shows the current state of the style

Source:
Parameters:
Name Type Description
groupId string

updateNodeCellData(cell)

Description:
  • store the user's edit to the cell value (but if other rows are selected, put that new value in those rows too)

Source:
Parameters:
Name Type Description
cell object

updateNodeEditor(groupId)

Description:
  • ensure that the edit node style dialog shows the current state of the style

Source:
Parameters:
Name Type Description
groupId string

updateSelection(evt)

Description:
  • save changes and update state when user has selected more than 1 object

Source:
Parameters:
Name Type Description
evt canvasEvent

upgradeFromV1(pointsArray)

Description:
  • Convert v1 drawing instructions into equivalent v2 background objects

Source:
Parameters:
Name Type Description
pointsArray array

version 1 background drawing instructions

uuidv4()

Description:
  • return a GUID

Source:

zero(n)

Description:
  • create a new matrix of size n, with all cells zero

Source:
Parameters:
Name Type Description
n number

zoomCanvas(zoom)

Description:
  • zoom the canvas, zooming from the canvas centre

Source:
Parameters:
Name Type Description
zoom float

zoomincr(incr)

Description:
  • zoom by the given amount (+ve or -ve); used by the + and - buttons at the ends of the zoom slider and by trackpad zoom/pinch

Source:
Parameters:
Name Type Description
incr Number

zoomnet()

Description:
  • expand/reduce the network view using the value in the zoom slider

Source:

zoomscroll(event)

Description:
  • Zoom using a trackpad (with a mousewheel or two fingers)

Source:
Parameters:
Name Type Description
event Event

zoomset(newScale)

Description:
  • zoom by the given amount

Source:
Parameters:
Name Type Description
newScale Number