From e2a8e09c14fc05f8ca2acb9189a495c9f4d5d5d6 Mon Sep 17 00:00:00 2001 From: Sean Sube Date: Sun, 5 May 2024 15:50:17 -0500 Subject: [PATCH] add allotment for panes --- client/package.json | 1 + client/src/app.tsx | 28 +++++++++++++++---------- client/src/index.html | 1 + client/src/main.css | 8 +++++++ client/yarn.lock | 49 +++++++++++++++++++++++++++++++++++++++++++ 5 files changed, 76 insertions(+), 11 deletions(-) create mode 100644 client/src/main.css diff --git a/client/package.json b/client/package.json index fe02399..fe57941 100644 --- a/client/package.json +++ b/client/package.json @@ -16,6 +16,7 @@ "@mui/x-tree-view": "^7.3.1", "@types/lodash": "^4.14.192", "@types/node": "^20.11.0", + "allotment": "^1.20.0", "browser-bunyan": "^1.8.0", "i18next": "^22.4.14", "i18next-browser-languagedetector": "^7.0.1", diff --git a/client/src/app.tsx b/client/src/app.tsx index 2ff9f9f..66b7f42 100644 --- a/client/src/app.tsx +++ b/client/src/app.tsx @@ -18,12 +18,16 @@ import { Stack, Alert, Switch, - } from '@mui/material'; +} from '@mui/material'; +import { Allotment } from 'allotment'; import { Room, Actor, Item, World, WorldPanel, SetDetails } from './world.js'; import { EventItem } from './events.js'; import { PlayerPanel } from './player.js'; +import 'allotment/dist/style.css'; +import './main.css'; + const useWebSocket = (useWebSocketModule as any).default; const statusStrings = { @@ -160,16 +164,18 @@ export function App(props: AppProps) { /> - - - - - - - - {interleave(items)} - - + + + + + + + + + {interleave(items)} + + + diff --git a/client/src/index.html b/client/src/index.html index 373a56a..220c08b 100644 --- a/client/src/index.html +++ b/client/src/index.html @@ -2,6 +2,7 @@ Text World +
diff --git a/client/src/main.css b/client/src/main.css new file mode 100644 index 0000000..3fc1507 --- /dev/null +++ b/client/src/main.css @@ -0,0 +1,8 @@ +.body-allotment { + height: 90vb; +} + +.scroll-history { + max-height: 90vh; + overflow-y: auto; +} diff --git a/client/yarn.lock b/client/yarn.lock index 20e8524..2a6b5fc 100644 --- a/client/yarn.lock +++ b/client/yarn.lock @@ -407,6 +407,11 @@ "@jridgewell/resolve-uri" "^3.1.0" "@jridgewell/sourcemap-codec" "^1.4.14" +"@juggle/resize-observer@^3.3.1": + version "3.4.0" + resolved "https://registry.yarnpkg.com/@juggle/resize-observer/-/resize-observer-3.4.0.tgz#08d6c5e20cf7e4cc02fd181c4b0c225cd31dbb60" + integrity sha512-dfLbk+PwWvFzSxwk3n5ySL0hfBog779o8h68wK/7/APo/7cgyWp5jcXockbxdk5kFRkbeXWm4Fbi9FrdN381sA== + "@mochajs/multi-reporter@^1.1.0": version "1.1.0" resolved "https://registry.yarnpkg.com/@mochajs/multi-reporter/-/multi-reporter-1.1.0.tgz#378aafd9b9ecbd612753899a3be35026b79b62a5" @@ -818,6 +823,18 @@ ajv@^6.12.4: json-schema-traverse "^0.4.1" uri-js "^4.2.2" +allotment@^1.20.0: + version "1.20.0" + resolved "https://registry.yarnpkg.com/allotment/-/allotment-1.20.0.tgz#a7926f611d957577c63e8c406c83de0984b28098" + integrity sha512-G02sKgkSCIMpQozuuEkBHblv4aWVGrHQJuOgfCZn3YtHrvmfzS5+mu1N5eWUkpucu/JMl/0FmeCta662RtyaAw== + dependencies: + classnames "^2.3.0" + eventemitter3 "^5.0.0" + lodash.clamp "^4.0.0" + lodash.debounce "^4.0.0" + lodash.isequal "^4.5.0" + use-resize-observer "^9.0.0" + ansi-colors@4.1.1: version "4.1.1" resolved "https://registry.yarnpkg.com/ansi-colors/-/ansi-colors-4.1.1.tgz#cbb9ae256bf750af1eab344f229aa27fe94ba348" @@ -1117,6 +1134,11 @@ chokidar@^3.5.3: optionalDependencies: fsevents "~2.3.2" +classnames@^2.3.0: + version "2.5.1" + resolved "https://registry.yarnpkg.com/classnames/-/classnames-2.5.1.tgz#ba774c614be0f016da105c858e7159eae8e7687b" + integrity sha512-saHYOzhIQs6wy2sVxTM6bUDsQO4F50V9RQ22qBpEdCW+I+/Wmke2HOl6lS6dTpdxVhb88/I6+Hs+438c3lfUow== + cliui@^7.0.2: version "7.0.4" resolved "https://registry.yarnpkg.com/cliui/-/cliui-7.0.4.tgz#a0265ee655476fc807aea9df3df8df7783808b4f" @@ -1698,6 +1720,11 @@ esutils@^2.0.2: resolved "https://registry.yarnpkg.com/esutils/-/esutils-2.0.3.tgz#74d2eb4de0b8da1293711910d50775b9b710ef64" integrity sha512-kVscqXk4OCp68SZ0dkgEKVi6/8ij300KBWTJq32P/dYeWTSwK41WyTxalN1eRmA5Z9UU/LX9D7FWSmV9SAYx6g== +eventemitter3@^5.0.0: + version "5.0.1" + resolved "https://registry.yarnpkg.com/eventemitter3/-/eventemitter3-5.0.1.tgz#53f5ffd0a492ac800721bb42c66b841de96423c4" + integrity sha512-GWkBvjiSZK87ELrYOSESUYeVIc9mvLLf/nXalMOS5dYrgZq9o5OVkbZAVM06CVxYsCwH9BDZFPlQTlPA1j4ahA== + fast-deep-equal@^3.1.1, fast-deep-equal@^3.1.3: version "3.1.3" resolved "https://registry.yarnpkg.com/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz#3a7d56b559d6cbc3eb512325244e619a65c6c525" @@ -2369,11 +2396,26 @@ locate-path@^6.0.0: dependencies: p-locate "^5.0.0" +lodash.clamp@^4.0.0: + version "4.0.3" + resolved "https://registry.yarnpkg.com/lodash.clamp/-/lodash.clamp-4.0.3.tgz#5c24bedeeeef0753560dc2b4cb4671f90a6ddfaa" + integrity sha512-HvzRFWjtcguTW7yd8NJBshuNaCa8aqNFtnswdT7f/cMd/1YKy5Zzoq4W/Oxvnx9l7aeY258uSdDfM793+eLsVg== + +lodash.debounce@^4.0.0: + version "4.0.8" + resolved "https://registry.yarnpkg.com/lodash.debounce/-/lodash.debounce-4.0.8.tgz#82d79bff30a67c4005ffd5e2515300ad9ca4d7af" + integrity sha512-FT1yDzDYEoYWhnSGnpE/4Kj1fLZkDFyqRb7fNt6FdYOSxlUWAtp42Eh6Wb0rGIv/m9Bgo7x4GhQbm5Ys4SG5ow== + lodash.get@^4.4.2: version "4.4.2" resolved "https://registry.yarnpkg.com/lodash.get/-/lodash.get-4.4.2.tgz#2d177f652fa31e939b4438d5341499dfa3825e99" integrity sha512-z+Uw/vLuy6gQe8cfaFWD7p0wVv8fJl3mbzXh33RS+0oW2wvUqiRXiQ69gLWSLpgB5/6sU+r6BlQR0MBILadqTQ== +lodash.isequal@^4.5.0: + version "4.5.0" + resolved "https://registry.yarnpkg.com/lodash.isequal/-/lodash.isequal-4.5.0.tgz#415c4478f2bcc30120c22ce10ed3226f7d3e18e0" + integrity sha512-pDo3lu8Jhfjqls6GkMgpahsF9kCyayhgykjyLMNFTKWrpVdAQtYyB4muAMWozBB4ig/dtWAmsMxLEI8wuz+DYQ== + lodash.merge@^4.6.2: version "4.6.2" resolved "https://registry.yarnpkg.com/lodash.merge/-/lodash.merge-4.6.2.tgz#558aa53b43b661e1925a0afdfa36a9a1085fe57a" @@ -3338,6 +3380,13 @@ uri-js@^4.2.2: dependencies: punycode "^2.1.0" +use-resize-observer@^9.0.0: + version "9.1.0" + resolved "https://registry.yarnpkg.com/use-resize-observer/-/use-resize-observer-9.1.0.tgz#14735235cf3268569c1ea468f8a90c5789fc5c6c" + integrity sha512-R25VqO9Wb3asSD4eqtcxk8sJalvIOYBqS8MNZlpDSQ4l4xMQxC/J7Id9HoTqPq8FwULIn0PVW+OAqF2dyYbjow== + dependencies: + "@juggle/resize-observer" "^3.3.1" + v8-to-istanbul@^9.0.0: version "9.2.0" resolved "https://registry.yarnpkg.com/v8-to-istanbul/-/v8-to-istanbul-9.2.0.tgz#2ed7644a245cddd83d4e087b9b33b3e62dfd10ad"