examples/HTML StarterKit/lib/durandal/js/plugins/dialog.js
function (child, parent, context) {
            var theDialog = dialog.getDialog(context.model);
            var $child = $(child);
            var loadables = $child.find("img").filter(function () {
                //Remove images with known width and height
                var $this = $(this);
                return !(this.style.width && this.style.height) && !($this.attr("width") && $this.attr("height"));
            });

            $child.data("predefinedWidth", $child.get(0).style.width);

            var setDialogPosition = function () {
                //Setting a short timeout is need in IE8, otherwise we could do this straight away
                setTimeout(function () {
                    //We will clear and then set width for dialogs without width set 
                    if (!$child.data("predefinedWidth")) {
                        $child.css({ width: '' }); //Reset width
                    }
                    var width = $child.outerWidth(false);
                    var height = $child.outerHeight(false);
                    var windowHeight = $(window).height();
                    var constrainedHeight = Math.min(height, windowHeight);

                    $child.css({
                        'margin-top': (-constrainedHeight / 2).toString() + 'px',
                        'margin-left': (-width / 2).toString() + 'px'
                    });

                    if (!$child.data("predefinedWidth")) {
                        //Ensure the correct width after margin-left has been set
                        $child.outerWidth(width);
                    }

                    if (height > windowHeight) {
                        $child.css("overflow-y", "auto");
                    } else {
                        $child.css("overflow-y", "");
                    }

                    $(theDialog.host).css('opacity', 1);
                    $child.css("visibility", "visible");

                    $child.find('.autofocus').first().focus();
                }, 1);
            };

            setDialogPosition();
            loadables.load(setDialogPosition);

            if ($child.hasClass('autoclose')) {
                $(theDialog.blockout).click(function () {
                    theDialog.close();
                });
            }
        }
function (child, parent, context) {
            var theDialog = dialog.getDialog(context.model);
            var $child = $(child);
            var loadables = $child.find("img").filter(function () {
                //Remove images with known width and height
                var $this = $(this);
                return !(this.style.width && this.style.height) && !($this.attr("width") && $this.attr("height"));
            });

            $child.data("predefinedWidth", $child.get(0).style.width);

            var setDialogPosition = function () {
                //Setting a short timeout is need in IE8, otherwise we could do this straight away
                setTimeout(function () {
                    //We will clear and then set width for dialogs without width set 
                    if (!$child.data("predefinedWidth")) {
                        $child.css({ width: '' }); //Reset width
                    }
                    var width = $child.outerWidth(false);
                    var height = $child.outerHeight(false);
                    var windowHeight = $(window).height();
                    var constrainedHeight = Math.min(height, windowHeight);

                    $child.css({
                        'margin-top': (-constrainedHeight / 2).toString() + 'px',
                        'margin-left': (-width / 2).toString() + 'px'
                    });

                    if (!$child.data("predefinedWidth")) {
                        //Ensure the correct width after margin-left has been set
                        $child.outerWidth(width);
                    }

                    if (height > windowHeight) {
                        $child.css("overflow-y", "auto");
                    } else {
                        $child.css("overflow-y", "");
                    }

                    $(theDialog.host).css('opacity', 1);
                    $child.css("visibility", "visible");

                    $child.find('.autofocus').first().focus();
                }, 1);
            };

            setDialogPosition();
            loadables.load(setDialogPosition);

            if ($child.hasClass('autoclose')) {
                $(theDialog.blockout).click(function () {
                    theDialog.close();
                });
            }
        }
function ( child , parent , context ) { var theDialog = dialog . getDialog ( context . model ) ; var $child = $ ( child ) ; var loadables = $child . find ( "img" ) . filter ( function ( ) { //Remove images with known width and height var $this = $ ( this ) ; return ! ( this . style . width && this . style . height ) && ! ( $this . attr ( "width" ) && $this . attr ( "height" ) ) ; } ) ; $child . data ( "predefinedWidth" , $child . get ( 0 ) . style . width ) ; var setDialogPosition = function ( ) { //Setting a short timeout is need in IE8, otherwise we could do this straight away setTimeout ( function ( ) { //We will clear and then set width for dialogs without width set  if ( ! $child . data ( "predefinedWidth" ) ) { $child . css ( { width : '' } ) ; //Reset width } var width = $child . outerWidth ( false ) ; var height = $child . outerHeight ( false ) ; var windowHeight = $ ( window ) . height ( ) ; var constrainedHeight = Math . min ( height , windowHeight ) ; $child . css ( { 'margin-top' : ( - constrainedHeight / 2 ) . toString ( ) + 'px' , 'margin-left' : ( - width / 2 ) . toString ( ) + 'px' } ) ; if ( ! $child . data ( "predefinedWidth" ) ) { //Ensure the correct width after margin-left has been set $child . outerWidth ( width ) ; } if ( height > windowHeight ) { $child . css ( "overflow-y" , "auto" ) ; } else { $child . css ( "overflow-y" , "" ) ; } $ ( theDialog . host ) . css ( 'opacity' , 1 ) ; $child . css ( "visibility" , "visible" ) ; $child . find ( '.autofocus' ) . first ( ) . focus ( ) ; } , 1 ) ; } ; setDialogPosition ( ) ; loadables . load ( setDialogPosition ) ; if ( $child . hasClass ( 'autoclose' ) ) { $ ( theDialog . blockout ) . click ( function ( ) { theDialog . close ( ) ; } ) ; } }
This function is called after the modal is fully composed into the DOM, allowing your implementation to do any final modifications, such as positioning or animation. You can obtain the original dialog object by using `getDialog` on context.model.
@method compositionComplete
@param {DOMElement} child The dialog view.
@param {DOMElement} parent The parent view.
@param {object} context The composition context.
This function is called after the modal is fully composed into the DOM allowing your implementation to do any final modifications such as positioning or animation . You can obtain the original dialog object by using getDialog on context . model .