splitting all js into individual files to comparmentalize and getting rid of onload event (in favour of defer)

This commit is contained in:
Simon Martens
2022-11-15 21:27:27 +01:00
parent e5052dd4ea
commit 5e90e917f1
30 changed files with 771 additions and 809 deletions

View File

@@ -7,10 +7,8 @@
if (Model.MinWidthTrad)
minwidthtrads = "ha-minwidth";
}
@* No JavaScript Settings *@
<noscript>
@* TODO *@
</noscript>
<script defer src="/js/briefe.js" asp-append-version="true"></script>
<div class="ha-letterheader">
@await Html.PartialAsync("/Views/Shared/_LetterHead.cshtml", (Model.MetaData, false, false))
@@ -154,12 +152,4 @@
</div>
}
</div>
</div>
@* <script src="~/js/mark.min.js" asp-append-version="true"></script>
<script>
var instance = new Mark(document.querySelectorAll(".ha-letterbody"));
instance.mark('l', { "element": "span", "className": "ha-found", "acrossElements": true, "separateWordSearch": false, "exclude": [".ha-searchresultcommentpill", ".ha-letlink", ".ha-letlinks", ".ha-hkb"]});
</script> *@
</div>

View File

@@ -5,6 +5,8 @@
ViewData["showCredits"] = "true";
}
<script defer src="/js/index.js" asp-append-version="true"></script>
<div class="ha-index">
@if (Model.Letters != null) {
@@ -49,41 +51,14 @@
@* Go To Letter *@
<div class="ha-gotofilter">
<div class="ha-filtertitle">H&hairsp;K&hairsp;B</div>
<form class="ha-gotoform" id="ha-gotoform">
<form class="ha-gotoform" id="ha-gotoform" asp-controller="Briefe" asp-action="Index" method="get">
<div class="ha-gototext">
Briefnummer
</div>
<input type="text" id="ha-gotoletternumber" class="ha-gotoletternumber" />
<input name="id" type="text" id="ha-gotoletternumber" class="ha-gotoletternumber" />
<button type="submit" id="ha-gotoformsubmit">Nachschlagen</button>
</form>
</div>
<script>
const ACTIVATEGOTOFILTER = function(filter, button) {
let f = filter.value;
if (f === "") {
button.disabled = true;
return;
}
button.disabled = false;
}
const SUBMITGOTO = function(filter) {
let f = filter.value;
window.location.href = "/HKB/" + f;
}
window.addEventListener("load", () => {
let gotofilter = document.getElementById("ha-gotoletternumber");
let gotosubmitbtn = document.getElementById("ha-gotoformsubmit");
let gotoform = document.getElementById("ha-gotoform");
ACTIVATEGOTOFILTER(gotofilter, gotosubmitbtn);
gotofilter.addEventListener("input", () => ACTIVATEGOTOFILTER(gotofilter, gotosubmitbtn));
gotoform.addEventListener("submit", (ev) => {
ev.preventDefault();
SUBMITGOTO(gotofilter);
});
});
</script>
@* ZH Loopkup *@
@if (Model.AvailablePages != null) {
@@ -99,47 +74,17 @@
</div>
<form class="ha-zhform" id="ha-zhform">
<span>Z&hairsp;H Band</span>
<select id="ha-zhformvolume">
<select name="zhvolume" id="ha-zhformvolume">
@foreach (var volume in Model.AvailablePages) {
<option>@volume.Volume</option>
}
</select>
<span>/ </span>
<input id="ha-zhformpage" type="text" value="@Model.ActivePage" placeholder="Seite"/>
<input name="zhpage" id="ha-zhformpage" type="text" value="@Model.ActivePage" placeholder="Seite"/>
<button id="ha-zhformsubmit" type="submit">Nachschlagen</button>
</form>
</div>
<script>
const ACTIVATEZHSEARCH = function(volume, page, button) {
let vol = volume.options[volume.selectedIndex].value;
let pg = page.value;
if (pg === "") {
button.disabled = true;
return;
}
button.disabled = false;
}
const SUBMITZHSEARCH = function(volume, page) {
let vol = volume.options[volume.selectedIndex].value;
let pg = page.value;
window.location.href = "/HKB/" + vol + "/" + pg;
}
window.addEventListener("load", () => {
let vol = document.getElementById("ha-zhformvolume");
let pg = document.getElementById("ha-zhformpage");
let zhsubmitbtn = document.getElementById("ha-zhformsubmit");
let zhsearchform = document.getElementById("ha-zhform");
ACTIVATEZHSEARCH(vol, pg, zhsubmitbtn);
vol.addEventListener("change", () => ACTIVATEZHSEARCH(vol, pg, zhsubmitbtn));
pg.addEventListener("input", () => ACTIVATEZHSEARCH(vol, pg, zhsubmitbtn));
zhsearchform.addEventListener("submit", (ev) => {
ev.preventDefault();
SUBMITZHSEARCH(vol, pg);
});
});
</script>
}
@* Full-Text-Search *@
@@ -153,24 +98,6 @@
<button id="ha-searchformsubmit" type="submit">Suchen</button>
</form>
</div>
<script>
const ACTIVATESEARCHFILTER = function(filter, button) {
let f = filter.value;
if (f === "") {
button.disabled = true;
return;
}
button.disabled = false;
}
window.addEventListener("load", () => {
let searchfilter = document.getElementById("ha-searchformtext");
let searchsubmitbtn = document.getElementById("ha-searchformsubmit");
let searchform = document.getElementById("ha-searchform");
ACTIVATESEARCHFILTER(searchfilter, searchsubmitbtn);
searchfilter.addEventListener("input", () => ACTIVATESEARCHFILTER(searchfilter, searchsubmitbtn));
});
</script>
@* Person Filter *@
@if(Model.AvailablePersons != null) {

View File

@@ -24,6 +24,8 @@
: "ha-bibel";
}
<script defer src="/js/register.js"></script>
<div class="ha-register">
<div class="@commentClass">
<div class="ha-register-head">
@@ -51,25 +53,6 @@
</form>
}
<script>
const ACTIVATESEARCHFILTER = function(filter, button) {
let f = filter.value;
if (f === "") {
button.disabled = true;
return;
}
button.disabled = false;
}
window.addEventListener("load", () => {
let searchfilter = document.getElementById("ha-searchformtext");
let searchsubmitbtn = document.getElementById("ha-searchformsubmit");
let searchform = document.getElementById("ha-searchform");
ACTIVATESEARCHFILTER(searchfilter, searchsubmitbtn);
searchfilter.addEventListener("input", () => ACTIVATESEARCHFILTER(searchfilter, searchsubmitbtn));
});
</script>
@* <form asp-controller="Suche" asp-action="Index" method="GET" >
<input type="text" name="search" placeholder="Suchbegriff" />
<button type="submit">Suchen</button>

