Merge branch 'master' into jg-external-dapps

js/src/ui/Actionbar/Export/export.js

@@ -15,6 +15,7 @@
 // along with Parity.  If not, see <http://www.gnu.org/licenses/>.
 
 import React, { Component, PropTypes } from 'react';
+
 import FileSaver from 'file-saver';
 import FileDownloadIcon from 'material-ui/svg-icons/file/file-download';
 
@@ -38,19 +39,18 @@ class ActionbarExport extends Component {
         className={ className }
         icon={ <FileDownloadIcon /> }
         label='export'
-        onClick={ this.onDownloadBackup } />
+        onClick={ this.handleExport }
+      />
     );
   }
 
-  onDownloadBackup = () => {
+  handleExport = () => {
     const { filename, content } = this.props;
 
-    const text = (typeof content === 'string')
-      ? content
-      : JSON.stringify(content, null, 4);
+    const text = JSON.stringify(content, null, 4);
 
-    const blob = new Blob([ text ], { type: 'text/plain;charset=utf-8' });
-    FileSaver.saveAs(blob, filename);
+    const blob = new Blob([ text ], { type: 'application/json' });
+    FileSaver.saveAs(blob, `${filename}.json`);
   }
 }
 

js/src/ui/Actionbar/Sort/sort.js

@@ -15,6 +15,8 @@
 // along with Parity.  If not, see <http://www.gnu.org/licenses/>.
 
 import React, { Component, PropTypes } from 'react';
+import { observer } from 'mobx-react';
+
 import IconMenu from 'material-ui/IconMenu';
 import MenuItem from 'material-ui/MenuItem';
 
@@ -22,11 +24,15 @@ import SortIcon from 'material-ui/svg-icons/content/sort';
 
 import { Button } from '../../';
 
+import SortStore from './sortStore';
 import styles from './sort.css';
 
