<%@ Page Title="" Language="C#" MasterPageFile="~/EmptyAjaxMaster.Master" AutoEventWireup="true" CodeBehind="DateRangeSelection.aspx.cs" Inherits="MKInsight.Online.TimeRecording.UI.DateRangeSelection" %>

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>

<%@ Register Src="../../UIControls/Interface/InputDateEx.ascx" TagName="InputDateEx" TagPrefix="uc1" %>

<%@ Register Src="../../UIControls/MessageBox.ascx" TagName="MessageBox" TagPrefix="uc2" %>

<%@ Register Src="../../UIControls/Interface/TextBoxEx.ascx" TagName="TextBoxEx" TagPrefix="uc3" %>

<asp:Content ID="Content1" ContentPlaceHolderID="h" runat="server">

    <script type="text/javascript" src="../../scripts/jquery/jquery_min.js"></script>

    <script type="text/javascript">
        function cb() {
            parent.$.colorbox.close();
             $('[id*=btn_partial_refresh]',parent.document).click();            
        }
    </script>
</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="cm" runat="server">

    <script src="../../scripts/jquery/jquery_min.js"></script>
    <%--<script src="../../scripts/jquery/jquery-ui.min.js"></script>
    <script src="../../scripts/jquery/jQDateRangeSlider-min.js"></script>
    <script src="../../scripts/jquery/moment.l.min.js"></script>
    <link rel="stylesheet" href="../../scripts/jquery/daterangeCSS/classic-min.css" type="text/css" />--%>


    <%--  <script>

        var changing = true;
        var dateChanging = true;

        function updateValuesChanged(event, ui, changing) {
            if (!changing)
                displayValues(ui.label, ui.values)
        }

        function updateValuesChanging(event, ui, changing) {
            if (changing)
                displayValues(ui.label, ui.values)
        }

        function displayValues(slider, values) {

            $("input[type=text][id*='txt_c']").val("min: " + values.min + " max: " + values.max);

            $("input[type=text][id*='dt_min']").val($.datepicker.formatDate("dd/mm/yy", values.min));
            $("input[type=text][id*='dt_max']").val($.datepicker.formatDate("dd/mm/yy", values.max));
        }

        function makeDateSlider(selector, options) {
            var slider = $(selector)
				.dateRangeSlider(options)
				.bind("valuesChanging", function (event, ui) { updateValuesChanging(event, ui, dateChanging); })
				.bind("valuesChanged", function (event, ui) { updateValuesChanged(event, ui, dateChanging); })
				.addClass("ui-rangeSlider-dev");
            displayValues(slider, slider.__proto__.rangeSlider("values"));
        }
        
        $(document).ready(function () {

            makeDateSlider("#defaultDateSlider", { bounds: { min: new Date(2015, 1, 1), max: new Date(2016, 1, 1) }, step: { days: 7 }, defaultValues: { min: new Date(2015, 4, 10), max: new Date(2015, 5, 22) }, valueLabels: "hide" });

            $("input[type=text][id*='dt_min']").change(function (event, ui) {

                var date = moment($("input[type=text][id*='dt_min']").val(), "D/M/Y");

                var year = date.format("Y");
                var month = date.format("M");
                var day = date.format("D");
                var formattedDate = new Date(year, month, day);
                $("#defaultDateSlider").dateRangeSlider("min", formattedDate);

                // $find("ctl00_cm_dt_min_Ces_s").set_selectedDate($.datepicker.formatDate("dd/mm/yy", actualMinDate));
                
            });

            $("input[type=text][id*='dt_max']").change(function (event, ui) {

                var date = moment($("input[type=text][id*='dt_max']").val(), "D/M/Y");

                var year = date.format("Y");
                var month = date.format("M");
                var day = date.format("D");
                var formattedDate = new Date(year, month, day);
                $("#defaultDateSlider").dateRangeSlider("max", formattedDate);

            });
            
        });

    </script>--%>

    <asp:Literal ID="lit_s" runat="server"></asp:Literal>
    <uc2:MessageBox ID="u_m" runat="server" />

    <table>
        <tr>
            <td>

                <uc1:InputDateEx ID="dt_min" runat="server" />

            </td>
        </tr>
        <tr>
            <td>
                <uc1:InputDateEx ID="dt_max" runat="server" />
            </td>
        </tr>
        <%-- <tr>
                    <td>
                        <div id="defaultDateSlider" class="dateSlider"></div>
                    </td>
                </tr>--%>

        <tr>
            <td>
                <asp:Button ID="btn_OK" runat="server" OnClick="OnOK" />
            </td>
        </tr>
    </table>

    <%--<input type="text" id="txt_c" multiple="multiple" style="height: 357px; width: 1236px; vertical-align: top; word-wrap: break-word; display: none" />--%>
</asp:Content>
