From 98766e9da41d0f857ad11a2f9f66e86fe9124dec Mon Sep 17 00:00:00 2001
From: HF <hf@pixelplanet.fun>
Date: Sun, 4 Sep 2022 23:11:42 +0200
Subject: [PATCH] add align prop to contextmenu

---
 src/components/contextmenus/index.jsx         | 31 ++++++++++++++++---
 src/components/windows/Chat.jsx               |  2 ++
 src/rep.sh                                    |  4 +++
 src/socket/APISocketServer.js                 |  1 +
 src/store/actions/index.js                    | 20 ++++++------
 src/store/middleware/notifications.js         |  2 +-
 src/store/middleware/rendererHook.js          |  2 +-
 src/store/middleware/socketClientHook.js      |  8 ++---
 src/store/middleware/socketClientHookPopUp.js |  6 ++--
 src/store/middleware/title.js                 |  2 +-
 src/store/reducers/canvas.js                  |  2 +-
 src/store/reducers/chat.js                    | 10 +++---
 src/store/reducers/chatRead.js                |  4 +--
 src/store/reducers/ranks.js                   |  4 +--
 src/store/reducers/user.js                    | 14 ++++-----
 15 files changed, 70 insertions(+), 42 deletions(-)
 create mode 100755 src/rep.sh

