added left and right buttons for titles (#175)

* added left and right buttons for titles * redesign left and right titles
icpc · Apr 22, 2024 · eccd70e · eccd70e
1 parent b93d3a2
commit eccd70e
Show file tree

Hide file tree

Showing 2 changed files with 35 additions and 3 deletions.
diff --git a/src/backend-api/src/main/kotlin/org/icpclive/api/Settings.kt b/src/backend-api/src/main/kotlin/org/icpclive/api/Settings.kt
@@ -14,7 +14,11 @@ object UnitSettings : ObjectSettings
 data class AdvertisementSettings(val text: String) : ObjectSettings
 
 @Serializable
-data class TitleSettings(val preset: String, val data: Map<String, String>) : ObjectSettings
+data class TitleSettings(
+    val preset: String,
+    val leftPreset: String? = null,
+    val rightPreset: String? = null,
+    val data: Map<String, String>) : ObjectSettings
 
 @Serializable
 data class PictureSettings(val url: String, val name: String) : ObjectSettings

diff --git a/src/frontend/admin/src/components/Title.jsx b/src/frontend/admin/src/components/Title.jsx
@@ -122,10 +122,38 @@ function TitleTableRow({ data, onShow, onEdit, onDelete }) {
     const [editData, onClickEdit, onSubmitEdit, onChangeField] = usePresetTableRowDataState(data, onEdit);
     const [previewDialogOpen, setPreviewDialogOpen] = useState(false);
 
+    const changePreset = (presetFile) => {
+        return function() {
+            const tempData = Object.assign({}, data);
+            tempData.settings.preset = presetFile;
+            onEdit(tempData);
+        };
+    };
+
     return (<TableRow key={data.id} sx={{ backgroundColor: (data.shown ? activeRowColor : undefined) }}>
         <TableCell component="th" scope="row" align={"left"} key="__show_btn_row__">
-            <ShowPresetButton onClick={onShow} active={data.shown}/>
+            <Box display="flex">
+                <ShowPresetButton className='block' onClick={onShow} active={data.shown}/>
+                <IconButton color="primary" onClick={changePreset(data.settings.leftPreset)}>L</IconButton>
+                <IconButton color="primary" onClick={changePreset(data.settings.rightPreset)}>R</IconButton>
+            </Box>
         </TableCell>
+        <PresetsTableCell
+            value={data.settings.leftPreset}
+            editValue={editData?.settings?.preset}
+            isActive={data.shown}
+            onChange={onChangeField("leftPreset")}
+            onSubmit={onSubmitEdit}
+            valueEditor={TemplateEditor}
+        />
+        <PresetsTableCell
+            value={data.settings.rightPreset}
+            editValue={editData?.settings?.preset}
+            isActive={data.shown}
+            onChange={onChangeField("rightPreset")}
+            onSubmit={onSubmitEdit}
+            valueEditor={TemplateEditor}
+        />
         <PresetsTableCell value={data.settings.preset} editValue={editData?.settings?.preset} isActive={data.shown}
             onChange={onChangeField("preset")} onSubmit={onSubmitEdit}
             valueEditor={TemplateEditor}
@@ -172,7 +200,7 @@ function Title() {
             <PresetsManager
                 service={service}
                 tableKeys={["preset", "data"]}
-                tableKeysHeaders={["Template", "Data"]}
+                tableKeysHeaders={["Left template", "Right template", "Template", "Data"]}
                 defaultRowData={{ "preset": "", "data": {} }}
                 RowComponent={TitleTableRow}
             />