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 InputColorController : Controller
    {
        private readonly ControlOptions _optionModel = new ControlOptions
        {
          Options = new OptionDictionary
                {
                    {"Show Color String", new OptionItem{ Values = new List<string> { "True", "False"}, CurrentValue = "False"}}
                }
        };

        public ActionResult Index(FormCollection collection)
        {
            IValueProvider data = collection;
            _optionModel.LoadPostData(data);
            ViewBag.DemoOptions = _optionModel;
            return View();
        }
    }
}

@using System.Drawing

@{
    ControlOptions optionsModel = ViewBag.DemoOptions;
    ViewBag.DemoSettings = true;
}

<p>
    <img id="image1" src="@Href("~/Content/images/room.png")" />
</p>

@section Scripts{
    <style>
        .invalid-tooltip {
            background-color: red;
            color: yellow;
            opacity: 0.9;
            border-color: lightcoral;
        }
    </style>

    <script>
        var _invalidTooltip;
        c1.documentReady(function () {
            _invalidTooltip = new wijmo.Tooltip();
            _invalidTooltip.cssClass = 'invalid-tooltip';
            _invalidTooltip.position = 11;
            window.addEventListener('resize', function () {
                if (_invalidTooltip.isVisible) {
                    _invalidTooltip.hide();
                    onInvalidInput();
                }
            });
        })

        function onInvalidInput(input, e) {
            e && (e.cancel = true);
            _invalidTooltip.show("#invalidInput", "@Html.Raw(Resources.InputColor.Index_Text2)");
        }

        function onValueChanged(input, e) {
            _invalidTooltip && _invalidTooltip.hide();
            changeColor(input, e);
        }

        function changeColor(sender, e) {
            document.getElementById("image1").style.backgroundColor = sender.value;
        }
    </script>
}

<div>
    <label>@Html.Raw(Resources.InputColor.Index_Text0)</label>
    @(Html.C1().InputColor()
        .Id("invalidInput")
        .Value(Color.White)
        .ShowColorString(Convert.ToBoolean(optionsModel.Options["Show Color String"].CurrentValue))
        .ClickAction(ClickAction.Toggle)
        .OnClientInvalidInput("onInvalidInput")
        .OnClientValueChanged("onValueChanged")
    )
</div>

@section Settings{
    @Html.Partial("_OptionsMenu", optionsModel)
}

@section Description{
    @Html.Raw(Resources.InputColor.Index_Text1)
}