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

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.
Files changed (6) hide show
  1. package/dist/GameMenuPrimaryButtonGroup.js +10 -1
  2. package/dist/PageTemplateLandingPage.js +107 -69
  3. package/dist/{SettingsModal-BgIeffY6.js → SettingsModal-BTGNqh2d.js} +1 -1
  4. package/dist/SettingsModal.js +1 -1
  5. package/dist/index.js +1 -1
  6. package/package.json +1 -1
package/dist/GameMenuPrimaryButtonGroup.js CHANGED
@@ -9,9 +9,10 @@ import { Fragment, jsx, jsxs } from "react/jsx-runtime";
9
9
  * @param {string} [props.owner] Optional GitHub owner
10
10
  * @param {string} [props.repo] Optional GitHub repo
11
11
  */
12
- function PrimaryButtonGroup({ useStore, type, owner, repo, LeaveGameOverride, SidebarOverride, SettingsOverride, InfoOverride, CreditsOverride, GithubOverride, FullscreenOverride }) {
12
+ function PrimaryButtonGroup({ useStore, type, owner, repo, LeaveGameOverride, SidebarOverride, SettingsOverride, InfoOverride, CreditsOverride, GithubOverride, FullscreenOverride, useRouter = null }) {
13
13
  if (!useStore) return null;
14
14
  const { isFullscreen, requestFullscreen, exitFullscreen } = useFullscreen();
15
+ const router = useRouter ? useRouter() : null;
15
16
  const setShowSettingsModal = useStore((state) => state.setShowSettingsModal);
16
17
  const toggleDarkMode = useStore((state) => state.toggleDarkMode);
17
18
  const darkMode = useStore((state) => state.darkMode);
@@ -19,6 +20,7 @@ function PrimaryButtonGroup({ useStore, type, owner, repo, LeaveGameOverride, Si
19
20
  const setShowCreditsModal = useStore((state) => state.setShowCreditsModal);
20
21
  const sidebar = useStore((state) => state.sidebar);
21
22
  const setSidebar = useStore((state) => state.setSidebar);
23
+ if (!router && type === "GameMenu") console.warn("GameMenuPrimaryButtonGroup: useRouter is needed for GameMenu type to avoid full reload navigation. Please provide a router instance from your framework (e.g. Next.js useRouter) as a prop.");
22
24
  switch (type) {
23
25
  case "Landing": return /* @__PURE__ */ jsxs(Fragment, { children: [
24
26
  SettingsOverride ? SettingsOverride : /* @__PURE__ */ jsxs("div", {
@@ -72,6 +74,13 @@ function PrimaryButtonGroup({ useStore, type, owner, repo, LeaveGameOverride, Si
72
74
  LeaveGameOverride ? LeaveGameOverride : /* @__PURE__ */ jsx("a", {
73
75
  href: "/",
74
76
  className: "w-50",
77
+ onClick: (e) => {
78
+ if (router) {
79
+ e.preventDefault();
80
+ router.push("/");
81
+ return;
82
+ }
83
+ },
75
84
  children: /* @__PURE__ */ jsxs(ArticlesButton, {
76
85
  className: "w-100",
77
86
  small: true,
package/dist/PageTemplateLandingPage.js CHANGED
@@ -11,11 +11,11 @@ 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, 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 }) {
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, useRouter = 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);
18
- const lobbyDetails = useStore((state) => state.lobbyDetails);
18
+ useStore((state) => state.lobbyDetails);
19
19
  const landingAnimation = useStore((state) => state.landingAnimation);
20
20
  return /* @__PURE__ */ jsxs("div", {
21
21
  className: "landing-page dev-box-template-landing-page",
@@ -83,63 +83,13 @@ function PageTemplateLandingPage({ useStore, useSocketStore, RotatingMascot, Lin
83
83
  children: [/* @__PURE__ */ jsx("i", { className: "fad fa-play me-2" }), "Single Player"]
84
84
  })
85
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
- })
139
- })
140
- ]
141
- }, id);
142
- })
86
+ multiplayerConfig && /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(OnlinePlayers, {
87
+ useStore,
88
+ multiplayerConfig
89
+ }), /* @__PURE__ */ jsx(Servers, {
90
+ useStore,
91
+ multiplayerConfig,
92
+ Link
143
93
  })] }),
144
94
  CardBodyAppendContent && CardBodyAppendContent
145
95
  ]
@@ -148,7 +98,8 @@ function PageTemplateLandingPage({ useStore, useSocketStore, RotatingMascot, Lin
148
98
  className: "card-footer d-flex flex-wrap justify-content-center",
149
99
  children: /* @__PURE__ */ jsx(PrimaryButtonGroup, {
150
100
  useStore,
151
- type: "Landing"
101
+ type: "Landing",
102
+ useRouter
152
103
  })
153
104
  })
154
105
  ]
@@ -194,17 +145,104 @@ function PageTemplateLandingPage({ useStore, useSocketStore, RotatingMascot, Lin
194
145
  ]
195
146
  });
196
147
  }
