Commit a1ca5c76 authored by Clement Ho's avatar Clement Ho

Add droplab updates

parent 3c075580
......@@ -58,6 +58,7 @@
/*= require_directory ./extensions */
/*= require_directory ./lib/utils */
/*= require_directory ./u2f */
/*= require_directory ./droplab */
/*= require_directory . */
/*= require fuzzaldrin-plus */
/*= require es6-promise.auto */
......
......@@ -38,6 +38,7 @@ var DropDown = function(list, trigger) {
this.items = [];
this.getItems();
this.addEvents();
this.initialState = list.innerHTML;
};
Object.assign(DropDown.prototype, {
......@@ -50,7 +51,8 @@ Object.assign(DropDown.prototype, {
var self = this;
// event delegation.
this.list.addEventListener('click', function(e) {
if(e.target.tagName === 'A') {
if(e.target.tagName === 'A' || e.target.tagName === 'button') {
e.preventDefault();
self.hide();
var listEvent = new CustomEvent('click.dl', {
detail: {
......@@ -72,6 +74,11 @@ Object.assign(DropDown.prototype, {
}
},
setData: function(data) {
this.data = data;
this.render(data);
},
addData: function(data) {
this.data = (this.data || []).concat(data);
this.render(data);
......@@ -155,8 +162,17 @@ require('./window')(function(w){
addData: function () {
var args = [].slice.apply(arguments);
this.applyArgs(args, '_addData');
},
setData: function() {
var args = [].slice.apply(arguments);
this.applyArgs(args, '_setData');
},
applyArgs: function(args, methodName) {
if(this.ready) {
this._addData.apply(this, args);
this[methodName].apply(this, args);
} else {
this.queuedData = this.queuedData || [];
this.queuedData.push(args);
......@@ -164,10 +180,18 @@ require('./window')(function(w){
},
_addData: function(trigger, data) {
this._processData(trigger, data, 'addData');
},
_setData: function(trigger, data) {
this._processData(trigger, data, 'setData');
},
_processData: function(trigger, data, methodName) {
this.hooks.forEach(function(hook) {
if(hook.trigger.dataset.hasOwnProperty('id')) {
if(hook.trigger.dataset.id === trigger) {
hook.list.addData(data);
hook.list[methodName](data);
}
}
});
......@@ -189,21 +213,48 @@ require('./window')(function(w){
});
},
addHook: function(hook) {
changeHookList: function(trigger, list) {
trigger = document.querySelector('[data-id="'+trigger+'"]');
list = document.querySelector(list);
this.hooks.every(function(hook, i) {
if(hook.trigger === trigger) {
// Restore initial State
hook.list.list.innerHTML = hook.list.initialState;
hook.list.hide();
hook.trigger.removeEventListener('mousedown', hook.events.mousedown);
hook.trigger.removeEventListener('input', hook.events.input);
hook.trigger.removeEventListener('keyup', hook.events.keyup);
hook.trigger.removeEventListener('keydown', hook.events.keydown);
this.hooks.splice(i, 1);
this.addHook(trigger, list);
return false;
}
return true
}.bind(this));
},
addHook: function(hook, list) {
if(!(hook instanceof HTMLElement) && typeof hook === 'string'){
hook = document.querySelector(hook);
}
var list = document.querySelector(hook.dataset[utils.toDataCamelCase(DATA_TRIGGER)]);
if(hook.tagName === 'A' || hook.tagName === 'BUTTON') {
this.hooks.push(new HookButton(hook, list));
} else if(hook.tagName === 'INPUT') {
this.hooks.push(new HookInput(hook, list));
if(!list){
list = document.querySelector(hook.dataset[utils.toDataCamelCase(DATA_TRIGGER)]);
}
if(hook) {
if(hook.tagName === 'A' || hook.tagName === 'BUTTON') {
this.hooks.push(new HookButton(hook, list));
} else if(hook.tagName === 'INPUT') {
this.hooks.push(new HookInput(hook, list));
}
}
return this;
},
addHooks: function(hooks) {
hooks.forEach(this.addHook.bind(this));
hooks.forEach(function(hook) {
this.addHook(hook, null);
}.bind(this));
return this;
},
......@@ -302,7 +353,8 @@ var HookInput = function(trigger, list) {
Object.assign(HookInput.prototype, {
addEvents: function(){
var self = this;
this.trigger.addEventListener('mousedown', function(e){
function mousedown(e) {
var mouseEvent = new CustomEvent('mousedown.dl', {
detail: {
hook: self,
......@@ -312,9 +364,9 @@ Object.assign(HookInput.prototype, {
cancelable: true
});
e.target.dispatchEvent(mouseEvent);
});
}
this.trigger.addEventListener('input', function(e){
function input(e) {
var inputEvent = new CustomEvent('input.dl', {
detail: {
hook: self,
......@@ -325,15 +377,15 @@ Object.assign(HookInput.prototype, {
});
e.target.dispatchEvent(inputEvent);
self.list.show();
});
}
this.trigger.addEventListener('keyup', function(e){
function keyup(e) {
keyEvent(e, 'keyup.dl');
});
}
this.trigger.addEventListener('keydown', function(e){
function keydown(e) {
keyEvent(e, 'keydown.dl');
});
}
function keyEvent(e, keyEventName){
var keyEvent = new CustomEvent(keyEventName, {
......@@ -349,6 +401,16 @@ Object.assign(HookInput.prototype, {
e.target.dispatchEvent(keyEvent);
self.list.show();
}
this.events = this.events || {};
this.events.mousedown = mousedown;
this.events.input = input;
this.events.keyup = keyup;
this.events.keydown = keydown;
this.trigger.addEventListener('mousedown', mousedown);
this.trigger.addEventListener('input', input);
this.trigger.addEventListener('keyup', keyup);
this.trigger.addEventListener('keydown', keydown);
},
});
......
......@@ -2,18 +2,17 @@
(function(f){if(typeof exports==="object"&&typeof module!=="undefined"){module.exports=f()}else if(typeof define==="function"&&define.amd){define([],f)}else{var g;if(typeof window!=="undefined"){g=window}else if(typeof global!=="undefined"){g=global}else if(typeof self!=="undefined"){g=self}else{g=this}g=(g.droplab||(g.droplab = {}));g=(g.filter||(g.filter = {}));g.js = f()}})(function(){var define,module,exports;return (function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s})({1:[function(require,module,exports){
/* global droplab */
droplab.plugin(function init(DropLab) {
var keydown = function keydown(e) {
var list = e.detail.hook.list;
var data = list.data;
var value = e.detail.hook.trigger.value.toLowerCase();
var config;
var config = droplab.config[e.detail.hook.id];
var matches = [];
// will only work on dynamically set data
if(!data){
// will only work on dynamically set data
// and if a config text property is set
if(!data || !config.hasOwnProperty('text')){
return;
}
config = droplab.config[e.detail.hook.id];
matches = data.map(function(o){
// cheap string search
o.droplab_hidden = o[config.text].toLowerCase().indexOf(value) === -1;
......@@ -21,8 +20,7 @@ droplab.plugin(function init(DropLab) {
});
list.render(matches);
}
window.addEventListener('keyup.dl', keydown);
});
},{}]},{},[1])(1)
});
});
\ No newline at end of file
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment