Replaced active with is-active class.

This commit is contained in:
Martin Edenhofer 2015-10-20 13:55:23 +02:00
parent f585031717
commit ce6f868ba5
3 changed files with 22 additions and 22 deletions

View file

@ -212,15 +212,15 @@ class Download extends App.Controller
active = false active = false
@el.find('.js-dataDownloadBackendSelector').each( (index, element) -> @el.find('.js-dataDownloadBackendSelector').each( (index, element) ->
if $(element).parent().hasClass('active') if $(element).parent().hasClass('is-active')
active = true active = true
) )
if !active if !active
@el.find('.js-dataDownloadBackendSelector').first().parent().addClass('active') @el.find('.js-dataDownloadBackendSelector').first().parent().addClass('is-active')
# rerender view after backend is selected # rerender view after backend is selected
@el.find('.js-dataDownloadBackendSelector').each( (index, element) => @el.find('.js-dataDownloadBackendSelector').each( (index, element) =>
if $(element).parent().hasClass('active') if $(element).parent().hasClass('is-active')
@profileSelectedId = $(element).data('profile-id') @profileSelectedId = $(element).data('profile-id')
@backendSelected = $(element).data('backend') @backendSelected = $(element).data('backend')
) )
@ -230,8 +230,8 @@ class Download extends App.Controller
tableUpdate: (e) => tableUpdate: (e) =>
if e if e
e.preventDefault() e.preventDefault()
@el.find('.js-dataDownloadBackendSelector').parent().removeClass('active') @el.find('.js-dataDownloadBackendSelector').parent().removeClass('is-active')
$(e.target).parent().addClass('active') $(e.target).parent().addClass('is-active')
@profileSelectedId = $(e.target).data('profile-id') @profileSelectedId = $(e.target).data('profile-id')
@backendSelected = $(e.target).data('backend') @backendSelected = $(e.target).data('backend')
@ -297,8 +297,8 @@ class TimeRangePicker extends App.Controller
@html App.view('report/time_range_picker')() @html App.view('report/time_range_picker')()
# select time slot # select time slot
@el.find('.js-timeRange').removeClass('active') @el.find('.js-timeRange').removeClass('is-active')
@el.find('.js-timeRange[data-type="' + @ui.params.timeRange + '"]').addClass('active') @el.find('.js-timeRange[data-type="' + @ui.params.timeRange + '"]').addClass('is-active')
select: (e) => select: (e) =>
console.log('TS click') console.log('TS click')
@ -336,35 +336,35 @@ class TimePicker extends App.Controller
) )
# select time slot # select time slot
@el.find('.time-slot').removeClass('active') @el.find('.time-slot').removeClass('is-active')
@el.find('.time-slot[data-type="' + @ui.params.timeRange + '"]').addClass('active') @el.find('.time-slot[data-type="' + @ui.params.timeRange + '"]').addClass('is-active')
selectTimeDay: (e) => selectTimeDay: (e) =>
e.preventDefault() e.preventDefault()
@ui.params.day = $(e.target).data('type') @ui.params.day = $(e.target).data('type')
$(e.target).parent().parent().find('li').removeClass('active') $(e.target).parent().parent().find('li').removeClass('is-active')
$(e.target).parent().addClass('active') $(e.target).parent().addClass('is-active')
App.Event.trigger( 'ui:report:rerender' ) App.Event.trigger( 'ui:report:rerender' )
selectTimeMonth: (e) => selectTimeMonth: (e) =>
e.preventDefault() e.preventDefault()
@ui.params.month = $(e.target).data('type') @ui.params.month = $(e.target).data('type')
$(e.target).parent().parent().find('li').removeClass('active') $(e.target).parent().parent().find('li').removeClass('is-active')
$(e.target).parent().addClass('active') $(e.target).parent().addClass('is-active')
App.Event.trigger( 'ui:report:rerender' ) App.Event.trigger( 'ui:report:rerender' )
selectTimeWeek: (e) => selectTimeWeek: (e) =>
e.preventDefault() e.preventDefault()
@ui.params.week = $(e.target).data('type') @ui.params.week = $(e.target).data('type')
$(e.target).parent().parent().find('li').removeClass('active') $(e.target).parent().parent().find('li').removeClass('is-active')
$(e.target).parent().addClass('active') $(e.target).parent().addClass('is-active')
App.Event.trigger( 'ui:report:rerender' ) App.Event.trigger( 'ui:report:rerender' )
selectTimeYear: (e) => selectTimeYear: (e) =>
e.preventDefault() e.preventDefault()
@ui.params.year = $(e.target).data('type') @ui.params.year = $(e.target).data('type')
$(e.target).parent().parent().find('li').removeClass('active') $(e.target).parent().parent().find('li').removeClass('is-active')
$(e.target).parent().addClass('active') $(e.target).parent().addClass('is-active')
App.Event.trigger( 'ui:report:rerender' ) App.Event.trigger( 'ui:report:rerender' )
_timeSlotPicker: -> _timeSlotPicker: ->

