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

namespace MvcExplorer.Controllers
{
    public partial class RadialGaugeController : Controller
    {
        public ActionResult Editing()
        {
            ViewBag.DemoSettings = true;
            ViewBag.DemoSettingsModel = new ClientSettingsModel
            {
                Settings = CreateEditingSettings()
            };
            return View();
        }

        private static IDictionary<string, object[]> CreateEditingSettings()
        {
            var settings = new Dictionary<string, object[]>
            {
                {"IsReadOnly", new object[]{false, true }},
                {"Step", new object[]{0.5, 1, 2}},
                {"ShowTicks", new object[]{ false, true}},
                {"ShowTickText", new object[]{ false, true}},
                {"NeedleShape", new object[]{ "None", "Triangle", "Diamond", "Hexagon", "Rectangle", "Arrow", "WideArrow", "Pointer", "WidePointer", "Outer"}},
                {"NeedleLength", new object[]{ "Outer", "Middle", "Inner"}},
                {"HandleWheel", new object[]{true, false }}
            };

            return settings;
        }
    }
}

@{
    ClientSettingsModel demoSettingsModel = ViewBag.DemoSettingsModel;
}

@section Styles{
    <style>
        .wj-gauge .wj-tick-text text {
            opacity: 1;
            font-family: Courier;
            font-size: 8pt;
            fill: purple;
        }
        .wj-gauge .wj-needle {
            fill: orangered;
            stroke: orangered;
        }
        .wj-gauge .wj-needle .wj-inner-needle-cap {
            fill: white;
        }
        .fixRadiaGauge{
            padding-left:25px;
            overflow:inherit;
        }
    </style>
}

<c1-radial-gauge id="@demoSettingsModel.ControlId" min="0" max="10" value="5" is-read-only="false" step="0.5" format="" width="300px" height="250px"
                 class="fixRadiaGauge"
                 show-ticks="false" show-tick-text="false"
                 show-text="None"
                 needle-shape="None" needle-length="Outer" handle-wheel="true">
</c1-radial-gauge>

@section Description{
    <p>@Html.Raw(RadialGaugeRes.Editing_Text0)</p>
    <p>@Html.Raw(RadialGaugeRes.Editing_Text1)</p>
    <p>@Html.Raw(RadialGaugeRes.Editing_Text2)</p>
    <p>@Html.Raw(RadialGaugeRes.Editing_Text3)</p>
    <p>@Html.Raw(RadialGaugeRes.Editing_Text4)</p>
    <p>@Html.Raw(RadialGaugeRes.Editing_Text5)</p>
}