From d3fcd1212f7214b12b04a83d03dfb129c5fbb0a4 Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Wed, 6 Jun 2018 00:59:39 +0200 Subject: pix2wav paths --- app/client/api/index.js | 2 +- app/client/audio/draw.js | 270 ---- app/client/audio/index.js | 2 - app/client/audio/lib/_draw.js | 139 ++ app/client/audio/lib/draw.js | 134 ++ app/client/audio/lib/index.js | 47 + app/client/audio/lib/output.js | 8 + app/client/audio/lib/spectrum.js | 278 ++++ app/client/audio/lib/startAudioContext.js | 179 +++ app/client/audio/output.js | 8 - app/client/audio/pix2wav.js | 35 + app/client/audio/spectrum.js | 278 ---- app/client/audio/startAudioContext.js | 179 --- app/client/audio/ui.js | 12 + app/client/audio/wav2pix.js | 149 +-- app/client/common/fileList.component.js | 2 +- app/client/dashboard/dashboardHeader.component.js | 2 +- app/client/dashboard/tasklist.component.js | 2 +- app/client/dataset/dataset.component.js | 2 +- app/client/index.jsx | 2 +- app/client/modules/pix2pix/index.js | 3 + app/client/modules/pix2pix/pix2pix.actions.js | 4 +- app/client/modules/pix2pix/views/pix2pix.new.js | 3 - app/client/modules/pix2pix/views/pix2pix.show.js | 2 +- app/client/modules/pix2wav/index.js | 13 +- app/client/modules/pix2wav/pix2wav.actions.js | 57 + app/client/modules/pix2wav/pix2wav.tasks.js | 7 + app/client/modules/pix2wav/views/pix2wav.new.js | 13 + app/client/modules/pix2wav/views/pix2wav.show.js | 116 ++ app/client/modules/samplernn/index.js | 2 + app/client/modules/samplernn/samplernn.actions.js | 4 +- .../modules/samplernn/views/samplernn.graph.js | 6 +- .../modules/samplernn/views/samplernn.import.js | 2 +- .../modules/samplernn/views/samplernn.new.js | 2 +- .../modules/samplernn/views/samplernn.results.js | 2 +- .../modules/samplernn/views/samplernn.show.js | 2 +- app/client/queue/queue.reducer.js | 2 +- app/client/util/hidpi-canvas.js | 170 +++ app/client/util/index.js | 30 +- app/client/util/math.js | 13 +- public/assets/css/css.css | 1 + public/bundle.js | 1398 +++++++++++++++++--- public/bundle.js.map | 2 +- 43 files changed, 2517 insertions(+), 1067 deletions(-) delete mode 100644 app/client/audio/draw.js delete mode 100644 app/client/audio/index.js create mode 100644 app/client/audio/lib/_draw.js create mode 100644 app/client/audio/lib/draw.js create mode 100644 app/client/audio/lib/index.js create mode 100644 app/client/audio/lib/output.js create mode 100644 app/client/audio/lib/spectrum.js create mode 100644 app/client/audio/lib/startAudioContext.js delete mode 100644 app/client/audio/output.js create mode 100644 app/client/audio/pix2wav.js delete mode 100644 app/client/audio/spectrum.js delete mode 100644 app/client/audio/startAudioContext.js create mode 100644 app/client/audio/ui.js create mode 100644 app/client/modules/pix2wav/pix2wav.actions.js create mode 100644 app/client/modules/pix2wav/pix2wav.tasks.js create mode 100644 app/client/modules/pix2wav/views/pix2wav.new.js create mode 100644 app/client/modules/pix2wav/views/pix2wav.show.js create mode 100644 app/client/util/hidpi-canvas.js diff --git a/app/client/api/index.js b/app/client/api/index.js index c19b78d..7551fb2 100644 --- a/app/client/api/index.js +++ b/app/client/api/index.js @@ -1,5 +1,5 @@ import { crud_actions } from './crud.actions' -import * as util from '../util' +import util from '../util' import * as parser from './parser' /* diff --git a/app/client/audio/draw.js b/app/client/audio/draw.js deleted file mode 100644 index 8caf8d8..0000000 --- a/app/client/audio/draw.js +++ /dev/null @@ -1,270 +0,0 @@ -import { - browser, requestAudioContext, - randint, randrange, clamp, mod, -} from './lib/util' - -import './lib/vendor/hidpi-canvas' - -import mouse from './lib/mouse' -import color from './lib/color' - -let w, h -let rx, ry - -const pixels_per_second = 512 // 1024 - -const canvas = document.createElement('canvas') -// document.body.appendChild(canvas) -// document.body.addEventListener('resize', resize) -resize() -recenter() -requestAnimationFrame(animate) - -// must request context after resizing -const ctx = canvas.getContext('2d') - -const scratch = document.createElement('canvas') -const scratchCtx = scratch.getContext('2d-lodpi') - -function resize(ww, hh){ - w = canvas.width = ww || window.innerWidth - h = canvas.height = hh || window.innerHeight - canvas.style.width = w + 'px' - canvas.style.height = h + 'px' -} -function recenter(){ - rx = randint(w), ry = randint(h) -} -let frame = null -function onFrame(fn){ - frame = fn -} -function animate(t){ - requestAnimationFrame(animate) - if (frame) { - frame(t) - frame = null - } - // ctx.save() - // ctx.globalAlpha = 0.0001 - // ctx.translate(w/2, h/2) - // ctx.rotate(0.1) - // ctx.translate(-rx, -ry) - // ctx.drawImage(canvas, 0, 0) - // ctx.restore() -} -function clear(n, x, y, ww, hh){ - ctx.fillStyle = 'rgba(255,255,255,' + (n || 0.9) + ')' - ctx.fillRect(x || 0, y || 0, ww || w, hh || h) - recenter() -} -function triangle(px,py,r){ - setTimeout( () => tri(px,py,r), Math.random()*10) - // setTimeout( () => tri(px,py,r), Math.random()*200) - // setTimeout( () => tri(px,py,r), Math.random()*300) -} -function tri(px, py, r) { - ctx.save() - ctx.globalCompositeOperation = 'multiply' - ctx.fillStyle = color.color((px+py)/(w+h), 0, 1, 0.2) - function p(){ - let theta = randrange(0, Math.PI*2) - let x = px + Math.cos(theta) * r - let y = py + Math.sin(theta) * r - return { x, y } - } - ctx.beginPath() - const p0 = p(), p1 = p(), p2 = p() - ctx.moveTo(p0.x, p0.y) - ctx.lineTo(p1.x, p1.y) - ctx.lineTo(p2.x, p2.y) - ctx.lineTo(p0.x, p0.y) - ctx.fill() - ctx.restore() -} -function line(y){ - ctx.beginPath() - ctx.moveTo(0, y) - ctx.lineTo(w, y) - ctx.strokeStyle = "#888" - ctx.strokeWidth = 1 - ctx.stroke() -} -function dot(x, y, r){ - ctx.fillStyle = "#f00" - ctx.beginPath() - ctx.moveTo(x, y) - ctx.arc(x, y, r, 0, 2*Math.PI) - ctx.fill() -} -function waveform(pcm, sr, pos, zoom){ - sr = sr || 44100 - pos = pos || 0 - - var width = w - var height = Math.floor(h/4) - var half_height = Math.floor(height/2) - var x0 = 0 - var y0 = 20 - var ymid = y0 + half_height - var max_width_in_seconds = width / pixels_per_second - var max_width_in_samples = max_width_in_seconds * sr - var pcm_length = pcm.length - var len = Math.min(pcm_length, max_width_in_samples) - var pcm_step = sr / pixels_per_second - var i - ctx.save() - - clear(1, x0, y0, width, height) - - line(ymid) - ctx.beginPath() - for (i = 0; i < width; i += 0.5) { - var si = Math.floor(pcm_step * i + pos) - if (si > pcm_length) break - var val = pcm[si] // -1, 1 - // ctx.moveTo(x0 + i, ymid) - ctx.lineTo(x0 + i, ymid + val * half_height) - } - ctx.strokeStyle = "rgba(250,20,0,0.9)" - ctx.strokeWidth = 1 - ctx.stroke() - ctx.restore() -} - -function spectrum(spec, x0, y0, ww, hh){ - const data = spec.data - const fft_size = spec.fft_size - const half_fft_size = spec.fft_size / 2 - const spec_len = data.length - - scratch.width = data.length - scratch.height = half_fft_size - - var imageData = ctx.createImageData(scratch.width, scratch.height) - var pixels = imageData.data - - let i, j, u, v, _r, _i, col, hsl - - for (i = 0; i < spec_len; i++) { - col = data[i] - - for (j = 0; j < half_fft_size; j++) { - u = ((half_fft_size - j) * spec_len + i) * 4 - v = j * 2 - _r = col[v] - _i = mod(col[v+1], Math.PI*2) / (Math.PI*2) - hsl = color.hsl2rgb((_i + 1) / 2, 1.0, 1 - Math.abs(_r / 10)) - // red - real part - // pixels[u] = _r * 127 + 127 - // // green - imag part - // pixels[u+1] = _i * 127 + 127 - // // blue - magnitude - // pixels[u+2] = Math.sqrt(Math.pow(_r, 2) + Math.pow(_i, 2)) * 128 + 127 - // pixels[u+3] = 255 - pixels[u] = hsl[0] - pixels[u+1] = hsl[1] - pixels[u+2] = hsl[2] - pixels[u+3] = 255 - } - } - - scratchCtx.putImageData(imageData, 0, 0) - - var pcm_length = spec.fft_overlap * spec_len - - x0 = x0 * devicePixelRatio || 0 - y0 = y0 * devicePixelRatio || Math.floor(h/4) - ww = ww * devicePixelRatio || w - hh = hh * devicePixelRatio || h/4 - - const width = Math.round(pcm_length / spec.sr * pixels_per_second) - const height = Math.floor(hh) - - ctx.save() - clear(1, x0, y0, w, height) - ctx.drawImage(scratch, x0, y0, width, height) - ctx.restore() -} -function raw_spectrum(spec, x0, y0, ww, hh, def_min_r, def_min_i){ - const data = spec.data - const fft_size = spec.fft_size - const half_fft_size = spec.fft_size / 2 - const spec_len = data.length - - const _scratch = document.createElement('canvas') - const _scratchCtx = _scratch.getContext('2d-lodpi') - _scratch.width = data.length - _scratch.height = half_fft_size - // console.log("spectrum w/h:", _scratch.width, _scratch.height) - - var imageData = _scratchCtx.createImageData(_scratch.width, _scratch.height) - var pixels = imageData.data - - let i, j, u, v, _r, _i, col, hsl - // let min_r = Infinity, max_r = -Infinity - // let min_i = Infinity, max_i = -Infinity - - // determined empirically.. - // let min_r = -60.4894057005308 - // let max_r = 107.23800966675353 - // let min_i = -59.4894057005308 - // let max_i = 108.23800966675353 - let min_r = -def_min_r - let max_r = def_min_r - let min_i = -def_min_i - let max_i = def_min_i - let delta_r = max_r - min_r - let delta_i = max_i - min_i - let mean_r = 0 - let mean_i = 0 - let sum_mean_r = 0, sum_mean_i = 0 - let real, imag - - for (i = 0; i < spec_len; i++) { - col = data[i] - mean_r = 0 - mean_i = 0 - - for (j = 0; j < half_fft_size; j++) { - u = (j * spec_len + i) * 4 - v = j * 2 - real = col[v] - imag = col[v+1] - mean_r += real - mean_i += imag - _r = clamp((real - min_r) / delta_r * 255, 0, 255) - _i = clamp((imag - min_i) / delta_i * 255, 0, 255) - - // hsl = color.hsl2rgb((_i + 1) / 2, 1.0, 1 - Math.abs(_r / 10)) - pixels[u+0] = _r - pixels[u+1] = _i - pixels[u+2] = 127 // hsl[2] - pixels[u+3] = 255 - - // min_r = Math.min(min_r, col[v]) - // max_r = Math.max(max_r, col[v]) - // min_i = Math.min(min_i, col[v]+1) - // max_i = Math.max(max_i, col[v]+1) - } - mean_r /= half_fft_size - mean_i /= half_fft_size - sum_mean_r += mean_r - sum_mean_i += mean_i - } - - sum_mean_r /= spec_len - sum_mean_i /= spec_len - // console.log(sum_mean_r, sum_mean_i) - // console.log("r:", min_r, max_r) - // console.log("i:", min_i, max_i) - _scratchCtx.putImageData(imageData, 0, 0) - - return { canvas: _scratch, imageData } -} - -export default { - canvas, ctx, onFrame, resize, - triangle, clear, line, dot, - waveform, spectrum, raw_spectrum, -} \ No newline at end of file diff --git a/app/client/audio/index.js b/app/client/audio/index.js deleted file mode 100644 index 8b3da74..0000000 --- a/app/client/audio/index.js +++ /dev/null @@ -1,2 +0,0 @@ -import Tone from 'tone' -import StartAudioContext from './startAudioContext' diff --git a/app/client/audio/lib/_draw.js b/app/client/audio/lib/_draw.js new file mode 100644 index 0000000..974fa62 --- /dev/null +++ b/app/client/audio/lib/_draw.js @@ -0,0 +1,139 @@ +import { + browser, requestAudioContext, + randint, randrange, clamp, mod, +} from './lib/util' + +import './lib/vendor/hidpi-canvas' + +import mouse from './lib/mouse' +import color from './lib/color' + +let w, h +let rx, ry + +const pixels_per_second = 512 // 1024 + +const canvas = document.createElement('canvas') +// document.body.appendChild(canvas) +// document.body.addEventListener('resize', resize) +resize() +recenter() +requestAnimationFrame(animate) + +// must request context after resizing +const ctx = canvas.getContext('2d') + +const scratch = document.createElement('canvas') +const scratchCtx = scratch.getContext('2d-lodpi') + +function resize(ww, hh){ + w = canvas.width = ww || window.innerWidth + h = canvas.height = hh || window.innerHeight + canvas.style.width = w + 'px' + canvas.style.height = h + 'px' +} +function recenter(){ + rx = randint(w), ry = randint(h) +} +let frame = null +function onFrame(fn){ + frame = fn +} +function animate(t){ + requestAnimationFrame(animate) + if (frame) { + frame(t) + frame = null + } + // ctx.save() + // ctx.globalAlpha = 0.0001 + // ctx.translate(w/2, h/2) + // ctx.rotate(0.1) + // ctx.translate(-rx, -ry) + // ctx.drawImage(canvas, 0, 0) + // ctx.restore() +} +function clear(n, x, y, ww, hh){ + ctx.fillStyle = 'rgba(255,255,255,' + (n || 0.9) + ')' + ctx.fillRect(x || 0, y || 0, ww || w, hh || h) + recenter() +} +function triangle(px,py,r){ + setTimeout( () => tri(px,py,r), Math.random()*10) + // setTimeout( () => tri(px,py,r), Math.random()*200) + // setTimeout( () => tri(px,py,r), Math.random()*300) +} +function tri(px, py, r) { + ctx.save() + ctx.globalCompositeOperation = 'multiply' + ctx.fillStyle = color.color((px+py)/(w+h), 0, 1, 0.2) + function p(){ + let theta = randrange(0, Math.PI*2) + let x = px + Math.cos(theta) * r + let y = py + Math.sin(theta) * r + return { x, y } + } + ctx.beginPath() + const p0 = p(), p1 = p(), p2 = p() + ctx.moveTo(p0.x, p0.y) + ctx.lineTo(p1.x, p1.y) + ctx.lineTo(p2.x, p2.y) + ctx.lineTo(p0.x, p0.y) + ctx.fill() + ctx.restore() +} +function line(y){ + ctx.beginPath() + ctx.moveTo(0, y) + ctx.lineTo(w, y) + ctx.strokeStyle = "#888" + ctx.strokeWidth = 1 + ctx.stroke() +} +function dot(x, y, r){ + ctx.fillStyle = "#f00" + ctx.beginPath() + ctx.moveTo(x, y) + ctx.arc(x, y, r, 0, 2*Math.PI) + ctx.fill() +} +function waveform(pcm, sr, pos, zoom){ + sr = sr || 44100 + pos = pos || 0 + + var width = w + var height = Math.floor(h/4) + var half_height = Math.floor(height/2) + var x0 = 0 + var y0 = 20 + var ymid = y0 + half_height + var max_width_in_seconds = width / pixels_per_second + var max_width_in_samples = max_width_in_seconds * sr + var pcm_length = pcm.length + var len = Math.min(pcm_length, max_width_in_samples) + var pcm_step = sr / pixels_per_second + var i + ctx.save() + + clear(1, x0, y0, width, height) + + line(ymid) + ctx.beginPath() + for (i = 0; i < width; i += 0.5) { + var si = Math.floor(pcm_step * i + pos) + if (si > pcm_length) break + var val = pcm[si] // -1, 1 + // ctx.moveTo(x0 + i, ymid) + ctx.lineTo(x0 + i, ymid + val * half_height) + } + ctx.strokeStyle = "rgba(250,20,0,0.9)" + ctx.strokeWidth = 1 + ctx.stroke() + ctx.restore() +} + +export default { + canvas, ctx, onFrame, resize, + triangle, clear, line, dot, + waveform, spectrum, raw_spectrum, +} \ No newline at end of file diff --git a/app/client/audio/lib/draw.js b/app/client/audio/lib/draw.js new file mode 100644 index 0000000..f5ba3ac --- /dev/null +++ b/app/client/audio/lib/draw.js @@ -0,0 +1,134 @@ +const scratch = document.createElement('canvas') +const scratchCtx = scratch.getContext('2d-lodpi') + +function spectrum(spec, x0, y0, ww, hh){ + const data = spec.data + const fft_size = spec.fft_size + const half_fft_size = spec.fft_size / 2 + const spec_len = data.length + + scratch.width = data.length + scratch.height = half_fft_size + + var imageData = ctx.createImageData(scratch.width, scratch.height) + var pixels = imageData.data + + let i, j, u, v, _r, _i, col, hsl + + for (i = 0; i < spec_len; i++) { + col = data[i] + + for (j = 0; j < half_fft_size; j++) { + u = ((half_fft_size - j) * spec_len + i) * 4 + v = j * 2 + _r = col[v] + _i = mod(col[v+1], Math.PI*2) / (Math.PI*2) + hsl = color.hsl2rgb((_i + 1) / 2, 1.0, 1 - Math.abs(_r / 10)) + // red - real part + // pixels[u] = _r * 127 + 127 + // // green - imag part + // pixels[u+1] = _i * 127 + 127 + // // blue - magnitude + // pixels[u+2] = Math.sqrt(Math.pow(_r, 2) + Math.pow(_i, 2)) * 128 + 127 + // pixels[u+3] = 255 + pixels[u] = hsl[0] + pixels[u+1] = hsl[1] + pixels[u+2] = hsl[2] + pixels[u+3] = 255 + } + } + + scratchCtx.putImageData(imageData, 0, 0) + + var pcm_length = spec.fft_overlap * spec_len + + x0 = x0 * devicePixelRatio || 0 + y0 = y0 * devicePixelRatio || Math.floor(h/4) + ww = ww * devicePixelRatio || w + hh = hh * devicePixelRatio || h/4 + + const width = Math.round(pcm_length / spec.sr * pixels_per_second) + const height = Math.floor(hh) + + ctx.save() + clear(1, x0, y0, w, height) + ctx.drawImage(scratch, x0, y0, width, height) + ctx.restore() +} + +function raw_spectrum(spec, x0, y0, ww, hh, def_min_r, def_min_i){ + const data = spec.data + const fft_size = spec.fft_size + const half_fft_size = spec.fft_size / 2 + const spec_len = data.length + + const _scratch = document.createElement('canvas') + const _scratchCtx = _scratch.getContext('2d-lodpi') + _scratch.width = data.length + _scratch.height = half_fft_size + // console.log("spectrum w/h:", _scratch.width, _scratch.height) + + var imageData = _scratchCtx.createImageData(_scratch.width, _scratch.height) + var pixels = imageData.data + + let i, j, u, v, _r, _i, col, hsl + // let min_r = Infinity, max_r = -Infinity + // let min_i = Infinity, max_i = -Infinity + + // determined empirically.. + // let min_r = -60.4894057005308 + // let max_r = 107.23800966675353 + // let min_i = -59.4894057005308 + // let max_i = 108.23800966675353 + let min_r = -def_min_r + let max_r = def_min_r + let min_i = -def_min_i + let max_i = def_min_i + let delta_r = max_r - min_r + let delta_i = max_i - min_i + let mean_r = 0 + let mean_i = 0 + let sum_mean_r = 0, sum_mean_i = 0 + let real, imag + + for (i = 0; i < spec_len; i++) { + col = data[i] + mean_r = 0 + mean_i = 0 + + for (j = 0; j < half_fft_size; j++) { + u = (j * spec_len + i) * 4 + v = j * 2 + real = col[v] + imag = col[v+1] + mean_r += real + mean_i += imag + _r = clamp((real - min_r) / delta_r * 255, 0, 255) + _i = clamp((imag - min_i) / delta_i * 255, 0, 255) + + // hsl = color.hsl2rgb((_i + 1) / 2, 1.0, 1 - Math.abs(_r / 10)) + pixels[u+0] = _r + pixels[u+1] = _i + pixels[u+2] = 127 // hsl[2] + pixels[u+3] = 255 + + // min_r = Math.min(min_r, col[v]) + // max_r = Math.max(max_r, col[v]) + // min_i = Math.min(min_i, col[v]+1) + // max_i = Math.max(max_i, col[v]+1) + } + mean_r /= half_fft_size + mean_i /= half_fft_size + sum_mean_r += mean_r + sum_mean_i += mean_i + } + + sum_mean_r /= spec_len + sum_mean_i /= spec_len + // console.log(sum_mean_r, sum_mean_i) + // console.log("r:", min_r, max_r) + // console.log("i:", min_i, max_i) + _scratchCtx.putImageData(imageData, 0, 0) + + return { canvas: _scratch, imageData } +} diff --git a/app/client/audio/lib/index.js b/app/client/audio/lib/index.js new file mode 100644 index 0000000..ba96112 --- /dev/null +++ b/app/client/audio/lib/index.js @@ -0,0 +1,47 @@ +import Tone from 'tone' +import StartAudioContext from './startAudioContext' + +import { is_mobile } from '../util' + +export function requestAudioContext (fn) { + if (is_mobile) { + const container = document.createElement('div') + const button = document.createElement('div') + button.innerHTML = 'Tap to start - please unmute your phone' + Object.assign(container.style, { + display: 'block', + position: 'absolute', + width: '100%', + height: '100%', + zIndex: '10000', + top: '0px', + left: '0px', + backgroundColor: 'rgba(0, 0, 0, 0.8)', + }) + Object.assign(button.style, { + display: 'block', + position: 'absolute', + left: '50%', + top: '50%', + padding: '20px', + backgroundColor: '#7F33ED', + color: 'white', + fontFamily: 'monospace', + borderRadius: '3px', + transform: 'translate3D(-50%,-50%,0)', + textAlign: 'center', + lineHeight: '1.5', + width: '150px', + }) + container.appendChild(button) + document.body.appendChild(container) + StartAudioContext.setContext(Tone.context) + StartAudioContext.on(button) + StartAudioContext.onStarted(_ => { + container.remove() + fn() + }) + } else { + fn() + } +} \ No newline at end of file diff --git a/app/client/audio/lib/output.js b/app/client/audio/lib/output.js new file mode 100644 index 0000000..53901b3 --- /dev/null +++ b/app/client/audio/lib/output.js @@ -0,0 +1,8 @@ +import Tone from 'tone' + +// const compressor = new Tone.Compressor(-30, 3).toMaster() + +const compressor = new Tone.Compressor(-30, 3).toMaster() +const gain = new Tone.Gain(1).connect(compressor) + +export default gain diff --git a/app/client/audio/lib/spectrum.js b/app/client/audio/lib/spectrum.js new file mode 100644 index 0000000..f4a5444 --- /dev/null +++ b/app/client/audio/lib/spectrum.js @@ -0,0 +1,278 @@ +import Tone from 'tone' + +import { shuffle, quantize, mod } from '../util' + +import { windows as signalWindows } from 'signal-windows' +import FFTJS from 'fft.js' + +const fft_size = 512 +const fft_overlap = fft_size / 4 + +const fft = new FFTJS(fft_size) + +function toSpectrum(pcm, sr){ + sr = sr || 44100 + const ham = signalWindows.construct('ham', fft_size) + const pcm_in = new Array(fft_size) + const pcm_length = pcm.length + const pcm_q_length = Math.ceil(pcm_length / fft_size) * fft_size + let i, j, fft_out, data = []; + for (i = -fft_size; i < pcm_q_length; i += fft_overlap) { + for (j = 0; j < fft_size; j++) { + pcm_in[j] = pcm[i+j] * ham[j] || 0 + } + fft_out = fft.createComplexArray() + fft.realTransform(fft_out, pcm_in) + fft.completeSpectrum(fft_out) + data.push(fft_out) + } + return { + data, + sr, + fft_size, + fft_overlap, + } +} + +function fromSpectrum(spec){ + const data = spec.data + const sr = spec.sr + const fft_size = spec.fft_size + const fft_overlap = spec.fft_overlap + const spec_len = data.length + + const ham = signalWindows.construct('ham', fft_size) + const out = fft.createComplexArray() + const pcm_length = fft_overlap * spec_len + + const audioBuffer = Tone.context.createBuffer(1, pcm_length, sr) + const pcm = audioBuffer.getChannelData(0); + + let i, j, u, col + + for (i = 0; i < spec_len; i++) { + col = data[i] + // for (j = fft_size; j < fft_size << 1; j++) { + // col[j] = 0 + // } + // if (i == 0) console.log(col) + fft.inverseTransform(out, col) + u = i * (fft_overlap) + for (j = 0; j < fft_size; j++) { + pcm[u+j] += out[j*2] * ham[j] || 0 + } + } + + fadeInOut(pcm, fft_size) + // console.log(pcm) + return audioBuffer +} + +function fromImageData(imageData, sr, _r, _i) { + const pixels = imageData.data + const w = imageData.width + const h = imageData.height + let data = new Array(w) + let x, y, u, v, v2 + for (y = 0; y < h; y++) { + let col = data[y] = new Float32Array(h * 4) + for (x = 0; x < w; x++) { + u = (x * (w) + y) * 4 + v = x * 2 + col[v] = (pixels[u] / 255 - 0.5) * _r + col[v+1] = (pixels[u+1] / 255 - 0.5) * _i + v2 = (h-y + h) * 2 + col[v2] = col[v] + col[v2+1] = 0 // col[v+1] + } + col[h*2] = col[h*2+1] = col[h*2-1] = col[h*2-2] = 0 + } + const spec = { + data, + sr, + fft_size, fft_overlap + } + return spec +} + +function binToHz(spec, i){ + return (i / spec.fft_size) * spec.sr +} + +function fadeInOut(pcm, fade_size){ + const pcm_length = pcm.length + let fade = 0, i + for (i = 0; i < fade_size; i++) { + fade = i / (fade_size) + fade *= fade + pcm[i] *= fade + pcm[pcm_length - i] *= fade + } +} +function rotatePhase(spec, theta){ + let { data, fft_size } = spec + let i, j, col, len = data.length + for (i = 0; i < len; i++) { + col = data[i] + for (j = 0; j < fft_size; j++) { + col[j*2+1] += theta + } + } + return spec +} + +function linearBins(spec, n){ + n = n || 1 + + let bins = [], i, q_i + for (q_i = 0; q_i < n; q_i++) { + bins[q_i] = [] + } + const step = Math.floor(spec.fft_size / n) + const len_quantize_n = quantize(spec.fft_size, n) + for (i = 0; i < len_quantize_n; i++) { + q_i = Math.floor(i/step) + bins[q_i] = bins[q_i] || [] + bins[q_i].push(i) + } + // leftover bins get put at end + for (; i < spec.fft_size; i++) { + bins[q_i].push(i) + } + return bins +} +function logarithmicBins(spec){ + let bins = [], i, j, q_i + let binCount = Math.log2(spec.fft_size) - 1 + for (i = 0, q_i = 0, j = 0; i < binCount; i++) { + j += 1 << i + bins[i] = [] + for (; q_i < j; q_i++) { + bins[i].push(q_i) + } + } + return bins +} +function concatBins(bins){ + return bins.reduce((acc, cv) => acc.concat(cv), []) +} +function reverseBins(bins){ + return bins.map( bin => bin.reverse() ) +} +function minBins(bins){ + return bins.map( bin => { + const b = bin[0] + return bin.map(() => b) + }) +} +function maxBins(bins){ + return bins.map( bin => { + const b = bin[bin.length-1] + return bin.map(() => b) + }) +} +function rotateSpectrum(spec, n){ + const { fft_size } = spec + if (n && n < 1) { + n -= 0.5 + n *= fft_size + } + n = Math.floor(n) + let order = new Array(fft_size), i + for (i = 0; i < fft_size; i++) { + order[i] = mod(i + n, fft_size/2) + } + return reorderBins(spec, order) +} +function cloneSpectrum(spec){ + const { + data, + fft_size, + sr, fft_overlap + } = spec + const spec_len = data.length + + let new_data = new Array(spec_len) + let i + for (i = 0; i < spec_len; i++) { + new_data[i] = data[i].concat() + new_data[i][2] = 0 + } + + return { + data: new_data, + fft_size, + sr, fft_overlap, + } +} +function reverseSpectrum(spec){ + let new_spec = cloneSpectrum(spec) + new_spec.data = new_spec.data.reverse() + return new_spec +} +function shuffleSpectrum(spec){ + const { fft_size } = spec + let order = new Array(fft_size), i + for (i = 0; i < fft_size; i++) { + order[i] = i + } + shuffle(order) + return reorderBins(spec, order) +} +function invertSpectrum(spec){ + const { fft_size } = spec + let order = new Array(fft_size), i + for (i = 0; i < fft_size; i++) { + order[i] = fft_size - i - 1 + } + return reorderBins(spec, order) +} +function reorderBins(spec, order){ + let new_spec = cloneSpectrum(spec) + const { + data, + sr, + fft_size, + fft_overlap, + } = spec + const spec_len = data.length + const { data: new_data } = new_spec + + let i, j, col, new_col + for (j = order.length; j < fft_size; j++) { + order[j] = j + } + + for (i = 0; i < spec_len; i++) { + col = data[i] + new_col = new_data[i] = data[i].concat() + col[0] = 0 + col[2] = 0 + col[4] = 0 + for (j = 0; j < fft_size/2; j++) { + new_col[j*2] = col[order[j]*2] + new_col[j*2+1] = col[order[j]*2+1] + } + for (; j < fft_size; j++) { + new_col[j*2] = 0 + new_col[j*2+1] = 0 + } + } + + return { + data: new_data, + sr, fft_size, fft_overlap, + } +} + +export default { + toSpectrum, fromSpectrum, fromImageData, binToHz, + fadeInOut, + cloneSpectrum, + reverseSpectrum, shuffleSpectrum, invertSpectrum, rotateSpectrum, + reorderBins, + linearBins, logarithmicBins, + concatBins, + reverseBins, minBins, maxBins, + rotatePhase, +} diff --git a/app/client/audio/lib/startAudioContext.js b/app/client/audio/lib/startAudioContext.js new file mode 100644 index 0000000..0e257be --- /dev/null +++ b/app/client/audio/lib/startAudioContext.js @@ -0,0 +1,179 @@ +/** + * StartAudioContext.js + * @author Yotam Mann + * @license http://opensource.org/licenses/MIT MIT License + * @copyright 2016 Yotam Mann + */ +(function (root, factory) { + if (typeof define === "function" && define.amd) { + define([], factory); + } else if (typeof module === 'object' && module.exports) { + module.exports = factory(); + } else { + root.StartAudioContext = factory(); + } +}(this, function () { + + /** + * The StartAudioContext object + */ + var StartAudioContext = { + /** + * The audio context passed in by the user + * @type {AudioContext} + */ + context : null, + /** + * The TapListeners bound to the elements + * @type {Array} + * @private + */ + _tapListeners : [], + /** + * Callbacks to invoke when the audio context is started + * @type {Array} + * @private + */ + _onStarted : [], + }; + + + /** + * Set the context + * @param {AudioContext} ctx + * @returns {StartAudioContext} + */ + StartAudioContext.setContext = function(ctx){ + StartAudioContext.context = ctx; + return StartAudioContext; + }; + + /** + * Add a tap listener to the audio context + * @param {Array|Element|String|jQuery} element + * @returns {StartAudioContext} + */ + StartAudioContext.on = function(element){ + if (Array.isArray(element) || (NodeList && element instanceof NodeList)){ + for (var i = 0; i < element.length; i++){ + StartAudioContext.on(element[i]); + } + } else if (typeof element === "string"){ + StartAudioContext.on(document.querySelectorAll(element)); + } else if (element.jquery && typeof element.toArray === "function"){ + StartAudioContext.on(element.toArray()); + } else if (Element && element instanceof Element){ + //if it's an element, create a TapListener + var tap = new TapListener(element, onTap); + StartAudioContext._tapListeners.push(tap); + } + return StartAudioContext; + }; + + /** + * Bind a callback to when the audio context is started. + * @param {Function} cb + * @return {StartAudioContext} + */ + StartAudioContext.onStarted = function(cb){ + //if it's already started, invoke the callback + if (StartAudioContext.isStarted()){ + cb(); + } else { + StartAudioContext._onStarted.push(cb); + } + return StartAudioContext; + }; + + /** + * returns true if the context is started + * @return {Boolean} + */ + StartAudioContext.isStarted = function(){ + return (StartAudioContext.context !== null && StartAudioContext.context.state === "running"); + }; + + /** + * @class Listens for non-dragging tap ends on the given element + * @param {Element} element + * @internal + */ + var TapListener = function(element){ + + this._dragged = false; + + this._element = element; + + this._bindedMove = this._moved.bind(this); + this._bindedEnd = this._ended.bind(this); + + element.addEventListener("touchmove", this._bindedMove); + element.addEventListener("touchend", this._bindedEnd); + element.addEventListener("mouseup", this._bindedEnd); + }; + + /** + * drag move event + */ + TapListener.prototype._moved = function(e){ + this._dragged = true; + }; + + /** + * tap ended listener + */ + TapListener.prototype._ended = function(e){ + if (!this._dragged){ + onTap(); + } + this._dragged = false; + }; + + /** + * remove all the bound events + */ + TapListener.prototype.dispose = function(){ + this._element.removeEventListener("touchmove", this._bindedMove); + this._element.removeEventListener("touchend", this._bindedEnd); + this._element.removeEventListener("mouseup", this._bindedEnd); + this._bindedMove = null; + this._bindedEnd = null; + this._element = null; + }; + + /** + * Invoked the first time of the elements is tapped. + * Creates a silent oscillator when a non-dragging touchend + * event has been triggered. + */ + function onTap(){ + //start the audio context with a silent oscillator + if (StartAudioContext.context && !StartAudioContext.isStarted()){ + var osc = StartAudioContext.context.createOscillator(); + var silent = StartAudioContext.context.createGain(); + silent.gain.value = 0; + osc.connect(silent); + silent.connect(StartAudioContext.context.destination); + var now = StartAudioContext.context.currentTime; + osc.start(now); + osc.stop(now+0.5); + } + + //dispose all the tap listeners + if (StartAudioContext._tapListeners){ + for (var i = 0; i < StartAudioContext._tapListeners.length; i++){ + StartAudioContext._tapListeners[i].dispose(); + } + StartAudioContext._tapListeners = null; + } + //the onstarted callbacks + if (StartAudioContext._onStarted){ + for (var j = 0; j < StartAudioContext._onStarted.length; j++){ + StartAudioContext._onStarted[j](); + } + StartAudioContext._onStarted = null; + } + } + + return StartAudioContext; +})); diff --git a/app/client/audio/output.js b/app/client/audio/output.js deleted file mode 100644 index 53901b3..0000000 --- a/app/client/audio/output.js +++ /dev/null @@ -1,8 +0,0 @@ -import Tone from 'tone' - -// const compressor = new Tone.Compressor(-30, 3).toMaster() - -const compressor = new Tone.Compressor(-30, 3).toMaster() -const gain = new Tone.Gain(1).connect(compressor) - -export default gain diff --git a/app/client/audio/pix2wav.js b/app/client/audio/pix2wav.js new file mode 100644 index 0000000..ccd36be --- /dev/null +++ b/app/client/audio/pix2wav.js @@ -0,0 +1,35 @@ +function render(pcm, count, zip){ + const fft = spectrum.toSpectrum(pcm, sr) + // console.log('render', fft) + // const pcm_rev = pcm.slice().reverse() + // const spec_rev = spectrum.toSpectrum(pcm_rev, spec.sr) + draw.clear() + const { canvas, imageData } = draw.raw_spectrum(fft, 0, 256, 0, 256, _r, _i) + const dataURL = canvas.toDataURL("image/png") + if (zip) { + const fn = sprintf('frame_%05d.png', count) + zip.file(fn, dataURL.split(',')[1], {base64: true}) + } + return { fft, canvas, imageData } +} +function play(i) { + // console.log('play', i) + last_i = i + let player = players[clamp(i, 0, players.length)] + // const { canvas, imageData } = draw.raw_spectrum(fft, 0, 256, 0, 256, 1, 1) + // console.log(_r, _i) + // const { canvas, imageData } = draw.raw_spectrum(player.fft, 0, 256, 0, 256, _r, _i) + const new_fft = spectrum.fromImageData(player.imageData, 44100, _r, _i) + // gallery.innerHTML = '' + + // console.log(player.fft.data, new_fft.data) + const buf = spectrum.fromSpectrum(new_fft) + const _p = new Tone.Player(buf) + _p.connect(output) + _p.start(Tone.now()) + redraw(new_fft) +} +function redraw(new_fft){ + const { canvas, imageData } = draw.raw_spectrum(new_fft, 0, 256, 0, 256, _r, _i) +} + diff --git a/app/client/audio/spectrum.js b/app/client/audio/spectrum.js deleted file mode 100644 index f4a5444..0000000 --- a/app/client/audio/spectrum.js +++ /dev/null @@ -1,278 +0,0 @@ -import Tone from 'tone' - -import { shuffle, quantize, mod } from '../util' - -import { windows as signalWindows } from 'signal-windows' -import FFTJS from 'fft.js' - -const fft_size = 512 -const fft_overlap = fft_size / 4 - -const fft = new FFTJS(fft_size) - -function toSpectrum(pcm, sr){ - sr = sr || 44100 - const ham = signalWindows.construct('ham', fft_size) - const pcm_in = new Array(fft_size) - const pcm_length = pcm.length - const pcm_q_length = Math.ceil(pcm_length / fft_size) * fft_size - let i, j, fft_out, data = []; - for (i = -fft_size; i < pcm_q_length; i += fft_overlap) { - for (j = 0; j < fft_size; j++) { - pcm_in[j] = pcm[i+j] * ham[j] || 0 - } - fft_out = fft.createComplexArray() - fft.realTransform(fft_out, pcm_in) - fft.completeSpectrum(fft_out) - data.push(fft_out) - } - return { - data, - sr, - fft_size, - fft_overlap, - } -} - -function fromSpectrum(spec){ - const data = spec.data - const sr = spec.sr - const fft_size = spec.fft_size - const fft_overlap = spec.fft_overlap - const spec_len = data.length - - const ham = signalWindows.construct('ham', fft_size) - const out = fft.createComplexArray() - const pcm_length = fft_overlap * spec_len - - const audioBuffer = Tone.context.createBuffer(1, pcm_length, sr) - const pcm = audioBuffer.getChannelData(0); - - let i, j, u, col - - for (i = 0; i < spec_len; i++) { - col = data[i] - // for (j = fft_size; j < fft_size << 1; j++) { - // col[j] = 0 - // } - // if (i == 0) console.log(col) - fft.inverseTransform(out, col) - u = i * (fft_overlap) - for (j = 0; j < fft_size; j++) { - pcm[u+j] += out[j*2] * ham[j] || 0 - } - } - - fadeInOut(pcm, fft_size) - // console.log(pcm) - return audioBuffer -} - -function fromImageData(imageData, sr, _r, _i) { - const pixels = imageData.data - const w = imageData.width - const h = imageData.height - let data = new Array(w) - let x, y, u, v, v2 - for (y = 0; y < h; y++) { - let col = data[y] = new Float32Array(h * 4) - for (x = 0; x < w; x++) { - u = (x * (w) + y) * 4 - v = x * 2 - col[v] = (pixels[u] / 255 - 0.5) * _r - col[v+1] = (pixels[u+1] / 255 - 0.5) * _i - v2 = (h-y + h) * 2 - col[v2] = col[v] - col[v2+1] = 0 // col[v+1] - } - col[h*2] = col[h*2+1] = col[h*2-1] = col[h*2-2] = 0 - } - const spec = { - data, - sr, - fft_size, fft_overlap - } - return spec -} - -function binToHz(spec, i){ - return (i / spec.fft_size) * spec.sr -} - -function fadeInOut(pcm, fade_size){ - const pcm_length = pcm.length - let fade = 0, i - for (i = 0; i < fade_size; i++) { - fade = i / (fade_size) - fade *= fade - pcm[i] *= fade - pcm[pcm_length - i] *= fade - } -} -function rotatePhase(spec, theta){ - let { data, fft_size } = spec - let i, j, col, len = data.length - for (i = 0; i < len; i++) { - col = data[i] - for (j = 0; j < fft_size; j++) { - col[j*2+1] += theta - } - } - return spec -} - -function linearBins(spec, n){ - n = n || 1 - - let bins = [], i, q_i - for (q_i = 0; q_i < n; q_i++) { - bins[q_i] = [] - } - const step = Math.floor(spec.fft_size / n) - const len_quantize_n = quantize(spec.fft_size, n) - for (i = 0; i < len_quantize_n; i++) { - q_i = Math.floor(i/step) - bins[q_i] = bins[q_i] || [] - bins[q_i].push(i) - } - // leftover bins get put at end - for (; i < spec.fft_size; i++) { - bins[q_i].push(i) - } - return bins -} -function logarithmicBins(spec){ - let bins = [], i, j, q_i - let binCount = Math.log2(spec.fft_size) - 1 - for (i = 0, q_i = 0, j = 0; i < binCount; i++) { - j += 1 << i - bins[i] = [] - for (; q_i < j; q_i++) { - bins[i].push(q_i) - } - } - return bins -} -function concatBins(bins){ - return bins.reduce((acc, cv) => acc.concat(cv), []) -} -function reverseBins(bins){ - return bins.map( bin => bin.reverse() ) -} -function minBins(bins){ - return bins.map( bin => { - const b = bin[0] - return bin.map(() => b) - }) -} -function maxBins(bins){ - return bins.map( bin => { - const b = bin[bin.length-1] - return bin.map(() => b) - }) -} -function rotateSpectrum(spec, n){ - const { fft_size } = spec - if (n && n < 1) { - n -= 0.5 - n *= fft_size - } - n = Math.floor(n) - let order = new Array(fft_size), i - for (i = 0; i < fft_size; i++) { - order[i] = mod(i + n, fft_size/2) - } - return reorderBins(spec, order) -} -function cloneSpectrum(spec){ - const { - data, - fft_size, - sr, fft_overlap - } = spec - const spec_len = data.length - - let new_data = new Array(spec_len) - let i - for (i = 0; i < spec_len; i++) { - new_data[i] = data[i].concat() - new_data[i][2] = 0 - } - - return { - data: new_data, - fft_size, - sr, fft_overlap, - } -} -function reverseSpectrum(spec){ - let new_spec = cloneSpectrum(spec) - new_spec.data = new_spec.data.reverse() - return new_spec -} -function shuffleSpectrum(spec){ - const { fft_size } = spec - let order = new Array(fft_size), i - for (i = 0; i < fft_size; i++) { - order[i] = i - } - shuffle(order) - return reorderBins(spec, order) -} -function invertSpectrum(spec){ - const { fft_size } = spec - let order = new Array(fft_size), i - for (i = 0; i < fft_size; i++) { - order[i] = fft_size - i - 1 - } - return reorderBins(spec, order) -} -function reorderBins(spec, order){ - let new_spec = cloneSpectrum(spec) - const { - data, - sr, - fft_size, - fft_overlap, - } = spec - const spec_len = data.length - const { data: new_data } = new_spec - - let i, j, col, new_col - for (j = order.length; j < fft_size; j++) { - order[j] = j - } - - for (i = 0; i < spec_len; i++) { - col = data[i] - new_col = new_data[i] = data[i].concat() - col[0] = 0 - col[2] = 0 - col[4] = 0 - for (j = 0; j < fft_size/2; j++) { - new_col[j*2] = col[order[j]*2] - new_col[j*2+1] = col[order[j]*2+1] - } - for (; j < fft_size; j++) { - new_col[j*2] = 0 - new_col[j*2+1] = 0 - } - } - - return { - data: new_data, - sr, fft_size, fft_overlap, - } -} - -export default { - toSpectrum, fromSpectrum, fromImageData, binToHz, - fadeInOut, - cloneSpectrum, - reverseSpectrum, shuffleSpectrum, invertSpectrum, rotateSpectrum, - reorderBins, - linearBins, logarithmicBins, - concatBins, - reverseBins, minBins, maxBins, - rotatePhase, -} diff --git a/app/client/audio/startAudioContext.js b/app/client/audio/startAudioContext.js deleted file mode 100644 index 0e257be..0000000 --- a/app/client/audio/startAudioContext.js +++ /dev/null @@ -1,179 +0,0 @@ -/** - * StartAudioContext.js - * @author Yotam Mann - * @license http://opensource.org/licenses/MIT MIT License - * @copyright 2016 Yotam Mann - */ -(function (root, factory) { - if (typeof define === "function" && define.amd) { - define([], factory); - } else if (typeof module === 'object' && module.exports) { - module.exports = factory(); - } else { - root.StartAudioContext = factory(); - } -}(this, function () { - - /** - * The StartAudioContext object - */ - var StartAudioContext = { - /** - * The audio context passed in by the user - * @type {AudioContext} - */ - context : null, - /** - * The TapListeners bound to the elements - * @type {Array} - * @private - */ - _tapListeners : [], - /** - * Callbacks to invoke when the audio context is started - * @type {Array} - * @private - */ - _onStarted : [], - }; - - - /** - * Set the context - * @param {AudioContext} ctx - * @returns {StartAudioContext} - */ - StartAudioContext.setContext = function(ctx){ - StartAudioContext.context = ctx; - return StartAudioContext; - }; - - /** - * Add a tap listener to the audio context - * @param {Array|Element|String|jQuery} element - * @returns {StartAudioContext} - */ - StartAudioContext.on = function(element){ - if (Array.isArray(element) || (NodeList && element instanceof NodeList)){ - for (var i = 0; i < element.length; i++){ - StartAudioContext.on(element[i]); - } - } else if (typeof element === "string"){ - StartAudioContext.on(document.querySelectorAll(element)); - } else if (element.jquery && typeof element.toArray === "function"){ - StartAudioContext.on(element.toArray()); - } else if (Element && element instanceof Element){ - //if it's an element, create a TapListener - var tap = new TapListener(element, onTap); - StartAudioContext._tapListeners.push(tap); - } - return StartAudioContext; - }; - - /** - * Bind a callback to when the audio context is started. - * @param {Function} cb - * @return {StartAudioContext} - */ - StartAudioContext.onStarted = function(cb){ - //if it's already started, invoke the callback - if (StartAudioContext.isStarted()){ - cb(); - } else { - StartAudioContext._onStarted.push(cb); - } - return StartAudioContext; - }; - - /** - * returns true if the context is started - * @return {Boolean} - */ - StartAudioContext.isStarted = function(){ - return (StartAudioContext.context !== null && StartAudioContext.context.state === "running"); - }; - - /** - * @class Listens for non-dragging tap ends on the given element - * @param {Element} element - * @internal - */ - var TapListener = function(element){ - - this._dragged = false; - - this._element = element; - - this._bindedMove = this._moved.bind(this); - this._bindedEnd = this._ended.bind(this); - - element.addEventListener("touchmove", this._bindedMove); - element.addEventListener("touchend", this._bindedEnd); - element.addEventListener("mouseup", this._bindedEnd); - }; - - /** - * drag move event - */ - TapListener.prototype._moved = function(e){ - this._dragged = true; - }; - - /** - * tap ended listener - */ - TapListener.prototype._ended = function(e){ - if (!this._dragged){ - onTap(); - } - this._dragged = false; - }; - - /** - * remove all the bound events - */ - TapListener.prototype.dispose = function(){ - this._element.removeEventListener("touchmove", this._bindedMove); - this._element.removeEventListener("touchend", this._bindedEnd); - this._element.removeEventListener("mouseup", this._bindedEnd); - this._bindedMove = null; - this._bindedEnd = null; - this._element = null; - }; - - /** - * Invoked the first time of the elements is tapped. - * Creates a silent oscillator when a non-dragging touchend - * event has been triggered. - */ - function onTap(){ - //start the audio context with a silent oscillator - if (StartAudioContext.context && !StartAudioContext.isStarted()){ - var osc = StartAudioContext.context.createOscillator(); - var silent = StartAudioContext.context.createGain(); - silent.gain.value = 0; - osc.connect(silent); - silent.connect(StartAudioContext.context.destination); - var now = StartAudioContext.context.currentTime; - osc.start(now); - osc.stop(now+0.5); - } - - //dispose all the tap listeners - if (StartAudioContext._tapListeners){ - for (var i = 0; i < StartAudioContext._tapListeners.length; i++){ - StartAudioContext._tapListeners[i].dispose(); - } - StartAudioContext._tapListeners = null; - } - //the onstarted callbacks - if (StartAudioContext._onStarted){ - for (var j = 0; j < StartAudioContext._onStarted.length; j++){ - StartAudioContext._onStarted[j](); - } - StartAudioContext._onStarted = null; - } - } - - return StartAudioContext; -})); diff --git a/app/client/audio/ui.js b/app/client/audio/ui.js new file mode 100644 index 0000000..76ffb09 --- /dev/null +++ b/app/client/audio/ui.js @@ -0,0 +1,12 @@ +/* + +mouse.register({ + move: (x, y) => { + } +}) +keys.listen((z) => { + // console.log(z) + play(mod(z, players.length)) +}) + +*/ diff --git a/app/client/audio/wav2pix.js b/app/client/audio/wav2pix.js index 3e86c40..089816d 100644 --- a/app/client/audio/wav2pix.js +++ b/app/client/audio/wav2pix.js @@ -1,153 +1,78 @@ import Tone from 'tone' import JSZip from 'jszip' -import { sprintf } from 'sprintf-js' import FileSaver from 'file-saver' -import draw from './draw' -import keys from './lib/keys' -import mouse from './lib/mouse' +import draw from './lib/draw' import output from './lib/output' import spectrum from './lib/spectrum' import { - requestAudioContext, lerp, clamp, mod, -} from './lib/util' +} from '../util' + +import { requestAudioContext } from './lib' -let selfDrag = false let buffer -let players = [] -let gallery let sr = 44100 let last_i = 0 let _r = 8, _i = 8 -function init(){ - requestAudioContext(ready) - document.body.addEventListener('dragover', dragover) - document.body.addEventListener('dragstart', dragstart) - document.body.addEventListener('drop', drop) - document.querySelector("#upload").addEventListener('change', handleFileSelect) - // draw.onFrame(() => {}) - draw.resize(256, 256) - gallery = document.querySelector('#gallery') - mouse.register({ - move: (x, y) => { - } - }) - keys.listen((z) => { - // console.log(z) - play(mod(z, players.length)) - }) -} -function ready(){ -} -function dragover (e) { - e.preventDefault() -} -function dragstart (e) { - selfDrag = true -} -function drop (e) { - e.stopPropagation() - e.preventDefault() +let files, file_index = 0; - if (e.dataTransfer && ! selfDrag) { - if (e.dataTransfer.files.length) { - handleFileSelect(e) - } - } - else { - handleFileSelect(e) - } - selfDrag = false +const FRAME_LENGTH = 126 * 255 +const FRAME_OFFSET = FRAME_LENGTH / 4 + +function init() { + requestAudioContext(ready) + draw.resize(256, 256) } -let files, file_index = 0; -function handleFileSelect(e){ +function handleFileSelect(e) { files = e.dataTransfer ? e.dataTransfer.files : e.target.files loadNext() } -function loadNext(){ +function loadNext() { var file = files[file_index++] if (! file) return load(file) } -function load(file){ - players = [] - buffer = new Tone.Buffer(URL.createObjectURL(file), loadBuffer, (err) => console.error('err', err)) +function load(file) { + buffer = new Tone.Buffer( + URL.createObjectURL(file), + loadBuffer, + (err) => console.error('err', err) + ) } -function loadBuffer(){ +function loadBuffer() { + // dispatch console.log('loaded buffer', buffer) const pcm = buffer._buffer.getChannelData(0) - sr = buffer._buffer.sampleRate + const sr = buffer._buffer.sampleRate if (! pcm) return - const FRAME_LENGTH = 126 * 255 - const FRAME_OFFSET = FRAME_LENGTH / 4 + const zip = new JSZip() + const zip_folder = zip.folder("wav2pix_" + name); - var zip = new JSZip() - - var zip_folder = zip.folder("images"); - - for (var offset = 0, count = 0, _len = pcm.length - FRAME_LENGTH; offset < _len; offset += FRAME_OFFSET, count += 1) { - if ((count % 100) === 0) console.log(count) - // console.log('generating', count, offset) - // let player = render(pcm.slice(offset, offset+FRAME_LENGTH), count, zip_folder) + const offset = 0 + for (offset = 0, count = 0, _len = pcm.length - FRAME_LENGTH; + offset < _len; + offset += FRAME_OFFSET, count += 1 + ) { + if ((count % 100) === 0) { + // dispatch event instead.. + console.log(count) + } render(pcm.slice(offset, offset+FRAME_LENGTH), count, zip_folder) - // register(player, count) - // if (count > 20) break } + // dispatch event console.log('done exporting') - zip.generateAsync({type:"blob"}).then(function(content) { + zip.generateAsync({ type: "blob" }).then(content => { + // dispatch console.log('saving zip') - FileSaver.saveAs(content, "img2pix.zip") + // FileSaver.saveAs(content, "wav2pix_" + name + ".zip") setTimeout(loadNext, 1000) }) // play(0) } -function render(pcm, count, zip){ - const fft = spectrum.toSpectrum(pcm, sr) - // console.log('render', fft) - // const pcm_rev = pcm.slice().reverse() - // const spec_rev = spectrum.toSpectrum(pcm_rev, spec.sr) - draw.clear() - const { canvas, imageData } = draw.raw_spectrum(fft, 0, 256, 0, 256, _r, _i) - const dataURL = canvas.toDataURL("image/png") - if (zip) { - const fn = sprintf('frame_%05d.png', count) - zip.file(fn, dataURL.split(',')[1], {base64: true}) - } - return { fft, canvas, imageData } -} -function play(i) { - // console.log('play', i) - last_i = i - let player = players[clamp(i, 0, players.length)] - // const { canvas, imageData } = draw.raw_spectrum(fft, 0, 256, 0, 256, 1, 1) - // console.log(_r, _i) - // const { canvas, imageData } = draw.raw_spectrum(player.fft, 0, 256, 0, 256, _r, _i) - const new_fft = spectrum.fromImageData(player.imageData, 44100, _r, _i) - // gallery.innerHTML = '' - // console.log(player.fft.data, new_fft.data) - const buf = spectrum.fromSpectrum(new_fft) - const _p = new Tone.Player(buf) - _p.connect(output) - _p.start(Tone.now()) - redraw(new_fft) -} -function redraw(new_fft){ - const { canvas, imageData } = draw.raw_spectrum(new_fft, 0, 256, 0, 256, _r, _i) -} -function register(player, i){ - // console.log('register', player) - players.push(player) - player.canvas.addEventListener('click', () => { - play(i) - }) - if (i < 20) { - gallery.appendChild(player.canvas) - } -} init() diff --git a/app/client/common/fileList.component.js b/app/client/common/fileList.component.js index b70ce55..70ee5b6 100644 --- a/app/client/common/fileList.component.js +++ b/app/client/common/fileList.component.js @@ -3,7 +3,7 @@ import { bindActionCreators } from 'redux' import { connect } from 'react-redux' import { Link } from 'react-router-dom'; import moment from 'moment' -import * as util from '../util' +import util from '../util' const defaultFields = new Set(['name', 'date', 'size']) diff --git a/app/client/dashboard/dashboardHeader.component.js b/app/client/dashboard/dashboardHeader.component.js index 62586b8..d27a324 100644 --- a/app/client/dashboard/dashboardHeader.component.js +++ b/app/client/dashboard/dashboardHeader.component.js @@ -2,7 +2,7 @@ import { h, Component } from 'preact' import { connect } from 'react-redux' import { bindActionCreators } from 'redux' -import * as util from '../util' +import util from '../util' class DashboardHeader extends Component { constructor(props){ diff --git a/app/client/dashboard/tasklist.component.js b/app/client/dashboard/tasklist.component.js index b43481f..56bb50b 100644 --- a/app/client/dashboard/tasklist.component.js +++ b/app/client/dashboard/tasklist.component.js @@ -1,7 +1,7 @@ import { h, Component } from 'preact' import { bindActionCreators } from 'redux' import { connect } from 'react-redux' -import * as util from '../util' +import util from '../util' import actions from '../actions' diff --git a/app/client/dataset/dataset.component.js b/app/client/dataset/dataset.component.js index 14ad852..af734ad 100644 --- a/app/client/dataset/dataset.component.js +++ b/app/client/dataset/dataset.component.js @@ -1,7 +1,7 @@ import { h, Component } from 'preact' import { bindActionCreators } from 'redux' import { connect } from 'react-redux' -import * as util from '../util' +import util from '../util' import actions from '../actions' diff --git a/app/client/index.jsx b/app/client/index.jsx index 51e92df..8a13687 100644 --- a/app/client/index.jsx +++ b/app/client/index.jsx @@ -5,7 +5,7 @@ import { BrowserRouter, Route } from 'react-router-dom' import { store, history } from './store' import * as socket from './socket' -import * as util from './util' +import util from './util' import Header from './common/header.component' import AudioPlayer from './common/audioPlayer/audioPlayer.component' diff --git a/app/client/modules/pix2pix/index.js b/app/client/modules/pix2pix/index.js index ffe5f6b..9e3d466 100644 --- a/app/client/modules/pix2pix/index.js +++ b/app/client/modules/pix2pix/index.js @@ -1,11 +1,14 @@ import { h, Component } from 'preact' import { Route, Link } from 'react-router-dom' +import util from '../../util' + import Pix2PixNew from './views/pix2pix.new' import Pix2PixShow from './views/pix2pix.show' import Pix2PixLive from './views/pix2pix.live' function router () { + document.body.style.backgroundImage = 'linear-gradient(' + (util.randint(40)+40) + 'deg, #fde, #ffe)' return (
diff --git a/app/client/modules/pix2pix/pix2pix.actions.js b/app/client/modules/pix2pix/pix2pix.actions.js index 82311ad..8633c0a 100644 --- a/app/client/modules/pix2pix/pix2pix.actions.js +++ b/app/client/modules/pix2pix/pix2pix.actions.js @@ -7,13 +7,13 @@ import * as datasetLoader from '../../dataset/dataset.loader' import actions from '../../actions' -import { allProgress } from '../../util' +import util from '../../util' import pix2pixModule from './pix2pix.module' export const load_directories = (id) => (dispatch) => { const module = pix2pixModule.name - allProgress([ + util.allProgress([ datasetLoader.load(module), // actions.socket.list_directory({ module, dir: 'datasets' }), // actions.socket.list_directory({ module, dir: 'results' }), diff --git a/app/client/modules/pix2pix/views/pix2pix.new.js b/app/client/modules/pix2pix/views/pix2pix.new.js index 173777c..203a606 100644 --- a/app/client/modules/pix2pix/views/pix2pix.new.js +++ b/app/client/modules/pix2pix/views/pix2pix.new.js @@ -1,7 +1,4 @@ import { h, Component } from 'preact' -import { bindActionCreators } from 'redux' -import { connect } from 'react-redux' -import * as util from '../../../util' import NewDatasetForm from '../../../dataset/dataset.new' diff --git a/app/client/modules/pix2pix/views/pix2pix.show.js b/app/client/modules/pix2pix/views/pix2pix.show.js index ef4b906..2139c6c 100644 --- a/app/client/modules/pix2pix/views/pix2pix.show.js +++ b/app/client/modules/pix2pix/views/pix2pix.show.js @@ -1,7 +1,7 @@ import { h, Component } from 'preact' import { bindActionCreators } from 'redux' import { connect } from 'react-redux' -import * as util from '../../../util' +import util from '../../../util' import * as pix2pixActions from '../pix2pix.actions' import * as pix2pixTasks from '../pix2pix.tasks' diff --git a/app/client/modules/pix2wav/index.js b/app/client/modules/pix2wav/index.js index 602d54e..9071d04 100644 --- a/app/client/modules/pix2wav/index.js +++ b/app/client/modules/pix2wav/index.js @@ -1,10 +1,18 @@ import { h, Component } from 'preact' import { Route, Link } from 'react-router-dom' +import util from '../../util' + +import Pix2WavNew from './views/pix2wav.new' +import Pix2WavShow from './views/pix2wav.show' +// import Pix2WavLive from './views/pix2wav.live' function router () { - // + document.body.style.backgroundImage = 'linear-gradient(' + (util.randint(40)+40) + 'deg, #fde, #ffe)' return (
+ + +
) } @@ -13,12 +21,11 @@ function links(){ return ( datasets - live ) } export default { - name: 'pix2pix', + name: 'pix2wav', router, links, } diff --git a/app/client/modules/pix2wav/pix2wav.actions.js b/app/client/modules/pix2wav/pix2wav.actions.js new file mode 100644 index 0000000..08f1a97 --- /dev/null +++ b/app/client/modules/pix2wav/pix2wav.actions.js @@ -0,0 +1,57 @@ +import uuidv1 from 'uuid/v1' + +import socket from '../../socket' +import types from '../../types' + +import * as datasetLoader from '../../dataset/dataset.loader' + +import actions from '../../actions' + +import util from '../../util' + +import pix2wavModule from './pix2wav.module' + +export const load_directories = (id) => (dispatch) => { + const module = pix2wavModule.name + util.allProgress([ + datasetLoader.load(module), + // actions.socket.list_directory({ module, dir: 'datasets' }), + // actions.socket.list_directory({ module, dir: 'results' }), + // actions.socket.list_directory({ module, dir: 'output' }), + // actions.socket.disk_usage({ module, dir: 'datasets' }), + ], (percent, i, n) => { + dispatch({ type: types.app.load_progress, progress: { i, n }}) + }).then(res => { + const [datasetApiReport] = res //, datasets, results, output, datasetUsage, lossReport] = res + const { + folderLookup, + fileLookup, + datasetLookup, + folders, + files, + unsortedFolder, + } = datasetApiReport + dispatch({ + type: types.dataset.load, + data: { + module, + folderLookup, + fileLookup, + datasetLookup, + folders, files, + }, + }) + if (id) { + console.log('folder id', id) + dispatch({ + type: types.dataset.set_folder, + data: { + folder_id: id, + module + }, + }) + } + }).catch(e => { + console.error(e) + }) +} diff --git a/app/client/modules/pix2wav/pix2wav.tasks.js b/app/client/modules/pix2wav/pix2wav.tasks.js new file mode 100644 index 0000000..646e28c --- /dev/null +++ b/app/client/modules/pix2wav/pix2wav.tasks.js @@ -0,0 +1,7 @@ +import uuidv1 from 'uuid/v1' + +import socket from '../../socket' +import types from '../../types' + +import actions from '../../actions' + diff --git a/app/client/modules/pix2wav/views/pix2wav.new.js b/app/client/modules/pix2wav/views/pix2wav.new.js new file mode 100644 index 0000000..aff00aa --- /dev/null +++ b/app/client/modules/pix2wav/views/pix2wav.new.js @@ -0,0 +1,13 @@ +import { h, Component } from 'preact' + +import NewDatasetForm from '../../../dataset/dataset.new' + +import pix2wavModule from '../pix2wav.module' + +export default function Pix2WavNew ({ history }) { + return ( +
+ +
+ ) +} diff --git a/app/client/modules/pix2wav/views/pix2wav.show.js b/app/client/modules/pix2wav/views/pix2wav.show.js new file mode 100644 index 0000000..46a2436 --- /dev/null +++ b/app/client/modules/pix2wav/views/pix2wav.show.js @@ -0,0 +1,116 @@ +import { h, Component } from 'preact' +import { bindActionCreators } from 'redux' +import { connect } from 'react-redux' +import util from '../../../util' + +import * as pix2wavActions from '../pix2wav.actions' +import * as pix2wavTasks from '../pix2wav.tasks' + +import Loading from '../../../common/loading.component' +import DatasetForm from '../../../dataset/dataset.form' +import NewDatasetForm from '../../../dataset/dataset.new' +import UploadStatus from '../../../dataset/upload.status' +import { FileList, FileRow } from '../../../common/fileList.component' + +import DatasetComponent from '../../../dataset/dataset.component' + +import pix2wavModule from '../pix2wav.module' + +class Pix2wavShow extends Component { + constructor(props){ + super(props) + this.datasetActions = this.datasetActions.bind(this) + } + componentWillMount(){ + const id = this.props.match.params.id || localStorage.getItem('pix2wav.last_id') + console.log('load dataset:', id) + const { match, pix2wav, actions } = this.props + if (id === 'new') return + if (id) { + if (parseInt(id)) localStorage.setItem('pix2wav.last_id', id) + if (! pix2wav.folder || pix2wav.folder.id !== id) { + actions.load_directories(id) + } + } + } + render(){ + const { pix2wav, match, history } = this.props + const { folderLookup } = (pix2wav.data || {}) + const folder = (folderLookup || {})[pix2wav.folder_id] || {} + + return ( +
+
+
+

{folder ? folder.name : }

+ +
+
+ {folder && folder.name && folder.name !== 'unsorted' && + + } + { + e.preventDefault() + e.stopPropagation() + console.log('picked a file', file) + }} + datasetActions={this.datasetActions} + /> +
+ ) + } + datasetActions(dataset, isFetching=false, isProcessing=false){ + const { pix2wav, remote } = this.props + const input = pix2wav.data.fileLookup[dataset.input[0]] + if (! input) return null + if (input.name && input.name.match(/(gif|jpe?g|png)$/i)) return null + return ( +
+
+ remote.train_task(dataset, pix2wav.folder_id, 1)}>train + remote.train_task(dataset, pix2wav.folder_id, 2)}>2x + remote.train_task(dataset, pix2wav.folder_id, 4)}>4x + remote.train_task(dataset, pix2wav.folder_id, 6)}>6x + remote.train_task(dataset, pix2wav.folder_id, 18)}>18x +
+ {dataset.isBuilt + ?
+ {'fetched '} + remote.clear_cache_task(dataset)}>rm +
+ : isFetching + ?
+ {'fetching'} +
+ :
+ remote.fetch_task(input.url, input.id, dataset.name)}>fetch +
+ } +
+ ) + } +} + +const mapStateToProps = state => ({ + pix2wav: state.module.pix2wav, +}) + +const mapDispatchToProps = (dispatch, ownProps) => ({ + actions: bindActionCreators(pix2wavActions, dispatch), + remote: bindActionCreators(pix2wavTasks, dispatch), +}) + +export default connect(mapStateToProps, mapDispatchToProps)(Pix2wavShow) diff --git a/app/client/modules/samplernn/index.js b/app/client/modules/samplernn/index.js index 7d5e36e..485a9a4 100644 --- a/app/client/modules/samplernn/index.js +++ b/app/client/modules/samplernn/index.js @@ -1,5 +1,6 @@ import { h, Component } from 'preact' import { Route, Link } from 'react-router-dom' +import util from '../../util' import SampleRNNNew from './views/samplernn.new' import SampleRNNShow from './views/samplernn.show' @@ -8,6 +9,7 @@ import SampleRNNResults from './views/samplernn.results' import SampleRNNGraph from './views/samplernn.graph' function router () { + document.body.style.backgroundImage = 'linear-gradient(' + (util.randint(40)+40) + 'deg, #eef, #fef)' return (
diff --git a/app/client/modules/samplernn/samplernn.actions.js b/app/client/modules/samplernn/samplernn.actions.js index d0fda31..a957e25 100644 --- a/app/client/modules/samplernn/samplernn.actions.js +++ b/app/client/modules/samplernn/samplernn.actions.js @@ -7,13 +7,13 @@ import * as datasetLoader from '../../dataset/dataset.loader' import actions from '../../actions' -import { allProgress } from '../../util' +import util from '../../util' import samplernnModule from './samplernn.module' export const load_directories = (id) => (dispatch) => { const module = samplernnModule.name - allProgress([ + util.allProgress([ datasetLoader.load(module), actions.socket.list_directory({ module, dir: 'datasets' }), actions.socket.list_directory({ module, dir: 'results' }), diff --git a/app/client/modules/samplernn/views/samplernn.graph.js b/app/client/modules/samplernn/views/samplernn.graph.js index 821f1cb..9685802 100644 --- a/app/client/modules/samplernn/views/samplernn.graph.js +++ b/app/client/modules/samplernn/views/samplernn.graph.js @@ -2,7 +2,9 @@ import { h, Component } from 'preact' import { bindActionCreators } from 'redux' import { connect } from 'react-redux' -import { lerp, norm, randint, randrange } from '../../../util' +import util from '../../../util' + +const { lerp, norm, randint, randrange } = util import * as samplernnActions from '../samplernn.actions' @@ -38,7 +40,7 @@ class SampleRNNGraph extends Component { canvas.style.width = canvas.width + 'px' canvas.style.height = canvas.height + 'px' - const ctx = canvas.getContext('2d') + const ctx = canvas.getContext('2d-lodpi') const w = canvas.width = canvas.width * devicePixelRatio const h = canvas.height = canvas.height * devicePixelRatio ctx.clearRect(0,0,w,h) diff --git a/app/client/modules/samplernn/views/samplernn.import.js b/app/client/modules/samplernn/views/samplernn.import.js index cce4aea..61df4da 100644 --- a/app/client/modules/samplernn/views/samplernn.import.js +++ b/app/client/modules/samplernn/views/samplernn.import.js @@ -1,7 +1,7 @@ import { h, Component } from 'preact' import { bindActionCreators } from 'redux' import { connect } from 'react-redux' -import * as util from '../../../util' +import util from '../../../util' import * as samplernnActions from '../samplernn.actions' diff --git a/app/client/modules/samplernn/views/samplernn.new.js b/app/client/modules/samplernn/views/samplernn.new.js index 5f657c0..5640afc 100644 --- a/app/client/modules/samplernn/views/samplernn.new.js +++ b/app/client/modules/samplernn/views/samplernn.new.js @@ -1,7 +1,7 @@ import { h, Component } from 'preact' import { bindActionCreators } from 'redux' import { connect } from 'react-redux' -import * as util from '../../../util' +import util from '../../../util' import NewDatasetForm from '../../../dataset/dataset.new' diff --git a/app/client/modules/samplernn/views/samplernn.results.js b/app/client/modules/samplernn/views/samplernn.results.js index 12367a3..3d448fc 100644 --- a/app/client/modules/samplernn/views/samplernn.results.js +++ b/app/client/modules/samplernn/views/samplernn.results.js @@ -2,8 +2,8 @@ import { h, Component } from 'preact' import { bindActionCreators } from 'redux' import { Link } from 'react-router-dom'; import { connect } from 'react-redux' +import util from '../../../util' -import * as util from '../../../util' import * as samplernnActions from '../samplernn.actions' import * as audioPlayerActions from '../../../common/audioPlayer/audioPlayer.actions' diff --git a/app/client/modules/samplernn/views/samplernn.show.js b/app/client/modules/samplernn/views/samplernn.show.js index f44deda..b7e0740 100644 --- a/app/client/modules/samplernn/views/samplernn.show.js +++ b/app/client/modules/samplernn/views/samplernn.show.js @@ -1,7 +1,7 @@ import { h, Component } from 'preact' import { bindActionCreators } from 'redux' import { connect } from 'react-redux' -import * as util from '../../../util' +import util from '../../../util' import * as samplernnActions from '../samplernn.actions' import * as samplernnTasks from '../samplernn.tasks' diff --git a/app/client/queue/queue.reducer.js b/app/client/queue/queue.reducer.js index b9ed194..033acba 100644 --- a/app/client/queue/queue.reducer.js +++ b/app/client/queue/queue.reducer.js @@ -1,5 +1,5 @@ import types from '../types' -import * as util from '../util' +import util from '../util' import moment from 'moment' const queueInitialState = { diff --git a/app/client/util/hidpi-canvas.js b/app/client/util/hidpi-canvas.js new file mode 100644 index 0000000..f0a7a0d --- /dev/null +++ b/app/client/util/hidpi-canvas.js @@ -0,0 +1,170 @@ +/** + * HiDPI Canvas Polyfill (1.0.10) + * + * Author: Jonathan D. Johnson (http://jondavidjohn.com) + * Homepage: https://github.com/jondavidjohn/hidpi-canvas-polyfill + * Issue Tracker: https://github.com/jondavidjohn/hidpi-canvas-polyfill/issues + * License: Apache-2.0 +*/ +(function(prototype) { + + var pixelRatio = (function() { + var canvas = window.document.createElement('canvas'), + context = canvas.getContext('2d'), + backingStore = context.backingStorePixelRatio || + context.webkitBackingStorePixelRatio || + context.mozBackingStorePixelRatio || + context.msBackingStorePixelRatio || + context.oBackingStorePixelRatio || + context.backingStorePixelRatio || 1; + + return (window.devicePixelRatio || 1) / backingStore; + })(), + + forEach = function(obj, func) { + for (var p in obj) { + if (obj.hasOwnProperty(p)) { + func(obj[p], p); + } + } + }, + + ratioArgs = { + 'fillRect': 'all', + 'clearRect': 'all', + 'strokeRect': 'all', + 'moveTo': 'all', + 'lineTo': 'all', + 'arc': [0,1,2], + 'arcTo': 'all', + 'bezierCurveTo': 'all', + 'isPointinPath': 'all', + 'isPointinStroke': 'all', + 'quadraticCurveTo': 'all', + 'rect': 'all', + 'translate': 'all', + 'createRadialGradient': 'all', + 'createLinearGradient': 'all' + }; + + if (pixelRatio === 1) return; + + forEach(ratioArgs, function(value, key) { + prototype[key] = (function(_super) { + return function() { + var i, len, + args = Array.prototype.slice.call(arguments); + + if (value === 'all') { + args = args.map(function(a) { + return a * pixelRatio; + }); + } + else if (Array.isArray(value)) { + for (i = 0, len = value.length; i < len; i++) { + args[value[i]] *= pixelRatio; + } + } + + return _super.apply(this, args); + }; + })(prototype[key]); + }); + + // Stroke lineWidth adjustment + prototype.stroke = (function(_super) { + return function() { + this.lineWidth *= pixelRatio; + _super.apply(this, arguments); + this.lineWidth /= pixelRatio; + }; + })(prototype.stroke); + + // Text + // + prototype.fillText = (function(_super) { + return function() { + var args = Array.prototype.slice.call(arguments); + + args[1] *= pixelRatio; // x + args[2] *= pixelRatio; // y + + this.font = this.font.replace( + /(\d+)(px|em|rem|pt)/g, + function(w, m, u) { + return (m * pixelRatio) + u; + } + ); + + _super.apply(this, args); + + this.font = this.font.replace( + /(\d+)(px|em|rem|pt)/g, + function(w, m, u) { + return (m / pixelRatio) + u; + } + ); + }; + })(prototype.fillText); + + prototype.strokeText = (function(_super) { + return function() { + var args = Array.prototype.slice.call(arguments); + + args[1] *= pixelRatio; // x + args[2] *= pixelRatio; // y + + this.font = this.font.replace( + /(\d+)(px|em|rem|pt)/g, + function(w, m, u) { + return (m * pixelRatio) + u; + } + ); + + _super.apply(this, args); + + this.font = this.font.replace( + /(\d+)(px|em|rem|pt)/g, + function(w, m, u) { + return (m / pixelRatio) + u; + } + ); + }; + })(prototype.strokeText); +})(window.CanvasRenderingContext2D.prototype); +;(function(prototype) { + prototype.getContext = (function(_super) { + return function(type) { + var backingStore, ratio, context; + + + if (type == '2d-lodpi') { + context = _super.call(this, '2d'); + } + else if (type === '2d') { + context = _super.call(this, '2d'); + + backingStore = context.backingStorePixelRatio || + context.webkitBackingStorePixelRatio || + context.mozBackingStorePixelRatio || + context.msBackingStorePixelRatio || + context.oBackingStorePixelRatio || + context.backingStorePixelRatio || 1; + + ratio = (window.devicePixelRatio || 1) / backingStore; + + if (ratio > 1) { + this.style.height = this.height + 'px'; + this.style.width = this.width + 'px'; + this.width *= ratio; + this.height *= ratio; + } + } + else { + context = _super.call(this, type); + } + + return context; + }; + })(prototype.getContext); +})(window.HTMLCanvasElement.prototype); diff --git a/app/client/util/index.js b/app/client/util/index.js index a811dcf..4ce1245 100644 --- a/app/client/util/index.js +++ b/app/client/util/index.js @@ -2,17 +2,13 @@ import * as sort from './sort' import * as format from './format' import * as maths from './math' -export { - sort, - ...maths, - ...format, -} +import './hidpi-canvas' -export const is_iphone = !!((navigator.userAgent.match(/iPhone/i)) || (navigator.userAgent.match(/iPod/i))) -export const is_ipad = !!(navigator.userAgent.match(/iPad/i)) -export const is_android = !!(navigator.userAgent.match(/Android/i)) -export const is_mobile = is_iphone || is_ipad || is_android -export const is_desktop = ! is_mobile; +const is_iphone = !!((navigator.userAgent.match(/iPhone/i)) || (navigator.userAgent.match(/iPod/i))) +const is_ipad = !!(navigator.userAgent.match(/iPad/i)) +const is_android = !!(navigator.userAgent.match(/Android/i)) +const is_mobile = is_iphone || is_ipad || is_android +const is_desktop = ! is_mobile; const htmlClassList = document.body.parentNode.classList htmlClassList.add(is_desktop ? 'desktop' : 'mobile') @@ -20,9 +16,7 @@ htmlClassList.remove('loading') // window.debug = false -document.body.style.backgroundImage = 'linear-gradient(' + (randint(40)+40) + 'deg, #fde, #ffe)' - -export const allProgress = (promises, progress_cb) => { +const allProgress = (promises, progress_cb) => { let d = 0 progress_cb(0, 0, promises.length) promises.forEach((p) => { @@ -34,3 +28,13 @@ export const allProgress = (promises, progress_cb) => { }) return Promise.all(promises) } + +document.body.style.backgroundImage = 'linear-gradient(' + (maths.randint(40)+40) + 'deg, #fde, #ffe)' + +export default { + ...maths, + ...format, + sort, + allProgress, + is_iphone, is_ipad, is_android, is_mobile, is_desktop, +} diff --git a/app/client/util/math.js b/app/client/util/math.js index 253bacd..c301ffd 100644 --- a/app/client/util/math.js +++ b/app/client/util/math.js @@ -1,13 +1,12 @@ -export function mod(n,m){ return n-(m * Math.floor(n/m)) } -export function clamp(n,a,b) { return n n-(m * Math.floor(n/m)) +export const clamp = (n,a,b) => n (n-a) / (b-a) +export const lerp = (n,a,b) => (b-a)*n+a +export const mix = (n,a,b) => a*(1-n)+b*n +export const randint = (n) => Math.floor(Math.random()*n) export function randrange(a,b){ return Math.random() * (b-a) + a } export function randsign(){ return Math.random() >= 0.5 ? -1 : 1 } export function choice (a){ return a[ Math.floor(Math.random() * a.length) ] } -export function lerp(n,a,b){ return (b-a)*n+a } export function angle(x0,y0,x1,y1){ return Math.atan2(y1-y0,x1-x0) } export function dist(x0,y0,x1,y1){ return Math.sqrt(Math.pow(x1-x0,2)+Math.pow(y1-y0,2)) } export function xor(a,b){ a=!!a; b=!!b; return (a||b) && !(a&&b) } diff --git a/public/assets/css/css.css b/public/assets/css/css.css index 8fd284f..5fcc1af 100644 --- a/public/assets/css/css.css +++ b/public/assets/css/css.css @@ -6,6 +6,7 @@ html,body { font-family: 'Trebuchet MS', sans-serif; } body { + transition: background 0.2s; background-attachment: fixed; font-size: 10px; } diff --git a/public/bundle.js b/public/bundle.js index cef61ad..ff4bf5f 100644 --- a/public/bundle.js +++ b/public/bundle.js @@ -467,7 +467,7 @@ var _crud = __webpack_require__(/*! ./crud.actions */ "./app/client/api/crud.act var _util = __webpack_require__(/*! ../util */ "./app/client/util/index.js"); -var util = _interopRequireWildcard(_util); +var _util2 = _interopRequireDefault(_util); var _parser = __webpack_require__(/*! ./parser */ "./app/client/api/parser.js"); @@ -475,6 +475,8 @@ var parser = _interopRequireWildcard(_parser); function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } } +function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + /* for our crud events, create corresponding actions the actions fire a 'loading' event, call the underlying api method, and then resolve. @@ -488,7 +490,7 @@ so you can do ... folderActions.upload(12, form_data) */ -exports.util = util; +exports.util = _util2.default; exports.parser = parser; var actions = exports.actions = ['folder', 'file', 'dataset', 'task', 'user'].reduce(function (a, b) { return (a[b] = (0, _crud.crud_actions)(b)) && a; @@ -1181,9 +1183,7 @@ var _moment2 = _interopRequireDefault(_moment); var _util = __webpack_require__(/*! ../util */ "./app/client/util/index.js"); -var util = _interopRequireWildcard(_util); - -function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } } +var _util2 = _interopRequireDefault(_util); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } @@ -1206,7 +1206,7 @@ var FileList = exports.FileList = function FileList(props) { _props$rowClassName = props.rowClassName, rowClassName = _props$rowClassName === undefined ? 'row file' : _props$rowClassName; - var _util$sort$orderByFn = util.sort.orderByFn(orderBy), + var _util$sort$orderByFn = _util2.default.sort.orderByFn(orderBy), mapFn = _util$sort$orderByFn.mapFn, sortFn = _util$sort$orderByFn.sortFn; @@ -1280,7 +1280,7 @@ var FileRow = exports.FileRow = function FileRow(props) { var fields = fieldSet(props.fields); - var size = util.hush_size(file.size); + var size = _util2.default.hush_size(file.size); var date = file.date || file.created_at; var epoch = file.epoch || file.epochs || 0; @@ -1325,8 +1325,8 @@ var FileRow = exports.FileRow = function FileRow(props) { ), fields.has('age') && (0, _preact.h)( 'div', - { className: "age " + util.carbon_date(date) }, - util.get_age(date) + { className: "age " + _util2.default.carbon_date(date) }, + _util2.default.get_age(date) ), fields.has('username') && (0, _preact.h)( 'div', @@ -1335,17 +1335,17 @@ var FileRow = exports.FileRow = function FileRow(props) { ), fields.has('epoch') && (0, _preact.h)( 'div', - { className: "epoch " + util.hush_null(epoch)[0] }, + { className: "epoch " + _util2.default.hush_null(epoch)[0] }, epoch > 0 ? 'ep. ' + epoch : '' ), fields.has('date') && (0, _preact.h)( 'div', - { className: "date " + util.carbon_date(date) }, + { className: "date " + _util2.default.carbon_date(date) }, (0, _moment2.default)(date).format("YYYY-MM-DD") ), fields.has('datetime') && (0, _preact.h)( 'div', - { className: "datetime " + util.carbon_date(date) }, + { className: "datetime " + _util2.default.carbon_date(date) }, (0, _moment2.default)(date).format("YYYY-MM-DD h:mm a") ), fields.has('size') && (0, _preact.h)( @@ -2582,9 +2582,9 @@ var _redux = __webpack_require__(/*! redux */ "./node_modules/redux/es/redux.js" var _util = __webpack_require__(/*! ../util */ "./app/client/util/index.js"); -var util = _interopRequireWildcard(_util); +var _util2 = _interopRequireDefault(_util); -function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } } +function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } @@ -2654,7 +2654,7 @@ var DashboardHeader = function (_Component) { 'div', null, 'Currently ', - util.gerund(task.activity), + _util2.default.gerund(task.activity), ' ', task.module, ' on ', @@ -2723,7 +2723,7 @@ var _reactRedux = __webpack_require__(/*! react-redux */ "./node_modules/react-r var _util = __webpack_require__(/*! ../util */ "./app/client/util/index.js"); -var util = _interopRequireWildcard(_util); +var _util2 = _interopRequireDefault(_util); var _actions = __webpack_require__(/*! ../actions */ "./app/client/actions.js"); @@ -2731,8 +2731,6 @@ var _actions2 = _interopRequireDefault(_actions); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } -function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } } - function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; } @@ -2759,7 +2757,7 @@ var TaskList = function (_Component) { var time = 0; - var _util$sort$orderByFn = util.sort.orderByFn('date desc'), + var _util$sort$orderByFn = _util2.default.sort.orderByFn('date desc'), mapFn = _util$sort$orderByFn.mapFn, sortFn = _util$sort$orderByFn.sortFn; @@ -2796,8 +2794,8 @@ var TaskList = function (_Component) { ), (0, _preact.h)( 'div', - { className: "age " + util.carbon_date(task.updated_at) }, - util.get_age(task.updated_at) + { className: "age " + _util2.default.carbon_date(task.updated_at) }, + _util2.default.get_age(task.updated_at) ), (0, _preact.h)( 'div', @@ -2986,7 +2984,7 @@ var _reactRedux = __webpack_require__(/*! react-redux */ "./node_modules/react-r var _util = __webpack_require__(/*! ../util */ "./app/client/util/index.js"); -var util = _interopRequireWildcard(_util); +var _util2 = _interopRequireDefault(_util); var _actions = __webpack_require__(/*! ../actions */ "./app/client/actions.js"); @@ -3008,8 +3006,6 @@ var _loading2 = _interopRequireDefault(_loading); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } -function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } } - function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; } @@ -3091,7 +3087,7 @@ var DatasetComponent = function (_Component) { var datasetLookup = data.datasetLookup, fileLookup = data.fileLookup; - var _util$sort$orderByFn = util.sort.orderByFn('date desc'), + var _util$sort$orderByFn = _util2.default.sort.orderByFn('date desc'), mapFn = _util$sort$orderByFn.mapFn, sortFn = _util$sort$orderByFn.sortFn; @@ -3105,7 +3101,7 @@ var DatasetComponent = function (_Component) { var isProcessing = false, isFetching = false; if (moduleOnGPU && runner.gpu.task.dataset === dataset) { - status = util.gerund(runner.gpu.task.activity); + status = _util2.default.gerund(runner.gpu.task.activity); isProcessing = true; } else if (moduleOnCPU && runner.cpu.task.activity === 'fetch' && runner.cpu.task.opt.file_id === dataset.input[0]) { isProcessing = true; @@ -3953,7 +3949,7 @@ var socket = _interopRequireWildcard(_socket); var _util = __webpack_require__(/*! ./util */ "./app/client/util/index.js"); -var util = _interopRequireWildcard(_util); +var _util2 = _interopRequireDefault(_util); var _header = __webpack_require__(/*! ./common/header.component */ "./app/client/common/header.component.js"); @@ -4994,6 +4990,10 @@ var _preact = __webpack_require__(/*! preact */ "./node_modules/preact/dist/prea var _reactRouterDom = __webpack_require__(/*! react-router-dom */ "./node_modules/react-router-dom/es/index.js"); +var _util = __webpack_require__(/*! ../../util */ "./app/client/util/index.js"); + +var _util2 = _interopRequireDefault(_util); + var _pix2pix = __webpack_require__(/*! ./views/pix2pix.new */ "./app/client/modules/pix2pix/views/pix2pix.new.js"); var _pix2pix2 = _interopRequireDefault(_pix2pix); @@ -5009,6 +5009,7 @@ var _pix2pix6 = _interopRequireDefault(_pix2pix5); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } function router() { + document.body.style.backgroundImage = 'linear-gradient(' + (_util2.default.randint(40) + 40) + 'deg, #fde, #ffe)'; return (0, _preact.h)( 'section', null, @@ -5090,6 +5091,8 @@ var _actions2 = _interopRequireDefault(_actions); var _util = __webpack_require__(/*! ../../util */ "./app/client/util/index.js"); +var _util2 = _interopRequireDefault(_util); + var _pix2pix = __webpack_require__(/*! ./pix2pix.module */ "./app/client/modules/pix2pix/pix2pix.module.js"); var _pix2pix2 = _interopRequireDefault(_pix2pix); @@ -5101,7 +5104,7 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de var load_directories = exports.load_directories = function load_directories(id) { return function (dispatch) { var module = _pix2pix2.default.name; - (0, _util.allProgress)([datasetLoader.load(module)], function (percent, i, n) { + _util2.default.allProgress([datasetLoader.load(module)], function (percent, i, n) { dispatch({ type: _types2.default.app.load_progress, progress: { i: i, n: n } }); }).then(function (res) { // console.log(res) @@ -5675,14 +5678,6 @@ exports.default = Pix2PixNew; var _preact = __webpack_require__(/*! preact */ "./node_modules/preact/dist/preact.esm.js"); -var _redux = __webpack_require__(/*! redux */ "./node_modules/redux/es/redux.js"); - -var _reactRedux = __webpack_require__(/*! react-redux */ "./node_modules/react-redux/es/index.js"); - -var _util = __webpack_require__(/*! ../../../util */ "./app/client/util/index.js"); - -var util = _interopRequireWildcard(_util); - var _dataset = __webpack_require__(/*! ../../../dataset/dataset.new */ "./app/client/dataset/dataset.new.js"); var _dataset2 = _interopRequireDefault(_dataset); @@ -5693,8 +5688,6 @@ var _pix2pix2 = _interopRequireDefault(_pix2pix); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } -function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } } - function Pix2PixNew(_ref) { var history = _ref.history; @@ -5731,7 +5724,7 @@ var _reactRedux = __webpack_require__(/*! react-redux */ "./node_modules/react-r var _util = __webpack_require__(/*! ../../../util */ "./app/client/util/index.js"); -var util = _interopRequireWildcard(_util); +var _util2 = _interopRequireDefault(_util); var _pix2pix = __webpack_require__(/*! ../pix2pix.actions */ "./app/client/modules/pix2pix/pix2pix.actions.js"); @@ -5767,10 +5760,10 @@ var _pix2pix3 = __webpack_require__(/*! ../pix2pix.module */ "./app/client/modul var _pix2pix4 = _interopRequireDefault(_pix2pix3); -function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } - function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } } +function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; } @@ -5982,9 +5975,31 @@ var _preact = __webpack_require__(/*! preact */ "./node_modules/preact/dist/prea var _reactRouterDom = __webpack_require__(/*! react-router-dom */ "./node_modules/react-router-dom/es/index.js"); +var _util = __webpack_require__(/*! ../../util */ "./app/client/util/index.js"); + +var _util2 = _interopRequireDefault(_util); + +var _pix2wav = __webpack_require__(/*! ./views/pix2wav.new */ "./app/client/modules/pix2wav/views/pix2wav.new.js"); + +var _pix2wav2 = _interopRequireDefault(_pix2wav); + +var _pix2wav3 = __webpack_require__(/*! ./views/pix2wav.show */ "./app/client/modules/pix2wav/views/pix2wav.show.js"); + +var _pix2wav4 = _interopRequireDefault(_pix2wav3); + +function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + +// import Pix2WavLive from './views/pix2wav.live' + function router() { - // - return (0, _preact.h)('section', null); + document.body.style.backgroundImage = 'linear-gradient(' + (_util2.default.randint(40) + 40) + 'deg, #fde, #ffe)'; + return (0, _preact.h)( + 'section', + null, + (0, _preact.h)(_reactRouterDom.Route, { exact: true, path: '/pix2wav/new/', component: _pix2wav2.default }), + (0, _preact.h)(_reactRouterDom.Route, { exact: true, path: '/pix2wav/datasets/', component: _pix2wav4.default }), + (0, _preact.h)(_reactRouterDom.Route, { exact: true, path: '/pix2wav/datasets/:id/', component: _pix2wav4.default }) + ); } function links() { @@ -5995,26 +6010,133 @@ function links() { 'span', null, 'datasets' - ), - (0, _preact.h)( - 'span', - null, - (0, _preact.h)( - _reactRouterDom.Link, - { to: '/pix2wav/live/' }, - 'live' - ) ) ); } exports.default = { - name: 'pix2pix', + name: 'pix2wav', router: router, links: links }; /***/ }), +/***/ "./app/client/modules/pix2wav/pix2wav.actions.js": +/*!*******************************************************!*\ + !*** ./app/client/modules/pix2wav/pix2wav.actions.js ***! + \*******************************************************/ +/*! no static exports found */ +/***/ (function(module, exports, __webpack_require__) { + +"use strict"; + + +Object.defineProperty(exports, "__esModule", { + value: true +}); +exports.load_directories = undefined; + +var _slicedToArray = function () { function sliceIterator(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"]) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } return function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { return sliceIterator(arr, i); } else { throw new TypeError("Invalid attempt to destructure non-iterable instance"); } }; }(); + +var _v = __webpack_require__(/*! uuid/v1 */ "./node_modules/uuid/v1.js"); + +var _v2 = _interopRequireDefault(_v); + +var _socket = __webpack_require__(/*! ../../socket */ "./app/client/socket/index.js"); + +var _socket2 = _interopRequireDefault(_socket); + +var _types = __webpack_require__(/*! ../../types */ "./app/client/types.js"); + +var _types2 = _interopRequireDefault(_types); + +var _dataset = __webpack_require__(/*! ../../dataset/dataset.loader */ "./app/client/dataset/dataset.loader.js"); + +var datasetLoader = _interopRequireWildcard(_dataset); + +var _actions = __webpack_require__(/*! ../../actions */ "./app/client/actions.js"); + +var _actions2 = _interopRequireDefault(_actions); + +var _util = __webpack_require__(/*! ../../util */ "./app/client/util/index.js"); + +var _util2 = _interopRequireDefault(_util); + +var _pix2wav = __webpack_require__(/*! ./pix2wav.module */ "./app/client/modules/pix2wav/pix2wav.module.js"); + +var _pix2wav2 = _interopRequireDefault(_pix2wav); + +function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } } + +function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + +var load_directories = exports.load_directories = function load_directories(id) { + return function (dispatch) { + var module = _pix2wav2.default.name; + _util2.default.allProgress([datasetLoader.load(module)], function (percent, i, n) { + dispatch({ type: _types2.default.app.load_progress, progress: { i: i, n: n } }); + }).then(function (res) { + var _res = _slicedToArray(res, 1), + datasetApiReport = _res[0]; //, datasets, results, output, datasetUsage, lossReport] = res + + + var folderLookup = datasetApiReport.folderLookup, + fileLookup = datasetApiReport.fileLookup, + datasetLookup = datasetApiReport.datasetLookup, + folders = datasetApiReport.folders, + files = datasetApiReport.files, + unsortedFolder = datasetApiReport.unsortedFolder; + + dispatch({ + type: _types2.default.dataset.load, + data: { + module: module, + folderLookup: folderLookup, + fileLookup: fileLookup, + datasetLookup: datasetLookup, + folders: folders, files: files + } + }); + if (id) { + console.log('folder id', id); + dispatch({ + type: _types2.default.dataset.set_folder, + data: { + folder_id: id, + module: module + } + }); + } + }).catch(function (e) { + console.error(e); + }); + }; +}; + +/***/ }), + +/***/ "./app/client/modules/pix2wav/pix2wav.module.js": +/*!******************************************************!*\ + !*** ./app/client/modules/pix2wav/pix2wav.module.js ***! + \******************************************************/ +/*! no static exports found */ +/***/ (function(module, exports, __webpack_require__) { + +"use strict"; + + +Object.defineProperty(exports, "__esModule", { + value: true +}); +var pix2wavModule = { + name: 'pix2wav', + datatype: 'spectrogram' +}; + +exports.default = pix2wavModule; + +/***/ }), + /***/ "./app/client/modules/pix2wav/pix2wav.reducer.js": /*!*******************************************************!*\ !*** ./app/client/modules/pix2wav/pix2wav.reducer.js ***! @@ -6076,104 +6198,40 @@ exports.default = pix2wavReducer; /***/ }), -/***/ "./app/client/modules/samplernn/index.js": -/*!***********************************************!*\ - !*** ./app/client/modules/samplernn/index.js ***! - \***********************************************/ +/***/ "./app/client/modules/pix2wav/pix2wav.tasks.js": +/*!*****************************************************!*\ + !*** ./app/client/modules/pix2wav/pix2wav.tasks.js ***! + \*****************************************************/ /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { "use strict"; -Object.defineProperty(exports, "__esModule", { - value: true -}); - -var _preact = __webpack_require__(/*! preact */ "./node_modules/preact/dist/preact.esm.js"); - -var _reactRouterDom = __webpack_require__(/*! react-router-dom */ "./node_modules/react-router-dom/es/index.js"); - -var _samplernn = __webpack_require__(/*! ./views/samplernn.new */ "./app/client/modules/samplernn/views/samplernn.new.js"); - -var _samplernn2 = _interopRequireDefault(_samplernn); - -var _samplernn3 = __webpack_require__(/*! ./views/samplernn.show */ "./app/client/modules/samplernn/views/samplernn.show.js"); +var _v = __webpack_require__(/*! uuid/v1 */ "./node_modules/uuid/v1.js"); -var _samplernn4 = _interopRequireDefault(_samplernn3); +var _v2 = _interopRequireDefault(_v); -var _samplernn5 = __webpack_require__(/*! ./views/samplernn.import */ "./app/client/modules/samplernn/views/samplernn.import.js"); +var _socket = __webpack_require__(/*! ../../socket */ "./app/client/socket/index.js"); -var _samplernn6 = _interopRequireDefault(_samplernn5); +var _socket2 = _interopRequireDefault(_socket); -var _samplernn7 = __webpack_require__(/*! ./views/samplernn.results */ "./app/client/modules/samplernn/views/samplernn.results.js"); +var _types = __webpack_require__(/*! ../../types */ "./app/client/types.js"); -var _samplernn8 = _interopRequireDefault(_samplernn7); +var _types2 = _interopRequireDefault(_types); -var _samplernn9 = __webpack_require__(/*! ./views/samplernn.graph */ "./app/client/modules/samplernn/views/samplernn.graph.js"); +var _actions = __webpack_require__(/*! ../../actions */ "./app/client/actions.js"); -var _samplernn10 = _interopRequireDefault(_samplernn9); +var _actions2 = _interopRequireDefault(_actions); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } -function router() { - return (0, _preact.h)( - 'section', - null, - (0, _preact.h)(_reactRouterDom.Route, { exact: true, path: '/samplernn/new/', component: _samplernn2.default }), - (0, _preact.h)(_reactRouterDom.Route, { exact: true, path: '/samplernn/datasets/', component: _samplernn4.default }), - (0, _preact.h)(_reactRouterDom.Route, { exact: true, path: '/samplernn/datasets/:id/', component: _samplernn4.default }), - (0, _preact.h)(_reactRouterDom.Route, { exact: true, path: '/samplernn/import/', component: _samplernn6.default }), - (0, _preact.h)(_reactRouterDom.Route, { exact: true, path: '/samplernn/results/', component: _samplernn8.default }), - (0, _preact.h)(_reactRouterDom.Route, { exact: true, path: '/samplernn/graph/', component: _samplernn10.default }) - ); -} - -function links() { - return (0, _preact.h)( - 'span', - null, - (0, _preact.h)( - 'span', - null, - (0, _preact.h)( - _reactRouterDom.Link, - { to: '/samplernn/datasets/' }, - 'datasets' - ) - ), - (0, _preact.h)( - 'span', - null, - (0, _preact.h)( - _reactRouterDom.Link, - { to: '/samplernn/graph/' }, - 'graph' - ) - ), - (0, _preact.h)( - 'span', - null, - (0, _preact.h)( - _reactRouterDom.Link, - { to: '/samplernn/results/' }, - 'results' - ) - ) - ); -} - -exports.default = { - name: 'samplernn', - router: router, links: links -}; - /***/ }), -/***/ "./app/client/modules/samplernn/samplernn.actions.js": -/*!***********************************************************!*\ - !*** ./app/client/modules/samplernn/samplernn.actions.js ***! - \***********************************************************/ +/***/ "./app/client/modules/pix2wav/views/pix2wav.new.js": +/*!*********************************************************!*\ + !*** ./app/client/modules/pix2wav/views/pix2wav.new.js ***! + \*********************************************************/ /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { @@ -6183,17 +6241,412 @@ exports.default = { Object.defineProperty(exports, "__esModule", { value: true }); -exports.import_files = exports.load_loss = exports.load_directories = undefined; +exports.default = Pix2WavNew; -var _slicedToArray = function () { function sliceIterator(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"]) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } return function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { return sliceIterator(arr, i); } else { throw new TypeError("Invalid attempt to destructure non-iterable instance"); } }; }(); +var _preact = __webpack_require__(/*! preact */ "./node_modules/preact/dist/preact.esm.js"); -var _v = __webpack_require__(/*! uuid/v1 */ "./node_modules/uuid/v1.js"); +var _dataset = __webpack_require__(/*! ../../../dataset/dataset.new */ "./app/client/dataset/dataset.new.js"); -var _v2 = _interopRequireDefault(_v); +var _dataset2 = _interopRequireDefault(_dataset); -var _socket = __webpack_require__(/*! ../../socket */ "./app/client/socket/index.js"); +var _pix2wav = __webpack_require__(/*! ../pix2wav.module */ "./app/client/modules/pix2wav/pix2wav.module.js"); -var _socket2 = _interopRequireDefault(_socket); +var _pix2wav2 = _interopRequireDefault(_pix2wav); + +function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + +function Pix2WavNew(_ref) { + var history = _ref.history; + + return (0, _preact.h)( + 'div', + { 'class': 'app pix2wav' }, + (0, _preact.h)(_dataset2.default, { module: _pix2wav2.default, history: history }) + ); +} + +/***/ }), + +/***/ "./app/client/modules/pix2wav/views/pix2wav.show.js": +/*!**********************************************************!*\ + !*** ./app/client/modules/pix2wav/views/pix2wav.show.js ***! + \**********************************************************/ +/*! no static exports found */ +/***/ (function(module, exports, __webpack_require__) { + +"use strict"; + + +Object.defineProperty(exports, "__esModule", { + value: true +}); + +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; }; }(); + +var _preact = __webpack_require__(/*! preact */ "./node_modules/preact/dist/preact.esm.js"); + +var _redux = __webpack_require__(/*! redux */ "./node_modules/redux/es/redux.js"); + +var _reactRedux = __webpack_require__(/*! react-redux */ "./node_modules/react-redux/es/index.js"); + +var _util = __webpack_require__(/*! ../../../util */ "./app/client/util/index.js"); + +var _util2 = _interopRequireDefault(_util); + +var _pix2wav = __webpack_require__(/*! ../pix2wav.actions */ "./app/client/modules/pix2wav/pix2wav.actions.js"); + +var pix2wavActions = _interopRequireWildcard(_pix2wav); + +var _pix2wav2 = __webpack_require__(/*! ../pix2wav.tasks */ "./app/client/modules/pix2wav/pix2wav.tasks.js"); + +var pix2wavTasks = _interopRequireWildcard(_pix2wav2); + +var _loading = __webpack_require__(/*! ../../../common/loading.component */ "./app/client/common/loading.component.js"); + +var _loading2 = _interopRequireDefault(_loading); + +var _dataset = __webpack_require__(/*! ../../../dataset/dataset.form */ "./app/client/dataset/dataset.form.js"); + +var _dataset2 = _interopRequireDefault(_dataset); + +var _dataset3 = __webpack_require__(/*! ../../../dataset/dataset.new */ "./app/client/dataset/dataset.new.js"); + +var _dataset4 = _interopRequireDefault(_dataset3); + +var _upload = __webpack_require__(/*! ../../../dataset/upload.status */ "./app/client/dataset/upload.status.js"); + +var _upload2 = _interopRequireDefault(_upload); + +var _fileList = __webpack_require__(/*! ../../../common/fileList.component */ "./app/client/common/fileList.component.js"); + +var _dataset5 = __webpack_require__(/*! ../../../dataset/dataset.component */ "./app/client/dataset/dataset.component.js"); + +var _dataset6 = _interopRequireDefault(_dataset5); + +var _pix2wav3 = __webpack_require__(/*! ../pix2wav.module */ "./app/client/modules/pix2wav/pix2wav.module.js"); + +var _pix2wav4 = _interopRequireDefault(_pix2wav3); + +function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } } + +function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + +function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } + +function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; } + +function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } + +var Pix2wavShow = function (_Component) { + _inherits(Pix2wavShow, _Component); + + function Pix2wavShow(props) { + _classCallCheck(this, Pix2wavShow); + + var _this = _possibleConstructorReturn(this, (Pix2wavShow.__proto__ || Object.getPrototypeOf(Pix2wavShow)).call(this, props)); + + _this.datasetActions = _this.datasetActions.bind(_this); + return _this; + } + + _createClass(Pix2wavShow, [{ + key: 'componentWillMount', + value: function componentWillMount() { + var id = this.props.match.params.id || localStorage.getItem('pix2wav.last_id'); + console.log('load dataset:', id); + var _props = this.props, + match = _props.match, + pix2wav = _props.pix2wav, + actions = _props.actions; + + if (id === 'new') return; + if (id) { + if (parseInt(id)) localStorage.setItem('pix2wav.last_id', id); + if (!pix2wav.folder || pix2wav.folder.id !== id) { + actions.load_directories(id); + } + } + } + }, { + key: 'render', + value: function render() { + var _props2 = this.props, + pix2wav = _props2.pix2wav, + match = _props2.match, + history = _props2.history; + + var _ref = pix2wav.data || {}, + folderLookup = _ref.folderLookup; + + var folder = (folderLookup || {})[pix2wav.folder_id] || {}; + + return (0, _preact.h)( + 'div', + { className: 'app pix2wav' }, + (0, _preact.h)( + 'div', + { 'class': 'heading' }, + (0, _preact.h)( + 'div', + { 'class': 'spaced' }, + (0, _preact.h)( + 'h1', + null, + folder ? folder.name : (0, _preact.h)(_loading2.default, null) + ), + (0, _preact.h)(_upload2.default, null) + ) + ), + folder && folder.name && folder.name !== 'unsorted' && (0, _preact.h)(_dataset2.default, { + title: 'Add Files', + module: _pix2wav4.default, + folder: folder, + canUpload: true, canAddURL: true + }), + (0, _preact.h)(_dataset6.default, { + loading: pix2wav.loading, + progress: pix2wav.progress, + id: pix2wav.folder_id, + module: _pix2wav4.default, + data: pix2wav.data, + folder: folder, + history: history, + onPickFile: function onPickFile(file, e) { + e.preventDefault(); + e.stopPropagation(); + console.log('picked a file', file); + }, + datasetActions: this.datasetActions + }) + ); + } + }, { + key: 'datasetActions', + value: function datasetActions(dataset) { + var isFetching = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false; + var isProcessing = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false; + var _props3 = this.props, + pix2wav = _props3.pix2wav, + remote = _props3.remote; + + var input = pix2wav.data.fileLookup[dataset.input[0]]; + if (!input) return null; + if (input.name && input.name.match(/(gif|jpe?g|png)$/i)) return null; + return (0, _preact.h)( + 'div', + null, + (0, _preact.h)( + 'div', + { 'class': 'actions' }, + (0, _preact.h)( + 'span', + { 'class': 'link', onClick: function onClick() { + return remote.train_task(dataset, pix2wav.folder_id, 1); + } }, + 'train' + ), + (0, _preact.h)( + 'span', + { 'class': 'link', onClick: function onClick() { + return remote.train_task(dataset, pix2wav.folder_id, 2); + } }, + '2x' + ), + (0, _preact.h)( + 'span', + { 'class': 'link', onClick: function onClick() { + return remote.train_task(dataset, pix2wav.folder_id, 4); + } }, + '4x' + ), + (0, _preact.h)( + 'span', + { 'class': 'link', onClick: function onClick() { + return remote.train_task(dataset, pix2wav.folder_id, 6); + } }, + '6x' + ), + (0, _preact.h)( + 'span', + { 'class': 'link', onClick: function onClick() { + return remote.train_task(dataset, pix2wav.folder_id, 18); + } }, + '18x' + ) + ), + dataset.isBuilt ? (0, _preact.h)( + 'div', + { 'class': 'subtext' }, + 'fetched ', + (0, _preact.h)( + 'span', + { 'class': 'link', onClick: function onClick() { + return remote.clear_cache_task(dataset); + } }, + 'rm' + ) + ) : isFetching ? (0, _preact.h)( + 'div', + { 'class': 'subtext' }, + 'fetching' + ) : (0, _preact.h)( + 'div', + { 'class': 'subtext' }, + (0, _preact.h)( + 'span', + { 'class': 'link', onClick: function onClick() { + return remote.fetch_task(input.url, input.id, dataset.name); + } }, + 'fetch' + ) + ) + ); + } + }]); + + return Pix2wavShow; +}(_preact.Component); + +var mapStateToProps = function mapStateToProps(state) { + return { + pix2wav: state.module.pix2wav + }; +}; + +var mapDispatchToProps = function mapDispatchToProps(dispatch, ownProps) { + return { + actions: (0, _redux.bindActionCreators)(pix2wavActions, dispatch), + remote: (0, _redux.bindActionCreators)(pix2wavTasks, dispatch) + }; +}; + +exports.default = (0, _reactRedux.connect)(mapStateToProps, mapDispatchToProps)(Pix2wavShow); + +/***/ }), + +/***/ "./app/client/modules/samplernn/index.js": +/*!***********************************************!*\ + !*** ./app/client/modules/samplernn/index.js ***! + \***********************************************/ +/*! no static exports found */ +/***/ (function(module, exports, __webpack_require__) { + +"use strict"; + + +Object.defineProperty(exports, "__esModule", { + value: true +}); + +var _preact = __webpack_require__(/*! preact */ "./node_modules/preact/dist/preact.esm.js"); + +var _reactRouterDom = __webpack_require__(/*! react-router-dom */ "./node_modules/react-router-dom/es/index.js"); + +var _util = __webpack_require__(/*! ../../util */ "./app/client/util/index.js"); + +var _util2 = _interopRequireDefault(_util); + +var _samplernn = __webpack_require__(/*! ./views/samplernn.new */ "./app/client/modules/samplernn/views/samplernn.new.js"); + +var _samplernn2 = _interopRequireDefault(_samplernn); + +var _samplernn3 = __webpack_require__(/*! ./views/samplernn.show */ "./app/client/modules/samplernn/views/samplernn.show.js"); + +var _samplernn4 = _interopRequireDefault(_samplernn3); + +var _samplernn5 = __webpack_require__(/*! ./views/samplernn.import */ "./app/client/modules/samplernn/views/samplernn.import.js"); + +var _samplernn6 = _interopRequireDefault(_samplernn5); + +var _samplernn7 = __webpack_require__(/*! ./views/samplernn.results */ "./app/client/modules/samplernn/views/samplernn.results.js"); + +var _samplernn8 = _interopRequireDefault(_samplernn7); + +var _samplernn9 = __webpack_require__(/*! ./views/samplernn.graph */ "./app/client/modules/samplernn/views/samplernn.graph.js"); + +var _samplernn10 = _interopRequireDefault(_samplernn9); + +function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + +function router() { + document.body.style.backgroundImage = 'linear-gradient(' + (_util2.default.randint(40) + 40) + 'deg, #eef, #fef)'; + return (0, _preact.h)( + 'section', + null, + (0, _preact.h)(_reactRouterDom.Route, { exact: true, path: '/samplernn/new/', component: _samplernn2.default }), + (0, _preact.h)(_reactRouterDom.Route, { exact: true, path: '/samplernn/datasets/', component: _samplernn4.default }), + (0, _preact.h)(_reactRouterDom.Route, { exact: true, path: '/samplernn/datasets/:id/', component: _samplernn4.default }), + (0, _preact.h)(_reactRouterDom.Route, { exact: true, path: '/samplernn/import/', component: _samplernn6.default }), + (0, _preact.h)(_reactRouterDom.Route, { exact: true, path: '/samplernn/results/', component: _samplernn8.default }), + (0, _preact.h)(_reactRouterDom.Route, { exact: true, path: '/samplernn/graph/', component: _samplernn10.default }) + ); +} + +function links() { + return (0, _preact.h)( + 'span', + null, + (0, _preact.h)( + 'span', + null, + (0, _preact.h)( + _reactRouterDom.Link, + { to: '/samplernn/datasets/' }, + 'datasets' + ) + ), + (0, _preact.h)( + 'span', + null, + (0, _preact.h)( + _reactRouterDom.Link, + { to: '/samplernn/graph/' }, + 'graph' + ) + ), + (0, _preact.h)( + 'span', + null, + (0, _preact.h)( + _reactRouterDom.Link, + { to: '/samplernn/results/' }, + 'results' + ) + ) + ); +} + +exports.default = { + name: 'samplernn', + router: router, links: links +}; + +/***/ }), + +/***/ "./app/client/modules/samplernn/samplernn.actions.js": +/*!***********************************************************!*\ + !*** ./app/client/modules/samplernn/samplernn.actions.js ***! + \***********************************************************/ +/*! no static exports found */ +/***/ (function(module, exports, __webpack_require__) { + +"use strict"; + + +Object.defineProperty(exports, "__esModule", { + value: true +}); +exports.import_files = exports.load_loss = exports.load_directories = undefined; + +var _slicedToArray = function () { function sliceIterator(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"]) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } return function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { return sliceIterator(arr, i); } else { throw new TypeError("Invalid attempt to destructure non-iterable instance"); } }; }(); + +var _v = __webpack_require__(/*! uuid/v1 */ "./node_modules/uuid/v1.js"); + +var _v2 = _interopRequireDefault(_v); + +var _socket = __webpack_require__(/*! ../../socket */ "./app/client/socket/index.js"); + +var _socket2 = _interopRequireDefault(_socket); var _types = __webpack_require__(/*! ../../types */ "./app/client/types.js"); @@ -6209,6 +6662,8 @@ var _actions2 = _interopRequireDefault(_actions); var _util = __webpack_require__(/*! ../../util */ "./app/client/util/index.js"); +var _util2 = _interopRequireDefault(_util); + var _samplernn = __webpack_require__(/*! ./samplernn.module */ "./app/client/modules/samplernn/samplernn.module.js"); var _samplernn2 = _interopRequireDefault(_samplernn); @@ -6222,7 +6677,7 @@ function _toArray(arr) { return Array.isArray(arr) ? arr : Array.from(arr); } var load_directories = exports.load_directories = function load_directories(id) { return function (dispatch) { var module = _samplernn2.default.name; - (0, _util.allProgress)([datasetLoader.load(module), _actions2.default.socket.list_directory({ module: module, dir: 'datasets' }), _actions2.default.socket.list_directory({ module: module, dir: 'results' }), _actions2.default.socket.list_directory({ module: module, dir: 'output' }), _actions2.default.socket.disk_usage({ module: module, dir: 'datasets' }), load_loss()(dispatch)], function (percent, i, n) { + _util2.default.allProgress([datasetLoader.load(module), _actions2.default.socket.list_directory({ module: module, dir: 'datasets' }), _actions2.default.socket.list_directory({ module: module, dir: 'results' }), _actions2.default.socket.list_directory({ module: module, dir: 'output' }), _actions2.default.socket.disk_usage({ module: module, dir: 'datasets' }), load_loss()(dispatch)], function (percent, i, n) { dispatch({ type: _types2.default.app.load_progress, progress: { i: i, n: n } }); }).then(function (res) { // console.log(res) @@ -6643,6 +7098,8 @@ var _reactRedux = __webpack_require__(/*! react-redux */ "./node_modules/react-r var _util = __webpack_require__(/*! ../../../util */ "./app/client/util/index.js"); +var _util2 = _interopRequireDefault(_util); + var _samplernn = __webpack_require__(/*! ../samplernn.actions */ "./app/client/modules/samplernn/samplernn.actions.js"); var samplernnActions = _interopRequireWildcard(_samplernn); @@ -6669,16 +7126,21 @@ var _textInput = __webpack_require__(/*! ../../../common/textInput.component */ var _textInput2 = _interopRequireDefault(_textInput); -function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } - function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } } +function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; } function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } +var lerp = _util2.default.lerp, + norm = _util2.default.norm, + randint = _util2.default.randint, + randrange = _util2.default.randrange; + var SampleRNNGraph = function (_Component) { _inherits(SampleRNNGraph, _Component); @@ -6726,7 +7188,7 @@ var SampleRNNGraph = function (_Component) { canvas.style.width = canvas.width + 'px'; canvas.style.height = canvas.height + 'px'; - var ctx = canvas.getContext('2d'); + var ctx = canvas.getContext('2d-lodpi'); var w = canvas.width = canvas.width * devicePixelRatio; var h = canvas.height = canvas.height * devicePixelRatio; ctx.clearRect(0, 0, w, h); @@ -6762,7 +7224,7 @@ var SampleRNNGraph = function (_Component) { var X = void 0, Y = void 0; for (var ii = 0; ii < epochsMax; ii++) { - X = (0, _util.lerp)(ii / (epochsMax / epochsScaleFactor) * epochsScaleFactor, wmin, wmax); + X = lerp(ii / (epochsMax / epochsScaleFactor) * epochsScaleFactor, wmin, wmax); ctx.strokeStyle = 'rgba(0,0,0,0.3)'; ctx.beginPath(0, 0); ctx.moveTo(X, 0); @@ -6779,7 +7241,7 @@ var SampleRNNGraph = function (_Component) { } } for (var ii = scaleMin; ii < scaleMax; ii += 1) { - Y = (0, _util.lerp)(ii / scaleMax, hmin, hmax); + Y = lerp(ii / scaleMax, hmin, hmax); // ctx.strokeStyle = 'rgba(255,255,255,1.0)' ctx.beginPath(0, 0); ctx.moveTo(0, h - Y); @@ -6807,15 +7269,15 @@ var SampleRNNGraph = function (_Component) { var vf = parseFloat(loss[loss.length - 1].training_loss) || 0; var vg = parseFloat(loss[0].training_loss) || 5; // console.log(vf) - var vv = 1 - (0, _util.norm)(vf, scaleMin, scaleMax / 2); - ctx.lineWidth = (1 - (0, _util.norm)(vf, scaleMin, scaleMax)) * 5; - ctx.strokeStyle = 'rgba(' + [(0, _util.randrange)(30, 190), (0, _util.randrange)(30, 150), (0, _util.randrange)(60, 120)].join(',') + ',' + 0.8 + ')'; + var vv = 1 - norm(vf, scaleMin, scaleMax / 2); + ctx.lineWidth = (1 - norm(vf, scaleMin, scaleMax)) * 5; + ctx.strokeStyle = 'rgba(' + [randrange(30, 190), randrange(30, 150), randrange(60, 120)].join(',') + ',' + 0.8 + ')'; var begun = false; loss.forEach(function (a, i) { var v = parseFloat(a.training_loss); if (!v) return; - var x = (0, _util.lerp)((i - 2) / (epochsMax / epochsScaleFactor) * epochsScaleFactor, wmin, wmax); - var y = (0, _util.lerp)((0, _util.norm)(v, scaleMin, scaleMax), hmax, hmin); + var x = lerp((i - 2) / (epochsMax / epochsScaleFactor) * epochsScaleFactor, wmin, wmax); + var y = lerp(norm(v, scaleMin, scaleMax), hmax, hmin); if (i === 0) { return; } @@ -6830,8 +7292,8 @@ var SampleRNNGraph = function (_Component) { ctx.stroke(); var i = loss.length - 1; var v = parseFloat(loss[i].training_loss); - var x = (0, _util.lerp)((i - 2) / (epochsMax / epochsScaleFactor) * epochsScaleFactor, wmin, wmax); - var y = (0, _util.lerp)((0, _util.norm)(v, scaleMin, scaleMax), hmax, hmin); + var x = lerp((i - 2) / (epochsMax / epochsScaleFactor) * epochsScaleFactor, wmin, wmax); + var y = lerp(norm(v, scaleMin, scaleMax), hmax, hmin); var fontSize = 9; ctx.font = 'italic ' + fontSize * devicePixelRatio + 'px "Georgia"'; ctx.fillText(key, x + fontSize, y + fontSize); @@ -6884,7 +7346,7 @@ var _reactRedux = __webpack_require__(/*! react-redux */ "./node_modules/react-r var _util = __webpack_require__(/*! ../../../util */ "./app/client/util/index.js"); -var util = _interopRequireWildcard(_util); +var _util2 = _interopRequireDefault(_util); var _samplernn = __webpack_require__(/*! ../samplernn.actions */ "./app/client/modules/samplernn/samplernn.actions.js"); @@ -6906,10 +7368,10 @@ var _dataset = __webpack_require__(/*! ../../../dataset/dataset.component */ "./ var _dataset2 = _interopRequireDefault(_dataset); -function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } - function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } } +function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; } function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } @@ -7139,7 +7601,7 @@ var _reactRedux = __webpack_require__(/*! react-redux */ "./node_modules/react-r var _util = __webpack_require__(/*! ../../../util */ "./app/client/util/index.js"); -var util = _interopRequireWildcard(_util); +var _util2 = _interopRequireDefault(_util); var _dataset = __webpack_require__(/*! ../../../dataset/dataset.new */ "./app/client/dataset/dataset.new.js"); @@ -7151,8 +7613,6 @@ var _samplernn2 = _interopRequireDefault(_samplernn); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } -function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } } - function SampleRNNNew(_ref) { var history = _ref.history; @@ -7191,7 +7651,7 @@ var _reactRedux = __webpack_require__(/*! react-redux */ "./node_modules/react-r var _util = __webpack_require__(/*! ../../../util */ "./app/client/util/index.js"); -var util = _interopRequireWildcard(_util); +var _util2 = _interopRequireDefault(_util); var _samplernn = __webpack_require__(/*! ../samplernn.actions */ "./app/client/modules/samplernn/samplernn.actions.js"); @@ -7207,10 +7667,10 @@ var _loading2 = _interopRequireDefault(_loading); var _fileList = __webpack_require__(/*! ../../../common/fileList.component */ "./app/client/common/fileList.component.js"); -function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } - function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } } +function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; } @@ -7241,10 +7701,10 @@ var SampleRNNResults = function (_Component) { datasetLookup = _props$samplernn$data.datasetLookup; // const { folderLookup } = samplernn - var renders = Object.keys(folderLookup).sort(util.sort.stringSort.asc).map(function (key) { + var renders = Object.keys(folderLookup).sort(_util2.default.sort.stringSort.asc).map(function (key) { var folder = folderLookup[key]; - var _util$sort$orderByFn = util.sort.orderByFn('epoch desc'), + var _util$sort$orderByFn = _util2.default.sort.orderByFn('epoch desc'), mapFn = _util$sort$orderByFn.mapFn, sortFn = _util$sort$orderByFn.sortFn; @@ -7367,7 +7827,7 @@ var _reactRedux = __webpack_require__(/*! react-redux */ "./node_modules/react-r var _util = __webpack_require__(/*! ../../../util */ "./app/client/util/index.js"); -var util = _interopRequireWildcard(_util); +var _util2 = _interopRequireDefault(_util); var _samplernn = __webpack_require__(/*! ../samplernn.actions */ "./app/client/modules/samplernn/samplernn.actions.js"); @@ -7407,10 +7867,10 @@ var _samplernn3 = __webpack_require__(/*! ../samplernn.module */ "./app/client/m var _samplernn4 = _interopRequireDefault(_samplernn3); -function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } - function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } } +function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; } @@ -7704,14 +8164,12 @@ var _types2 = _interopRequireDefault(_types); var _util = __webpack_require__(/*! ../util */ "./app/client/util/index.js"); -var util = _interopRequireWildcard(_util); +var _util2 = _interopRequireDefault(_util); var _moment = __webpack_require__(/*! moment */ "./node_modules/moment/moment.js"); var _moment2 = _interopRequireDefault(_moment); -function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } } - function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; } @@ -7726,8 +8184,8 @@ var queueInitialState = { completed: [] }; -var dateSort = util.sort.orderByFn('updated_at desc'); -var prioritySort = util.sort.orderByFn('priority asc'); +var dateSort = _util2.default.sort.orderByFn('updated_at desc'); +var prioritySort = _util2.default.sort.orderByFn('priority asc'); var queueReducer = function queueReducer() { var state = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : queueInitialState; @@ -9315,14 +9773,608 @@ exports.default = { /***/ }), +/***/ "./app/client/util/format.js": +/*!***********************************!*\ + !*** ./app/client/util/format.js ***! + \***********************************/ +/*! no static exports found */ +/***/ (function(module, exports, __webpack_require__) { + +"use strict"; + + +Object.defineProperty(exports, "__esModule", { + value: true +}); +exports.timeInSeconds = timeInSeconds; +exports.gerund = gerund; +exports.commatize = commatize; +exports.carbon_date = carbon_date; +exports.hush_views = hush_views; +exports.hush_threads = hush_threads; +exports.hush_size = hush_size; +exports.hush_null = hush_null; +exports.get_age = get_age; +exports.courtesy_s = courtesy_s; +function timeInSeconds(n) { + return (n / 10).toFixed(1) + ' s.'; +} +function gerund(s) { + return s.replace(/e?$/, 'ing'); +} +function commatize(n, radix) { + radix = radix || 1024; + var nums = [], + i, + counter = 0, + r = Math.floor; + if (n > radix) { + n /= radix; + nums.unshift(r(n * 10 % 10)); + nums.unshift("."); + } + do { + i = n % 10; + n = r(n / 10); + if (n && !(++counter % 3)) { + i = ' ' + r(i); + } + nums.unshift(r(i)); + } while (n); + return nums.join(""); +} +function carbon_date(date, no_bold) { + var span = (+new Date() - new Date(date)) / 1000, + color; + if (!no_bold && span < 86400) // modified today + { + color = "new"; + } else if (span < 604800) // modifed this week + { + color = "recent"; + } else if (span < 1209600) // modifed 2 weeks ago + { + color = "med"; + } else if (span < 3024000) // modifed 5 weeks ago + { + color = "old"; + } else if (span < 12315200) // modifed 6 months ago + { + color = "older"; + } else { + color = "quiet"; + } + return color; +} +function hush_views(n, bias, no_bold) { + var txt = commatize(n, 1000); + bias = bias || 1; + n = n || 0; + if (n < 30) { + return ["quiet", n + " v."]; + } + if (n < 200) { + return ["quiet", txt + " v."]; + } else if (n < 500) { + return ["quiet", txt + " v."]; + } else if (n < 1000) { + return ["old", txt + " v."]; + } else if (n < 5000) { + return ["med", txt + " kv."]; + } else if (no_bold || n < 10000) { + return ["recent", txt + " kv."]; + } else { + return ["new", txt + " kv."]; + } +} +function hush_threads(n, bias, no_bold) { + var txt = commatize(n, 1000); + bias = bias || 1; + n = n || 0; + if (n < 10) { + return ["quiet", n + " t."]; + } else if (n < 25) { + return ["old", txt + " t."]; + } else if (n < 50) { + return ["med", txt + " t."]; + } else if (no_bold || n < 100) { + return ["recent", txt + " t."]; + } else { + return ["new", txt + " t."]; + } +} +function hush_size(n, bias, no_bold) { + var txt = commatize(Math.round(n / 1024)); + bias = 1 || bias; + n = n || 0; + if (!n) { + return ['', '']; + } + if (n < 1000) { + return ["quiet", n + " b."]; + } + if (n < 1000000) { + return ["quiet", txt + " kb."]; + } else if (n < 20000000 / bias) { + return ["quiet", txt + " mb."]; + } else if (n < 50000000 / bias) { + return ["old", txt + " mb."]; + } else if (n < 80000000 / bias) { + return ["med", txt + " mb."]; + } else if (no_bold || n < 170000000 / bias) { + return ["recent", txt + " mb."]; + } else { + return ["new", txt + " mb."]; + } +} +function hush_null(n, unit, no_bold) { + var s = unit ? n + " " + unit + "." : n; + if (n < 3) { + return ["quiet", s]; + } else if (n < 6) { + return ["older", s]; + } else if (n < 10) { + return ["old", s]; + } else if (n < 16) { + return ["med", s]; + } else if (no_bold || n < 21) { + return ["recent", s]; + } else { + return ["new", s]; + } +} +function get_age(t) { + var age = Math.abs(+Date.now() - new Date(t)) / 1000; + var r = Math.floor; + var m; + if (age < 5) { + return "now"; + } + if (age < 60) { + return r(age) + "s"; + } + age /= 60; + if (age < 60) { + return r(age) + "m"; + } + m = r(age % 60); + age /= 60; + if (m > 0 && age < 2) { + return r(age) + "h" + m + "m"; + } + if (age < 24) { + return r(age) + "h"; + } + age /= 24; + if (age < 7) { + return r(age) + "d"; + } + age /= 7; + if (age < 12) { + return r(age) + "w"; + } + age /= 4; + if (age < 12) { + return r(age) + "m"; + } + age /= 12; + return r(age) + "y"; +} +function courtesy_s(n, s) { + return n == 1 ? "" : s || "s"; +} + +/***/ }), + +/***/ "./app/client/util/hidpi-canvas.js": +/*!*****************************************!*\ + !*** ./app/client/util/hidpi-canvas.js ***! + \*****************************************/ +/*! no static exports found */ +/***/ (function(module, exports, __webpack_require__) { + +"use strict"; + + +/** + * HiDPI Canvas Polyfill (1.0.10) + * + * Author: Jonathan D. Johnson (http://jondavidjohn.com) + * Homepage: https://github.com/jondavidjohn/hidpi-canvas-polyfill + * Issue Tracker: https://github.com/jondavidjohn/hidpi-canvas-polyfill/issues + * License: Apache-2.0 +*/ +(function (prototype) { + + var pixelRatio = function () { + var canvas = window.document.createElement('canvas'), + context = canvas.getContext('2d'), + backingStore = context.backingStorePixelRatio || context.webkitBackingStorePixelRatio || context.mozBackingStorePixelRatio || context.msBackingStorePixelRatio || context.oBackingStorePixelRatio || context.backingStorePixelRatio || 1; + + return (window.devicePixelRatio || 1) / backingStore; + }(), + forEach = function forEach(obj, func) { + for (var p in obj) { + if (obj.hasOwnProperty(p)) { + func(obj[p], p); + } + } + }, + ratioArgs = { + 'fillRect': 'all', + 'clearRect': 'all', + 'strokeRect': 'all', + 'moveTo': 'all', + 'lineTo': 'all', + 'arc': [0, 1, 2], + 'arcTo': 'all', + 'bezierCurveTo': 'all', + 'isPointinPath': 'all', + 'isPointinStroke': 'all', + 'quadraticCurveTo': 'all', + 'rect': 'all', + 'translate': 'all', + 'createRadialGradient': 'all', + 'createLinearGradient': 'all' + }; + + if (pixelRatio === 1) return; + + forEach(ratioArgs, function (value, key) { + prototype[key] = function (_super) { + return function () { + var i, + len, + args = Array.prototype.slice.call(arguments); + + if (value === 'all') { + args = args.map(function (a) { + return a * pixelRatio; + }); + } else if (Array.isArray(value)) { + for (i = 0, len = value.length; i < len; i++) { + args[value[i]] *= pixelRatio; + } + } + + return _super.apply(this, args); + }; + }(prototype[key]); + }); + + // Stroke lineWidth adjustment + prototype.stroke = function (_super) { + return function () { + this.lineWidth *= pixelRatio; + _super.apply(this, arguments); + this.lineWidth /= pixelRatio; + }; + }(prototype.stroke); + + // Text + // + prototype.fillText = function (_super) { + return function () { + var args = Array.prototype.slice.call(arguments); + + args[1] *= pixelRatio; // x + args[2] *= pixelRatio; // y + + this.font = this.font.replace(/(\d+)(px|em|rem|pt)/g, function (w, m, u) { + return m * pixelRatio + u; + }); + + _super.apply(this, args); + + this.font = this.font.replace(/(\d+)(px|em|rem|pt)/g, function (w, m, u) { + return m / pixelRatio + u; + }); + }; + }(prototype.fillText); + + prototype.strokeText = function (_super) { + return function () { + var args = Array.prototype.slice.call(arguments); + + args[1] *= pixelRatio; // x + args[2] *= pixelRatio; // y + + this.font = this.font.replace(/(\d+)(px|em|rem|pt)/g, function (w, m, u) { + return m * pixelRatio + u; + }); + + _super.apply(this, args); + + this.font = this.font.replace(/(\d+)(px|em|rem|pt)/g, function (w, m, u) { + return m / pixelRatio + u; + }); + }; + }(prototype.strokeText); +})(window.CanvasRenderingContext2D.prototype); +;(function (prototype) { + prototype.getContext = function (_super) { + return function (type) { + var backingStore, ratio, context; + + if (type == '2d-lodpi') { + context = _super.call(this, '2d'); + } else if (type === '2d') { + context = _super.call(this, '2d'); + + backingStore = context.backingStorePixelRatio || context.webkitBackingStorePixelRatio || context.mozBackingStorePixelRatio || context.msBackingStorePixelRatio || context.oBackingStorePixelRatio || context.backingStorePixelRatio || 1; + + ratio = (window.devicePixelRatio || 1) / backingStore; + + if (ratio > 1) { + this.style.height = this.height + 'px'; + this.style.width = this.width + 'px'; + this.width *= ratio; + this.height *= ratio; + } + } else { + context = _super.call(this, type); + } + + return context; + }; + }(prototype.getContext); +})(window.HTMLCanvasElement.prototype); + +/***/ }), + /***/ "./app/client/util/index.js": /*!**********************************!*\ !*** ./app/client/util/index.js ***! \**********************************/ /*! no static exports found */ -/***/ (function(module, exports) { +/***/ (function(module, exports, __webpack_require__) { + +"use strict"; + + +Object.defineProperty(exports, "__esModule", { + value: true +}); + +var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; + +var _sort = __webpack_require__(/*! ./sort */ "./app/client/util/sort.js"); + +var sort = _interopRequireWildcard(_sort); + +var _format = __webpack_require__(/*! ./format */ "./app/client/util/format.js"); + +var format = _interopRequireWildcard(_format); + +var _math = __webpack_require__(/*! ./math */ "./app/client/util/math.js"); + +var maths = _interopRequireWildcard(_math); + +__webpack_require__(/*! ./hidpi-canvas */ "./app/client/util/hidpi-canvas.js"); + +function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } } + +var is_iphone = !!(navigator.userAgent.match(/iPhone/i) || navigator.userAgent.match(/iPod/i)); +var is_ipad = !!navigator.userAgent.match(/iPad/i); +var is_android = !!navigator.userAgent.match(/Android/i); +var is_mobile = is_iphone || is_ipad || is_android; +var is_desktop = !is_mobile; + +var htmlClassList = document.body.parentNode.classList; +htmlClassList.add(is_desktop ? 'desktop' : 'mobile'); +htmlClassList.remove('loading'); + +// window.debug = false + +var allProgress = function allProgress(promises, progress_cb) { + var d = 0; + progress_cb(0, 0, promises.length); + promises.forEach(function (p) { + p.then(function (s) { + d += 1; + progress_cb(Math.floor(d * 100 / promises.length), d, promises.length); + return s; + }); + }); + return Promise.all(promises); +}; + +document.body.style.backgroundImage = 'linear-gradient(' + (maths.randint(40) + 40) + 'deg, #fde, #ffe)'; + +exports.default = _extends({}, maths, format, { + sort: sort, + allProgress: allProgress, + is_iphone: is_iphone, is_ipad: is_ipad, is_android: is_android, is_mobile: is_mobile, is_desktop: is_desktop +}); + +/***/ }), + +/***/ "./app/client/util/math.js": +/*!*********************************!*\ + !*** ./app/client/util/math.js ***! + \*********************************/ +/*! no static exports found */ +/***/ (function(module, exports, __webpack_require__) { + +"use strict"; -throw new Error("Module build failed: SyntaxError: Unexpected token (7:2)\n\n\u001b[0m \u001b[90m 5 | \u001b[39m\u001b[36mexport\u001b[39m {\n \u001b[90m 6 | \u001b[39m sort\u001b[33m,\u001b[39m\n\u001b[31m\u001b[1m>\u001b[22m\u001b[39m\u001b[90m 7 | \u001b[39m \u001b[33m...\u001b[39mmaths\u001b[33m,\u001b[39m\n \u001b[90m | \u001b[39m \u001b[31m\u001b[1m^\u001b[22m\u001b[39m\n \u001b[90m 8 | \u001b[39m \u001b[33m...\u001b[39mformat\u001b[33m,\u001b[39m\n \u001b[90m 9 | \u001b[39m}\n \u001b[90m 10 | \u001b[39m\u001b[0m\n"); + +Object.defineProperty(exports, "__esModule", { + value: true +}); +exports.randrange = randrange; +exports.randsign = randsign; +exports.choice = choice; +exports.angle = angle; +exports.dist = dist; +exports.xor = xor; +exports.quantize = quantize; +exports.shuffle = shuffle; +exports.gaussian = gaussian; +var mod = exports.mod = function mod(n, m) { + return n - m * Math.floor(n / m); +}; +var clamp = exports.clamp = function clamp(n, a, b) { + return n < a ? a : n < b ? n : b; +}; +var norm = exports.norm = function norm(n, a, b) { + return (n - a) / (b - a); +}; +var lerp = exports.lerp = function lerp(n, a, b) { + return (b - a) * n + a; +}; +var mix = exports.mix = function mix(n, a, b) { + return a * (1 - n) + b * n; +}; +var randint = exports.randint = function randint(n) { + return Math.floor(Math.random() * n); +}; +function randrange(a, b) { + return Math.random() * (b - a) + a; +} +function randsign() { + return Math.random() >= 0.5 ? -1 : 1; +} +function choice(a) { + return a[Math.floor(Math.random() * a.length)]; +} +function angle(x0, y0, x1, y1) { + return Math.atan2(y1 - y0, x1 - x0); +} +function dist(x0, y0, x1, y1) { + return Math.sqrt(Math.pow(x1 - x0, 2) + Math.pow(y1 - y0, 2)); +} +function xor(a, b) { + a = !!a;b = !!b;return (a || b) && !(a && b); +} +function quantize(a, b) { + return Math.floor(a / b) * b; +} +function shuffle(a) { + for (var i = a.length; i > 0; i--) { + var r = randint(i); + var swap = a[i - 1]; + a[i - 1] = a[r]; + a[r] = swap; + } + return a; +} +// returns a gaussian random function with the given mean and stdev. +function gaussian(mean, stdev) { + var y2 = void 0; + var use_last = false; + return function () { + var y1 = void 0; + if (use_last) { + y1 = y2; + use_last = false; + } else { + var x1 = void 0, + x2 = void 0, + w = void 0; + do { + x1 = 2.0 * Math.random() - 1.0; + x2 = 2.0 * Math.random() - 1.0; + w = x1 * x1 + x2 * x2; + } while (w >= 1.0); + w = Math.sqrt(-2.0 * Math.log(w) / w); + y1 = x1 * w; + y2 = x2 * w; + use_last = true; + } + + var retval = mean + stdev * y1; + if (retval > 0) return retval; + return -retval; + }; +} + +/***/ }), + +/***/ "./app/client/util/sort.js": +/*!*********************************!*\ + !*** ./app/client/util/sort.js ***! + \*********************************/ +/*! no static exports found */ +/***/ (function(module, exports, __webpack_require__) { + +"use strict"; + + +Object.defineProperty(exports, "__esModule", { + value: true +}); + +var _slicedToArray = function () { function sliceIterator(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"]) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } return function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { return sliceIterator(arr, i); } else { throw new TypeError("Invalid attempt to destructure non-iterable instance"); } }; }(); + +var numericSort = exports.numericSort = { + asc: function asc(a, b) { + return a[0] - b[0]; + }, + desc: function desc(a, b) { + return b[0] - a[0]; + } +}; +var stringSort = exports.stringSort = { + asc: function asc(a, b) { + return a[0].localeCompare(b[0]); + }, + desc: function desc(a, b) { + return b[0].localeCompare(a[0]); + } +}; +var orderByFn = exports.orderByFn = function orderByFn() { + var s = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'name asc'; + + var _s$split = s.split(' '), + _s$split2 = _slicedToArray(_s$split, 2), + _s$split2$ = _s$split2[0], + field = _s$split2$ === undefined ? 'name' : _s$split2$, + _s$split2$2 = _s$split2[1], + direction = _s$split2$2 === undefined ? 'asc' : _s$split2$2; + + var mapFn = void 0, + sortFn = void 0; + switch (field) { + case 'epoch': + mapFn = function mapFn(a) { + return [parseInt(a.epoch || a.epochs) || 0, a]; + }; + sortFn = numericSort[direction]; + break; + case 'size': + mapFn = function mapFn(a) { + return [parseInt(a.size) || 0, a]; + }; + sortFn = numericSort[direction]; + break; + case 'date': + mapFn = function mapFn(a) { + return [+new Date(a.date || a.created_at), a]; + }; + sortFn = numericSort[direction]; + break; + case 'updated_at': + mapFn = function mapFn(a) { + return [+new Date(a.updated_at), a]; + }; + sortFn = numericSort[direction]; + break; + case 'priority': + mapFn = function mapFn(a) { + return [parseInt(a.priority) || parseInt(a.id) || 1000, a]; + }; + sortFn = numericSort[direction]; + case 'name': + default: + mapFn = function mapFn(a) { + return [a.name || "", a]; + }; + sortFn = stringSort[direction]; + break; + } + return { mapFn: mapFn, sortFn: sortFn }; +}; /***/ }), diff --git a/public/bundle.js.map b/public/bundle.js.map index ebc3251..b00435f 100644 --- a/public/bundle.js.map +++ b/public/bundle.js.map @@ -1 +1 @@ -{"version":3,"file":"bundle.js","sources":["webpack:///webpack/bootstrap","webpack:///./app/client/actions.js","webpack:///./app/client/api/crud.actions.js","webpack:///./app/client/api/crud.fetch.js","webpack:///./app/client/api/crud.types.js","webpack:///./app/client/api/crud.upload.js","webpack:///./app/client/api/index.js","webpack:///./app/client/api/parser.js","webpack:///./app/client/common/audioPlayer/audioPlayer.actions.js","webpack:///./app/client/common/audioPlayer/audioPlayer.component.js","webpack:///./app/client/common/audioPlayer/audioPlayer.reducer.js","webpack:///./app/client/common/button.component.js","webpack:///./app/client/common/fileList.component.js","webpack:///./app/client/common/fileUpload.component.js","webpack:///./app/client/common/gallery.component.js","webpack:///./app/client/common/group.component.js","webpack:///./app/client/common/header.component.js","webpack:///./app/client/common/loading.component.js","webpack:///./app/client/common/param.component.js","webpack:///./app/client/common/paramGroup.component.js","webpack:///./app/client/common/player.component.js","webpack:///./app/client/common/progress.component.js","webpack:///./app/client/common/select.component.js","webpack:///./app/client/common/slider.component.js","webpack:///./app/client/common/textInput.component.js","webpack:///./app/client/dashboard/dashboard.actions.js","webpack:///./app/client/dashboard/dashboard.component.js","webpack:///./app/client/dashboard/dashboard.reducer.js","webpack:///./app/client/dashboard/dashboardheader.component.js","webpack:///./app/client/dashboard/tasklist.component.js","webpack:///./app/client/dataset/dataset.actions.js","webpack:///./app/client/dataset/dataset.component.js","webpack:///./app/client/dataset/dataset.form.js","webpack:///./app/client/dataset/dataset.loader.js","webpack:///./app/client/dataset/dataset.new.js","webpack:///./app/client/dataset/dataset.reducer.js","webpack:///./app/client/dataset/upload.reducer.js","webpack:///./app/client/dataset/upload.status.js","webpack:///./app/client/index.jsx","webpack:///./app/client/live/live.actions.js","webpack:///./app/client/live/live.reducer.js","webpack:///./app/client/live/player.js","webpack:///./app/client/live/whammy.js","webpack:///./app/client/modules/index.js","webpack:///./app/client/modules/module.reducer.js","webpack:///./app/client/modules/pix2pix/index.js","webpack:///./app/client/modules/pix2pix/pix2pix.actions.js","webpack:///./app/client/modules/pix2pix/pix2pix.module.js","webpack:///./app/client/modules/pix2pix/pix2pix.reducer.js","webpack:///./app/client/modules/pix2pix/pix2pix.tasks.js","webpack:///./app/client/modules/pix2pix/views/pix2pix.live.js","webpack:///./app/client/modules/pix2pix/views/pix2pix.new.js","webpack:///./app/client/modules/pix2pix/views/pix2pix.show.js","webpack:///./app/client/modules/pix2wav/index.js","webpack:///./app/client/modules/pix2wav/pix2wav.reducer.js","webpack:///./app/client/modules/samplernn/index.js","webpack:///./app/client/modules/samplernn/samplernn.actions.js","webpack:///./app/client/modules/samplernn/samplernn.module.js","webpack:///./app/client/modules/samplernn/samplernn.reducer.js","webpack:///./app/client/modules/samplernn/samplernn.tasks.js","webpack:///./app/client/modules/samplernn/views/samplernn.graph.js","webpack:///./app/client/modules/samplernn/views/samplernn.import.js","webpack:///./app/client/modules/samplernn/views/samplernn.new.js","webpack:///./app/client/modules/samplernn/views/samplernn.results.js","webpack:///./app/client/modules/samplernn/views/samplernn.show.js","webpack:///./app/client/queue/queue.actions.js","webpack:///./app/client/queue/queue.reducer.js","webpack:///./app/client/socket/index.js","webpack:///./app/client/socket/socket.actions.js","webpack:///./app/client/socket/socket.api.js","webpack:///./app/client/socket/socket.connection.js","webpack:///./app/client/socket/socket.live.js","webpack:///./app/client/socket/socket.system.js","webpack:///./app/client/socket/socket.task.js","webpack:///./app/client/store.js","webpack:///./app/client/system/system.actions.js","webpack:///./app/client/system/system.component.js","webpack:///./app/client/system/system.reducer.js","webpack:///./app/client/types.js","webpack:///./node_modules/fbjs/lib/emptyFunction.js","webpack:///./node_modules/fbjs/lib/invariant.js","webpack:///./node_modules/fbjs/lib/warning.js","webpack:///./node_modules/fetch-jsonp/build/fetch-jsonp.js","webpack:///./node_modules/file-saver/FileSaver.js","webpack:///./node_modules/history/DOMUtils.js","webpack:///./node_modules/history/LocationUtils.js","webpack:///./node_modules/history/PathUtils.js","webpack:///./node_modules/history/createBrowserHistory.js","webpack:///./node_modules/history/createHashHistory.js","webpack:///./node_modules/history/createMemoryHistory.js","webpack:///./node_modules/history/createTransitionManager.js","webpack:///./node_modules/history/es/DOMUtils.js","webpack:///./node_modules/history/es/LocationUtils.js","webpack:///./node_modules/history/es/PathUtils.js","webpack:///./node_modules/history/es/createBrowserHistory.js","webpack:///./node_modules/history/es/createHashHistory.js","webpack:///./node_modules/history/es/createMemoryHistory.js","webpack:///./node_modules/history/es/createTransitionManager.js","webpack:///./node_modules/history/es/index.js","webpack:///./node_modules/hoist-non-react-statics/index.js","webpack:///./node_modules/invariant/browser.js","webpack:///./node_modules/lodash-es/_Symbol.js","webpack:///./node_modules/lodash-es/_baseGetTag.js","webpack:///./node_modules/lodash-es/_freeGlobal.js","webpack:///./node_modules/lodash-es/_getPrototype.js","webpack:///./node_modules/lodash-es/_getRawTag.js","webpack:///./node_modules/lodash-es/_objectToString.js","webpack:///./node_modules/lodash-es/_overArg.js","webpack:///./node_modules/lodash-es/_root.js","webpack:///./node_modules/lodash-es/isObjectLike.js","webpack:///./node_modules/lodash-es/isPlainObject.js","webpack:///./node_modules/moment/locale/af.js","webpack:///./node_modules/moment/locale/ar-dz.js","webpack:///./node_modules/moment/locale/ar-kw.js","webpack:///./node_modules/moment/locale/ar-ly.js","webpack:///./node_modules/moment/locale/ar-ma.js","webpack:///./node_modules/moment/locale/ar-sa.js","webpack:///./node_modules/moment/locale/ar-tn.js","webpack:///./node_modules/moment/locale/ar.js","webpack:///./node_modules/moment/locale/az.js","webpack:///./node_modules/moment/locale/be.js","webpack:///./node_modules/moment/locale/bg.js","webpack:///./node_modules/moment/locale/bm.js","webpack:///./node_modules/moment/locale/bn.js","webpack:///./node_modules/moment/locale/bo.js","webpack:///./node_modules/moment/locale/br.js","webpack:///./node_modules/moment/locale/bs.js","webpack:///./node_modules/moment/locale/ca.js","webpack:///./node_modules/moment/locale/cs.js","webpack:///./node_modules/moment/locale/cv.js","webpack:///./node_modules/moment/locale/cy.js","webpack:///./node_modules/moment/locale/da.js","webpack:///./node_modules/moment/locale/de-at.js","webpack:///./node_modules/moment/locale/de-ch.js","webpack:///./node_modules/moment/locale/de.js","webpack:///./node_modules/moment/locale/dv.js","webpack:///./node_modules/moment/locale/el.js","webpack:///./node_modules/moment/locale/en-au.js","webpack:///./node_modules/moment/locale/en-ca.js","webpack:///./node_modules/moment/locale/en-gb.js","webpack:///./node_modules/moment/locale/en-ie.js","webpack:///./node_modules/moment/locale/en-il.js","webpack:///./node_modules/moment/locale/en-nz.js","webpack:///./node_modules/moment/locale/eo.js","webpack:///./node_modules/moment/locale/es-do.js","webpack:///./node_modules/moment/locale/es-us.js","webpack:///./node_modules/moment/locale/es.js","webpack:///./node_modules/moment/locale/et.js","webpack:///./node_modules/moment/locale/eu.js","webpack:///./node_modules/moment/locale/fa.js","webpack:///./node_modules/moment/locale/fi.js","webpack:///./node_modules/moment/locale/fo.js","webpack:///./node_modules/moment/locale/fr-ca.js","webpack:///./node_modules/moment/locale/fr-ch.js","webpack:///./node_modules/moment/locale/fr.js","webpack:///./node_modules/moment/locale/fy.js","webpack:///./node_modules/moment/locale/gd.js","webpack:///./node_modules/moment/locale/gl.js","webpack:///./node_modules/moment/locale/gom-latn.js","webpack:///./node_modules/moment/locale/gu.js","webpack:///./node_modules/moment/locale/he.js","webpack:///./node_modules/moment/locale/hi.js","webpack:///./node_modules/moment/locale/hr.js","webpack:///./node_modules/moment/locale/hu.js","webpack:///./node_modules/moment/locale/hy-am.js","webpack:///./node_modules/moment/locale/id.js","webpack:///./node_modules/moment/locale/is.js","webpack:///./node_modules/moment/locale/it.js","webpack:///./node_modules/moment/locale/ja.js","webpack:///./node_modules/moment/locale/jv.js","webpack:///./node_modules/moment/locale/ka.js","webpack:///./node_modules/moment/locale/kk.js","webpack:///./node_modules/moment/locale/km.js","webpack:///./node_modules/moment/locale/kn.js","webpack:///./node_modules/moment/locale/ko.js","webpack:///./node_modules/moment/locale/ky.js","webpack:///./node_modules/moment/locale/lb.js","webpack:///./node_modules/moment/locale/lo.js","webpack:///./node_modules/moment/locale/lt.js","webpack:///./node_modules/moment/locale/lv.js","webpack:///./node_modules/moment/locale/me.js","webpack:///./node_modules/moment/locale/mi.js","webpack:///./node_modules/moment/locale/mk.js","webpack:///./node_modules/moment/locale/ml.js","webpack:///./node_modules/moment/locale/mn.js","webpack:///./node_modules/moment/locale/mr.js","webpack:///./node_modules/moment/locale/ms-my.js","webpack:///./node_modules/moment/locale/ms.js","webpack:///./node_modules/moment/locale/mt.js","webpack:///./node_modules/moment/locale/my.js","webpack:///./node_modules/moment/locale/nb.js","webpack:///./node_modules/moment/locale/ne.js","webpack:///./node_modules/moment/locale/nl-be.js","webpack:///./node_modules/moment/locale/nl.js","webpack:///./node_modules/moment/locale/nn.js","webpack:///./node_modules/moment/locale/pa-in.js","webpack:///./node_modules/moment/locale/pl.js","webpack:///./node_modules/moment/locale/pt-br.js","webpack:///./node_modules/moment/locale/pt.js","webpack:///./node_modules/moment/locale/ro.js","webpack:///./node_modules/moment/locale/ru.js","webpack:///./node_modules/moment/locale/sd.js","webpack:///./node_modules/moment/locale/se.js","webpack:///./node_modules/moment/locale/si.js","webpack:///./node_modules/moment/locale/sk.js","webpack:///./node_modules/moment/locale/sl.js","webpack:///./node_modules/moment/locale/sq.js","webpack:///./node_modules/moment/locale/sr-cyrl.js","webpack:///./node_modules/moment/locale/sr.js","webpack:///./node_modules/moment/locale/ss.js","webpack:///./node_modules/moment/locale/sv.js","webpack:///./node_modules/moment/locale/sw.js","webpack:///./node_modules/moment/locale/ta.js","webpack:///./node_modules/moment/locale/te.js","webpack:///./node_modules/moment/locale/tet.js","webpack:///./node_modules/moment/locale/tg.js","webpack:///./node_modules/moment/locale/th.js","webpack:///./node_modules/moment/locale/tl-ph.js","webpack:///./node_modules/moment/locale/tlh.js","webpack:///./node_modules/moment/locale/tr.js","webpack:///./node_modules/moment/locale/tzl.js","webpack:///./node_modules/moment/locale/tzm-latn.js","webpack:///./node_modules/moment/locale/tzm.js","webpack:///./node_modules/moment/locale/ug-cn.js","webpack:///./node_modules/moment/locale/uk.js","webpack:///./node_modules/moment/locale/ur.js","webpack:///./node_modules/moment/locale/uz-latn.js","webpack:///./node_modules/moment/locale/uz.js","webpack:///./node_modules/moment/locale/vi.js","webpack:///./node_modules/moment/locale/x-pseudo.js","webpack:///./node_modules/moment/locale/yo.js","webpack:///./node_modules/moment/locale/zh-cn.js","webpack:///./node_modules/moment/locale/zh-hk.js","webpack:///./node_modules/moment/locale/zh-tw.js","webpack:///./node_modules/moment/moment.js","webpack:///./node_modules/node-fetch/browser.js","webpack:///./node_modules/object-assign/index.js","webpack:///./node_modules/preact-compat/dist/preact-compat.es.js","webpack:///./node_modules/preact/dist/preact.esm.js","webpack:///./node_modules/process/browser.js","webpack:///./node_modules/prop-types/checkPropTypes.js","webpack:///./node_modules/prop-types/factoryWithTypeCheckers.js","webpack:///./node_modules/prop-types/index.js","webpack:///./node_modules/prop-types/lib/ReactPropTypesSecret.js","webpack:///./node_modules/react-redux/es/components/Provider.js","webpack:///./node_modules/react-redux/es/components/connectAdvanced.js","webpack:///./node_modules/react-redux/es/connect/connect.js","webpack:///./node_modules/react-redux/es/connect/mapDispatchToProps.js","webpack:///./node_modules/react-redux/es/connect/mapStateToProps.js","webpack:///./node_modules/react-redux/es/connect/mergeProps.js","webpack:///./node_modules/react-redux/es/connect/selectorFactory.js","webpack:///./node_modules/react-redux/es/connect/verifySubselectors.js","webpack:///./node_modules/react-redux/es/connect/wrapMapToProps.js","webpack:///./node_modules/react-redux/es/index.js","webpack:///./node_modules/react-redux/es/utils/PropTypes.js","webpack:///./node_modules/react-redux/es/utils/Subscription.js","webpack:///./node_modules/react-redux/es/utils/shallowEqual.js","webpack:///./node_modules/react-redux/es/utils/verifyPlainObject.js","webpack:///./node_modules/react-redux/es/utils/warning.js","webpack:///./node_modules/react-router-dom/es/BrowserRouter.js","webpack:///./node_modules/react-router-dom/es/HashRouter.js","webpack:///./node_modules/react-router-dom/es/Link.js","webpack:///./node_modules/react-router-dom/es/MemoryRouter.js","webpack:///./node_modules/react-router-dom/es/NavLink.js","webpack:///./node_modules/react-router-dom/es/Prompt.js","webpack:///./node_modules/react-router-dom/es/Redirect.js","webpack:///./node_modules/react-router-dom/es/Route.js","webpack:///./node_modules/react-router-dom/es/Router.js","webpack:///./node_modules/react-router-dom/es/StaticRouter.js","webpack:///./node_modules/react-router-dom/es/Switch.js","webpack:///./node_modules/react-router-dom/es/index.js","webpack:///./node_modules/react-router-dom/es/matchPath.js","webpack:///./node_modules/react-router-dom/es/withRouter.js","webpack:///./node_modules/react-router-redux/lib/actions.js","webpack:///./node_modules/react-router-redux/lib/index.js","webpack:///./node_modules/react-router-redux/lib/middleware.js","webpack:///./node_modules/react-router-redux/lib/reducer.js","webpack:///./node_modules/react-router-redux/lib/sync.js","webpack:///./node_modules/react-router/es/MemoryRouter.js","webpack:///./node_modules/react-router/es/Prompt.js","webpack:///./node_modules/react-router/es/Redirect.js","webpack:///./node_modules/react-router/es/Route.js","webpack:///./node_modules/react-router/es/Router.js","webpack:///./node_modules/react-router/es/StaticRouter.js","webpack:///./node_modules/react-router/es/Switch.js","webpack:///./node_modules/react-router/es/matchPath.js","webpack:///./node_modules/react-router/es/withRouter.js","webpack:///./node_modules/react-router/node_modules/isarray/index.js","webpack:///./node_modules/react-router/node_modules/path-to-regexp/index.js","webpack:///./node_modules/redux-thunk/lib/index.js","webpack:///./node_modules/redux/es/redux.js","webpack:///./node_modules/resolve-pathname/index.js","webpack:///./node_modules/symbol-observable/es/index.js","webpack:///./node_modules/symbol-observable/es/ponyfill.js","webpack:///./node_modules/uuid/lib/bytesToUuid.js","webpack:///./node_modules/uuid/lib/rng-browser.js","webpack:///./node_modules/uuid/v1.js","webpack:///./node_modules/value-equal/index.js","webpack:///./node_modules/warning/browser.js","webpack:///(webpack)/buildin/amd-define.js","webpack:///(webpack)/buildin/amd-options.js","webpack:///(webpack)/buildin/global.js","webpack:///(webpack)/buildin/harmony-module.js","webpack:///(webpack)/buildin/module.js"],"sourcesContent":[" \t// The module cache\n \tvar installedModules = {};\n\n \t// The require function\n \tfunction __webpack_require__(moduleId) {\n\n \t\t// Check if module is in cache\n \t\tif(installedModules[moduleId]) {\n \t\t\treturn installedModules[moduleId].exports;\n \t\t}\n \t\t// Create a new module (and put it into the cache)\n \t\tvar module = installedModules[moduleId] = {\n \t\t\ti: moduleId,\n \t\t\tl: false,\n \t\t\texports: {}\n \t\t};\n\n \t\t// Execute the module function\n \t\tmodules[moduleId].call(module.exports, module, module.exports, __webpack_require__);\n\n \t\t// Flag the module as loaded\n \t\tmodule.l = true;\n\n \t\t// Return the exports of the module\n \t\treturn module.exports;\n \t}\n\n\n \t// expose the modules object (__webpack_modules__)\n \t__webpack_require__.m = modules;\n\n \t// expose the module cache\n \t__webpack_require__.c = installedModules;\n\n \t// define getter function for harmony exports\n \t__webpack_require__.d = function(exports, name, getter) {\n \t\tif(!__webpack_require__.o(exports, name)) {\n \t\t\tObject.defineProperty(exports, name, {\n \t\t\t\tconfigurable: false,\n \t\t\t\tenumerable: true,\n \t\t\t\tget: getter\n \t\t\t});\n \t\t}\n \t};\n\n \t// define __esModule on exports\n \t__webpack_require__.r = function(exports) {\n \t\tObject.defineProperty(exports, '__esModule', { value: true });\n \t};\n\n \t// getDefaultExport function for compatibility with non-harmony modules\n \t__webpack_require__.n = function(module) {\n \t\tvar getter = module && module.__esModule ?\n \t\t\tfunction getDefault() { return module['default']; } :\n \t\t\tfunction getModuleExports() { return module; };\n \t\t__webpack_require__.d(getter, 'a', getter);\n \t\treturn getter;\n \t};\n\n \t// Object.prototype.hasOwnProperty.call\n \t__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };\n\n \t// __webpack_public_path__\n \t__webpack_require__.p = \"\";\n\n\n \t// Load entry module and return exports\n \treturn __webpack_require__(__webpack_require__.s = \"./app/client/index.jsx\");\n","'use strict';\n\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\n\nvar _redux = require('redux');\n\nvar _api = require('./api');\n\nvar _live = require('./live/live.actions');\n\nvar liveActions = _interopRequireWildcard(_live);\n\nvar _queue = require('./queue/queue.actions');\n\nvar queueActions = _interopRequireWildcard(_queue);\n\nvar _system = require('./system/system.actions');\n\nvar systemActions = _interopRequireWildcard(_system);\n\nvar _socket = require('./socket/socket.actions');\n\nvar socketActions = _interopRequireWildcard(_socket);\n\nvar _dataset = require('./dataset/dataset.actions');\n\nvar datasetActions = _interopRequireWildcard(_dataset);\n\nvar _audioPlayer = require('./common/audioPlayer/audioPlayer.actions');\n\nvar audioPlayerActions = _interopRequireWildcard(_audioPlayer);\n\nvar _store = require('./store');\n\nfunction _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } }\n\nexports.default = Object.keys(_api.actions).map(function (a) {\n return [a, _api.actions[a]];\n}).concat([['live', liveActions], ['queue', queueActions], ['system', systemActions], ['dataset', datasetActions], ['audioPlayer', audioPlayerActions]]).map(function (p) {\n return [p[0], (0, _redux.bindActionCreators)(p[1], _store.store.dispatch)];\n}).concat([['socket', socketActions]]).reduce(function (a, b) {\n return (a[b[0]] = b[1]) && a;\n}, {});","'use strict';\n\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\nexports.crud_action = undefined;\nexports.crud_actions = crud_actions;\n\nvar _crud = require('./crud.fetch');\n\nvar _crud2 = require('./crud.types');\n\nvar _crud3 = require('./crud.upload');\n\nfunction crud_actions(type) {\n var fetch_type = (0, _crud.crud_fetch)(type);\n return ['index', 'show', 'create', 'update', 'destroy'].reduce(function (lookup, param) {\n lookup[param] = crud_action(type, param, function (q) {\n return fetch_type[param](q);\n });\n return lookup;\n }, {\n action: function action(method, fn) {\n return crud_action(type, method, fn);\n },\n upload: function upload(id, fd) {\n return (0, _crud3.upload_action)(type, id, fd);\n }\n });\n}\n\nvar crud_action = exports.crud_action = function crud_action(type, method, fn) {\n return function (q) {\n return function (dispatch) {\n return new Promise(function (resolve, reject) {\n dispatch({ type: (0, _crud2.as_type)(type, method + '_loading') });\n fn(q).then(function (data) {\n dispatch({ type: (0, _crud2.as_type)(type, method), data: data });\n resolve(data);\n }).catch(function (e) {\n dispatch({ type: (0, _crud2.as_type)(type, method + '_error') });\n reject(e);\n });\n });\n };\n };\n};","'use strict';\n\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\nexports.crud_fetch = crud_fetch;\nexports.postBody = postBody;\n\nvar _nodeFetch = require('node-fetch');\n\nvar _nodeFetch2 = _interopRequireDefault(_nodeFetch);\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\nfunction crud_fetch(type, tag) {\n var uri = '/api/' + type + '/' + (tag || '');\n return {\n index: function index(q) {\n return (0, _nodeFetch2.default)(_get_url(uri, q), _get_headers()).then(function (req) {\n return req.json();\n }).catch(error);\n },\n\n show: function show(id) {\n return (0, _nodeFetch2.default)(uri + id).then(function (req) {\n return req.json();\n }).catch(error);\n },\n\n create: function create(data) {\n return (0, _nodeFetch2.default)(uri, post(data)).then(function (req) {\n return req.json();\n }).catch(error);\n },\n\n update: function update(data) {\n return (0, _nodeFetch2.default)(uri + data.id, put(data)).then(function (req) {\n return req.json();\n }).catch(error);\n },\n\n destroy: function destroy(data) {\n return (0, _nodeFetch2.default)(uri + data.id, _destroy(data)).then(function (req) {\n return req.json();\n }).catch(error);\n }\n };\n}\n\nfunction _get_url(_url, data) {\n var url = new URL(window.location.origin + _url);\n if (data) {\n Object.keys(data).forEach(function (key) {\n return url.searchParams.append(key, data[key]);\n });\n }\n return url;\n}\nfunction _get_headers() {\n return {\n method: 'GET',\n headers: {\n 'Accept': 'application/json'\n }\n };\n}\nfunction post(data) {\n return {\n method: 'POST',\n body: JSON.stringify(data),\n headers: {\n 'Accept': 'application/json',\n 'Content-Type': 'application/json'\n }\n };\n}\nfunction postBody(data) {\n return {\n method: 'POST',\n body: data,\n headers: {\n 'Accept': 'application/json'\n }\n };\n}\nfunction put(data) {\n return {\n method: 'PUT',\n body: JSON.stringify(data),\n headers: {\n 'Accept': 'application/json',\n 'Content-Type': 'application/json'\n }\n };\n}\nfunction _destroy(data) {\n return {\n method: 'DELETE',\n body: JSON.stringify(data),\n headers: {\n 'Accept': 'application/json',\n 'Content-Type': 'application/json'\n }\n };\n}\nfunction error(err) {\n console.warn(err);\n}","'use strict';\n\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\nvar as_type = exports.as_type = function as_type(a, b) {\n return [a, b].join('_').toUpperCase();\n};\n\nvar crud_type = exports.crud_type = function crud_type(type) {\n var actions = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];\n return actions.concat(['index_loading', 'index', 'index_error', 'show_loading', 'show', 'show_error', 'create_loading', 'create', 'create_error', 'update_loading', 'update', 'update_error', 'destroy_loading', 'destroy', 'destroy_error', 'upload_loading', 'upload_progress', 'upload_waiting', 'upload_complete', 'upload_error', 'sort']).reduce(function (a, b) {\n return (a[b] = as_type(type, b)) && a;\n }, {});\n};","'use strict';\n\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\nexports.upload_action = undefined;\nexports.crud_upload = crud_upload;\n\nvar _crud = require('./crud.types');\n\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\n\nfunction crud_upload(type, fd, data, dispatch) {\n return new Promise(function (resolve, reject) {\n var id = data.id;\n\n Object.keys(data).forEach(function (key) {\n if (key !== 'id') {\n fd.append(key, data[key]);\n }\n });\n\n var xhr = new XMLHttpRequest();\n xhr.upload.addEventListener(\"progress\", uploadProgress, false);\n xhr.addEventListener(\"load\", uploadComplete, false);\n xhr.addEventListener(\"error\", uploadFailed, false);\n xhr.addEventListener(\"abort\", uploadCancelled, false);\n xhr.open(\"POST\", '/api/' + type + '/' + id + '/upload/');\n xhr.send(fd);\n\n dispatch && dispatch({ type: (0, _crud.as_type)(type, 'upload_loading') });\n\n var complete = false;\n\n function uploadProgress(e) {\n if (e.lengthComputable) {\n var percent = Math.round(e.loaded * 100 / e.total) || 0;\n if (percent > 99) {\n dispatch && dispatch(_defineProperty({\n type: (0, _crud.as_type)(type, 'upload_waiting'),\n percent: percent\n }, type, id));\n } else {\n dispatch && dispatch(_defineProperty({\n type: (0, _crud.as_type)(type, 'upload_progress'),\n percent: percent\n }, type, id));\n }\n } else {\n dispatch && dispatch(_defineProperty({\n type: (0, _crud.as_type)(type, 'upload_error'),\n error: 'unable to compute upload progress'\n }, type, id));\n }\n }\n\n function uploadComplete(e) {\n var parsed = void 0;\n try {\n parsed = JSON.parse(e.target.responseText);\n } catch (e) {\n dispatch && dispatch(_defineProperty({\n type: (0, _crud.as_type)(type, 'upload_error'),\n error: 'upload failed'\n }, type, id));\n reject(e);\n return;\n }\n dispatch && dispatch(_defineProperty({\n type: (0, _crud.as_type)(type, 'upload_complete'),\n data: parsed\n }, type, id));\n if (parsed.files && parsed.files.length) {\n parsed.files.forEach(function (file) {\n console.log(file);\n dispatch && dispatch({\n type: (0, _crud.as_type)('file', 'create'),\n data: file\n });\n });\n }\n resolve(parsed);\n }\n\n function uploadFailed(evt) {\n dispatch && dispatch(_defineProperty({\n type: (0, _crud.as_type)(type, 'upload_error'),\n error: 'upload failed'\n }, type, id));\n reject(evt);\n }\n\n function uploadCancelled(evt) {\n dispatch && dispatch(_defineProperty({\n type: (0, _crud.as_type)(type, 'upload_error'),\n error: 'upload cancelled'\n }, type, id));\n reject(evt);\n }\n });\n}\n\nvar upload_action = exports.upload_action = function upload_action(type, id, fd) {\n return function (dispatch) {\n return crud_upload(type, id, fd, dispatch);\n };\n};","'use strict';\n\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\nexports.actions = exports.parser = exports.util = undefined;\n\nvar _crud = require('./crud.actions');\n\nvar _util = require('../util');\n\nvar util = _interopRequireWildcard(_util);\n\nvar _parser = require('./parser');\n\nvar parser = _interopRequireWildcard(_parser);\n\nfunction _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } }\n\n/*\nfor our crud events, create corresponding actions\nthe actions fire a 'loading' event, call the underlying api method, and then resolve.\nso you can do ... \n import { folderActions } from '../../api'\n folderActions.index({ module: 'samplernn' })\n folderActions.show(12)\n folderActions.create({ module: 'samplernn', name: 'foo' })\n folderActions.update(12, { module: 'pix2pix' })\n folderActions.destroy(12, { confirm: true })\n folderActions.upload(12, form_data)\n*/\n\nexports.util = util;\nexports.parser = parser;\nvar actions = exports.actions = ['folder', 'file', 'dataset', 'task', 'user'].reduce(function (a, b) {\n return (a[b] = (0, _crud.crud_actions)(b)) && a;\n}, {});","'use strict';\n\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\nexports.tumblr = exports.thumbnail = exports.loadImage = exports.tag = exports.parse = exports.lookup = exports.integrations = undefined;\n\nvar _nodeFetch = require('node-fetch');\n\nvar _nodeFetch2 = _interopRequireDefault(_nodeFetch);\n\nvar _fetchJsonp = require('fetch-jsonp');\n\nvar _fetchJsonp2 = _interopRequireDefault(_fetchJsonp);\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\nvar integrations = exports.integrations = [{\n type: 'image',\n regex: /\\.(jpeg|jpg|gif|png|svg)(\\?.*)?$/i,\n fetch: function fetch(url, done) {\n var img = new Image();\n img.onload = function () {\n if (!img) return;\n var width = img.naturalWidth,\n height = img.naturalHeight;\n img = null;\n done({\n url: url,\n type: \"image\",\n token: \"\",\n thumbnail: \"\",\n title: \"\",\n width: width,\n height: height\n });\n };\n img.src = url;\n if (img.complete) {\n img.onload();\n }\n },\n tag: function tag(media) {\n return '';\n }\n}, {\n type: 'video',\n regex: /\\.(mp4|webm)(\\?.*)?$/i,\n fetch: function fetch(url, done) {\n var video = document.createElement(\"video\");\n var url_parts = url.replace(/\\?.*$/, \"\").split(\"/\");\n var filename = url_parts[url_parts.length - 1];\n video.addEventListener(\"loadedmetadata\", function () {\n var width = video.videoWidth,\n height = video.videoHeight;\n video = null;\n done({\n url: url,\n type: \"video\",\n token: url,\n thumbnail: \"/public/assets/img/video-thumbnail.png\",\n title: filename,\n width: width,\n height: height\n });\n });\n video.src = url;\n video.load();\n },\n tag: function tag(media) {\n return '