Add Folder icons

[Mirza-Glitch]

Can you implement folder icons too ? If yes, then I can help you provide all the necessary folder icons and also contribute in file icons as well.

[sebastianjnuwu]

Você também pode implementar ícones de pasta? Se sim, posso ajudá-lo a fornecer todos os ícones de pasta necessários e também contribuir com ícones de arquivo.

Hello, yes it is possible to use icons in folders but unfortunately I was unable to create a code that works and maintains performance but I intend to add it.

[sebastianjnuwu]

This will be a priority for this plugin, if anyone wants to help implement this, feel free

[Mirza-Glitch]

Nice to hear that it's possible to add icons on folders too.

but unfortunately I was unable to create a code that works

oh, so can you try to add a feature where you can show a sample icon for the folders ? that would be great.

Can you add a list of necessary file icons for this plugin, I'm willing to contribute in the both file and folder icons for now.

[sebastianjnuwu]

Que bom saber que também é possível adicionar ícones em pastas.

mas infelizmente não consegui criar um código que funcionasse

ah, então você pode tentar adicionar um recurso onde possa mostrar um ícone de amostra para as pastas? isso seria bom.

Você pode adicionar uma lista de ícones de arquivos necessários para este plugin. Estou disposto a contribuir com os ícones de arquivos e pastas por enquanto.

I was thinking about that, the plugin is very easy to add icons, you just need to know how to use regex

https://github.com/deadlyjack/Acode/issues/843

[bajrangCoder]

Try to override sortDir() helper function of Acode same as for file icons, I am also going to try

[sebastianjnuwu]

@bajrangCoder Did you manage to make it work? On mine it worked but not the correct way, just in the file browser on the main screen, besides being buggy.

const regex = {
  file: {
    git: /\.gitignore$/i, // file
  },
  dir: {
    git: /\.git$/i, // folder
  }
};

function getType($type, $name) {
  return Object.keys(regex[$type]).find((x) => regex[$type][x].test($name));
};

helpers.sortDir = (list, fileBrowser, mode = 'both') => {
  const dir = [];
  const file = [];
  const sortByName = fileBrowser.sortByName;
  const showHiddenFile = fileBrowser.showHiddenFiles;

  list.forEach((item) => {
    let hidden;

    item.name = item.name || path.basename(item.url || '');
    hidden = item.name[0] === '.';

    if (typeof item.isDirectory !== 'boolean') {
      if (this.isDir(item.type)) item.isDirectory = true;
    }
    if (!item.type) item.type = item.isDirectory ? 'dir': 'file';

    const _type = getType(item.type, item.name);

    if (item.isDirectory) {
      item.icon = `folder_type_${_type}`;
    } else {
      item.icon = `file_type_${_type}`;
    }

    if (!item.url) item.url = item.url || item.uri;
    if ((hidden && showHiddenFile) || !hidden) {

      if (item.isDirectory) {
        dir.push(item);
      } else if (item.isFile) {
        file.push(item);
      }

    }

  });

  if (sortByName) {
    dir.sort(compare);
    file.sort(compare);
  }

  return dir.concat(file);

  function compare(a, b) {
    return a.name.toLowerCase() < b.name.toLowerCase() ? -1: 1;
  }
};

[bajrangCoder]

I haven't tried yet but I will gonna try . I am confident it will work, btw let me try first 😅 then i will share my code here

[sebastianjnuwu]

I haven't tried yet but I will gonna try . I am confident it will work, btw let me try first 😅 then i will share my code here

Did you have any success? "-"

[Tracsa13]

A

[bajrangCoder]

Hmm, I have tried similar to your code and it's working but only for folder(which is not opened) 😞 but it's working in fileBrowser

I thought need to do something else..

[sebastianjnuwu]

Hmm, I have tried similar to your code and it's working but only for folder(which is not opened) 😞 but it's working in fileBrowser

I thought need to do something else..

Mine is the same way, I can't think of a solution, have you tried something else too? I think it's better to wait for a response from @deadlyjack

[bajrangCoder]

I have researched alot there is no way to add , but there is very difficult approach, like from css target the sidebar folder element with is data-name attribute and then modify its .icon.folder class with different for different folder element

[sebastianjnuwu]

I have researched alot there is no way to add , but there is very difficult approach, like from css target the sidebar folder element with is data-name attribute and then modify its .icon.folder class with different for different folder element

I showed you a previous code that worked using setinterval (the only way I could) using pure javascript: https://github.com/deadlyjack/Acode/discussions/779#discussioncomment-7073576

I tried using the dom click event but without success

  async check() {

  const list = document.querySelectorAll(".tile");

  list.forEach((e) => {

   const name = e.getAttribute("data-name");
   const type = e.getAttribute("data-type");

   const _type = Object.keys(regex).find((x) => regex[x].test(name));

   console.log(_type);

   if (type === "dir") (e.querySelector(".icon").classList.add(`.folder_type_${_type}`));

  });

[Mirza-Glitch]

This will be fine ? 🤔

[sebastianjnuwu]

Isso vai ficar bem? 🤔

You are a genius

[Mirza-Glitch]

Isso vai ficar bem? 🤔

You are a genius

Doing this resulted me to another bug in file browser.

I see there is no other competition for us (except "Acode icons" by legend sabbir), so I'll making a pull request lately next week after solving that bug.

I'm actually contributing to this repo, bcoz it is open source. Hence other developers can see our code and create their own plugin.

I have a request too, can you please remove that "buy me a coffee" or "support me" buttons from this plugin description... I know they are pretty useless, but I don't feel contributing to this repo after seeing them ( ignore this if you'd like it to be there 😅 )

[sebastianjnuwu]

Isso vai ficar bem? 🤔

Você é um gênio

Fazer isso resultou em outro bug no navegador de arquivos.

Vejo que não há outra competição para nós (exceto "Ícones Acode" da lenda sabbir), então farei uma solicitação de pull na próxima semana, após resolver esse bug.

Na verdade, estou contribuindo para este repositório, porque é de código aberto. Assim, outros desenvolvedores podem ver nosso código e criar seu próprio plugin.

Eu também tenho um pedido, você pode remover os botões "compre-me um café" ou "apoie-me" da descrição deste plugin ... Eu sei que eles são bastante inúteis, mas não me sinto contribuindo para este repositório depois de vê-los (ignore isso se quiser que ele esteja lá 😅)

Okay :( no one offers me a coffee, thank you for your contribution, until you complete this I won't touch the code, so your pull request won't suffer any more

[sebastianjnuwu]

@Mirza-Glitch Were you able to resolve the bug?

[Mirza-Glitch]

@Mirza-Glitch Were you able to resolve the bug?

Yes i was able to resolve the bug, and the code is fully finished. I'll be making a pull request today, Or maybe I'll do it within few minutes 😉

[Mirza-Glitch]

Added all the necessary folder icons and file icons !!

Little bit of unnecessary explanation here 😁

The Acode material icon plugin code is provided as open-source to help anyone who's looking to create Acode file icons plugin ! 🥳