110 lines
2.6 KiB
Plaintext
110 lines
2.6 KiB
Plaintext
package put
|
|
|
|
import "github.com/tigorlazuardi/redmage/views/utils"
|
|
import "fmt"
|
|
import "strconv"
|
|
|
|
type ResolutionData struct {
|
|
Error string
|
|
Value int
|
|
HXSwapOOB bool
|
|
}
|
|
|
|
templ ResolutionXInput(data ResolutionData) {
|
|
<label
|
|
x-data={ fmt.Sprintf(`{error: %t}`, data.Error != "") }
|
|
id="resolution-x-form"
|
|
class="form-control"
|
|
if data.HXSwapOOB {
|
|
hx-swap-oob="true"
|
|
}
|
|
>
|
|
<div class="label">
|
|
<span
|
|
class={ utils.CXX("label-text", true, "text-error", data.Error != "") }
|
|
:class="{'text-error': error}"
|
|
>Width</span>
|
|
</div>
|
|
<input
|
|
id="resolution-x-field"
|
|
x-data={ fmt.Sprintf(`{ init() { $el.setCustomValidity(%q) } }`, data.Error) }
|
|
name="resolution_x"
|
|
type="number"
|
|
min="1"
|
|
@change="$el.setCustomValidity(''); this.error = false"
|
|
class={ utils.CXX(
|
|
"input input-bordered", true,
|
|
"text-error", data.Error != "",
|
|
"input-error", data.Error != "",
|
|
) }
|
|
:class="{'text-error': error, 'input-error': error}"
|
|
if data.Value > 0 {
|
|
value={ strconv.Itoa(data.Value) }
|
|
}
|
|
placeholder="e.g. 1920"
|
|
required
|
|
/>
|
|
<div class="label">
|
|
<span
|
|
class={ utils.CXX("label-text", true, "text-error", data.Error != "") }
|
|
:class="{'text-error': error}"
|
|
>
|
|
if data.Error != "" {
|
|
{ data.Error }
|
|
} else {
|
|
Your intended device width resolution.
|
|
}
|
|
</span>
|
|
</div>
|
|
</label>
|
|
}
|
|
|
|
templ ResolutionYInput(data ResolutionData) {
|
|
<label
|
|
x-data={ fmt.Sprintf(`{error: %t}`, data.Error != "") }
|
|
id="resolution-y-form"
|
|
class="form-control"
|
|
if data.HXSwapOOB {
|
|
hx-swap-oob="true"
|
|
}
|
|
>
|
|
<div class="label">
|
|
<span
|
|
class={ utils.CXX("label-text", true, "text-error", data.Error != "") }
|
|
:class="{'text-error': error}"
|
|
>Height</span>
|
|
</div>
|
|
<input
|
|
id="resolution-y-field"
|
|
x-data={ fmt.Sprintf(`{ init() { $el.setCustomValidity(%q) } }`, data.Error) }
|
|
name="resolution_y"
|
|
type="number"
|
|
min="1"
|
|
@change="$el.setCustomValidity(''); this.error = false"
|
|
class={ utils.CXX(
|
|
"input input-bordered", true,
|
|
"text-error", data.Error != "",
|
|
"input-error", data.Error != "",
|
|
) }
|
|
:class="{'text-error': error, 'input-error': error}"
|
|
if data.Value > 0 {
|
|
value={ strconv.Itoa(data.Value) }
|
|
}
|
|
placeholder="e.g. 1080"
|
|
required
|
|
/>
|
|
<div class="label">
|
|
<span
|
|
class={ utils.CXX("label-text", true, "text-error", data.Error != "") }
|
|
:class="{'text-error': error}"
|
|
>
|
|
if data.Error != "" {
|
|
{ data.Error }
|
|
} else {
|
|
Your intended device height resolution.
|
|
}
|
|
</span>
|
|
</div>
|
|
</label>
|
|
}
|