compile & create new project lightbox

app/coffee/modules/common/lightboxes.coffee

@@ -67,6 +67,9 @@ class LightboxService extends taiga.Service
 
         $el.addClass('close')
 
+        if $el.hasClass("remove-on-close")
+            $el.remove()
+
     closeAll: ->
         docEl = angular.element(document)
         for lightboxEl in docEl.find(".lightbox.open")

app/coffee/modules/projects/lightboxes.coffee

@@ -70,7 +70,7 @@ CreateProject = ($rootscope, $repo, $confirm, $location, $navurls, $rs, $project
             promise = $repo.create("projects", $scope.data)
             promise.then(onSuccessSubmit, onErrorSubmit)
 
-        createProjectCallback = ->
+        openLightbox = ->
             $scope.data = {
                 total_story_points: 100
                 total_milestones: 5
@@ -90,8 +90,6 @@ CreateProject = ($rootscope, $repo, $confirm, $location, $navurls, $rs, $project
             timeout 600, ->
                 $el.find(".progress-bar").addClass('step1')
 
-        projects.emiter.on 'create', createProjectCallback
-
         $el.on "click", ".button-next", (event) ->
             event.preventDefault()
 
@@ -129,9 +127,10 @@ CreateProject = ($rootscope, $repo, $confirm, $location, $navurls, $rs, $project
             lightboxService.close($el)
 
         $scope.$on "$destroy", ->
-            emitter.off(projects.emiter, createProjectCallback)
             $el.off()
 
+        openLightbox()
+
     directive = {
         link: link,
         templateUrl: "project/wizard-create-project.html"

app/modules/navigation-bar/navigation-bar.jade

@@ -29,5 +29,3 @@ nav.navbar
         div.topnav-dropdown-wrapper(ng-show="vm.projects.size", tg-dropdown-project-list)
         //div.topnav-dropdown-wrapper(tg-dropdown-organization-list)
         div.topnav-dropdown-wrapper(tg-dropdown-user)
-
-div.wizard-create-project(tg-lb-create-project)

app/modules/projects/projects.service.coffee

@@ -1,12 +1,11 @@
 class ProjectsService extends taiga.Service
-    @.$inject = ["$q", "$tgResources", "$rootScope", "$projectUrl"]
+    @.$inject = ["$q", "$tgResources", "$rootScope", "$projectUrl", "tgLightboxFactory"]
 
-    constructor: (@q, @rs, @rootScope, @projectUrl) ->
+    constructor: (@q, @rs, @rootScope, @projectUrl, @lightboxFactory) ->
         @.projects = Immutable.Map()
         @.inProgress = false
         @.projectsPromise = null
         @.fetchProjects()
-        @.emiter = new EventEmitter2()
 
     fetchProjects: ->
         if not @.inProgress
@@ -28,7 +27,7 @@ class ProjectsService extends taiga.Service
         return @.projectsPromise
 
     newProject: ->
-        @.emiter.emit("create")
+        @lightboxFactory.create("tg-lb-create-project")
 
     bulkUpdateProjectsOrder: (sortData) ->
         @rs.projects.bulkUpdateOrder(sortData).then =>

app/modules/services/lightbox-factory.service.coffee

@@ -0,0 +1,18 @@
+class LightboxFactory
+    @.$inject = ["$rootScope", "$compile"]
+    constructor: (@rootScope, @compile) ->
+
+    create: (name) ->
+        elm = $("<div>")
+            .attr(name, true)
+            .addClass("wizard-create-project")
+            .addClass("remove-on-close")
+
+        scope = @rootScope.$new()
+        html = @compile(elm)(scope)
+
+        $(document.body).append(html)
+
+        return
+
+angular.module("taigaCommon").service("tgLightboxFactory", LightboxFactory)