The File System Access API

Using Javascript from SpiderBasic
Andy
Posts: 46
Joined: Sat Feb 15, 2020 5:19 pm
Location: Larnaca, Cyprus
Contact:

The File System Access API

Post by Andy »

Can anyone point me in the right direction? I tried a couple of things but it wont work.

Code: Select all

Procedure ButtonHandler()
  gid = GadgetID(0)
    
  !let directory
  !document.getElementById(v_gid.gadget.id).addEventListener('click', async () => {
  !  try {
  !      directory = await window.showDirectoryPicker({
  !          startIn: 'desktop'
  !      })

  !      for await (const entry of directory.values()) {
  !          let newEl = document.createElement('div')
  !          newEl.innerHTML = `<strong>${entry.name}</strong> - ${entry.kind}`
  !          document.getElementById('folder-info').append(newEl);
  !      }
  !  } catch(e) {
  !      console.log(e)
  !  }
  ! })
  
EndProcedure


If OpenWindow(0, 0, 0, 300, 440, "Test", #PB_Window_ScreenCentered)
  ButtonGadget(0, 10, 10, 280, 30, "Open Directory Picker")
EndIf

BindGadgetEvent(0, @ButtonHandler())
https://web.dev/file-system-access/
https://fjolt.com/article/javascript-ne ... system-api

Regards
User avatar
Peter
Posts: 1086
Joined: Mon Feb 24, 2014 10:17 pm
Location: 127.0.0.1:9080
Contact:

Re: The File System Access API

Post by Peter »

There are some issues in your code:

* The element "folder-info" does not exist in the DOM
* You bind the click event of the button twice.

I have changed this a little bit. I think it is self-explanatory. If not, please feel free to ask.

Code: Select all

Enumeration
  #Window
  #ButtonGadget
  #ListViewGadget
EndEnumeration
   
Procedure ButtonHandler()
  
  Protected ItemText.s
 
  ! (async() => {
  
  !   try {
  
  !     directory = await window.showDirectoryPicker({ startIn: 'desktop' })
  
        ClearGadgetItems(#ListViewGadget)
  
  !     for await (const entry of directory.values()) {
  !       v_itemtext = entry.name " - " + entry.kind;
          AddGadgetItem(#ListViewGadget, -1, ItemText)
  !     }
          
  !   } catch(e) {
  !     console.log(e)
  !   }
  
  ! })();
  
EndProcedure

If OpenWindow(#Window, 0, 0, 300, 440, "Test", #PB_Window_ScreenCentered)
  ButtonGadget(#ButtonGadget, 10, 10, 280, 30, "Open Directory Picker")
  ListViewGadget(#ListViewGadget, 10, 50, 280, 300)
EndIf

BindGadgetEvent(#ButtonGadget, @ButtonHandler())
Post Reply