using MvcExplorer.Models;
using System.Collections.Generic;
using Microsoft.AspNetCore.Mvc;

namespace MvcExplorer.Controllers
{
    public partial class FlexChartController: Controller
    {
        public ActionResult Index()
        {
            var settings = new ClientSettingsModel
            {
                Settings = CreateIndexSettings(),
                DefaultValues = GetIndexDefaultValues()
            };
            settings.LoadRequestData(Request);
            ViewBag.DemoSettingsModel = settings;

            return View(Fruit.GetFruitsSales());
        }

        private static IDictionary<string, object[]> CreateIndexSettings()
        {
            var settings = new Dictionary<string, object[]>
            {
                {"ChartType", new object[]{"Column", "Bar", "Scatter", "Line", "LineSymbols", "Area", "Spline", "SplineSymbols", "SplineArea"}},
                {"Stacking", new object[]{"None", "Stacked", "Stacked 100%"}},
                {"Rotated", new object[]{false, true}},
                {"Palette", new object[]{"standard", "cocoa", "coral", "dark", "highcontrast", "light", "midnight", "minimal", "modern", "organic", "slate"}},
                {"GroupWidth", new object[]{"25%", "70%", "100%", "50 pixels"}},
                {"LegendOrientation", new object[]{ "Auto", "Vertical", "Horizontal"}},
            };

            return settings;
        }

        private static IDictionary<string, object> GetIndexDefaultValues()
        {
            var defaultValues = new Dictionary<string, object>
            {
                {"GroupWidth", "70%"}
            };

            return defaultValues;
        }
    }
}

@{
    ViewBag.DemoSettings = true;
    ClientSettingsModel demoSettingModel = ViewBag.DemoSettingsModel;
    var chartType = demoSettingModel.GetEnum("ChartType", C1.Web.Mvc.Chart.ChartType.Column);
    var orientationType = demoSettingModel.GetEnum("LegendOrientation", C1.Web.Mvc.Chart.LegendOrientation.Auto);
    var stacking = demoSettingModel.GetEnum("Stacking", C1.Web.Mvc.Chart.Stacking.None, (content) =>
    {
        return string.Equals(content, "Stacked 100%", StringComparison.OrdinalIgnoreCase)
            ? "Stacked100pc"
            : content;
    });
    var rotated = demoSettingModel.GetBool("Rotated", false);
}


<c1-flex-chart id="@demoSettingModel.ControlId" binding-x="Name"
               chart-type="@chartType" stacking="@stacking" rotated="@rotated" legend-position="Bottom" legend-orientation="@orientationType">
    <c1-items-source source-collection="Model"></c1-items-source>
    <c1-flex-chart-series binding="MarPrice" name="March">
    </c1-flex-chart-series>
    <c1-flex-chart-series binding="AprPrice" name="April">
    </c1-flex-chart-series>
    <c1-flex-chart-series binding="MayPrice" name="May">
    </c1-flex-chart-series>
</c1-flex-chart>

@section Scripts{
<script type="text/javascript">
    convertStacking = function (value) {
        return value === "Stacked 100%" ? "Stacked100pc" : value;
    };
    convertPalette = function (value) {
        return wijmo.chart.Palettes[value];
    };
    updateGroupWidth = function (control, value) {
        control.options = { groupWidth: value === "50 pixels" ? 50 : value };
    };
    customChangeLegendOrientation = function (control, value) {
        control.legend.orientation = value;
    };
</script>
}

@section Description{
    <h3>
        @Html.Raw(FlexChartRes.Index_Introduction)
    </h3>
    <p>@Html.Raw(FlexChartRes.Index_Text0)</p>
    <p>@Html.Raw(FlexChartRes.Index_Text1)</p>
    <p>@Html.Raw(FlexChartRes.Index_Text2)</p>
    <ol>
        <li>@Html.Raw(FlexChartRes.Index_Li1)</li>
        <li>@Html.Raw(FlexChartRes.Index_Li2)</li>
        <li>@Html.Raw(FlexChartRes.Index_Li3)</li>
    </ol>
    <p>@Html.Raw(FlexChartRes.Index_Text3)</p>
}