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 FlexChartController
    {
        public ActionResult ChartAnimation()
        {
            return View(Fruit.GetFruitsSales());
        }
    }
}

@model IEnumerable<Fruit>

@{
    ViewBag.DemoSettings = true;
}

@(Html.C1().FlexChart().Id("animationChart").ChartType(C1.Web.Mvc.Chart.ChartType.Line)
    .Bind(Model).BindingX("Name").Series(sers =>
    {
        sers.Add().Binding("MarPrice").Name("March");
        sers.Add().Binding("AprPrice").Name("April");
        sers.Add().Binding("MayPrice").Name("May");
    }).ShowAnimation(cab => cab.AnimationMode(AnimationMode.All).Easing(Easing.Swing).Duration(400).Id("animation"))
)

@section Scripts{
<script type="text/javascript">
    function updateMenu(menu, headerNamePrefix) {
        menu.header = headerNamePrefix + ': <b>' + menu.selectedItem.Header + '</b>';
    }

    function updateAnimation(prop, newValue) {
        var chart = wijmo.Control.getControl('#animationChart'),
            animationExt;

        if (chart) {
            animationExt = c1.getExtender(chart, 'animation');
            if (animationExt) {
                animationExt[prop] = newValue;
            }
        }
    }

    function chartTypeChanged(menu) {
        var chart = wijmo.Control.getControl('#animationChart');
        updateMenu(menu, '@(Resources.FlexChart.ChartAnimation_ChartType)');
        if (chart) {
            chart.chartType = wijmo.chart.ChartType[menu.selectedItem.Header];
        }
    }

    function animationModeChanged(menu) {
        var chart = wijmo.Control.getControl('#animationChart'),
            dataSource = chart.itemsSource.sourceCollection || chart.itemsSource;

        updateMenu(menu, '@(Resources.FlexChart.ChartAnimation_AnimationMode)');
        updateAnimation('animationMode', wijmo.chart.animation.AnimationMode[menu.selectedItem.Header]);
        //make the chart to replay the animation.
        chart.itemsSource = dataSource.slice(0);
    }

    function easingChanged(menu) {
        var chart = wijmo.Control.getControl('#animationChart'),
            dataSource = chart.itemsSource.sourceCollection || chart.itemsSource;

        updateMenu(menu, '@(Resources.FlexChart.ChartAnimation_Easing)');
        updateAnimation('easing', wijmo.chart.animation.Easing[menu.selectedItem.Header]);
        //make the chart to replay the animation.
        chart.itemsSource = dataSource.slice(0);
    }

    function durationChanged(sender, args) {
        if (!checkValue(sender)) {
            return;
        }

        var chart = wijmo.Control.getControl('#animationChart'),
            dataSource = chart.itemsSource.sourceCollection || chart.itemsSource;

        updateAnimation('duration', sender.value);
        //make the chart to replay the animation.
        chart.itemsSource = dataSource.slice(0);
    }

    function checkValue(number) {
        return number.value >= number.min && number.value <= number.max;
    }
</script>
}

@section Settings{
    <div class="container-fluid well">
        <div calss="row" style="margin:10px">
            @(Html.C1().Menu().Header(Resources.FlexChart.ChartAnimation_ChartType + ": <b>Line</b>").MenuItems(mifb =>
               {
                   mifb.Add().Header("Bar");
                   mifb.Add().Header("Column");
                   mifb.Add().Header("Area");
                   mifb.Add().Header("Line");
                   mifb.Add().Header("LineSymbols");
                   mifb.Add().Header("Spline");
                   mifb.Add().Header("SplineSymbols");
                   mifb.Add().Header("SplineArea");
                   mifb.Add().Header("Scatter");
               }).OnClientItemClicked("chartTypeChanged"))
            @(Html.C1().Menu().Header(Resources.FlexChart.ChartAnimation_AnimationMode+ ": <b>All</b>").MenuItems(mifb =>
               {
                   foreach (var name in Enum.GetNames(typeof(AnimationMode)))
                   {
                       mifb.Add().Header(name);
                   }
               }).OnClientItemClicked("animationModeChanged"))
            @(Html.C1().Menu().Header(Resources.FlexChart.ChartAnimation_Easing+ ": <b>Swing</b>").MenuItems(mifb =>
               {
                   foreach (var name in Enum.GetNames(typeof(Easing)))
                   {
                       mifb.Add().Header(name);
                   }
               }).OnClientItemClicked("easingChanged"))
            <div>
                <label style="display:inline-block;font-weight:normal">@Html.Raw(Resources.FlexChart.ChartAnimation_Duration)</label>
                @(Html.C1().InputNumber().Min(200).Max(5000).Step(200).Value(400).Format("n0").OnClientValueChanged("durationChanged"))
            </div>
        </div>
    </div>
}

@section Description{
    <p>@Html.Raw(Resources.FlexChart.ChartAnimation_Text0)</p>
    <p>@Html.Raw(Resources.FlexChart.ChartAnimation_Text1)</p>
    <p>@Html.Raw(Resources.FlexChart.ChartAnimation_Text2)</p>
}