How to properly stop running the generated script from Angular2 typescript app


(Turnauer) #1

Hi there,

I know it’s not an Angular 2 forum… but maybe I hope some of you know how to help…

Firstly I’ve just discovered Hype and I found it really interesting to generate great animated stuffs and put them on angular2 web app page.

For inserting and starting all the generated files from Hype into Angular2 page I found a solution wrapping the external javascript into a component (app-script) and it works great !

<div id="text_hype_container"
     style="position:absolute; z-index: -100; overflow:hidden; align-self: flex-end;">
  <app-script src="assets/anims/text/text_hype_generated_script.js?53383" type="text/javascript"></app-script>
</div>

But once I navigate to another page that not contains the animated div with script tag…
the console shows me a lot of errors :

22:19:51.864 HYPE-584.thin.min.js:81 APPLY ERR e=0.6107371138385763 : TypeError: Cannot read property ‘id’ of null
22:19:51.869 HYPE-584.thin.min.js:81 APPLY ERR b=14 : TypeError: Cannot read property ‘id’ of null
22:19:51.875 HYPE-584.thin.min.js:81 APPLY ERR a=14 : TypeError: Cannot read property ‘id’ of null
22:19:51.913 HYPE-584.thin.min.js:81 APPLY ERR b=-881.4032677412033 : TypeError: Cannot read property ‘id’ of null
22:19:51.917 HYPE-584.thin.min.js:81 APPLY ERR a=-1 : TypeError: Cannot read property ‘id’ of null
22:19:51.923 HYPE-584.thin.min.js:81 APPLY ERR a=124 : TypeError: Cannot read property ‘id’ of null
22:19:51.929 HYPE-584.thin.min.js:81 APPLY ERR b=-505.9065148099314 : TypeError: Cannot read property ‘id’ of null
22:19:51.934 HYPE-584.thin.min.js:81 APPLY ERR bH=50.23935874363014 : TypeError: Cannot read property ‘id’ of null
22:19:51.939 HYPE-584.thin.min.js:81 APPLY ERR e=1 : TypeError: Cannot read property ‘id’ of null
22:19:51.945 HYPE-584.thin.min.js:81 APPLY ERR f=218.29951886571783 : TypeError: Cannot read property ‘id’ of null
22:19:51.949 HYPE-584.thin.min.js:81 APPLY ERR B=rgba(0,170,228,0.518957916503337) : TypeError: Cannot read property ‘id’ of null
22:19:51.955 HYPE-584.thin.min.js:81 APPLY ERR C=rgba(0,170,228,0.518957916503337) : TypeError: Cannot read property ‘id’ of null
22:19:51.961 HYPE-584.thin.min.js:81 APPLY ERR D=rgba(0,170,228,0.518957916503337) : TypeError: Cannot read property ‘id’ of null
22:19:51.966 HYPE-584.thin.min.js:81 APPLY ERR A=rgba(0,170,228,0.518957916503337) : TypeError: Cannot read property ‘id’ of null
22:19:51.972 HYPE-584.thin.min.js:81 APPLY ERR N=0 : TypeError: Cannot read property ‘id’ of null
22:19:51.977 HYPE-584.thin.min.js:81 APPLY ERR P=0 : TypeError: Cannot read property ‘id’ of null
22:19:51.981 HYPE-584.thin.min.js:81 APPLY ERR M=0 : TypeError: Cannot read property ‘id’ of null
22:19:51.987 HYPE-584.thin.min.js:81 APPLY ERR e=1 : TypeError: Cannot read property ‘id’ of null

It seems that the script is searching for an a.id that is obviously null…

From now and from the HYPE-584.thin.min.js generated by Hype
the only solution I found to kill the process is to throw a runtime error… ugly I know but it works…

  function W(a) {
    for (var b = arguments, c = 1; c < b[M]; c += 2) {
      var d = b[c], e = b[c + 1];
      if ('undefined' != typeof e) try {
        var f = Uc[d];
        f != j && (Q[L[a.id]][d] = e, f(a, e))
      } catch (h) {
        we(he + d + de + e + $b + h)
        **throw new Error(9999, "Exit Script");**
      }
    }
  }

Do you know another way to properly remove or stop the background script for a missing id ?

Thanks for help.
Lo.


(Turnauer) #2

No one ?


(Jonathan Deutsch) #3

I don’t have specific experience, but yes I’d guess that there’s going to be problems if the DOM for the Hype animation has gone away and the script is still running. There’s no API or method to kill the script currently (but this is a good feature request). My recommendation would be to run the animation in an iframe if that’s possible.