baseGanttChart.js.coffee

class window.BaseGanttChart
  constructor: (elementId) ->
    @elementId = elementId

  createDurations: () ->
    throw new Error "Need to implement this method in child class"

  deleteDurations: () ->
    window.location.hash = '#/confirmDelete'

  render: (data) ->
    throw new Error "Need to implement this method in child class"

  displayError: (message) ->
    $(this.elementId)
      .html("<div class='error-screen'><div class='error-text'>"+
            "Something went wrong: " + message +
            "</div></div>")

  @renderNavigateButtons: () ->
    if($("#projects_chart").length != 0)
      BaseGanttChart.renderExpandButtons()
    if($("#manage_project_chart").length != 0)
      BaseGanttChart.renderBackButton()

  @renderExpandButtons: () ->
    $("#projects_chart .chart-expand-button").remove()
    $("#projects_chart .leftPanel").css("width", "245px")
    $("#projects_chart .row.name").each( (index, value) ->
      #//$(value).css("padding-left", "20px")
      id = $(value).next().attr("id")
      button = $("<a class='chart-expand-button' expand='false'><div class='expand-chart-row'></div></div>")
      $(button).attr("href", "#/projects/" + id)
      $(button).css("position", "relative").css("display", "inline-block")
      $(button).bind('click', BaseGanttChart.bindChartEffect)
      $(value).prepend(button)
    )

  @bindChartEffect: (e) ->
    e.preventDefault()
    toLoad = $(this).attr('href')

    $("#projects_chart").css("margin-left", "-100%")
    setTimeout( () ->
      window.location = toLoad
    , 400 )

    return false

  @renderBackButton: () ->
    $("#manage_project_chart .chart-expand-button").remove()
    $("#manage_project_chart .leftPanel").css("width", "245px")

    button = $("<a class='chart-expand-button' expand='false'><div class='back-chart-row'></div></div>")
    $(button).attr("href", "#/")
    $(button).css("position", "relative").css("display", "inline-block")
    $("#manage_project_chart .row.name.row0").prepend(button)

  @addExpandButtonTimerAfterZoom: () ->
    self = this
    timeoutId = window.setInterval( () ->
      if($(".fn-gantt-loader").length == 0)
        self.renderExpandButtons()
        clearInterval(timeoutId)
    , 50)

  addNewRow: (new_data) ->
    @data.push(new_data)
    this.render(@data)

  addNewBar: (rowIndex, bar_data) ->
    @data[rowIndex].values.push(bar_data)
    console.log(@data)
    this.render(@data)

ganttChartController.js.coffee

@GanttChartIndexCtrl = ['$scope', ($scope) ->
  $('#projects_chart').show()
  $('#manage_project_chart').hide()
  $("#projects_chart").css("margin-left", "30px")

  $scope.projectFormShow = false
  $scope.projectFormStyle = {height: '0px'}

  $scope.toggleForm = () ->
    if $scope.projectFormShow = ! $scope.projectFormShow
      $scope.projectFormStyle = {height: '215px'}
    else
      $scope.projectFormStyle = {height: '0px'}

  if window.projectChart? && window.projectChart.isUpdated()
    window.projectsGanttChart.resolveUpdate(window.projectChart.currentProjectId())
    window.projectChart.updateResolved()
]

@GanttChartConfirmDeleteCtrl = ['$scope', '$location', ($scope, $location) ->
  $scope.return = () ->
    $.fancybox.close()

  $scope.confirm = () ->
    $.ajax({
      headers: {'X-CSRF-Token': $('meta[name="csrf-token"]').attr('content'), 'Content-Type': 'application/x-www-form-urlencoded'},
      type: 'delete',
      url: "/durations/delete_durations",
      dataType: 'json',
      data: {ids: $scope.ids},
      success: (data) ->
        window.projectChart.notifyUpdate()
        window.projectChart.show()
        $scope.return()
      error: () ->
        showAlertPopup("Unable to delete duration. Please try again later.")
        $scope.return()
    })

  if ganttChartPoint.toDelete?
    $scope.ids = [ganttChartPoint.toDelete]
    ganttChartPoint.toDelete = null
    $("#confirm-delete-link").trigger('click')
    $(".delete_box").show()
  else
    $scope.return()
]

