From 3e647135a610f8a8626b9a5c1917aa359ad20142 Mon Sep 17 00:00:00 2001 From: Tixie Date: Thu, 28 Nov 2019 02:05:31 +0100 Subject: [PATCH] canapayyy --- assets/js/menu.js | 110 ++++++++++++++++++++++++ assets/js/random.js | 0 layouts/_default/baseof.html | 6 ++ layouts/_default/single.html | 82 ++++++++++++++++++ layouts/index.html | 77 +++++++++++++---- layouts/partials/head.html | 2 +- layouts/partials/header.html | 14 +-- layouts/partials/pagination.html | 86 ++++-------------- layouts/partials/social/applemusic.html | 5 ++ layouts/partials/social/bandcamp.html | 5 ++ layouts/partials/social/deezer.html | 3 + layouts/partials/social/googleplay.html | 5 ++ layouts/partials/social/soundcloud.html | 5 ++ layouts/partials/social/spotify.html | 5 ++ layouts/partials/social/youtube.html | 5 ++ 15 files changed, 316 insertions(+), 94 deletions(-) create mode 100644 assets/js/menu.js create mode 100644 assets/js/random.js create mode 100644 layouts/_default/single.html create mode 100644 layouts/partials/social/applemusic.html create mode 100644 layouts/partials/social/bandcamp.html create mode 100644 layouts/partials/social/deezer.html create mode 100644 layouts/partials/social/googleplay.html create mode 100644 layouts/partials/social/soundcloud.html create mode 100644 layouts/partials/social/spotify.html create mode 100644 layouts/partials/social/youtube.html diff --git a/assets/js/menu.js b/assets/js/menu.js new file mode 100644 index 0000000..92ca4e2 --- /dev/null +++ b/assets/js/menu.js @@ -0,0 +1,110 @@ +class MobileMenu { + constructor() { + this.btn = document.querySelector('[data-menu="btn"]') + this.navigation = document.querySelector('[data-menu="navigation"]') + this.overlay = document.querySelector('[data-menu="overlay"]') + + this.activeClass = 'active' + + this.startDistance = 0 + this.movedDistance = 0 + this.distance = 0 + + } + + init () { + this.bindEvents() + } + + bindEvents () { + document.addEventListener('touchstart', (event) => { + this.touchStart(event) + }, false) + document.addEventListener('touchmove', (event) => { + this.touchMove(event) + }, false) + document.addEventListener('touchend', (event) => { + this.touchEnd(event) + }, false) + this.btn.addEventListener('click', (event) => { + this.toggleMenu(event) + }, false) + this.overlay.addEventListener('touchstart', (event) => { + this.touchAction = true + }, false) + this.overlay.addEventListener('touchend', (event) => { + this.toggleMenu(event) + this.touchAction = false + }, false) + this.overlay.addEventListener('click', (event) => { + this.toggleMenu(event) + if (this.touchAction) return + }, false) + } + + toggleMenu (event) { + if (!this.isMenuOpen()) { + this.showMenu() + } else { + this.hideMenu() + } + } + + isMenuOpen () { + return this.navigation.classList.contains(this.activeClass) + } + + hideMenu () { + this.navigation.style.transform = '' + this.navigation.classList.remove(this.activeClass) + this.overlay.classList.remove(this.activeClass) + this.btn.setAttribute('aria-expanded', 'false') + this.navigation.setAttribute('aria-hidden', 'true') + } + + showMenu () { + this.navigation.classList.add(this.activeClass) + this.overlay.classList.add(this.activeClass) + this.btn.setAttribute('aria-expanded', 'true') + this.navigation.setAttribute('aria-hidden', 'false') + } + + transitionEnd () { + if (!this.isMenuOpen()) { + this.hideMenu() + } + } + + touchStart (event) { + if (!this.isMenuOpen()) { + return + } + this.startDistance = event.touches[0].pageX + this.distance = this.startDistance + } + + touchMove (event) { + if (!this.isMenuOpen()) { + return + } + + this.movedDistance = event.touches[0].pageX + + let translate = Math.min(0, this.movedDistance - this.startDistance) + if (translate < 0) { + event.preventDefault() + } + this.navigation.style.transform = 'translateX(' + translate + 'px)' + } + + touchEnd (event) { + let endDistance = Math.min(0, this.movedDistance - this.startDistance) + + this.navigation.style.transform = '' + if (endDistance < 0 && this.movedDistance !== 0) { + this.hideMenu() + } + } +} + +new MobileMenu().init() diff --git a/assets/js/random.js b/assets/js/random.js new file mode 100644 index 0000000..e69de29 diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html index 7011dc5..a6d14a4 100644 --- a/layouts/_default/baseof.html +++ b/layouts/_default/baseof.html @@ -8,5 +8,11 @@ {{ block "main" . }}{{ end }} {{ block "footer" . }}{{ partial "footer" . }}{{end}} + + {{ $mobilemenu := resources.Get "js/menu.js" }} + {{ $randomizer := resources.Get "js/random.js" }} + {{ $js := slice $mobilemenu $randomizer | resources.Concat "js/bundle.js" }} + {{ $secureJS := $js | resources.Fingerprint "sha512" }} + diff --git a/layouts/_default/single.html b/layouts/_default/single.html new file mode 100644 index 0000000..1ece2d1 --- /dev/null +++ b/layouts/_default/single.html @@ -0,0 +1,82 @@ +{{ define "main" }} +
+
+
+
+
+ {{ $original := resources.Get .Params.cover }} + {{ $coverSmall := $original.Resize "x250" }} + {{ $coverMedium := $original.Resize "x500" }} + {{ $coverBig := $original.Resize "x1000" }} + {{ $placeholder := $original.Resize "x1" }} + {{ .Title }} album's cover +
+
+