diff --git a/src/components/contextmenus/index.jsx b/src/components/contextmenus/index.jsx
index 3fcc3e6..0b080ea 100644
--- a/src/components/contextmenus/index.jsx
+++ b/src/components/contextmenus/index.jsx
@@ -13,7 +13,7 @@ export const types = {
 };
 
 const ContextMenu = ({
-  type, x, y, args, close,
+  type, x, y, args, close, align,
 }) => {
   const wrapperRef = useRef(null);
 
@@ -23,16 +23,37 @@ const ContextMenu = ({
     return null;
   }
 
+  const style = {};
+  switch (align) {
+    case 'tr': {
+      style.right = window.innerWidth - x;
+      style.top = y;
+      break;
+    }
+    case 'br': {
+      style.right = window.innerWidth - x;
+      style.bottom = window.innerHeight - y;
+      break;
+    }
+    case 'bl': {
+      style.left = x;
+      style.bottom = window.innerHeight - y;
+      break;
+    }
+    default: {
+      // also 'tl'
+      style.left = x;
+      style.top = y;
+    }
+  }
+
   const Content = types[type];
 
   return ReactDOM.createPortal((
     <div
       ref={wrapperRef}
       className={`contextmenu ${type}`}
-      style={{
-        left: x,
-        top: y,
-      }}
+      style={style}
     >
       <Content close={close} args={args} />
     </div>
diff --git a/src/components/windows/Chat.jsx b/src/components/windows/Chat.jsx
index b2796e8..2e026bc 100644
--- a/src/components/windows/Chat.jsx
+++ b/src/components/windows/Chat.jsx
@@ -162,6 +162,7 @@ const Chat = () => {
         y={cmArgs.y}
         args={cmArgs.args}
         close={closeCm}
+        align={cmArgs.align}
       />
       <ul
         className="chatarea"
@@ -265,6 +266,7 @@ const Chat = () => {
               x,
               y,
               args: { cid: chatChannel },
+              align: 'tr',
             });
           }}
           role="button"
diff --git a/src/rep.sh b/src/rep.sh
new file mode 100755
index 0000000..8fd6f84
--- /dev/null
+++ b/src/rep.sh
@@ -0,0 +1,4 @@
+#!/bin/bash
+
+grep -rli "${1}" * | xargs -i@ sed -i "s/${1}/s\/${1}/g" @
+
diff --git a/src/socket/APISocketServer.js b/src/socket/APISocketServer.js
index 25fde52..7fc07da 100644
--- a/src/socket/APISocketServer.js
+++ b/src/socket/APISocketServer.js
@@ -79,6 +79,7 @@ class APISocketServer {
       logger.warn(`API ws request from ${ip} not authenticated`);
       socket.write('HTTP/1.1 401 Unauthorized\r\n\r\n');
       socket.destroy();
+      return;
     }
     logger.warn(`API ws request from ${ip} successfully authenticated`);
 
diff --git a/src/store/actions/index.js b/src/store/actions/index.js
index 25fd1cc..974345a 100644
--- a/src/store/actions/index.js
+++ b/src/store/actions/index.js
@@ -263,7 +263,7 @@ export function receiveMe(
   me,
 ) {
   return {
-    type: 'REC_ME',
+    type: 's/REC_ME',
     ...me,
   };
 }
@@ -337,7 +337,7 @@ export function requestPlacePixels(i, j, pixels) {
 export function logoutUser(
 ) {
   return {
-    type: 'LOGOUT',
+    type: 's/LOGOUT',
   };
 }
 
@@ -345,7 +345,7 @@ export function loginUser(
   me,
 ) {
   return {
-    type: 'LOGIN',
+    type: 's/LOGIN',
     ...me,
   };
 }
@@ -354,7 +354,7 @@ export function setName(
   name,
 ) {
   return {
-    type: 'SET_NAME',
+    type: 's/SET_NAME',
     name,
   };
 }
@@ -363,7 +363,7 @@ export function setMailreg(
   mailreg,
 ) {
   return {
-    type: 'SET_MAILREG',
+    type: 's/SET_MAILREG',
     mailreg,
   };
 }
@@ -372,7 +372,7 @@ export function remFromMessages(
   message,
 ) {
   return {
-    type: 'REM_FROM_MESSAGES',
+    type: 's/REM_FROM_MESSAGES',
     message,
   };
 }
@@ -437,7 +437,7 @@ export function addChatChannel(channel) {
 
 export function blockUser(userId, userName) {
   return {
-    type: 'BLOCK_USER',
+    type: 's/BLOCK_USER',
     userId,
     userName,
   };
@@ -445,7 +445,7 @@ export function blockUser(userId, userName) {
 
 export function unblockUser(userId, userName) {
   return {
-    type: 'UNBLOCK_USER',
+    type: 's/UNBLOCK_USER',
     userId,
     userName,
   };
@@ -453,7 +453,7 @@ export function unblockUser(userId, userName) {
 
 export function blockingDm(blockDm) {
   return {
-    type: 'SET_BLOCKING_DM',
+    type: 's/SET_BLOCKING_DM',
     blockDm,
   };
 }
@@ -531,7 +531,7 @@ export function propagateMe(state) {
     dailyTotalPixels,
   } = state.ranks;
   return {
-    type: 'REC_ME',
+    type: 's/REC_ME',
     blockDm,
     blocked,
     canvases,
diff --git a/src/store/middleware/notifications.js b/src/store/middleware/notifications.js
index 3c646db..33d8e3a 100644
--- a/src/store/middleware/notifications.js
+++ b/src/store/middleware/notifications.js
@@ -8,7 +8,7 @@ export default (store) => (next) => (action) => {
   try {
     if (!document.hasFocus()) {
       switch (action.type) {
-        case 'REC_ME': {
+        case 's/REC_ME': {
           if (window.Notification
             && Notification.permission !== 'granted'
             && Notification.permission !== 'denied'
diff --git a/src/store/middleware/rendererHook.js b/src/store/middleware/rendererHook.js
index 42a97f5..4c66d3d 100644
--- a/src/store/middleware/rendererHook.js
+++ b/src/store/middleware/rendererHook.js
@@ -49,7 +49,7 @@ export default (store) => (next) => (action) => {
   switch (type) {
     case 'RELOAD_URL':
     case 's/SELECT_CANVAS':
-    case 'REC_ME': {
+    case 's/REC_ME': {
       const renderer = getRenderer();
       const { is3D } = state.canvas;
 
diff --git a/src/store/middleware/socketClientHook.js b/src/store/middleware/socketClientHook.js
index f4cbb85..2d046c0 100644
--- a/src/store/middleware/socketClientHook.js
+++ b/src/store/middleware/socketClientHook.js
@@ -17,9 +17,9 @@ export default (store) => (next) => (action) => {
       break;
     }
 
-    case 'SET_NAME':
-    case 'LOGIN':
-    case 'LOGOUT': {
+    case 's/SET_NAME':
+    case 's/LOGIN':
+    case 's/LOGOUT': {
       SocketClient.reconnect();
       break;
     }
@@ -51,7 +51,7 @@ export default (store) => (next) => (action) => {
   switch (action.type) {
     case 'RELOAD_URL':
     case 's/SELECT_CANVAS':
-    case 'REC_ME': {
+    case 's/REC_ME': {
       const state = store.getState();
       const { canvasId } = state.canvas;
       SocketClient.setCanvas(canvasId);
diff --git a/src/store/middleware/socketClientHookPopUp.js b/src/store/middleware/socketClientHookPopUp.js
index 53e66d1..69fa260 100644
--- a/src/store/middleware/socketClientHookPopUp.js
+++ b/src/store/middleware/socketClientHookPopUp.js
@@ -12,9 +12,9 @@ export default () => (next) => (action) => {
     }
   } else {
     switch (action.type) {
-      case 'SET_NAME':
-      case 'LOGIN':
-      case 'LOGOUT': {
+      case 's/SET_NAME':
+      case 's/LOGIN':
+      case 's/LOGOUT': {
         SocketClient.reconnect();
         break;
       }
diff --git a/src/store/middleware/title.js b/src/store/middleware/title.js
index 638b4a4..706d4d6 100644
--- a/src/store/middleware/title.js
+++ b/src/store/middleware/title.js
@@ -41,7 +41,7 @@ export default (store) => (next) => (action) => {
 
 
     case 's/SELECT_CANVAS':
-    case 'REC_ME':
+    case 's/REC_ME':
     case 'RELOAD_URL':
     case 'ON_VIEW_FINISH_CHANGE': {
       const state = store.getState();
diff --git a/src/store/reducers/canvas.js b/src/store/reducers/canvas.js
index 47d5ef8..1fa5a8c 100644
--- a/src/store/reducers/canvas.js
+++ b/src/store/reducers/canvas.js
@@ -344,7 +344,7 @@ export default function canvasReducer(
       };
     }
 
-    case 'REC_ME': {
+    case 's/REC_ME': {
       const { canvases } = action;
       let { canvasIdent, scale, view } = state;
 
diff --git a/src/store/reducers/chat.js b/src/store/reducers/chat.js
index 4d570e3..3811605 100644
--- a/src/store/reducers/chat.js
+++ b/src/store/reducers/chat.js
@@ -32,8 +32,8 @@ export default function chat(
   action,
 ) {
   switch (action.type) {
-    case 'REC_ME':
-    case 'LOGIN': {
+    case 's/REC_ME':
+    case 's/LOGIN': {
       // making sure object keys are numbers
       const channels = {};
       const channelsJson = action.channels;
@@ -49,7 +49,7 @@ export default function chat(
       };
     }
 
-    case 'LOGOUT': {
+    case 's/LOGOUT': {
       const channels = { ...state.channels };
       const messages = { ...state.messages };
       const keys = Object.keys(channels);
@@ -68,7 +68,7 @@ export default function chat(
       };
     }
 
-    case 'BLOCK_USER': {
+    case 's/BLOCK_USER': {
       const { userId, userName } = action;
       const blocked = [
         ...state.blocked,
@@ -96,7 +96,7 @@ export default function chat(
       };
     }
 
-    case 'UNBLOCK_USER': {
+    case 's/UNBLOCK_USER': {
       const { userId } = action;
       const blocked = state.blocked.filter((bl) => (bl[0] !== userId));
       return {
diff --git a/src/store/reducers/chatRead.js b/src/store/reducers/chatRead.js
index 1366903..2ee92ea 100644
--- a/src/store/reducers/chatRead.js
+++ b/src/store/reducers/chatRead.js
@@ -23,8 +23,8 @@ export default function chatRead(
   action,
 ) {
   switch (action.type) {
-    case 'REC_ME':
-    case 'LOGIN': {
+    case 's/REC_ME':
+    case 's/LOGIN': {
       const { channels } = action;
       const cids = Object.keys(channels);
       const readTs = {};
diff --git a/src/store/reducers/ranks.js b/src/store/reducers/ranks.js
index 7a9cbbd..e19c4af 100644
--- a/src/store/reducers/ranks.js
+++ b/src/store/reducers/ranks.js
@@ -49,8 +49,8 @@ export default function ranks(
       };
     }
 
-    case 'REC_ME':
-    case 'LOGIN': {
+    case 's/REC_ME':
+    case 's/LOGIN': {
       const {
         totalPixels,
         dailyTotalPixels,
diff --git a/src/store/reducers/user.js b/src/store/reducers/user.js
index bdbddf9..8328c7c 100644
--- a/src/store/reducers/user.js
+++ b/src/store/reducers/user.js
@@ -85,8 +85,8 @@ export default function user(
       };
     }
 
-    case 'REC_ME':
-    case 'LOGIN': {
+    case 's/REC_ME':
+    case 's/LOGIN': {
       const {
         id,
         name,
@@ -106,7 +106,7 @@ export default function user(
       };
     }
 
-    case 'LOGOUT': {
+    case 's/LOGOUT': {
       return {
         ...state,
         id: null,
@@ -118,7 +118,7 @@ export default function user(
       };
     }
 
-    case 'SET_NAME': {
+    case 's/SET_NAME': {
       const { name } = action;
       return {
         ...state,
@@ -126,7 +126,7 @@ export default function user(
       };
     }
 
-    case 'SET_BLOCKING_DM': {
+    case 's/SET_BLOCKING_DM': {
       const { blockDm } = action;
       return {
         ...state,
@@ -148,7 +148,7 @@ export default function user(
       };
     }
 
-    case 'REM_FROM_MESSAGES': {
+    case 's/REM_FROM_MESSAGES': {
       const { message } = action;
       const messages = [...state.messages];
       const index = messages.indexOf(message);
@@ -161,7 +161,7 @@ export default function user(
       };
     }
 
-    case 'SET_MAILREG': {
+    case 's/SET_MAILREG': {
       const { mailreg } = action;
       return {
         ...state,