From 84aad843b7106cdd5c39c718ef346512065dcd68 Mon Sep 17 00:00:00 2001 From: Matt Mayer Date: Fri, 8 Mar 2019 19:27:45 +0700 Subject: [PATCH 1/4] =?UTF-8?q?i=20think=20=E2=80=9Cview=20map=E2=80=9D=20?= =?UTF-8?q?is=20a=20clearer=20button=20name=20than=20=E2=80=9Cget=20locati?= =?UTF-8?q?on=E2=80=9D?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- _includes/map-venue.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/_includes/map-venue.html b/_includes/map-venue.html index d53ddb8..25b50f9 100644 --- a/_includes/map-venue.html +++ b/_includes/map-venue.html @@ -11,7 +11,7 @@ Bangkok 10400 - Get Location + View Map {% endcapture %} From 3972fc02575808ae12236007e771c04c66295589 Mon Sep 17 00:00:00 2001 From: Olivier Robert Date: Fri, 8 Mar 2019 20:47:33 +0700 Subject: [PATCH 2/4] Disable onResize and onScroll event on mobile screens as they are not required --- _js/components/AppNavigation/index.js | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/_js/components/AppNavigation/index.js b/_js/components/AppNavigation/index.js index e794718..2f9c095 100644 --- a/_js/components/AppNavigation/index.js +++ b/_js/components/AppNavigation/index.js @@ -91,6 +91,10 @@ class AppNavigation { * @param {Event} _event - Scroll event * */ onScroll(_event) { + if (this._isMobileNavigation()) { + return; + } + this._updatePanePosition(); } @@ -100,6 +104,10 @@ class AppNavigation { * @param {Event} _event - Resize event * */ onResize(_event) { + if (this._isMobileNavigation()) { + return; + } + // Scroll back to the top of the page window.scrollTo(0, 0); From ee1754d5a0a4401533cc6ce343d44f06339f8a9b Mon Sep 17 00:00:00 2001 From: Matt Mayer Date: Fri, 8 Mar 2019 21:44:00 +0700 Subject: [PATCH 3/4] Make the venue at the top clickable to jump to the venue section (#46) ## What happened Make venue at top clickable so that it scrolls to the venue section. ## Insight `N/A` ## Proof Of Work ![2562-03-08 21 23 30](https://user-images.githubusercontent.com/696529/54034035-786ae400-41e8-11e9-85a2-ae1761aab62b.gif) --- _includes/header.html | 2 +- _js/application.js | 1 + _js/components/AppNavigation/index.js | 2 +- _js/screens/Home/index.js | 61 +++++++++++++++++++++++++++ _js/screens/index.js | 1 + 5 files changed, 65 insertions(+), 2 deletions(-) create mode 100644 _js/screens/Home/index.js create mode 100644 _js/screens/index.js diff --git a/_includes/header.html b/_includes/header.html index d1486fe..876d128 100755 --- a/_includes/header.html +++ b/_includes/header.html @@ -10,7 +10,7 @@ September 6-7, 2019
- Venue: Pullman Bangkok King Power + Venue: Pullman Bangkok King Power
diff --git a/_js/application.js b/_js/application.js index f103b8a..653a4a6 100755 --- a/_js/application.js +++ b/_js/application.js @@ -1 +1,2 @@ import './initializers/'; +import './screens/'; diff --git a/_js/components/AppNavigation/index.js b/_js/components/AppNavigation/index.js index 2f9c095..1f97ab5 100644 --- a/_js/components/AppNavigation/index.js +++ b/_js/components/AppNavigation/index.js @@ -61,7 +61,7 @@ class AppNavigation { * 1) If the href is a hash url, enables smooth scroll. * 2) Else allows the default browser action. * - * @param {Event} event - scroll event on navLinks + * @param {Event} event - click event on navLinks * */ onClickMenuLink(event) { let closestLink = event.target.closest('a'); diff --git a/_js/screens/Home/index.js b/_js/screens/Home/index.js new file mode 100644 index 0000000..b2ff680 --- /dev/null +++ b/_js/screens/Home/index.js @@ -0,0 +1,61 @@ +const SELECTOR = { + appHeaderEvent: '.app-header__event' +}; + +class HomeScreen { + /** + * Initializer + * + * @param {Element} elementRef - HTML node to mount the component. + * */ + constructor() { + this.appHeaderEvent = document.querySelector(SELECTOR.appHeaderEvent); + + this._bind(); + this._addEventListener(); + } + + // Event listeners + + /** + * Scroll handler of links in the app header. + * + * @param {Event} event - click event on header links + * */ + onClickAppHeaderLink(event) { + let closestLink = event.target.closest('a'); + let targetHref = closestLink.hash; + + event.preventDefault(); + + let scrollToEl = document.querySelector(targetHref); + let verticalScroll = scrollToEl.getBoundingClientRect().y; + + // Scroll to the selected section + window.scrollBy({ + top: verticalScroll, + left: 0, + behavior: 'smooth' + }); + } + + // Private + + /** + * Bind all functions to the local instance scope. + * */ + _bind() { + this.onClickAppHeaderLink = this.onClickAppHeaderLink.bind(this); + } + + /** + * Adds all the required event listeners. + * */ + _addEventListener() { + this.appHeaderEvent.querySelectorAll('a').forEach(appHeaderLink => appHeaderLink.addEventListener('click', this.onClickAppHeaderLink)); + } +} + +if (document.body.classList.contains('home')) { + new HomeScreen(); +} diff --git a/_js/screens/index.js b/_js/screens/index.js new file mode 100644 index 0000000..d7fd80e --- /dev/null +++ b/_js/screens/index.js @@ -0,0 +1 @@ +import './Home/'; From b5acb832c5ba7d2c5372239b0f46ba85f263efe6 Mon Sep 17 00:00:00 2001 From: Olivier Robert Date: Fri, 8 Mar 2019 21:46:03 +0700 Subject: [PATCH 4/4] Remove HTML block parsing as we don't use any Markdown syntax (#52) --- _config.yml | 2 +- _includes/list-sponsor.html | 4 ---- _includes/map-venue.html | 4 ---- index.md | 34 +++++++++++++++++----------------- 4 files changed, 18 insertions(+), 26 deletions(-) diff --git a/_config.yml b/_config.yml index c1fc0f6..52adb12 100755 --- a/_config.yml +++ b/_config.yml @@ -17,7 +17,7 @@ sass: kramdown: # All config options: https://jekyllrb.com/docs/configuration/markdown/ input: GFM - parse_block_html: true + parse_block_html: false auto_ids: false collections: diff --git a/_includes/list-sponsor.html b/_includes/list-sponsor.html index a842b50..b4c31e1 100644 --- a/_includes/list-sponsor.html +++ b/_includes/list-sponsor.html @@ -1,4 +1,3 @@ -{% capture content %}
{% for sponsor_level in site.data.sponsors %}
@@ -15,6 +14,3 @@
{{ sponsor_level.title }}
{% endfor %}
-{% endcapture %} -{% comment %} Workaround to prevent Markdown to interpret the content as a code snippet {% endcomment %} -{{ content | replace: ' ', ''}} diff --git a/_includes/map-venue.html b/_includes/map-venue.html index 25b50f9..924ebb2 100644 --- a/_includes/map-venue.html +++ b/_includes/map-venue.html @@ -1,4 +1,3 @@ -{% capture content %}
{% comment %}load map for each locations{% endcomment %} @@ -14,6 +13,3 @@ View Map
-{% endcapture %} -{% comment %} Workaround to prevent Markdown to interpret the content as a code snippet {% endcomment %} -{{ content | replace: ' ', ''}} diff --git a/index.md b/index.md index 2462d57..a45b124 100755 --- a/index.md +++ b/index.md @@ -5,30 +5,30 @@ permalink: / ---
-
-{% include icon.svg icon="icon-logo" class="home-hero__logo" %} -
-
-

Join us for the first Ruby Conference in Bangkok

-
+
+ {% include icon.svg icon="icon-logo" class="home-hero__logo" %} +
+
+

Join us for the first Ruby Conference in Bangkok

+
-

Speakers

-{% include list-keynote-speaker.html %} - +

Speakers

+ {% include list-keynote-speaker.html %} +
-

Venue

-{% include map-venue.html %} +

Venue

+ {% include map-venue.html %}
-

Sponsors

-

Our event is supported by amazing sponsors and partners.

-{% include list-sponsor.html %} -

If you are interested in supporting our event, reach out to our team: sponsor@rubyconfth.com.
Our sponsors deck will be published soon.

+

Sponsors

+

Our event is supported by amazing sponsors and partners.

+ {% include list-sponsor.html %} +

If you are interested in supporting our event, reach out to our team: sponsor@rubyconfth.com.
Our sponsors deck will be published soon.

\ No newline at end of file