Jump to content

Docs: Difference between revisions

← Older edit
VisualWikitext
Poopman (talk | contribs)
editor
40 edits
Dat Hack3r (talk | contribs)
editor
1,336 edits
m Added page to Documentation category.
 
(26 intermediate revisions by 4 users not shown)
Line 1: Line 1:
=Our World Of Text=
=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]]
If you want to talk about this page, go to [[Talk:Docs]]
===Code Documentation===
===Code Documentation===
Line 10: Line 12:
!Object
!Object
!Listen Event
!Listen Event
!Functions Fired
!Functions/Events Fired
!Description
!Emits
!Code In Use
!Example Usage
!Related Code
|-
|-
|window
|window
|load
|load
|w.emit("clientLoaded");
|
|
|"clientLoaded"
|
|
|<syntaxhighlight lang="javascript" line="1" start="187">
window.addEventListener("load", function() {
w.emit("clientLoaded");
});
</syntaxhighlight>
|-
|-
|
|
Line 24: Line 32:
|manageCoordHash();
|manageCoordHash();
|
|
|
|https://ourworldoftext.com/#x:10,y:20
|<syntaxhighlight lang="javascript" line="1" start="5639">
window.onhashchange = function(e) {
manageCoordHash();
}
</syntaxhighlight>
|-
|-
|
|
Line 31: Line 44:
|
|
|
|
|<syntaxhighlight lang="javascript" line="1" start="5643">
window.onbeforeunload = function() {
if(writeBuffer.length) flushWrites();
}
</syntaxhighlight>
|-
|-
|
|
|resize
|resize
|event_resize
|event_resize
|("resize", ratio)
|
|
|
|<syntaxhighlight lang="javascript" line="1" start="1192">
window.addEventListener("resize", event_resize);
</syntaxhighlight>
|-
|-
|document
|document
Line 43: Line 64:
|
|
|
|
|<syntaxhighlight lang="javascript" line="1" start="5647">
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;
}
</syntaxhighlight>
|-
|-
|
|
Line 53: Line 83:
|
|
|
|
|<syntaxhighlight lang="javascript" line="1" start="525">
document.addEventListener("keydown", keydown_regionSelect);
</syntaxhighlight><syntaxhighlight lang="javascript" line="1" start="1344">
document.addEventListener("keydown", event_keydown_copy_char);
</syntaxhighlight><syntaxhighlight lang="javascript" line="1" start="1371">
document.addEventListener("keydown", event_keydown_copy_color);
</syntaxhighlight><syntaxhighlight lang="javascript" line="1" start="2955">
document.addEventListener("keydown", event_keydown);
</syntaxhighlight>
|-
|-
|
|
|key up
|key up
|event_keyup
|event_keyup
|("keyUp", e);
|
|
|
|<syntaxhighlight lang="javascript" line="1" start="2957">
function event_keyup(e) {
w.emit("keyUp", e);
}
</syntaxhighlight>
|-
|-
|
|
Line 66: Line 110:
* mousemove_linkAuto
* mousemove_linkAuto
* event_mousemove
* event_mousemove
|("mouseMove", {
tileX: tileX,
tileY: tileY,
charX: charX,
charY: charY,
pageX: pageX,
pageY: pageY
})
|
|
|
|<syntaxhighlight lang="javascript" line="1" start="945">
document.addEventListener("mousemove", mousemove_tileProtectAuto);
</syntaxhighlight><syntaxhighlight lang="javascript" line="1" start="1075">
document.addEventListener("mousemove", mousemove_linkAuto);
</syntaxhighlight><syntaxhighlight lang="javascript" line="1" start="3321">
document.addEventListener("mousemove", event_mousemove);
</syntaxhighlight>
|-
|-
|
|
|mouse down
|mouse down
|event_mousedown
|event_mousedown
|
|("mouseDown", {
|
tileX: pos[0],
 
tileY: pos[1],
 
charX: pos[2],
 
charY: pos[3],
 
pageX: pageX,
 
pageY: pageY
 
});
|
|<syntaxhighlight lang="javascript" line="1" start="1771">
document.addEventListener("mousedown", event_mousedown);
</syntaxhighlight>
|-
|-
|
|
Line 80: Line 160:
|
|
|
|
|-
|<syntaxhighlight lang="javascript" line="1" start="1947">
|
document.addEventListener("mouseup", event_mouseup);
|mouse leave
</syntaxhighlight>
|event_mouseleave
|
|
|-
|-
|
|
|mouse enter
|mouse enter
|event_mouseenter
|event_mouseenter
|("mouseEnter", e)
|
|
|
|<syntaxhighlight lang="javascript" line="1" start="1958">
document.addEventListener("mouseenter", event_mouseenter);
</syntaxhighlight>
|-
|-
|
|
Line 98: Line 178:
|
|
|
|
|<syntaxhighlight lang="javascript" line="1" start="3452">
document.addEventListener("touchstart", event_touchstart);
</syntaxhighlight>
|-
|-
|
|
Line 104: Line 187:
|
|
|
|
|<syntaxhighlight lang="javascript" line="1" start="3453">
document.addEventListener("touchend", event_touchend);
</syntaxhighlight>
|-
|-
|
|
Line 110: Line 196:
|
|
|
|
|<syntaxhighlight lang="javascript" line="1" start="3454">
document.addEventListener("touchmove", event_touchmove, { passive: false });
</syntaxhighlight>
|-
|-
|
|
Line 116: Line 205:
* event_wheel
* event_wheel
* event_wheel_zoom
* event_wheel_zoom
|("scroll", {
deltaX: -deltaX,
deltaY: -deltaY
});
|
|
|
|<syntaxhighlight lang="javascript" line="1" start="3487">
document.addEventListener("wheel", event_wheel);
</syntaxhighlight><syntaxhighlight lang="javascript" line="1" start="3537">
document.addEventListener("wheel", event_wheel_zoom, {
passive: false
});
</syntaxhighlight>
|-
|-
|document.body
|document.body
Line 126: Line 227:
|
|
|
|
|<syntaxhighlight lang="javascript" line="1" start="1012">
document.body.addEventListener("keydown", keydown_tileProtectAuto);
</syntaxhighlight><syntaxhighlight lang="javascript" line="1" start="1138">
document.body.addEventListener("keydown", keydown_linkAuto);
</syntaxhighlight>
|-
|-
|
|
Line 132: Line 238:
|
|
|
|
|<syntaxhighlight lang="javascript" line="1" start="1164">
document.body.addEventListener("keyup", onKeyUp);
</syntaxhighlight>
|-
|-
|w
|w
|cursor Move
|cursor Move
|updateCoordDisplay
|
|
|
|
|
|<syntaxhighlight lang="javascript" line="1" start="280">
w.on("cursorMove", updateCoordDisplay);
</syntaxhighlight>
|-
|-
|
|
|cursor Hide
|cursor Hide
|updateCoordDisplay
|
|
|
|
|
|<syntaxhighlight lang="javascript" line="1" start="281">
w.on("cursorHide", updateCoordDisplay);
</syntaxhighlight>
|-
|-
|
|
|tiles Rendered
|tiles Rendered
|self
|
|
|
|
|
|<syntaxhighlight lang="javascript" line="1" start="4747">
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);
}
});
</syntaxhighlight>
|-
|-
|
|
|cursor Move
|cursor Move
|setClientGuestCursorPosition
|
|
|
|
|
|<syntaxhighlight lang="javascript" line="1" start="4754">
w.on("cursorMove", function(pos) {
setClientGuestCursorPosition(pos.tileX, pos.tileY, pos.charX, pos.charY);
});
</syntaxhighlight>
|-
|-
|
|
|cursor Hide
|cursor Hide
|setClientGuestCursorPosition
|
|
|
|
|
|<syntaxhighlight lang="javascript" line="1" start="4758">
w.on("cursorHide", function() {
setClientGuestCursorPosition(0, 0, 0, 0, true);
});
</syntaxhighlight>
|-
|-
|elm.textInput
|elm.textInput
Line 168: Line 301:
* input
* input
|
|
* stabilizeTextInput
* event_input
|
|
|
|
|-
|<syntaxhighlight lang="javascript" line="1" start="2618">
|
elm.textInput.addEventListener("keydown", stabilizeTextInput);
|
elm.textInput.addEventListener("input", event_input);
|
</syntaxhighlight>
|
|
|-
|-
|elm.owot
|elm.owot
|context menu
|context menu
|self
|
|
|
|
|
|<syntaxhighlight lang="javascript" line="1" start="5628">
elm.owot.oncontextmenu = function() {
if(ignoreCanvasContext) {
ignoreCanvasContext = false;
elm.owot.style.pointerEvents = "none";
setTimeout(function() {
ignoreCanvasContext = true;
elm.owot.style.pointerEvents = "";
}, 1);
}
}
</syntaxhighlight>
|-
|-
|elm.coords
|elm.coords
|click
|click
|self
|
|
|
|
|
|<syntaxhighlight lang="javascript" line="1" start="283">
elm.coords.onclick = function() {
showCursorCoordinates = !showCursorCoordinates;
if(showCursorCoordinates) {
elm.cursor_coords.style.display = "";
updateCoordDisplay();
} else {
elm.cursor_coords.style.display = "none";
updateCoordDisplay();
}
}
</syntaxhighlight>
|}
|}