{{ .Title }}

+ by {{ .Params.artist }} +
    + {{ range .Params.styles }} +
  • {{ . }}
  • + {{ end }} +
+ + +
+
+
+
+{{ end }} diff --git a/layouts/index.html b/layouts/index.html index 73e0692..fe71293 100644 --- a/layouts/index.html +++ b/layouts/index.html @@ -1,33 +1,72 @@ {{ define "main" }} -
-
-
-
-

- Handpicked Albums -

-

by the Glitch Family

+ {{ $paginator := .Paginate (where .Site.RegularPages "Type" "in" .Site.Params.mainSections) }} +
+ {{ if .IsHome | (not $paginator.HasPrev) }} +
+
+
+

+ Handpicked Albums +

+

by the Glitch Family

+
+ {{ else }} +
+
+

+ Albums + Page {{ $paginator.PageNumber }} +

+
+ {{ end }} +
- {{ partial "musics" . }} +
+ {{ range sort $paginator.Pages "Date" "desc" }} + {{ $original := resources.Get .Params.cover }} + {{ $cover := $original.Resize "x320" }} + {{ $cover2x := $original.Resize "x640" }} + {{ $placeholder := $cover.Resize "x1" }} + + {{ end }} +
+ {{ partial "pagination" . }}
-
-
-

About

-

At Glitch Family we love music, I mean we LOVE music! And we also LOVE great album covers. So we decided to make a place where we can showcase albums that are dear to us.

-

- This is Now Playing.
- A Glitch Family’s project. -

-
-
+ {{ if not $paginator.HasPrev }} +
+
+

About

+

At Glitch Family we love music, I mean we LOVE music! And we also LOVE great album covers. So we decided to make a place where we can showcase albums that are dear to us.

+

+ This is Now Playing.
+ A Glitch Family’s project. +

+
+
+ {{ end }}
{{ end }} diff --git a/layouts/partials/head.html b/layouts/partials/head.html index 3a092df..62cbdc5 100644 --- a/layouts/partials/head.html +++ b/layouts/partials/head.html @@ -28,6 +28,6 @@ {{ $sass := resources.Get "/scss/style.scss" }} - {{ $style := $sass | resources.ToCSS }} + {{ $style := $sass | resources.ToCSS | minify | fingerprint }} diff --git a/layouts/partials/header.html b/layouts/partials/header.html index d1ffd79..50e4412 100644 --- a/layouts/partials/header.html +++ b/layouts/partials/header.html @@ -1,4 +1,8 @@ -
+{{ if .IsHome }} +
+{{ else }} +
+{{ end }}
@@ -6,12 +10,12 @@ Great music should be shared
-
diff --git a/layouts/partials/pagination.html b/layouts/partials/pagination.html index 39cf542..e1fe992 100644 --- a/layouts/partials/pagination.html +++ b/layouts/partials/pagination.html @@ -1,75 +1,23 @@ - -
- {{"" | safeHTML }} - {{ $paginator := .Paginator }} - - {{ $adjacent_links := 2 }} - - {{ $max_links := (add (mul $adjacent_links 2) 1) }} - - {{ $lower_limit := (add $adjacent_links 1) }} - - {{ $upper_limit := (sub $paginator.TotalPages $adjacent_links) }} - - {{ if gt $paginator.TotalPages 1 }} - - {{ end }} - {{"" | safeHTML }} +
+
+{{ end}} diff --git a/layouts/partials/social/applemusic.html b/layouts/partials/social/applemusic.html new file mode 100644 index 0000000..93fea76 --- /dev/null +++ b/layouts/partials/social/applemusic.html @@ -0,0 +1,5 @@ + + + + + diff --git a/layouts/partials/social/bandcamp.html b/layouts/partials/social/bandcamp.html new file mode 100644 index 0000000..7f42e5e --- /dev/null +++ b/layouts/partials/social/bandcamp.html @@ -0,0 +1,5 @@ + + + + + diff --git a/layouts/partials/social/deezer.html b/layouts/partials/social/deezer.html new file mode 100644 index 0000000..c12f1e3 --- /dev/null +++ b/layouts/partials/social/deezer.html @@ -0,0 +1,3 @@ + + + diff --git a/layouts/partials/social/googleplay.html b/layouts/partials/social/googleplay.html new file mode 100644 index 0000000..7a8a8eb --- /dev/null +++ b/layouts/partials/social/googleplay.html @@ -0,0 +1,5 @@ + + + + + diff --git a/layouts/partials/social/soundcloud.html b/layouts/partials/social/soundcloud.html new file mode 100644 index 0000000..ce116fe --- /dev/null +++ b/layouts/partials/social/soundcloud.html @@ -0,0 +1,5 @@ + + + + + diff --git a/layouts/partials/social/spotify.html b/layouts/partials/social/spotify.html new file mode 100644 index 0000000..42306f0 --- /dev/null +++ b/layouts/partials/social/spotify.html @@ -0,0 +1,5 @@ + + + + + diff --git a/layouts/partials/social/youtube.html b/layouts/partials/social/youtube.html new file mode 100644 index 0000000..d208776 --- /dev/null +++ b/layouts/partials/social/youtube.html @@ -0,0 +1,5 @@ + + + + +