chore(Angular): Remove ng2-file-upload dependency (#1734)

WISE-Community · Apr 16, 2024 · 65ebbea · 65ebbea
1 parent 3807e4d
commit 65ebbea
Show file tree

Hide file tree

Showing 6 changed files with 35 additions and 64 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -57,7 +57,6 @@
     "microphone-stream": "^6.0.1",
     "ng-file-upload": "^12.2.13",
     "ng-recaptcha": "^12.0.2",
-    "ng2-file-upload": "^5.0.0",
     "ngx-filesize": "^3.0.2",
     "process": "^0.11.10",
     "rxjs": "^7.5.6",
@@ -223,4 +222,4 @@
       ]
     ]
   }
-}
+}
diff --git a/...assets/wise5/authoringTool/project-asset-authoring/project-asset-authoring.component.html b/...assets/wise5/authoringTool/project-asset-authoring/project-asset-authoring.component.html
@@ -1,18 +1,17 @@
 <div class="root">
   <div
     class="drop-box"
-    ng2FileDrop
-    (onFileDrop)="fileChosen($event)"
+    (fileDropped)="uploadAssetItems($event)"
+    dragAndDrop
     accept="image/*,application/pdf,text/csv,text/javascript"
-    i18n
   >
-    Drop image or file here or click to upload!
+    <span i18n>Drop image or file here or click to upload!</span>
     <input
       type="file"
       accept="image/*,application/pdf,text/csv,text/javascript"
       class="file-input"
-      (onFileSelected)="fileChosen($event)"
-      ng2FileSelect
+      (change)="uploadAssetItems($event.target.files)"
+      #fileDropRef
       multiple
     />
   </div>

diff --git a/src/assets/wise5/authoringTool/project-asset-authoring/project-asset-authoring.component.ts b/src/assets/wise5/authoringTool/project-asset-authoring/project-asset-authoring.component.ts
@@ -148,6 +148,7 @@ export class ProjectAssetAuthoringComponent {
   }
 
   protected uploadAssetItems(files: any[]): void {
+    files = Array.from(files);
     let performUploadOfAllFiles = true;
     const largeAndSmallFiles = this.separateLargeAndSmallFiles(files);
     const largeFiles = largeAndSmallFiles.largeFiles;
@@ -269,9 +270,4 @@ export class ProjectAssetAuthoringComponent {
     this.totalUnusedFilesSize = totalUnusedFilesSize;
     this.unusedFilesPercentage = this.projectAssetService.getAssetUnusedPercentage();
   }
-
-  protected fileChosen(event: any): void {
-    const files = Array.from(event);
-    this.uploadAssetItems(files);
-  }
 }
diff --git a/src/assets/wise5/authoringTool/project-asset-authoring/project-asset-authoring.module.ts b/src/assets/wise5/authoringTool/project-asset-authoring/project-asset-authoring.module.ts
@@ -1,6 +1,5 @@
 import { NgModule } from '@angular/core';
 import { ProjectAssetAuthoringComponent } from './project-asset-authoring.component';
-import { FileUploadModule } from 'ng2-file-upload';
 import { NgxFilesizeModule } from 'ngx-filesize';
 import { MatFormFieldModule } from '@angular/material/form-field';
 import { MatIconModule } from '@angular/material/icon';
@@ -10,12 +9,13 @@ import { FormsModule } from '@angular/forms';
 import { MatButtonModule } from '@angular/material/button';
 import { FlexLayoutModule } from '@angular/flex-layout';
 import { MatTooltipModule } from '@angular/material/tooltip';