Line 201: Line 358:
|
|
|
|
|
|<syntaxhighlight lang="javascript" line="1" start="11">
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
});
}
</syntaxhighlight>
|-
|-
|getWndWidth()
|getWndWidth()
|
|
|
|
|
|<syntaxhighlight lang="javascript" line="1" start="27">
function getWndWidth() {
return document.body.clientWidth || window.innerWidth;
}
</syntaxhighlight>
|-
|-
|getWndHeight()
|getWndHeight()
Line 2,235: Line 2,413:
|
|
|}
|}
== chat.js ==
=== Event listeners ===
{| class="wikitable"
!Object
!Listen Event
!Functions/Events Fired
!Emits
!Example Usage
!Related Code
|-
|elm.chatsend
|click
|sendChat()
|
|
|<syntaxhighlight lang="javascript" line="1" start="260">
elm.chatsend.addEventListener("click", function() {
sendChat();
});
</syntaxhighlight>
|-
|elm.chatbar
|keypress
|var keyCode = e.keyCode;
if(keyCode == 13) {
sendChat();
}
|
|
|<syntaxhighlight lang="javascript" line="1" start="264">
elm.chatbar.addEventListener("keypress", function(e) {
var keyCode = e.keyCode;
if(keyCode == 13) { // Enter
sendChat();
}
});
</syntaxhighlight>
|-
|elm.chatbar
|keydown
|var keyCode = e.keyCode;
// scroll through chat history that the client sent
if(keyCode == 38) { // up
// history modified
if(chatWriteHistoryIdx > -1 && elm.chatbar.value != chatWriteHistory[chatWriteHistory.length - chatWriteHistoryIdx - 1]) {
chatWriteHistory[chatWriteHistory.length - chatWriteHistoryIdx - 1] = elm.chatbar.value;
}
if(chatWriteHistoryIdx == -1 && elm.chatbar.value) {
chatWriteTmpBuffer = elm.chatbar.value;
}
chatWriteHistoryIdx++;
if(chatWriteHistoryIdx >= chatWriteHistory.length) chatWriteHistoryIdx = chatWriteHistory.length - 1;
var upVal = chatWriteHistory[chatWriteHistory.length - chatWriteHistoryIdx - 1];
if(!upVal) return;
elm.chatbar.value = upVal;
// pressing up will move the cursor all the way to the left by default
e.preventDefault();
moveCaretEnd(elm.chatbar);
} else if(keyCode == 40) { // down
// history modified
if(chatWriteHistoryIdx > -1 && elm.chatbar.value != chatWriteHistory[chatWriteHistory.length - chatWriteHistoryIdx - 1]) {
chatWriteHistory[chatWriteHistory.length - chatWriteHistoryIdx - 1] = elm.chatbar.value;
}
chatWriteHistoryIdx--;
if(chatWriteHistoryIdx < -1) {
chatWriteHistoryIdx = -1;
return;
}
var str = "";
if(chatWriteHistoryIdx != -1) {
str = chatWriteHistory[chatWriteHistory.length - chatWriteHistoryIdx - 1];
} else {
if(chatWriteTmpBuffer) {
str = chatWriteTmpBuffer;
e.preventDefault();
moveCaretEnd(elm.chatbar);
}
}
elm.chatbar.value = str;
e.preventDefault();
moveCaretEnd(elm.chatbar);
}
|
|
|<syntaxhighlight lang="javascript" line="1" start="283">
elm.chatbar.addEventListener("keydown", function(e) {
var keyCode = e.keyCode;
// scroll through chat history that the client sent
if(keyCode == 38) { // up
// history modified
if(chatWriteHistoryIdx > -1 && elm.chatbar.value != chatWriteHistory[chatWriteHistory.length - chatWriteHistoryIdx - 1]) {
chatWriteHistory[chatWriteHistory.length - chatWriteHistoryIdx - 1] = elm.chatbar.value;
}
if(chatWriteHistoryIdx == -1 && elm.chatbar.value) {
chatWriteTmpBuffer = elm.chatbar.value;
}
chatWriteHistoryIdx++;
if(chatWriteHistoryIdx >= chatWriteHistory.length) chatWriteHistoryIdx = chatWriteHistory.length - 1;
var upVal = chatWriteHistory[chatWriteHistory.length - chatWriteHistoryIdx - 1];
if(!upVal) return;
elm.chatbar.value = upVal;
// pressing up will move the cursor all the way to the left by default
e.preventDefault();
moveCaretEnd(elm.chatbar);
} else if(keyCode == 40) { // down
// history modified
if(chatWriteHistoryIdx > -1 && elm.chatbar.value != chatWriteHistory[chatWriteHistory.length - chatWriteHistoryIdx - 1]) {
chatWriteHistory[chatWriteHistory.length - chatWriteHistoryIdx - 1] = elm.chatbar.value;
}
chatWriteHistoryIdx--;
if(chatWriteHistoryIdx < -1) {
chatWriteHistoryIdx = -1;
return;
}
var str = "";
if(chatWriteHistoryIdx != -1) {
str = chatWriteHistory[chatWriteHistory.length - chatWriteHistoryIdx - 1];
} else {
if(chatWriteTmpBuffer) {
str = chatWriteTmpBuffer;
e.preventDefault();
moveCaretEnd(elm.chatbar);
}
}
elm.chatbar.value = str;
e.preventDefault();
moveCaretEnd(elm.chatbar);
}
});
</syntaxhighlight>
|-
|elm.chat_close
|click
|w.emit("chatClose");
elm.chat_window.style.display = "none";
elm.chat_open.style.display = "";
chatOpen = false;
|"chatClose"
|
|<syntaxhighlight lang="javascript" line="1" start="328">
elm.chat_close.addEventListener("click", function() {
w.emit("chatClose");
elm.chat_window.style.display = "none";
elm.chat_open.style.display = "";
chatOpen = false;
});
</syntaxhighlight>
|-
|elm.chat_open
|click
|elm.chat_window.style.display = "";
elm.chat_open.style.display = "none";
chatOpen = true;
if(selectedChatTab == 0) {
chatPageUnread = 0;
updateUnread();
if(!initPageTabOpen) {
initPageTabOpen = true;
elm.page_chatfield.scrollTop = elm.page_chatfield.scrollHeight;
}
} else {
chatGlobalUnread = 0;
updateUnread();
if(!initGlobalTabOpen) {
initGlobalTabOpen = true;
elm.global_chatfield.scrollTop = elm.global_chatfield.scrollHeight;
}
}
var chatWidth = chat_window.offsetWidth - 2;
var chatHeight = chat_window.offsetHeight - 2;
var screenRatio = window.devicePixelRatio;
if(!screenRatio) screenRatio = 1;
var virtWidth = owotWidth / screenRatio;
if(chatWidth > virtWidth) {
resizeChat(virtWidth - 2, chatHeight);
}
|"chatOpen"
|
|<syntaxhighlight lang="javascript" line="1" start="335">
elm.chat_open.addEventListener("click", function() {
w.emit("chatOpen");
elm.chat_window.style.display = "";
elm.chat_open.style.display = "none";
chatOpen = true;
if(selectedChatTab == 0) {
chatPageUnread = 0;
updateUnread();
if(!initPageTabOpen) {
initPageTabOpen = true;
elm.page_chatfield.scrollTop = elm.page_chatfield.scrollHeight;
}
} else {
chatGlobalUnread = 0;
updateUnread();
if(!initGlobalTabOpen) {
initGlobalTabOpen = true;
elm.global_chatfield.scrollTop = elm.global_chatfield.scrollHeight;
}
}
var chatWidth = chat_window.offsetWidth - 2;
var chatHeight = chat_window.offsetHeight - 2;
var screenRatio = window.devicePixelRatio;
if(!screenRatio) screenRatio = 1;
var virtWidth = owotWidth / screenRatio;
if(chatWidth > virtWidth) {
resizeChat(virtWidth - 2, chatHeight);
}
});
</syntaxhighlight>
|-
|elm.chat_page_tab
|click
|elm.chat_page_tab.classList.add("chat_tab_selected");
elm.chat_global_tab.classList.remove("chat_tab_selected");
elm.global_chatfield.style.display = "none";
elm.page_chatfield.style.display = "";
selectedChatTab = 0;
chatPageUnread = 0;
updateUnread();
if(!initPageTabOpen) {
initPageTabOpen = true;
elm.page_chatfield.scrollTop = elm.page_chatfield.scrollHeight;
}
|
|
|<syntaxhighlight lang="js" line="1" start="365">
elm.chat_page_tab.addEventListener("click", function() {
elm.chat_page_tab.classList.add("chat_tab_selected");
elm.chat_global_tab.classList.remove("chat_tab_selected");
elm.global_chatfield.style.display = "none";
elm.page_chatfield.style.display = "";
selectedChatTab = 0;
chatPageUnread = 0;
updateUnread();
if(!initPageTabOpen) {
initPageTabOpen = true;
elm.page_chatfield.scrollTop = elm.page_chatfield.scrollHeight;
}
});
</syntaxhighlight>
|-
|elm.chat_global_tab
|click
|elm.chat_global_tab.classList.add("chat_tab_selected");
elm.chat_page_tab.classList.remove("chat_tab_selected");
elm.global_chatfield.style.display = "";
elm.page_chatfield.style.display = "none";
selectedChatTab = 1;
chatGlobalUnread = 0;
updateUnread();
if(!initGlobalTabOpen) {
initGlobalTabOpen = true;
elm.global_chatfield.scrollTop = elm.global_chatfield.scrollHeight;
}
|
|
|<syntaxhighlight lang="js" line="1" start="380">
elm.chat_global_tab.addEventListener("click", function() {
elm.chat_global_tab.classList.add("chat_tab_selected");
elm.chat_page_tab.classList.remove("chat_tab_selected");
elm.global_chatfield.style.display = "";
elm.page_chatfield.style.display = "none";
selectedChatTab = 1;
chatGlobalUnread = 0;
updateUnread();
if(!initGlobalTabOpen) {
initGlobalTabOpen = true;
elm.global_chatfield.scrollTop = elm.global_chatfield.scrollHeight;
}
});
</syntaxhighlight>
|-
|chat_window
|mousemove
|if(isDown) return;
var posX = e.pageX - chat_window.offsetLeft;
var posY = e.pageY - chat_window.offsetTop;
var top = (posY) <= 4;
var left = (posX) <= 3;
var right = (chat_window.offsetWidth - posX) <= 4;
var bottom = (chat_window.offsetHeight - posY) <= 5;
var cursor = "";
if(left || right) cursor = "ew-resize";
if(top || bottom) cursor = "ns-resize";
if((top && left) || (right && bottom)) cursor = "nwse-resize";
if((bottom && left) || (top && right)) cursor = "nesw-resize";
chat_window.style.cursor = cursor;
state = bottom << 3 | right << 2 | left << 1 | top;
|
|
|<syntaxhighlight lang="js" line="1" start="404">
chat_window.addEventListener("mousemove", function(e) {
if(isDown) return;
var posX = e.pageX - chat_window.offsetLeft;
var posY = e.pageY - chat_window.offsetTop;
var top = (posY) <= 4;
var left = (posX) <= 3;
var right = (chat_window.offsetWidth - posX) <= 4;
var bottom = (chat_window.offsetHeight - posY) <= 5;
var cursor = "";
if(left || right) cursor = "ew-resize";
if(top || bottom) cursor = "ns-resize";
if((top && left) || (right && bottom)) cursor = "nwse-resize";
if((bottom && left) || (top && right)) cursor = "nesw-resize";
chat_window.style.cursor = cursor;
state = bottom << 3 | right << 2 | left << 1 | top;
});
</syntaxhighlight>
|-
|chat_window
|mousedown
|downX = e.pageX;
downY = e.pageY;
if(state) {
// subtract 2 for the borders
chatWidth = chat_window.offsetWidth - 2;
chatHeight = chat_window.offsetHeight - 2;
elmX = chat_window.offsetLeft;
elmY = chat_window.offsetTop;
isDown = true;
chatResizing = true;
}
|
|
|<syntaxhighlight lang="js" line="1" start="420">
chat_window.addEventListener("mousedown", function(e) {
downX = e.pageX;
downY = e.pageY;
if(state) {
// subtract 2 for the borders
chatWidth = chat_window.offsetWidth - 2;
chatHeight = chat_window.offsetHeight - 2;
elmX = chat_window.offsetLeft;
elmY = chat_window.offsetTop;
isDown = true;
chatResizing = true;
}
});
</syntaxhighlight>
|-
|document
|mouseup
|isDown = false;
chatResizing = false;
|
|
|<syntaxhighlight lang="js" line="1" start="433">
document.addEventListener("mouseup", function() {
isDown = false;
chatResizing = false;
});
</syntaxhighlight>
|-
|document
|mousemove
|if(!isDown) return;
var offX = e.pageX - downX;
var offY = e.pageY - downY;
var resize_bottom = state >> 3 & 1;
var resize_right = state >> 2 & 1;
var resize_left = state >> 1 & 1;
var resize_top = state & 1;
var width_delta = 0;
var height_delta = 0;
var abs_top = chat_window.offsetTop;
var abs_left = chat_window.offsetLeft;
var snap_bottom = chat_window.style.bottom == "0px";
var snap_right = chat_window.style.right == "0px";
if(resize_top) {
height_delta = -offY;
} else if(resize_bottom) {
height_delta = offY;
}
if(resize_left) {
width_delta = -offX;
} else if(resize_right) {
width_delta = offX;
}
var res = resizeChat(chatWidth + width_delta, chatHeight + height_delta);
if(resize_top && !snap_bottom) {
chat_window.style.top = (elmY + (chatHeight - res[1])) + "px";
}
if(resize_bottom && snap_bottom) {
chat_window.style.bottom = "";
chat_window.style.top = abs_top + "px";
}
if(resize_right && snap_right) {
chat_window.style.right = "";
chat_window.style.left = abs_left + "px";
}
if(resize_left && !snap_right) {
chat_window.style.left = (elmX + (chatWidth - res[0])) + "px";
}
|
|
|<syntaxhighlight lang="js" line="1" start="437">
document.addEventListener("mousemove", function(e) {
if(!isDown) return;
var offX = e.pageX - downX;
var offY = e.pageY - downY;
var resize_bottom = state >> 3 & 1;
var resize_right = state >> 2 & 1;
var resize_left = state >> 1 & 1;
var resize_top = state & 1;
var width_delta = 0;
var height_delta = 0;
var abs_top = chat_window.offsetTop;
var abs_left = chat_window.offsetLeft;
var snap_bottom = chat_window.style.bottom == "0px";
var snap_right = chat_window.style.right == "0px";
if(resize_top) {
height_delta = -offY;
} else if(resize_bottom) {
height_delta = offY;
}
if(resize_left) {
width_delta = -offX;
} else if(resize_right) {
width_delta = offX;
}
var res = resizeChat(chatWidth + width_delta, chatHeight + height_delta);
if(resize_top && !snap_bottom) {
chat_window.style.top = (elmY + (chatHeight - res[1])) + "px";
}
if(resize_bottom && snap_bottom) {
chat_window.style.bottom = "";
chat_window.style.top = abs_top + "px";
}
if(resize_right && snap_right) {
chat_window.style.right = "";
chat_window.style.left = abs_left + "px";
}
if(resize_left && !snap_right) {
chat_window.style.left = (elmX + (chatWidth - res[0])) + "px";
}
});
</syntaxhighlight>
|}
=== Functions ===
{| class="wikitable"
!Name
!Description
!Example usage
!Related code
|-
|api_chat_send(message,opts)
|Sends a chat message from the user running code
|<syntaxhighlight lang="js">
api_chat_send("Hello!",{nick:"nickname"});
</syntaxhighlight>
|<syntaxhighlight lang="js" line="1" start="75">
function api_chat_send(message, opts) {
if(!message) return;
if(!opts) opts = {};
var exclude_commands = opts.exclude_commands;
var nick = opts.nick || YourWorld.Nickname || state.userModel.username;
var location = opts.location ? opts.location : (selectedChatTab == 0 ? "page" : "global");
var msgLim = state.userModel.is_staff ? 3030 : 400;
message = message.trim();
if(!message.length) return;
message = message.slice(0, msgLim);
chatWriteHistory.push(message);
if(chatWriteHistory.length > chatWriteHistoryMax) {
chatWriteHistory.shift();
}
chatWriteHistoryIdx = -1;
chatWriteTmpBuffer = "";
var chatColor;
if(!opts.color) {
if(!YourWorld.Color) {
chatColor = assignColor(nick);
} else {
chatColor = "#" + ("00000" + YourWorld.Color.toString(16)).slice(-6);
}
} else {
chatColor = opts.color;
}
if(!exclude_commands && message.startsWith("/")) {
var args = message.substr(1).split(" ");
var command = args[0].toLowerCase();
args.shift();
if(client_commands.hasOwnProperty(command)) {
client_commands[command](args);
return;
}
}
network.chat(message, location, nick, chatColor);
}
</syntaxhighlight>
|-
|clientChatResponse(message)
|Creates a client-side message only visible to you
|<syntaxhighlight lang="js">
clientChatResponse("This is a client message.");
</syntaxhighlight>
|<syntaxhighlight lang="js" line="1" start="118">
function clientChatResponse(message) {
addChat(null, 0, "user", "[ Client ]", message, "Client", false, false, false, null, getDate());
}
</syntaxhighlight>
|-
|sendChat()
|Sends whatever is in the chat textbox to chat.
|<syntaxhighlight lang="js">
sendChat();
</syntaxhighlight>
|<syntaxhighlight lang="js" line="1" start="216">
function sendChat() {
var chatText = elm.chatbar.value;
elm.chatbar.value = "";
var opts = {};
if(defaultChatColor != null) {
opts.color = "#" + ("00000" + defaultChatColor.toString(16)).slice(-6);
}
api_chat_send(chatText, opts);
}
</syntaxhighlight>
|-
|updateUnread()
|Updates the unread messages counter when chat is closed.
|
|<syntaxhighlight lang="js" line="1" start="226">
function updateUnread() {
var total = elm.total_unread;
var page = elm.page_unread;
var global = elm.global_unread;
var totalCount = chatPageUnread + chatGlobalUnread;
total.style.display = "none";
global.style.display = "none";
page.style.display = "none";
if(totalCount) {
total.style.display = "";
total.innerText = totalCount > 99 ? "99+" : "(" + totalCount + ")";
}
if(chatPageUnread) {
page.style.display = "";
page.innerText = chatPageUnread > 99 ? "99+" : "(" + chatPageUnread + ")";
}
if(chatGlobalUnread) {
global.style.display = "";
global.innerText = chatGlobalUnread > 99 ? "99+" : "(" + chatGlobalUnread + ")";
}
}
</syntaxhighlight>
|-
|event_on_chat(data)
|Updates the unread messages counter for either global chat or the current page.
|
|<syntaxhighlight lang="js" line="1" start="248">
function event_on_chat(data) {
if((!chatOpen || selectedChatTab == 1) && data.location == "page") {
chatPageUnread++;
}
if((!chatOpen || selectedChatTab == 0) && data.location == "global" && !state.worldModel.no_chat_global) {
chatGlobalUnread++;
}
updateUnread();
addChat(data.location, data.id, data.type,
data.nickname, data.message, data.realUsername, data.op, data.admin, data.staff, data.color, data.date || Date.now(), data.dataObj);
}
</syntaxhighlight>
|-
|moveCaretEnd(elm)
|Moves the text cursor to the end of the chat message you want to type in the textbox.
|
|<syntaxhighlight lang="js" line="1" start="271">
function moveCaretEnd(elm) {
if(elm.selectionStart != void 0) {
elm.selectionStart = elm.value.length;
elm.selectionEnd = elm.value.length;
} else if(elm.createTextRange != void 0) {
elm.focus();
var range = elm.createTextRange();
range.collapse(false);
range.select();
}
}
</syntaxhighlight>
|-
|resizable_chat()
|Makes the chat resize on grabbing of corners or edges.
|
|<syntaxhighlight lang="js" line="1" start="395">
function resizable_chat() {
var state = 0;
var isDown = false;
var downX = 0;
var downY = 0;
var elmX = 0;
var elmY = 0;
var chatWidth = 0;
var chatHeight = 0;
chat_window.addEventListener("mousemove", function(e) {
if(isDown) return;
var posX = e.pageX - chat_window.offsetLeft;
var posY = e.pageY - chat_window.offsetTop;
var top = (posY) <= 4;
var left = (posX) <= 3;
var right = (chat_window.offsetWidth - posX) <= 4;
var bottom = (chat_window.offsetHeight - posY) <= 5;
var cursor = "";
if(left || right) cursor = "ew-resize";
if(top || bottom) cursor = "ns-resize";
if((top && left) || (right && bottom)) cursor = "nwse-resize";
if((bottom && left) || (top && right)) cursor = "nesw-resize";
chat_window.style.cursor = cursor;
state = bottom << 3 | right << 2 | left << 1 | top;
});
chat_window.addEventListener("mousedown", function(e) {
downX = e.pageX;
downY = e.pageY;
if(state) {
// subtract 2 for the borders
chatWidth = chat_window.offsetWidth - 2;
chatHeight = chat_window.offsetHeight - 2;
elmX = chat_window.offsetLeft;
elmY = chat_window.offsetTop;
isDown = true;
chatResizing = true;
}
});
document.addEventListener("mouseup", function() {
isDown = false;
chatResizing = false;
});
document.addEventListener("mousemove", function(e) {
if(!isDown) return;
var offX = e.pageX - downX;
var offY = e.pageY - downY;
var resize_bottom = state >> 3 & 1;
var resize_right = state >> 2 & 1;
var resize_left = state >> 1 & 1;
var resize_top = state & 1;
var width_delta = 0;
var height_delta = 0;
var abs_top = chat_window.offsetTop;
var abs_left = chat_window.offsetLeft;
var snap_bottom = chat_window.style.bottom == "0px";
var snap_right = chat_window.style.right == "0px";
if(resize_top) {
height_delta = -offY;
} else if(resize_bottom) {
height_delta = offY;
}
if(resize_left) {
width_delta = -offX;
} else if(resize_right) {
width_delta = offX;
}
var res = resizeChat(chatWidth + width_delta, chatHeight + height_delta);
if(resize_top && !snap_bottom) {
chat_window.style.top = (elmY + (chatHeight - res[1])) + "px";
}
if(resize_bottom && snap_bottom) {
chat_window.style.bottom = "";
chat_window.style.top = abs_top + "px";
}
if(resize_right && snap_right) {
chat_window.style.right = "";
chat_window.style.left = abs_left + "px";
}
if(resize_left && !snap_right) {
chat_window.style.left = (elmX + (chatWidth - res[0])) + "px";
}
});
}
</syntaxhighlight>
|}
=== Variables ===
== permissions.js ==
=== Variables ===
{| class="wikitable"
|+
!Name
!Description
!Related code
|-
|PERM
|Defines permission numbers for easier use instead of writing "Admin"
|<syntaxhighlight lang="js" line="1" start="1">
var PERM = {
ADMIN: 2,
MEMBERS: 1,
PUBLIC: 0
};
</syntaxhighlight>
|}
==== Permissions ====
Since <code>Permissions</code> is a very long dictionary variable, this table is divided into specific definitions in it.
{| class="wikitable"
|+
!Name
!Description
!Related definition
|-
|can_admin
|Checks if user is an admin.
|<syntaxhighlight lang="js" line="1" start="7">
can_admin: function(user) {
return user.is_owner;
},
</syntaxhighlight>
|-
|can_coordlink
|Checks if user can create coordinate links in the world they're in.
|<syntaxhighlight lang="js" line="1" start="10">
can_coordlink: function(user, world) {
return Permissions.user_matches_perm(user, world, world.feature_coord_link);
},
</syntaxhighlight>
|-
|can_edit_tile
|Checks if user can write in a tile / character (protections).
|<syntaxhighlight lang="js" line="1" start="13">
can_edit_tile: function(user, world, tile, charX, charY) {
if(!tile) {
throw new Error("Can't check perms on un-initted tile");
}
if(!Permissions.can_read(user, world)) {
return false;
}
var targetWritability;
if(tile.char) {
targetWritability = tile.char[charY * tileC + charX];
if(targetWritability == null) targetWritability = tile.writability; // inherit from tile
if(targetWritability == null) targetWritability = world.writability; // inherit from world
} else {
targetWritability = tile.writability;
if(targetWritability == null) targetWritability = world.writability;
}
return Permissions.user_matches_perm(user, world, targetWritability);
},
</syntaxhighlight>
|-
|can_go_to_coord
|Checks if user can teleport.
|<syntaxhighlight lang="js" line="1" start="31">
can_go_to_coord: function(user, world) {
return Permissions.user_matches_perm(user, world, world.feature_go_to_coord);
},
</syntaxhighlight>
|-
|can_paste
|Checks if user can paste.
|<syntaxhighlight lang="js" line="1" start="34">
can_paste: function(user, world) {
return Permissions.user_matches_perm(user, world, world.feature_paste);
},
</syntaxhighlight>
|-
|can_copy
|Checks if user can copy.
|<syntaxhighlight lang="js" line="1" start="37">
can_copy: function(user, world) {
if(user.is_owner || user.is_member) return true;
return !world.no_copy;
},
</syntaxhighlight>
|-
|can_protect_tiles
|Checks if user can protect tiles.
|<syntaxhighlight lang="js" line="1" start="41">
can_protect_tiles: function(user, world) {
if(user.is_owner) return true;
return world.feature_membertiles_addremove && user.is_member;
},
</syntaxhighlight>
|-
|can_erase
|Checks if user can use the built-in eraser.
|<syntaxhighlight lang="js" line="1" start="45">
can_erase: function(user, world) {
if(user.is_owner) return true;
return Permissions.user_matches_perm(user, world, world.quick_erase);
},
</syntaxhighlight>
|-
|can_read
|Checks if user can view the world.
|<syntaxhighlight lang="js" line="1" start="49">
can_read: function(user, world) {
return Permissions.user_matches_perm(user, world, world.readability);
},
</syntaxhighlight>
|-
|can_urllink
|Checks if user can create links leading to other URL's.
|<syntaxhighlight lang="js" line="1" start="52">
can_urllink: function(user, world) {
return Permissions.user_matches_perm(user, world, world.feature_url_link);
},
</syntaxhighlight>
|-
|can_write
|Checks if user can write on the world.
|<syntaxhighlight lang="js" line="1" start="55">
can_write: function(user, world) {
if(!Permissions.can_read(user, world)) {
return false;
}
return Permissions.user_matches_perm(user, world, world.writability);
},
</syntaxhighlight>
|-
|can_chat
|Checks if user can chat.
|<syntaxhighlight lang="js" line="1" start="61">
can_chat: function(user, world) {
return Permissions.user_matches_perm(user, world, world.chat_permission);
},
</syntaxhighlight>
|-
|can_show_cursor
|Checks if showing cursors is enabled for a user.
|<syntaxhighlight lang="js" line="1" start="64">
can_show_cursor: function(user, world) {
return Permissions.user_matches_perm(user, world, world.show_cursor);
},
</syntaxhighlight>
|-
|can_color_text
|Checks if user can change their text colour.
|<syntaxhighlight lang="js" line="1" start="67">
can_color_text: function(user, world) {
return Permissions.user_matches_perm(user, world, world.color_text);
},
</syntaxhighlight>
|-
|can_color_cell
|Checks if user can change their cell colour.
|<syntaxhighlight lang="js" line="1" start="70">
can_color_cell: function(user, world) {
return Permissions.user_matches_perm(user, world, world.color_cell);
},
</syntaxhighlight>
|-
|user_matches_perm
|Gets users permissions.
|<syntaxhighlight lang="js" line="1" start="73">
user_matches_perm: function(user, world, perm) {
if(perm == -1) { // no one
return false;
}
if(perm == PERM.PUBLIC) { // anyone
return true;
}
if(user.is_owner) {
return true;
}
if(perm == PERM.ADMIN) {
return false;
}
if(perm == PERM.MEMBERS && user.is_member) {
return true;
}
return false;
}
};
</syntaxhighlight>
|}
[[Category:Articles nominated by Guest-1052]]
[[Category:Documentation]]
Retrieved from "https://wiki.ourworldoftext.com/wiki/Docs"