Add better class names to modals to allow for better customized css targeting

This commit is contained in:
2018-12-06 09:45:05 -05:00
parent 1ee8ab64a0
commit 9881c5d7d4
9 changed files with 24 additions and 94 deletions
@@ -1,81 +0,0 @@
import ModalBase from 'ember-cli-dunlop/mixins/modal-base'
import Ember from 'ember'
{set} = Ember
relative_matcher = /(start of|end of) (day|week|month)/
export default ModalBase.extend
scope_key: Ember.computed.alias 'modal_options.scope_key'
content: Ember.computed.alias 'modal_options.content'
error: ''
new_filter_name_blank: Ember.computed 'new_filter_name', ->
return true unless name = @get('new_filter_name')
return true unless typeof name is 'string'
return true if name.match /^\s*$/
false
willOpenModal: ->
now = moment()
if now.day() is 1
@set 'cannot_create_filter_message', t('user_filters.cannot_create_on_monday')
else if now.format('D') is '1'
@set 'cannot_create_filter_message', t('user_filters.cannot_create_on_first_day_of_month')
user_filters: Ember.computed 'scope_key', ->
return Ember.A() unless scope_key = @get('scope_key')
@store.peekAll('dunlop/user-filter').filterBy('scope_key', scope_key).sortBy('name')
actions:
apply_filter: (user_filter) ->
return @set('error', 'no content given') unless content = @get('content')
return @set('error', 'content has no filters object to manipulate') unless typeof content.filters is 'object'
Object.keys(content.filters).forEach (key) -> delete content.filters[key]
for key, value of user_filter.get('filters')
if typeof value is 'string' && match = value.match relative_matcher
boundary_function = if match[1] is 'end of' then 'endOf' else 'startOf'
period_name = switch match[2]
when 'week' then 'isoWeek'
else match[2]
filter_value = moment()[boundary_function](period_name)
else
filter_value = switch value
when 'today'
boundary_function = if key.match(/_lt/) then 'endOf' else 'startOf'
moment()[boundary_function]('day')
else value
set content.filters, key, filter_value
content.reload() if typeof content.reload is 'function'
@set 'globals.flash_message', "Filter #{user_filter.get('name')}"
@send 'close'
create_new_filter: ->
return @set('error', 'no content given') unless content = @get('content')
return @set('error', 'content has no filters object to manipulate') unless typeof content.filters is 'object'
return @set('error', 'Current given content filters do not respond to toProperties method') unless typeof content.filters.toProperties is 'function'
filters = content.filters.toProperties()
today_date_string = moment().format('YYYY-MM-DD')
start_of_week_string = moment().startOf('isoWeek').format('YYYY-MM-DD')
end_of_week_string = moment().endOf('isoWeek').format('YYYY-MM-DD')
start_of_month_string = moment().startOf('month').format('YYYY-MM-DD')
end_of_month_string = moment().endOf('month').format('YYYY-MM-DD')
filter_storage = {}
for key, value of content.filters.toProperties()
if typeof value is 'string' && match = value.match(/^(\d\d\d\d-\d\d-\d\d)/)
date_value = switch match[1]
when today_date_string then 'today'
when start_of_week_string then 'start of week'
when end_of_week_string then 'end of week'
when start_of_month_string then 'start of month'
when end_of_month_string then 'end of month'
else value
filter_storage[key] = date_value
# use relative notation if can be inferred
else
# literal copy
filter_storage[key] = value
new_filter = @store.createRecord 'dunlop/user-filter',
name: @get('new_filter_name')
scope_key: @get('scope_key')
filters: filter_storage
new_filter.save().then =>
@store.query('dunlop/user-filter', q: {scope_key_eq: @get('scope_key')})
@get('content').reload()
@send 'close'
@@ -1,3 +1,2 @@
button.ui.icon.button class=class click='open_modal'
i.filter.icon
i.filter.icon
= yield
@@ -3,14 +3,7 @@ if error
.ui.negative.message= error
.ui.middle.aligned.divided.list
each user_filters as |user_filter|
li.item
.right.floated.content
button.ui.tiny.secondary.button{action 'apply_filter' user_filter}= t 'general.apply'
.content
if user_filter.is_default
.header= user_filter.name
else
= user_filter.name
user-filters-manager/filter-row apply_filter=(action 'apply_filter') user_filter=user_filter
.ui.horizontal.divider= t 'user_filters.create_new_filter_title'
if cannot_create_filter_message
.ui.visible.warning.message= cannot_create_filter_message
@@ -18,4 +11,6 @@ else
.ui.action.input
= input value=new_filter_name
button.ui.primary.button disabled=new_filter_name_blank click='create_new_filter'
span= t 'user_filter.create_new_filter_button'
span= t 'user_filters.create_new_filter_button'
.modal-actions.sticky
button.ui.button.modal-save.right{action 'close'}= t 'general.close'
+1 -1
View File
@@ -1,5 +1,5 @@
.overlay{action "closeOnOverlay"}
.modal{action "modalClick" bubbles=false preventDefault=false}
.modal class=component_name_based_class click='"modalClick" bubbles=false preventDefault=false'
.modal-header
h3.flush--top= title
.ui.divider