@GanttChartCreateDurationCtrl = ['$scope', '$routeParams', '$http', ($scope, $routeParams, $http) ->
  $scope.projectMembers = []
  $scope.userIds = []
  $scope.search = {}

  $http.get("/users/project_members.json").success( (data) ->
    $scope.projectMembers = data
    $("#project-members-link").trigger('click')
  )

  $scope.submit = () ->
    if $scope.userIds?
      ganttChartPoint.userIds = $scope.userIds
      $http.post('/projects/new_duration', ganttChartPoint).success( (data) ->
        window.projectsGanttChart.render(data)
        $.fancybox.close()
      ).error( () ->
        showAlertPopup("Unable to create durations. Please try again later.")
        $.fancybox.close()
      )

  $scope.checkboxHandler = (userId) ->
    $scope.search.full_name = ""
    if _.include($scope.userIds, userId)
      $scope.userIds = _.without($scope.userIds, userId)
    else
      $scope.userIds.push(userId)

  $scope.getDecoration = (userId) ->
    if _.include($scope.userIds, userId)
      return "selected"
]

@GanttChartAddMemberCtrl = ['$scope', '$routeParams', '$http', ($scope, $routeParams, $http) ->
  $scope.projectMembers = []
  $scope.search = {}

  if !(window.projectChart?) || !(window.projectChart.currentMemberIds()?)
    window.history.back()
    return

  $http.get("/users/project_members.json").success( (data) ->
    $("#project-members-link").trigger('click')
    $scope.projectMembers = data.filter (x) -> !(x.id in window.projectChart.currentMemberIds())
  ).error( () ->
    showAlertPopup("Unable to add member. Please try again later.")
  )

  $scope.submit = () ->
    if $scope.userId?
      ganttChartPoint.userId = $scope.userId
      $http.post('/projects/new_member_duration', ganttChartPoint).success( (data) ->
        window.projectChart.notifyUpdate()
        window.projectChart.render(data)
        $.fancybox.close()
      ).error( () ->
        showAlertPopup("Unable to add member. Please try again later.")
      )

  $scope.checkboxHandler = (userId) ->
    $scope.search.full_name = ""
    $scope.userId = userId

  $scope.getDecoration = (userId) ->
    if userId == $scope.userId
      return "selected"
]

@ProjectGanttChartCtrl = ['$scope', '$routeParams', '$location', ($scope, $routeParams, $location) ->
  $('#projects_chart').hide()
  $('#manage_project_chart').show()
  scale = $("#projects_chart")[0].scale

  if !(window.projectChart?)
    window.projectChart = new ProjectGanttChart('#manage_project_chart')
  if $routeParams.projectId != String(window.projectChart.currentProjectId())
    window.projectChart.show($routeParams.projectId, scale)
]

routes.coffee.erb

angular.module('resources-dashboard', [])
       .config(['$routeProvider', ($routeProvider) ->
         $routeProvider.when('/users/:userId', {templateUrl: '<%= asset_path('resources/angularjs/partials/user-detail.haml') %>', controller: ShowUserCtrl})
                       .when('/', { controler: UsersCtrl })
                       .when('/projects/:projectId', {templateUrl: '<%= asset_path('resources/angularjs/partials/project-detail.haml') %>', controller: ShowProjectCtrl})
                       .otherwise({redirectTo: '/'})
       ])

angular.module('projects-manage', [])
  .config(['$routeProvider', ($routeProvider) ->
         $routeProvider.when('/createDuration', {templateUrl: '<%= asset_path('resources/angularjs/partials/gantt-chart-member.haml') %>', controller: GanttChartCreateDurationCtrl})
                       .when('/addMember', {templateUrl: '<%= asset_path('resources/angularjs/partials/gantt-chart-member.haml') %>', controller: GanttChartAddMemberCtrl})
                       .when('/confirmDelete', {templateUrl: '<%= asset_path('resources/angularjs/partials/gantt-chart-confirm-delete.haml') %>', controller: GanttChartConfirmDeleteCtrl})
                       .when('/projects/:projectId', {templateUrl: '<%= asset_path('resources/angularjs/partials/gantt-chart-project.haml') %>', controller: ProjectGanttChartCtrl})
                       .when('/', { templateUrl: '<%= asset_path('resources/angularjs/partials/gantt-chart-project.haml') %>', controller: GanttChartIndexCtrl })
                       .otherwise({redirectTo: '/'})
       ])
  .config(["$httpProvider", (provider) ->
    provider.defaults.headers.common['X-CSRF-Token'] = $('meta[name=csrf-token]').attr('content')
  ])