From: Stephen Cameron Date: Thu, 17 Oct 2019 17:16:42 +0000 (+0200) Subject: WIP #3053 X-Git-Url: http://git.cubedesigners.com/?a=commitdiff_plain;h=831ff6ea88ebac298cc8d156e394aa80643ef034;p=ccv-wordpress.git WIP #3053 --- diff --git a/wp-content/themes/CCV/app/Composers/Header.php b/wp-content/themes/CCV/app/Composers/Header.php index fb03728..73c999c 100644 --- a/wp-content/themes/CCV/app/Composers/Header.php +++ b/wp-content/themes/CCV/app/Composers/Header.php @@ -12,6 +12,14 @@ class Header extends Composer public function with() { + // Fetch languages from Polylang + $languages = []; + + if (function_exists('pll_the_languages')) { + $languages = pll_the_languages(['raw' => true]); + } + + // To allow for better management of the URLs and titles when translating, // header buttons are stored in a separate menu location. Due to the design, // there should only be a maximum of 2 links so these are extracted here. @@ -19,6 +27,6 @@ class Header extends Composer $button_1 = $cta_nav[0] ?? false; $button_2 = $cta_nav[1] ?? false; - return compact('button_1', 'button_2'); + return compact('languages', 'button_1', 'button_2'); } } diff --git a/wp-content/themes/CCV/app/admin.php b/wp-content/themes/CCV/app/admin.php index cb694ab..44f5d6b 100644 --- a/wp-content/themes/CCV/app/admin.php +++ b/wp-content/themes/CCV/app/admin.php @@ -24,3 +24,29 @@ add_action('customize_register', function (\WP_Customize_Manager $wp_customize) add_action('customize_preview_init', function () { wp_enqueue_script('sage/customizer.js', asset('scripts/customizer.js'), ['customize-preview'], null, true); }); + + +/** + * Polylang - copy content and title when creating translations of posts / pages + * Ref: https://junaidbhura.com/make-polylang-wordpress-plugin-copy-the-content-from-the-original-post/ + */ +add_filter('default_content', function($content) { + // Polylang sets the 'from_post' parameter + if ( isset( $_GET['from_post'] ) ) { + $my_post = get_post( $_GET['from_post'] ); + if ( $my_post ) + return $my_post->post_content; + } + + return $content; +}); + +add_filter('default_title', function($title) { + if ( isset( $_GET['from_post'] ) ) { + $my_post = get_post( $_GET['from_post'] ); + if ( $my_post ) + return $my_post->post_title; + } + + return $title; +}); diff --git a/wp-content/themes/CCV/package.json b/wp-content/themes/CCV/package.json index 88767d7..8db1f7e 100644 --- a/wp-content/themes/CCV/package.json +++ b/wp-content/themes/CCV/package.json @@ -27,6 +27,7 @@ "laravel-mix-purgecss": "^4.1.0", "lost": "^8.3.1", "mix-tailwindcss": "^1.0.2", + "mmenu-light": "^2.3.1", "npm-run-all": "^4.1", "purgecss-with-wordpress": "knowler/purgecss-with-wordpress#more-wp-generated-classes", "rimraf": "^2.6", diff --git a/wp-content/themes/CCV/resources/assets/images/menu.svg b/wp-content/themes/CCV/resources/assets/images/menu.svg new file mode 100644 index 0000000..fea6efd --- /dev/null +++ b/wp-content/themes/CCV/resources/assets/images/menu.svg @@ -0,0 +1,3 @@ + + + diff --git a/wp-content/themes/CCV/resources/assets/scripts/app.js b/wp-content/themes/CCV/resources/assets/scripts/app.js index 278312f..a28df34 100644 --- a/wp-content/themes/CCV/resources/assets/scripts/app.js +++ b/wp-content/themes/CCV/resources/assets/scripts/app.js @@ -2,6 +2,7 @@ * External Dependencies */ import { router } from 'js-dom-router'; +import './menu'; /** * DOM-based routing diff --git a/wp-content/themes/CCV/resources/assets/scripts/menu.js b/wp-content/themes/CCV/resources/assets/scripts/menu.js new file mode 100644 index 0000000..ea0eddd --- /dev/null +++ b/wp-content/themes/CCV/resources/assets/scripts/menu.js @@ -0,0 +1,50 @@ +//=== MMenu Setup +import MmenuLight from 'mmenu-light/bin/js/mmlight'; +import offcanvas from 'mmenu-light/bin/js/mmlight.offcanvas'; + +MmenuLight.prototype.offcanvas = offcanvas; + +const menuID = 'mobile-menu'; + +document.addEventListener( + 'DOMContentLoaded', () => { + + buildMobileMenu(); + + let nav = document.getElementById(menuID); + window.mmenu = new MmenuLight(nav, { title: '' }); + window.menu_breakpoint = 1349; // Note: this should match the menu CSS breakpoint in setup.styl! + + mmenu.enable(`(max-width: ${menu_breakpoint}px)`); + mmenu.offcanvas({ + position: 'right' // Todo: switch for Arabic, based on class or text direction? + }); + + document.querySelector(`a[href="#menu"]`) + .addEventListener('click', (event) => { + mmenu.open(); + event.preventDefault(); + event.stopPropagation(); + + if (null === document.querySelector('.mm--close')) { + + nav.innerHTML = '' + nav.innerHTML; + + document.querySelector('.mm--close').addEventListener('click', (event) => { + mmenu.close(); + }); + + } + }); +}); + +function buildMobileMenu() { + const menu = document.createElement('div'); + const menuItems = document.querySelector('.main-menu'); + + // Todo: copy other items into mobile menu (secondary nav buttons, language switcher etc) + menu.appendChild(menuItems.cloneNode(true)); + + menu.setAttribute('id', menuID); + document.body.appendChild(menu); +} diff --git a/wp-content/themes/CCV/resources/assets/styles/app.styl b/wp-content/themes/CCV/resources/assets/styles/app.styl index 49781f7..8808208 100644 --- a/wp-content/themes/CCV/resources/assets/styles/app.styl +++ b/wp-content/themes/CCV/resources/assets/styles/app.styl @@ -11,6 +11,9 @@ @import 'common/spacing' @import 'common/animations' +// MMenu base styles from NPM package +@import '~mmenu-light/dist/mmenu-light.css' + // Extracted components or custom styles that can't be done with utilities @import 'components/*' @import 'widgets/*' diff --git a/wp-content/themes/CCV/resources/assets/styles/components/header.styl b/wp-content/themes/CCV/resources/assets/styles/components/header.styl index 17dfa10..4705269 100644 --- a/wp-content/themes/CCV/resources/assets/styles/components/header.styl +++ b/wp-content/themes/CCV/resources/assets/styles/components/header.styl @@ -1,9 +1,14 @@ header.site .header-slideshow-present & - +above($breakpoint-menu) + //+above($breakpoint-menu) + +above(1000px) position: absolute top: 0 left: 0 width: 100% background-color: transparent z-index: 20 + +.mobile-menu-trigger + +above($breakpoint-menu) + display: none diff --git a/wp-content/themes/CCV/resources/views/partials/content-single.blade.php b/wp-content/themes/CCV/resources/views/partials/content-single.blade.php index 1b688ac..e1b8052 100644 --- a/wp-content/themes/CCV/resources/views/partials/content-single.blade.php +++ b/wp-content/themes/CCV/resources/views/partials/content-single.blade.php @@ -1,19 +1,23 @@ -
-
-

