divan/GanjooRazor/Areas/User/Pages/Section.cshtml

@page
@model GanjooRazor.Areas.User.Pages.SectionModel
@using DNTPersianUtils.Core
@{
    Layout = "_UserPanelLayout";
    ViewData["Title"] = "ویرایشگر قطعه";
    await GanjooRazor.Utils.GanjoorSessionChecker.ApplyPermissionsToViewData(Request, Response, ViewData);
}
<h1>@ViewData["Title"]</h1>

@if (!string.IsNullOrEmpty(Model.FatalError))
{
    @Html.Raw(Model.FatalError)
}
else
{
    <script>

        function countSections(verseCount) {
            var c = 0;
            for (var i = 0; i < verseCount; i++) {
                var checkVIndex = '#break-from-' + i.toString();
                var relatedSpan = '#break-counter-' + + i.toString();
                if ($(checkVIndex).is(":checked")) {
                    c++;
                    if (c > 10) {
                        $(relatedSpan).html('<p class="red-color">' + c.toString() + '</p>');
                    }
                    else {
                        $(relatedSpan).html('<p class="green-color">' + c.toString() + '</p>');
                    }

                }
                else {
                    $(relatedSpan).html('');
                }
            }
        }

        function saveSectionCorrection(id, verseCount) {

            var breakFromVIndices = [];
            for (var i = 0; i <= verseCount; i++) {
                var checkVIndex = '#break-from-' + i.toString();
                if ($(checkVIndex).is(":checked")) {
                    breakFromVIndices.push(i);
                }
            }

            if (breakFromVIndices.length > 10) {
                alert('در هر نوبت حداکثر از ۱۰ محل می‌توانید قطعه را بشکنید.');
                return;
            }

            var rhythm_new = $('#rhythm-new').val();
            if (rhythm_new == $('#rhythm-old').text()) {
                rhythm_new = null;
            }

            var rhyme_letters = $('#rhyme-letters').val();
            if (rhyme_letters == $('#rhyme-letters-old').text()) {
                rhyme_letters = null;
            }

            var section_lang = $('#language').val();
            if (section_lang == $('#language-old').text()) {
                section_lang = null;
            }

            if (breakFromVIndices.length == 0 && rhythm_new == null && rhyme_letters == null && section_lang == null) {
                alert('شما هیچ تغییری در متن نداده‌اید!');
                return;
            }

            $('#savecorrections').hide();
            $('#saving').text('در حال ذخیره ...');


            var url = '?handler=SendSectionCorrections';

            $.ajax({
                type: "POST",
                url: url,
                data: {
                    sectionId: id,
                    rhythm: rhythm_new,
                    rhyme: rhyme_letters,
                    breakFromVIndices: breakFromVIndices,
                    note: $('#note').val(),
                    lang: section_lang

                },
                success: function () {
                    location.reload(true);
                },
                error: function (e) {
                    if (e.responseText == null)
                        alert(e);
                    else
                        alert(e.responseText);
                    $('#savecorrections').show();
                    $('#saving').text('');
                }

            });


        }

        function computeSectionRhyme(sectionId, elementId) {
            $.ajax({
                type: "GET",
                url: '?Handler=ComputeRhyme',
                data: {
                    id: sectionId
                },
                error: function (e) {
                    if (e.responseText == null)
                        alert(e);
                    else
                        alert(e.responseText);
                },
                success: function (rhyme) {
                    $(elementId).val(rhyme);
                    return false;
                },
            });
        }
    </script>
    <p><a role="button" target="_blank" href="@Model.PageInformation.FullUrl" class="actionlink">@Model.PageInformation.FullTitle</a></p>

    <table>
        <tr>
            <td>
                <a href="/User/AllPoemSections?id=@Model.PageInformation.Id" role="button" class="pagebutton">
                    همهٔ قطعات شعر
                </a>
            </td>
        </tr>
        @if (Model.Previous != null)
        {
            <tr>
                <td>
                    <a href="/User/Section?poemId=@Model.PageInformation.Id&index=@Model.Previous.Index" role="button" class="pagebutton">
                        قطعهٔ قبل
                    </a>
                </td>
            </tr>
        }
        @if (Model.Next != null)
        {
            <tr>
                <td>
                    <a href="/User/Section?poemId=@Model.PageInformation.Id&index=@Model.Next.Index" role="button" class="pagebutton">
                        قطعهٔ بعد
                    </a>
                </td>
            </tr>
        }
        <tr>
            <td>
                @Html.Raw(Model.PoemSection.HtmlText)
            </td>
        </tr>
        <tr>
            <td>
                وزن فعلی:
            </td>
        </tr>
        <tr>
            <td>
                <p id="rhythm-old">@(Model.PoemSection.GanjoorMetre == null ? "" : Model.PoemSection.GanjoorMetre.Rhythm)</p>
            </td>
        </tr>
        <tr>
            <td>
                وزن ویراستهٔ من:
            </td>
        </tr>
        <tr>
            <td>
                <label for="select-search">جستجوی وزن:</label><br />
                <input type="text" id="select-search" value="" oninput="doSearchInRhythmsCombo('select-search', 'rhythm-new')" list="inputRhythms" autocomplete="off" size="50" />
                <datalist id="inputRhythms">
                    @if (Model.RhythmsByVerseCount != null)
                        @foreach (var rhythm in Model.RhythmsByVerseCount)
                        {
                            <option value="@rhythm.Rhythm">@rhythm.Rhythm</option>
                        }
                </datalist>

            </td>
        </tr>
        <tr>
            <td>
                <label for="rhythm-new">وزن انتخاب شده:</label>
                <br />
                <select id="rhythm-new" name="rhythm-new">
                    @foreach (var rhythm in Model.RhythmsAlphabetically)
                    {
                        if (Model.MyLastEdit != null && Model.MyLastEdit.Rhythm == rhythm.Rhythm)
                        {
                            <option value="@rhythm.Rhythm" selected>@rhythm.Rhythm</option>
                        }
                        else
                        {
                            if (Model.PoemSection.GanjoorMetre != null && Model.PoemSection.GanjoorMetre.Rhythm == rhythm.Rhythm)
                            {
                                <option value="@rhythm.Rhythm" selected>@(rhythm.Rhythm == "" ? "هیچکدام" : rhythm.Rhythm == "null" ? "وزن‌یابی نشده" : rhythm.Rhythm)</option>
                            }
                            else
                            {
                                <option value="@rhythm.Rhythm">@(rhythm.Rhythm == "" ? "هیچکدام" : rhythm.Rhythm == "null" ? "وزن‌یابی نشده" : rhythm.Rhythm)</option>
                            }

                        }

                    }
                </select>
                <a role="button" onclick="resetRhythm('rhythm-new')" class="pagebutton">پاک کردن وزن</a>
                <br />
                <script>
                    function newRhythm() {
                        var rhythm = prompt("پیشنهاد وزن جدید", "");
                        if (rhythm != null) {
                            var select = document.getElementById('rhythm-new');
                            var options = select.options;
                            for (let i = 0; i < options.length; i++) {
                                if (options[i].value == rhythm) {
                                    alert('وزن پیشنهادی تکراری است.');
                                    return;
                                }
                            }
                            var opt = document.createElement('option');
                            opt.value = rhythm;
                            opt.innerHTML = rhythm;
                            select.appendChild(opt);

                            var opt2 = document.createElement('option');
                            opt2.value = rhythm;
                            opt2.innerHTML = rhythm;
                            document.getElementById('rhythm-new2').appendChild(opt2);

                            alert('وزن پیشنهادی به انتهای لیست وزن‌ها اضافه شده. لطفاً از لیست آن را انتخاب کنید.');
                        }
                    }
                </script>
                <a role="button" onclick="newRhythm()" class="pagebutton">پیشنهاد وزن جدید</a>
            </td>
        </tr>

        <tr>
            <td>
                حروف قافیهٔ فعلی:
            </td>
        </tr>

        <tr>
            <td>
                <p id="rhyme-letters-old">@Model.PoemSection.RhymeLetters</p>
            </td>
        </tr>

        <tr>
            <td>
                <label for="rhyme-letters">حروف قافیهٔ پیشنهادی من (بدون فاصله و حرکات):</label>
                <br />
                @if (Model.MyLastEdit != null && !string.IsNullOrEmpty(Model.MyLastEdit.RhymeLetters))
                {
                    <input type="text" id="rhyme-letters" name="rhyme-letters" value="@Model.MyLastEdit.RhymeLetters" size="50" />
                }
                else
                {
                    <input type="text" id="rhyme-letters" name="rhyme-letters" value="@Model.PoemSection.RhymeLetters" size="50" />
                }
                <a role="button" onclick="computeSectionRhyme(@Model.PoemSection.Id, '#rhyme-letters')" class="pagebutton">محاسبه</a>
            </td>
        </tr>

        <tr>
            <td>
                <p>
                    <span class="red-color">شکستن قطعه: </span>اگر قطعه شامل بیش از یک قطعه شعر است و می‌بایست شکسته شود محل شکستن قطعه را علامت بزنید.
                </p>

            </td>
        </tr>

        @for (int v = 0; v < Model.Verses.Count; v++)
        {

            if (v > 1 && Model.Verses[v].VersePosition != RMuseum.Models.Ganjoor.VersePosition.Left)
            {
                <tr>
                    <td>
                        <span id="break-counter-@v">

                        </span>
                        @if (Model.MyLastEdit != null
                       &&
                       (
                       Model.MyLastEdit.BreakFromVerse1VOrder == Model.Verses[v].VOrder
                       ||
                       Model.MyLastEdit.BreakFromVerse2VOrder == Model.Verses[v].VOrder
                       ||
                       Model.MyLastEdit.BreakFromVerse3VOrder == Model.Verses[v].VOrder
                       ||
                       Model.MyLastEdit.BreakFromVerse4VOrder == Model.Verses[v].VOrder
                       ||
                       Model.MyLastEdit.BreakFromVerse5VOrder == Model.Verses[v].VOrder
                       ||
                       Model.MyLastEdit.BreakFromVerse6VOrder == Model.Verses[v].VOrder
                       ||
                       Model.MyLastEdit.BreakFromVerse7VOrder == Model.Verses[v].VOrder
                       ||
                       Model.MyLastEdit.BreakFromVerse8VOrder == Model.Verses[v].VOrder
                       ||
                       Model.MyLastEdit.BreakFromVerse9VOrder == Model.Verses[v].VOrder
                       ||
                       Model.MyLastEdit.BreakFromVerse10VOrder == Model.Verses[v].VOrder
                       )
                       )
                        {
                            <input type="checkbox" onclick="countSections(@Model.Verses.Count)" name="break-from-@v" id="break-from-@v" checked />
                        }
                        else
                        {
                            <input type="checkbox" onclick="countSections(@Model.Verses.Count)" name="break-from-@v" id="break-from-@v" />
                        }

                        @Model.Verses[v].Text
                    </td>
                </tr>
            }
            else
            {
                <tr>
                    <td>
                        @Model.Verses[v].Text
                    </td>
                </tr>
            }
        }


        <tr>
            <td>
                زبان فعلی:
            </td>
        </tr>

        <tr>
            <td>
                @RMuseum.Models.Ganjoor.GanjoorLanguage.LanguageNameFromCode(Model.Languages, Model.PoemSection.Language)
                <div id="language-old" class="hidden-recitation">@Model.PoemSection.Language</div>
            </td>
        </tr>

        <tr>
            <td>
                <label for="language">زبان:</label>
                <br />
                <select id="language">
                    @foreach (var lang in Model.Languages)
                    {
                        @if (Model.MyLastEdit != null && (Model.MyLastEdit.Language == lang.Code || (string.IsNullOrEmpty(Model.MyLastEdit.Language) && lang.Code == "fa-IR")))
                        {
                            <option value="@lang.Code" selected>@lang.Name</option>
                        }
                        else if (Model.PoemSection.Language == lang.Code)
                        {
                            <option value="@lang.Code" selected>@lang.Name</option>
                        }
                        else
                        {
                            <option value="@lang.Code">@lang.Name</option>
                        }
                    }
                </select>
            </td>
        </tr>
        @if(Model.CanEdit)
        {
            <tr>
                <td>
                    <a href="/User/Languages" role="button" class="pagebutton">زبان‌ها</a>
                </td>
            </tr>
        }
        
        <tr>
            <td>
                توضیح این ویرایش:
            </td>
        </tr>

        <tr>
            <td>
                @if (Model.MyLastEdit != null && !string.IsNullOrEmpty(Model.MyLastEdit.Note))
                {
                    <input type="text" id="note" name="note" value="@Model.MyLastEdit.Note" size="50" />
                }
                else
                {
                    <input type="text" id="note" name="note" value="" size="50" />
                }
            </td>
        </tr>

        <tr>
            <td>
                <a role="button" id="savecorrections" style="cursor:pointer;width:100%;color:white;background-color:green;display:block" onclick="saveSectionCorrection(@Model.PoemSection.Id, @Model.Verses.Count)">ذخیره</a>
            </td>
        </tr>

        <tr>
            <td><p id="saving">&nbsp;</p></td>
        </tr>

        @if (Model.Previous != null)
        {
            <tr>
                <td>
                    <a href="/User/Section?poemId=@Model.PageInformation.Id&index=@Model.Previous.Index" role="button" class="pagebutton">
                        قطعهٔ قبل
                    </a>
                </td>
            </tr>
        }
        @if (Model.Next != null)
        {
            <tr>
                <td>
                    <a href="/User/Section?poemId=@Model.PageInformation.Id&index=@Model.Next.Index" role="button" class="pagebutton">
                        قطعهٔ بعد
                    </a>
                </td>
            </tr>
        }

        @if (Model.CanEdit)
        {
            <tr>
                <td><a role="button" href="/Admin/SectionDel?poemId=@Model.PageInformation.Id&sectionIndex=@Model.PoemSection.Index" class="pagebutton">حذف قطعه</a></td>
            </tr>
        }
    </table>
}