@model GheyasPlusShop.Models.Admin.SettingModel
@section styles
{
    <style>
        body {
            background-color: #f6f6f6;
        }

        #div-editorTop, #div-editorBottom {
            height: calc((100vh - 150px)/2);
            margin-top:10px;
        }
    </style>
}

<div style="padding:15px;">
    <div class="d-flex justify-content-end py-2 w-100">
        <button type="button" class="button-accept float-left" onclick="save()">ذخیره</button>
    </div>
    <div>متن مربوط به قسمت اصلی صفحه درباره ما </div>
    <div id="div-editorTop" style="margin-bottom:20px;">
        <textarea id="editorTop">@(Model.WebsiteAboutUsTopContext)</textarea>
    </div>
    <div>متن مربوط به قسمت پایین صفحه درباره ما </div>
    <div id="div-editorBottom">
        <textarea id="editorBottom">@(Model.WebsiteAboutUsBottomContext)</textarea>
    </div>
</div>


@section scripts{
    <script src="~/App_Scripts/app/ckeditor/ckeditor.js"></script>
    <script>
        closeLoading();
        $(document).ready(function () {
            var editorElemTop = document.getElementById("div-editorTop");
            var editorElemBottom = document.getElementById("div-editorBottom");
            CKEDITOR.replace("editorTop", {
                toolbar: [
                    { name: "clipboard", items: ["PasteText", "PasteFromWord", "Undo", "Redo"] },
                    { name: "styles", items: ["Font", "FontSize"] },
                    { name: "basicstyles", items: ["Bold", "Italic", "Underline", "Strike"] },
                    { name: "colors", items: ["TextColor"] },
                    { name: "align", items: ["JustifyLeft", "JustifyCenter", "JustifyRight", "JustifyBlock"] },
                    {
                        name: "paragraph",
                        items: ["NumberedList", "BulletedList", "-", "Outdent", "Indent", "-", "BidiLtr", "BidiRtl"]
                    },
                    { name: "insert", items: ["Image", "Table"] },
                    { name: "tools", items: ["Maximize"] }
                ],
                contentsCss: [
                    "../../App_Css/app/editor.contents.css",
                    "../../App_Css/app/editor.iframe.css"
                ],
                bodyClass: "document-editor",
                extraPlugins: "image2,tableresize",
                on: {
                    // maximize the editor on startup
                    'instanceReady': function (evt) {
                        evt.editor.resize("100%", editorElemTop.clientHeight);
                    }
                },
                font_names: "seyagh",
                font_defaultLabel:"seyagh"
                
            });

            CKEDITOR.replace("editorBottom", {
                toolbar: [
                    { name: "clipboard", items: ["PasteText", "PasteFromWord", "Undo", "Redo"] },
                    { name: "styles", items: ["Font", "FontSize"] },
                    { name: "basicstyles", items: ["Bold", "Italic", "Underline", "Strike"] },
                    { name: "colors", items: ["TextColor"] },
                    { name: "align", items: ["JustifyLeft", "JustifyCenter", "JustifyRight", "JustifyBlock"] },
                    {
                        name: "paragraph",
                        items: ["NumberedList", "BulletedList", "-", "Outdent", "Indent", "-", "BidiLtr", "BidiRtl"]
                    },
                    { name: "insert", items: ["Image", "Table"] },
                    { name: "tools", items: ["Maximize"] }
                ],
                contentsCss: [
                    "../../App_Css/app/editor.contents.css",
                    "../../App_Css/app/editor.iframe.css"
                ],
                bodyClass: "document-editor",
                extraPlugins: "image2,tableresize",
                on: {
                    // maximize the editor on startup
                    'instanceReady': function (evt) {
                        evt.editor.resize("100%", editorElemBottom.clientHeight);
                    }
                },
                font_names: "seyagh",
                font_defaultLabel:"seyagh"
                
            });

        });


        function save() {
            var $bodyTop = $(CKEDITOR.instances.editorTop.document.$).find("body").html();
            var $bodyBottom = $(CKEDITOR.instances.editorBottom.document.$).find("body").html();
            ajax({
                loading: true,
                url: "Admin/SaveAboutUsContext",
                data: JSON.stringify({ aboutUsTopContext: $bodyTop , aboutUsBottomContext: $bodyBottom}),
                success: function () {
                    window.location.reload();
                }
            });
        }

    </script>
}
