Commit 568e7d4e authored by Tom Kunze's avatar Tom Kunze
Browse files

server/static/vendor/materialize: Update to 1.0.0

parent 763b0b12
......@@ -2,33 +2,34 @@
<a href="http://materializecss.com/">
<img src="http://materializecss.com/res/materialize.svg" width="150">
</a>
</p>
<h3 align="center">MaterializeCSS</h3>
<h3 align="center">MaterializeCSS</h3>
<p align="center">
Materialize, a CSS Framework based on material design.
<br>
<a href="http://materializecss.com/"><strong>-- Browse the docs --</strong></a>
<br>
<br>
<a href="https://travis-ci.org/Dogfalo/materialize">
<img src="https://travis-ci.org/Dogfalo/materialize.svg?branch=master" alt="Travis CI badge">
</a>
<a href="https://badge.fury.io/js/materialize-css">
<img src="https://badge.fury.io/js/materialize-css.svg" alt="npm version badge">
</a>
<a href="https://cdnjs.com/libraries/materialize">
<img src="https://img.shields.io/cdnjs/v/materialize.svg" alt="CDNJS version badge">
</a>
<a href="https://david-dm.org/Dogfalo/materialize">
<img src="https://david-dm.org/Dogfalo/materialize/status.svg" alt="dependencies Status badge">
</a>
<a href="https://david-dm.org/Dogfalo/materialize#info=devDependencies">
<img src="https://david-dm.org/Dogfalo/materialize/dev-status.svg" alt="devDependency Status badge">
</a>
<a href="https://gitter.im/Dogfalo/materialize">
<img src="https://badges.gitter.im/Join%20Chat.svg" alt="Gitter badge">
<p align="center">
Materialize, a CSS Framework based on material design.
<br>
<a href="http://materializecss.com/"><strong>-- Browse the docs --</strong></a>
<br>
<br>
<a href="https://travis-ci.org/Dogfalo/materialize">
<img src="https://travis-ci.org/Dogfalo/materialize.svg?branch=master" alt="Travis CI badge">
</a>
<a href="https://badge.fury.io/js/materialize-css">
<img src="https://badge.fury.io/js/materialize-css.svg" alt="npm version badge">
</a>
<a href="https://cdnjs.com/libraries/materialize">
<img src="https://img.shields.io/cdnjs/v/materialize.svg" alt="CDNJS version badge">
</a>
<a href="https://david-dm.org/Dogfalo/materialize">
<img src="https://david-dm.org/Dogfalo/materialize/status.svg" alt="dependencies Status badge">
</a>
<a href="https://david-dm.org/Dogfalo/materialize#info=devDependencies">
<img src="https://david-dm.org/Dogfalo/materialize/dev-status.svg" alt="devDependency Status badge">
</a>
<a href="https://gitter.im/Dogfalo/materialize">
<img src="https://badges.gitter.im/Join%20Chat.svg" alt="Gitter badge">
</a>
</p>
## Table of Contents
......@@ -43,12 +44,12 @@
## Quickstart:
Read the [getting started guide](http://materializecss.com/getting-started.html) for more information on how to use materialize.
- [Download the latest release](https://github.com/Dogfalo/materialize/releases/latest) of materialize directly from GitHub.
- Clone the repo: `git clone https://github.com/Dogfalo/materialize.git`
- Include the files via [cdnjs](https://cdnjs.com/libraries/materialize). More [here](http://materializecss.com/getting-started.html).
- Install with [npm](https://www.npmjs.com): `npm install materialize-css`
- [Download the latest release](https://github.com/Dogfalo/materialize/releases/latest) of materialize directly from GitHub. ([Beta](https://github.com/Dogfalo/materialize/releases/))
- Clone the repo: `git clone https://github.com/Dogfalo/materialize.git` (Beta: `git clone -b v1-dev https://github.com/Dogfalo/materialize.git`)
- Include the files via [cdnjs](https://cdnjs.com/libraries/materialize). More [here](http://materializecss.com/getting-started.html). ([Beta](https://cdnjs.com/libraries/materialize/1.0.0-beta))
- Install with [npm](https://www.npmjs.com): `npm install materialize-css` (Beta: `npm install materialize-css@next`)
- Install with [Bower](https://bower.io): `bower install materialize` ([DEPRECATED](https://bower.io/blog/2017/how-to-migrate-away-from-bower/))
- Install with [Atmosphere](https://atmospherejs.com): `meteor add materialize:materialize`
- Install with [Atmosphere](https://atmospherejs.com): `meteor add materialize:materialize` (Beta: `meteor add materialize:materialize@=1.0.0-beta`)
## Documentation
The documentation can be found at <http://materializecss.com>. To run the documentation locally on your machine, you need [Node.js](https://nodejs.org/en/) installed on your computer.
......@@ -87,4 +88,4 @@ We use Jasmine as our testing framework and we're trying to write a robust test
Check out the [CONTRIBUTING document](CONTRIBUTING.md) in the root of the repository to learn how you can contribute. You can also browse the [help-wanted](https://github.com/Dogfalo/materialize/labels/help-wanted) tag in our issue tracker to find things to do.
## Copyright and license
Code copyright 2017 Materialize. Code released under the MIT license.
Code Copyright 2018 Materialize. Code released under the MIT license.
(function ($) {
(function($) {
'use strict';
let _defaults = {
......@@ -6,12 +6,12 @@
limit: Infinity, // Limit of results the autocomplete shows
onAutocomplete: null, // Callback for when autocompleted
minLength: 1, // Min characters before autocomplete starts
sortFunction: function (a, b, inputString) { // Sort function for sorting autocomplete results
sortFunction: function(a, b, inputString) {
// Sort function for sorting autocomplete results
return a.indexOf(inputString) - b.indexOf(inputString);
}
};
/**
* @class
*
......@@ -49,6 +49,7 @@
this.oldVal;
this.$inputField = this.$el.closest('.input-field');
this.$active = $();
this._mousedown = false;
this._setupDropdown();
this._setupEventHandlers();
......@@ -86,16 +87,31 @@
this._handleInputBlurBound = this._handleInputBlur.bind(this);
this._handleInputKeyupAndFocusBound = this._handleInputKeyupAndFocus.bind(this);
this._handleInputKeydownBound = this._handleInputKeydown.bind(this);
this._handleContainerMousedownAndTouchstartBound = this._handleContainerMousedownAndTouchstart.bind(this);
this._handleInputClickBound = this._handleInputClick.bind(this);
this._handleContainerMousedownAndTouchstartBound = this._handleContainerMousedownAndTouchstart.bind(
this
);
this._handleContainerMouseupAndTouchendBound = this._handleContainerMouseupAndTouchend.bind(
this
);
this.el.addEventListener('blur', this._handleInputBlurBound);
this.el.addEventListener('keyup', this._handleInputKeyupAndFocusBound);
this.el.addEventListener('focus', this._handleInputKeyupAndFocusBound);
this.el.addEventListener('keydown', this._handleInputKeydownBound);
this.container.addEventListener('mousedown', this._handleContainerMousedownAndTouchstartBound);
this.el.addEventListener('click', this._handleInputClickBound);
this.container.addEventListener(
'mousedown',
this._handleContainerMousedownAndTouchstartBound
);
this.container.addEventListener('mouseup', this._handleContainerMouseupAndTouchendBound);
if (typeof window.ontouchstart !== 'undefined') {
this.container.addEventListener('touchstart', this._handleContainerMousedownAndTouchstartBound);
this.container.addEventListener(
'touchstart',
this._handleContainerMousedownAndTouchstartBound
);
this.container.addEventListener('touchend', this._handleContainerMouseupAndTouchendBound);
}
}
......@@ -107,10 +123,22 @@
this.el.removeEventListener('keyup', this._handleInputKeyupAndFocusBound);
this.el.removeEventListener('focus', this._handleInputKeyupAndFocusBound);
this.el.removeEventListener('keydown', this._handleInputKeydownBound);
this.container.removeEventListener('mousedown', this._handleContainerMousedownAndTouchstartBound);
this.el.removeEventListener('click', this._handleInputClickBound);
this.container.removeEventListener(
'mousedown',
this._handleContainerMousedownAndTouchstartBound
);
this.container.removeEventListener('mouseup', this._handleContainerMouseupAndTouchendBound);
if (typeof window.ontouchstart !== 'undefined') {
this.container.removeEventListener('touchstart', this._handleContainerMousedownAndTouchstartBound);
this.container.removeEventListener(
'touchstart',
this._handleContainerMousedownAndTouchstartBound
);
this.container.removeEventListener(
'touchend',
this._handleContainerMouseupAndTouchendBound
);
}
}
......@@ -119,8 +147,22 @@
*/
_setupDropdown() {
this.container = document.createElement('ul');
this.container.id = `autocomplete-options-${M.guid()}`;
$(this.container).addClass('autocomplete-content dropdown-content');
this.$inputField.append(this.container);
this.el.setAttribute('data-target', this.container.id);
this.dropdown = M.Dropdown.init(this.el, {
autoFocus: false,
closeOnClick: false,
coverTrigger: false,
onItemClick: (itemEl) => {
this.selectOption($(itemEl));
}
});
// Sketchy removal of dropdown click handler
this.el.removeEventListener('click', this.dropdown._handleClickBound);
}
/**
......@@ -134,7 +176,10 @@
* Handle Input Blur
*/
_handleInputBlur() {
this._removeAutocomplete();
if (!this._mousedown) {
this.close();
this._resetAutocomplete();
}
}
/**
......@@ -150,20 +195,14 @@
let val = this.el.value.toLowerCase();
// Don't capture enter or arrow key usage.
if (e.keyCode === 13 ||
e.keyCode === 38 ||
e.keyCode === 40) {
if (e.keyCode === 13 || e.keyCode === 38 || e.keyCode === 40) {
return;
}
// Check if the input isn't empty
if (this.oldVal !== val) {
this._removeAutocomplete();
if (val.length >= this.options.minLength) {
this.isOpen = true;
this._renderDropdown(this.options.data, val);
}
// Check if focus triggered by tab
if (this.oldVal !== val && (M.tabPressed || e.type !== 'focus')) {
this.open();
}
// Update oldVal
......@@ -183,8 +222,10 @@
numItems = $(this.container).children('li').length;
// select element on Enter
if (keyCode === 13 && this.activeIndex >= 0) {
liElement = $(this.container).children('li').eq(this.activeIndex);
if (keyCode === M.keys.ENTER && this.activeIndex >= 0) {
liElement = $(this.container)
.children('li')
.eq(this.activeIndex);
if (liElement.length) {
this.selectOption(liElement);
e.preventDefault();
......@@ -193,34 +234,49 @@
}
// Capture up and down key
if (keyCode === 38 || keyCode === 40) {
if (keyCode === M.keys.ARROW_UP || keyCode === M.keys.ARROW_DOWN) {
e.preventDefault();
if (keyCode === 38 &&
this.activeIndex > 0) {
if (keyCode === M.keys.ARROW_UP && this.activeIndex > 0) {
this.activeIndex--;
}
if (keyCode === 40 &&
this.activeIndex < (numItems - 1)) {
if (keyCode === M.keys.ARROW_DOWN && this.activeIndex < numItems - 1) {
this.activeIndex++;
}
this.$active.removeClass('active');
if (this.activeIndex >= 0) {
this.$active = $(this.container).children('li').eq(this.activeIndex);
this.$active = $(this.container)
.children('li')
.eq(this.activeIndex);
this.$active.addClass('active');
}
}
}
/**
* Handle Input Click
* @param {Event} e
*/
_handleInputClick(e) {
this.open();
}
/**
* Handle Container Mousedown and Touchstart
* @param {Event} e
*/
_handleContainerMousedownAndTouchstart(e) {
let $autocompleteOption = $(e.target).closest('li');
this.selectOption($autocompleteOption);
this._mousedown = true;
}
/**
* Handle Container Mouseup and Touchend
* @param {Event} e
*/
_handleContainerMouseupAndTouchend(e) {
this._mousedown = false;
}
/**
......@@ -228,12 +284,17 @@
*/
_highlight(string, $el) {
let img = $el.find('img');
let matchStart = $el.text().toLowerCase().indexOf("" + string.toLowerCase() + ""),
let matchStart = $el
.text()
.toLowerCase()
.indexOf('' + string.toLowerCase() + ''),
matchEnd = matchStart + string.length - 1,
beforeMatch = $el.text().slice(0, matchStart),
matchText = $el.text().slice(matchStart, matchEnd + 1),
afterMatch = $el.text().slice(matchEnd + 1);
$el.html("<span>" + beforeMatch + "<span class='highlight'>" + matchText + "</span>" + afterMatch + "</span>");
$el.html(
`<span>${beforeMatch}<span class='highlight'>${matchText}</span>${afterMatch}</span>`
);
if (img.length) {
$el.prepend(img);
}
......@@ -248,16 +309,14 @@
}
/**
* Remove autocomplete elements
* Reset autocomplete elements
*/
_removeAutocomplete() {
_resetAutocomplete() {
$(this.container).empty();
this._resetCurrentElement();
this.oldVal = null;
$(this.container).css({
display: ''
});
this.isOpen = false;
this._mousedown = false;
}
/**
......@@ -268,10 +327,11 @@
let text = el.text().trim();
this.el.value = text;
this.$el.trigger('change');
this._removeAutocomplete();
this._resetAutocomplete();
this.close();
// Handle onAutocomplete callback.
if (typeof (this.options.onAutocomplete) === 'function') {
if (typeof this.options.onAutocomplete === 'function') {
this.options.onAutocomplete.call(this, text);
}
}
......@@ -282,14 +342,13 @@
* @param {String} val current input value
*/
_renderDropdown(data, val) {
this._removeAutocomplete();
this._resetAutocomplete();
let matchingData = [];
// Gather all matching data
for (let key in data) {
if (data.hasOwnProperty(key) &&
key.toLowerCase().indexOf(val) !== -1) {
if (data.hasOwnProperty(key) && key.toLowerCase().indexOf(val) !== -1) {
// Break if past limit
if (this.count >= this.options.limit) {
break;
......@@ -306,21 +365,25 @@
}
// Sort
let sortFunctionBound = (a, b) => {
return this.options.sortFunction(a.key.toLowerCase(), b.key.toLowerCase(), val.toLowerCase());
};
matchingData.sort(sortFunctionBound);
$(this.container).css({
display: 'block'
});
if (this.options.sortFunction) {
let sortFunctionBound = (a, b) => {
return this.options.sortFunction(
a.key.toLowerCase(),
b.key.toLowerCase(),
val.toLowerCase()
);
};
matchingData.sort(sortFunctionBound);
}
// Render
for (let i = 0; i < matchingData.length; i++) {
let entry = matchingData[i];
let $autocompleteOption = $('<li></li>');
if (!!entry.data) {
$autocompleteOption.append('<img src="' + entry.data + '" class="right circle"><span>' + entry.key + '</span>');
$autocompleteOption.append(
`<img src="${entry.data}" class="right circle"><span>${entry.key}</span>`
);
} else {
$autocompleteOption.append('<span>' + entry.key + '</span>');
}
......@@ -328,7 +391,35 @@
$(this.container).append($autocompleteOption);
this._highlight(val, $autocompleteOption);
}
}
/**
* Open Autocomplete Dropdown
*/
open() {
let val = this.el.value.toLowerCase();
this._resetAutocomplete();
if (val.length >= this.options.minLength) {
this.isOpen = true;
this._renderDropdown(this.options.data, val);
}
// Open dropdown
if (!this.dropdown.isOpen) {
this.dropdown.open();
} else {
// Recalculate dropdown when its already open
this.dropdown.recalculateDimensions();
}
}
/**
* Close Autocomplete Dropdown
*/
close() {
this.dropdown.close();
}
/**
......@@ -356,5 +447,4 @@
if (M.jQueryLoaded) {
M.initializeJqueryWrapper(Autocomplete, 'autocomplete', 'M_Autocomplete');
}
}(cash));
})(cash);
/*!
* Materialize v1.0.0-alpha.4 (http://materializecss.com)
* Copyright 2014-2017 Materialize
* MIT License (https://raw.githubusercontent.com/Dogfalo/materialize/master/LICENSE)
*/
/*!
* Materialize v1.0.0 (http://materializecss.com)
* Copyright 2014-2017 Materialize
* MIT License (https://raw.githubusercontent.com/Dogfalo/materialize/master/LICENSE)
*/
var _get = function get(object, property, receiver) { if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { return get(parent, property, receiver); } } else if ("value" in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
......@@ -1071,8 +1071,8 @@ var Component = function () {
})(window);
// AMD
if (typeof define === "function" && define.amd) {
define("M", [], function () {
if (typeof define === 'function' && define.amd) {
define('M', [], function () {
return M;
});
......@@ -1084,6 +1084,8 @@ if (typeof define === "function" && define.amd) {
exports.default = M;
}
M.version = '1.0.0';
M.keys = {
TAB: 9,
ENTER: 13,
......@@ -1096,18 +1098,31 @@ M.keys = {
* TabPress Keydown handler
*/
M.tabPressed = false;
M.keyDown = false;
var docHandleKeydown = function (e) {
if (e.which === M.keys.TAB) {
M.keyDown = true;
if (e.which === M.keys.TAB || e.which === M.keys.ARROW_DOWN || e.which === M.keys.ARROW_UP) {
M.tabPressed = true;
}
};
var docHandleKeyup = function (e) {
if (e.which === M.keys.TAB) {
M.keyDown = false;
if (e.which === M.keys.TAB || e.which === M.keys.ARROW_DOWN || e.which === M.keys.ARROW_UP) {
M.tabPressed = false;
}
};
document.addEventListener('keydown', docHandleKeydown);
document.addEventListener('keyup', docHandleKeyup);
var docHandleFocus = function (e) {
if (M.keyDown) {
document.body.classList.add('keyboard-focused');
}
};
var docHandleBlur = function (e) {
document.body.classList.remove('keyboard-focused');
};
document.addEventListener('keydown', docHandleKeydown, true);
document.addEventListener('keyup', docHandleKeyup, true);
document.addEventListener('focus', docHandleFocus, true);
document.addEventListener('blur', docHandleBlur, true);
/**
* Initialize jQuery wrapper for plugin
......@@ -1144,6 +1159,41 @@ M.initializeJqueryWrapper = function (plugin, pluginName, classRef) {
};
};
/**
* Automatically initialize components
* @param {Element} context DOM Element to search within for components
*/
M.AutoInit = function (context) {
// Use document.body if no context is given
var root = !!context ? context : document.body;
var registry = {
Autocomplete: root.querySelectorAll('.autocomplete:not(.no-autoinit)'),
Carousel: root.querySelectorAll('.carousel:not(.no-autoinit)'),
Chips: root.querySelectorAll('.chips:not(.no-autoinit)'),
Collapsible: root.querySelectorAll('.collapsible:not(.no-autoinit)'),
Datepicker: root.querySelectorAll('.datepicker:not(.no-autoinit)'),
Dropdown: root.querySelectorAll('.dropdown-trigger:not(.no-autoinit)'),
Materialbox: root.querySelectorAll('.materialboxed:not(.no-autoinit)'),
Modal: root.querySelectorAll('.modal:not(.no-autoinit)'),
Parallax: root.querySelectorAll('.parallax:not(.no-autoinit)'),
Pushpin: root.querySelectorAll('.pushpin:not(.no-autoinit)'),
ScrollSpy: root.querySelectorAll('.scrollspy:not(.no-autoinit)'),
FormSelect: root.querySelectorAll('select:not(.no-autoinit)'),
Sidenav: root.querySelectorAll('.sidenav:not(.no-autoinit)'),
Tabs: root.querySelectorAll('.tabs:not(.no-autoinit)'),
TapTarget: root.querySelectorAll('.tap-target:not(.no-autoinit)'),
Timepicker: root.querySelectorAll('.timepicker:not(.no-autoinit)'),
Tooltip: root.querySelectorAll('.tooltipped:not(.no-autoinit)'),
FloatingActionButton: root.querySelectorAll('.fixed-action-btn:not(.no-autoinit)')
};
for (var pluginName in registry) {
var plugin = M[pluginName];
plugin.init(registry[pluginName]);
}
};
/**
* Generate approximated selector string for a jQuery object
* @param {jQuery} obj jQuery object to be parsed
......@@ -1172,7 +1222,7 @@ M.guid = function () {
* @returns {string}
*/
M.escapeHash = function (hash) {
return hash.replace(/(:|\.|\[|\]|,|=|\/)/g, "\\$1");
return hash.replace(/(:|\.|\[|\]|,|=|\/)/g, '\\$1');
};
M.elementOrParentIsFixed = function (element) {
......@@ -1180,7 +1230,7 @@ M.elementOrParentIsFixed = function (element) {
var $checkElements = $element.add($element.parents());
var isFixed = false;
$checkElements.each(function () {
if ($(this).css("position") === "fixed") {
if ($(this).css('position') === 'fixed') {
isFixed = true;
return false;
}
......@@ -1220,6 +1270,8 @@ M.checkWithinContainer = function (container, bounding, offset) {
};
var containerRect = container.getBoundingClientRect();
// If body element is smaller than viewport, use viewport height instead.
var containerBottom = container === document.body ? Math.max(containerRect.bottom, window.innerHeight) : containerRect.bottom;
var scrollLeft = container.scrollLeft;
var scrollTop = container.scrollTop;
......@@ -1240,7 +1292,7 @@ M.checkWithinContainer = function (container, bounding, offset) {
edges.top = true;
}
if (scrolledY + bounding.height > containerRect.bottom - offset || scrolledY + bounding.height > window.innerHeight - offset) {
if (scrolledY + bounding.height > containerBottom - offset || scrolledY + bounding.height > window.innerHeight - offset) {
edges.bottom = true;
}
......@@ -1323,7 +1375,7 @@ M.getIdFromTrigger = function (trigger) {
if (id) {