diff --git a/android/app/build.gradle b/android/app/build.gradle index 2a1d4c2..cd4cca4 100644 --- a/android/app/build.gradle +++ b/android/app/build.gradle @@ -66,6 +66,7 @@ import com.android.build.OutputFile */ apply from: "../../node_modules/react-native/react.gradle" +apply from: "../../node_modules/react-native-vector-icons/fonts.gradle" /** * Set this to true to create two separate APKs instead of one: @@ -129,6 +130,8 @@ dependencies { compile fileTree(dir: "libs", include: ["*.jar"]) compile "com.android.support:appcompat-v7:23.0.1" compile "com.facebook.react:react-native:+" // From node_modules + compile project(':react-native-vector-icons') + } // Run this once to be able to run the application with BUCK diff --git a/android/app/src/main/java/com/counter/MainApplication.java b/android/app/src/main/java/com/counter/MainApplication.java index 6305daa..a9bfa37 100644 --- a/android/app/src/main/java/com/counter/MainApplication.java +++ b/android/app/src/main/java/com/counter/MainApplication.java @@ -8,6 +8,7 @@ import com.facebook.react.ReactInstanceManager; import com.facebook.react.ReactNativeHost; import com.facebook.react.ReactPackage; import com.facebook.react.shell.MainReactPackage; +import com.oblador.vectoricons.VectorIconsPackage; import java.util.Arrays; import java.util.List; @@ -24,6 +25,7 @@ public class MainApplication extends Application implements ReactApplication { protected List getPackages() { return Arrays.asList( new MainReactPackage() + , new VectorIconsPackage() ); } }; diff --git a/android/gradle/wrapper/gradle-wrapper.properties b/android/gradle/wrapper/gradle-wrapper.properties index 9a7f675..5e7ae73 100644 --- a/android/gradle/wrapper/gradle-wrapper.properties +++ b/android/gradle/wrapper/gradle-wrapper.properties @@ -3,4 +3,4 @@ distributionBase=GRADLE_USER_HOME distributionPath=wrapper/dists zipStoreBase=GRADLE_USER_HOME zipStorePath=wrapper/dists -distributionUrl=https\://services.gradle.org/distributions/gradle-2.10-all.zip +distributionUrl=https\://services.gradle.org/distributions/gradle-2.2-all.zip diff --git a/android/settings.gradle b/android/settings.gradle index a519056..831ce76 100644 --- a/android/settings.gradle +++ b/android/settings.gradle @@ -1,3 +1,6 @@ rootProject.name = 'Counter' include ':app' + +include ':react-native-vector-icons' +project(':react-native-vector-icons').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-vector-icons/android') diff --git a/app/actions/actionTypes.js b/app/actions/actionTypes.js deleted file mode 100644 index 930d9ef..0000000 --- a/app/actions/actionTypes.js +++ /dev/null @@ -1,2 +0,0 @@ -export const INCREMENT = 'INCREMENT'; -export const DECREMENT = 'DECREMENT'; diff --git a/app/actions/counterActions.js b/app/actions/counterActions.js deleted file mode 100644 index 3898b40..0000000 --- a/app/actions/counterActions.js +++ /dev/null @@ -1,13 +0,0 @@ -import * as types from './actionTypes'; - -export function increment() { - return { - type: types.INCREMENT - }; -} - -export function decrement() { - return { - type: types.DECREMENT - }; -} diff --git a/app/components/counter.js b/app/components/counter.js deleted file mode 100644 index 06bfcc2..0000000 --- a/app/components/counter.js +++ /dev/null @@ -1,36 +0,0 @@ -import React, {Component} from 'react'; -import {StyleSheet, View, Text, TouchableOpacity} from 'react-native'; - -const styles = StyleSheet.create({ - button: { - width: 100, - height: 30, - padding: 10, - backgroundColor: 'lightgray', - alignItems: 'center', - justifyContent: 'center', - margin: 3 - } -}); - -export default class Counter extends Component { - constructor(props) { - super(props); - } - - render() { - const { counter, increment, decrement } = this.props; - - return ( - - {counter} - - up - - - down - - - ); - } -} diff --git a/app/reducers/counter.js b/app/reducers/counter.js deleted file mode 100644 index 46a0a5a..0000000 --- a/app/reducers/counter.js +++ /dev/null @@ -1,22 +0,0 @@ -import * as types from '../actions/actionTypes'; - -const initialState = { - count: 0 -}; - -export default function counter(state = initialState, action = {}) { - switch (action.type) { - case types.INCREMENT: - return { - ...state, - count: state.count + 1 - }; - case types.DECREMENT: - return { - ...state, - count: state.count - 1 - }; - default: - return state; - } -} diff --git a/app/reducers/index.js b/app/reducers/index.js deleted file mode 100644 index 60cc876..0000000 --- a/app/reducers/index.js +++ /dev/null @@ -1,5 +0,0 @@ -import counter from './counter'; - -export { - counter -}; diff --git a/index.android.js b/index.android.js index 0d530f4..0352315 100644 --- a/index.android.js +++ b/index.android.js @@ -1,6 +1,6 @@ 'use strict'; import React, { AppRegistry } from 'react-native'; -import App from './app/containers/app'; +import App from './src/containers/app'; AppRegistry.registerComponent('Counter', () => App); diff --git a/index.ios.js b/index.ios.js index 0d530f4..0352315 100644 --- a/index.ios.js +++ b/index.ios.js @@ -1,6 +1,6 @@ 'use strict'; import React, { AppRegistry } from 'react-native'; -import App from './app/containers/app'; +import App from './src/containers/app'; AppRegistry.registerComponent('Counter', () => App); diff --git a/package.json b/package.json index c130b67..204ff26 100644 --- a/package.json +++ b/package.json @@ -11,6 +11,8 @@ "dependencies": { "react": "15.3.2", "react-native": "0.34.0", + "react-native-drawer": "^2.3.0", + "react-native-vector-icons": "^4.0.0", "react-redux": "4.4.5", "redux": "3.5.2", "redux-actions": "0.11.0", diff --git a/src/actions/actionTypes.js b/src/actions/actionTypes.js new file mode 100644 index 0000000..5abb9e4 --- /dev/null +++ b/src/actions/actionTypes.js @@ -0,0 +1,7 @@ +export const UPDATEVALUE = 'UPDATEVALUE'; +export const UPDATEMULT = 'UPDATEMULT'; +export const MENUOPEN = 'MENUOPEN'; +export const MENUCLOSE = 'MENUCLOSE'; +export const MAIN = 'MAIN'; +export const HELP = 'HELP'; +export const SETREF = 'SETREF'; diff --git a/src/actions/calcActions.js b/src/actions/calcActions.js new file mode 100644 index 0000000..1d77fbe --- /dev/null +++ b/src/actions/calcActions.js @@ -0,0 +1,19 @@ +import * as types from './actionTypes'; + +export function updatevalue(form, index, value) { + return { + type: types.UPDATEVALUE, + form, + index, + value, + }; +} + +export function updatemult(form, index, mult) { + return { + type: types.UPDATEMULT, + form, + index, + mult, + }; +} diff --git a/src/actions/menuActions.js b/src/actions/menuActions.js new file mode 100644 index 0000000..610d1d6 --- /dev/null +++ b/src/actions/menuActions.js @@ -0,0 +1,25 @@ +import * as types from './actionTypes'; + +export function menuopen() { + return { + type: types.MENUOPEN + }; +} + +export function menuclose() { + return { + type: types.MENUCLOSE + }; +} + +export function main() { + return { + type: types.MAIN + }; +} + +export function help() { + return { + type: types.HELP + }; +} diff --git a/src/components/calc.js b/src/components/calc.js new file mode 100644 index 0000000..0b3f22d --- /dev/null +++ b/src/components/calc.js @@ -0,0 +1,67 @@ +import React, {Component} from 'react'; +import {ScrollView, StyleSheet, Text, TouchableOpacity, View} from 'react-native'; + +import Resistor from './resistor'; +import Section from './section'; + +const styles = StyleSheet.create({ + button: { + width: 100, + height: 30, + padding: 10, + backgroundColor: 'lightgray', + alignItems: 'center', + justifyContent: 'center', + margin: 3 + } +}); + +export default class Calc extends Component { + constructor(props) { + super(props); + } + + render() { + const {state} = this.props; + + const allValid = state.have.every((x) => x.valid); + const nonEmpty = state.have.some((x) => x.value); + + const reciprocalSum = state.have + .filter((x) => x.value) + .reduce((a,b) => a + 1.0/(b.value * b.mult), 0.0); + + return ( + + +
+ + Enter the exact resistance target: + + +
+
+ + Overall parallel resistor value: + {allValid && nonEmpty ? ' ' + 1/reciprocalSum : ' ???'} + + + Error between this and the target: {0}% + + + Next recommended resistor value: {0} + +
+
+ + Enter the resistors you have in parallel: + + {state.have.map((x,n) => + + )} +
+ + + ); + } +} diff --git a/src/components/help.js b/src/components/help.js new file mode 100644 index 0000000..85f67ba --- /dev/null +++ b/src/components/help.js @@ -0,0 +1,24 @@ +import React, {Component} from 'react'; +import {StyleSheet, View, Text, TouchableOpacity} from 'react-native'; + +const styles = StyleSheet.create({ +}); + +export default class Help extends Component { + constructor(props) { + super(props); + } + + render() { + //const { counter } = this.props; + + return ( + + This is a sample counter app. + Press Increase to add 1 to the value. + Press Decrease to subtract 1 from the value. + + ); + } +} + diff --git a/src/components/menu.js b/src/components/menu.js new file mode 100644 index 0000000..030e4e6 --- /dev/null +++ b/src/components/menu.js @@ -0,0 +1,29 @@ +import React, {Component} from 'react'; +import {StyleSheet, View, Text, TouchableOpacity} from 'react-native'; + +const styles = StyleSheet.create({ + main: { + backgroundColor: '#ffffff', + flex: 1, + alignItems: 'center', + justifyContent: 'center', + }, +}); + +export default class Menu extends Component { + constructor(props) { + super(props); + } + + render() { + const { main, help } = this.props; + + return ( + + Calculator + Help + Link 4 + + ); + } +} diff --git a/src/components/resistor.js b/src/components/resistor.js new file mode 100644 index 0000000..b13a2aa --- /dev/null +++ b/src/components/resistor.js @@ -0,0 +1,124 @@ +import React, {Component} from 'react'; +import {bindActionCreators} from 'redux'; +import {connect} from 'react-redux'; +import { + Alert, + Picker, + StyleSheet, + View, + Text, + TextInput, + TouchableOpacity, +} from 'react-native'; + +import * as calcActions from '../actions/calcActions'; + +const styles = { + resistorinput: { + flex: 1, + height: 40, + maxWidth: 80, + borderWidth: 1, + textAlign: 'right', + }, + clearbutton: { + height: 30, + padding: 10, + backgroundColor: 'lightgray', + alignItems: 'center', + justifyContent: 'center', + margin: 3, + }, +}; + +class Resistor extends Component { + constructor(props) { + super(props); + } + + render() { + const {data, actions} = this.props; + + // Curry the update functions to make them simpler + const updatevalue = (x) => actions.updatevalue( + this.props.form, this.props.index, x + ); + const updatemult = (x) => actions.updatemult( + this.props.form, this.props.index, x + ); + + const clear = () => { + updatevalue(''); + updatemult('1'); + } + + console.log(this); + + return ( + + updatevalue(x)} + style={Object.assign({}, styles.resistorinput, { + borderColor: data.valid ? 'grey' : 'red', + })} + underlineColorAndroid={'transparent'} + autoCorrect={false} + keyboardType={'numeric'} + /> + this._picker = x} + selectedValue={data.mult} + onValueChange={(x) => updatemult(x)} + style={{height: 40, width: 100}} + mode={'dropdown'} + > + + + + + + { + console.log(this); + Alert.alert( + 'Clear resistor value?', + data.value + + // I created this kludge for fun (so don't hate on me): + this._picker.props.children + .map((x) => x.props) + .filter((x) => x.value == data.mult)[0] + .label, + [ + {text: 'CANCEL'}, + {text: 'OK', onPress: clear}, + ] + ) + }} style={styles.clearbutton} activeOpacity={1} + > + Clear + + + ); + } +} + +//Redux stuff +function mapStateToProps(state, ownProps) { + if (ownProps.form == "target") { + return { + data: state.calc.target, + }; + } else if (ownProps.form == "have") { + return { + data: state.calc.have[ownProps.index], + }; + } else { + return {}; + } +} + +export default connect(mapStateToProps, + (dispatch) => ({ + actions: bindActionCreators(calcActions, dispatch) + }) +)(Resistor); diff --git a/src/components/section.js b/src/components/section.js new file mode 100644 index 0000000..fcd2b9f --- /dev/null +++ b/src/components/section.js @@ -0,0 +1,18 @@ +import React, {Component} from 'react'; +import {View} from 'react-native'; + +export default class Section extends Component { + constructor(props) { + super(props); + } + + render() { + return ( + + {this.props.children} + + ); + } +} + + diff --git a/app/containers/app.js b/src/containers/app.js similarity index 74% rename from app/containers/app.js rename to src/containers/app.js index 4c36ce5..5e68058 100644 --- a/app/containers/app.js +++ b/src/containers/app.js @@ -1,10 +1,13 @@ import React, {Component} from 'react'; +import { StyleSheet } from 'react-native'; +import Ionicons from 'react-native-vector-icons/Ionicons'; import { createStore, applyMiddleware, combineReducers } from 'redux'; import { Provider } from 'react-redux'; import thunk from 'redux-thunk'; +import Drawer from 'react-native-drawer'; import * as reducers from '../reducers'; -import CounterApp from './counterApp'; +import Nav from './nav'; const createStoreWithMiddleware = applyMiddleware(thunk)(createStore); const reducer = combineReducers(reducers); @@ -14,7 +17,7 @@ export default class App extends Component { render() { return ( - +