Skip to content

Commit 154c388

Browse files
YorkohYorkoh
authored
Merge branch 'master' into Admin-Sound-Default-Fix
2 parents a7c1722 + bdab05b commit 154c388

File tree

3 files changed

+137
-152
lines changed

3 files changed

+137
-152
lines changed

‎html/changelogs/AutoChangeLog-pr-947.yml

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
author: "MistChristmas"
2+
delete-after: True
3+
changes:
4+
- rscadd: "Scrolling to the GM Faction Manager"
5+
- bugfix: "Sentry UI scrolling to use Section scrolling, allows the sentry tabs to be squished more in the case of a shit ton of sentries, otherwise cleans up a bunch of stuff in Faction Manager."

‎tgui/packages/tgui/interfaces/HumanFactionManager.tsx

Lines changed: 69 additions & 95 deletions
Original file line numberDiff line numberDiff line change
@@ -23,45 +23,30 @@ const FactionContext = (props, context) => {
2323
const { data, act } = useBackend<BackendContext>();
2424
const [selectedToCreateFaction, setSelectedToCreateFaction] = useState('');
2525
return (
26-
<Stack fill vertical>
27-
<div>
28-
<div
29-
style={{
30-
float: 'left',
31-
display: 'inline-block',
32-
paddingRight: '6px',
33-
}}
34-
>
35-
<Dropdown
36-
selected={selectedToCreateFaction}
37-
options={data.datumless_factions}
38-
onSelected={(value) => setSelectedToCreateFaction(value)}
39-
/>
40-
</div>
41-
<div
42-
style={{
43-
float: 'left',
44-
display: 'inline-block',
45-
paddingRight: '6px',
26+
<Stack vertical>
27+
<Stack.Item>
28+
<Dropdown
29+
selected={selectedToCreateFaction}
30+
options={data.datumless_factions}
31+
onSelected={(value) => setSelectedToCreateFaction(value)}
32+
/>
33+
<Button
34+
onClick={() => {
35+
act('create_faction', {
36+
faction: selectedToCreateFaction,
37+
});
38+
setSelectedToCreateFaction('');
4639
}}
4740
>
48-
<Button
49-
content="Create Faction Datum"
50-
onClick={() => {
51-
act('create_faction', {
52-
faction: selectedToCreateFaction,
53-
});
54-
setSelectedToCreateFaction('');
55-
}}
56-
/>
57-
</div>
58-
</div>
41+
Create Faction Datum
42+
</Button>
43+
</Stack.Item>
5944
<Divider />
60-
<div>
45+
<Stack fill justify="space-around" align="baseline" wrap>
6146
{data.factions.map((faction) => (
6247
<ExistingFaction faction={faction} key={faction.ref} />
6348
))}
64-
</div>
49+
</Stack>
6550
</Stack>
6651
);
6752
};
@@ -71,14 +56,7 @@ const ExistingFaction = (props) => {
7156
const { data, act } = useBackend<BackendContext>();
7257
const faction: Faction = props.faction;
7358
return (
74-
<div
75-
style={{
76-
float: 'left',
77-
display: 'inline-block',
78-
paddingRight: '6px',
79-
paddingBottom: '6px',
80-
}}
81-
>
59+
<Stack.Item width="300px">
8260
<Section title={`${faction.name}`}>
8361
Shoot To Kill: {faction.shoot_to_kill}
8462
<Dropdown
@@ -92,68 +70,64 @@ const ExistingFaction = (props) => {
9270
})
9371
}
9472
/>
95-
Friendly Factions: {faction.friendly_factions}
96-
<>
97-
<Button
98-
content="Add"
99-
onClick={() =>
100-
act('add_friendly_faction', {
101-
faction: faction.name,
102-
})
103-
}
104-
style={{
105-
float: 'left',
106-
}}
107-
/>
108-
<Button
109-
content="Remove"
110-
onClick={() =>
111-
act('remove_friendly_faction', {
112-
faction: faction.name,
113-
})
114-
}
115-
style={{
116-
float: 'left',
117-
}}
118-
/>
119-
</>
120-
<br />
121-
<br />
122-
Neutral Factions: {faction.neutral_factions}
123-
<>
124-
<Button
125-
content="Add"
126-
onClick={() =>
127-
act('add_neutral_faction', {
128-
faction: faction.name,
129-
})
130-
}
131-
style={{
132-
float: 'left',
133-
}}
134-
/>
135-
<Button
136-
content="Remove"
137-
onClick={() =>
138-
act('remove_neutral_faction', {
139-
faction: faction.name,
140-
})
141-
}
142-
style={{
143-
float: 'left',
144-
}}
145-
/>
146-
</>
73+
<Stack vertical>
74+
<Stack.Item>
75+
<Button
76+
inline
77+
onClick={() =>
78+
act('add_friendly_faction', {
79+
faction: faction.name,
80+
})
81+
}
82+
>
83+
Add
84+
</Button>
85+
<Button
86+
inline
87+
onClick={() =>
88+
act('remove_friendly_faction', {
89+
faction: faction.name,
90+
})
91+
}
92+
>
93+
Remove
94+
</Button>
95+
Friendly Factions: {faction.friendly_factions}
96+
</Stack.Item>
97+
<Stack.Item>
98+
<Button
99+
onClick={() =>
100+
act('add_neutral_faction', {
101+
faction: faction.name,
102+
})
103+
}
104+
>
105+
Add
106+
</Button>
107+
<Button
108+
onClick={() =>
109+
act('remove_neutral_faction', {
110+
faction: faction.name,
111+
})
112+
}
113+
>
114+
Remove
115+
</Button>
116+
Neutral Factions: {faction.neutral_factions}
117+
</Stack.Item>
118+
</Stack>
147119
</Section>
148-
</div>
120+
</Stack.Item>
149121
);
150122
};
151123

