const { fromEvent, tap, map, of } = rxjs

of([1,2,4,5]).pipe(tap(x => console.log('x => ', x))).subscribe()

fromEvent(document.querySelector('#myfiles'), 'change').pipe(tap(ev => {
  ev.preventDefault()
  const load = document.querySelector('.grid-item-1')
  const view = document.createElement('img')

  load.style.display = 'flex'
  load.style.flexWrap = 'wrap'
  load.style.flexGap = '10px'
  load.style.justifyContent = 'center'  

  view.style.width = 'minmax(200px, 300px)'
  view.style.height = 'auto'
  view.style.borderRadius = '10px'
  
  for(file of this.files){
    if(/\.(jp?g|pgn|gif|pdf)$/i.test(file.name)){
      const preview = URL.createObjectURL(file)
      view.setAttribute('src', preview)
      load.append(view)
      preview.onload = view.revokeObjectURL(preview)
    }
  }
}))
.subscribe()