1.0.31 • Published 2 years ago

mongo-db-filesystem-ui v1.0.31

Weekly downloads
-
License
MIT
Repository
-
Last release
2 years ago

Contents

Introduction

Example 1

Example 2

General Usage

Public Interface

Introduction

mogo-db-filesystem-ui is a front end library use for building a "Windows like" File Explorer application for managing and browsing folders and files stored on a mongo-db-filesystem. It provides a graphical interface for the user to navigate and access the files stored in a mongoDB filsystem.

Example 1

index.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>

    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>

    <script src="https://unpkg.com/mongo-db-filesystem-ui/js/fileSystem-min.js"></script>
    <link href="https://unpkg.com/mongo-db-filesystem-ui/css/fileSystem.min.css" rel="stylesheet" />

    <script src="index.js" defer></script>
  </head>

  <body>
    <button class="mongo-fs-login-logout-register btn btn-primary">Mongo-Filesystem</button>
    ...
  </body>
</html>

index.js

  initFileSystem();
  const fileSystemServices = new FileSystemServices();
  fileSystemServices.enableNotepad();

back to contents

button image

button image

explorer dialog image

Example 2

Add a textarea element to index.html

...
<body>
  <button class="mongo-fs-login-logout-register btn btn-primary">Mongo-Filesystem</button>

  <div>
    <textarea
      name="textEditor"
      id="textEditor"
      cols="30"
      rows="10"
    ></textarea>
  </div>
  ...
</body>
...

index.js

  initFileSystem();

  const fsOptions = {
    //Use to build the "Save as" type dropdown menu
    listOfFileTypes: [
      {
        display: "Grapher plot (*.plt)",
        ext: ".plt",
        defaultFilename: "Grapher Plot",
      },
      {
        display: "Data table (*.tbl)",
        ext: ".tbl",
        defaultFilename: "Data table",
      },
    ],

    //Use to build the "Open with" right click menu
    listOfOpenWithTypes: [
      { name: "Text Editor", options: { encoding: "utf8", flag: "r" } },
      { name: "Grapher", options: { encoding: "utf8", flag: "r" } },
    ],
  };
  const fileSystemServices = new FileSystemServices(fsOptions);
  fileSystemServices.enableNotepad();

  class GrapherEditor extends Editor {
    constructor(options) {
      super(options);
      const self = this;

      //Associate save and saveas menu items with the editor
      options.fs.addSaveMenuItem(self);
      options.fs.addSaveAsMenuItem(self);

      options.fs.registerEditor({ name: "Grapher", editor: self });
    }

    getData() {
      return $("#textEditor").val();
    }

    setData(data, filename, ext, editorName) {
      if (
        ext === ".tbl" ||
        ext === ".txt" ||
        ext === ".plt" ||
        editorName == "Grapher"
      ) {
        if (ext === ".plt" || ext === ".txt" || ext === ".tbl") {
          $("#textEditor").val(data);
        }
        if (ext === ".plt") {
          this.currentFilename(filename);
        }
      }
    }
  }

  const options = {};
  options.fs = fileSystemServices;
  options.editorName = "Grapher";
  options.fileExtensions = [".plt", ".tbl", ".txt"];

  new GrapherEditor(options);

back to contents

Public Interface

FileSystemServices

  • FileSystemServices.addMongoFsMenuItems

  • FileSystemServices.addNotepadMenuItem

  • FileSystemServices.addSaveAsMenuItem

  • FileSystemServices.addSaveMenuItem

  • FileSystemServices.clearRefreshToken

  • FileSystemServices.connectFs

  • FileSystemServices.currentFilename

  • FileSystemServices.disconnectFs

  • FileSystemServices.enableNotepad

  • FileSystemServices.explorerDlg

  • FileSystemServices.getRefreshToken

  • FileSystemServices.isConnected

  • FileSystemServices.loginModalDlg

  • FileSystemServices.registerEditor

  • FileSystemServices.registerFs

  • FileSystemServices.registerModalDlg

  • FileSystemServices.save

  • FileSystemServices.saveAsDlg

  • FileSystemServices.setData

  • FileSystemServices.storeRefreshToken

Editor

  • Editor.currentFileModified

  • Editor.currentFilename

  • Editor.editorOpened

  • Editor.getData

  • Editor.getEditorData

  • Editor.getExtensions

  • Editor.initEditor

  • Editor.openFile

  • Editor.resetEditor

  • Editor.save

  • Editor.saveAs

  • Editor.setData

  • Editor.setExplorerDlgParent

1.0.19

2 years ago

1.0.18

2 years ago

1.0.17

2 years ago

1.0.22

2 years ago

1.0.21

2 years ago

1.0.20

2 years ago

1.0.26

2 years ago

1.0.25

2 years ago

1.0.24

2 years ago

1.0.23

2 years ago

1.0.29

2 years ago

1.0.28

2 years ago

1.0.27

2 years ago

1.0.31

2 years ago

1.0.30

2 years ago

1.0.16

2 years ago

1.0.15

2 years ago

1.0.14

2 years ago

1.0.13

2 years ago

1.0.12

2 years ago

1.0.11

2 years ago

1.0.10

2 years ago

1.0.9

2 years ago

1.0.8

2 years ago

1.0.7

2 years ago

1.0.6

2 years ago

1.0.5

2 years ago

1.0.4

2 years ago

1.0.3

2 years ago

1.0.2

2 years ago

1.0.1

2 years ago

1.0.0

2 years ago