File

src/app/file-dir-card/file-dir-card.component.ts

Metadata

selector app-file-dir-card
styleUrls file-dir-card.component.scss
templateUrl file-dir-card.component.html

Inputs

directory

Type: Directory

file

Type: File

isFile

Type: boolean

isNew

Type: boolean

level

Type: number

noEdits

Default value: false

parentDirs

Type: Directory[]

parentFiles

Type: File[]

parentPath

Type: string

trace

Type: number[]

Outputs

cancelled $event type: EventEmitter<boolean>
createDir $event type: EventEmitter<any>
createFile $event type: EventEmitter<File>
deleteDir $event type: EventEmitter<any>
deleteFile $event type: EventEmitter<any>

Constructor

constructor(fileService: FileService, apiService: ApiService)

Methods

onDelete
onDelete()

Called on delete request by the user, requests the server to delete the corresonding file or directory as stored by the component.

Returns: void
addToTraceDir
addToTraceDir(dir: Directory)
Returns: number[]
addToTraceFile
addToTraceFile(file: File)
Returns: number[]
deleteFileExec
deleteFileExec($event: any)

Called when a contained file is successfully deleted by the backend to remove the corresponding subcomponent from the
directory tree on the frontend.

Returns: void
deleteDirExec
deleteDirExec($event: any)

Called when a subdirectory is successfully deleted by the backend to remove the corresponding subcomponent from the
directory tree on the frontend.

Returns: void
onCreateDir
onCreateDir()

Requests the server to create a new directory as requested by the user and hence notifies the user.

Returns: void
getRouterLink
getRouterLink()

Returns the encoded path to the file to serve the purpose of redirecting to the IDE component.

Returns: string
onCreateFile
onCreateFile()

Requests the server to create a new empty file and on it being successful, emits a notification to the parent workspace component.

Returns: void
createFileExec
createFileExec(file: File)

Update the directory tree at the client side UI and adds the corresponding new bar to the new file.

Parameters :
  • file
    • Input File interface.
Returns: void
createDirExec
createDirExec(name: string)

Update the directory tree at the client side UI and adds the corresponding new bar to the new directory.

Parameters :
  • name
    • Input directory name.
Returns: void
Private countFiles
countFiles(directory: Directory)

Counts the total number of files recursively in a directory.

Parameters :
  • directory
    • Input directory as a Directory interface instance.
Returns: number
present
present(newName: string)

Checks whether a file or folder with the same name already exists inside the same parent directory.

Parameters :
  • newName
    • The name to be checked for.
Returns: boolean

Properties

creating
creating: boolean
Default value: false
creatingNewSub
creatingNewSub: number
Default value: 0
deleting
deleting: boolean
dirnames
dirnames: any[]
extensions
extensions: string[]
filenames
filenames: any[]
isErrorCreating
isErrorCreating: boolean
Default value: false
isErrorDeleting
isErrorDeleting: boolean
Default value: false
isExpanded
isExpanded: boolean
Default value: false
lang
lang: number
Default value: 0
newName
newName: string
import {Component, EventEmitter, Input, OnInit, Output} from '@angular/core';
import {File} from '../file';
import {Directory} from '../directory';
import {FileService} from '../file.service';
import {ApiService} from '../api.service';

@Component({
  selector: 'app-file-dir-card',
  templateUrl: './file-dir-card.component.html',
  styleUrls: ['./file-dir-card.component.scss']
})
export class FileDirCardComponent implements OnInit {

  @Input() isFile: boolean;
  @Input() level: number;
  @Input() file: File;
  @Input() directory: Directory;
  @Input() trace: number[];
  @Input() isNew: boolean;
  @Input() parentPath: string;
  @Input() noEdits = false;
  @Input() parentDirs: Directory[];
  @Input() parentFiles: File[];

  deleting: boolean;
  isExpanded = false;
  newName = '';
  isErrorDeleting = false;
  isErrorCreating = false;
  creating = false;
  creatingNewSub = 0;
  extensions = ['.cpp', '.py', '.java'];
  lang = 0;
  filenames = [];
  dirnames = [];

  @Output() deleteFile: EventEmitter<any> = new EventEmitter();
  @Output() deleteDir: EventEmitter<any> = new EventEmitter();
  @Output() createDir: EventEmitter<any> = new EventEmitter();
  @Output() createFile: EventEmitter<File> = new EventEmitter();
  @Output() cancelled: EventEmitter<boolean> = new EventEmitter();

  constructor(private fileService: FileService, private apiService: ApiService) {
  }

