diff --git a/src/components/App.jsx b/src/components/App.jsx
index 912102a..14cfdc7 100644
--- a/src/components/App.jsx
+++ b/src/components/App.jsx
@@ -15,7 +15,6 @@ import CoordinatesBox from './CoordinatesBox';
import CanvasSwitchButton from './CanvasSwitchButton';
import OnlineBox from './OnlineBox';
import ChatButton from './ChatButton';
-import ChatBox from './ChatBox';
import Menu from './Menu';
import UI from './UI';
import ExpandMenuButton from './ExpandMenuButton';
@@ -30,7 +29,6 @@ const App = () => (
-
diff --git a/src/components/Chat.jsx b/src/components/Chat.jsx
index 5be1351..bdb37e7 100644
--- a/src/components/Chat.jsx
+++ b/src/components/Chat.jsx
@@ -95,7 +95,6 @@ const Chat = ({
if (!msg) return;
// send message via websocket
ProtocolClient.sendChatMessage(msg, chatChannel);
- setInputMessage('');
dispatch(setChatInputMessage(windowId, ''));
}
diff --git a/src/components/ChatButton.jsx b/src/components/ChatButton.jsx
index f2c0550..459d93d 100644
--- a/src/components/ChatButton.jsx
+++ b/src/components/ChatButton.jsx
@@ -14,7 +14,6 @@ import { showChatModal, openChatWindow } from '../actions';
const ChatButton = ({
- chatOpen,
modalOpen,
chatNotify,
channels,
@@ -23,6 +22,8 @@ const ChatButton = ({
open,
}) => {
const [unreadAny, setUnreadAny] = useState(false);
+ // TODO what do here?
+ const chatOpen = false;
/*
* almost the same as in ChannelDropDown
@@ -88,9 +89,8 @@ function mapDispatchToProps(dispatch) {
function mapStateToProps(state) {
const {
- chatOpen,
modalOpen,
- } = state.modal;
+ } = state.windows;
const {
chatNotify,
} = state.audio;
@@ -102,7 +102,6 @@ function mapStateToProps(state) {
mute,
} = state.chatRead;
return {
- chatOpen,
modalOpen,
chatNotify,
channels,
diff --git a/src/components/ModalRoot.jsx b/src/components/ModalRoot.jsx
index 40f032a..ca977c0 100644
--- a/src/components/ModalRoot.jsx
+++ b/src/components/ModalRoot.jsx
@@ -40,10 +40,8 @@ const MODAL_COMPONENTS = {
const ModalRoot = () => {
const [render, setRender] = useState(false);
- const {
- modalType,
- modalOpen,
- } = useSelector((state) => state.modal);
+ const modalType = useSelector((state) => state.windows.modalType);
+ const modalOpen = useSelector((state) => state.windows.modalOpen);
const {
title,
@@ -66,8 +64,8 @@ const ModalRoot = () => {
}, [modalOpen]);
return (
- (render || modalOpen) && (
-
+ (render || modalOpen)
+ && [
{
onTransitionEnd={onTransitionEnd}
tabIndex={-1}
onClick={close}
- />
+ />,
@@ -88,10 +86,9 @@ const ModalRoot = () => {
title={t`Close`}
tabIndex={-1}
>
-
-
-
- )
+
+ ,
+ ]
);
};
diff --git a/src/components/Window.jsx b/src/components/Window.jsx
index 273a7d3..b171660 100644
--- a/src/components/Window.jsx
+++ b/src/components/Window.jsx
@@ -25,7 +25,6 @@ const Window = ({ id }) => {
const startMove = useCallback((event) => {
event.preventDefault();
- event.stopPropagation();
let {
clientX: startX,
clientY: startY,
@@ -69,9 +68,30 @@ const Window = ({ id }) => {
}}
>
Move Here
+ className="win-topbar"
+ >
+
+ +
+
+
+ Move Here
+
+
+ ↑
+
+
+ X
+
+
);
diff --git a/src/reducers/index.js b/src/reducers/index.js
index 9d50864..cb49e6e 100644
--- a/src/reducers/index.js
+++ b/src/reducers/index.js
@@ -5,7 +5,6 @@ import localForage from 'localforage';
import audio from './audio';
import canvas from './canvas';
import gui from './gui';
-import modal from './modal';
import windows from './windows';
import user from './user';
import ranks from './ranks';
@@ -18,7 +17,6 @@ import fetching from './fetching';
import type { AudioState } from './audio';
import type { CanvasState } from './canvas';
import type { GUIState } from './gui';
-import type { ModalState } from './modal';
import type { UserState } from './user';
import type { RanksState } from './ranks';
import type { AlertState } from './alert';
@@ -30,7 +28,6 @@ export type State = {
audio: AudioState,
canvas: CanvasState,
gui: GUIState,
- modal: ModalState,
user: UserState,
ranks: RanksState,
alert: AlertState,
@@ -48,7 +45,6 @@ const config = {
'ranks',
'canvas',
'alert',
- 'modal',
'chat',
'contextMenu',
'fetching',
@@ -59,7 +55,6 @@ export default persistCombineReducers(config, {
audio,
canvas,
gui,
- modal,
windows,
user,
ranks,
diff --git a/src/reducers/modal.js b/src/reducers/modal.js
deleted file mode 100644
index 5085d7a..0000000
--- a/src/reducers/modal.js
+++ /dev/null
@@ -1,62 +0,0 @@
-/**
- * https://stackoverflow.com/questions/35623656/how-can-i-display-a-modal-dialog-in-redux-that-performs-asynchronous-actions/35641680#35641680
- *
- * @flow
- */
-
-import type { Action } from '../actions/types';
-
-export type ModalState = {
- modalOpen: boolean,
- modalType: ?string,
- chatOpen: boolean,
-};
-
-const initialState: ModalState = {
- modalOpen: false,
- modalType: null,
- chatOpen: false,
-};
-
-
-export default function modal(
- state: ModalState = initialState,
- action: Action,
-): ModalState {
- switch (action.type) {
- case 'SHOW_MODAL': {
- const { modalType } = action;
- const chatOpen = (modalType === 'CHAT') ? false : state.chatOpen;
- return {
- ...state,
- modalType,
- chatOpen,
- modalOpen: true,
- };
- }
-
- case 'SELECT_CANVAS':
- case 'HIDE_MODAL':
- return {
- ...state,
- modalOpen: false,
- };
-
- case 'TOGGLE_CHAT_BOX': {
- return {
- ...state,
- chatOpen: !state.chatOpen,
- };
- }
-
- case 'LOGOUT': {
- return {
- ...state,
- chatOpen: false,
- };
- }
-
- default:
- return state;
- }
-}
diff --git a/src/reducers/windows.js b/src/reducers/windows.js
index 93c8ee4..5ee83ea 100644
--- a/src/reducers/windows.js
+++ b/src/reducers/windows.js
@@ -7,6 +7,10 @@
import type { Action } from '../actions/types';
export type WindowsState = {
+ // modal is considerd as "fullscreen window"
+ // its windowId is considered 0 and args are under args[0]
+ modalOpen: boolean,
+ modalType: ?string,
// [
// {
// windowId: number,
@@ -28,6 +32,8 @@ export type WindowsState = {
}
const initialState: WindowsState = {
+ modalOpen: false,
+ modalType: null,
windows: [],
args: {},
};
diff --git a/src/styles/default.css b/src/styles/default.css
index a383734..c171fa4 100644
--- a/src/styles/default.css
+++ b/src/styles/default.css
@@ -142,8 +142,19 @@ tr:nth-child(even) {
overflow: hidden;
}
-.topbar {
+.win-topbar {
+ display: flex;
+}
+
+.win-title {
cursor: move;
+ flex-grow: 1;
+}
+
+.win-topbtn {
+ border: solid black;
+ border-width: thin;
+ background-color: blue;
}
.contextmenu {