module Demo {
    'use strict';
    export interface IDemoCheckScope extends ng.IScope {
        checkValue: boolean;
    }
    
/* ==========================================================================
    DemoCheckController
    ========================================================================== */
    export class DemoCheckController {
        private scope: IDemoCheckScope;
        static $inject = ['$scope', '$element'];
        public constructor($scope: IDemoCheckScope, $element: JQuery) {
            this.scope = $scope;
        }
        public Toggle(): void {
            this.scope.checkValue = !this.scope.checkValue;
        }
    }
}

module Demo {
    'use strict';
    export enum RadioEnum {
        A = 0,
        B = 1,
        C = 2
    }
    export interface IDemoRadioScope extends ng.IScope {
        radioValue: RadioEnum;
    }
/* ==========================================================================
    DemoRadioController
    ========================================================================== */
    export class DemoRadioController {
        private scope: IDemoRadioScope;
        static $inject = ['$scope', '$element'];
        public constructor($scope: IDemoRadioScope, $element: JQuery) {
            this.scope = $scope;
            this.scope.radioValue = RadioEnum.A;
        }
    }
}

module Demo {
    'use strict';
/* ==========================================================================
    DemoAnimateNumberController
    ========================================================================== */
    export class DemoAnimateNumberController extends ModernWeb.Controllers.AnimateNumberController {
        static $inject = ['$scope', '$window', '$interval'];
        public constructor($scope: ModernWeb.IAnimateNumberScope, $window: ng.IWindowService, $interval: ng.IIntervalService) {
            super($scope, $window, $interval);
            ($scope).delay = 750;
            ($scope).number = 225;
            ($scope).sign = "+";
            ($scope).unit = "K";
            // Comment this line to trigger the animation on event or action.
            this.Animate();
            // Uncomment this line to trigger the animation on window scroll event
            //this.AttachEventOnWindowScroll($element);
        }
    }
}

module Demo {
    'use strict';
/* ==========================================================================
    DemoProgressBarController
    ========================================================================== */
    export class DemoProgressBarController extends ModernWeb.Controllers.ProgressBarController {
        static $inject = ['$scope', '$element'];
        public constructor($scope: ModernWeb.IProgressBarScope, $element: JQuery) {
            super($scope, $element);
            (<ModernWeb.IProgressBarModel>$scope).min = 0;
            (<ModernWeb.IProgressBarModel>$scope).max = 100;
            (<ModernWeb.IProgressBarModel>$scope).value = 75;
        }
    }
}

module Demo {
    'use strict';

/* ==========================================================================
    DemoProgressBarAnimatedController
    ========================================================================== */
    export class DemoProgressBarAnimatedController extends ModernWeb.Controllers.ProgressBarAnimatedController {
        static $inject = ['$scope', '$element'];

        public constructor($scope: ModernWeb.IProgressBarAnimatedScope, $element: JQuery) {
            super($scope, $element);
            (<ModernWeb.IProgressBarAnimatedModel>$scope).delay = 1500;
        }
    }
}

.carousel-example {
    width: 100%; 
    height: 425px;
}
.carousel-example .mw-slide{
    text-align: center;
}
.carousel-example figure{
    margin: 20px;
    height: 250px;
}
.carousel-example img {
    max-height: 250px;
}

module Demo {
    'use strict';
/* ==========================================================================
    DemoCarouselController
    ========================================================================== */
    export class DemoCarouselController {
        public constructor($scope: ModernWeb.ICarouselScope) {
            ($scope).delay = 3250;
            ($scope).playType = ModernWeb.PlayType.Automatic;
            ($scope).playDirection = ModernWeb.PlayDirection.Ascending;
            ($scope).isAnimated = true;
            ($scope).isReverseAnimated = true;
        }
    }
}

module Demo {
    'use strict';
/* ==========================================================================
    DemoDialogController
    ========================================================================== */
    export class DemoDialogController extends ModernWeb.Controllers.DialogController {
        static $inject = ['$scope', 'dialogService'];
        public constructor($scope: ModernWeb.IDialogScope, dialogService: ModernWeb.Services.DialogService) {
            super($scope, dialogService);
            (<ModernWeb.IDialogModel>$scope).id = "demoDialog1";
        }
    }
}

<!-- template located in '/lib/modernWeb/templates/Demo/RemoteDialog.html'-->
<div id="{{id}}" ng-show="isOpen">
    <h2>Remote Dialog</h2>
    <div>
        <p>
            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur mollis et massa at commodo. Cras purus odio, suscipit eu facilisis in, facilisis sit amet tortor. Aenean faucibus blandit magna nec pharetra. Nam in ante felis. Nullam blandit rhoncus massa, sed porttitor turpis molestie in. Duis volutpat, ante ut molestie pulvinar, felis justo dapibus odio, eu euismod ante ligula ut nulla. Quisque sagittis a nisl quis euismod. Proin suscipit quam sit amet egestas ullamcorper.
        </p>
        <div>
            <button type="button" ng-click="close()">Close</button>
        </div>
    </div>
</div>

module Demo {
    'use strict';
/* ==========================================================================
    DemoDialogInsertedController
    ========================================================================== */
    export class DemoRemoteDialogController extends ModernWeb.Controllers.RemoteDialogController {
        static $inject = ['$scope', '$element', 'dialogService', '$templateRequest', '$compile'];
        public constructor($scope: ModernWeb.IRemoteDialogScope, $element: JQuery, dialogService: ModernWeb.Services.DialogService, $templateRequest: ng.ITemplateRequestService, $compile: ng.ICompileService) {
            super($scope, $element, dialogService, $templateRequest, $compile);
            
            ($scope).id = "demoRemoteDialog";
            ($scope).templateUrl = '/lib/modernWeb/templates/Demo/RemoteDialog.html';
            ($scope).elementTarget = $("#demoRemoteDialogSection");
        }
    }
}

module Demo {
    'use strict';

/* ==========================================================================
    Interface
    ========================================================================== */
    export interface IDemoWizardScope extends ng.IScope {
        demoForm: IDemoFormController;
    }

    export interface IDemoFormController extends ng.IFormController {
        customerName: ng.INgModelController;
        customerCardNumber: ng.INgModelController;
    }

/* ==========================================================================
    DemoWizardController
    ========================================================================== */
    export class DemoWizardController {
        protected scope: IDemoWizardScope;
        static $inject = ['$scope', '$element'];

        public constructor($scope: IDemoWizardScope, $element: JQuery) {
            this.scope = $scope;
        }

        public ValidStep1(): boolean {
            return true;
        }

        public ValidStep2(): boolean {
            return this.scope.demoForm.customerName.$valid && this.scope.demoForm.customerCardNumber.$valid;
        }

        public ValidStep3(): boolean {
            return true;
        }
        
        public ValidateStep1(): void {
            alert("Validate step 1");
        }

        public ValidateStep2(): void {
            this.scope.demoForm.customerName.$validate();
            this.scope.demoForm.customerCardNumber.$validate();
            this.scope.demoForm.customerName.$setDirty();
            this.scope.demoForm.customerCardNumber.$setDirty();
            alert("Validate step 2");
        }

        public ValidateStep3(): void {
            alert("Validate step 3");
        }

        public Submit($event: Event): void {
            $event.preventDefault();
            alert("Form submitted from DemoWizardController Submit($event) function");
        }
    }
}