Docs
Jump to navigation
Jump to search
Our World Of Text
This page contains documentation of the OWOT codebase, examples, and code locations.
If you want to talk about this page, go to Talk:Docs
Code Documentation
OWOT.js
Event Listeners:
Object | Listen Event | Functions/Events Fired | Emits | Example Usage | Related Code |
---|---|---|---|---|---|
window | load | "clientLoaded" | window.addEventListener("load", function() {
w.emit("clientLoaded");
});
| ||
hash change | manageCoordHash(); | https://ourworldoftext.com/#x:10,y:20 | window.onhashchange = function(e) {
manageCoordHash();
}
| ||
before unload | if(writeBuffer.length) flushWrites(); | window.onbeforeunload = function() {
if(writeBuffer.length) flushWrites();
}
| |||
resize | event_resize | ("resize", ratio) | window.addEventListener("resize", event_resize);
| ||
document | select start | self | document.onselectstart = function(e) {
var target = e.target;
if(closest(target, getChatfield()) || target == elm.chatbar || closest(target, elm.confirm_js_code) || closest(target, elm.announce_text)) {
return true;
}
return Modal.isOpen;
}
| ||
key down |
|
document.addEventListener("keydown", keydown_regionSelect);
document.addEventListener("keydown", event_keydown_copy_char);
document.addEventListener("keydown", event_keydown_copy_color);
document.addEventListener("keydown", event_keydown);
| |||
key up | event_keyup | ("keyUp", e); | function event_keyup(e) {
w.emit("keyUp", e);
}
| ||
mouse move |
|
("mouseMove", {
tileX: tileX, tileY: tileY, charX: charX, charY: charY, pageX: pageX, pageY: pageY }) |
document.addEventListener("mousemove", mousemove_tileProtectAuto);
document.addEventListener("mousemove", mousemove_linkAuto);
document.addEventListener("mousemove", event_mousemove);
| ||
mouse down | event_mousedown | ("mouseDown", {
tileX: pos[0], tileY: pos[1], charX: pos[2], charY: pos[3], pageX: pageX, pageY: pageY }); |
document.addEventListener("mousedown", event_mousedown);
| ||
mouse up | event_mouseup | document.addEventListener("mouseup", event_mouseup);
| |||
mouse enter | event_mouseenter | ("mouseEnter", e) | document.addEventListener("mouseenter", event_mouseenter);
| ||
touch start | event_touchstart | document.addEventListener("touchstart", event_touchstart);
| |||
touch end | event_touchend | document.addEventListener("touchend", event_touchend);
| |||
touch move | event_touchmove | document.addEventListener("touchmove", event_touchmove, { passive: false });
| |||
wheel |
|
("scroll", {
deltaX: -deltaX, deltaY: -deltaY }); |
document.addEventListener("wheel", event_wheel);
document.addEventListener("wheel", event_wheel_zoom, {
passive: false
});
| ||
document.body | key down |
|
document.body.addEventListener("keydown", keydown_tileProtectAuto);
document.body.addEventListener("keydown", keydown_linkAuto);
| ||
key up | onKeyUp | document.body.addEventListener("keyup", onKeyUp);
| |||
w | cursor Move | updateCoordDisplay | w.on("cursorMove", updateCoordDisplay);
| ||
cursor Hide | updateCoordDisplay | w.on("cursorHide", updateCoordDisplay);
| |||
tiles Rendered | self | w.on("tilesRendered", function() {
for(var i = 0; i < regionSelections.length; i++) {
var reg = regionSelections[i];
if(reg.regionCoordA && reg.regionCoordB) reg.setSelection(reg.regionCoordA, reg.regionCoordB);
}
});
| |||
cursor Move | setClientGuestCursorPosition | w.on("cursorMove", function(pos) {
setClientGuestCursorPosition(pos.tileX, pos.tileY, pos.charX, pos.charY);
});
| |||
cursor Hide | setClientGuestCursorPosition | w.on("cursorHide", function() {
setClientGuestCursorPosition(0, 0, 0, 0, true);
});
| |||
elm.textInput |
|
|
elm.textInput.addEventListener("keydown", stabilizeTextInput);
elm.textInput.addEventListener("input", event_input);
| ||
elm.owot | context menu | self | elm.owot.oncontextmenu = function() {
if(ignoreCanvasContext) {
ignoreCanvasContext = false;
elm.owot.style.pointerEvents = "none";
setTimeout(function() {
ignoreCanvasContext = true;
elm.owot.style.pointerEvents = "";
}, 1);
}
}
| ||
elm.coords | click | self | elm.coords.onclick = function() {
showCursorCoordinates = !showCursorCoordinates;
if(showCursorCoordinates) {
elm.cursor_coords.style.display = "";
updateCoordDisplay();
} else {
elm.cursor_coords.style.display = "none";
updateCoordDisplay();
}
}
|
Functions:
Name | Description | Example Usage | Code In Use |
---|---|---|---|
init_dom() | function init_dom() {
owot = document.getElementById("owot");
owot.style.display = "block";
owot.style.cursor = defaultCursor;
owotCtx = owot.getContext("2d");
textInput = document.getElementById("textInput");
textInput.value = "";
linkElm = elm.link_element;
linkDiv = elm.link_div;
updateCoordDisplay();
initTextDecoBar();
defineElements({
owot: owot,
textInput: textInput
});
}
| ||
getWndWidth() | function getWndWidth() {
return document.body.clientWidth || window.innerWidth;
}
| ||
getWndHeight() | |||
decimal(percentage) | |||
normFontSize(size) | |||
deviceRatio() | |||
makeEnum(vars) | |||
setRGBColorPicker(r, g, b) | |||
setRGBBgColorPicker(r, g, b) | |||
setColorPickerRandom() | |||
updateColorPicker() | |||
updateBgColorPicker() | |||
updateCoordDisplay() | |||
createColorButton(color, isHighlight) | |||
addColorShortcuts() | |||
draggable_element(dragger, dragged, exclusions, onDrag) | |||
resizeChat(width, height) | |||
getStoredNickname() | |||
storeNickname() | |||
getStoredConfig() | |||
storeConfig() | |||
loadBackgroundData(cb, timeout_cb) | |||
keydown_regionSelect(e) | |||
handleRegionSelection(coordA, coordB, regWidth, regHeight) | |||
buildFontTemplate(set) | |||
rebuildFontTemplates() | |||
updateScaleConsts() | |||
setupTextRenderCtx() | |||
reloadRenderer() | |||
updateRendererZoom(percentage) | |||
zoomGarbageCollect() | |||
changeZoom(percentage, isPartial) | |||
setZoombarValue() | |||
fromLogZoom(val) | |||
toLogZoom(val) | |||
browserZoomAdjust(initial) | |||
updateAutoProg() | |||
mousemove_tileProtectAuto() | |||
keydown_tileProtectAuto(e) | |||
mousemove_linkAuto() | |||
keydown_linkAuto(e) | |||
onKeyUp(e) | |||
adjust_scaling_DOM(ratio) | |||
event_resize() | |||
getChar(tileX, tileY, charX, charY) | |||
getCharColor(tileX, tileY, charX, charY) | |||
getCharBgColor(tileX, tileY, charX, charY) | |||
getCharProtection(tileX, tileY, charX, charY) | |||
getCharDecoration(tileX, tileY, charX, charY) | |||
getCharInfo(tileX, tileY, charX, charY) | |||
getCharInfoXY(x, y) | |||
getLink(tileX, tileY, charX, charY) | |||
getLinkXY(x, y) | |||
event_keydown_copy_char(e) | |||
event_keydown_copy_color(e) | |||
resolveColorValue(val) | |||
isTileStale(tileX, tileY) | |||
checkTextColorOverride() | |||
menu_color(color) | |||
defaultStyles() | |||
manageCoordHash() | |||
getWorldProps(world, type, cb) | |||
stopLinkUI() | |||
removeTileProtectHighlight() | |||
stopTileUI() | |||
doLink() | |||
doProtect() | |||
triggerUIClick() | |||
event_mousedown(e, arg_pageX, arg_pageY) | |||
renderCursor(coords) | |||
removeCursor() | |||
stopDragging() | |||
event_mouseup(e, arg_pageX, arg_pageY) | |||
event_mouseleave(e) | |||
event_mouseenter(e) | |||
is_link(tileX, tileY, charX, charY) | |||
flushWrites() | |||
setWriteInterval() | |||
moveCursor(direction, preserveVertPos, amount) | |||
markCharacterAsUndoable(tileX, tileY, charX, charY) | |||
isCharLatestInUndoBuffer(tileX, tileY, charX, charY) | |||
writeCharTo(char, charColor, tileX, tileY, charX, charY, undoFlags, undoOffset, charBgColor, dB, dI, dU, dS) | |||
undoWrite() | |||
redoWrite() | |||
writeCharToXY(char, charColor, x, y, charBgColor, dB, dI, dU, dS) | |||
writeChar(char, doNotMoveCursor, color, noNewline, undoCursorOffset, bgColor, dB, dI, dU, dS) | |||
coordinateAdd(tileX1, tileY1, charX1, charY1, tileX2, tileY2, charX2, charY2) | |||
propagatePosition(coords, char, noEnter, noVertPos) | |||
textcode_parser(value, coords, defaultColor, defaultBgColor) | |||
stabilizeTextInput() | |||
event_input(e) | |||
stopPasting() | |||
autoArrowKeyMoveStart(dir) | |||
autoArrowKeyMoveStop(dir) | |||
event_keydown(e) | |||
event_keyup(e) | |||
isMainPage() | |||
alertJS(data, restrict) | |||
closeJSAlert() | |||
executeJS(code) | |||
confirmRunJSLink(data) | |||
runJSLink(data, restrict) | |||
coord_link_click(evt) | |||
url_link_click(evt) | |||
updateHoveredLink(mouseX, mouseY, evt, safe) | |||
event_mousemove(e, arg_pageX, arg_pageY) | |||
getCenterTouchPosition(touches) | |||
event_touchstart(e) | |||
event_touchend(e) | |||
event_touchmove(e) | |||
touch_pagePos(e) | |||
event_wheel(e) | |||
event_wheel_zoom(e) | |||
convertKeyCode(key) | |||
checkKeyPress(e, combination) | |||
checkKeyPatterns(combination) | |||
createWsPath() | |||
createSocket(getChatHist) | |||
cullRanges(map, width, height) | |||
updateRemoteBoundary() | |||
clearRemoteBoundary() | |||
expandLocalBoundary(x, y) | |||
getAndFetchTiles() | |||
clearTiles(all) | |||
clearVisibleTiles() | |||
highlight(positions, unlimited, color) | |||
blankTile() | |||
colorChar(tileX, tileY, charX, charY, colorClass) | |||
uncolorChar(tileX, tileY, charX, charY, colorClass) | |||
decodeCharProt(str) | |||
encodeCharProt(array, encoding) | |||
getCharTextDecorations(char) | |||
setCharTextDecorations(char, bold, italic, under, strike) | |||
resolveCharEmojiCombinations(char) | |||
detectCharEmojiCombinations(char) | |||
clearCharTextDecorations(char) | |||
clearAllGuestCursors() | |||
renderLoop() | |||
protectPrecisionOption(option) | |||
toggleTextDecoBar() | |||
initTextDecoBar() | |||
protectSelectionStart(start, end, width, height) | |||
protectSelectionCancel() | |||
protectSelection() | |||
buildMenu() | |||
updateMenuEntryVisiblity() | |||
regionSelectionsActive() | |||
RegionSelection() | |||
setClientGuestCursorPosition(tileX, tileY, charX, charY, hidden) | |||
sendCursorPosition() | |||
disableBgColorPicker() | |||
enableBgColorPicker() | |||
makeCoordLinkModal() | |||
makeCoordGotoModal() | |||
makeURLModal() | |||
buildBackgroundColorModal(modal) | |||
resetColorModalVisibility() | |||
makeColorModal() | |||
makeSelectionModal() | |||
searchTellEdit(tileX, tileY, charX, charY) | |||
tile_offset_object(data, tileOffX, tileOffY) | |||
begin() |
Variables:
Name | Description | Example Usage | Code In Use | |
---|---|---|---|---|
YourWorld | An object containing the users current text color, cell background color, and chat nick name. | //Sets the users color to a random one.
YourWorld.Color = Math.round((Math.random()*16777215));
|
var YourWorld = {
Color: window.localStorage ? +localStorage.getItem("color") : 0,
BgColor: -1,
Nickname: state.userModel.username
};
| |
owot | The DOM canvas element | //Hides the owot canvas.
owot.style.opacity = 0;
|
owot = document.getElementById("owot");
| |
owotCtx | The CanvasRenderingContext2D of the owot canvas | //Clears all the rendered tiles from the view.
owotCtx.clearRect(0, 0, owotWidth, owotHeight);
|
owotCtx = owot.getContext("2d");
| |
textInput | The DOM textarea element used for writing to the owot canvas. | //Paste "hello world" at the current cursor position.
textInput.value = `hello world`;
|
textInput = document.getElementById("textInput");
| |
linkElm | The DOM link element used for user link clicks. | //logs to the console whether or not the link is a javascript link.
linkElm.addEventListener(`click`,function(){
console.log(linkParams.protocol === `javascript`);
})
|
linkElm = elm.link_element;
| |
link_div | The DOM link div element used to scale the linkElm to the same size as a cell within the owot canvas. | //Highlights the URL being hovered over.
linkDiv.style.background = `rgba(255,255,0,0.5)`
|
linkDiv = elm.link_div;
| |
colorInput, colorInputBg | The DOM color inputs to select text and cell background color. | //Generate a random color on the text color input field.
const randomColor = Math.floor(Math.random()*16777215).toString(16).toUpperCase();
colorInput.jscolor.fromString(`#${randomColor}`);
|
colorInputBg = modal.addEntry("Cell color", "color").input;
colorInput = modal.addEntry("Text color", "color").input;
| |
colorShortcuts, colorShortcutsBg | A DOM div container used as a color pallet for quick access. | //Randomize all color palette colors.
const colorButtons = colorShortcuts.querySelectorAll('.color_btn');
colorButtons.forEach(button => {
if (button.title !== 'Random color') {
const randomColor = `#${Math.floor(Math.random()*16777215).toString(16).toUpperCase()}`;
button.style.backgroundColor = randomColor;
button.title = randomColor;
}
});
|
for(var i = 0; i < colors.length; i++) {
var color = colors[i];
colorShortcuts.appendChild(createColorButton(color));
}
| |
enums | An unused object created to store position and write edits. | //Use enums.position as a template for creating an updatedPosition object
const newCoord = [7, 5, 3, 1];
const updatedPosition = { ...enums.position };
for (const key in updatedPosition) {
if (updatedPosition.hasOwnProperty(key)) {
const positionIndex = updatedPosition[key];
updatedPosition[key] = newCoord[positionIndex];
}
}
|
enums.edit = makeEnum(["tileY", "tileX", "charY", "charX", "time", "char", "id", "color"]);
enums.position = makeEnum(["tileX", "tileY", "charX", "charY"]);
| |
ws_path | Stores the pages' websocket path. | //Change the socket, refreshing the client ID
w.changeSocket(ws_path, true);
|
var ws_path = createWsPath();
| |
menu,
w.menu, Menu |
An object containing all of the DOM elements and functions of the menu. | //Adds a button to the menu that alerts "Hello World" when clicked.
menu.addOption("alert", function(){alert("Hello World")});
|
menu = new Menu(elm.menu_elm, elm.nav_elm);
w.menu = menu;
| |
menuStyle | A temporary style element created and used to style the menu. | //Generate a random set of colors for the menu each time the menu is hovered over.
elm.menu_elm.addEventListener("mouseover", function() {
if (menuStyle) {
document.head.removeChild(menuStyle)
}
function makeRandom (){
return Math.floor(Math.random() * 16777215).toString(16).toUpperCase();
}
menuStyle = document.createElement("style");
const randomColor = makeRandom();
const randomColorBG = makeRandom();
const randomColorBorder = makeRandom();
menuStyle.innerHTML = `
#menu.hover,#nav {background: #${randomColorBG};border-color: #${randomColorBorder};color: #${randomColor};}
#nav li {border-top-color: #${randomColorBorder};}
#nav li.hover {background-color: #${randomColorBG};}
#coords {background-color: #${randomColorBG};color: #${randomColor};}`
document.head.appendChild(menuStyle);
})
|
menuStyle.innerHTML = "#menu.hover, #nav {" +
"background: " + color + ";" +
"border-color: " + bColor + ";" +
"color: " + tColor + ";" +
"}\n" +
"#nav li {" +
"border-top-color: " + bColor + ";" +
"}\n" +
"#nav li.hover {" +
"background-color: " + hColor + ";" +
"}\n" +
"#coords {" +
"background-color: " + bColor + ";" +
"color: " + tColor + ";" +
"}";
}
| |
styles | An object which controls the colors used within a world. | //Sets the public tile color to red.
styles.public = "red";
renderTiles(true);
|
var styles = defaultStyles();
| |
nextObjId | An integer used to track edits. | //Writes the character "█" at the cursorCoords location, then updates the nextObjId id
const [tileX, tileY, charX, charY] = cursorCoords;
console.log(currentPosition)
const editArray = [tileY, tileX, charY, charX, getDate(),"█", nextObjId]
writeBuffer.push(editArray);
nextObjId++;
|
var nextObjId = 1;
| |
owotWidth,
owotHeight |
The current width and height of the DOM window. | //Estimate the total number of fully visible cells that could exist on the screen
const cellAmount = Math.floor(owotHeight/cellH * owotWidth/cellW);
|
owotWidth = Math.round(window_width * ratio);
owotHeight = Math.round(window_height * ratio);
| |
js_alert_active | A bool stating if the javascript alert window is open. | var js_alert_active = false;
| ||
worldFocused | A bool stating if the owot canvas is in focus. | //check every 100ms if the owot canvas was last clicked, if it was then randomly change the public tile color.
setInterval(function() {
if (worldFocused) {
styles.public = "#" + Math.floor(Math.random() * 16777215).toString(16).toUpperCase();
w.redraw()
}
}, 100)
|
if(closest(target, getChatfield()) || target == elm.chatbar || target == elm.confirm_js_code) {
worldFocused = false;
} else {
worldFocused = true;
}
| |
chatResizing | A bool stating if the chat window is being resized. | //check every 100ms if the chat is resizing, if it is, change the public tile color
setInterval(function() {
if (chatResizing) {
styles.public = "#" + Math.floor(Math.random() * 16777215).toString(16).toUpperCase();
w.redraw()
}
}, 100)
|
draggable_element(elm.chat_window, null, [
elm.chatbar, elm.chatsend, elm.chat_close, elm.chat_page_tab, elm.chat_global_tab, elm.page_chatfield, elm.global_chatfield
], function() {
if(chatResizing) {
return -1;
}
});
| |
tiles | An object containing all the loaded tiles. | //Return any visible links
const [X,Y] = cursorCoords;
tiles[`${X},${Y}`].properties.cell_props
|
Tile.set = function(tileX, tileY, data) {
var str = tileY + "," + tileX;
if(!(str in tiles)) {
w.tile.count++;
}
tiles[str] = data;
expandLocalBoundary(tileX, tileY);
return data;
}
| |
images,
keysPressed, imgPatterns |
Empty, unused objects. | var images = {};
var keysPressed = {};
| ||
previousErase | An integer of the last date the erase function was utilised. | //Logs the previous erase time in a human-readable way.
function readPreviousErase() {
if (previousErase == 0) {
return
}
const date = new Date(previousErase);
const options = {
year: 'numeric',
month: 'long',
day: 'numeric',
hour: '2-digit',
minute: '2-digit',
second: '2-digit',
timeZoneName: 'short'
};
console.log("last Erased at:", date.toLocaleString(undefined, options));
}
|
function event_input(e) {
if(e.inputType == "deleteContentBackward") {
if(getDate() - previousErase > 25 || !previousErase) {
moveCursor("left", true);
writeChar("\x08", true, null, false, 1);
}
previousErase = getDate();
}
}
| |
verticalEnterPos | A 2D array coordinate of the position to go when pressing enter. | //Stair-step the return position on "enter"
textInput.addEventListener("input", function(e) {
if (e.inputType === "insertLineBreak") {
const [X, x] = verticalEnterPos;
verticalEnterPos = [X, (x + 1) % 16]
}
})
|
if(noVertPos) {
coords.tileX = 0;
coords.charX = 0;
} else {
coords.tileX = verticalEnterPos[0];
coords.charX = verticalEnterPos[1];
}
| |
textColorOverride | public-member-owner bitfield used to modify the text color in fields. | if(styles.public_text != "#000" && styles.public_text != "#000000") {
textColorOverride |= public;
} else {
textColorOverride &= textColorOverride ^ public;
}
| ||
writeBuffer | An object holding data waiting to be rendered to the canvas. | //Writes the character "█" at the cursorCoords location
const [tileX, tileY, charX, charY] = cursorCoords;
const editArray = [tileY, tileX, charY, charX, getDate(), "█", nextObjId++]
writeBuffer.push(editArray);
|
tellEdit.push(editArray); // track local changes
writeBuffer.push(editArray); // send edits to server
nextObjId++;
| |
highlightFlash | An object containing cell coordinates of cells to be highlighted. | //Flashes a random color on all visible cells
function flashRandom() {
const visibleTiles = getVisibleTiles();
const color = [Math.floor(Math.random() * 256), Math.floor(Math.random() * 256), Math.floor(Math.random() * 256)];
const positions = [];
// Generate the positions array
for (const [tileX, tileY] of visibleTiles) {
for (let charY = 0; charY < 8; charY++) {
for (let charX = 0; charX < 16; charX++) {
positions.push([tileX, tileY, charX, charY]);
}
}
}
// Update highlightFlash based on positions
for (const [tileX, tileY, charX, charY] of positions) {
const tileKey = `${tileY},${tileX}`;
highlightFlash[tileKey] ??= {};
highlightFlash[tileKey][charY] ??= {};
if (!highlightFlash[tileKey][charY][charX]) {
highlightFlash[tileKey][charY][charX] = [getDate(), color, [...color]];
highlightCount++;
}
}
}
|
if(!highlightFlash[tileY + "," + tileX]) {
highlightFlash[tileY + "," + tileX] = {};
}
| |
highlightCount | An iterator used to limit the amount of highlights rendered to the canvas. | //Prevents the user from seeing highlights
highlightCount = Infinity;
|
if(highlightCount > highlightLimit && !unlimited) return;
| |
coloredChars | An object holding all of the highlighted characters. | var container = coloredChars[tileY + "," + tileX];
if(!container) {
container = {};
coloredChars[tileY + "," + tileX] = container;
}
| ||
shiftOptState | An object used to store the viewport values | var shiftOptState = { prevX: 0, prevY: 0, x1: 0, y1: 0, x2: 0, y2: 0, prevZoom: -1 };
| ||
backgroundImage | ||||
backgroundPattern | ||||
backgroundPatternSize | ||||
guestCursorsByTile | ||||
guestCursors | ||||
clientGuestCursorPos | ||||
disconnectTimeout | ||||
menuOptions | ||||
undoBuffer | ||||
textDecorationOffset | ||||
textDecorationModes | ||||
fontTemplate | ||||
specialFontTemplate | ||||
fontOrder | ||||
specialFontOrder | ||||
initiallyFetched | ||||
lastLinkHover | ||||
lastTileHover | ||||
regionSelections | ||||
specialClientHooks | ||||
specialClientHookMap | ||||
bgImageHasChanged | ||||
remoteBoundary | ||||
boundaryStatus | ||||
positionX | ||||
positionY | ||||
coordSizeX | ||||
coordSizeY | ||||
gridEnabled | ||||
subgridEnabled | ||||
linksEnabled | ||||
linksRendered | ||||
colorsEnabled | ||||
backgroundEnabled | ||||
scrollingEnabled | ||||
zoomRatio | ||||
protectPrecision | ||||
checkTileFetchInterval | ||||
zoom | ||||
userZoom | ||||
unloadTilesAuto | ||||
useHighlight | ||||
highlightLimit | ||||
ansiBlockFill | ||||
colorizeLinks | ||||
brBlockFill | ||||
tileFetchOffsetX | ||||
tileFetchOffsetY | ||||
ignoreCanvasContext | ||||
elementSnapApprox | ||||
mSpecRendering | ||||
combiningCharsEnabled | ||||
surrogateCharsEnabled | ||||
defaultCoordLinkColor | ||||
defaultURLLinkColor | ||||
defaultHighlightColor | ||||
secureJSLink | ||||
secureLink | ||||
pasteDirRight | ||||
pasteDirDown | ||||
defaultCursor | ||||
defaultDragCursor | ||||
fetchClientMargin | ||||
classicTileProcessing | ||||
unloadedPatternPanning | ||||
cursorRenderingEnabled | ||||
guestCursorsEnabled | ||||
showMyGuestCursor | ||||
unobstructCursor | ||||
shiftOptimization | ||||
transparentBackground | ||||
writeFlushRate | ||||
bufferLargeChars | ||||
cursorOutlineEnabled | ||||
showCursorCoordinates | ||||
textDecorationsEnabled | ||||
keyConfig | ||||
draggable_element_mousemove | ||||
draggable_element_mouseup | ||||
defaultSizes | ||||
cellWidthPad | ||||
tileW | ||||
tileH | ||||
cellW | ||||
cellH | ||||
font | ||||
specialCharFont | ||||
tileC | ||||
tileR | ||||
tileArea | ||||
tileWidth | ||||
tileHeight | ||||
dTileW | ||||
dTileH | ||||
textRenderCanvas | ||||
textRenderCtx | ||||
tileProtectAuto | ||||
linkAuto | ||||
autoTotal | ||||
cursorCoords | ||||
cursorCoordsCurrent | ||||
currentPosition | ||||
currentPositionInitted | ||||
currentMousePosition | ||||
Tile | ||||
poolCleanupInterval | ||||
dragStartX | ||||
dragStartY | ||||
dragPosX | ||||
dragPosY | ||||
isDragging | ||||
hasDragged | ||||
draggingEnabled | ||||
cursorEnabled | ||||
writeInterval | ||||
write_busy | ||||
pasteInterval | ||||
linkQueue | ||||
autoArrowKeyMoveInterval | ||||
autoArrowKeyMoveActive | ||||
autoArrowKeyMoveState | ||||
linkParams | ||||
currentSelectedLink | ||||
currentSelectedLinkCoords | ||||
touchInitZoom | ||||
touchInitDistance | ||||
touchPrev | ||||
fetchInterval | ||||
timesConnected | ||||
colorClasses | ||||
isTileLoaded | ||||
isTileVisible | ||||
networkHTTP | ||||
network | ||||
w | ||||
tellEdit | ||||
ws_functions |
chat.js
Event listeners
Object | Listen Event | Functions/Events Fired | Emits | Example Usage | Related Code |
---|---|---|---|---|---|
elm.chatsend | click | sendChat() | elm.chatsend.addEventListener("click", function() {
sendChat();
});
| ||
elm.chatbar | keypress | var keyCode = e.keyCode;
if(keyCode == 13) { sendChat(); } |
elm.chatbar.addEventListener("keypress", function(e) {
var keyCode = e.keyCode;
if(keyCode == 13) { // Enter
sendChat();
}
});
| ||