onion/js/components/ascribe_forms/form_consign.js

//'use strict';
//
//import React from 'react';
//
//import ApiUrls from '../../constants/api_urls';
//import FormMixin from '../../mixins/form_mixin';
//import InputText from './input_text';
//import InputTextArea from './input_textarea';
//import ButtonSubmitOrClose from '../ascribe_buttons/button_submit_close';
//import { getLangText } from '../../utils/lang_utils.js'
//
//let ConsignForm = React.createClass({
//    mixins: [FormMixin],
//
//
//    url() {
//        return ApiUrls.ownership_consigns;
//    },
//
//    getFormData() {
//        return {
//            bitcoin_id: this.getBitcoinIds().join(),
//            consignee: this.refs.consignee.state.value,
//            consign_message: this.refs.consign_message.state.value,
//            password: this.refs.password.state.value
//        };
//    },
//
//    renderForm() {
//        let title = this.getTitlesString().join('');
//        let username = this.props.currentUser.username;
//        let message =
//`${getLangText('Hi')},
//
//${getLangText('I consign')} :
//${title}${getLangText('to you')}.
//
//${getLangText('Truly yours')},
//${username}`;
//
//        return (
//            <form id="consign_modal_content" role="form" onSubmit={this.submit}>
//                <input className="invisible" type="email" name="fake_consignee"/>
//                <input className="invisible" type="password" name="fake_password"/>
//                <InputText
//                    ref="consignee"
//                    placeHolder={getLangText('Consignee email')}
//                    required="required"
//                    type="email"
//                    submitted={this.state.submitted}/>
//                <InputTextArea
//                    ref="consign_message"
//                    defaultValue={message}
//                    required=""
//                    />
//                <InputText
//                    ref="password"
//                    placeHolder={getLangText('Password')}
//                    required="required"
//                    type="password"
//                    submitted={this.state.submitted}/>
//               <ButtonSubmitOrClose
//                    text={getLangText('CONSIGN')}
//                    onClose={this.props.onRequestHide}
//                    submitted={this.state.submitted} />
//            </form>
//        );
//    }
//});
////'use strict';
////
////import React from 'react';
////
////import ApiUrls from '../../constants/api_urls';
////import FormMixin from '../../mixins/form_mixin';
////import InputText from './input_text';
////import InputTextArea from './input_textarea';
////import ButtonSubmitOrClose from '../ascribe_buttons/button_submit_close';
////import { getLangText } from '../../utils/lang_utils.js'
////
////let TransferForm = React.createClass({
////    mixins: [FormMixin],
////
////    url() {
////        return ApiUrls.ownership_transfers;
////    },
////
////    getFormData() {
////        return {
////            bitcoin_id: this.getBitcoinIds().join(),
////            transferee: this.refs.transferee.state.value,
////            transfer_message: this.refs.transfer_message.state.value,
////            password: this.refs.password.state.value
////        };
////    },
////
////    renderForm() {
////        let title = this.getTitlesString().join('');
////        let username = this.props.currentUser.username;
////        let message =
////`${getLangText('Hi')},
////
////${getLangText('I transfer ownership of')} :
////${title}${getLangText('to you')}.
////
////${getLangText('Truly yours')},
////${username}`;
////
////        return (
////            <form id="transfer_modal_content" role="form" onSubmit={this.submit}>
////                <input className="invisible" type="email" name="fake_transferee"/>
////                <input className="invisible" type="password" name="fake_password"/>
////                <InputText
////                    ref="transferee"
////                    placeHolder={getLangText('Transferee email')}
////                    required="required"
////                    type="email"
////                    submitted={this.state.submitted}/>
////                <InputTextArea
////                    ref="transfer_message"
////                    defaultValue={message}
////                    required=""
////                    />
////                <InputText
////                    ref="password"
////                    placeHolder={getLangText('Password')}
////                    required="required"
////                    type="password"
////                    submitted={this.state.submitted}/>
////                <div>
////                    Make sure that display instructions and technology details are correct.
////                    They cannot be edited after the transfer.
////                </div>
////               <ButtonSubmitOrClose
////                    text={getLangText('TRANSFER')}
////                    onClose={this.props.onRequestHide}
////                    submitted={this.state.submitted} />
////            </form>
////        );
////    }
////});
////
'use strict';

import React from 'react';

import Button from 'react-bootstrap/lib/Button';
import Alert from 'react-bootstrap/lib/Alert';

import Form from './form';
import Property from './property';
import InputTextAreaToggable from './input_textarea_toggable';


import AppConstants from '../../constants/application_constants';
import { getLangText } from '../../utils/lang_utils.js';


let ConsignForm = React.createClass({
    propTypes: {
        url: React.PropTypes.string,
        id: React.PropTypes.object,
        message: React.PropTypes.string,
        editions: React.PropTypes.array,
        currentUser: React.PropTypes.object,
        onRequestHide: React.PropTypes.func,
        handleSuccess: React.PropTypes.func
    },

    getFormData(){
        return this.props.id;
    },

    render() {

        return (
            <Form
                ref='form'
                url={this.props.url}
                getFormData={this.getFormData}
                handleSuccess={this.props.handleSuccess}
                buttons={
                    <div className="modal-footer">
                        <p className="pull-right">
                            <Button
                                className="btn btn-default btn-sm ascribe-margin-1px"
                                type="submit">{getLangText('CONSIGN')}</Button>
                            <Button
                                className="btn btn-danger btn-delete btn-sm ascribe-margin-1px"
                                style={{marginLeft: '0'}}
                                onClick={this.props.onRequestHide}>{getLangText('CLOSE')}</Button>
                        </p>
                    </div>}
                spinner={
                    <div className="modal-footer">
                        <img src={AppConstants.baseUrl + 'static/img/ascribe_animated_small.gif'} />
                    </div>}>
                <Property
                    name='consignee'
                    label={getLangText('Email')}>
                    <input
                        type="email"
                        placeholder={getLangText('Email of the consignee')}
                        required/>
                </Property>
                <Property
                    name='consign_message'
                    label={getLangText('Personal Message')}
                    editable={true}>
                    <InputTextAreaToggable
                        rows={1}
                        editable={true}
                        defaultValue={this.props.message}
                        placeholder={getLangText('Enter a message...')}
                        required="required"/>
                </Property>
                <Property
                    name='password'
                    label={getLangText('Password')}>
                    <input
                        type="password"
                        placeholder={getLangText('Enter your password')}
                        required/>
                </Property>
                <hr />
            </Form>
        );
    }
});

export default ConsignForm;