<%@ Page Title="Home Page" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeBehind="Angular.aspx.cs" Inherits="WebFormsClient.Angular" %>

<asp:Content runat="server" ID="HeadContent" ContentPlaceHolderID="HeadContent">
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-beta.1/angular.min.js"></script>

</asp:Content>
<asp:Content runat="server" ID="BodyContent" ContentPlaceHolderID="MainContent">
    <div ng-app='app'>
        <div class="content-container-wrapper" ng-controller='BookingController'>
            <div class="content-container" id="availability-request" ng-show="isAvailabilityRequestViewVisible">
                <h3>
                    <asp:Literal runat="server" Text="<%$ Resources: Common, H_AvailabilityRequest %>" /></h3>

                <div class="alert alert-danger" id="invalid-parameters">
                    <asp:Literal runat="server" Text="<%$ Resources: Common, Error_InvalidParameters %>" />
                </div>
                <div>
                    <p class="form-label">
                        <asp:Literal runat="server" Text="<%$ Resources: Common, Origin %>" />
                    </p>
                    <asp:DropDownList runat="server" ID="ddlOrigin" AutoPostBack="False" ClientIDMode="Static" CssClass="combo" ng-model="selectedOrigin" />
                </div>
                <div>
                    <p class="form-label">
                        <asp:Literal runat="server" Text="<%$ Resources: Common, Destination %>" />
                    </p>
                    <asp:DropDownList runat="server" ID="ddlDestination" AutoPostBack="False" ClientIDMode="Static" CssClass="combo" ng-model="selectedDestination" />
                </div>

                <div>
                    <p class="form-label">
                        <asp:Literal runat="server" Text="<%$ Resources: Common, Dates %>" />
                    </p>

                    <div class="input-daterange input-group" id="dp-return">
                        <input type="text" class="input-sm form-control" name="departure" />
                        <span class="input-group-addon">
                            <asp:Literal runat="server" Text="<%$ Resources: Common, To %>" /></span>
                        <input type="text" class="input-sm form-control" name="return" />
                    </div>
                </div>
                <div class="button-container">
                    <button type='button' class="btn btn-primary" ng-click="getAvailability_Click()">
                        <asp:Literal runat="server" Text="<%$ Resources: Common, BTN_CheckAvailability%>" />
                    </button>
                    <button type='button' class="btn btn-primary" ng-click="lastRequests_Click()">
                        <asp:Literal runat="server" Text="<%$ Resources: Common, BTN_LastRequests%>" />
                    </button>
                </div>

            </div>
            <div class="content-container" ng-show="isAvailabilityResponseViewVisible">
                <h3>
                    <asp:Literal runat="server" Text="<%$ Resources: Common, H_AvailableBookings %>" /></h3>
                <div id="journey-content-wrapper">
                    <h4>
                        <asp:Literal runat="server" Text="<%$ Resources: Common, H_InboundJourneys %>" /></h4>
                    <div>
                        <div class="well" ng-repeat="journey in inboundJourneys">
                            <h5>{{journey.Carrier}} </h5>
                            <div>{{journey.DepartureStation.Name}} ({{formatDate(journey.DepartureTime)}}) </div>
                            <div>{{journey.ArrivalStation.Name}} ({{formatDate(journey.ArrivalTime)}}) </div>
                        </div>
                    </div>
                    <h4>
                        <asp:Literal runat="server" Text="<%$ Resources: Common, H_OutboundJourneys %>" /></h4>
                    <div>
                        <div class="well"ng-repeat="journey in outboundJourneys">
                            <h5>{{journey.Carrier}} </h5>
                            <div>{{journey.DepartureStation.Name}} ({{formatDate(journey.DepartureTime)}}) </div>
                            <div>{{journey.ArrivalStation.Name}} ({{formatDate(journey.ArrivalTime)}}) </div>
                        </div>
                    </div>
                </div>
                <div class="button-container">
                    <button type='button' class="btn btn-primary" id="btnNewSearch" ng-click="btnNewSearch_Click()">
                        <asp:Literal runat="server" Text="<%$ Resources: Common, BTN_NewSearch%>" />
                    </button>
                </div>
            </div>
            <div class="content-container" ng-show="isLastRequestsViewVisible">
                <h3>
                    <asp:Literal runat="server" Text="<%$ Resources: Common, H_LastRequests %>" /></h3>
                <div  class="request-wrapper">
                    <div class="well" ng-repeat="request in lastRequests">
                        <div>{{request.Origin}} -> {{request.Destination}}</div>
                        <div>{{formatDate(request.DepartureDate)}} - {{formatDate(request.ReturnDate)}}</div>
                    </div>
                </div>
                <div class="button-container">
                    <button type='button' class="btn btn-primary" ng-click="btnBackLastRequests_Click()">
                        <asp:Literal runat="server" Text="<%$ Resources: Common, BTN_BackLastRequests%>" />
                    </button>
                </div>
            </div>
            <div class="btn-group" id="version-selector">
                <button type="button" class="btn btn-info" onclick="window.location.href='Default.aspx'">Classic</button>
                <button type="button" class="btn btn-info active">Angular</button>
                <button type="button" class="btn btn-info" onclick="window.location.href='Knockout.aspx'">Knockout</button>
            </div>
        </div>
    </div>
    <script src="Scripts/Booking/AvailabilityRequest.Angular.js"></script>
</asp:Content>
