progress barf commit

This commit is contained in:
Timothy Warren 2017-04-06 17:18:27 -04:00
parent ee50422200
commit 6fab5cbffc
28 changed files with 383 additions and 1363 deletions

View File

@ -7,7 +7,7 @@
"stage-0",
"react"
],
"plugins": ["add-module-exports"],
"plugins": ["transform-export-extensions"],
"env": {
"production": {
"presets": ["react-optimize"],

1
.nvmrc
View File

@ -1 +0,0 @@
v6.9.5

View File

@ -1,15 +0,0 @@
{
"ecmaVersion": 7,
"libs": [
"browser"
],
"dontLoad": [
"node_modules/**"
],
"plugins": {
"doc_comment": {
"fullDocs": true,
"strong": true
}
}
}

View File

@ -1,6 +1,6 @@
The MIT License (MIT)
Copyright (c) 2015-present C. T. Lin
Copyright (c) 2017-present Timothy J. Warren
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal

View File

View File

@ -1,14 +0,0 @@
.container {
position: absolute;
top: 30%;
left: 10px;
text-align: center;
}
.container h2 {
font-size: 5rem;
}
.container a {
font-size: 1.4rem;
}

View File

@ -0,0 +1,27 @@
import React from 'react';
/**
* Button component
*
* @param {object} props
* @param {string} props.btnStyle space-separated button classes, like default,large,etc.
*/
export function Button(props = { btnStyle: 'default' }) {
const args = {
btnStyle: 'default',
...props
};
let classes = (String(args.className)).length > 0
? ['btn'].concat(String(args.className).split(' '))
: ['btn'];
const styleClasses = String(args.btnStyle).split(' ')
.map(c => `btn-${c}`);
classes = classes.concat(styleClasses);
return (
<button className={classes.join(' ')}>{args.children}</button>
);
}
export default Button;

View File

@ -0,0 +1,9 @@
import React from 'react';
export function ButtonGroup(props) {
return (
<div className="btn-group">{props.children}</div>
);
}
export default ButtonGroup;

View File

@ -0,0 +1,16 @@
import React from 'react';
import { prefixClasses } from '../../utils'
/**
* Icon component
*
* @param {object} props
* @param {string} props.type Type of icon, eg. mail,heart,star,etc.
*/
export function Icon(props) {
return (
<span className={`icon ${prefixClasses('icon', props.type)}`} />
);
}
export default Icon;

View File

@ -0,0 +1,9 @@
import React from 'react';
export function TabGroup(props) {
return (
<div className="tab-group">{props.children}</div>
);
}
export default TabGroup;

View File

@ -0,0 +1,34 @@
import React from 'react';
/**
* Toolbar component
*
* @param {object} props
* @param {string} props.type Type of toolbar, eg. header or footer
*/
export function Toolbar(props) {
switch (props.type) {
case 'header':
return (
<header className="toolbar toolbar-header">
{props.children}
</header>
);
case 'footer':
return (
<footer className="toolbar toolbar-footer">
{props.children}
</footer>
);
default:
return (
<div className={`toolbar toolbar-${props.type}`}>
{props.children}
</div>
);
}
}
export default Toolbar;

View File

@ -0,0 +1,9 @@
import React from 'react';
export function ToolbarActions(props) {
return (
<div className="toolbar-actions">{props.children}</div>
);
}
export default ToolbarActions;

View File

@ -0,0 +1,6 @@
export * from './Button';
export * from './ButtonGroup';
export * from './Icon';
export * from './TabGroup';
export * from './Toolbar';
export * from './ToolbarActions';

View File

@ -1,18 +1,40 @@
import React, { PureComponent } from 'react';
import { Button, ButtonGroup, Icon, Toolbar, ToolbarActions } from '../components/Photon';
export default class App extends PureComponent {
render() {
return (
<div className="window">
<header className="toolbar toolbar-header">
<Toolbar type="header">
<h1 className="title">Header</h1>
</header>
<ToolbarActions>
<ButtonGroup>
<Button><Icon type="home" /></Button>
<Button><Icon type="folder" /></Button>
<Button className="active"><Icon type="cloud" /></Button>
<Button><Icon type="popup" /></Button>
<Button><Icon type="shuffle" /></Button>
</ButtonGroup>
<Button>
<Icon type="home text" />
Filters
</Button>
<Button btnStyle="default dropdown" className="pull-right">
<Icon type="megaphone" />
</Button>
</ToolbarActions>
</Toolbar>
<main className="window-content">
{this.props.children}
</main>
<footer className="toolbar toolbar-footer">
<h1 className="title">Footer</h1>
</footer>
<Toolbar type="footer">
<ToolbarActions>
<Button>Cancel</Button>
<Button btnStyle="primary" className="pull-right">Save</Button>
</ToolbarActions>
</Toolbar>
</div>
);
}

View File

@ -3,10 +3,10 @@ import { Provider } from 'react-redux';
import { Router } from 'react-router';
import routes from '../routes';
export default function Root({ store, history }) {
export default function Root(props) {
return (
<Provider store={store}>
<Router key={Math.random()} history={history} routes={routes} />
<Provider store={props.store}>
<Router key={Math.random()} history={props.history} routes={routes} />
</Provider>
);
}

View File

@ -5,7 +5,6 @@ import { AppContainer } from 'react-hot-loader';
import { syncHistoryWithStore } from 'react-router-redux';
import Root from './containers/Root';
import configureStore from './store/configureStore';
import './app.global.css';
const store = configureStore();
const history = syncHistoryWithStore(hashHistory, store);

View File

@ -1,15 +0,0 @@
{
"name": "electron-react-boilerplate",
"productName": "electron-react-boilerplate",
"version": "1.0.0",
"description": "Electron application boilerplate based on React, React Router, Webpack, React Hot Loader for rapid application development",
"main": "./main.js",
"author": {
"name": "C. T. Lin",
"email": "chentsulin@gmail.com",
"url": "https://github.com/chentsulin"
},
"license": "MIT",
"dependencies": {
}
}

13
app/utils/index.js Normal file
View File

@ -0,0 +1,13 @@
export function prefixClasses(prefix, classes) {
if (String(classes).length < 1) {
return '';
}
return classes.split(' ')
.map(c => `${prefix}-${c}`)
.join(' ');
}
export default {
prefixClasses
};

View File

@ -1,4 +0,0 @@
# THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.
# yarn lockfile v1

View File

@ -1,52 +0,0 @@
os: unstable
environment:
matrix:
- nodejs_version: 7
- nodejs_version: 6
cache:
- node_modules -> package.json
- app/node_modules -> app/package.json
# Enable when https://github.com/yarnpkg/yarn/issues/1233 and
# https://github.com/yarnpkg/yarn/issues/1059 are resolved and disable npm cache
#
# cache:
# - "%LOCALAPPDATA%/Yarn"
matrix:
fast_finish: true
build: off
version: '{build}'
shallow_clone: true
clone_depth: 1
install:
- ps: Install-Product node $env:nodejs_version
- set CI=true
- npm install -g npm@latest
- set PATH=%APPDATA%\npm;%PATH%
- npm install
# Enable when https://github.com/yarnpkg/yarn/issues/1233 and
# https://github.com/yarnpkg/yarn/issues/1059 are resolved and disable npm cache
#
# install:
# - ps: Install-Product node $env:nodejs_version
# - set CI=true
# - choco install yarn
# - refreshenv
# - yarn
test_script:
- node --version
- npm run lint
- npm run test
- npm run build
- npm run test-e2e
- npm run package

View File

@ -1,8 +1,8 @@
{
"name": "electron-react-boilerplate",
"name": "image-juicer",
"productName": "ElectronReact",
"version": "0.10.0",
"description": "Electron application boilerplate based on React, React Router, Webpack, React Hot Loader for rapid application development",
"version": "0.0.1",
"description": "Cross-platform app for optimizing images",
"main": "main.js",
"scripts": {
"test": "cross-env NODE_ENV=test BABEL_DISABLE_CACHE=1 node --trace-warnings ./test/runTests.js",
@ -10,7 +10,7 @@
"test-watch": "npm test -- --watch",
"test-e2e": "cross-env NODE_ENV=test BABEL_DISABLE_CACHE=1 node --trace-warnings ./test/runTests.js e2e",
"lint": "eslint --cache --format=node_modules/eslint-formatter-pretty .",
"lint-fix": "npm run lint -- --fix",
"fix": "npm run lint -- --fix",
"hot-updates-server": "cross-env NODE_ENV=development node --trace-warnings -r babel-register ./node_modules/webpack-dev-server/bin/webpack-dev-server --config webpack.config.renderer.dev.js",
"build": "concurrently \"npm run build-main\" \"npm run build-renderer\"",
"build-dll": "cross-env NODE_ENV=development node --trace-warnings -r babel-register ./node_modules/webpack/bin/webpack --config webpack.config.renderer.dev.dll.js --progress --profile --colors",
@ -21,15 +21,15 @@
"postinstall": "concurrently \"npm run build-dll\" \"install-app-deps\" \"node node_modules/fbjs-scripts/node/check-dev-engines.js package.json\"",
"dev": "cross-env START_HOT=1 npm run hot-updates-server",
"package": "npm run build && build --publish never",
"package-mac": "npm run build && build -m",
"package-win": "npm run build && build --win --x64",
"package-linux": "npm run build && build --linux",
"package-all": "npm run build && build -mwl",
"cleanup": "mop -v"
"package-all": "npm run build && build -mwl"
},
"browserslist": "electron 1.4",
"browserslist": "electron 1.6",
"build": {
"productName": "ElectronReact",
"appId": "org.develar.ElectronReact",
"productName": "ImageJuicer",
"appId": "net.timshomepage.imagejuicer",
"files": [
"dist/",
"node_modules/",
@ -70,25 +70,16 @@
},
"repository": {
"type": "git",
"url": "git+https://github.com/chentsulin/electron-react-boilerplate.git"
"url": "git@git.timshomepage.net:timw4mail/image-juicer.git"
},
"author": {
"name": "C. T. Lin",
"email": "chentsulin@gmail.com",
"url": "https://github.com/chentsulin"
"name": "Timothy J. Warren",
"email": "tim@timshomepage.net",
"url": "https://git.timshomepage.net/timw4mail/"
},
"license": "MIT",
"keywords": [
"electron",
"boilerplate",
"react",
"redux",
"sass",
"webpack",
"hot",
"reload"
],
"homepage": "https://github.com/chentsulin/electron-react-boilerplate#readme",
"keywords": [],
"homepage": "https://git.timshomepage.net/timw4mail/image-juicer",
"jest": {
"moduleNameMapper": {
"\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$": "<rootDir>/mocks/fileMock.js",
@ -100,10 +91,7 @@
"moduleDirectories": [
"node_modules",
"app/node_modules"
],
"transform": {
"^.+\\.js$": "babel-jest"
}
]
},
"devDependencies": {
"asar": "^0.13.0",
@ -115,6 +103,7 @@
"babel-plugin-dev-expression": "^0.2.1",
"babel-plugin-transform-class-properties": "^6.23.0",
"babel-plugin-transform-es2015-classes": "^6.23.0",
"babel-plugin-transform-export-extensions": "^6.22.0",
"babel-polyfill": "^6.23.0",
"babel-preset-env": "^1.3.2",
"babel-preset-react": "^6.23.0",
@ -123,12 +112,10 @@
"babel-preset-stage-0": "^6.22.0",
"babel-register": "^6.24.0",
"babili-webpack-plugin": "^0.0.11",
"boiler-room-custodian": "^0.6.1",
"chalk": "^1.1.3",
"concurrently": "^3.4.0",
"cross-env": "^4.0.0",
"cross-spawn": "^5.1.0",
"css-loader": "^0.28.0",
"devtron": "^1.4.0",
"electron": "^1.6.2",
"electron-builder": "^16.7.0",
@ -150,17 +137,12 @@
"html-webpack-plugin": "^2.28.0",
"identity-obj-proxy": "^3.0.0",
"jest": "^19.0.2",
"jimp": "^0.2.27",
"jsdom": "^9.12.0",
"minimist": "^1.2.0",
"node-sass": "^4.5.2",
"react-addons-test-utils": "^15.4.2",
"react-test-renderer": "^15.4.2",
"redux-logger": "^3.0.1",
"sass-loader": "^6.0.3",
"sinon": "^2.1.0",
"spectron": "^3.6.1",
"style-loader": "^0.16.1",
"url-loader": "^0.5.8",
"webpack": "^2.3.2",
"webpack-dev-server": "^2.4.2",
@ -169,7 +151,7 @@
"dependencies": {
"electron-debug": "^1.1.0",
"extract-text-webpack-plugin": "^2.0.0",
"font-awesome": "^4.7.0",
"jimp": "^0.2.27",
"react": "^15.4.2",
"react-dom": "^15.4.2",
"react-hot-loader": "3.0.0-beta.6",

View File

@ -1,79 +0,0 @@
// Note: this file is the configuration file *only* for
// use by the boiler-room-custodian utility. the point
// of the boiler-room-custodian is to clean sample code
// from the boilerplate from initial state so that you
// can start custom development on a "blank project"
//
// For more information or to report issues please go
// to https://github.com/tstringer/boiler-room-custodian
//
// This file should remain unmodified by end users and
// should only be invoked by running `npm run cleanup`
module.exports = {
// remove the following files as they are mostly
// related to the sample counter page and functionality
remove: [
{ file: 'app/actions/counter.js' },
{ file: 'app/components/Counter.css' },
{ file: 'app/components/Counter.js' },
{ file: 'app/containers/CounterPage.js' },
{ file: 'app/reducers/counter.js' },
{ file: 'test/actions/counter.spec.js' },
{ file: 'test/components/Counter.spec.js' },
{ file: 'test/containers/CounterPage.spec.js' },
{ file: 'test/e2e/e2e.spec.js' },
{ file: 'test/reducers/counter.spec.js' },
{ file: 'CHANGELOG.md' },
{ file: 'erb-logo.png' }
],
// clean the following files by either clearing them
// (by specifying {clear: true}) or by removing lines
// that match a regex pattern
clean: [
{
file: 'app/reducers/index.js',
pattern: /counter/
},
{
file: 'app/store/configureStore.development.js',
replace: [
{ pattern: /\?: counterStateType/, substitute: '' },
{ pattern: /^.*import type.*$/, substitute: '' },
{ pattern: /^.*counterActions.*$/, substitute: '' }
]
},
{
file: 'app/store/configureStore.production.js',
replace: [
{ pattern: /\?: counterStateType/, substitute: '' },
{ pattern: /^.*import type.*$/, substitute: '' },
]
},
{
file: 'app/app.global.css',
clear: true
},
{
file: 'app/routes.js',
pattern: /CounterPage/
},
{
file: 'README.md',
clear: true
},
{
file: 'app/components/Home.js',
pattern: /(h2|Link to)/
}
],
// add the following files to the project, mostly
// related to .gitkeep for version control
add: [
{ file: 'app/actions/.gitkeep' },
{ file: 'test/actions/.gitkeep' },
{ file: 'test/components/.gitkeep' },
{ file: 'test/containers/.gitkeep' },
{ file: 'test/reducers/.gitkeep' },
{ file: 'test/e2e/.gitkeep' }
]
};

View File

@ -1,16 +0,0 @@
import { jsdom } from 'jsdom';
global.document = jsdom('<!doctype html><html><body></body></html>');
global.window = document.defaultView;
global.navigator = global.window.navigator;
window.localStorage = window.sessionStorage = {
getItem(key) {
return this[key];
},
setItem(key, value) {
this[key] = value;
},
removeItem(key) {
this[key] = undefined;
},
};

View File

@ -4,7 +4,7 @@
import path from 'path';
import webpack from 'webpack';
import { dependencies as externals } from './app/package.json';
import { dependencies as externals } from './package.json';
export default {
externals: Object.keys(externals || {}),

View File

@ -25,76 +25,6 @@ export default merge.smart(baseConfig, {
*/
module: {
rules: [
{
test: /\.global\.css$/,
use: [
{
loader: 'style-loader'
},
{
loader: 'css-loader',
options: {
sourceMap: true,
},
}
]
},
{
test: /^((?!\.global).)*\.css$/,
use: [
{
loader: 'style-loader'
},
{
loader: 'css-loader',
options: {
modules: true,
sourceMap: true,
importLoaders: 1,
localIdentName: '[name]__[local]__[hash:base64:5]',
}
},
]
},
// Add SASS support - compile all .global.scss files and pipe it to style.css
{
test: /\.global\.scss$/,
use: [
{
loader: 'style-loader'
},
{
loader: 'css-loader',
options: {
sourceMap: true,
},
},
{
loader: 'sass-loader'
}
]
},
// Add SASS support - compile all other .scss files and pipe it to style.css
{
test: /^((?!\.global).)*\.scss$/,
use: [
{
loader: 'style-loader'
},
{
loader: 'css-loader',
options: {
modules: true,
sourceMap: true,
importLoaders: 1,
localIdentName: '[name]__[local]__[hash:base64:5]',
}
},
{
loader: 'sass-loader'
}
]
},
// WOFF Font
{
test: /\.woff(\?v=\d+\.\d+\.\d+)?$/,

View File

@ -49,76 +49,6 @@ export default merge.smart(baseConfig, {
module: {
rules: [
{
test: /\.global\.css$/,
use: [
{
loader: 'style-loader'
},
{
loader: 'css-loader',
options: {
sourceMap: true,
},
}
]
},
{
test: /^((?!\.global).)*\.css$/,
use: [
{
loader: 'style-loader'
},
{
loader: 'css-loader',
options: {
modules: true,
sourceMap: true,
importLoaders: 1,
localIdentName: '[name]__[local]__[hash:base64:5]',
}
},
]
},
// Add SASS support - compile all .global.scss files and pipe it to style.css
{
test: /\.global\.scss$/,
use: [
{
loader: 'style-loader'
},
{
loader: 'css-loader',
options: {
sourceMap: true,
},
},
{
loader: 'sass-loader'
}
]
},
// Add SASS support - compile all other .scss files and pipe it to style.css
{
test: /^((?!\.global).)*\.scss$/,
use: [
{
loader: 'style-loader'
},
{
loader: 'css-loader',
options: {
modules: true,
sourceMap: true,
importLoaders: 1,
localIdentName: '[name]__[local]__[hash:base64:5]',
}
},
{
loader: 'sass-loader'
}
]
},
// WOFF Font
{
test: /\.woff(\?v=\d+\.\d+\.\d+)?$/,

View File

@ -24,60 +24,6 @@ export default merge.smart(baseConfig, {
module: {
rules: [
// Extract all .global.css to style.css as is
{
test: /\.global\.css$/,
use: ExtractTextPlugin.extract({
use: 'css-loader',
fallback: 'style-loader',
})
},
// Pipe other styles through css modules and append to style.css
{
test: /^((?!\.global).)*\.css$/,
use: ExtractTextPlugin.extract({
use: {
loader: 'css-loader',
options: {
modules: true,
importLoaders: 1,
localIdentName: '[name]__[local]__[hash:base64:5]',
}
}
}),
},
// Add SASS support - compile all .global.scss files and pipe it to style.css
{
test: /\.global\.scss$/,
use: ExtractTextPlugin.extract({
use: [
{
loader: 'css-loader'
},
{
loader: 'sass-loader'
}
],
fallback: 'style-loader',
})
},
// Add SASS support - compile all other .scss files and pipe it to style.css
{
test: /^((?!\.global).)*\.scss$/,
use: ExtractTextPlugin.extract({
use: [{
loader: 'css-loader',
options: {
modules: true,
importLoaders: 1,
localIdentName: '[name]__[local]__[hash:base64:5]',
}
},
{
loader: 'sass-loader'
}]
}),
},
// WOFF Font
{
test: /\.woff(\?v=\d+\.\d+\.\d+)?$/,

834
yarn.lock

File diff suppressed because it is too large Load Diff