JSFiddle - React, Tailwind, and code Playground

by Alan Doe

HTML

<script src="http://angular-file-upload.appspot.com/js/ng-file-upload.js"></script>
<div ng-app="uploadit" ng-controller="myCtrl">

    <div ngf-drop class="fileUpload" ng-model="files" ngf-multiple="true" ngf-allow-dir="true">
        </div>
    <div ngf-no-file-drop>sorry no file drops</div>
</div>

CSS

.fileUpload
{
    width:300px;
    height:300px;
    background-color:rgb(240,240,240);
    
}

JavaScript

function file(name,path,parent,extn)
{
    this.name = name;
    this.path = path;
    this.parent = parent;
    this.extention = extn;
}
function direct(name, path, parent,files)
{
    this.name = name;
    this.path = path;
    this.parent = parent;
    this.files = files;
}

var tree = 
    {
        files : [],
        directories : []
    };


var mod = angular.module("uploadit", ["ngFileUpload"]);

mod.controller('myCtrl', function($scope)
               {
              
                   $scope.$watch('files',function()
                                 {
                                     $scope.upload($scope.files);
                                 });  

                   
                   $scope.upload = function(uploads)
                   {
                       if(uploads && uploads.length){    
                           for(var c = 0; c  < uploads.length; c++)
                           {    
                               var file = uploads[c];
                               var keys =[];
                               
                               for(var t in file)
                               {
                                   keys.push(t);
                                   alert('prop ' +t + " " +file[t]);
                               }
                               
                               alert('keys ' + keys);
                               
                               alert(' split at  . ' + file.name.split('.'));
                               alert(' split at  . ' + file.path.split('/'));
                               
                               /*
                               if(file.type == 'directory')
                               {
                                   addDirectory(file);
                               }
                               else
                               {
                                   addFile(file)
                               }*/
                              ...