197
- function OnlinePlayers({ useStore }) {
148
+ function Servers({ useStore, multiplayerConfig, Link }) {
198
149
  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
- ]
150
+ useStore((state) => state.lobbyDetails.online_player_count);
151
+ useStore((state) => state.lobbyDetails.landing_player_count);
152
+ return /* @__PURE__ */ jsx("div", {
153
+ className: "servers",
154
+ children: Array.from({ length: multiplayerConfig?.defaultServers }).map((_, id) => {
155
+ const serverNumber = id + 1;
156
+ let lobbyLookup = lobbyDetails?.games?.find((lobby) => parseInt(lobby.server_id) == serverNumber);
157
+ return /* @__PURE__ */ jsxs("div", {
158
+ className: "server",
159
+ children: [
160
+ /* @__PURE__ */ jsxs("div", {
161
+ className: "d-flex justify-content-between align-items-center w-100 mb-2",
162
+ children: [/* @__PURE__ */ jsx("div", {
163
+ className: "mb-0",
164
+ style: { fontSize: "0.9rem" },
165
+ children: /* @__PURE__ */ jsxs("b", { children: ["Server ", serverNumber] })
166
+ }), /* @__PURE__ */ jsxs("div", {
167
+ className: "mb-0",
168
+ children: [lobbyLookup?.players?.length || 0, "/4"]
169
+ })]
170
+ }),
171
+ /* @__PURE__ */ jsx("div", {
172
+ className: "d-flex justify-content-around w-100 mb-1",
173
+ children: [
174
+ 1,
175
+ 2,
176
+ 3,
177
+ 4
178
+ ].map((player_count) => {
179
+ let playerLookup = false;
180
+ if (lobbyLookup?.players?.length >= player_count) playerLookup = true;
181
+ return /* @__PURE__ */ jsx("div", {
182
+ className: "icon",
183
+ style: {
184
+ width: "20px",
185
+ height: "20px",
186
+ ...playerLookup ? { backgroundColor: "black" } : { backgroundColor: "gray" },
187
+ border: "1px solid black"
188
+ }
189
+ }, player_count);
190
+ })
191
+ }),
192
+ /* @__PURE__ */ jsx(Link, {
193
+ className: ``,
194
+ href: {
195
+ pathname: `/play`,
196
+ query: { server: serverNumber }
197
+ },
198
+ style: { ...multiplayerConfig?.comingSoon ? { pointerEvents: "none" } : {} },
199
+ children: /* @__PURE__ */ jsx(ArticlesButton, {
200
+ small: true,
201
+ className: "px-3",
202
+ disabled: multiplayerConfig?.comingSoon,
203
+ children: multiplayerConfig?.comingSoon ? "Coming Soon" : "Join Game"
204
+ })
205
+ })
206
+ ]
207
+ }, id);
208
+ })
207
209
  });
208
210
  }
211
+ function OnlinePlayers({ useStore, multiplayerConfig }) {
212
+ const lobbyDetails = useStore((state) => state.lobbyDetails);
213
+ const landing_player_count = useStore((state) => state.lobbyDetails.landing_player_count);
214
+ const online_player_count = useStore((state) => state.lobbyDetails.online_player_count);
215
+ switch (multiplayerConfig.onlinePlayersTemplate) {
216
+ case "2.0": return /* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsxs("div", {
217
+ className: "fw-bold mb-0 small text-center",
218
+ children: [
219
+ online_player_count || 0,
220
+ " player",
221
+ online_player_count !== 1 && "s",
222
+ " ",
223
+ online_player_count === 1 ? "is" : "are",
224
+ " online."
225
+ ]
226
+ }), /* @__PURE__ */ jsxs("div", {
227
+ className: "d-flex justify-content-center mb-3",
228
+ children: [/* @__PURE__ */ jsxs("div", {
229
+ className: "badge bg-black text-white me-1",
230
+ children: [landing_player_count || 0, " in lobby"]
231
+ }), /* @__PURE__ */ jsxs("div", {
232
+ className: "badge bg-black text-white",
233
+ children: [online_player_count - landing_player_count || 0, " in game"]
234
+ })]
235
+ })] });
236
+ default: return /* @__PURE__ */ jsxs("div", {
237
+ className: "fw-bold mb-1 small text-center",
238
+ children: [
239
+ lobbyDetails?.online_player_count || lobbyDetails?.players?.length || 0,
240
+ " player",
241
+ (lobbyDetails?.online_player_count || lobbyDetails?.players?.length !== 1) && "s",
242
+ " in the lobby."
243
+ ]
244
+ });
245
+ }
246
+ }
209
247
  //#endregion
210
248
  export { PageTemplateLandingPage as default };
package/dist/{SettingsModal-BgIeffY6.js → SettingsModal-BTGNqh2d.js} RENAMED
@@ -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.4",
249
+ version: "1.3.7",
250
250
  type: "module",
251
251
  sideEffects: false,
252
252
  imports: { "#root/src/*": "./src/*" },
package/dist/SettingsModal.js CHANGED
@@ -1,2 +1,2 @@
1
- import { t as SettingsModal } from "./SettingsModal-BgIeffY6.js";
1
+ import { t as SettingsModal } from "./SettingsModal-BTGNqh2d.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-BgIeffY6.js";
19
+ import { t as SettingsModal } from "./SettingsModal-BTGNqh2d.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.4",
4
+ "version": "1.3.7",
5
5
  "type": "module",
6
6
  "sideEffects": false,
7
7
  "imports": {