Data Operations, JavaScript Programming Example of Data Operations in File Manager

// get the contents of the current working directory
function getFilesCWD(){
  const path = $$("fm").getState().path;
  const data = $$("fm").getService("local");

  // since the cwd is in cache, we can pass true as 2nd param
  return data.files(path, true);
};

// get the contents of some arbitrary directory
function getFilesFrom(){
  const data = $$("fm").getService("local");

  return data.folders()
    .then(fs => data.files(fs.getFirstChildId("../files")))
}

function getAllDirs(){
  const data = $$("fm").getService("local");
  return data.folders();
}

function clearAll(){
  const data = $$("fm").getService("local");
  const path = $$("fm").getState().path;

  webix.promise.all([
    data.files(path), // files, right part
    data.folders(), // folders, left tree
  ]).then(res => {
    res[0].clearAll(); // clear files from curr path
    res[1].clearAll(); // clear all folders

    webix.message("All cleared, see Devtools console");
  });
}

// clear all files from local cache
function clearAllHard(){
  const data = $$("fm").getService("local");

  data.fscache.each(p => {
    p.clearAll();
    console.log(p.serialize());
  });
}

function reloadFiles(){
  const data = $$("fm").getService("local");
  const path = $$("fm").getState().path;
  webix.message(path);
  data.refresh(path);
}

function reloadDirs(){
  const data = $$("fm").getService("local");
  data.folders(true);
}

const filemanager = {
  view: "filemanager",
  id: "fm",
  url: "https://docs.webix.com/filemanager-backend/",
};

const gets = {
  cols:[
    {
      view: "button", value: "Get files from current path", width:250,
      click: () => {
        const cwd = getFilesCWD();
        console.log(cwd.serialize());
      }
    },
    {
      view: "button", value: "Get files from arbitrary path", width:250,
      click:function(){
        getFilesFrom().then(res => {
          console.log(res.serialize());
        })
      }
    },
    {
      view: "button", value: "Get all folders", width:250,
      click: function(){
        getAllDirs().then(res => {
          console.log(res.serialize());
          webix.message("Open Devtools console");
        })
      }
    }, 
    {}
  ]
};

const cleaning = {
  cols:[
    {
      view:"button", value:"Clear all folders and files", width:250,
      click: clearAll
    },
    {
      view:"button", value:"Clear all local file collections", width:250,
      click: clearAllHard
    },
    {}
  ]
};

const restoring = {
  cols:[
    { 
      view:"button", value:"Reload files (current path)", width:250,
      click: reloadFiles
    },
    {
      view:"button", value:"Reload folder tree", width:250,
      click: reloadDirs
    },
    {}
  ]
};

webix.ui({
  rows: [
    filemanager, 
    { view: "toolbar", rows: [
      gets, cleaning, restoring
    ]} 
  ]
});