uploader defaultprops

js/components/ascribe_uploader/react_s3_fine_uploader.js

@@ -6,6 +6,8 @@ import promise from 'es6-promise';
 promise.polyfill();
 
 import fetch from 'isomorphic-fetch';
+import AppConstants from '../../constants/application_constants';
+
 
 import fineUploader from 'fineUploader';
 import FileDragAndDrop from './file_drag_and_drop';
@@ -18,7 +20,8 @@ var ReactS3FineUploader = React.createClass({
     propTypes: {
         keyRoutine: React.PropTypes.shape({
             url: React.PropTypes.string,
-            fileClass: React.PropTypes.string
+            fileClass: React.PropTypes.string,
+            bitcoinId: React.PropTypes.string
         }),
         createBlobRoutine: React.PropTypes.shape({
             url: React.PropTypes.string
@@ -84,7 +87,64 @@ var ReactS3FineUploader = React.createClass({
             uploader: new fineUploader.s3.FineUploaderBasic(this.propsToConfig())
         };
     },
-
+    getDefaultProps() {
+        return {
+            autoUpload: true,
+            debug: false,
+            objectProperties: {
+                acl: 'public-read',
+                bucket: 'ascribe0'
+            },
+            request: {
+                endpoint: 'https://ascribe0.s3.amazonaws.com',
+                accessKey: 'AKIAIVCZJ33WSCBQ3QDA'
+            },
+            uploadSuccess: {
+                params: {
+                    isBrowserPreviewCapable: fineUploader.supportedFeatures.imagePreviews
+                }
+            },
+            signature: {
+                endpoint: AppConstants.serverUrl + 's3/signature/'
+                //customHeaders: {
+                //    'Authorization': 'OAuth ' + getCookie('sessionid')
+                //}
+            },
+            deleteFile: {
+                enabled: true,
+                method: 'DELETE',
+                endpoint: AppConstants.serverUrl + 's3/delete'
+                //customHeaders: {
+                //    'X-CSRFToken': getCookie('csrftoken')
+                //}
+            },
+            cors: {
+                expected: true
+            },
+            chunking: {
+                enabled: true
+            },
+            resume: {
+                enabled: true
+            },
+            retry: {
+                enableAuto: false
+            },
+            session: {
+                endpoint: null
+            },
+            messages: {
+                unsupportedBrowser: '<h3>Upload is not functional in IE7 as IE7 has no support for CORS!</h3>'
+            },
+            formatFileName: function(name){// fix maybe
+                if (name !== undefined && name.length > 26) {
+                    name = name.slice(0, 15) + '...' + name.slice(-15);
+                }
+                return name;
+            },
+            multiple: false
+        };
+    },
     propsToConfig() {
         let objectProperties = this.props.objectProperties;
         objectProperties.key = this.requestKey;
@@ -140,7 +200,8 @@ var ReactS3FineUploader = React.createClass({
                 credentials: 'include',
                 body: JSON.stringify({
                     'filename': filename,
-                    'file_class': 'digitalwork'
+                    'file_class': this.props.keyRoutine.fileClass,
+                    'bitcoin_id': this.props.keyRoutine.bitcoinId
                 })
             })
             .then((res) => {
@@ -326,7 +387,7 @@ var ReactS3FineUploader = React.createClass({
                 onDrop={this.handleUploadFile}
                 filesToUpload={this.state.filesToUpload}
                 handleDeleteFile={this.handleDeleteFile}
-                multiple={this.props.multiple} 
+                multiple={this.props.multiple}
                 dropzoneInactive={!this.props.multiple && this.state.filesToUpload.length > 0} />
         );
     }

js/components/edition.js

@@ -27,6 +27,9 @@ import RequestActionForm from './ascribe_forms/form_request_action';
 import EditionActions from '../actions/edition_actions';
 import AclButtonList from './ascribe_buttons/acl_button_list';
 
+import fineUploader from 'fineUploader';
+import ReactS3FineUploader from './ascribe_uploader/react_s3_fine_uploader';
+
 import GlobalNotificationModel from '../models/global_notification_model';
 import GlobalNotificationActions from '../actions/global_notification_actions';
 
@@ -460,12 +463,40 @@ let EditionFurtherDetails = React.createClass({
                         handleSuccess={this.showNotification}
                         editable={editable}
                         edition={this.props.edition} />
+                    <FileUploader
+                        edition={this.props.edition}
+                        ref='uploader'/>
                 </Col>
             </Row>
         );
     }
 });
 
+let FileUploader = React.createClass( {
+    handleChange(){
+        this.setState({other_data_key: this.refs.fineuploader.state.filesToUpload[0].key});
+    },
+    render() {
+        return (
+            <ReactS3FineUploader
+                ref='fineuploader'
+                keyRoutine={{
+                    url: AppConstants.serverUrl + 's3/key/',
+                    fileClass: 'otherdata',
+                    bitcoinId: this.props.edition.bitcoin_id
+                }}
+                createBlobRoutine={{
+                    url: apiUrls.blob_digitalworks
+                }}
+                handleChange={this.handleChange}
+                validation={{
+                    itemLimit: 100000,
+                    sizeLimit: '10000000'
+                }}/>
+        );
+    }
+});
+
 let CoaDetails = React.createClass({
     propTypes: {
         edition: React.PropTypes.object

js/components/register_piece.js

@@ -2,8 +2,8 @@
 
 import React from 'react';
 
+import { getCookie } from '../utils/fetch_api_utils';
 import AppConstants from '../constants/application_constants';
-import fineUploader from 'fineUploader';
 
 import Router from 'react-router';
 
@@ -19,6 +19,7 @@ import ReactS3FineUploader from './ascribe_uploader/react_s3_fine_uploader';
 
 import DatePicker from 'react-datepicker/dist/react-datepicker';
 
+
 let RegisterPiece = React.createClass( {
     mixins: [Router.Navigation],
 
@@ -128,58 +129,10 @@ let FileUploader = React.createClass( {
                     url: apiUrls.blob_digitalworks
                 }}
                 handleChange={this.props.handleChange}
-                autoUpload={true}
-                debug={false}
-                objectProperties={{
-                    acl: 'public-read',
-                    bucket: 'ascribe0'
-                }}
-                request={{
-                    endpoint: 'https://ascribe0.s3.amazonaws.com',
-                    accessKey: 'AKIAIVCZJ33WSCBQ3QDA'
-                }}
-                signature={{
-                    endpoint: AppConstants.serverUrl + 's3/signature/'
-                }}
-                uploadSuccess={{
-                    params: {
-                        isBrowserPreviewCapable: fineUploader.supportedFeatures.imagePreviews
-                    }
-                }}
-                cors={{
-                    expected: true
-                }}
-                chunking={{
-                    enabled: true
-                }}
-                resume={{
-                    enabled: true
-                }}
-                retry={{
-                    enableAuto: false
-                }}
-                deleteFile={{
-                    enabled: true,
-                    method: 'DELETE',
-                    endpoint: AppConstants.serverUrl + 's3/delete'
-                }}
                 validation={{
                     itemLimit: 100000,
                     sizeLimit: '25000000000'
-                }}
+                }}/>
-                session={{
-                    endpoint: null
-                }}
-                messages={{
-                    unsupportedBrowser: '<h3>Upload is not functional in IE7 as IE7 has no support for CORS!</h3>'
-                }}
-                formatFileName={(name) => {// fix maybe
-                    if (name !== undefined && name.length > 26) {
-                        name = name.slice(0, 15) + '...' + name.slice(-15);
-                    }
-                    return name;
-                }}
-                multiple={true}/>
         );
     }
 });