using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using MvcExplorer.Models;

namespace MvcExplorer.Controllers
{
    public partial class InputDateRangeController : Controller
    {
        public ActionResult Index()
        {
            ViewBag.DemoSettings = true;
            return View();
        }
    }
}

@{
    var today = DateTime.Now.Date;
    var rangeEnd = today.AddDays(3);
}

@section Scripts{
    <script>
        // Get predefined date ranges
        function getPredefinedRanges() {
            let dt = wijmo.DateTime, now = new Date();
            return {
                // Custom
                'Custom Range': null,
                // Days
                //'Today': [now, now],
                //'Yesterday': [dt.addDays(now, -1), dt.addDays(now, -1)],
                //'Tomorrow': [dt.addDays(now, +1), dt.addDays(now, +1)],
                // Weeks
                'This Week': [dt.weekFirst(now), dt.weekLast(now)],
                'Last Week': [dt.weekFirst(dt.addDays(now, -7)), dt.weekLast(dt.addDays(now, -7))],
                'Next Week': [dt.weekFirst(dt.addDays(now, +7)), dt.weekLast(dt.addDays(now, +7))],
                // Months
                'This Month': [dt.monthFirst(now), dt.monthLast(now)],
                'Last Month': [dt.monthFirst(dt.addMonths(now, -1)), dt.monthLast(dt.addMonths(now, -1))],
                'Next Month': [dt.monthFirst(dt.addMonths(now, +1)), dt.monthLast(dt.addMonths(now, +1))],
                // Years
                'This Year': [dt.yearFirst(now), dt.yearLast(now)],
                'Last Year': [dt.addYears(dt.yearFirst(now), -1), dt.addYears(dt.yearLast(now), -1)],
                'Next Year': [dt.addYears(dt.yearFirst(now), +1), dt.addYears(dt.yearLast(now), +1)],
            };
        }

        function dateRangeChanged(s) {
            // Show date ranges
            let el = document.querySelector('#showRange');
            el.innerHTML = wijmo.format('@Html.Raw(Resources.InputDateRange.Index_ShowRange)', s);
        }

        function monthCountChanged(sender) {
            let inputDateRange = wijmo.Control.getControl("#demoControl");
            inputDateRange.monthCount = sender.value;
        }

        function weeksBeforeChanged(sender) {
            let inputDateRange = wijmo.Control.getControl("#demoControl");
            inputDateRange.weeksBefore = sender.value;
        }

        function weeksAfterChanged(sender) {
            let inputDateRange = wijmo.Control.getControl("#demoControl");
            inputDateRange.weeksAfter = sender.value;
        }
        function closeOnSelectionChanged(sender) {
            let inputDateRange = wijmo.Control.getControl("#demoControl");
            inputDateRange.closeOnSelection = sender.checked;
        }
    </script>
}

<style>
    .settings > div {
        margin-bottom: 0.5em;
    }

    .settings label {
        width: 10em;
        text-align: right;
        margin-right: 0.5em;
        float: left;
        font-weight: normal;
        line-height: 2em;
    }

    .settings input {
        height: 1.8em;
    }

    .settings .wj-inputnumber {
        width: 10em;
    }

    .wj-inputdate-dropdown > .wj-listbox {
        max-height: initial;
    }
</style>

<p>
    <div id="demoControl"></div>
</p>

<p>
    <span id="showRange"></span>
</p>

@(Html.C1().InputDateRange().Id("demoControl")
        .AlwaysShowCalendar(true)
        .CloseOnSelection(true)
        .MonthCount(2)
        .WeeksBefore(0)
        .WeeksAfter(0)
        .PredefinedRanges("getPredefinedRanges")
        .OnClientValueChanged("dateRangeChanged")
        .OnClientRangeEndChanged("dateRangeChanged")
        .Value(today)
        .RangeEnd(rangeEnd)
)

@section Settings{
 <div class="settings">
     <div>
         <label for="monthCount">Month Count</label>
         @(Html.C1().InputNumber().Id("monthCount").Min(1).Step(1).Value(2).OnClientValueChanged("monthCountChanged").Width(150))
     </div>
     <div>
         <label for="weeksBefore">Weeks Before</label>
         @(Html.C1().InputNumber().Id("weeksBefore").Min(0).Step(1).Value(0).OnClientValueChanged("weeksBeforeChanged").Width(150))
     </div>
     <div>
         <label for="weeksAfter">Weeks After</label>
         @(Html.C1().InputNumber().Id("weeksAfter").Min(0).Step(1).Value(0).OnClientValueChanged("weeksAfterChanged").Width(150))
     </div>
     <div>
         <label for="closeOnSelection">Close On Selection</label>
         <input type="checkbox" id="closeOnSelection" onchange="closeOnSelectionChanged(this)" checked />
     </div>
</div>
}

@section Summary{
    <p>@Html.Raw(Resources.InputDateRange.Index_Text0)</p>
}

@section Description{
    <p>@Html.Raw(Resources.InputDateRange.Index_Text1)</p>
    <p>@Html.Raw(Resources.InputDateRange.Index_Text2)</p>
}