-
Notifications
You must be signed in to change notification settings - Fork 39
Open
Labels
Description
desired - but not possible due to switch value/selector bug described below.
bindings: {
'model.mediaStatus': {
type: 'switch',
cases: {
'uploading': '.progress',
'processing': '.progress',
'encoding': '.progress',
'failed': '.failed',
/*jshint -W044*/ //ignore warning: Bad or unnecessary escaping.
'not\ sent': '.actions',
/*jshint +W044*/
'finished': '.actions'
}
}
}
jade:
.progress
.progress-bar.progress-bar-striped.active(role='progressbar', aria-valuenow='100', aria-valuemin='100', aria-valuemax='100', style='width: 100%')
span(data-hook='mediaStatus')
^when the value of model.mediaStatus
is uploading
, processing
or encoding
, i want to show the progress bar, and similarly with the .actions
DIV.
however changes to model.mediaStatus
will not keep .progress
visible. thus you cannot use the same selector for multiple values.
i had to create three separate progress DIVs classed .uploading
, .processing
and .encoding
to get this switch binding to work as expected.
compromise - to make the switch-binding work:
bindings: {
'model.mediaStatus': {
type: 'switch',
cases: {
'uploading': '.uploading',
'processing': '.processing',
'encoding': '.encoding',
'failed': '.failed',
/*jshint -W044*/ //ignore warning: Bad or unnecessary escaping.
'not\ sent': '.actions',
/*jshint +W044*/
'finished': '.actions'
}
}
}
jade:
.progress.uploading
.progress-bar.progress-bar-success.progress-bar-striped.active(role='progressbar', aria-valuenow='100', aria-valuemin='100', aria-valuemax='100')
span uploading
.progress.processing
.progress-bar.progress-bar-striped.active(role='progressbar', aria-valuenow='100', aria-valuemin='100', aria-valuemax='100')
span processing
.progress.encoding
.progress-bar.progress-bar-warning.progress-bar-striped.active(role='progressbar', aria-valuenow='100', aria-valuemin='100', aria-valuemax='100')
span encoding
i would have rather had one .progress
element and [also] bound the value of model.mediaStatus
to a child SPAN element. however i was forced to create three separate progress bars w/o the value-binding.