@model atakanozbancom.Models.classes.AdminMyProjectsEditVM
@{
    ViewBag.Title = "Add New Project";
    Layout = "~/Views/Shared/_AdminLayout.cshtml";
}

<h2 class="text-white mt-3">Add New My Projects Post</h2>
@if (TempData["ok"] != null)
{<div class="alert alert-success">@TempData["ok"]</div>}
<br />

@using (Html.BeginForm("newmppost", "admin", FormMethod.Post,
                      new { enctype = "multipart/form-data" }))
{
    @Html.AntiForgeryToken()

    <div class="mb-3">
        @Html.LabelFor(p => p.TitleEN, new { @class = "text-white" })
        @Html.TextBoxFor(p => p.TitleEN, new { @class = "form-control bg-dark text-white" })
    </div>

    <div class="mb-3">
        @Html.LabelFor(p => p.DescEN, new { @class = "text-white" })
        @Html.TextAreaFor(p => p.DescEN, new { @class = "form-control bg-dark text-white" })
        <small class="text-muted">To add a link, use: [Link text](https://example.com)</small>
    </div>

    <h3 class="mt-3 text-white">Translation (TR)</h3>

    <div class="mb-3">
        @Html.LabelFor(p => p.TitleTR, new { @class = "text-white" })
        @Html.TextBoxFor(p => p.TitleTR, new { @class = "form-control bg-dark text-white" })
    </div>

    <div class="mb-3">
        @Html.LabelFor(p => p.DescTR, new { @class = "text-white" })
        @Html.TextAreaFor(p => p.DescTR, new { @class = "form-control bg-dark text-white" })
        <small class="text-muted">To add a link, use: [Link text](https://example.com)</small>
    </div>

    <button class="btn btn-success">Save</button>
}

<hr />
<h3 class="mt-3 text-white">Media Manager</h3>

@if (Model.medias != null && Model.medias.Count > 0)
{
    <div class="bg-dark p-3 rounded">
        @foreach (var m in Model.medias)
        {
            <div class="d-flex justify-content-between align-items-center mb-2">
                <div class="text-white">
                    <b>@m.media_type</b>
                    <span class="text-muted"> (order: @m.sort_order)</span>
                    <div style="word-break:break-all;">@m.url</div>
                    @*@if (!string.IsNullOrWhiteSpace(m.title))
                        {
                            <div class="text-muted">@m.title</div>
                        }*@
                </div>

                @using (Html.BeginForm("deletemedia", "admin", new { id = m.id, projectId = Model.id }, FormMethod.Post, new { onsubmit = "return confirm('Delete this media?');" }))
                {
                    @Html.AntiForgeryToken()
                    <button type="submit" class="btn btn-danger btn-sm">Delete</button>
                }
            </div>
            <hr class="text-muted" />
        }
    </div>
}
else
{
    <div class="text-muted">No media for this project.</div>
}

@using (Html.BeginForm("addmedia", "admin", FormMethod.Post, new { enctype = "multipart/form-data" }))
{
    @Html.AntiForgeryToken()
    <input type="hidden" name="projectId" value="@Model.id" />

    <div class="mb-2">
        <label class="text-white">Type</label>
        <select id="mediaType" name="mediaType" class="form-control bg-dark text-white">
            <option value="1">Image</option>
            <option value="2">Iframe</option>
            @*<option value="3">Video</option>*@
            @*<option value="4">Document</option>*@
        </select>
    </div>

    <!-- IFRAME URL -->
    <div id="urlWrap" class="mb-2" style="display:none;">
        <label class="text-white">URL</label>
        <input id="iframeUrl" name="iframeUrl" class="form-control bg-dark text-white" placeholder="https://..." />
        <small class="text-muted">Only for iframe embed links.</small>
    </div>

    <!-- FILE UPLOAD -->
    <div id="fileWrap" class="mb-2">
        <label class="text-white">Upload</label>
        <input id="mediaFile" type="file" name="mediaFile" class="form-control bg-dark text-white" />
        <button type="button" class="btn btn-outline-light btn-sm mt-2" onclick="PasteImageModal.open('#mediaFile')">
            <i class="fa-solid fa-paste me-1"></i>Paste image
        </button>
        <small class="text-muted d-block mt-1">Upload image/document files.</small>
    </div>

    <div class="mb-3">
        <label class="text-white">Sort Order</label>
        <input name="sortOrder" type="number" value="0" class="form-control bg-dark text-white" />
    </div>

    <button class="btn btn-primary">Add Media</button>
}

<script>(function () {
    var sel = document.getElementById("mediaType");
    var urlWrap = document.getElementById("urlWrap");
    var fileWrap = document.getElementById("fileWrap");
    var iframeUrl = document.getElementById("iframeUrl");
    var mediaFile = document.getElementById("mediaFile");

    function sync() {
        var isIframe = sel.value === "2"; // Iframe
        urlWrap.style.display = isIframe ? "block" : "none";
        fileWrap.style.display = isIframe ? "none" : "block";

        // optional: clear the hidden field so server doesn't get junk
        if (isIframe) {
            if (mediaFile) mediaFile.value = "";
        } else {
            if (iframeUrl) iframeUrl.value = "";
        }
    }

    sel.addEventListener("change", sync);
    sync();
})();
</script>