1
0
mirror of https://github.com/squidfunk/mkdocs-material.git synced 2024-11-30 18:24:35 +01:00

Fixed active layer reset

This commit is contained in:
squidfunk 2020-02-11 17:14:28 +01:00
parent 653426257e
commit 6dba046eae
18 changed files with 46 additions and 33 deletions

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -1,10 +1,10 @@
{
"assets/javascripts/bundle.js": "assets/javascripts/bundle.de72e519.min.js",
"assets/javascripts/bundle.js.map": "assets/javascripts/bundle.de72e519.min.js.map",
"assets/javascripts/bundle.js": "assets/javascripts/bundle.abf20a04.min.js",
"assets/javascripts/bundle.js.map": "assets/javascripts/bundle.abf20a04.min.js.map",
"assets/javascripts/worker/packer.js": "assets/javascripts/worker/packer.819c2a16.min.js",
"assets/javascripts/worker/packer.js.map": "assets/javascripts/worker/packer.819c2a16.min.js.map",
"assets/javascripts/worker/search.js": "assets/javascripts/worker/search.e2455911.min.js",
"assets/javascripts/worker/search.js.map": "assets/javascripts/worker/search.e2455911.min.js.map",
"assets/javascripts/worker/search.js": "assets/javascripts/worker/search.03c9bfda.min.js",
"assets/javascripts/worker/search.js.map": "assets/javascripts/worker/search.03c9bfda.min.js.map",
"assets/stylesheets/app-palette.scss": "assets/stylesheets/app-palette.8c25017f.min.css",
"assets/stylesheets/app.scss": "assets/stylesheets/app.44d84311.min.css"
}

View File