+@observer
 export default class ActionbarSort extends Component {
   static propTypes = {
+    id: PropTypes.string.isRequired,
     onChange: PropTypes.func.isRequired,
+
     order: PropTypes.string,
     showDefault: PropTypes.bool,
     metas: PropTypes.array
@@ -37,8 +43,10 @@ export default class ActionbarSort extends Component {
     showDefault: true
   }
 
-  state = {
-    menuOpen: false
+  store = new SortStore(this.props);
+
+  componentDidMount () {
+    this.store.restoreSavedOrder();
   }
 
   render () {
@@ -51,12 +59,12 @@ export default class ActionbarSort extends Component {
             className={ styles.sortButton }
             label=''
             icon={ <SortIcon /> }
-            onClick={ this.handleMenuOpen }
+            onClick={ this.store.handleMenuOpen }
             />
         }
-        open={ this.state.menuOpen }
-        onRequestChange={ this.handleMenuChange }
-        onItemTouchTap={ this.handleSortChange }
+        open={ this.store.menuOpen }
+        onRequestChange={ this.store.handleMenuChange }
+        onItemTouchTap={ this.store.handleSortChange }
         targetOrigin={ { horizontal: 'right', vertical: 'top' } }
         anchorOrigin={ { horizontal: 'right', vertical: 'top' } }
         touchTapCloseDelay={ 0 }
@@ -109,16 +117,4 @@ export default class ActionbarSort extends Component {
     );
   }
 
-  handleSortChange = (event, child) => {
-    const order = child.props.value;
-    this.props.onChange(order);
-  }
-
-  handleMenuOpen = () => {
-    this.setState({ menuOpen: true });
-  }
-
-  handleMenuChange = (open) => {
-    this.setState({ menuOpen: open });
-  }
 }

js/src/ui/Actionbar/Sort/sortStore.js

@@ -0,0 +1,71 @@
+// Copyright 2015, 2016 Ethcore (UK) Ltd.
+// This file is part of Parity.
+
+// Parity is free software: you can redistribute it and/or modify
+// it under the terms of the GNU General Public License as published by
+// the Free Software Foundation, either version 3 of the License, or
+// (at your option) any later version.
+
+// Parity is distributed in the hope that it will be useful,
+// but WITHOUT ANY WARRANTY; without even the implied warranty of
+// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+// GNU General Public License for more details.
+
+// You should have received a copy of the GNU General Public License
+// along with Parity.  If not, see <http://www.gnu.org/licenses/>.
+
+import { action, observable } from 'mobx';
+import store from 'store';
+
+const LS_STORE_KEY = '_parity::sortStore';
+
+export default class SortStore {
+  @observable menuOpen = false;
+
+  constructor (props) {
+    const { id, onChange } = props;
+
+    this.onChange = onChange;
+    this.id = id;
+  }
+
+  @action handleMenuOpen = () => {
+    this.menuOpen = true;
+  }
+
+  @action handleMenuChange = (open) => {
+    this.menuOpen = open;
+  }
+
+  @action handleSortChange = (event, child) => {
+    const order = child.props.value;
+    this.onChange(order);
+    this.saveOrder(order);
+  }
+
+  @action restoreSavedOrder = () => {
+    const order = this.getSavedOrder();
+    this.onChange(order);
+  }
+
+  getSavedOrder = () => {
+    return (this.getSavedOrders())[this.id];
+  }
+
+  getSavedOrders = () => {
+    return store.get(LS_STORE_KEY) || {};
+  }
+
+  setSavedOrders = (orders) => {
+    store.set(LS_STORE_KEY, orders);
+  }
+
+  saveOrder = (order) => {
+    const orders = {
+      ...this.getSavedOrders(),
+      [ this.id ]: order
+    };
+
+    this.setSavedOrders(orders);
+  }
+}

js/src/ui/Form/Input/input.js

@@ -16,6 +16,7 @@
 
 import React, { Component, PropTypes } from 'react';
 import { TextField } from 'material-ui';
+import { noop } from 'lodash';
 
 import CopyToClipboard from '../../CopyToClipboard';
 
@@ -81,7 +82,7 @@ export default class Input extends Component {
   }
 
   componentWillReceiveProps (newProps) {
-    if (newProps.value !== this.props.value) {
+    if ((newProps.value !== this.props.value) && (newProps.value !== this.state.value)) {
       this.setValue(newProps.value);
     }
   }
@@ -131,6 +132,7 @@ export default class Input extends Component {
           onBlur={ this.onBlur }
           onChange={ this.onChange }
           onKeyDown={ this.onKeyDown }
+          onPaste={ this.onPaste }
           inputStyle={ inputStyle }
           min={ min }
           max={ max }
@@ -180,9 +182,9 @@ export default class Input extends Component {
   }
 
   onChange = (event, value) => {
-    this.setValue(value);
-
-    this.props.onChange && this.props.onChange(event, value);
+    this.setValue(value, () => {
+      this.props.onChange && this.props.onChange(event, value);
+    });
   }
 
   onBlur = (event) => {
@@ -196,6 +198,14 @@ export default class Input extends Component {
     this.props.onBlur && this.props.onBlur(event);
   }
 
+  onPaste = (event) => {
+    const value = event.clipboardData.getData('Text');
+
+    window.setTimeout(() => {
+      this.onSubmit(value);
+    }, 0);
+  }
+
   onKeyDown = (event) => {
     const { value } = event.target;
 
@@ -209,12 +219,12 @@ export default class Input extends Component {
   }
 
   onSubmit = (value) => {
-    this.setValue(value);
-
-    this.props.onSubmit && this.props.onSubmit(value);
+    this.setValue(value, () => {
+      this.props.onSubmit && this.props.onSubmit(value);
+    });
   }
 
-  setValue (value) {
-    this.setState({ value });
+  setValue (value, cb = noop) {
+    this.setState({ value }, cb);
   }
 }

js/src/ui/Form/InputAddress/inputAddress.css

@@ -30,6 +30,10 @@
 .iconDisabled {
   position: absolute;
   top: 35px;
+
+  &.noLabel {
+    top: 10px;
+  }
 }
 
 .icon {

js/src/ui/Form/InputAddress/inputAddress.js

@@ -69,14 +69,19 @@ class InputAddress extends Component {
   }
 
   renderIcon () {
-    const { value, disabled } = this.props;
+    const { value, disabled, label } = this.props;
 
     if (!value || !value.length || !util.isAddressValid(value)) {
       return null;
     }
 
+    const classes = [disabled ? styles.iconDisabled : styles.icon];
+    if (!label) {
+      classes.push(styles.noLabel);
+    }
+
     return (
-      <div className={ disabled ? styles.iconDisabled : styles.icon }>
+      <div className={ classes.join(' ') }>
         <IdentityIcon
           inline center
           address={ value } />