Why ASS.resize() doesnt work?

[wraith4081]

ASS is exactly the library I want, but it doesn't work even though I call the resize function when the screen size changes or my player is full screen.

ass = new ASS(text, video, {
    container: document.querySelector('.ASS-container'),
    resampling: 'video_height',
});
window.addEventListener('resize', () => {
    /* My own try, but this either doesnt work
    const ASSContainer = document.querySelector('.ASS-container');
    const width = video.offsetWidth + 'px';
    const height = video.offsetHeight + 'px';
    ASSContainer.style.width = width;
    ASSContainer.style.height = height;
    [...ASSContainer.children].forEach(el => {
        el.style.width = width;
        el.style.height = height;
    });
    */
    
    ass.resize();
 });

[wraith4081]

Problem solved with:

fullscreen.addEventListener('click', () => {
  const src = document.querySelector('.subtitleElement.active').getAttribute('src');
  if (src.endsWith('.ass')) {
    fetch(src).then(res => res.text()).then(text => {
      assHardStop()
      ass = new ASS(text, video, {
        container: document.querySelector('.ASS-container'),
        resampling: 'video_height',
      });fullsc
      assHardStop = ass.destroy.bind(ass);
    }).catch(err => {
      console.log(err);
    });
  }

[wraith4081]

Problem solved with:

var assHardStop = () => {};
...
fullscreen.addEventListener('click', () => {
  const src = document.querySelector('.subtitleElement.active').getAttribute('src');
  if (src.endsWith('.ass')) {
    fetch(src).then(res => res.text()).then(text => {
      assHardStop()
      ass = new ASS(text, video, {
        container: document.querySelector('.ASS-container'),
        resampling: 'video_height',
      });
      assHardStop = ass.destroy.bind(ass);
    }).catch(err => {
      console.log(err);
    });
  }

But you must add line when you destroy and recreate the ASS class

assHardStop = ass.destroy.bind(ass);

[weizhenye]

ass.resize() should be called when the container size is changed. You can try it in https://ass.js.org/ and find the source code in https://github.com/weizhenye/ASS/blob/gh-pages/main.js#L75-L86