/******/ ( function ( modules ) { // webpackBootstrap
/******/ // The module cache
/******/ var installedModules = { } ;
/******/
/******/ // The require function
/******/ function __ webpack_require__ ( moduleId ) {
/******/
/******/ // Check if module is in cache
/******/ if ( installedModules [ moduleId ] ) {
/******/ return installedModules [ moduleId ] . exports ;
/******/ }
/******/ // Create a new module (and put it into the cache)
/******/ var module = installedModules [ moduleId ] = {
/******/ i : moduleId ,
/******/ l : false ,
/******/ exports : { }
/******/ } ;
/******/
/******/ // Execute the module function
/******/ modules [ moduleId ] . call ( module . exports , module , module . exports , __ webpack_require__ ) ;
/******/
/******/ // Flag the module as loaded
/******/ module . l = true ;
/******/
/******/ // Return the exports of the module
/******/ return module . exports ;
/******/ }
/******/
/******/
/******/ // expose the modules object (__webpack_modules__)
/******/ __ webpack_require__ . m = modules ;
/******/
/******/ // expose the module cache
/******/ __ webpack_require__ . c = installedModules ;
/******/
/******/ // define getter function for harmony exports
/******/ __ webpack_require__ . d = function ( exports , name , getter ) {
/******/ if ( ! __ webpack_require__ . o ( exports , name ) ) {
/******/ Object . defineProperty ( exports , name , {
/******/ configurable : false ,
/******/ enumerable : true ,
/******/ get : getter
/******/ } ) ;
/******/ }
/******/ } ;
/******/
/******/ // getDefaultExport function for compatibility with non-harmony modules
/******/ __ webpack_require__ . n = function ( module ) {
/******/ var getter = module && module . __ esModule ?
/******/ function getDefault ( ) { return module [ 'default' ] ; } :
/******/ function getModuleExports ( ) { return module ; } ;
/******/ __ webpack_require__ . d ( getter , 'a' , getter ) ;
/******/ return getter ;
/******/ } ;
/******/
/******/ // Object.prototype.hasOwnProperty.call
/******/ __ webpack_require__ . o = function ( object , property ) { return Object . prototype . hasOwnProperty . call ( object , property ) ; } ;
/******/
/******/ // __webpack_public_path__
/******/ __ webpack_require__ . p = "" ;
/******/
/******/ // Load entry module and return exports
/******/ return __ webpack_require__ ( __ webpack_require__ . s = 0 ) ;
/******/ } )
/************************************************************************/
/******/ ( {
/***/ "./node_modules/ev-emitter/ev-emitter.js" :
/***/ ( function ( module , exports , __ webpack_require__ ) {
var __ WEBPACK_AMD_DEFINE_FACTORY__ , __ WEBPACK_AMD_DEFINE_RESULT__ ; / * *
* EvEmitter v1 . 1.0
* Lil ' event emitter
* MIT License
* /
/* jshint unused: true, undef: true, strict: true */
( function ( global , factory ) {
// universal module definition
/* jshint strict: false */ /* globals define, module, window */
if ( true ) {
// AMD - RequireJS
! ( __ WEBPACK_AMD_DEFINE_FACTORY__ = ( factory ) ,
__ WEBPACK_AMD_DEFINE_RESULT__ = ( typeof __ WEBPACK_AMD_DEFINE_FACTORY__ === 'function' ?
( __ WEBPACK_AMD_DEFINE_FACTORY__ . call ( exports , __ webpack_require__ , exports , module ) ) :
__ WEBPACK_AMD_DEFINE_FACTORY__ ) ,
__ WEBPACK_AMD_DEFINE_RESULT__ !== undefined && ( module . exports = __ WEBPACK_AMD_DEFINE_RESULT__ ) ) ;
} else if ( typeof module == 'object' && module . exports ) {
// CommonJS - Browserify, Webpack
module . exports = factory ( ) ;
} else {
// Browser globals
global . EvEmitter = factory ( ) ;
}
} ( typeof window != 'undefined' ? window : this , function ( ) {
"use strict" ;
function EvEmitter ( ) { }
var proto = EvEmitter . prototype ;
proto . on = function ( eventName , listener ) {
if ( ! eventName || ! listener ) {
return ;
}
// set events hash
var events = this . _ events = this . _ events || { } ;
// set listeners array
var listeners = events [ eventName ] = events [ eventName ] || [ ] ;
// only add once
if ( listeners . indexOf ( listener ) == - 1 ) {
listeners . push ( listener ) ;
}
return this ;
} ;
proto . once = function ( eventName , listener ) {
if ( ! eventName || ! listener ) {
return ;
}
// add event
this . on ( eventName , listener ) ;
// set once flag
// set onceEvents hash
var onceEvents = this . _ onceEvents = this . _ onceEvents || { } ;
// set onceListeners object
var onceListeners = onceEvents [ eventName ] = onceEvents [ eventName ] || { } ;
// set flag
onceListeners [ listener ] = true ;
return this ;
} ;
proto . off = function ( eventName , listener ) {
var listeners = this . _ events && this . _ events [ eventName ] ;
if ( ! listeners || ! listeners . length ) {
return ;
}
var index = listeners . indexOf ( listener ) ;
if ( index != - 1 ) {
listeners . splice ( index , 1 ) ;
}
return this ;
} ;
proto . emitEvent = function ( eventName , args ) {
var listeners = this . _ events && this . _ events [ eventName ] ;
if ( ! listeners || ! listeners . length ) {
return ;
}
// copy over to avoid interference if .off() in listener
listeners = listeners . slice ( 0 ) ;
args = args || [ ] ;
// once stuff
var onceListeners = this . _ onceEvents && this . _ onceEvents [ eventName ] ;
for ( var i = 0 ; i < listeners . length ; i ++ ) {
var listener = listeners [ i ]
var isOnce = onceListeners && onceListeners [ listener ] ;
if ( isOnce ) {
// remove listener
// remove before trigger to prevent recursion
this . off ( eventName , listener ) ;
// unset once flag
delete onceListeners [ listener ] ;
}
// trigger listener
listener . apply ( this , args ) ;
}
return this ;
} ;
proto . allOff = function ( ) {
delete this . _ events ;
delete this . _ onceEvents ;
} ;
return EvEmitter ;
} ) ) ;
/***/ } ) ,
/***/ "./node_modules/huebee/huebee.js" :
/***/ ( function ( module , exports , __ webpack_require__ ) {
var __ WEBPACK_AMD_DEFINE_ARRAY__ , __ WEBPACK_AMD_DEFINE_RESULT__ ; / * *
* Huebee v2 . 0.0
* 1 - click color picker
* MIT license
* http : //huebee.buzz
* Copyright 2018 Metafizzy
* /
/*jshint browser: true, unused: true, undef: true */
( function ( window , factory ) {
// universal module definition
/* globals define, module, require */
if ( true ) {
// AMD
! ( __ WEBPACK_AMD_DEFINE_ARRAY__ = [
__ webpack_require__ ( "./node_modules/ev-emitter/ev-emitter.js" ) ,
__ webpack_require__ ( "./node_modules/unipointer/unipointer.js" ) ,
] , __ WEBPACK_AMD_DEFINE_RESULT__ = ( function ( EvEmitter , Unipointer ) {
return factory ( window , EvEmitter , Unipointer ) ;
} ) . apply ( exports , __ WEBPACK_AMD_DEFINE_ARRAY__ ) ,
__ WEBPACK_AMD_DEFINE_RESULT__ !== undefined && ( module . exports = __ WEBPACK_AMD_DEFINE_RESULT__ ) ) ;
} else if ( typeof module == 'object' && module . exports ) {
// CommonJS
module . exports = factory (
window ,
require ( 'ev-emitter' ) ,
require ( 'unipointer' )
) ;
} else {
// browser global
window . Huebee = factory (
window ,
window . EvEmitter ,
window . Unipointer
) ;
}
} ( window , function factory ( window , EvEmitter , Unipointer ) {
function Huebee ( anchor , options ) {
// anchor
anchor = getQueryElement ( anchor ) ;
if ( ! anchor ) {
throw 'Bad element for Huebee: ' + anchor ;
}
this . anchor = anchor ;
// options
this . options = { } ;
this . option ( Huebee . defaults ) ;
this . option ( options ) ;
// kick things off
this . create ( ) ;
}
Huebee . defaults = {
hues : 12 ,
hue0 : 0 ,
shades : 5 ,
saturations : 3 ,
notation : 'shortHex' ,
setText : true ,
setBGColor : true ,
} ;
var proto = Huebee . prototype = Object . create ( EvEmitter . prototype ) ;
proto . option = function ( options ) {
this . options = extend ( this . options , options ) ;
} ;
// globally unique identifiers
var GUID = 0 ;
// internal store of all Colcade intances
var instances = { } ;
proto . create = function ( ) {
// add guid for Colcade.data
var guid = this . guid = ++ GUID ;
this . anchor . huebeeGUID = guid ;
instances [ guid ] = this ; // associate via id
// properties
this . setBGElems = this . getSetElems ( this . options . setBGColor ) ;
this . setTextElems = this . getSetElems ( this . options . setText ) ;
// events
// HACK: this is getting ugly
this . outsideCloseIt = this . outsideClose . bind ( this ) ;
this . onDocKeydown = this . docKeydown . bind ( this ) ;
this . closeIt = this . close . bind ( this ) ;
this . openIt = this . open . bind ( this ) ;
this . onElemTransitionend = this . elemTransitionend . bind ( this ) ;
// open events
this . isInputAnchor = this . anchor . nodeName == 'INPUT' ;
if ( ! this . options . staticOpen ) {
this . anchor . addEventListener ( 'click' , this . openIt ) ;
this . anchor . addEventListener ( 'focus' , this . openIt ) ;
}
// change event
if ( this . isInputAnchor ) {
this . anchor . addEventListener ( 'input' , this . inputInput . bind ( this ) ) ;
}
// create element
var element = this . element = document . createElement ( 'div' ) ;
element . className = 'huebee ' ;
element . className += this . options . staticOpen ? 'is-static-open ' :
'is-hidden ' ;
element . className += this . options . className || '' ;
// create container
var container = this . container = document . createElement ( 'div' ) ;
container . className = 'huebee__container' ;
// do not blur if padding clicked
function onContainerPointerStart ( event ) {
if ( event . target == container ) {
event . preventDefault ( ) ;
}
}
container . addEventListener ( 'mousedown' , onContainerPointerStart ) ;
container . addEventListener ( 'touchstart' , onContainerPointerStart ) ;
// create canvas
this . createCanvas ( ) ;
// create cursor
this . cursor = document . createElement ( 'div' ) ;
this . cursor . className = 'huebee__cursor is-hidden' ;
container . appendChild ( this . cursor ) ;
// create close button
this . createCloseButton ( ) ;
element . appendChild ( container ) ;
// set relative position on parent
if ( ! this . options . staticOpen ) {
var parentStyle = getComputedStyle ( this . anchor . parentNode ) ;
if ( parentStyle . position != 'relative' && parentStyle . position != 'absolute' ) {
this . anchor . parentNode . style . position = 'relative' ;
}
}
// satY
var hues = this . options . hues ;
var customColors = this . options . customColors ;
var customLength = customColors && customColors . length ;
// y position where saturation grid starts
this . satY = customLength ? Math . ceil ( customLength / hues ) + 1 : 0 ;
// colors
this . updateColors ( ) ;
this . setAnchorColor ( ) ;
if ( this . options . staticOpen ) {
this . open ( ) ;
}
} ;
proto . getSetElems = function ( option ) {
if ( option === true ) {
return [ this . anchor ] ;
} else if ( typeof option == 'string' ) {
return document . querySelectorAll ( option ) ;
}
} ;
proto . createCanvas = function ( ) {
var canvas = this . canvas = document . createElement ( 'canvas' ) ;
canvas . className = 'huebee__canvas' ;
this . ctx = canvas . getContext ( '2d' ) ;
// canvas pointer events
var canvasPointer = this . canvasPointer = new Unipointer ( ) ;
canvasPointer . _ bindStartEvent ( canvas ) ;
canvasPointer . on ( 'pointerDown' , this . canvasPointerDown . bind ( this ) ) ;
canvasPointer . on ( 'pointerMove' , this . canvasPointerMove . bind ( this ) ) ;
this . container . appendChild ( canvas ) ;
} ;
var svgURI = 'http://www.w3.org/2000/svg' ;
proto . createCloseButton = function ( ) {
if ( this . options . staticOpen ) {
return ;
}
var svg = document . createElementNS ( svgURI , 'svg' ) ;
svg . setAttribute ( 'class' , 'huebee__close-button' ) ;
svg . setAttribute ( 'viewBox' , '0 0 24 24' ) ;
svg . setAttribute ( 'width' , '24' ) ;
svg . setAttribute ( 'height' , '24' ) ;
var path = document . createElementNS ( svgURI , 'path' ) ;
path . setAttribute ( 'd' , 'M 7,7 L 17,17 M 17,7 L 7,17' ) ;
path . setAttribute ( 'class' , 'huebee__close-button__x' ) ;
svg . appendChild ( path ) ;
svg . addEventListener ( 'click' , this . closeIt ) ;
this . container . appendChild ( svg ) ;
} ;
proto . updateColors = function ( ) {
// hash of color, h, s, l according to x,y grid position
// [x,y] = { color, h, s, l }
this . swatches = { } ;
// hash of gridX,gridY position according to color
// [#09F] = { x, y }
this . colorGrid = { } ;
this . updateColorModer ( ) ;
var shades = this . options . shades ;
var sats = this . options . saturations ;
var hues = this . options . hues ;
var customColors = this . options . customColors ;
// render custom colors
if ( customColors && customColors . length ) {
var customI = 0 ;
customColors . forEach ( function ( color ) {
var x = customI % hues ;
var y = Math . floor ( customI / hues ) ;
var swatch = getSwatch ( color ) ;
if ( swatch ) {
this . addSwatch ( swatch , x , y ) ;
customI ++ ;
}
} . bind ( this ) ) ;
}
// render saturation grids
for ( var i = 0 ; i < sats ; i ++ ) {
var sat = 1 - i / sats ;
var yOffset = shades * i + this . satY ;
this . updateSaturationGrid ( i , sat , yOffset ) ;
}
// render grays
for ( i = 0 ; i < shades + 2 ; i ++ ) {
var lum = 1 - i / ( shades + 1 ) ;
var color = this . colorModer ( 0 , 0 , lum ) ;
var swatch = getSwatch ( color ) ;
this . addSwatch ( swatch , hues + 1 , i ) ;
}
} ;
proto . updateSaturationGrid = function ( i , sat , yOffset ) {
var shades = this . options . shades ;
var hues = this . options . hues ;
var hue0 = this . options . hue0 ;
for ( var row = 0 ; row < shades ; row ++ ) {
for ( var col = 0 ; col < hues ; col ++ ) {
var hue = Math . round ( col * 360 / hues + hue0 ) % 360 ;
var lum = 1 - ( row + 1 ) / ( shades + 1 ) ;
var color = this . colorModer ( hue , sat , lum ) ;
var swatch = getSwatch ( color ) ;
var gridY = row + yOffset ;
this . addSwatch ( swatch , col , gridY ) ;
}
}
} ;
proto . addSwatch = function ( swatch , gridX , gridY ) {
// add swatch color to hash
this . swatches [ gridX + ',' + gridY ] = swatch ;
// add color to colorGrid
this . colorGrid [ swatch . color . toUpperCase ( ) ] = {
x : gridX ,
y : gridY ,
} ;
} ;
var colorModers = {
hsl : function ( h , s , l ) {
s = Math . round ( s * 100 ) ;
l = Math . round ( l * 100 ) ;
return 'hsl(' + h + ', ' + s + '%, ' + l + '%)' ;
} ,
hex : hsl2hex ,
shortHex : function ( h , s , l ) {
var hex = hsl2hex ( h , s , l ) ;
return roundHex ( hex ) ;
}
} ;
proto . updateColorModer = function ( ) {
this . colorModer = colorModers [ this . options . notation ] || colorModers . shortHex ;
} ;
proto . renderColors = function ( ) {
var gridSize = this . gridSize * 2 ;
for ( var position in this . swatches ) {
var swatch = this . swatches [ position ] ;
var duple = position . split ( ',' ) ;
var gridX = duple [ 0 ] ;
var gridY = duple [ 1 ] ;
this . ctx . fillStyle = swatch . color ;
this . ctx . fillRect ( gridX * gridSize , gridY * gridSize , gridSize , gridSize ) ;
}
} ;
proto . setAnchorColor = function ( ) {
if ( this . isInputAnchor ) {
this . setColor ( this . anchor . value ) ;
}
} ;
// ----- events ----- //
var docElem = document . documentElement ;
proto . open = function ( ) {
/* jshint unused: false */
if ( this . isOpen ) {
return ;
}
var anchor = this . anchor ;
var elem = this . element ;
if ( ! this . options . staticOpen ) {
elem . style . left = anchor . offsetLeft + 'px' ;
elem . style . top = anchor . offsetTop + anchor . offsetHeight + 'px' ;
}
this . bindOpenEvents ( true ) ;
elem . removeEventListener ( 'transitionend' , this . onElemTransitionend ) ;
// add huebee to DOM
anchor . parentNode . insertBefore ( elem , anchor . nextSibling ) ;
// measurements
var duration = getComputedStyle ( elem ) . transitionDuration ;
this . hasTransition = duration && duration != 'none' && parseFloat ( duration ) ;
this . isOpen = true ;
this . updateSizes ( ) ;
this . renderColors ( ) ;
this . setAnchorColor ( ) ;
// trigger reflow for transition
var h = elem . offsetHeight ;
elem . classList . remove ( 'is-hidden' ) ;
} ;
proto . bindOpenEvents = function ( isAdd ) {
if ( this . options . staticOpen ) {
return ;
}
var method = ( isAdd ? 'add' : 'remove' ) + 'EventListener' ;
docElem [ method ] ( 'mousedown' , this . outsideCloseIt ) ;
docElem [ method ] ( 'touchstart' , this . outsideCloseIt ) ;
document [ method ] ( 'focusin' , this . outsideCloseIt ) ;
document [ method ] ( 'keydown' , this . onDocKeydown ) ;
this . anchor [ method ] ( 'blur' , this . closeIt ) ;
} ;
proto . updateSizes = function ( ) {
var hues = this . options . hues ;
var shades = this . options . shades ;
var sats = this . options . saturations ;
this . cursorBorder = parseInt ( getComputedStyle ( this . cursor ) . borderTopWidth , 10 ) ;
this . gridSize = Math . round ( this . cursor . offsetWidth - this . cursorBorder * 2 ) ;
this . canvasOffset = {
x : this . canvas . offsetLeft ,
y : this . canvas . offsetTop ,
} ;
var height = Math . max ( shades * sats + this . satY , shades + 2 ) ;
var width = this . gridSize * ( hues + 2 ) ;
this . canvas . width = width * 2 ;
this . canvas . style . width = width + 'px' ;
this . canvas . height = this . gridSize * height * 2 ;
} ;
// close if target is not anchor or element
proto . outsideClose = function ( event ) {
var isAnchor = this . anchor . contains ( event . target ) ;
var isElement = this . element . contains ( event . target ) ;
if ( ! isAnchor && ! isElement ) {
this . close ( ) ;
}
} ;
var closeKeydowns = {
13 : true , // enter
27 : true , // esc
} ;
proto . docKeydown = function ( event ) {
if ( closeKeydowns [ event . keyCode ] ) {
this . close ( ) ;
}
} ;
var supportsTransitions = typeof docElem . style . transform == 'string' ;
proto . close = function ( ) {
if ( ! this . isOpen ) {
return ;
}
if ( supportsTransitions && this . hasTransition ) {
this . element . addEventListener ( 'transitionend' , this . onElemTransitionend ) ;
} else {
this . remove ( ) ;
}
this . element . classList . add ( 'is-hidden' ) ;
this . bindOpenEvents ( false ) ;
this . isOpen = false ;
} ;
proto . remove = function ( ) {
var parent = this . element . parentNode ;
if ( parent . contains ( this . element ) ) {
parent . removeChild ( this . element ) ;
}
} ;
proto . elemTransitionend = function ( event ) {
if ( event . target != this . element ) {
return ;
}
this . element . removeEventListener ( 'transitionend' , this . onElemTransitionend ) ;
this . remove ( ) ;
} ;
proto . inputInput = function ( ) {
this . setColor ( this . anchor . value ) ;
} ;
// ----- canvas pointer ----- //
proto . canvasPointerDown = function ( event , pointer ) {
event . preventDefault ( ) ;
this . updateOffset ( ) ;
this . canvasPointerChange ( pointer ) ;
} ;
proto . updateOffset = function ( ) {
var boundingRect = this . canvas . getBoundingClientRect ( ) ;
this . offset = {
x : boundingRect . left + window . pageXOffset ,
y : boundingRect . top + window . pageYOffset ,
} ;
} ;
proto . canvasPointerMove = function ( event , pointer ) {
this . canvasPointerChange ( pointer ) ;
} ;
proto . canvasPointerChange = function ( pointer ) {
var x = Math . round ( pointer . pageX - this . offset . x ) ;
var y = Math . round ( pointer . pageY - this . offset . y ) ;
var gridSize = this . gridSize ;
var sx = Math . floor ( x / gridSize ) ;
var sy = Math . floor ( y / gridSize ) ;
var swatch = this . swatches [ sx + ',' + sy ] ;
this . setSwatch ( swatch ) ;
} ;
// ----- select ----- //
proto . setColor = function ( color ) {
var swatch = getSwatch ( color ) ;
this . setSwatch ( swatch ) ;
} ;
proto . setSwatch = function ( swatch ) {
var color = swatch && swatch . color ;
if ( ! swatch ) {
return ;
}
var wasSameColor = color == this . color ;
// color properties
this . color = color ;
this . hue = swatch . hue ;
this . sat = swatch . sat ;
this . lum = swatch . lum ;
// estimate if color can have dark or white text
var lightness = this . lum - Math . cos ( ( this . hue + 70 ) / 180 * Math . PI ) * 0.15 ;
this . isLight = lightness > 0.5 ;
// cursor
var gridPosition = this . colorGrid [ color . toUpperCase ( ) ] ;
this . updateCursor ( gridPosition ) ;
// set texts & backgrounds
this . setTexts ( ) ;
this . setBackgrounds ( ) ;
// event
if ( ! wasSameColor ) {
this . emitEvent ( 'change' , [ color , swatch . hue , swatch . sat , swatch . lum ] ) ;
}
} ;
proto . setTexts = function ( ) {
if ( ! this . setTextElems ) {
return ;
}
for ( var i = 0 ; i < this . setTextElems . length ; i ++ ) {
var elem = this . setTextElems [ i ] ;
var property = elem . nodeName == 'INPUT' ? 'value' : 'textContent' ;
elem [ property ] = this . color ;
}
} ;
proto . setBackgrounds = function ( ) {
if ( ! this . setBGElems ) {
return ;
}
var textColor = this . isLight ? '#222' : 'white' ;
for ( var i = 0 ; i < this . setBGElems . length ; i ++ ) {
var elem = this . setBGElems [ i ] ;
elem . style . backgroundColor = this . color ;
elem . style . color = textColor ;
}
} ;
proto . updateCursor = function ( position ) {
if ( ! this . isOpen ) {
return ;
}
// show cursor if color is on the grid
var classMethod = position ? 'remove' : 'add' ;
this . cursor . classList [ classMethod ] ( 'is-hidden' ) ;
if ( ! position ) {
return ;
}
var gridSize = this . gridSize ;
var offset = this . canvasOffset ;
var border = this . cursorBorder ;
this . cursor . style . left = position . x * gridSize + offset . x - border + 'px' ;
this . cursor . style . top = position . y * gridSize + offset . y - border + 'px' ;
} ;
// -------------------------- htmlInit -------------------------- //
var console = window . console ;
function htmlInit ( ) {
var elems = document . querySelectorAll ( '[data-huebee]' ) ;
for ( var i = 0 ; i < elems . length ; i ++ ) {
var elem = elems [ i ] ;
var attr = elem . getAttribute ( 'data-huebee' ) ;
var options ;
try {
options = attr && JSON . parse ( attr ) ;
} catch ( error ) {
// log error, do not initialize
if ( console ) {
console . error ( 'Error parsing data-huebee on ' + elem . className +
': ' + error ) ;
}
continue ;
}
// initialize
new Huebee ( elem , options ) ;
}
}
var readyState = document . readyState ;
if ( readyState == 'complete' || readyState == 'interactive' ) {
htmlInit ( ) ;
} else {
document . addEventListener ( 'DOMContentLoaded' , htmlInit ) ;
}
// -------------------------- Huebee.data -------------------------- //
Huebee . data = function ( elem ) {
elem = getQueryElement ( elem ) ;
var id = elem && elem . huebeeGUID ;
return id && instances [ id ] ;
} ;
// -------------------------- getSwatch -------------------------- //
// proxy canvas used to check colors
var proxyCanvas = document . createElement ( 'canvas' ) ;
proxyCanvas . width = proxyCanvas . height = 1 ;
var proxyCtx = proxyCanvas . getContext ( '2d' ) ;
function getSwatch ( color ) {
// check that color value is valid
proxyCtx . clearRect ( 0 , 0 , 1 , 1 ) ;
proxyCtx . fillStyle = '#010203' ; // reset value
proxyCtx . fillStyle = color ;
proxyCtx . fillRect ( 0 , 0 , 1 , 1 ) ;
var data = proxyCtx . getImageData ( 0 , 0 , 1 , 1 ) . data ;
// convert to array, imageData not array, #10
data = [ data [ 0 ] , data [ 1 ] , data [ 2 ] , data [ 3 ] ] ;
if ( data . join ( ',' ) == '1,2,3,255' ) {
// invalid color
return ;
}
// convert rgb to hsl
var hsl = rgb2hsl . apply ( this , data ) ;
return {
color : color . trim ( ) ,
hue : hsl [ 0 ] ,
sat : hsl [ 1 ] ,
lum : hsl [ 2 ] ,
} ;
}
// -------------------------- utils -------------------------- //
function extend ( a , b ) {
for ( var prop in b ) {
a [ prop ] = b [ prop ] ;
}
return a ;
}
function getQueryElement ( elem ) {
if ( typeof elem == 'string' ) {
elem = document . querySelector ( elem ) ;
}
return elem ;
}
function hsl2hex ( h , s , l ) {
var rgb = hsl2rgb ( h , s , l ) ;
return rgb2hex ( rgb ) ;
}
// thx jfsiii
// https://github.com/jfsiii/chromath/blob/master/src/static.js#L312
function hsl2rgb ( h , s , l ) {
var C = ( 1 - Math . abs ( 2 * l - 1 ) ) * s ;
var hp = h / 60 ;
var X = C * ( 1 - Math . abs ( hp % 2 - 1 ) ) ;
var rgb , m ;
switch ( Math . floor ( hp ) ) {
case 0 : rgb = [ C , X , 0 ] ; break ;
case 1 : rgb = [ X , C , 0 ] ; break ;
case 2 : rgb = [ 0 , C , X ] ; break ;
case 3 : rgb = [ 0 , X , C ] ; break ;
case 4 : rgb = [ X , 0 , C ] ; break ;
case 5 : rgb = [ C , 0 , X ] ; break ;
default : rgb = [ 0 , 0 , 0 ] ;
}
m = l - ( C / 2 ) ;
rgb = rgb . map ( function ( v ) {
return v + m ;
} ) ;
return rgb ;
}
function rgb2hsl ( r , g , b ) {
r /= 255 ; g /= 255 ; b /= 255 ;
var M = Math . max ( r , g , b ) ;
var m = Math . min ( r , g , b ) ;
var C = M - m ;
var L = 0.5 * ( M + m ) ;
var S = ( C === 0 ) ? 0 : C / ( 1 - Math . abs ( 2 * L - 1 ) ) ;
var h ;
if ( C === 0 ) h = 0 ; // spec'd as undefined, but usually set to 0
else if ( M === r ) h = ( ( g - b ) / C ) % 6 ;
else if ( M === g ) h = ( ( b - r ) / C ) + 2 ;
else if ( M === b ) h = ( ( r - g ) / C ) + 4 ;
var H = 60 * h ;
return [ H , parseFloat ( S ) , parseFloat ( L ) ] ;
}
function rgb2hex ( rgb ) {
var hex = rgb . map ( function ( value ) {
value = Math . round ( value * 255 ) ;
var hexNum = value . toString ( 16 ) . toUpperCase ( ) ;
// left pad 0
hexNum = hexNum . length < 2 ? '0' + hexNum : hexNum ;
return hexNum ;
} ) ;
return '#' + hex . join ( '' ) ;
}
// #123456 -> #135
// grab first digit from hex
// not mathematically accurate, but makes for better palette
function roundHex ( hex ) {
return '#' + hex [ 1 ] + hex [ 3 ] + hex [ 5 ] ;
}
// -------------------------- -------------------------- //
return Huebee ;
} ) ) ;
/***/ } ) ,
/***/ "./node_modules/unipointer/unipointer.js" :
/***/ ( function ( module , exports , __ webpack_require__ ) {
var __ WEBPACK_AMD_DEFINE_ARRAY__ , __ WEBPACK_AMD_DEFINE_RESULT__ ; / * !
* Unipointer v2 . 3.0
* base class for doing one thing with pointer event
* MIT license
* /
/*jshint browser: true, undef: true, unused: true, strict: true */
( function ( window , factory ) {
// universal module definition
/* jshint strict: false */ /*global define, module, require */
if ( true ) {
// AMD
! ( __ WEBPACK_AMD_DEFINE_ARRAY__ = [
__ webpack_require__ ( "./node_modules/ev-emitter/ev-emitter.js" )
] , __ WEBPACK_AMD_DEFINE_RESULT__ = ( function ( EvEmitter ) {
return factory ( window , EvEmitter ) ;
} ) . apply ( exports , __ WEBPACK_AMD_DEFINE_ARRAY__ ) ,
__ WEBPACK_AMD_DEFINE_RESULT__ !== undefined && ( module . exports = __ WEBPACK_AMD_DEFINE_RESULT__ ) ) ;
} else if ( typeof module == 'object' && module . exports ) {
// CommonJS
module . exports = factory (
window ,
require ( 'ev-emitter' )
) ;
} else {
// browser global
window . Unipointer = factory (
window ,
window . EvEmitter
) ;
}
} ( window , function factory ( window , EvEmitter ) {
'use strict' ;
function noop ( ) { }
function Unipointer ( ) { }
// inherit EvEmitter
var proto = Unipointer . prototype = Object . create ( EvEmitter . prototype ) ;
proto . bindStartEvent = function ( elem ) {
this . _ bindStartEvent ( elem , true ) ;
} ;
proto . unbindStartEvent = function ( elem ) {
this . _ bindStartEvent ( elem , false ) ;
} ;
/ * *
* Add or remove start event
* @ param { Boolean } isAdd - remove if falsey
* /
proto . _ bindStartEvent = function ( elem , isAdd ) {
// munge isAdd, default to true
isAdd = isAdd === undefined ? true : isAdd ;
var bindMethod = isAdd ? 'addEventListener' : 'removeEventListener' ;
// default to mouse events
var startEvent = 'mousedown' ;
if ( window . PointerEvent ) {
// Pointer Events
startEvent = 'pointerdown' ;
} else if ( 'ontouchstart' in window ) {
// Touch Events. iOS Safari
startEvent = 'touchstart' ;
}
elem [ bindMethod ] ( startEvent , this ) ;
} ;
// trigger handler methods for events
proto . handleEvent = function ( event ) {
var method = 'on' + event . type ;
if ( this [ method ] ) {
this [ method ] ( event ) ;
}
} ;
// returns the touch that we're keeping track of
proto . getTouch = function ( touches ) {
for ( var i = 0 ; i < touches . length ; i ++ ) {
var touch = touches [ i ] ;
if ( touch . identifier == this . pointerIdentifier ) {
return touch ;
}
}
} ;
// ----- start event ----- //
proto . onmousedown = function ( event ) {
// dismiss clicks from right or middle buttons
var button = event . button ;
if ( button && ( button !== 0 && button !== 1 ) ) {
return ;
}
this . _ pointerDown ( event , event ) ;
} ;
proto . ontouchstart = function ( event ) {
this . _ pointerDown ( event , event . changedTouches [ 0 ] ) ;
} ;
proto . onpointerdown = function ( event ) {
this . _ pointerDown ( event , event ) ;
} ;
/ * *
* pointer start
* @ param { Event } event
* @ param { Event or Touch } pointer
* /
proto . _ pointerDown = function ( event , pointer ) {
// dismiss right click and other pointers
// button = 0 is okay, 1-4 not
if ( event . button || this . isPointerDown ) {
return ;
}
this . isPointerDown = true ;
// save pointer identifier to match up touch events
this . pointerIdentifier = pointer . pointerId !== undefined ?
// pointerId for pointer events, touch.indentifier for touch events
pointer . pointerId : pointer . identifier ;
this . pointerDown ( event , pointer ) ;
} ;
proto . pointerDown = function ( event , pointer ) {
this . _ bindPostStartEvents ( event ) ;
this . emitEvent ( 'pointerDown' , [ event , pointer ] ) ;
} ;
// hash of events to be bound after start event
var postStartEvents = {
mousedown : [ 'mousemove' , 'mouseup' ] ,
touchstart : [ 'touchmove' , 'touchend' , 'touchcancel' ] ,
pointerdown : [ 'pointermove' , 'pointerup' , 'pointercancel' ] ,
} ;
proto . _ bindPostStartEvents = function ( event ) {
if ( ! event ) {
return ;
}
// get proper events to match start event
var events = postStartEvents [ event . type ] ;
// bind events to node
events . forEach ( function ( eventName ) {
window . addEventListener ( eventName , this ) ;
} , this ) ;
// save these arguments
this . _ boundPointerEvents = events ;
} ;
proto . _ unbindPostStartEvents = function ( ) {
// check for _boundEvents, in case dragEnd triggered twice (old IE8 bug)
if ( ! this . _ boundPointerEvents ) {
return ;
}
this . _ boundPointerEvents . forEach ( function ( eventName ) {
window . removeEventListener ( eventName , this ) ;
} , this ) ;
delete this . _ boundPointerEvents ;
} ;
// ----- move event ----- //
proto . onmousemove = function ( event ) {
this . _ pointerMove ( event , event ) ;
} ;
proto . onpointermove = function ( event ) {
if ( event . pointerId == this . pointerIdentifier ) {
this . _ pointerMove ( event , event ) ;
}
} ;
proto . ontouchmove = function ( event ) {
var touch = this . getTouch ( event . changedTouches ) ;
if ( touch ) {
this . _ pointerMove ( event , touch ) ;
}
} ;
/ * *
* pointer move
* @ param { Event } event
* @ param { Event or Touch } pointer
* @ private
* /
proto . _ pointerMove = function ( event , pointer ) {
this . pointerMove ( event , pointer ) ;
} ;
// public
proto . pointerMove = function ( event , pointer ) {
this . emitEvent ( 'pointerMove' , [ event , pointer ] ) ;
} ;
// ----- end event ----- //
proto . onmouseup = function ( event ) {
this . _ pointerUp ( event , event ) ;
} ;
proto . onpointerup = function ( event ) {
if ( event . pointerId == this . pointerIdentifier ) {
this . _ pointerUp ( event , event ) ;
}
} ;
proto . ontouchend = function ( event ) {
var touch = this . getTouch ( event . changedTouches ) ;
if ( touch ) {
this . _ pointerUp ( event , touch ) ;
}
} ;
/ * *
* pointer up
* @ param { Event } event
* @ param { Event or Touch } pointer
* @ private
* /
proto . _ pointerUp = function ( event , pointer ) {
this . _ pointerDone ( ) ;
this . pointerUp ( event , pointer ) ;
} ;
// public
proto . pointerUp = function ( event , pointer ) {
this . emitEvent ( 'pointerUp' , [ event , pointer ] ) ;
} ;
// ----- pointer done ----- //
// triggered on pointer up & pointer cancel
proto . _ pointerDone = function ( ) {
this . _ pointerReset ( ) ;
this . _ unbindPostStartEvents ( ) ;
this . pointerDone ( ) ;
} ;
proto . _ pointerReset = function ( ) {
// reset properties
this . isPointerDown = false ;
delete this . pointerIdentifier ;
} ;
proto . pointerDone = noop ;
// ----- pointer cancel ----- //
proto . onpointercancel = function ( event ) {
if ( event . pointerId == this . pointerIdentifier ) {
this . _ pointerCancel ( event , event ) ;
}
} ;
proto . ontouchcancel = function ( event ) {
var touch = this . getTouch ( event . changedTouches ) ;
if ( touch ) {
this . _ pointerCancel ( event , touch ) ;
}
} ;
/ * *
* pointer cancel
* @ param { Event } event
* @ param { Event or Touch } pointer
* @ private
* /
proto . _ pointerCancel = function ( event , pointer ) {
this . _ pointerDone ( ) ;
this . pointerCancel ( event , pointer ) ;
} ;
// public
proto . pointerCancel = function ( event , pointer ) {
this . emitEvent ( 'pointerCancel' , [ event , pointer ] ) ;
} ;
// ----- ----- //
// utility function for getting x/y coords from event
Unipointer . getPointerPoint = function ( pointer ) {
return {
x : pointer . pageX ,
y : pointer . pageY
} ;
} ;
// ----- ----- //
return Unipointer ;
} ) ) ;
/***/ } ) ,
/***/ "./resources/assets/js/app.js" :
/***/ ( function ( module , __ webpack_exports__ , __ webpack_require__ ) {
"use strict" ;
Object . defineProperty ( __ webpack_exports__ , "__esModule" , { value : true } ) ;
/* harmony import */ var __ WEBPACK_IMPORTED_MODULE_0_huebee__ = __ webpack_require__ ( "./node_modules/huebee/huebee.js" ) ;
/* harmony import */ var __ WEBPACK_IMPORTED_MODULE_0_huebee___default = __ webpack_require__ . n ( __ WEBPACK_IMPORTED_MODULE_0_huebee__ ) ;
window . Huebee = __ WEBPACK_IMPORTED_MODULE_0_huebee___default . a ;
$ . when ( $ . ready ) . then ( function ( ) {
if ( $ ( '.message-container' ) . length ) {
setTimeout ( function ( ) {
$ ( '.message-container' ) . fadeOut ( ) ;
} , 3500 ) ;
}
if ( $ ( '.livestats-container' ) . length ) {
$ ( '.livestats-container' ) . each ( function ( index ) {
var id = $ ( this ) . data ( 'id' ) ;
var dataonly = $ ( this ) . data ( 'dataonly' ) ;
var increaseby = dataonly == 1 ? 20000 : 1000 ;
var container = $ ( this ) ;
var max_timer = 30000 ;
var timer = 5000 ;
( function worker ( ) {
$ . ajax ( {
url : '/get_stats/' + id ,
dataType : 'json' ,
success : function success ( data ) {
container . html ( data . html ) ;
if ( data . status == 'active' ) timer = increaseby ; else {
if ( timer < max_timer ) timer += 2000 ;
}
} ,
complete : function complete ( ) {
// Schedule the next request when the current one's complete
setTimeout ( worker , timer ) ;
}
} ) ;
} ) ( ) ;
} ) ;
}
function readURL ( input ) {
if ( input . files && input . files [ 0 ] ) {
var reader = new FileReader ( ) ;
reader . onload = function ( e ) {
$ ( '#appimage img' ) . attr ( 'src' , e . target . result ) ;
} ;
reader . readAsDataURL ( input . files [ 0 ] ) ;
}
}
$ ( '#upload' ) . change ( function ( ) {
readURL ( this ) ;
} ) ;
/ * $ ( " . d r o p p a b l e " ) . d r o p p a b l e ( {
tolerance : "intersect" ,
drop : function ( event , ui ) {
var tag = $ ( this ) . data ( 'id' ) ;
var item = $ ( ui . draggable ) . data ( 'id' ) ;
$ . get ( 'tag/add/' + tag + '/' + item , function ( data ) {
if ( data == 1 ) {
$ ( ui . draggable ) . remove ( ) ;
} else {
alert ( 'not added' ) ;
}
} ) ;
}
} ) ; * /
$ ( '#sortable' ) . sortable ( {
stop : function stop ( event , ui ) {
var idsInOrder = $ ( '#sortable' ) . sortable ( 'toArray' , {
attribute : 'data-id'
} ) ;
$ . post ( '/order' , { order : idsInOrder } ) ;
}
} ) ;
$ ( '#sortable' ) . sortable ( 'disable' ) ;
$ ( '#app' ) . on ( 'click' , '#config-button' , function ( e ) {
e . preventDefault ( ) ;
var app = $ ( '#app' ) ;
var active = app . hasClass ( 'header' ) ;
app . toggleClass ( 'header' ) ;
if ( active ) {
$ ( '.add-item' ) . hide ( ) ;
$ ( '.item-edit' ) . hide ( ) ;
$ ( '#app' ) . removeClass ( 'sidebar' ) ;
$ ( '#sortable' ) . sortable ( 'disable' ) ;
} else {
$ ( '#sortable' ) . sortable ( 'enable' ) ;
setTimeout ( function ( ) {
$ ( '.add-item' ) . fadeIn ( ) ;
$ ( '.item-edit' ) . fadeIn ( ) ;
} , 350 ) ;
}
} ) . on ( 'click' , '#add-item, #pin-item' , function ( e ) {
e . preventDefault ( ) ;
var app = $ ( '#app' ) ;
var active = app . hasClass ( 'sidebar' ) ;
app . toggleClass ( 'sidebar' ) ;
} ) . on ( 'click' , '.close-sidenav' , function ( e ) {
e . preventDefault ( ) ;
var app = $ ( '#app' ) ;
app . removeClass ( 'sidebar' ) ;
} ) . on ( 'click' , '#test_config' , function ( e ) {
e . preventDefault ( ) ;
var apiurl = $ ( '#create input[name=url]' ) . val ( ) ;
var override_url = $ ( '#create input[name="config[override_url]"' ) . val ( ) ;
if ( override_url . length && override_url != '' ) {
apiurl = override_url ;
}
var data = { } ;
data [ 'url' ] = apiurl ;
$ ( 'input.config-item' ) . each ( function ( index ) {
var config = $ ( this ) . data ( 'config' ) ;
data [ config ] = $ ( this ) . val ( ) ;
} ) ;
$ . post ( '/test_config' , { data : data } , function ( data ) {
alert ( data ) ;
} ) ;
} ) ;
$ ( '#pinlist' ) . on ( 'click' , 'a' , function ( e ) {
e . preventDefault ( ) ;
var current = $ ( this ) ;
var id = current . data ( 'id' ) ;
$ . get ( 'items/pintoggle/' + id + '/true' , function ( data ) {
var inner = $ ( data ) . filter ( '#sortable' ) . html ( ) ;
$ ( '#sortable' ) . html ( inner ) ;
current . toggleClass ( 'active' ) ;
} ) ;
} ) ;
} ) ;
/***/ } ) ,
/***/ "./resources/assets/js/huebee.js" :
/***/ ( function ( module , exports , __ webpack_require__ ) {
var __ WEBPACK_LOCAL_MODULE_0__ , __ WEBPACK_LOCAL_MODULE_0__factory , __ WEBPACK_LOCAL_MODULE_0__module ; var __ WEBPACK_AMD_DEFINE_ARRAY__ , __ WEBPACK_LOCAL_MODULE_1__ ; var __ WEBPACK_AMD_DEFINE_ARRAY__ , __ WEBPACK_AMD_DEFINE_RESULT__ ; var _ typeof = typeof Symbol === "function" && typeof Symbol . iterator === "symbol" ? function ( obj ) { return typeof obj ; } : function ( obj ) { return obj && typeof Symbol === "function" && obj . constructor === Symbol && obj !== Symbol . prototype ? "symbol" : typeof obj ; } ;
/ * *
* Huebee PACKAGED v2 . 0.0
* 1 - click color picker
* MIT license
* http : //huebee.buzz
* Copyright 2018 Metafizzy
* /
! function ( t , e ) {
true ? ! ( __ WEBPACK_LOCAL_MODULE_0__factory = ( e ) , ( __ WEBPACK_LOCAL_MODULE_0__module = { id : "ev-emitter/ev-emitter" , exports : { } , loaded : false } ) , __ WEBPACK_LOCAL_MODULE_0__ = ( typeof __ WEBPACK_LOCAL_MODULE_0__factory === 'function' ? ( __ WEBPACK_LOCAL_MODULE_0__factory . call ( __ WEBPACK_LOCAL_MODULE_0__module . exports , __ webpack_require__ , __ WEBPACK_LOCAL_MODULE_0__module . exports , __ WEBPACK_LOCAL_MODULE_0__module ) ) : __ WEBPACK_LOCAL_MODULE_0__factory ) , ( __ WEBPACK_LOCAL_MODULE_0__module . loaded = true ) , __ WEBPACK_LOCAL_MODULE_0__ === undefined && ( __ WEBPACK_LOCAL_MODULE_0__ = __ WEBPACK_LOCAL_MODULE_0__module . exports ) ) : "object" == ( typeof module === "undefined" ? "undefined" : _ typeof ( module ) ) && module . exports ? module . exports = e ( ) : t . EvEmitter = e ( ) ;
} ( "undefined" != typeof window ? window : this , function ( ) {
function t ( ) { } var e = t . prototype ; return e . on = function ( t , e ) {
if ( t && e ) {
var n = this . _ events = this . _ events || { } ,
i = n [ t ] = n [ t ] || [ ] ; return i . indexOf ( e ) == - 1 && i . push ( e ) , this ;
}
} , e . once = function ( t , e ) {
if ( t && e ) {
this . on ( t , e ) ; var n = this . _ onceEvents = this . _ onceEvents || { } ,
i = n [ t ] = n [ t ] || { } ; return i [ e ] = ! 0 , this ;
}
} , e . off = function ( t , e ) {
var n = this . _ events && this . _ events [ t ] ; if ( n && n . length ) {
var i = n . indexOf ( e ) ; return i != - 1 && n . splice ( i , 1 ) , this ;
}
} , e . emitEvent = function ( t , e ) {
var n = this . _ events && this . _ events [ t ] ; if ( n && n . length ) {
var i = 0 ,
o = n [ i ] ; e = e || [ ] ; for ( var s = this . _ onceEvents && this . _ onceEvents [ t ] ; o ; ) {
var r = s && s [ o ] ; r && ( this . off ( t , o ) , delete s [ o ] ) , o . apply ( this , e ) , i += r ? 0 : 1 , o = n [ i ] ;
} return this ;
}
} , t ;
} ) , function ( t , e ) {
true ? ! ( __ WEBPACK_AMD_DEFINE_ARRAY__ = [ __ WEBPACK_LOCAL_MODULE_0__ ] , __ WEBPACK_LOCAL_MODULE_1__ = ( ( function ( n ) {
return e ( t , n ) ;
} ) . apply ( exports , __ WEBPACK_AMD_DEFINE_ARRAY__ ) ) ) : "object" == ( typeof module === "undefined" ? "undefined" : _ typeof ( module ) ) && module . exports ? module . exports = e ( t , require ( "ev-emitter" ) ) : t . Unipointer = e ( t , t . EvEmitter ) ;
} ( window , function ( t , e ) {
function n ( ) { } function i ( ) { } var o = i . prototype = Object . create ( e . prototype ) ; o . bindStartEvent = function ( t ) {
this . _ bindStartEvent ( t , ! 0 ) ;
} , o . unbindStartEvent = function ( t ) {
this . _ bindStartEvent ( t , ! 1 ) ;
} , o . _ bindStartEvent = function ( e , n ) {
n = void 0 === n || ! ! n ; var i = n ? "addEventListener" : "removeEventListener" ; t . navigator . pointerEnabled ? e [ i ] ( "pointerdown" , this ) : t . navigator . msPointerEnabled ? e [ i ] ( "MSPointerDown" , this ) : ( e [ i ] ( "mousedown" , this ) , e [ i ] ( "touchstart" , this ) ) ;
} , o . handleEvent = function ( t ) {
var e = "on" + t . type ; this [ e ] && this [ e ] ( t ) ;
} , o . getTouch = function ( t ) {
for ( var e = 0 ; e < t . length ; e ++ ) {
var n = t [ e ] ; if ( n . identifier == this . pointerIdentifier ) return n ;
}
} , o . onmousedown = function ( t ) {
var e = t . button ; e && 0 !== e && 1 !== e || this . _ pointerDown ( t , t ) ;
} , o . ontouchstart = function ( t ) {
this . _ pointerDown ( t , t . changedTouches [ 0 ] ) ;
} , o . onMSPointerDown = o . onpointerdown = function ( t ) {
this . _ pointerDown ( t , t ) ;
} , o . _ pointerDown = function ( t , e ) {
this . isPointerDown || ( this . isPointerDown = ! 0 , this . pointerIdentifier = void 0 !== e . pointerId ? e . pointerId : e . identifier , this . pointerDown ( t , e ) ) ;
} , o . pointerDown = function ( t , e ) {
this . _ bindPostStartEvents ( t ) , this . emitEvent ( "pointerDown" , [ t , e ] ) ;
} ; var s = { mousedown : [ "mousemove" , "mouseup" ] , touchstart : [ "touchmove" , "touchend" , "touchcancel" ] , pointerdown : [ "pointermove" , "pointerup" , "pointercancel" ] , MSPointerDown : [ "MSPointerMove" , "MSPointerUp" , "MSPointerCancel" ] } ; return o . _ bindPostStartEvents = function ( e ) {
if ( e ) {
var n = s [ e . type ] ; n . forEach ( function ( e ) {
t . addEventListener ( e , this ) ;
} , this ) , this . _ boundPointerEvents = n ;
}
} , o . _ unbindPostStartEvents = function ( ) {
this . _ boundPointerEvents && ( this . _ boundPointerEvents . forEach ( function ( e ) {
t . removeEventListener ( e , this ) ;
} , this ) , delete this . _ boundPointerEvents ) ;
} , o . onmousemove = function ( t ) {
this . _ pointerMove ( t , t ) ;
} , o . onMSPointerMove = o . onpointermove = function ( t ) {
t . pointerId == this . pointerIdentifier && this . _ pointerMove ( t , t ) ;
} , o . ontouchmove = function ( t ) {
var e = this . getTouch ( t . changedTouches ) ; e && this . _ pointerMove ( t , e ) ;
} , o . _ pointerMove = function ( t , e ) {
this . pointerMove ( t , e ) ;
} , o . pointerMove = function ( t , e ) {
this . emitEvent ( "pointerMove" , [ t , e ] ) ;
} , o . onmouseup = function ( t ) {
this . _ pointerUp ( t , t ) ;
} , o . onMSPointerUp = o . onpointerup = function ( t ) {
t . pointerId == this . pointerIdentifier && this . _ pointerUp ( t , t ) ;
} , o . ontouchend = function ( t ) {
var e = this . getTouch ( t . changedTouches ) ; e && this . _ pointerUp ( t , e ) ;
} , o . _ pointerUp = function ( t , e ) {
this . _ pointerDone ( ) , this . pointerUp ( t , e ) ;
} , o . pointerUp = function ( t , e ) {
this . emitEvent ( "pointerUp" , [ t , e ] ) ;
} , o . _ pointerDone = function ( ) {
this . isPointerDown = ! 1 , delete this . pointerIdentifier , this . _ unbindPostStartEvents ( ) , this . pointerDone ( ) ;
} , o . pointerDone = n , o . onMSPointerCancel = o . onpointercancel = function ( t ) {
t . pointerId == this . pointerIdentifier && this . _ pointerCancel ( t , t ) ;
} , o . ontouchcancel = function ( t ) {
var e = this . getTouch ( t . changedTouches ) ; e && this . _ pointerCancel ( t , e ) ;
} , o . _ pointerCancel = function ( t , e ) {
this . _ pointerDone ( ) , this . pointerCancel ( t , e ) ;
} , o . pointerCancel = function ( t , e ) {
this . emitEvent ( "pointerCancel" , [ t , e ] ) ;
} , i . getPointerPoint = function ( t ) {
return { x : t . pageX , y : t . pageY } ;
} , i ;
} ) , function ( t , e ) {
true ? ! ( __ WEBPACK_AMD_DEFINE_ARRAY__ = [ __ WEBPACK_LOCAL_MODULE_0__ , __ WEBPACK_LOCAL_MODULE_1__ ] , __ WEBPACK_AMD_DEFINE_RESULT__ = ( function ( n , i ) {
return e ( t , n , i ) ;
} ) . apply ( exports , __ WEBPACK_AMD_DEFINE_ARRAY__ ) ,
__ WEBPACK_AMD_DEFINE_RESULT__ !== undefined && ( module . exports = __ WEBPACK_AMD_DEFINE_RESULT__ ) ) : "object" == ( typeof module === "undefined" ? "undefined" : _ typeof ( module ) ) && module . exports ? module . exports = e ( t , require ( "ev-emitter" ) , require ( "unipointer" ) ) : t . Huebee = e ( t , t . EvEmitter , t . Unipointer ) ;
} ( window , function ( t , e , n ) {
function i ( t , e ) {
if ( t = h ( t ) , ! t ) throw "Bad element for Huebee: " + t ; this . anchor = t , this . options = { } , this . option ( i . defaults ) , this . option ( e ) , this . create ( ) ;
} function o ( ) {
for ( var t = document . querySelectorAll ( "[data-huebee]" ) , e = 0 ; e < t . length ; e ++ ) {
var n ,
o = t [ e ] ,
s = o . getAttribute ( "data-huebee" ) ; try {
n = s && JSON . parse ( s ) ;
} catch ( t ) {
C && C . error ( "Error parsing data-huebee on " + o . className + ": " + t ) ; continue ;
} new i ( o , n ) ;
}
} function s ( t ) {
_ . clearRect ( 0 , 0 , 1 , 1 ) , _ . fillStyle = "#010203" , _ . fillStyle = t , _ . fillRect ( 0 , 0 , 1 , 1 ) ; var e = _ . getImageData ( 0 , 0 , 1 , 1 ) . data ; if ( e = [ e [ 0 ] , e [ 1 ] , e [ 2 ] , e [ 3 ] ] , "1,2,3,255" != e . join ( "," ) ) {
var n = u . apply ( this , e ) ; return { color : t . trim ( ) , hue : n [ 0 ] , sat : n [ 1 ] , lum : n [ 2 ] } ;
}
} function r ( t , e ) {
for ( var n in e ) {
t [ n ] = e [ n ] ;
} return t ;
} function h ( t ) {
return "string" == typeof t && ( t = document . querySelector ( t ) ) , t ;
} function a ( t , e , n ) {
var i = c ( t , e , n ) ; return d ( i ) ;
} function c ( t , e , n ) {
var i ,
o ,
s = ( 1 - Math . abs ( 2 * n - 1 ) ) * e ,
r = t / 60 ,
h = s * ( 1 - Math . abs ( r % 2 - 1 ) ) ; switch ( Math . floor ( r ) ) { case 0 :
i = [ s , h , 0 ] ; break ; case 1 :
i = [ h , s , 0 ] ; break ; case 2 :
i = [ 0 , s , h ] ; break ; case 3 :
i = [ 0 , h , s ] ; break ; case 4 :
i = [ h , 0 , s ] ; break ; case 5 :
i = [ s , 0 , h ] ; break ; default :
i = [ 0 , 0 , 0 ] ; } return o = n - s / 2 , i = i . map ( function ( t ) {
return t + o ;
} ) ;
} function u ( t , e , n ) {
t /= 255 , e /= 255 , n /= 255 ; var i ,
o = Math . max ( t , e , n ) ,
s = Math . min ( t , e , n ) ,
r = o - s ,
h = . 5 * ( o + s ) ,
a = 0 === r ? 0 : r / ( 1 - Math . abs ( 2 * h - 1 ) ) ; 0 === r ? i = 0 : o === t ? i = ( e - n ) / r % 6 : o === e ? i = ( n - t ) / r + 2 : o === n && ( i = ( t - e ) / r + 4 ) ; var c = 60 * i ; return [ c , parseFloat ( a ) , parseFloat ( h ) ] ;
} function d ( t ) {
var e = t . map ( function ( t ) {
t = Math . round ( 255 * t ) ; var e = t . toString ( 16 ) . toUpperCase ( ) ; return e = e . length < 2 ? "0" + e : e ;
} ) ; return "#" + e . join ( "" ) ;
} function p ( t ) {
return "#" + t [ 1 ] + t [ 3 ] + t [ 5 ] ;
} i . defaults = { hues : 12 , hue0 : 0 , shades : 5 , saturations : 3 , notation : "shortHex" , setText : ! 0 , setBGColor : ! 0 } ; var f = i . prototype = Object . create ( e . prototype ) ; f . option = function ( t ) {
this . options = r ( this . options , t ) ;
} ; var v = 0 ,
l = { } ; f . create = function ( ) {
function t ( t ) {
t . target == i && t . preventDefault ( ) ;
} var e = this . guid = ++ v ; this . anchor . huebeeGUID = e , l [ e ] = this , this . setBGElems = this . getSetElems ( this . options . setBGColor ) , this . setTextElems = this . getSetElems ( this . options . setText ) , this . outsideCloseIt = this . outsideClose . bind ( this ) , this . onDocKeydown = this . docKeydown . bind ( this ) , this . closeIt = this . close . bind ( this ) , this . openIt = this . open . bind ( this ) , this . onElemTransitionend = this . elemTransitionend . bind ( this ) , this . isInputAnchor = "INPUT" == this . anchor . nodeName , this . options . staticOpen || ( this . anchor . addEventListener ( "click" , this . openIt ) , this . anchor . addEventListener ( "focus" , this . openIt ) ) , this . isInputAnchor && this . anchor . addEventListener ( "input" , this . inputInput . bind ( this ) ) ; var n = this . element = document . createElement ( "div" ) ; n . className = "huebee " , n . className += this . options . staticOpen ? "is-static-open " : "is-hidden " , n . className += this . options . className || "" ; var i = this . container = document . createElement ( "div" ) ; if ( i . className = "huebee__container" , i . addEventListener ( "mousedown" , t ) , i . addEventListener ( "touchstart" , t ) , this . createCanvas ( ) , this . cursor = document . createElement ( "div" ) , this . cursor . className = "huebee__cursor is-hidden" , i . appendChild ( this . cursor ) , this . createCloseButton ( ) , n . appendChild ( i ) , ! this . options . staticOpen ) {
var o = getComputedStyle ( this . anchor . parentNode ) ; "relative" != o . position && "absolute" != o . position && ( this . anchor . parentNode . style . position = "relative" ) ;
} var s = this . options . hues ,
r = this . options . customColors ,
h = r && r . length ; this . satY = h ? Math . ceil ( h / s ) + 1 : 0 , this . updateColors ( ) , this . setAnchorColor ( ) , this . options . staticOpen && this . open ( ) ;
} , f . getSetElems = function ( t ) {
return t === ! 0 ? [ this . anchor ] : "string" == typeof t ? document . querySelectorAll ( t ) : void 0 ;
} , f . createCanvas = function ( ) {
var t = this . canvas = document . createElement ( "canvas" ) ; t . className = "huebee__canvas" , this . ctx = t . getContext ( "2d" ) ; var e = this . canvasPointer = new n ( ) ; e . _ bindStartEvent ( t ) , e . on ( "pointerDown" , this . canvasPointerDown . bind ( this ) ) , e . on ( "pointerMove" , this . canvasPointerMove . bind ( this ) ) , this . container . appendChild ( t ) ;
} ; var m = "http://www.w3.org/2000/svg" ; f . createCloseButton = function ( ) {
if ( ! this . options . staticOpen ) {
var t = document . createElementNS ( m , "svg" ) ; t . setAttribute ( "class" , "huebee__close-button" ) , t . setAttribute ( "viewBox" , "0 0 24 24" ) , t . setAttribute ( "width" , "24" ) , t . setAttribute ( "height" , "24" ) ; var e = document . createElementNS ( m , "path" ) ; e . setAttribute ( "d" , "M 7,7 L 17,17 M 17,7 L 7,17" ) , e . setAttribute ( "class" , "huebee__close-button__x" ) , t . appendChild ( e ) , t . addEventListener ( "click" , this . closeIt ) , this . container . appendChild ( t ) ;
}
} , f . updateColors = function ( ) {
this . swatches = { } , this . colorGrid = { } , this . updateColorModer ( ) ; var t = this . options . shades ,
e = this . options . saturations ,
n = this . options . hues ,
i = this . options . customColors ; if ( i && i . length ) {
var o = 0 ; i . forEach ( function ( t ) {
var e = o % n ,
i = Math . floor ( o / n ) ,
r = s ( t ) ; r && ( this . addSwatch ( r , e , i ) , o ++ ) ;
} . bind ( this ) ) ;
} for ( var r = 0 ; r < e ; r ++ ) {
var h = 1 - r / e ,
a = t * r + this . satY ; this . updateSaturationGrid ( r , h , a ) ;
} for ( r = 0 ; r < t + 2 ; r ++ ) {
var c = 1 - r / ( t + 1 ) ,
u = this . colorModer ( 0 , 0 , c ) ,
d = s ( u ) ; this . addSwatch ( d , n + 1 , r ) ;
}
} , f . updateSaturationGrid = function ( t , e , n ) {
for ( var i = this . options . shades , o = this . options . hues , r = this . options . hue0 , h = 0 ; h < i ; h ++ ) {
for ( var a = 0 ; a < o ; a ++ ) {
var c = Math . round ( 360 * a / o + r ) % 360 ,
u = 1 - ( h + 1 ) / ( i + 1 ) ,
d = this . colorModer ( c , e , u ) ,
p = s ( d ) ,
f = h + n ; this . addSwatch ( p , a , f ) ;
}
}
} , f . addSwatch = function ( t , e , n ) {
this . swatches [ e + "," + n ] = t , this . colorGrid [ t . color . toUpperCase ( ) ] = { x : e , y : n } ;
} ; var E = { hsl : function hsl ( t , e , n ) {
return e = Math . round ( 100 * e ) , n = Math . round ( 100 * n ) , "hsl(" + t + ", " + e + "%, " + n + "%)" ;
} , hex : a , shortHex : function shortHex ( t , e , n ) {
var i = a ( t , e , n ) ; return p ( i ) ;
} } ; f . updateColorModer = function ( ) {
this . colorModer = E [ this . options . notation ] || E . shortHex ;
} , f . renderColors = function ( ) {
var t = 2 * this . gridSize ; for ( var e in this . swatches ) {
var n = this . swatches [ e ] ,
i = e . split ( "," ) ,
o = i [ 0 ] ,
s = i [ 1 ] ; this . ctx . fillStyle = n . color , this . ctx . fillRect ( o * t , s * t , t , t ) ;
}
} , f . setAnchorColor = function ( ) {
this . isInputAnchor && this . setColor ( this . anchor . value ) ;
} ; var g = document . documentElement ; f . open = function ( ) {
if ( ! this . isOpen ) {
var t = this . anchor ,
e = this . element ; this . options . staticOpen || ( e . style . left = t . offsetLeft + "px" , e . style . top = t . offsetTop + t . offsetHeight + "px" ) , this . bindOpenEvents ( ! 0 ) , e . removeEventListener ( "transitionend" , this . onElemTransitionend ) , t . parentNode . insertBefore ( e , t . nextSibling ) ; var n = getComputedStyle ( e ) . transitionDuration ; this . hasTransition = n && "none" != n && parseFloat ( n ) , this . isOpen = ! 0 , this . updateSizes ( ) , this . renderColors ( ) , this . setAnchorColor ( ) ; e . offsetHeight ; e . classList . remove ( "is-hidden" ) ;
}
} , f . bindOpenEvents = function ( t ) {
if ( ! this . options . staticOpen ) {
var e = ( t ? "add" : "remove" ) + "EventListener" ; g [ e ] ( "mousedown" , this . outsideCloseIt ) , g [ e ] ( "touchstart" , this . outsideCloseIt ) , document [ e ] ( "focusin" , this . outsideCloseIt ) , document [ e ] ( "keydown" , this . onDocKeydown ) , this . anchor [ e ] ( "blur" , this . closeIt ) ;
}
} , f . updateSizes = function ( ) {
var t = this . options . hues ,
e = this . options . shades ,
n = this . options . saturations ; this . cursorBorder = parseInt ( getComputedStyle ( this . cursor ) . borderTopWidth , 10 ) , this . gridSize = Math . round ( this . cursor . offsetWidth - 2 * this . cursorBorder ) , this . canvasOffset = { x : this . canvas . offsetLeft , y : this . canvas . offsetTop } ; var i = Math . max ( e * n + this . satY , e + 2 ) ,
o = this . gridSize * ( t + 2 ) ; this . canvas . width = 2 * o , this . canvas . style . width = o + "px" , this . canvas . height = this . gridSize * i * 2 ;
} , f . outsideClose = function ( t ) {
var e = this . anchor . contains ( t . target ) ,
n = this . element . contains ( t . target ) ; e || n || this . close ( ) ;
} ; var b = { 13 : ! 0 , 27 : ! 0 } ; f . docKeydown = function ( t ) {
b [ t . keyCode ] && this . close ( ) ;
} ; var w = "string" == typeof g . style . transform ; f . close = function ( ) {
this . isOpen && ( w && this . hasTransition ? this . element . addEventListener ( "transitionend" , this . onElemTransitionend ) : this . remove ( ) , this . element . classList . add ( "is-hidden" ) , this . bindOpenEvents ( ! 1 ) , this . isOpen = ! 1 ) ;
} , f . remove = function ( ) {
var t = this . element . parentNode ; t . contains ( this . element ) && t . removeChild ( this . element ) ;
} , f . elemTransitionend = function ( t ) {
t . target == this . element && ( this . element . removeEventListener ( "transitionend" , this . onElemTransitionend ) , this . remove ( ) ) ;
} , f . inputInput = function ( ) {
this . setColor ( this . anchor . value ) ;
} , f . canvasPointerDown = function ( t , e ) {
t . preventDefault ( ) , this . updateOffset ( ) , this . canvasPointerChange ( e ) ;
} , f . updateOffset = function ( ) {
var e = this . canvas . getBoundingClientRect ( ) ; this . offset = { x : e . left + t . pageXOffset , y : e . top + t . pageYOffset } ;
} , f . canvasPointerMove = function ( t , e ) {
this . canvasPointerChange ( e ) ;
} , f . canvasPointerChange = function ( t ) {
var e = Math . round ( t . pageX - this . offset . x ) ,
n = Math . round ( t . pageY - this . offset . y ) ,
i = this . gridSize ,
o = Math . floor ( e / i ) ,
s = Math . floor ( n / i ) ,
r = this . swatches [ o + "," + s ] ; this . setSwatch ( r ) ;
} , f . setColor = function ( t ) {
var e = s ( t ) ; this . setSwatch ( e ) ;
} , f . setSwatch = function ( t ) {
var e = t && t . color ; if ( t ) {
var n = e == this . color ; this . color = e , this . hue = t . hue , this . sat = t . sat , this . lum = t . lum ; var i = this . lum - . 15 * Math . cos ( ( this . hue + 70 ) / 180 * Math . PI ) ; this . isLight = i > . 5 ; var o = this . colorGrid [ e . toUpperCase ( ) ] ; this . updateCursor ( o ) , this . setTexts ( ) , this . setBackgrounds ( ) , n || this . emitEvent ( "change" , [ e , t . hue , t . sat , t . lum ] ) ;
}
} , f . setTexts = function ( ) {
if ( this . setTextElems ) for ( var t = 0 ; t < this . setTextElems . length ; t ++ ) {
var e = this . setTextElems [ t ] ,
n = "INPUT" == e . nodeName ? "value" : "textContent" ; e [ n ] = this . color ;
}
} , f . setBackgrounds = function ( ) {
if ( this . setBGElems ) for ( var t = this . isLight ? "#222" : "white" , e = 0 ; e < this . setBGElems . length ; e ++ ) {
var n = this . setBGElems [ e ] ; n . style . backgroundColor = this . color , n . style . color = t ;
}
} , f . updateCursor = function ( t ) {
if ( this . isOpen ) {
var e = t ? "remove" : "add" ; if ( this . cursor . classList [ e ] ( "is-hidden" ) , t ) {
var n = this . gridSize ,
i = this . canvasOffset ,
o = this . cursorBorder ; this . cursor . style . left = t . x * n + i . x - o + "px" , this . cursor . style . top = t . y * n + i . y - o + "px" ;
}
}
} ; var C = t . console ,
S = document . readyState ; "complete" == S || "interactive" == S ? o ( ) : document . addEventListener ( "DOMContentLoaded" , o ) , i . data = function ( t ) {
t = h ( t ) ; var e = t && t . huebeeGUID ; return e && l [ e ] ;
} ; var y = document . createElement ( "canvas" ) ; y . width = y . height = 1 ; var _ = y . getContext ( "2d" ) ; return i ;
} ) ;
/***/ } ) ,
/***/ "./resources/assets/sass/app.scss" :
/***/ ( function ( module , exports ) {
// removed by extract-text-webpack-plugin
/***/ } ) ,
/***/ 0 :
/***/ ( function ( module , exports , __ webpack_require__ ) {
__ webpack_require__ ( "./resources/assets/js/huebee.js" ) ;
__ webpack_require__ ( "./resources/assets/js/app.js" ) ;
module . exports = __ webpack_require__ ( "./resources/assets/sass/app.scss" ) ;
/***/ } )
/******/ } ) ;