diff options
Diffstat (limited to 'views/layouts')
| -rw-r--r-- | views/layouts/general-page.html | 122 |
1 files changed, 48 insertions, 74 deletions
diff --git a/views/layouts/general-page.html b/views/layouts/general-page.html index 5cf870f..d787c16 100644 --- a/views/layouts/general-page.html +++ b/views/layouts/general-page.html @@ -311,14 +311,50 @@ switchTheme(savedTheme); </script> - <div - id="general-page-top-embeds" - class="flex" - hx-get="/api/v1/general-page/top-embeds{{ if .QueryString }}?{{ .QueryString }}{{ end }}" - hx-trigger="load" - hx-target="this" - hx-swap="innerHTML" - ></div> + <script src="{{ .StaticStorageBaseUrl }}/libs/htmx/2.0.6/htmx.min.js"></script> + <script src="{{ .StaticStorageBaseUrl }}/libs/leaflet/1.9.4/leaflet.js"></script> + <script src="{{ .StaticStorageBaseUrl }}/libs/imagesloaded/5.0.0/imagesloaded.pkgd.min.js"></script> + <script src="{{ .StaticStorageBaseUrl }}/libs/packery/3.0.0/dist/packery.pkgd.min.js"></script> + + <script> + // Enable fitWidth-like attribute for Packery. Source: https://codepen.io/desandro/pen/kVmLYz + var __resetLayout = Packery.prototype._resetLayout; + Packery.prototype._resetLayout = function () { + __resetLayout.call(this); + var parentSize = getSize(this.element.parentNode); + var colW = this.columnWidth + this.gutter; + this.fitWidth = + Math.floor((parentSize.innerWidth + this.gutter) / colW) * + colW; + this.packer.width = this.fitWidth; + this.packer.height = Number.POSITIVE_INFINITY; + this.packer.reset(); + }; + + Packery.prototype._getContainerSize = function () { + var emptyWidth = 0; + for (var i = 0, len = this.packer.spaces.length; i < len; i++) { + var space = this.packer.spaces[i]; + if ( + space.y === 0 && + space.height === Number.POSITIVE_INFINITY + ) { + emptyWidth += space.width; + } + } + + return { + width: this.fitWidth - this.gutter - emptyWidth, + height: this.maxY - this.gutter, + }; + }; + + Packery.prototype.needsResizeLayout = function () { + return true; + }; + </script> + + <div id="general-page-top-embeds" class="flex">{{ .RenderedTopEmbeds }}</div> <div id="general-page-top-embeds-trigger" hx-get="/api/v1/general-page/top-embeds{{ if .QueryString }}?{{ .QueryString }}{{ end }}" @@ -492,11 +528,7 @@ <header id="general-page-header" class="max-xs:hidden [@media(max-height:32rem)]:hidden flex flex-col ml-8 basis-8" - hx-get="/api/v1/general-page/header{{ if .QueryString }}?{{ .QueryString }}{{ end }}" - hx-trigger="load" - hx-target="this" - hx-swap="innerHTML" - ></header> + >{{ .RenderedHeader }}</header> <div id="general-page-header-trigger" hx-get="/api/v1/general-page/header{{ if .QueryString }}?{{ .QueryString }}{{ end }}" @@ -512,11 +544,7 @@ <main id="general-page-body" class="relative flex-1 overflow-y-auto" - hx-get="/api/v1/general-page/body{{ if .QueryString }}?{{ .QueryString }}{{ end }}" - hx-trigger="load" - hx-target="this" - hx-swap="innerHTML" - ></main> + >{{ .RenderedBody }}</main> <div id="general-page-body-trigger" hx-get="/api/v1/general-page/body{{ if .QueryString }}?{{ .QueryString }}{{ end }}" @@ -528,11 +556,7 @@ <footer id="general-page-footer" class="flex flex-row basis-4 my-1" - hx-get="/api/v1/general-page/footer{{ if .QueryString }}?{{ .QueryString }}{{ end }}" - hx-trigger="load" - hx-target="this" - hx-swap="innerHTML" - ></footer> + >{{ .RenderedFooter }}</footer> <div id="general-page-footer-trigger" hx-get="/api/v1/general-page/footer{{ if .QueryString }}?{{ .QueryString }}{{ end }}" @@ -554,57 +578,7 @@ <div class="grow bg-split-right"></div> - <script src="{{ .StaticStorageBaseUrl }}/libs/htmx/2.0.6/htmx.min.js"></script> - <script src="{{ .StaticStorageBaseUrl }}/libs/leaflet/1.9.4/leaflet.js"></script> - <script src="{{ .StaticStorageBaseUrl }}/libs/imagesloaded/5.0.0/imagesloaded.pkgd.min.js"></script> - <script src="{{ .StaticStorageBaseUrl }}/libs/packery/3.0.0/dist/packery.pkgd.min.js"></script> - - <script> - // Enable fitWidth-like attribute for Packery. Source: https://codepen.io/desandro/pen/kVmLYz - var __resetLayout = Packery.prototype._resetLayout; - Packery.prototype._resetLayout = function () { - __resetLayout.call(this); - var parentSize = getSize(this.element.parentNode); - var colW = this.columnWidth + this.gutter; - this.fitWidth = - Math.floor((parentSize.innerWidth + this.gutter) / colW) * - colW; - this.packer.width = this.fitWidth; - this.packer.height = Number.POSITIVE_INFINITY; - this.packer.reset(); - }; - - Packery.prototype._getContainerSize = function () { - var emptyWidth = 0; - for (var i = 0, len = this.packer.spaces.length; i < len; i++) { - var space = this.packer.spaces[i]; - if ( - space.y === 0 && - space.height === Number.POSITIVE_INFINITY - ) { - emptyWidth += space.width; - } - } - - return { - width: this.fitWidth - this.gutter - emptyWidth, - height: this.maxY - this.gutter, - }; - }; - - Packery.prototype.needsResizeLayout = function () { - return true; - }; - </script> - - <div - id="general-page-bottom-embeds" - class="flex" - hx-get="/api/v1/general-page/bottom-embeds{{ if .QueryString }}?{{ .QueryString }}{{ end }}" - hx-trigger="load" - hx-target="this" - hx-swap="innerHTML" - ></div> + <div id="general-page-bottom-embeds" class="flex">{{ .RenderedBottomEmbeds }}</div> <div id="general-page-bottom-embeds-trigger" hx-get="/api/v1/general-page/bottom-embeds{{ if .QueryString }}?{{ .QueryString }}{{ end }}" |