20324:zsh

--- a/static/js/lib/form/FileUploadField.js     Thu Sep 22 23:16:10 2016 +0300
+++ b/static/js/lib/form/FileUploadField.js     Wed Oct 26 12:46:15 2016 +0200
@@ -5,7 +5,7 @@
 import React from 'react';
 import ReactDOM from 'react-dom';
 import {VBox, HBox} from '../../layout';
-import {Button} from '../../ui';
+import {Button, Icon} from '../../ui';
 import File from './File';
 import StoredFile from './StoredFile';
 import FileDownload from './FileDownload';
@@ -13,6 +13,7 @@
 import ReadOnlyField from './ReadOnlyField';
 import {WithFormValue} from 'react-forms';
 import uploadFile from '../upload';
+import './animation.css'

 export let FileUploadInput = React.createClass({

@@ -30,6 +31,20 @@
     color: 'rgb(234, 69, 69)'
   },

+  styleNote: {
+    color: '#8e8ee2',
+    fontSize: '90%',
+    fontWight: '400',
+    marginRight: '10px'
+  },
+
+  styleIconAnimation: {
+    display: 'inline-block',
+    marginLeft: '5px',
+    animation: 'spin .7s infinite linear',
+    webkitAnimation: 'spin2 0.9s infinite linear'
+  },
+
   getDefaultProps() {
     return {uploadFile};
   },
@@ -45,9 +60,15 @@
     return (
       <HBox {...props} onChange={undefined} storage={undefined}>
         <VBox>
-          <Button disabled={progress} icon="hdd" onClick={this.onClick}>
-            Choose file
-          </Button>
+          {progress ?
+            <span style={this.styleNote}>
+              Loading
+              <Icon name="refresh" style={this.styleIconAnimation} />
+            </span> :
+            <Button disabled={progress} icon="hdd" onClick={this.onClick}>
+              Choose file
+            </Button>
+          }
         </VBox>
         {error ?
           <VBox justifyContent="center" margin="0 0 0 10px" flex={1}>
diff -r d4c6335b8e2c static/js/lib/form/animation.css
--- /dev/null   Thu Jan 01 00:00:00 1970 +0000
+++ b/static/js/lib/form/animation.css  Wed Oct 26 12:46:15 2016 +0200
@@ -0,0 +1,9 @@
+@-webkit-keyframes spin2 {
+    from { -webkit-transform: rotate(0deg);}
+    to { -webkit-transform: rotate(360deg);}
+}
+
+@keyframes spin {
+    from { transform: scale(1) rotate(0deg);}
+    to { transform: scale(1) rotate(360deg);}
+}