@ -188,7 +188,7 @@
{% endblock %}
</div>
{% block scripts %}
<script src="{{ 'assets/javascripts/bundle.de72e519.min.js' | url }}"></script>
<script src="{{ 'assets/javascripts/bundle.abf20a04.min.js' | url }}"></script>
<script id="__lang" type="application/json">
{%- set translations = {} -%}
{%- for key in [
@ -207,7 +207,7 @@
{%- endfor -%}
{{ translations | tojson }}
</script>
<script>app=initialize({base:"{{ base_url }}",worker:{search:"{{ 'assets/javascripts/worker/search.e2455911.min.js' | url }}",packer:"{{ 'assets/javascripts/worker/packer.819c2a16.min.js' | url }}"}})</script>
<script>app=initialize({base:"{{ base_url }}",worker:{search:"{{ 'assets/javascripts/worker/search.03c9bfda.min.js' | url }}",packer:"{{ 'assets/javascripts/worker/packer.819c2a16.min.js' | url }}"}})</script>
{% for path in config["extra_javascript"] %}
<script src="{{ path | url }}"></script>
{% endfor %}

View File

@ -19,7 +19,7 @@
<label class="md-nav__title" for="{{ path }}">
{{ nav_item.title }}
</label>
<ul class="md-nav__list" data-md-scrollfix>
<ul class="md-nav__list">
{% set base = path %}
{% for nav_item in nav_item.children %}
{% set path = base + "-" + loop.index | string %}

View File

@ -17,7 +17,7 @@
{% include "partials/source.html" %}
</div>
{% endif %}
<ul class="md-nav__list" data-md-scrollfix>
<ul class="md-nav__list">
{% for nav_item in nav %}
{% set path = "nav-" + loop.index | string %}
{% set level = 1 %}

View File

@ -13,7 +13,7 @@
</button>
</form>
<div class="md-search__output">
<div class="md-search__scrollwrap" data-md-scrollfix>
<div class="md-search__scrollwrap">
<div class="md-search-result" data-md-component="search-result">
<div class="md-search-result__meta">
{{ lang.t("search.result.placeholder") }}

View File

@ -9,7 +9,7 @@
{% endif %}
{% if toc_ | first is defined %}
<label class="md-nav__title" for="__toc">{{ lang.t("toc.title") }}</label>
<ul class="md-nav__list" data-md-scrollfix>
<ul class="md-nav__list">
{% for toc_item in toc_ %}
{% include "partials/toc-item.html" %}
{% endfor %}

View File

@ -31,6 +31,7 @@ import {
} from "rxjs"
import {
delay,
finalize,
map,
observeOn,
scan,
@ -42,7 +43,7 @@ import {
resetOverflowScrolling,
setOverflowScrolling
} from "actions"
import { getElement, getElements } from "utilities"
import { getElement } from "utilities"
/* ----------------------------------------------------------------------------
* Types
@ -65,22 +66,22 @@ export interface ActiveLayer {
*
* On iOS we want to add `-webkit-overflow-scrolling: touch` for the menus
* contained in the drawer, but as the navigational layers are nested, we can
* only add it to the active layer because otherwise weird stuff will happen.
* only add it to the active layer because otherwise weird cropping will occur.
* This implementation keeps track of the previous and currently active layer.
*
* @param el - Navigation element (top-level)
* @param els - Navigation elements
*
* @return Active layer observable
*/
export function watchActiveLayer(
el: HTMLElement
els: HTMLElement[]
): Observable<ActiveLayer> {
const table = new Map<HTMLInputElement, HTMLElement>()
for (const nav of getElements("nav", el)) {
const label = getElement<HTMLLabelElement>("label", nav)
for (const el of els) {
const label = getElement<HTMLLabelElement>("label", el)
if (typeof label !== "undefined") {
const input = getElement<HTMLInputElement>(`#${label.htmlFor}`)!
table.set(input, nav)
table.set(input, el)
}
}
@ -108,23 +109,34 @@ export function watchActiveLayer(
/**
* Paint active layer from source observable
*
* @param els - Anchor elements
* @param els - Navigation elements
*
* @return Operator function
*/
export function paintActiveLayer(): MonoTypeOperatorFunction<ActiveLayer> {
export function paintActiveLayer(
els: HTMLElement[]
): MonoTypeOperatorFunction<ActiveLayer> {
return pipe(
/* Unset overflow scrolling on previous layer */
/* Defer repaint to next animation frame */
observeOn(animationFrameScheduler),
tap(({ prev }) => {
if (prev) resetOverflowScrolling(prev)
if (prev)
resetOverflowScrolling(prev)
}),
/* Reset on complete or error */
finalize(() => {
for (const el of els)
resetOverflowScrolling(
getElement(".md-nav__list", el)!
)
}),
/* Wait until transition has finished */
delay(250),
/* Set overflow scrolling on next layer */
/* Defer repaint to next animation frame */
observeOn(animationFrameScheduler),
tap(({ next }) => {
setOverflowScrolling(next)

View File

@ -60,7 +60,7 @@
<label class="md-nav__title" for="{{ path }}">
{{ nav_item.title }}
</label>
<ul class="md-nav__list" data-md-scrollfix>
<ul class="md-nav__list">
<!-- Render nested item list -->
{% set base = path %}

View File

@ -52,7 +52,7 @@
{% endif %}
<!-- Render item list -->
<ul class="md-nav__list" data-md-scrollfix>
<ul class="md-nav__list">
{% for nav_item in nav %}
{% set path = "nav-" + loop.index | string %}
{% set level = 1 %}

View File

@ -50,7 +50,7 @@
</button>
</form>
<div class="md-search__output">
<div class="md-search__scrollwrap" data-md-scrollfix>
<div class="md-search__scrollwrap">
<div class="md-search-result" data-md-component="search-result">
<div class="md-search-result__meta">
{{ lang.t("search.result.placeholder") }}

View File

@ -39,7 +39,7 @@
<!-- Render item list -->
{% if toc_ | first is defined %}
<label class="md-nav__title" for="__toc">{{ lang.t("toc.title") }}</label>
<ul class="md-nav__list" data-md-scrollfix>
<ul class="md-nav__list">
{% for toc_item in toc_ %}
{% include "partials/toc-item.html" %}
{% endfor %}

View File

@ -150,11 +150,12 @@ function config(args: Configuration): Configuration {
/* Source maps */
devtool: "source-map",
/* Filter false positives and copied files */
/* Filter false positives and omit verbosity */
stats: {
entrypoints: false,
excludeAssets: [
/.fontawesome/,
/assets/,
/\/(fonts|images|lunr)\//,
/\.(html|py|yml)$/
],
warningsFilter: [