From a190d638c608f4352e3f01d72ed419a5ab5129ed Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Thu, 29 Jun 2017 00:14:07 +0200 Subject: db stuff and initial app scaffold --- client/components/App.jsx | 24 ++++++++++ client/components/Header.jsx | 18 ++++++++ client/index.js | 12 +++++ client/vendor/Loader.js | 103 +++++++++++++++++++++++++++++++++++++++++++ client/vendor/util.js | 23 ++++++++++ 5 files changed, 180 insertions(+) create mode 100644 client/components/App.jsx create mode 100644 client/components/Header.jsx create mode 100644 client/index.js create mode 100644 client/vendor/Loader.js create mode 100644 client/vendor/util.js (limited to 'client') diff --git a/client/components/App.jsx b/client/components/App.jsx new file mode 100644 index 0000000..0b1557f --- /dev/null +++ b/client/components/App.jsx @@ -0,0 +1,24 @@ +import { h, Component } from 'preact' +import { isMobile } from '../util' +import db from '../db' +import { Link, withRouter } from 'react-router-dom' + +import Header from './Header.jsx' + +class App extends Component { + constructor(props) { + super() + this.state = { + } + } + render() { + return ( +
+
+
+ ) + } +} + +export default withRouter(App) + diff --git a/client/components/Header.jsx b/client/components/Header.jsx new file mode 100644 index 0000000..b8c5fd4 --- /dev/null +++ b/client/components/Header.jsx @@ -0,0 +1,18 @@ +import { h, Component } from 'preact' +import { Link } from 'react-router-dom' + +export default class Header extends Component { + constructor(props) { + super() + this.state = { + } + } + render() { + return ( +
+ ding dong +
+ ) + } +} + diff --git a/client/index.js b/client/index.js new file mode 100644 index 0000000..b78c5ea --- /dev/null +++ b/client/index.js @@ -0,0 +1,12 @@ +import { h, render } from 'preact' +import App from './components/App.jsx' +import { BrowserRouter } from 'react-router-dom' + +const app = ( + + + +) + +render(app, document.getElementById('container')) + diff --git a/client/vendor/Loader.js b/client/vendor/Loader.js new file mode 100644 index 0000000..1cacece --- /dev/null +++ b/client/vendor/Loader.js @@ -0,0 +1,103 @@ +module.exports = (function(){ + function Loader (readyCallback, view){ + this.assets = {}; + this.images = []; + this.readyCallback = readyCallback || function(){}; + this.count = 0 + this.view = view + this.loaded = false + } + + Loader.prototype.onReady = function(readyCallback){ + this.readyCallback = readyCallback || function(){}; + } + + // Register an asset as loading + Loader.prototype.register = function(s){ + this.assets[s] = false; + this.count += 1 + } + + // Signal that an asset has loaded + Loader.prototype.ready = function(s){ + window.debug && console.log("ready >> " + s); + + this.assets[s] = true; + if (this.loaded) return; + + this.view && this.view.update( this.percentRemaining() ) + + if (! this.isReady()) return; + + this.loaded = true; + if (this.view) { + this.view && this.view.finish(this.readyCallback) + } + else { + this.readyCallback && this.readyCallback(); + } + } + + // (boolean) Is the loader ready? + Loader.prototype.isReady = function(){ + for (var s in this.assets) { + if (this.assets.hasOwnProperty(s) && this.assets[s] != true) { + return false; + } + } + return true; + } + + // (float) Percentage of assets remaining + Loader.prototype.percentRemaining = function(){ + return this.remainingAssets() / this.count + } + + // (int) Number of assets remaining + Loader.prototype.remainingAssets = function(){ + var n = 0; + for (var s in this.assets) { + if (this.assets.hasOwnProperty(s) && this.assets[s] != true) { + n++; + // console.log('remaining: ' + s); + } + } + return n; + } + + // Preload the images in config.images + Loader.prototype.preloadImages = function(images){ + this.register("preload"); + for (var i = 0; i < images.length; i++) { + this.preloadImage(images[i]); + } + this.ready("preload"); + } + Loader.prototype.preloadImage = function(src, register, cb){ + if (! src || src == "none") return; + var _this = this; + if (! cb && typeof register === "function") { + cb = register + register = null + } + if (register) { + this.register(src); + } + var img = new Image(), loaded = false; + img.onload = function(){ + if (loaded) return + loaded = true + if (cb) { + cb(img); + } + if (register) { + _this.ready(src); + } + } + img.src = src; + if (img.complete) img.onload(); + _this.images.push(img); + } + + return Loader; +})(); diff --git a/client/vendor/util.js b/client/vendor/util.js new file mode 100644 index 0000000..5d51c34 --- /dev/null +++ b/client/vendor/util.js @@ -0,0 +1,23 @@ +const isIphone = (navigator.userAgent.match(/iPhone/i)) || (navigator.userAgent.match(/iPod/i)) +const isIpad = (navigator.userAgent.match(/iPad/i)) +const isAndroid = (navigator.userAgent.match(/Android/i)) +const isMobile = isIphone || isIpad || isAndroid +const isDesktop = ! isMobile + +document.body.classList.add(isMobile ? 'mobile' : 'desktop') + +const browser = { isIphone, isIpad, isAndroid, isMobile, isDesktop } + +function clamp(n,a,b){ return n { e.preventDefault(); f(e.touches[0]) }} + +export { + browser, + clamp, mod, + choice, randint, randrange, + firstTouch, +} -- cgit v1.2.3-70-g09d2