Angular JS directive for using Two.js

ngTwo.js

/**
 * Two.js Angular Directive Demo
 * Directive Source
 *
 * TODO:
 *  - make directive minify-safe
 *
 * July 7, 2013
 */

'use strict';

angular.module('twojs-directive', [])
.directive('twojs', function ($window, $parse, $rootScope) {
    //Two.js params used in it's constructor
    var TWO_PARAMS = ['type', 'width', 'height', 'autostart', 'fullscreen'];

    var _params = {};

    //TODO: what is there purpose of putting this here?
    var defaults = {
      type: Two.Types.svg,
      width: 640,
      height: 640,
      autostart: true,
      fullscreen: false
    };


    return {
      restrict: 'E',
      replace: true,
      transclude: true,
      scope: {
        sketch: '@',
        fullscreen: '@',
        autostart: '@',
        type: '@'

      },
      template: '<div class="angular-twojs-sketch"></div>',
      controller: ['$scope', function($scope) {
        //console.log('ctrl scope: ', $scope);

        $scope.doDrawing = function(el) {
          $window.two = new Two(_params).appendTo(el[0]);

          //FIXME: how can i do this without using "extend:
          //FIXME: ghetto 2-way data binding
          _.extend($window.two, {
            appScope: $scope.$parent,
            _window: angular.element($window),
            rootScope: $rootScope
          });
          _.extend($scope.$parent, {twojs: $window.two});
        };

        $scope.loadSketch = function(el) {
          var node = el[0];
          //console.log('scope sketch: ', $scope.sketch);
          var g = document.createElement('script');
          g.src = $scope.sketch;
          g.type = "text/javascript";
          g.async = true;
          node.appendChild(g);
        };

        //FIXME: this is ugly, shouldn't be necessary
        $scope.safeApply = function(fn) {
          var phase = this.$root.$$phase;
          if (phase == '$apply' || phase == '$digest') {
            $scope.$eval(fn);
          } else {
            $scope.$apply(fn);
          }
        };

      }],

      link: function postLink(scope, element, attrs, ctrl) {
        //element.text('this is the twojs directive');
        //console.log('link el: ', element);
        //console.log('attrs: ', attrs);

        //figure out parent container width for "fill"
        if (attrs.width = "fill") {
          attrs.width = angular.element(element).width();
          scope.$parent.containerEle = angular.element(element);
        }

        //give us an object that only has the keys we need for the TWO.js
        _params = _.pick(attrs, TWO_PARAMS);
        _params.fullscreen = $parse(scope.fullscreen)();
        _params.autostart = $parse(scope.autostart)();
        _params.type = Two.Types[scope.type];

        scope.doDrawing(element);
        scope.loadSketch(element);

        //move two.js children to the background
        element.children().css('z-index', -1);

        //drawing loaded
        $rootScope.$emit('Sketch.loaded');

      }
    };
  });