Skip to content

Commit

Permalink
minor fixes to terrain shapes
Browse files Browse the repository at this point in the history
  • Loading branch information
@qkmaxware
qkmaxware committed Oct 8, 2021
1 parent 58f07d0 commit 0419fe7
Show file tree
Hide file tree
Showing 4 changed files with 101 additions and 22 deletions.
56 changes: 46 additions & 10 deletions Shared/TerrainDrawer.razor
View file
Original file line number Diff line number Diff line change
@@ -1,19 +1,26 @@
<div class="solid" style="padding: 2px;">
@if (Terrain != null) {
if (Terrain.Kind == TerrainKind.Wall) {
<div class="solid" style="width: @(Terrain.Length)in;">
<div class="cut-top cut-left cut-right" style="width: 100%; height: 0.5in;"></div>
<div class="cut-left cut-right fold-top fold-bottom" style="height: @(Terrain.Height)in;">
<div class="fill print-bg bg-vfill-hrepeat yflip" style="background-image: url('@Terrain.Art.Url');"></div>
<div class="fill yflip">
<img class="fill pixelart" src="@Terrain.Art.Url">
</div>
</div>
<div class="cut-left cut-right fold-top fold-bottom" style="height: @(Terrain.Height)in;">
<div class="fill print-bg bg-vfill-hrepeat" style="background-image: url('@Terrain.Art.Url');"></div>
<div class="fill">
<img class="fill pixelart" src="@Terrain.Art.Url">
</div>
</div>
<div class="cut-bottom cut-left cut-right" style="width: 100%; height: 0.5in;"></div>
</div>
} else if (Terrain.Kind == TerrainKind.Clip) {
<div class="solid" style="width: @(Terrain.Length)in;">
<div class="cut-left cut-right cut-top fold-bottom" style="height: @(Terrain.Height)in;">
<div class="fill print-bg bg-vfill-hrepeat" style="background-image: url('@Terrain.Art.Url');"></div>
<div class="fill">
<img class="fill pixelart" src="@Terrain.Art.Url">
</div>
</div>

<div class="fold-top cut-left cut-right print-bg w3-light-grey w3-center" style="height: @(Terrain.HalfHeight)in;">
Expand All @@ -38,7 +45,9 @@ if (Terrain.Kind == TerrainKind.Wall) {
</div>

<div class="cut-left cut-right fold-top cut-bottom" style="height: @(Terrain.Height)in;">
<div class="fill print-bg bg-vfill-hrepeat yflip" style="background-image: url('@Terrain.Art.Url');"></div>
<div class="fill yflip">
<img class="fill pixelart" src="@Terrain.Art.Url">
</div>
</div>
</div>
} else if (Terrain.Kind == TerrainKind.Floor) {
Expand All @@ -49,24 +58,51 @@ if (Terrain.Kind == TerrainKind.Wall) {
<div class="solid">
<div style="display: flex;">
<div class="solid cut-left cut-top fold-right cut-bottom" style="width: @(Terrain.Height)in; height: @(Terrain.Height)in;"></div>
<div class="solid fold-left fold-right cut-top fold-bottom" style="width: @(Terrain.Length)in; height: @(Terrain.Height)in;"></div>
<div class="solid fold-left fold-right cut-top fold-bottom" style="width: @(Terrain.Length)in; height: @(Terrain.Height)in;">
@if (Terrain.SupportArt != null && !string.IsNullOrEmpty(Terrain.SupportArt.Url)) {
<div class="fill">
<img class="fill pixelart" src="@Terrain.Art.Url">
</div>
}
</div>
<div class="solid cut-right cut-top fold-left cut-bottom" style="width: @(Terrain.Height)in; height: @(Terrain.Height)in;"></div>
</div>
<div style="display: flex;">
<div class="solid cut-left cut-top fold-right cut-bottom" style="width: @(Terrain.Height)in; height: @(Terrain.Length)in;"></div>
<div class="solid fold-left fold-right fold-top fold-bottom fill-image" style="width: @(Terrain.Length)in; height: @(Terrain.Length)in;">
<img src="@(Terrain.Art.Url)" class="pixelart">
<div class="solid cut-left cut-top fold-right cut-bottom" style="width: @(Terrain.Height)in; height: @(Terrain.Length)in;">
@if (Terrain.SupportArt != null && !string.IsNullOrEmpty(Terrain.SupportArt.Url)) {
<div class="fill">
<img class="fill pixelart" src="@Terrain.Art.Url">
</div>
}
</div>
<div class="solid fold-left fold-right fold-top fold-bottom" style="width: @(Terrain.Length)in; height: @(Terrain.Length)in;">
<div class="fill">
<img class="fill pixelart" src="@Terrain.Art.Url">
</div>
</div>
<div class="solid cut-right cut-top fold-left cut-bottom" style="width: @(Terrain.Height)in; height: @(Terrain.Length)in;">
@if (Terrain.SupportArt != null && !string.IsNullOrEmpty(Terrain.SupportArt.Url)) {
<div class="fill">
<img class="fill pixelart" src="@Terrain.Art.Url">
</div>
}
</div>
<div class="solid cut-right cut-top fold-left cut-bottom" style="width: @(Terrain.Height)in; height: @(Terrain.Length)in;"></div>
</div>
<div style="display: flex;">
<div class="solid cut-left cut-top fold-right cut-bottom" style="width: @(Terrain.Height)in; height: @(Terrain.Height)in;"></div>
<div class="solid fold-left fold-right fold-top cut-bottom" style="width: @(Terrain.Length)in; height: @(Terrain.Height)in;"></div>
<div class="solid fold-left fold-right fold-top cut-bottom" style="width: @(Terrain.Length)in; height: @(Terrain.Height)in;">
@if (Terrain.SupportArt != null && !string.IsNullOrEmpty(Terrain.SupportArt.Url)) {
<div class="fill">
<img class="fill pixelart" src="@Terrain.Art.Url">
</div>
}
</div>
<div class="solid cut-right cut-top fold-left cut-bottom" style="width: @(Terrain.Height)in; height: @(Terrain.Height)in;"></div>
</div>
</div>
}
}
</div>

@code {
[Parameter] public Terrain Terrain {get; set;}
Expand Down
53 changes: 42 additions & 11 deletions Shared/TerrainEditor.razor
View file
Original file line number Diff line number Diff line change
Expand Up @@ -22,16 +22,16 @@
</div>
<label>Size (tiles)</label>
<div class="w3-row">
<div class="w3-col s3 w3-right-align" style="padding-top: 10px;">
<div class="w3-col s2 w3-right-align" style="padding-top: 10px;">
<label>Length</label>
</div>
<div class="w3-col s3">
<div class="w3-col s4">
<input type=number class="w3-input w3-margin-bottom" @bind=@mini.Length style="background-color:inherit; color:inherit;">
</div>
<div class="w3-col s3 w3-right-align" style="padding-top: 10px;">
<div class="w3-col s2 w3-right-align" style="padding-top: 10px;">
<label>Height</label>
</div>
<div class="w3-col s3">
<div class="w3-col s4">
<input type=number class="w3-input w3-margin-bottom" @bind=@mini.Height style="background-color:inherit; color:inherit;">
</div>
</div>
Expand All @@ -40,15 +40,31 @@

<div class="w3-margin-top w3-margin-bottom">
<div class="w3-row">
<div class="w3-button tab-active">Art</div>
<div class="w3-button @(!secondArtTab ? "tab-active" : "tab-inactive")" @onclick=@(() => secondArtTab = false)>Primary Art</div>
<div class="w3-button @(secondArtTab ? "tab-active" : "tab-inactive")" @onclick=@(() => secondArtTab = true)>Support Wall Art</div>
</div>
<div class="w3-padding" style="background-color: #2D232E;">
<label>URL</label>
<input class="w3-input" @bind=@mini.Art.Url style="background-color:inherit; color:inherit;">
<div class="w3-center w3-padding">
OR
</div>
<FilePicker Accept="image/*" AsDataUrl=true OnFileLoad=@((url) => { mini.Art.Url = url; StateHasChanged(); })></FilePicker>
@if (!secondArtTab) {
<label>URL</label>
<input class="w3-input" @bind=@mini.Art.Url style="background-color:inherit; color:inherit;">
<div class="w3-center w3-padding">
OR
</div>
<FilePicker Accept="image/*" AsDataUrl=true OnFileLoad=@((url) => { mini.Art.Url = url; StateHasChanged(); })></FilePicker>
} else {
if (mini.Kind.UsesSupportWalls()) {
<label>URL</label>
<input class="w3-input" @bind=@mini.SupportArt.Url style="background-color:inherit; color:inherit;">
<div class="w3-center w3-padding">
OR
</div>
<FilePicker Accept="image/*" AsDataUrl=true OnFileLoad=@((url) => { mini.SupportArt.Url = url; StateHasChanged(); })></FilePicker>
} else {
<p>
This kind of terrain does not have support walls
</p>
}
}
</div>
</div>
</div>
Expand All @@ -66,9 +82,24 @@
private bool isOpen = false;
private string showModalCss => isOpen ? "w3-show" : "w3-hide";

private bool _secondArtTab;
private bool secondArtTab {
get => _secondArtTab;
set {
if (value == false)
_secondArtTab = false;
else if (mini != null) {
if (mini.SupportArt == null)
mini.SupportArt = new TerrainArt();
_secondArtTab = value;
}
}
}

public void Edit(Terrain mini) {
this.mini = mini;
this.isOpen = true;
this.secondArtTab = false;
StateHasChanged();
}

Expand Down
10 changes: 9 additions & 1 deletion TerrainData.cs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,16 +20,24 @@ public static string Description(this TerrainKind size) {
TerrainKind.Wall => "Vertical walls supported by a flat base.",
TerrainKind.Clip => "Decoration which can be slid over walls, good for doors or windows.",
TerrainKind.Floor => "Flat image for laying on the ground, good for carpets or trap doors.",
TerrainKind.Platform => "Slightly raised box, good for applying ellivation to maps.",
TerrainKind.Platform => "Slightly raised box with no bottom, good for applying elevation to maps.",
_ => string.Empty
};
}

public static bool UsesSupportWalls (this TerrainKind size) {
return size switch {
TerrainKind.Platform => true,
_ => false
};
}
}

public class Terrain {
public string Name {get; set;}
public TerrainKind Kind {get; set;}
public TerrainArt Art {get; set;}
public TerrainArt SupportArt {get; set;}
public int Replicas {get; set;}

public float Length {get; set;}
Expand Down
4 changes: 4 additions & 0 deletions wwwroot/css/app.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -53,6 +53,10 @@ footer {
background-size: auto 100%;
background-repeat: repeat-x;
}
.bg-vrepeat-hfill {
background-size: 100% auto;
background-repeat: repeat-y;
}

.fit-image {
display: flex;
Expand Down

0 comments on commit 0419fe7

Please sign in to comment.