urish / angular-spinner

Angular directive to show an animated spinner (using spin.js)
MIT License
693 stars 146 forks source link

Issue with electron.atom #89

Closed john-yick closed 7 years ago

john-yick commented 8 years ago

Hi All,

First off this is a great module and I have had no issues with using it within a standard web-browser setup. My issue is I am seeing an issue when using it with Electron(http://electron.atom.io/). if I include angular-spinner into my index.html file it causes AngularJs to crash. I think this is because angular-spinner is failing to load spin.js which in turn is causing it to fail loading, any help would be appreciated.

Index.html <script src="bower_components/spin.js/spin.js"></script> <script src="bower_components/angular-spinner/angular-spinner.js"></script>

main.js angular.module('certApp', ['angular.filter', 'angularSpinner', 'ngRoute'])

Chrome error: chromeerror

bachmay commented 8 years ago

Same problem

bachmay commented 8 years ago

@john-yick how did you resolve it?

john-yick commented 8 years ago

@bachmay So in the end we ended up writing our own self contained spinner directive:

<div class="spinDiv " ng-controller="spinController"></div>
<div class="folding-pos">
    <div class="sk-folding-cube">
        <div class="sk-cube1 sk-cube"></div>
        <div class="sk-cube2 sk-cube"></div>
        <div class="sk-cube4 sk-cube"></div>
        <div class="sk-cube3 sk-cube"></div>
    </div>
</div>

This can be inserted into your main.js

    .directive('spin', function () {
      return {
        //restrict: 'E',
        templateUrl: 'templates/spin.html'
      };
    })

Then it can be called as simple as

$rootScope.loading = true;

This way works for us as the main issue is angluar-spinner uses spin.js which is incompatible with Electron.atom

bachmay commented 8 years ago

@john-yick thanks for the prompt reply very appreciated. Cheers for this solution. I will test it!

ghost commented 7 years ago

Hi @john-yick , Thanks for reporting.

I guess this is related to the modules compatibility issues.

We've decided to refactor the whole codebase because of the many requests of webpack and amd compatibility issues, and we're using already webpack in master branch (+TypeScript) The important thing is that we don't have any single breaking changes!

From now on, You don't have to include spin.js, "It's just angular-spinner" :laughing: (Credits to Igor)

You may want to update to our next release in the next days :smiley: