mirror of
https://git.srhtnin.garden/sarah/srhtnin.github.io.git
synced 2026-10-14 02:38:12 +02:00
Added mass-import and mass-export to admin page.
This commit is contained in:
sarah committed
1 parent
b583c09baf
commit
38146ff1db
3 files changed
+3944
No files matched your search
+160
@@ -74,8 +74,161 @@ $PageSection = "Admin";
|
||||
Apply selected mutation fields to several mutations at once.
|
||||
</span>
|
||||
</a>
|
||||
|
||||
<button
|
||||
id="AdminMassImportButton"
|
||||
class="ActionButton AdminEditorLink"
|
||||
type="button"
|
||||
>
|
||||
<strong>Mass import</strong>
|
||||
<span>
|
||||
Review and save several plant or mutation JSON files at once.
|
||||
</span>
|
||||
</button>
|
||||
|
||||
<button
|
||||
id="AdminMassExportButton"
|
||||
class="ActionButton AdminEditorLink"
|
||||
type="button"
|
||||
>
|
||||
<strong>Mass export</strong>
|
||||
<span>
|
||||
Select plants and mutations to export together.
|
||||
</span>
|
||||
</button>
|
||||
|
||||
<input
|
||||
id="AdminMassImportFiles"
|
||||
type="file"
|
||||
accept="application/json,.json"
|
||||
multiple
|
||||
hidden
|
||||
>
|
||||
</div>
|
||||
|
||||
<section
|
||||
id="AdminMassImportPanel"
|
||||
class="Panel AdminTransferPanel"
|
||||
hidden
|
||||
>
|
||||
<div class="PanelHeader AdminTransferPanelHeader">
|
||||
<h2>Mass import</h2>
|
||||
<button
|
||||
id="AdminMassImportCloseButton"
|
||||
class="ActionButton AdminTransferCloseButton"
|
||||
type="button"
|
||||
>
|
||||
Close
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="AdminTransferPanelBody">
|
||||
<p>
|
||||
Review imported content before saving it. Nothing is changed until
|
||||
you press Save imported content.
|
||||
</p>
|
||||
|
||||
<div class="AdminTransferToolbar">
|
||||
<button
|
||||
id="AdminMassImportChooseButton"
|
||||
class="ActionButton AdminInlineButton"
|
||||
type="button"
|
||||
>
|
||||
Choose JSON files
|
||||
</button>
|
||||
|
||||
<span id="AdminMassImportSummary" class="AdminTransferSummary"></span>
|
||||
</div>
|
||||
|
||||
<div
|
||||
id="AdminMassImportList"
|
||||
class="AdminTransferCardList"
|
||||
></div>
|
||||
|
||||
<p
|
||||
id="AdminMassImportMessage"
|
||||
class="PageMessage"
|
||||
aria-live="polite"
|
||||
></p>
|
||||
|
||||
<div class="AdminEditorActions AdminTransferFooter">
|
||||
<button
|
||||
id="AdminMassImportSaveButton"
|
||||
class="ActionButton AdminSaveButton"
|
||||
type="button"
|
||||
disabled
|
||||
>
|
||||
Save imported content
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section
|
||||
id="AdminMassExportPanel"
|
||||
class="Panel AdminTransferPanel"
|
||||
hidden
|
||||
>
|
||||
<div class="PanelHeader AdminTransferPanelHeader">
|
||||
<h2>Mass export</h2>
|
||||
<button
|
||||
id="AdminMassExportCloseButton"
|
||||
class="ActionButton AdminTransferCloseButton"
|
||||
type="button"
|
||||
>
|
||||
Close
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="AdminTransferPanelBody">
|
||||
<p>
|
||||
Select any mix of plants and mutations. Each item stays as its own
|
||||
portable JSON file inside the exported ZIP.
|
||||
</p>
|
||||
|
||||
<div class="CatalogueControls AdminTransferSearchControls">
|
||||
<input
|
||||
id="AdminMassExportSearchInput"
|
||||
type="search"
|
||||
placeholder="Search plants and mutations..."
|
||||
aria-label="Search exportable content"
|
||||
autocomplete="off"
|
||||
>
|
||||
|
||||
<span id="AdminMassExportSummary" class="AdminTransferSummary"></span>
|
||||
</div>
|
||||
|
||||
<div class="AdminTransferSelectionActions">
|
||||
<button id="AdminMassExportSelectAllButton" class="ActionButton AdminInlineButton" type="button">Select all</button>
|
||||
<button id="AdminMassExportSelectPlantsButton" class="ActionButton AdminInlineButton" type="button">Select plants</button>
|
||||
<button id="AdminMassExportSelectMutationsButton" class="ActionButton AdminInlineButton" type="button">Select mutations</button>
|
||||
<button id="AdminMassExportDeselectAllButton" class="ActionButton AdminInlineButton" type="button">Deselect all</button>
|
||||
</div>
|
||||
|
||||
<div
|
||||
id="AdminMassExportList"
|
||||
class="AdminTransferCardList"
|
||||
></div>
|
||||
|
||||
<p
|
||||
id="AdminMassExportMessage"
|
||||
class="PageMessage"
|
||||
aria-live="polite"
|
||||
></p>
|
||||
|
||||
<div class="AdminEditorActions AdminTransferFooter">
|
||||
<button
|
||||
id="AdminMassExportSaveButton"
|
||||
class="ActionButton AdminSaveButton"
|
||||
type="button"
|
||||
disabled
|
||||
>
|
||||
Export selected
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section
|
||||
id="AdminOverview"
|
||||
class="Panel AdminOverview"
|
||||
@@ -115,6 +268,13 @@ $PageSection = "Admin";
|
||||
</main>
|
||||
|
||||
<script src="/Scripts/Garden/PlantImages.js"></script>
|
||||
<script src="/Scripts/Garden/Plants.js"></script>
|
||||
<script src="/Scripts/Garden/Mutations.js"></script>
|
||||
<script src="/Scripts/Garden/FunctionalEffects.js"></script>
|
||||
<script src="/Scripts/Garden/Save.js"></script>
|
||||
<script src="/Scripts/Garden/Economy.js"></script>
|
||||
<script src="/Scripts/Garden/AdminValidation.js"></script>
|
||||
<script src="/Scripts/Garden/AdminOverview.js"></script>
|
||||
<script src="/Scripts/Garden/AdminContentTransfer.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
File diff suppressed because it is too large.
Load diff
@@ -2515,3 +2515,190 @@ input, button, textarea, select {
|
||||
margin-top: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.AdminTransferPanel {
|
||||
margin-top: 1.5rem;
|
||||
overflow: hidden;
|
||||
box-shadow: 3px 3px 0 var(--Crust);
|
||||
}
|
||||
|
||||
.AdminTransferPanel[hidden] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.AdminTransferPanelHeader {
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.AdminTransferPanelHeader h2 {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.AdminTransferCloseButton {
|
||||
width: auto;
|
||||
min-width: 6rem;
|
||||
padding: 0.35rem 0.65rem;
|
||||
}
|
||||
|
||||
.AdminTransferPanelBody {
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
.AdminTransferPanelBody > p:first-child {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.AdminTransferToolbar,
|
||||
.AdminTransferSelectionActions {
|
||||
display: flex;
|
||||
gap: 0.75rem;
|
||||
margin-bottom: 1rem;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.AdminTransferToolbar .AdminInlineButton,
|
||||
.AdminTransferSelectionActions .AdminInlineButton {
|
||||
width: auto;
|
||||
}
|
||||
|
||||
.AdminTransferSummary {
|
||||
color: var(--Subtext1);
|
||||
}
|
||||
|
||||
.AdminTransferSearchControls {
|
||||
grid-template-columns: minmax(0, 1fr) auto;
|
||||
}
|
||||
|
||||
.AdminTransferCardList {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
.AdminTransferCardHeader {
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.AdminTransferCardMeta {
|
||||
display: flex;
|
||||
margin-left: auto;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
gap: 0.65rem;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.AdminTransferStatus {
|
||||
flex: 0 0 auto;
|
||||
padding: 0.2rem 0.45rem;
|
||||
color: var(--Green);
|
||||
background-color: var(--Surface0);
|
||||
border: 2px solid var(--Green);
|
||||
}
|
||||
|
||||
.AdminTransferStatusError {
|
||||
color: var(--Red);
|
||||
border-color: var(--Red);
|
||||
}
|
||||
|
||||
.AdminTransferFileName {
|
||||
min-width: 0;
|
||||
margin: 0;
|
||||
color: var(--Overlay2);
|
||||
overflow-wrap: anywhere;
|
||||
}
|
||||
|
||||
.AdminTransferErrorCard,
|
||||
.AdminTransferCardInvalid {
|
||||
border-color: var(--Red);
|
||||
}
|
||||
|
||||
.AdminTransferErrorHeader {
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.AdminTransferErrorHeader h2 {
|
||||
margin-bottom: 0;
|
||||
color: var(--Red);
|
||||
}
|
||||
|
||||
.AdminTransferErrorBody {
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
.AdminTransferErrorBody p:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.AdminTransferInlineError {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: var(--Red);
|
||||
background-color: var(--Mantle);
|
||||
border-top: 3px solid var(--Red);
|
||||
}
|
||||
|
||||
.AdminTransferSelectableCard {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.AdminTransferSelectableCard[data-selected="true"] {
|
||||
border-color: var(--Sky);
|
||||
}
|
||||
|
||||
.AdminTransferSelectableCard[data-selected="true"] > .PanelHeader {
|
||||
border-bottom-color: var(--Sky);
|
||||
}
|
||||
|
||||
.AdminTransferSelectToggle {
|
||||
display: flex;
|
||||
margin-left: auto;
|
||||
align-items: center;
|
||||
gap: 0.4rem;
|
||||
color: var(--Subtext1);
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.AdminTransferSelectToggle input {
|
||||
width: 1.1rem;
|
||||
height: 1.1rem;
|
||||
margin: 0;
|
||||
accent-color: var(--Sky);
|
||||
}
|
||||
|
||||
.AdminTransferFooter {
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
@media (max-width: 700px) {
|
||||
.AdminTransferPanelHeader,
|
||||
.AdminTransferCardHeader,
|
||||
.AdminTransferCardMeta {
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
.AdminTransferPanelHeader {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.AdminTransferCloseButton {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.AdminTransferCardMeta {
|
||||
width: 100%;
|
||||
margin-left: 0;
|
||||
justify-content: flex-start;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.AdminTransferSearchControls {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
.AdminTransferToolbar .AdminInlineButton,
|
||||
.AdminTransferSelectionActions .AdminInlineButton {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
Reference in new issue
Block a user