@articles-media/articles-dev-box 1.3.3 → 1.3.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -11,7 +11,7 @@ var SessionButton = lazy(() => import("./SessionButton.js"));
11
11
  var ReturnToLauncherButton = lazy(() => import("./ReturnToLauncherButton.js"));
12
12
  var GameScoreboard = lazy(() => import("./GameScoreboard.js"));
13
13
  var Ad = lazy(() => import("./Ad.js"));
14
- function PageTemplateLandingPage({ useStore, useSocketStore, RotatingMascot, Link, logoImage, backgroundImage, CardBodyOverride, singlePlayerConfig, multiplayerConfig, brandingTextClass, disableHero, heroOverride, disableAd, disableGameScoreboard, gameScoreboardConfig, maxInnerWidth = "20rem", AdditionalContent = null, PostCardContent = null, PostExtrasContent = null, PreHeroContent = null, PostHeroContent = null, NicknameInputConfig = null, CardOverride = null, LandingBackgroundAnimation = null }) {
14
+ function PageTemplateLandingPage({ useStore, useSocketStore, RotatingMascot, Link, logoImage, backgroundImage, CardBodyOverride, CardBodyAppendContent, CardBodyPrependContent, singlePlayerConfig, multiplayerConfig, brandingTextClass, disableHero, heroOverride, disableAd, disableGameScoreboard, gameScoreboardConfig, maxInnerWidth = "20rem", AdditionalContent = null, PostCardContent = null, PostExtrasContent = null, PreHeroContent = null, PostHeroContent = null, NicknameInputConfig = null, CardOverride = null, LandingBackgroundAnimation = null }) {
15
15
  const { data: userToken, error: userTokenError, isLoading: userTokenLoading, mutate: userTokenMutate } = useUserToken(process.env.NEXT_PUBLIC_GAME_PORT);
16
16
  const { data: userDetails, error: userDetailsError, isLoading: userDetailsLoading, mutate: userDetailsMutate } = useUserDetails({ token: userToken });
17
17
  const darkMode = useStore((state) => state.darkMode);
@@ -71,81 +71,78 @@ function PageTemplateLandingPage({ useStore, useSocketStore, RotatingMascot, Lin
71
71
  }),
72
72
  CardBodyOverride ? CardBodyOverride : /* @__PURE__ */ jsxs("div", {
73
73
  className: "card-body",
74
- children: [singlePlayerConfig && /* @__PURE__ */ jsx(Link, {
75
- href: "/play",
76
- style: { textDecoration: "none" },
77
- children: /* @__PURE__ */ jsxs(ArticlesButton, {
78
- variant: "",
79
- className: "d-flex justify-content-center align-items-center mb-3 w-100",
80
- onClick: () => {},
81
- children: [/* @__PURE__ */ jsx("i", { className: "fad fa-play me-2" }), "Single Player"]
82
- })
83
- }), multiplayerConfig && /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsxs("div", {
84
- className: "fw-bold mb-1 small text-center",
85
- children: [
86
- lobbyDetails?.players.length || 0,
87
- " player",
88
- lobbyDetails?.players.length !== 1 && "s",
89
- " in the lobby."
90
- ]
91
- }), /* @__PURE__ */ jsx("div", {
92
- className: "servers",
93
- children: Array.from({ length: multiplayerConfig?.defaultServers }).map((_, id) => {
94
- const serverNumber = id + 1;
95
- let lobbyLookup = lobbyDetails?.games?.find((lobby) => parseInt(lobby.server_id) == serverNumber);
96
- return /* @__PURE__ */ jsxs("div", {
97
- className: "server",
98
- children: [
99
- /* @__PURE__ */ jsxs("div", {
100
- className: "d-flex justify-content-between align-items-center w-100 mb-2",
101
- children: [/* @__PURE__ */ jsx("div", {
102
- className: "mb-0",
103
- style: { fontSize: "0.9rem" },
104
- children: /* @__PURE__ */ jsxs("b", { children: ["Server ", serverNumber] })
105
- }), /* @__PURE__ */ jsxs("div", {
106
- className: "mb-0",
107
- children: [lobbyLookup?.players?.length || 0, "/4"]
108
- })]
109
- }),
110
- /* @__PURE__ */ jsx("div", {
111
- className: "d-flex justify-content-around w-100 mb-1",
112
- children: [
113
- 1,
114
- 2,
115
- 3,
116
- 4
117
- ].map((player_count) => {
118
- let playerLookup = false;
119
- if (lobbyLookup?.players?.length >= player_count) playerLookup = true;
120
- return /* @__PURE__ */ jsx("div", {
121
- className: "icon",
122
- style: {
123
- width: "20px",
124
- height: "20px",
125
- ...playerLookup ? { backgroundColor: "black" } : { backgroundColor: "gray" },
126
- border: "1px solid black"
127
- }
128
- }, player_count);
74
+ children: [
75
+ CardBodyPrependContent && CardBodyPrependContent,
76
+ singlePlayerConfig && /* @__PURE__ */ jsx(Link, {
77
+ href: "/play",
78
+ style: { textDecoration: "none" },
79
+ children: /* @__PURE__ */ jsxs(ArticlesButton, {
80
+ variant: "",
81
+ className: "d-flex justify-content-center align-items-center mb-3 w-100",
82
+ onClick: () => {},
83
+ children: [/* @__PURE__ */ jsx("i", { className: "fad fa-play me-2" }), "Single Player"]
84
+ })
85
+ }),
86
+ multiplayerConfig && /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(OnlinePlayers, { useStore }), /* @__PURE__ */ jsx("div", {
87
+ className: "servers",
88
+ children: Array.from({ length: multiplayerConfig?.defaultServers }).map((_, id) => {
89
+ const serverNumber = id + 1;
90
+ let lobbyLookup = lobbyDetails?.games?.find((lobby) => parseInt(lobby.server_id) == serverNumber);
91
+ return /* @__PURE__ */ jsxs("div", {
92
+ className: "server",
93
+ children: [
94
+ /* @__PURE__ */ jsxs("div", {
95
+ className: "d-flex justify-content-between align-items-center w-100 mb-2",
96
+ children: [/* @__PURE__ */ jsx("div", {
97
+ className: "mb-0",
98
+ style: { fontSize: "0.9rem" },
99
+ children: /* @__PURE__ */ jsxs("b", { children: ["Server ", serverNumber] })
100
+ }), /* @__PURE__ */ jsxs("div", {
101
+ className: "mb-0",
102
+ children: [lobbyLookup?.players?.length || 0, "/4"]
103
+ })]
104
+ }),
105
+ /* @__PURE__ */ jsx("div", {
106
+ className: "d-flex justify-content-around w-100 mb-1",
107
+ children: [
108
+ 1,
109
+ 2,
110
+ 3,
111
+ 4
112
+ ].map((player_count) => {
113
+ let playerLookup = false;
114
+ if (lobbyLookup?.players?.length >= player_count) playerLookup = true;
115
+ return /* @__PURE__ */ jsx("div", {
116
+ className: "icon",
117
+ style: {
118
+ width: "20px",
119
+ height: "20px",
120
+ ...playerLookup ? { backgroundColor: "black" } : { backgroundColor: "gray" },
121
+ border: "1px solid black"
122
+ }
123
+ }, player_count);
124
+ })
125
+ }),
126
+ /* @__PURE__ */ jsx(Link, {
127
+ className: ``,
128
+ href: {
129
+ pathname: `/play`,
130
+ query: { server: serverNumber }
131
+ },
132
+ style: { ...multiplayerConfig?.comingSoon ? { pointerEvents: "none" } : {} },
133
+ children: /* @__PURE__ */ jsx(ArticlesButton, {
134
+ small: true,
135
+ className: "px-3",
136
+ disabled: multiplayerConfig?.comingSoon,
137
+ children: multiplayerConfig?.comingSoon ? "Coming Soon" : "Join Game"
138
+ })
129
139
  })
130
- }),
131
- /* @__PURE__ */ jsx(Link, {
132
- className: ``,
133
- href: {
134
- pathname: `/play`,
135
- query: { server: serverNumber }
136
- },
137
- style: { ...multiplayerConfig?.comingSoon ? { pointerEvents: "none" } : {} },
138
- children: /* @__PURE__ */ jsx(ArticlesButton, {
139
- small: true,
140
- className: "px-3",
141
- disabled: multiplayerConfig?.comingSoon,
142
- children: multiplayerConfig?.comingSoon ? "Coming Soon" : "Join Game"
143
- })
144
- })
145
- ]
146
- }, id);
147
- })
148
- })] })]
140
+ ]
141
+ }, id);
142
+ })
143
+ })] }),
144
+ CardBodyAppendContent && CardBodyAppendContent
145
+ ]
149
146
  }),