152124
export const HumanFactionManager = (props) => {
153125
return (
154126
<Window width={1850} height={610} title="Human Faction Manager">
155127
<Window.Content>
156-
<FactionContext />
128+
<Section fill scrollable>
129+
<FactionContext />
130+
</Section>
157131
</Window.Content>
158132
</Window>
159133
);

‎tgui/packages/tgui/interfaces/SentryGunUI.tsx

Lines changed: 63 additions & 57 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@ import {
1010
Icon,
1111
Input,
1212
ProgressBar,
13+
Section,
1314
Stack,
1415
Tabs,
1516
} from '../components';
@@ -397,7 +398,7 @@ const ShowSentryCard = (props: { readonly data: SentrySpec }) => {
397398

398399
const ShowAllSentry = (props: { readonly data: SentrySpec[] }) => {
399400
return (
400-
<Flex align="space-between" wrap>
401+
<Flex align="space-around" wrap>
401402
{props.data.map((x) => (
402403
<Flex.Item key={x.index}>
403404
<ShowSentryCard data={x} />
@@ -472,11 +473,22 @@ const SentryTabMenu = (props: {
472473
}) => {
473474
const { data, act } = useBackend<SentryData>();
474475
return (
475-
<Tabs fill>
476+
<Tabs>
477+
<Tabs.Tab
478+
selected={props.selected === undefined}
479+
onClick={() => {
480+
props.setSelected(undefined);
481+
act('clear-camera');
482+
}}
483+
>
484+
All
485+
</Tabs.Tab>
476486
{props.sentrySpecs.map((x, index) => (
477487
<Tabs.Tab
478488
key={x.index}
479489
selected={props.selected === index}
490+
textAlign="center"
491+
minWidth="2%"
480492
onClick={() => {
481493
props.setSelected(index);
482494
if (data.camera_target) {
@@ -489,15 +501,6 @@ const SentryTabMenu = (props: {
489501
{x.nickname.length === 0 ? x.index : x.nickname}
490502
</Tabs.Tab>
491503
))}
492-
<Tabs.Tab
493-
selected={props.selected === undefined}
494-
onClick={() => {
495-
props.setSelected(undefined);
496-
act('clear-camera');
497-
}}
498-
>
499-
All
500-
</Tabs.Tab>
501504
</Tabs>
502505
);
503506
};
@@ -506,6 +509,7 @@ const PowerLevel = () => {
506509
const { data } = useBackend<SentryData>();
507510
return (
508511
<ProgressBar
512+
width="75px"
509513
minValue={0}
510514
maxValue={data.electrical.max_charge}
511515
value={data.electrical.charge}
@@ -537,55 +541,57 @@ export const SentryGunUI = () => {
537541

538542
return (
539543
<Window theme="crtyellow" height={700} width={700}>
540-
<Window.Content className="SentryGun" scrollable>
541-
<Stack vertical>
542-
{data.sentry.length > 0 && (
544+
<Window.Content className="SentryGun">
545+
<Section fill scrollable>
546+
<Stack vertical>
547+
{data.sentry.length > 0 && (
548+
<Stack.Item>
549+
<Flex justify="space-between" align-items="center">
550+
<Flex.Item width="85%">
551+
<SentryTabMenu
552+
sentrySpecs={sentrySpecs}
553+
selected={selectedSentry}
554+
setSelected={setSelectedSentry}
555+
/>
556+
</Flex.Item>
557+
<Flex.Item align="right">
558+
<PowerLevel />
559+
</Flex.Item>
560+
</Flex>
561+
</Stack.Item>
562+
)}
543563
<Stack.Item>
544-
<Flex justify="space-between" align-items="center">
545-
<Flex.Item>
546-
<SentryTabMenu
547-
sentrySpecs={sentrySpecs}
548-
selected={selectedSentry}
549-
setSelected={setSelectedSentry}
564+
{data.screen_state === 0 && (
565+
<div>
566+
<TimedCallback
567+
time={1.5}
568+
callback={() => act('screen-state', { state: 1 })}
550569
/>
551-
</Flex.Item>
552-
<Flex.Item align="center">
553-
<PowerLevel />
554-
</Flex.Item>
555-
</Flex>
570+
<div className="TopPanelSlide" />
571+
<div className="BottomPanelSlide" />
572+
</div>
573+
)}
574+
{data.camera_target === null && (
575+
<>
576+
{!validSelection && <EmptyDisplay />}
577+
{validSelection && (
578+
<>
579+
{selectedSentry !== undefined && (
580+
<ShowSingleSentry data={sentrySpecs[selectedSentry]} />
581+
)}
582+
{selectedSentry === undefined && (
583+
<ShowAllSentry data={sentrySpecs} />
584+
)}
585+
</>
586+
)}
587+
</>
588+
)}
589+
{data.camera_target !== null && (
590+
<SentryCamera sentry_data={sentrySpecs} />
591+
)}
556592
</Stack.Item>
557-
)}
558-
<Stack.Item>
559-
{data.screen_state === 0 && (
560-
<div>
561-
<TimedCallback
562-
time={1.5}
563-
callback={() => act('screen-state', { state: 1 })}
564-
/>
565-
<div className="TopPanelSlide" />
566-
<div className="BottomPanelSlide" />
567-
</div>
568-
)}
569-
{data.camera_target === null && (
570-
<>
571-
{!validSelection && <EmptyDisplay />}
572-
{validSelection && (
573-
<>
574-
{selectedSentry !== undefined && (
575-
<ShowSingleSentry data={sentrySpecs[selectedSentry]} />
576-
)}
577-
{selectedSentry === undefined && (
578-
<ShowAllSentry data={sentrySpecs} />
579-
)}
580-
</>
581-
)}
582-
</>
583-
)}
584-
{data.camera_target !== null && (
585-
<SentryCamera sentry_data={sentrySpecs} />
586-
)}
587-
</Stack.Item>
588-
</Stack>
593+
</Stack>
594+
</Section>
589595
</Window.Content>
590596
</Window>
591597
);

0 commit comments

Comments
 (0)