How to use the react-dnd.NativeDragItemTypes.FILE function in react-dnd

To help you get started, we’ve selected a few react-dnd examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github GeReV / mpdisco / client / js / library.jsx View on Github external
onUploadFail={this.uploadFail}
                            />
                        );
                    }.bind(this))}
                
            );
        }

        var artists = this.cursors.artists.get();

        //<menu>
        //    <input placeholder="Search" id="search" type="text">
        //</menu>

        return (
            <section id="library">
                <header>Library</header>
                <div>
                    
                        {artists.map(function(artist) {
                            return (
                                
                            );
                        }, this)}
                    
                    
                        {uploads}</div></section>
github GeReV / mpdisco / client / js / library.jsx View on Github external
configureDragDrop: function(register) {
            register(NativeDragItemTypes.FILE, {
                dropTarget: {
                    acceptDrop: function(component, item) {
                        if (!item) {
                            return;
                        }

                        if (_.isArray(item.files)) {
                            component.setState({
                                uploads: item.files,    // These will be rendered.
                                uploading: item.files   // These will be used to keep track of progress.
                            });
                        }
                    }
                }
            });
        }
github gre / diaporama-maker / client / ui / Library / index.js View on Github external
configureDragDrop (register) {
      register(NativeDragItemTypes.FILE, {
        dropTarget: {
          acceptDrop (component, item) {
            const files = item.files.filter(
              file => acceptedImageMimetypes.indexOf(file.type) !== -1);

            let upItems = files.map(f => {
              const item = {
                id: "upload:"+f.name,
                title: f.name,
                upload: {
                  dataURL: null,
                  loaded: 0,
                  total: 0
                }
              };
github gre / diaporama-maker / client / ui / Library / index.js View on Github external
let mouseEvents;
    if (down) {
      mouseEvents = {
        onMouseMove: this.selectionMouseMove,
        onMouseUp: this.selectionMouseUp,
        onMouseLeave: this.selectionMouseLeave
      };
    }
    else {
      mouseEvents = {
        onMouseDown: this.selectionMouseDown
      };
    }

    return <div style="{{">
      <div style="{scrollContainerStyle}">
        {items}
      </div>
      <div style="{bgMouseEventsStyle}"></div>
      <div style="{selectionStyle}"></div>
    </div>;
  }
});