View File

@@ -5,6 +5,7 @@
ViewData["showCredits"] = "false";
ViewData["Mark"] = Model.ActiveSearch;
}
<script defer src="/js/search.js"></script>
<div class="ha-search">
<div class="ha-searchhead">
@@ -61,24 +62,6 @@
}
</div>
</div>
<script>
const ACTIVATESEARCHFILTER = function(filter, button) {
let f = filter.value;
if (f === "") {
button.disabled = true;
return;
}
button.disabled = false;
}
window.addEventListener("load", () => {
let searchfilter = document.getElementById("ha-searchformtext");
let searchsubmitbtn = document.getElementById("ha-searchformsubmit");
let searchform = document.getElementById("ha-searchform");
ACTIVATESEARCHFILTER(searchfilter, searchsubmitbtn);
searchfilter.addEventListener("input", () => ACTIVATESEARCHFILTER(searchfilter, searchsubmitbtn));
});
</script>
<div class="ha-searchnav">
@if (Model.AvailablePages != null && Model.AvailablePages.Any() && Model.AvailablePages.Count > 1) {
@@ -112,7 +95,7 @@
<div class="ha-letterlistsearchresult">
<div class="ha-searchresultlocation">
<a asp-controller="Briefe" asp-action="Index" asp-route-id="@letter.Meta.Autopsic" asp-route-search="@Model.ActiveSearch" asp-fragment="@sr.Page-@sr.Line">
HKB @sr.Page/@sr.Line
HKB @letter.Meta.Autopsic @sr.Page/@sr.Line
</a>
</div>
<div class="ha-searchresultpreview">