diff --git a/addon/components/modal-dialog.js b/addon/components/modal-dialog.js index 053e76b3..126982b1 100644 --- a/addon/components/modal-dialog.js +++ b/addon/components/modal-dialog.js @@ -1,5 +1,6 @@ import Ember from 'ember'; import template from '../templates/components/modal-dialog'; +var dasherize = Ember.String.dasherize; var computed = Ember.computed; var computedJoin = function(prop) { @@ -23,6 +24,13 @@ export default Ember.Component.extend({ concatenatedProperties: ['containerClassNames', 'overlayClassNames'], + alignmentClass: computed('alignment', function(){ + var alignment = this.get('alignment'); + if (alignment) { + return `ember-modal-dialog-${dasherize(alignment)}`; + } + }), + destinationElementId: null, // injected alignmentTarget: null, // view instance, passed in alignment: 'center', // passed in diff --git a/addon/templates/components/modal-dialog.hbs b/addon/templates/components/modal-dialog.hbs index 452e603b..deb88ef9 100644 --- a/addon/templates/components/modal-dialog.hbs +++ b/addon/templates/components/modal-dialog.hbs @@ -2,7 +2,7 @@ {{#if hasOverlay}}
{{/if}} - {{#ember-modal-dialog-positioned-container classNameBindings="containerClassNamesString container-class" + {{#ember-modal-dialog-positioned-container classNameBindings="containerClassNamesString alignmentClass container-class" alignment=alignment alignmentTarget=alignmentTarget}} {{yield}} diff --git a/tests/acceptance/modal-dialogs-test.js b/tests/acceptance/modal-dialogs-test.js index 650cc49a..a5a43c8a 100644 --- a/tests/acceptance/modal-dialogs-test.js +++ b/tests/acceptance/modal-dialogs-test.js @@ -116,7 +116,10 @@ test('opening and closing modals', function(assert) { openSelector: '#example-alignment-target-selector button', dialogText: 'Alignment Target - Selector', closeSelector: dialogCloseButton, - hasOverlay: false + hasOverlay: false, + whileOpen: function(){ + assert.ok(Ember.$(`${modalRootElementSelector} ${dialogSelector}`).hasClass('ember-modal-dialog-right'), 'has alignment class name'); + } }); assert.dialogOpensAndCloses({