150
147
  /* @__PURE__ */ jsx("div", {
151
148
  className: "card-footer d-flex flex-wrap justify-content-center",
@@ -197,5 +194,17 @@ function PageTemplateLandingPage({ useStore, useSocketStore, RotatingMascot, Lin
197
194
  ]
198
195
  });
199
196
  }
197
+ function OnlinePlayers({ useStore }) {
198
+ const lobbyDetails = useStore((state) => state.lobbyDetails);
199
+ return /* @__PURE__ */ jsxs("div", {
200
+ className: "fw-bold mb-1 small text-center",
201
+ children: [
202
+ lobbyDetails?.online_player_count || lobbyDetails?.players?.length || 0,
203
+ " player",
204
+ (lobbyDetails?.online_player_count || lobbyDetails?.players?.length !== 1) && "s",
205
+ " in the lobby."
206
+ ]
207
+ });
208
+ }
200
209
  //#endregion
201
210
  export { PageTemplateLandingPage as default };
@@ -105,7 +105,7 @@ function ReusedSocketLogicHandler({ pathname, useStore, useGameStore, useSocketS
105
105
  pathname
106
106
  ]);
107
107
  useEffect(() => {
108
- if (connected && !authenticated && userDetails?.user_id) {
108
+ if (connected && !authenticated && userDetails?.user_id && userToken) {
109
109
  debugLog("Socket is now connected and not authenticated with a logged in user!");
110
110
  loginSocket({
111
111
  user_id: userDetails?.user_id,
@@ -116,7 +116,8 @@ function ReusedSocketLogicHandler({ pathname, useStore, useGameStore, useSocketS
116
116
  }, [
117
117
  connected,
118
118
  authenticated,
119
- userDetails?.user_id
119
+ userDetails?.user_id,
120
+ userToken
120
121
  ]);
121
122
  useEffect(() => {
122
123
  if (debugConfig.enabled && debugConfig.autoHide) {
@@ -246,7 +246,7 @@ function OtherTab({ useStore, config }) {
246
246
  var package_default = {
247
247
  name: "@articles-media/articles-dev-box",
248
248
  description: "Shared code, functions, and components for different Articles Media projects.",
249
- version: "1.3.3",
249
+ version: "1.3.4",
250
250
  type: "module",
251
251
  sideEffects: false,
252
252
  imports: { "#root/src/*": "./src/*" },
@@ -1,2 +1,2 @@
1
- import { t as SettingsModal } from "./SettingsModal-Bud-D-3m.js";
1
+ import { t as SettingsModal } from "./SettingsModal-BgIeffY6.js";
2
2
  export { SettingsModal as default };
package/dist/index.js CHANGED
@@ -16,7 +16,7 @@ import { t as GameScoreboard } from "./GameScoreboard-BvE_sIDW.js";
16
16
  import PageTemplateLandingPage from "./PageTemplateLandingPage.js";
17
17
  import GlobalHead from "./GlobalHead.js";
18
18
  import GlobalBody_default from "./GlobalBody.js";
19
- import { t as SettingsModal } from "./SettingsModal-Bud-D-3m.js";
19
+ import { t as SettingsModal } from "./SettingsModal-BgIeffY6.js";
20
20
  import CreditsModal from "./CreditsModal.js";
21
21
  import InfoModal from "./InfoModal.js";
22
22
  import DarkModeHandler from "./DarkModeHandler.js";
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@articles-media/articles-dev-box",
3
3
  "description": "Shared code, functions, and components for different Articles Media projects.",
4
- "version": "1.3.3",
4
+ "version": "1.3.4",
5
5
  "type": "module",
6
6
  "sideEffects": false,
7
7
  "imports": {