Song Flux Demo Code

trkstr actions

angular.module('trkstr.player.actions', [
  'songFlux'
]).factory('PlayerActions', function(songFactory){
  function Action(){
    this.module = this.module || 'trkstr';
    this.dispatcher = songFactory.getDispatcher(this.module);
  }

  Action.prototype.dispatch = function(){
    this.dispatcher.dispatch(this);
  };

  function LoadAction(){
    this.purpose = 'Request dispatched stores refresh their in-memory data.';
    Action.call(this);
  }
  LoadAction.prototype = Object.create(Action.prototype);

  function PlayAction(track){
    this.track = track;
    this.purpose = 'Request a track be played.';
    Action.call(this);
  }
  PlayAction.prototype = Object.create(Action.prototype);

  return {
    Load: LoadAction,
    Play: PlayAction
  };
});

trkstr library component snippet

function LibraryController(Library, Actions) {
  this.Library = Library;
  this.Actions = Actions;
}

LibraryController.prototype.play = function(track) {
  return this.Actions.PlayAction(track).dispatch();
};

LibraryController.$inject = ['TrkstrLibrary', 'TrkstrActions'];

trkstr player component

function PlayerController(store) {
  this.store = store;
  this.store.on(this.store.Events.TrackChanged, this.play.bind(this));
  this.play();
}

PlayerController.prototype.play = function() {
  return this.track = this.store.currentTrack;
};

PlayerController.$inject = ['PlayerStore'];

function PlayerDirective() {
  this.controller = PlayerController;
  this.templateUrl = 'player';
  this.replace = false;
  this.restrict = 'E';
  this.controllerAs = 'state';
  this.bindToController = true;
  this.scope = {};
}

PlayerDirective.factory = function() {
  return new PlayerDirective();
};
PlayerDirective.factory.$inject = [];

angular.module('trkstr.player.component', [
  'trkstr.stores.player', 'player.template'
]).directive('player', PlayerDirective);

trkstr player store

PlayerFactory = function(Actions, song) {
  function PlayerStore() {
    global.EventEmitter.call(this);
    this.module = 'trkstr';
    this.dispatcher = song.getDispatcher(this.module);
    this.Events = PlayerStore.Events;

    this.currentTrack = {
      title: "Nothing Playing..."
    };
    this.doPlay = this.dispatcher.register(Actions.PlayAction, this.play.bind(this));
  }
  PlayerStore.prototype = Object.create(EventEmitter.prototype);
  
  PlayerStore.prototype.play = function(playAction) {
    this.currentTrack = playAction.track;
    return this.emit(PlayerStore.Events.TrackChanged);
  };
  
  PlayerStore.Events = {
    TrackChanged: 'TrackChanged'
  };

  return new PlayerStore();
};

PlayerFactory.$inject = [ 'TrkstrActions', 'songFlux' ];
angular.module('trkstr.stores.player', [
  'trkstr.actions', 'songFlux'
]).factory('PlayerStore', PlayerFactory);