-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Cleaned up print buttons; added global scale button; added bulk impor…
…ter; added playing card mode
- Loading branch information
Showing
16 changed files
with
729 additions
and
26 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,74 @@ | ||
| @page "/card" | ||
|
|
||
| <div class="w3-center no-print"> | ||
| <nav class="w3-small" style="display: inline-block; border-radius: 0 0 8px 8px; margin-left: auto; margin-right: auto;"> | ||
| <button class="w3-button w3-round-large"> | ||
| <img src="assets/printer.svg" style="width: 32px; height: 32px;" onclick="window.print()"> | ||
| <p> | ||
| print <select @bind="size" onclick="false" @onclick:stopPropagation>@foreach(var size in Enum.GetValues<cardSizes>()){ <option>@size</option> }</select> | ||
| </p> | ||
| </button> | ||
| </nav> | ||
| </div> | ||
|
|
||
| <div class="w3-row no-print"> | ||
| @foreach (var card in cards) { | ||
| <div class="w3-col l2 m4 s12 w3-padding"> | ||
| <div class="w3-border w3-round-xlarge"> | ||
| <div class="w3-center" style="height: 240px;"> | ||
| <img src="@card.FrontUrl" class="pixelart"/> | ||
| </div> | ||
| <div class="w3-right-align"> | ||
| <button class="w3-button" @onclick=@(() => editCard(card))>Edit</button> | ||
| <button class="w3-button w3-text-red" @onclick=@(() => deleteCard(card))>Delete</button> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| } | ||
| <div class="w3-col l2 m4 s12 w3-padding"> | ||
| <div class="w3-button w3-round-xlarge w3-display-container" @onclick=createCard style="border: 1px dashed white; width:100%; height: 320.8px"> | ||
| <div class="w3-display-middle w3-center w3-xlarge"> | ||
| New<br> | ||
| + | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </div> | ||
|
|
||
| <div class="w3-row print"> | ||
| @foreach (var card in cards) { | ||
| for (var i = 0; i < card.Replicas; i++) { | ||
| <img src="@card.FrontUrl" class="card fold-right @size"> | ||
| <img src="@card.BackUrl" class="card fold-left @size"> | ||
| } | ||
| } | ||
| <Instructions></Instructions> | ||
| </div> | ||
|
|
||
| <CardEditor @ref=editor OnChange=StateHasChanged></CardEditor> | ||
| <DeleteConfirmation @ref=delete></DeleteConfirmation> | ||
|
|
||
| @code { | ||
| static List<PlayingCard> cards = new List<PlayingCard>(); | ||
|
|
||
| enum cardSizes { | ||
| poker, bridge, tarot, square, game, business | ||
| } | ||
| private static cardSizes size; | ||
|
|
||
| private DeleteConfirmation delete; | ||
| private CardEditor editor; | ||
| private void createCard() { | ||
| var card = new PlayingCard (); | ||
| cards.Add(card); | ||
| editor?.Edit(card); | ||
| } | ||
|
|
||
| private void editCard(PlayingCard card) { | ||
| editor?.Edit(card); | ||
| } | ||
|
|
||
| private void deleteCard(PlayingCard card) { | ||
| this.delete.AskForConfirmation(() => { cards.Remove(card); StateHasChanged(); }); | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,12 @@ | ||
| using System; | ||
| using System.Collections.Generic; | ||
|
|
||
| namespace PaperMiniMaker { | ||
|
|
||
| public class PlayingCard { | ||
| public int Replicas {get; set;} = 1; | ||
| public string FrontUrl {get; set;} | ||
| public string BackUrl {get; set;} | ||
| } | ||
|
|
||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,75 @@ | ||
| @inject IJSRuntime js; | ||
|
|
||
| <div class="w3-modal @showModalCss"> | ||
| <div class="w3-modal-content w3-round-xlarge"> | ||
| <header class="w3-container w3-center w3-xlarge"> | ||
| Bulk Add Minis | ||
| </header> | ||
| <div class="w3-padding bg"> | ||
| <p>Select any number of image files below to create miniatures for.</p> | ||
| <input @ref=files type="file" accept="image/*" class="w3-input" @onchange=readFileStrings multiple> | ||
| </div> | ||
| <footer class="w3-container w3-row w3-padding"> | ||
| <div class="w3-col s6"> | ||
| <button class="w3-button w3-red" @onclick=@(() => Show(false))>Cancel</button> | ||
| </div> | ||
| <div class="w3-col s6" style="text-align: right;"> | ||
| @if (dataUrls != null && dataUrls.dataUrls != null && dataUrls.dataUrls.Length > 0) { | ||
| <button class="w3-button w3-green" @onclick=save>Add @(dataUrls.dataUrls.Length) Minis</button> | ||
| } | ||
| </div> | ||
|
|
||
| </footer> | ||
| </div> | ||
| </div> | ||
|
|
||
| @code { | ||
|
|
||
| private bool isOpen = false; | ||
| private string showModalCss => isOpen ? "w3-show" : "w3-hide"; | ||
|
|
||
| private ElementReference files; | ||
|
|
||
| private BulkResults dataUrls; | ||
|
|
||
| [Parameter] public Action<IEnumerable<Mini>> OnChange {get; set;} | ||
|
|
||
| private class BulkResults { | ||
| public string[] dataUrls {get; set;} | ||
| public string[] names {get; set;} | ||
| } | ||
|
|
||
| private async Task readFileStrings() { | ||
| dataUrls = await js.InvokeAsync<BulkResults>("BlazorHandleFileSelectMultipleDataUrl", files); | ||
| } | ||
|
|
||
| public void Show(bool isOpen) { | ||
| this.isOpen = isOpen; | ||
| StateHasChanged(); | ||
| } | ||
|
|
||
| private void save() { | ||
| if (OnChange == null) | ||
| return; | ||
|
|
||
| if (dataUrls == null || dataUrls.dataUrls == null) { | ||
| OnChange(new Mini[0]); | ||
| Show(false); | ||
| return; | ||
| } | ||
|
|
||
| var minis = new Mini[this.dataUrls.dataUrls.Length]; | ||
| for (var i = 0; i < minis.Length; i++) { | ||
| minis[i] = new Mini { | ||
| Name = i >= 0 && dataUrls.names != null && i < dataUrls.names.Length ? dataUrls.names[i] : "Bulk Mini", | ||
| Size = MiniSize.Medium, | ||
| FrontArt = new MiniArt { | ||
| Url = dataUrls.dataUrls[i] | ||
| }, | ||
| Replicas = 1, | ||
| }; | ||
| } | ||
| OnChange(minis); | ||
| Show(false); | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,55 @@ | ||
| <div class="w3-modal @showModalCss"> | ||
| <div class="w3-modal-content w3-round-xlarge"> | ||
| <header class="w3-container w3-center w3-xlarge"> | ||
| Edit Playing Card | ||
| </header> | ||
| @if (card != null) { | ||
| <div class="w3-container bg"> | ||
| <label>Replicas</label> | ||
| <input type="number" class="w3-input w3-margin-bottom" @bind=@card.Replicas style="background-color:inherit; color:inherit;"> | ||
|
|
||
| <div class="w3-margin-top w3-margin-bottom"> | ||
| <div class="w3-padding" style="background-color: #2D232E;"> | ||
| <label>Front Art Url</label> | ||
| <input class="w3-input" @bind=@card.FrontUrl style="background-color:inherit; color:inherit;"> | ||
| <div class="w3-center w3-padding"> | ||
| OR | ||
| </div> | ||
| <FilePicker Accept="image/*" AsDataUrl=true OnFileLoad=@((url) => { card.FrontUrl = url; StateHasChanged(); })></FilePicker> | ||
|
|
||
| <div class="w3-margin-top"> </div> | ||
|
|
||
| <label>Back Art Url</label> | ||
| <input class="w3-input" @bind=@card.BackUrl style="background-color:inherit; color:inherit;"> | ||
| <div class="w3-center w3-padding"> | ||
| OR | ||
| </div> | ||
| <FilePicker Accept="image/*" AsDataUrl=true OnFileLoad=@((url) => { card.BackUrl = url; StateHasChanged(); })></FilePicker> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| <footer class="w3-container w3-center"> | ||
| <button class="w3-button" @onclick=save>Done</button> | ||
| </footer> | ||
| } | ||
| </div> | ||
| </div> | ||
|
|
||
| @code { | ||
| [Parameter] public Action OnChange {get; set;} | ||
| private PlayingCard card; | ||
|
|
||
| private bool isOpen = false; | ||
| private string showModalCss => isOpen ? "w3-show" : "w3-hide"; | ||
|
|
||
| public void Edit(PlayingCard card) { | ||
| this.card = card; | ||
| this.isOpen = true; | ||
| StateHasChanged(); | ||
| } | ||
|
|
||
| public void save() { | ||
| OnChange?.Invoke(); | ||
| this.isOpen = false; | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.