View file

@ -4,7 +4,7 @@
<% for profile in @profiles: %> <% for profile in @profiles: %>
<% for backend in @metric.backend: %> <% for backend in @metric.backend: %>
<% if backend.dataDownload: %> <% if backend.dataDownload: %>
<li><a href="#" class="js-dataDownloadBackendSelector" data-toggle="tab" data-profile="<%= profile.id %>" data-backend="<%= backend.name %>"><%= @T(backend.display) %></a></li> <li><a href="#" class="js-dataDownloadBackendSelector" data-toggle="tab" data-profile-id="<%= profile.id %>" data-backend="<%= backend.name %>"><%= @T(backend.display) %></a></li>
<% end %> <% end %>
<% end %> <% end %>
<% end %> <% end %>

View file

@ -2,7 +2,7 @@
<% if @params.timeRange is 'day': %> <% if @params.timeRange is 'day': %>
<div class="btn-group" role="group" aria-label=""> <div class="btn-group" role="group" aria-label="">
<% for item in @timeRangeDay: %> <% for item in @timeRangeDay: %>
<button type="button" class="btn btn-default js-timePickerDay <% if @params.day is item.value: %>active<% end %>" data-id="<%= @params.timeRange %>" data-type="<%= item.value %>"><%= item.display %></button> <button type="button" class="btn btn-default js-timePickerDay <% if @params.day is item.value: %>is-active<% end %>" data-id="<%= @params.timeRange %>" data-type="<%= item.value %>"><%= item.display %></button>
<% end %> <% end %>
</div> </div>
<br> <br>
@ -11,7 +11,7 @@
<% if @params.timeRange is 'day' || @params.timeRange is 'month': %> <% if @params.timeRange is 'day' || @params.timeRange is 'month': %>
<div class="btn-group" role="group" aria-label=""> <div class="btn-group" role="group" aria-label="">
<% for item in @timeRangeMonth: %> <% for item in @timeRangeMonth: %>
<button type="button" class="btn btn-default js-timePickerMonth <% if @params.month is item.value: %>active<% end %>" data-id="<%= @params.timeRange %>" data-type="<%= item.value %>"><%= item.display %></button> <button type="button" class="btn btn-default js-timePickerMonth <% if @params.month is item.value: %>is-active<% end %>" data-id="<%= @params.timeRange %>" data-type="<%= item.value %>"><%= item.display %></button>
<% end %> <% end %>
</div> </div>
<br> <br>
@ -20,7 +20,7 @@
<% if @params.timeRange is 'week': %> <% if @params.timeRange is 'week': %>
<div class="btn-group" role="group" aria-label=""> <div class="btn-group" role="group" aria-label="">
<% for item in @timeRangeWeek: %> <% for item in @timeRangeWeek: %>
<button type="button" class="btn btn-default js-timePickerWeek <% if @params.week is item.value: %>active<% end %>" data-id="<%= @params.timeRange %>" data-type="<%= item.value %>"><%= item.display %></button> <button type="button" class="btn btn-default js-timePickerWeek <% if @params.week is item.value: %>is-active<% end %>" data-id="<%= @params.timeRange %>" data-type="<%= item.value %>"><%= item.display %></button>
<% end %> <% end %>
</div> </div>
<br> <br>
@ -29,7 +29,7 @@
<% if @params.timeRange isnt 'realtime': %> <% if @params.timeRange isnt 'realtime': %>
<div class="btn-group" role="group" aria-label=""> <div class="btn-group" role="group" aria-label="">
<% for item in @timeRangeYear: %> <% for item in @timeRangeYear: %>
<button type="button" class="btn btn-default js-timePickerYear <% if @params.year is item.value: %>active<% end %>" data-id="<%= @params.timeRange %>" data-type="<%= item.value %>"><%= item.display %></button> <button type="button" class="btn btn-default js-timePickerYear <% if @params.year is item.value: %>is-active<% end %>" data-id="<%= @params.timeRange %>" data-type="<%= item.value %>"><%= item.display %></button>
<% end %> <% end %>
</div> </div>
<% end %> <% end %>