  ngOnInit(): void {
    if (!this.isFile && !this.isNew) {
      this.filenames = this.directory.files.map(item => item.filename);
      this.dirnames = this.directory.dirs.map(item => item.name);
    }
  }

  /**
   * Called on delete request by the user, requests the server to delete the corresonding file or directory as stored by the component.
   */
  onDelete(): void {
    this.deleting = true;
    this.fileService.delete(this.isFile ? this.file : this.directory, this.isFile,
      JSON.parse(this.apiService.getToken()).username, this.isFile ? 0 : this.countFiles(this.directory)).subscribe(
      data => {
        console.log(data);
        if (this.isFile) {
          this.deleteFile.emit(this.file);
        } else {
          this.deleteDir.emit(this.directory);
        }
        this.deleting = false;
      }, error => {
        console.log(error);
      }
    );
  }

  /**
   * @ignore
   */
  addToTraceDir(dir: Directory): number[] {
    const arr = JSON.parse(JSON.stringify(this.trace));
    arr.push(this.directory.dirs.indexOf(dir));
    return arr;
  }

  /**
   * @ignore
   */
  addToTraceFile(file: File): number[] {
    const arr = JSON.parse(JSON.stringify(this.trace));
    arr.push(this.directory.files.indexOf(file));
    return arr;
  }

  /**
   * Called when a contained file is successfully deleted by the backend to remove the corresponding subcomponent from the
   * directory tree on the frontend.
   */
  deleteFileExec($event: any): void {
    const index = this.directory.files.indexOf($event, 0);
    if (index > -1) {
      this.directory.files.splice(index, 1);
    }
  }

  /**
   * Called when a subdirectory is successfully deleted by the backend to remove the corresponding subcomponent from the
   * directory tree on the frontend.
   */
  deleteDirExec($event: any): void {
    const index = this.directory.dirs.indexOf($event, 0);
    if (index > -1) {
      this.directory.dirs.splice(index, 1);
    }
  }

  /**
   * Requests the server to create a new directory as requested by the user and hence notifies the user.
   */
  onCreateDir(): void {
    this.creating = true;
    this.fileService.createDirectory(JSON.parse(this.apiService.getToken()).username, this.newName, this.parentPath)
      .subscribe(data => {
        if (data === '0') {
          this.creating = false;
          this.isErrorCreating = true;
        } else {
          this.createDir.emit(this.newName);
        }
      });
  }

  /**
   * Returns the encoded path to the file to serve the purpose of redirecting to the IDE component.
   */
  getRouterLink(): string {
    return '/arena/file/' + encodeURIComponent(this.file.path + '/' + this.file.filename + this.file.language);
  }

  /**
   * Requests the server to create a new empty file and on it being successful, emits a notification to the parent workspace component.
   */
  onCreateFile(): void {
    this.creating = true;
    const file: File = {
      username: JSON.parse(this.apiService.getToken()).username,
      filename: this.newName,
      language: this.extensions[this.lang],
      text: '',
      path: this.parentPath
    };
    this.fileService.upload(file, false).subscribe(data => {
      if (data === '1') {
        console.log(data);
        this.createFile.emit(file);
      } else {
        console.log(data);
        this.creating = false;
        this.isErrorCreating = true;
      }
    });
  }

  /**
   * Update the directory tree at the client side UI and adds the corresponding new bar to the new file.
   * @param file - Input File interface.
   */
  createFileExec(file: File): void {
    this.directory.files.push(file);
    this.creatingNewSub = 0;
  }

  /**
   * Update the directory tree at the client side UI and adds the corresponding new bar to the new directory.
   * @param name - Input directory name.
   */
  createDirExec(name: string): void {
    this.directory.dirs.push({
      name,
      dirs: [],
      files: [],
      path: this.directory.path + this.directory.name + '/',
    });
    this.creatingNewSub = 0;
  }

  /**
   * Counts the total number of files recursively in a directory.
   * @param directory - Input directory as a Directory interface instance.
   * @private
   */
  private countFiles(directory: Directory): number {
    let count = directory.files.length;
    for (const dir of directory.dirs) {
      count += this.countFiles(dir);
    }
    return count;
  }

  /**
   * Checks whether a file or folder with the same name already exists inside the same parent directory.
   * @param newName - The name to be checked for.
   */
  present(newName: string): boolean {
    if (this.isFile) {
      return this.parentFiles.map(item => item.filename + item.language).includes(newName + this.extensions[this.lang]);
    } else {
      return this.parentDirs.map(item => item.name).includes(newName);
    }
  }
}

results matching ""

    No results matching ""