- {!! $title !!} -

- - @include('partials/entry-meta') +
+
+
{{-- Just here as a proportional sizer thanks to the padding --}}
+ @include('partials/entry-meta') + +

+ {!! $title !!} +

+ @php(the_content())
+ {{--
{!! wp_link_pages(['echo' => 0, 'before' => '']) !!}
+ --}} - @php(comments_template()) + {{--@php(comments_template())--}}
diff --git a/wp-content/themes/CCV/resources/views/partials/header.blade.php b/wp-content/themes/CCV/resources/views/partials/header.blade.php index 0634289..ec657b5 100644 --- a/wp-content/themes/CCV/resources/views/partials/header.blade.php +++ b/wp-content/themes/CCV/resources/views/partials/header.blade.php @@ -6,18 +6,22 @@ @if (has_nav_menu('primary_navigation')) + + @svg('menu', 'fill-current') @endif
- {{-- TODO: Add real language switcher here --}} @if ($button_1) diff --git a/wp-content/themes/CCV/yarn.lock b/wp-content/themes/CCV/yarn.lock index f0e34d8..df2ee50 100644 --- a/wp-content/themes/CCV/yarn.lock +++ b/wp-content/themes/CCV/yarn.lock @@ -5171,6 +5171,11 @@ mkdirp@0.5.x, mkdirp@^0.5.0, mkdirp@^0.5.1, mkdirp@~0.5.0, mkdirp@~0.5.1, mkdirp dependencies: minimist "0.0.8" +mmenu-light@^2.3.1: + version "2.3.1" + resolved "https://registry.yarnpkg.com/mmenu-light/-/mmenu-light-2.3.1.tgz#c472f0b8da92528c7e1957cd5b62ab7803c445d7" + integrity sha512-t9rC8F/JQbP4xpjX8avEpu7cLtq1hMeKtiMt0H8wHDC61sGQy42C46ojXdXbRA9Sgz202x2kqdKwLLMow4IC2g== + move-concurrently@^1.0.1: version "1.0.1" resolved "https://registry.yarnpkg.com/move-concurrently/-/move-concurrently-1.0.1.tgz#be2c005fda32e0b29af1f05d7c4b33214c701f92"