+import { DragAndDropModule } from '../../common/drag-and-drop/drag-and-drop.module';
 
 @NgModule({
   declarations: [ProjectAssetAuthoringComponent],
   imports: [
     CommonModule,
-    FileUploadModule,
+    DragAndDropModule,
     FlexLayoutModule,
     FormsModule,
     MatButtonModule,

diff --git a/src/messages.xlf b/src/messages.xlf
@@ -703,7 +703,7 @@
         </context-group>
         <context-group purpose="location">
           <context context-type="sourcefile">src/assets/wise5/authoringTool/project-asset-authoring/project-asset-authoring.component.html</context>
-          <context context-type="linenumber">86</context>
+          <context context-type="linenumber">85</context>
         </context-group>
         <context-group purpose="location">
           <context context-type="sourcefile">src/assets/wise5/authoringTool/project-authoring/project-authoring.component.html</context>
@@ -11984,81 +11984,82 @@ Click &quot;Cancel&quot; to keep the invalid JSON open so you can fix it.</sourc
           <context context-type="linenumber">24</context>
         </context-group>
       </trans-unit>
-      <trans-unit id="f96faab393e2749256e2f2e3dda5e04d42d078c9" datatype="html">
-        <source> Drop image or file here or click to upload! <x id="TAG_INPUT" ctype="x-input" equiv-text="&lt;input
-      type=&quot;file&quot;
-      accept=&quot;image/*,application/pdf,text/csv,text/javascript&quot;
-      class=&quot;file-input&quot;
-      (onFileSelected)=&quot;fileChosen($event)&quot;
-      ng2FileSelect
-      multiple
-    /&gt;"/></source>
+      <trans-unit id="5abeb8898e4a9d00841c40124f192d0a71b3cc18" datatype="html">
+        <source>Drop image or file here or click to upload!</source>
         <context-group purpose="location">
           <context context-type="sourcefile">src/assets/wise5/authoringTool/project-asset-authoring/project-asset-authoring.component.html</context>
-          <context context-type="linenumber">8,17</context>
+          <context context-type="linenumber">8</context>
+        </context-group>
+        <context-group purpose="location">
+          <context context-type="sourcefile">src/assets/wise5/themes/default/notebook/edit-notebook-item-dialog/edit-notebook-item-dialog.component.html</context>
+          <context context-type="linenumber">48</context>
+        </context-group>
+        <context-group purpose="location">
+          <context context-type="sourcefile">src/assets/wise5/vle/studentAsset/student-assets/student-assets.component.html</context>
+          <context context-type="linenumber">24</context>
         </context-group>
       </trans-unit>
       <trans-unit id="713ee2647d2ff3f42ac8bcebc40da62cae77e4c4" datatype="html">
         <source> You are using <x id="INTERPOLATION" equiv-text="{{ totalFileSize | filesize }}"/> out of <x id="INTERPOLATION_1" equiv-text="{{ projectAssetTotalSizeMax | filesize }}"/> (<x id="INTERPOLATION_2" equiv-text="{{ projectAssetUsagePercentage.toFixed(0) }}"/>%) </source>
         <context-group purpose="location">
           <context context-type="sourcefile">src/assets/wise5/authoringTool/project-asset-authoring/project-asset-authoring.component.html</context>
-          <context context-type="linenumber">20,23</context>
+          <context context-type="linenumber">19,22</context>
         </context-group>
       </trans-unit>
       <trans-unit id="0f7dd1cf2540cae6c1f540147ab2765f26d8036e" datatype="html">
         <source>Sort Assets</source>
         <context-group purpose="location">
           <context context-type="sourcefile">src/assets/wise5/authoringTool/project-asset-authoring/project-asset-authoring.component.html</context>
-          <context context-type="linenumber">43</context>
+          <context context-type="linenumber">42</context>
         </context-group>
       </trans-unit>
       <trans-unit id="e41fb0ac5d1de2b37876e2138597c4c2de22caa2" datatype="html">
         <source>File Name A-&gt;Z</source>
         <context-group purpose="location">
           <context context-type="sourcefile">src/assets/wise5/authoringTool/project-asset-authoring/project-asset-authoring.component.html</context>
-          <context context-type="linenumber">45</context>
+          <context context-type="linenumber">44</context>
         </context-group>
       </trans-unit>
       <trans-unit id="188b4fd352b58f69d77d0648c4311a216b25ec5a" datatype="html">
         <source>File Name Z-&gt;A</source>
         <context-group purpose="location">
           <context context-type="sourcefile">src/assets/wise5/authoringTool/project-asset-authoring/project-asset-authoring.component.html</context>
-          <context context-type="linenumber">46</context>
+          <context context-type="linenumber">45</context>
         </context-group>
       </trans-unit>
       <trans-unit id="f495d65db54ebe89d0535f5a26fc6a364d1e03e8" datatype="html">
         <source>File Size Small -&gt; Large</source>
         <context-group purpose="location">
           <context context-type="sourcefile">src/assets/wise5/authoringTool/project-asset-authoring/project-asset-authoring.component.html</context>
-          <context context-type="linenumber">47</context>
+          <context context-type="linenumber">46</context>
         </context-group>
       </trans-unit>
       <trans-unit id="99de31db1b214bad9c6436ed775378ddf17f8275" datatype="html">
         <source>File Size Large -&gt; Small</source>
         <context-group purpose="location">
           <context context-type="sourcefile">src/assets/wise5/authoringTool/project-asset-authoring/project-asset-authoring.component.html</context>
-          <context context-type="linenumber">48</context>
+          <context context-type="linenumber">47</context>
         </context-group>
       </trans-unit>
       <trans-unit id="06739210fc777c5b898df5ff5b741095332bfc98" datatype="html">
         <source> Choose </source>
         <context-group purpose="location">
           <context context-type="sourcefile">src/assets/wise5/authoringTool/project-asset-authoring/project-asset-authoring.component.html</context>
-          <context context-type="linenumber">66,68</context>
+          <context context-type="linenumber">65,67</context>
         </context-group>
       </trans-unit>
       <trans-unit id="70329cb0ccfe0d0eb5f271927d9a786c747957a4" datatype="html">
         <source>(Not Used)</source>
         <context-group purpose="location">
           <context context-type="sourcefile">src/assets/wise5/authoringTool/project-asset-authoring/project-asset-authoring.component.html</context>
-          <context context-type="linenumber">71</context>
+          <context context-type="linenumber">70</context>
         </context-group>
       </trans-unit>
       <trans-unit id="dc75033a5238fdc4f462212c847a45ba8018a3fd" datatype="html">
         <source>Download</source>
         <context-group purpose="location">
           <context context-type="sourcefile">src/assets/wise5/authoringTool/project-asset-authoring/project-asset-authoring.component.html</context>
-          <context context-type="linenumber">77</context>
+          <context context-type="linenumber">76</context>
         </context-group>
       </trans-unit>
       <trans-unit id="2589779545965103394" datatype="html">
@@ -12075,37 +12076,37 @@ Click &quot;Cancel&quot; to keep the invalid JSON open so you can fix it.</sourc
 </source>
         <context-group purpose="location">
           <context context-type="sourcefile">src/assets/wise5/authoringTool/project-asset-authoring/project-asset-authoring.component.ts</context>
-          <context context-type="linenumber">192</context>
+          <context context-type="linenumber">193</context>
         </context-group>
       </trans-unit>
       <trans-unit id="4084608519102819263" datatype="html">
         <source>One of the files you are trying to upload is larger than 500 KB. We recommend using smaller files so they load faster for students. Are you sure you want to upload the large file?
 </source>
         <context-group purpose="location">
           <context context-type="sourcefile">src/assets/wise5/authoringTool/project-asset-authoring/project-asset-authoring.component.ts</context>
-          <context context-type="linenumber">194</context>
+          <context context-type="linenumber">195</context>
         </context-group>
       </trans-unit>
       <trans-unit id="4584433830649043341" datatype="html">
         <source><x id="PH" equiv-text="largeFiles.length"/> of the files you are trying to upload are larger than 500 KB. We recommend using smaller files so they load faster for students. Are you sure you want to upload these large files?
 </source>
         <context-group purpose="location">
           <context context-type="sourcefile">src/assets/wise5/authoringTool/project-asset-authoring/project-asset-authoring.component.ts</context>
-          <context context-type="linenumber">196</context>
+          <context context-type="linenumber">197</context>
         </context-group>
       </trans-unit>
       <trans-unit id="4189400927519041055" datatype="html">
         <source>Successfully uploaded:</source>
         <context-group purpose="location">
           <context context-type="sourcefile">src/assets/wise5/authoringTool/project-asset-authoring/project-asset-authoring.component.ts</context>
-          <context context-type="linenumber">225</context>
+          <context context-type="linenumber">226</context>
         </context-group>
       </trans-unit>
       <trans-unit id="3146021810870673369" datatype="html">
         <source>Error uploading: </source>
         <context-group purpose="location">
           <context context-type="sourcefile">src/assets/wise5/authoringTool/project-asset-authoring/project-asset-authoring.component.ts</context>
-          <context context-type="linenumber">234</context>
+          <context context-type="linenumber">235</context>
         </context-group>
       </trans-unit>
       <trans-unit id="6ab64ec395f796b771a2d87d2801d0fe60b871d2" datatype="html">
@@ -21774,17 +21775,6 @@ If this problem continues, let your teacher know and move on to the next activit
           <context context-type="linenumber">27</context>
         </context-group>
       </trans-unit>
-      <trans-unit id="5abeb8898e4a9d00841c40124f192d0a71b3cc18" datatype="html">
-        <source>Drop image or file here or click to upload!</source>
-        <context-group purpose="location">
-          <context context-type="sourcefile">src/assets/wise5/themes/default/notebook/edit-notebook-item-dialog/edit-notebook-item-dialog.component.html</context>
-          <context context-type="linenumber">48</context>
-        </context-group>
-        <context-group purpose="location">
-          <context context-type="sourcefile">src/assets/wise5/vle/studentAsset/student-assets/student-assets.component.html</context>
-          <context context-type="linenumber">24</context>
-        </context-group>
-      </trans-unit>
       <trans-unit id="eec31089571ce760c1f3c39edb0469e81ed2595f" datatype="html">
         <source><x id="START_TAG_SPAN" ctype="x-span" equiv-text="&lt;span class=&quot;mat-small&quot;&gt;"/>Share with Class<x id="CLOSE_TAG_SPAN" ctype="x-span" equiv-text="&lt;/span&gt;"/></source>
         <context-group purpose="location">