summaryrefslogtreecommitdiff
path: root/app/assets/javascripts/users/calendar.js.coffee
diff options
context:
space:
mode:
Diffstat (limited to 'app/assets/javascripts/users/calendar.js.coffee')
-rw-r--r--app/assets/javascripts/users/calendar.js.coffee194
1 files changed, 0 insertions, 194 deletions
diff --git a/app/assets/javascripts/users/calendar.js.coffee b/app/assets/javascripts/users/calendar.js.coffee
deleted file mode 100644
index c49ba5186f2..00000000000
--- a/app/assets/javascripts/users/calendar.js.coffee
+++ /dev/null
@@ -1,194 +0,0 @@
-class @Calendar
- constructor: (timestamps, @calendar_activities_path) ->
- @currentSelectedDate = ''
- @daySpace = 1
- @daySize = 15
- @daySizeWithSpace = @daySize + (@daySpace * 2)
- @monthNames = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
- @months = []
-
- # Loop through the timestamps to create a group of objects
- # The group of objects will be grouped based on the day of the week they are
- @timestampsTmp = []
- i = 0
- group = 0
- _.each timestamps, (count, date) =>
- newDate = new Date parseInt(date) * 1000
- day = newDate.getDay()
-
- # Create a new group array if this is the first day of the week
- # or if is first object
- if (day is 0 and i isnt 0) or i is 0
- @timestampsTmp.push []
- group++
-
- innerArray = @timestampsTmp[group-1]
-
- # Push to the inner array the values that will be used to render map
- innerArray.push
- count: count
- date: newDate
- day: day
-
- i++
-
- # Init color functions
- @colorKey = @initColorKey()
- @color = @initColor()
-
- # Init the svg element
- @renderSvg(group)
- @renderDays()
- @renderMonths()
- @renderDayTitles()
- @renderKey()
-
- @initTooltips()
-
- renderSvg: (group) ->
- @svg = d3.select '.js-contrib-calendar'
- .append 'svg'
- .attr 'width', (group + 1) * @daySizeWithSpace
- .attr 'height', 167
- .attr 'class', 'contrib-calendar'
-
- renderDays: ->
- @svg.selectAll 'g'
- .data @timestampsTmp
- .enter()
- .append 'g'
- .attr 'transform', (group, i) =>
- _.each group, (stamp, a) =>
- if a is 0 and stamp.day is 0
- month = stamp.date.getMonth()
- x = (@daySizeWithSpace * i + 1) + @daySizeWithSpace
- lastMonth = _.last(@months)
- if lastMonth?
- lastMonthX = lastMonth.x
-
- if !lastMonth?
- @months.push
- month: month
- x: x
- else if month isnt lastMonth.month and x - @daySizeWithSpace isnt lastMonthX
- @months.push
- month: month
- x: x
-
- "translate(#{(@daySizeWithSpace * i + 1) + @daySizeWithSpace}, 18)"
- .selectAll 'rect'
- .data (stamp) ->
- stamp
- .enter()
- .append 'rect'
- .attr 'x', '0'
- .attr 'y', (stamp, i) =>
- (@daySizeWithSpace * stamp.day)
- .attr 'width', @daySize
- .attr 'height', @daySize
- .attr 'title', (stamp) =>
- date = new Date(stamp.date)
- contribText = 'No contributions'
-
- if stamp.count > 0
- contribText = "#{stamp.count} contribution#{if stamp.count > 1 then 's' else ''}"
-
- dateText = dateFormat(date, 'mmm d, yyyy')
-
- "#{contribText}<br />#{gl.utils.getDayName(date)} #{dateText}"
- .attr 'class', 'user-contrib-cell js-tooltip'
- .attr 'fill', (stamp) =>
- if stamp.count isnt 0
- @color(Math.min(stamp.count, 40))
- else
- '#ededed'
- .attr 'data-container', 'body'
- .on 'click', @clickDay
-
- renderDayTitles: ->
- days = [{
- text: 'M'
- y: 29 + (@daySizeWithSpace * 1)
- }, {
- text: 'W'
- y: 29 + (@daySizeWithSpace * 3)
- }, {
- text: 'F'
- y: 29 + (@daySizeWithSpace * 5)
- }]
- @svg.append 'g'
- .selectAll 'text'
- .data days
- .enter()
- .append 'text'
- .attr 'text-anchor', 'middle'
- .attr 'x', 8
- .attr 'y', (day) ->
- day.y
- .text (day) ->
- day.text
- .attr 'class', 'user-contrib-text'
-
- renderMonths: ->
- @svg.append 'g'
- .selectAll 'text'
- .data @months
- .enter()
- .append 'text'
- .attr 'x', (date) ->
- date.x
- .attr 'y', 10
- .attr 'class', 'user-contrib-text'
- .text (date) =>
- @monthNames[date.month]
-
- renderKey: ->
- keyColors = ['#ededed', @colorKey(0), @colorKey(1), @colorKey(2), @colorKey(3)]
- @svg.append 'g'
- .attr 'transform', "translate(18, #{@daySizeWithSpace * 8 + 16})"
- .selectAll 'rect'
- .data keyColors
- .enter()
- .append 'rect'
- .attr 'width', @daySize
- .attr 'height', @daySize
- .attr 'x', (color, i) =>
- @daySizeWithSpace * i
- .attr 'y', 0
- .attr 'fill', (color) ->
- color
-
- initColor: ->
- colorRange = ['#ededed', @colorKey(0), @colorKey(1), @colorKey(2), @colorKey(3)]
- d3.scale
- .threshold()
- .domain([0, 10, 20, 30])
- .range(colorRange)
-
- initColorKey: ->
- d3.scale
- .linear()
- .range(['#acd5f2', '#254e77'])
- .domain([0, 3])
-
- clickDay: (stamp) =>
- if @currentSelectedDate isnt stamp.date
- @currentSelectedDate = stamp.date
- formatted_date = @currentSelectedDate.getFullYear() + "-" + (@currentSelectedDate.getMonth()+1) + "-" + @currentSelectedDate.getDate()
-
- $.ajax
- url: @calendar_activities_path
- data:
- date: formatted_date
- cache: false
- dataType: 'html'
- beforeSend: ->
- $('.user-calendar-activities').html '<div class="text-center"><i class="fa fa-spinner fa-spin user-calendar-activities-loading"></i></div>'
- success: (data) ->
- $('.user-calendar-activities').html data
- else
- $('.user-calendar-activities').html ''
-
- initTooltips: ->
- $('.js-contrib-calendar .js-tooltip').tooltip
- html: true