From 95112b1eb06a4be531ded59563d53a63a8d614e8 Mon Sep 17 00:00:00 2001
From: Minteck <nekostarfan@gmail.com>
Date: Sun, 8 Aug 2021 12:04:30 +0200
Subject: Opening!

---
 admin/panes/editor.php | 591 +++++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 591 insertions(+)
 create mode 100644 admin/panes/editor.php

(limited to 'admin/panes/editor.php')

diff --git a/admin/panes/editor.php b/admin/panes/editor.php
new file mode 100644
index 0000000..b337060
--- /dev/null
+++ b/admin/panes/editor.php
@@ -0,0 +1,591 @@
+<?php require_once $_SERVER['DOCUMENT_ROOT'] . "/admin/private/header.php";/** @var array $_DATA */
+
+if (isset($_GET['file']) && strpos($_GET['file'], "/") === false) {} else {
+    die();
+}
+
+if (isset($_GET['name']) && strpos($_GET['name'], "/") === false) {} else {
+    die();
+}
+
+if (isset($_GET['context']) && strpos($_GET['context'], "/") === false) {} else {
+    die();
+}
+
+if (isset($_GET['article']) && strpos($_GET['article'], "/") === false) {} else {
+    if (isset($_GET['article'])) {
+        die();
+    }
+}
+
+?>
+
+<style>
+    ::-webkit-scrollbar {
+        width: 5px;
+    }
+
+    ::-webkit-scrollbar-track {
+        border-radius: 9999px;
+        background: transparent;
+    }
+
+    ::-webkit-scrollbar-thumb {
+        border-radius: 9999px;
+        background-color: rgba(136, 136, 136, 0.5);
+        transition: background 200ms;
+    }
+
+    ::-webkit-scrollbar-thumb:hover {
+        background-color: rgba(85, 85, 85, 0.75);
+    }
+
+    ::-webkit-scrollbar-thumb:active {
+        background-color: #222;
+    }
+
+    .list-group-item {
+        background: #34373c;
+    }
+</style>
+
+<div class="container" style="color:white;padding-top:15vh;padding-bottom:15vh;">
+    <p style="text-align: center;"><a href="/admin/panes/<?= $_GET['context'] ?>.php">← Go back</a></p>
+    <h2 style="text-align:center;"><?= strip_tags($_GET['name']) ?></h2>
+
+    <h4 id="autosave-status" style="text-align:center;transition:opacity 200ms;">Saved as draft</h4>
+
+    <textarea name="content" id="editor"><?php
+
+        if ($_GET['file'] === "conduct.fr") {
+            if (file_exists($_SERVER['DOCUMENT_ROOT'] . "/includes/drafts/" . $_GET['file'] . ".html")) {
+                echo(file_get_contents($_SERVER['DOCUMENT_ROOT'] . "/includes/drafts/" . $_GET['file'] . ".html"));
+            } else {
+                echo(file_get_contents($_SERVER['DOCUMENT_ROOT'] . "/includes/code/fr.html"));
+            }
+        }
+
+        if ($_GET['file'] === "conduct.en") {
+            if (file_exists($_SERVER['DOCUMENT_ROOT'] . "/includes/drafts/" . $_GET['file'] . ".html")) {
+                echo(file_get_contents($_SERVER['DOCUMENT_ROOT'] . "/includes/drafts/" . $_GET['file'] . ".html"));
+            } else {
+                echo(file_get_contents($_SERVER['DOCUMENT_ROOT'] . "/includes/code/en.html"));
+            }
+        }
+
+        if ($_GET['file'] === "blog.en") {
+            if (file_exists($_SERVER['DOCUMENT_ROOT'] . "/includes/drafts/blog-{$_GET['article']}.json.html")) {
+                echo(file_get_contents($_SERVER['DOCUMENT_ROOT'] . "/includes/drafts/blog-{$_GET['article']}.json.html"));
+            } else {
+                echo(file_get_contents($_SERVER['DOCUMENT_ROOT'] . "/includes/blog/data/{$_GET['article']}.json.html"));
+            }
+        }
+
+        if ($_GET['file'] === "blog.fr") {
+            if (file_exists($_SERVER['DOCUMENT_ROOT'] . "/includes/drafts/blog-{$_GET['article']}.json.fr.html")) {
+                echo(file_get_contents($_SERVER['DOCUMENT_ROOT'] . "/includes/drafts/blog-{$_GET['article']}.json.fr.html"));
+            } else {
+                if (file_exists($_SERVER['DOCUMENT_ROOT'] . "/includes/blog/data/{$_GET['article']}.json.fr.html")) {
+                    echo(file_get_contents($_SERVER['DOCUMENT_ROOT'] . "/includes/blog/data/{$_GET['article']}.json.fr.html"));
+                } else {
+                    echo(file_get_contents($_SERVER['DOCUMENT_ROOT'] . "/includes/blog/data/{$_GET['article']}.json.html"));
+                }
+            }
+        }
+
+        ?></textarea>
+
+    <br>
+
+    <script src="/static/js/ckeditor.js"></script>
+    <script>
+        let colors = [{
+            color: 'hsl(0, 0%, 0%)',
+        },
+            {
+                color: 'hsl(0, 0%, 12.5%)',
+            },
+            {
+                color: 'hsl(0, 0%, 25%)',
+            },
+            {
+                color: 'hsl(0, 0%, 37.5%)',
+            },
+            {
+                color: 'hsl(0, 0%, 50%)',
+            },
+            {
+                color: 'hsl(0, 0%, 62.5%)',
+            },
+            {
+                color: 'hsl(0, 0%, 75%)',
+            },
+            {
+                color: 'hsl(0, 0%, 87.5%)',
+            },
+            {
+                color: 'hsl(0, 0%, 100%)',
+                hasBorder: true,
+            },
+            {
+                color: 'hsl(0, 100%, 10%)',
+            },
+            {
+                color: 'hsl(0, 100%, 12.5%)',
+            },
+            {
+                color: 'hsl(0, 100%, 25%)',
+            },
+            {
+                color: 'hsl(0, 100%, 37.5%)',
+            },
+            {
+                color: 'hsl(0, 100%, 50%)',
+            },
+            {
+                color: 'hsl(0, 100%, 62.5%)',
+            },
+            {
+                color: 'hsl(0, 100%, 75%)',
+            },
+            {
+                color: 'hsl(0, 100%, 87.5%)',
+            },
+            {
+                color: 'hsl(0, 100%, 90%)',
+                hasBorder: true,
+            },
+            {
+                color: 'hsl(30, 100%, 10%)',
+            },
+            {
+                color: 'hsl(30, 100%, 12.5%)',
+            },
+            {
+                color: 'hsl(30, 100%, 25%)',
+            },
+            {
+                color: 'hsl(30, 100%, 37.5%)',
+            },
+            {
+                color: 'hsl(30, 100%, 50%)',
+            },
+            {
+                color: 'hsl(30, 100%, 62.5%)',
+            },
+            {
+                color: 'hsl(30, 100%, 75%)',
+            },
+            {
+                color: 'hsl(30, 100%, 87.5%)',
+            },
+            {
+                color: 'hsl(30, 100%, 90%)',
+                hasBorder: true,
+            },
+            {
+                color: 'hsl(60, 100%, 10%)',
+            },
+            {
+                color: 'hsl(60, 100%, 12.5%)',
+            },
+            {
+                color: 'hsl(60, 100%, 25%)',
+            },
+            {
+                color: 'hsl(60, 100%, 37.5%)',
+            },
+            {
+                color: 'hsl(60, 100%, 50%)',
+            },
+            {
+                color: 'hsl(60, 100%, 62.5%)',
+            },
+            {
+                color: 'hsl(60, 100%, 75%)',
+            },
+            {
+                color: 'hsl(60, 100%, 87.5%)',
+            },
+            {
+                color: 'hsl(60, 100%, 90%)',
+                hasBorder: true,
+            },
+            {
+                color: 'hsl(90, 100%, 10%)',
+            },
+            {
+                color: 'hsl(90, 100%, 12.5%)',
+            },
+            {
+                color: 'hsl(90, 100%, 25%)',
+            },
+            {
+                color: 'hsl(90, 100%, 37.5%)',
+            },
+            {
+                color: 'hsl(90, 100%, 50%)',
+            },
+            {
+                color: 'hsl(90, 100%, 62.5%)',
+            },
+            {
+                color: 'hsl(90, 100%, 75%)',
+            },
+            {
+                color: 'hsl(90, 100%, 87.5%)',
+            },
+            {
+                color: 'hsl(90, 100%, 90%)',
+                hasBorder: true,
+            },
+            {
+                color: 'hsl(120, 100%, 10%)',
+            },
+            {
+                color: 'hsl(120, 100%, 12.5%)',
+            },
+            {
+                color: 'hsl(120, 100%, 25%)',
+            },
+            {
+                color: 'hsl(120, 100%, 37.5%)',
+            },
+            {
+                color: 'hsl(120, 100%, 50%)',
+            },
+            {
+                color: 'hsl(120, 100%, 62.5%)',
+            },
+            {
+                color: 'hsl(120, 100%, 75%)',
+            },
+            {
+                color: 'hsl(120, 100%, 87.5%)',
+            },
+            {
+                color: 'hsl(120, 100%, 90%)',
+                hasBorder: true,
+            },
+            {
+                color: 'hsl(150, 100%, 10%)',
+            },
+            {
+                color: 'hsl(150, 100%, 12.5%)',
+            },
+            {
+                color: 'hsl(150, 100%, 25%)',
+            },
+            {
+                color: 'hsl(150, 100%, 37.5%)',
+            },
+            {
+                color: 'hsl(150, 100%, 50%)',
+            },
+            {
+                color: 'hsl(150, 100%, 62.5%)',
+            },
+            {
+                color: 'hsl(150, 100%, 75%)',
+            },
+            {
+                color: 'hsl(150, 100%, 87.5%)',
+            },
+            {
+                color: 'hsl(150, 100%, 90%)',
+                hasBorder: true,
+            },
+            {
+                color: 'hsl(180, 100%, 10%)',
+            },
+            {
+                color: 'hsl(180, 100%, 12.5%)',
+            },
+            {
+                color: 'hsl(180, 100%, 25%)',
+            },
+            {
+                color: 'hsl(180, 100%, 37.5%)',
+            },
+            {
+                color: 'hsl(180, 100%, 50%)',
+            },
+            {
+                color: 'hsl(180, 100%, 62.5%)',
+            },
+            {
+                color: 'hsl(180, 100%, 75%)',
+            },
+            {
+                color: 'hsl(180, 100%, 87.5%)',
+            },
+            {
+                color: 'hsl(180, 100%, 90%)',
+                hasBorder: true,
+            },
+            {
+                color: 'hsl(210, 100%, 10%)',
+            },
+            {
+                color: 'hsl(210, 100%, 12.5%)',
+            },
+            {
+                color: 'hsl(210, 100%, 25%)',
+            },
+            {
+                color: 'hsl(210, 100%, 37.5%)',
+            },
+            {
+                color: 'hsl(210, 100%, 50%)',
+            },
+            {
+                color: 'hsl(210, 100%, 62.5%)',
+            },
+            {
+                color: 'hsl(210, 100%, 75%)',
+            },
+            {
+                color: 'hsl(210, 100%, 87.5%)',
+            },
+            {
+                color: 'hsl(210, 100%, 90%)',
+                hasBorder: true,
+            },
+            {
+                color: 'hsl(240, 100%, 10%)',
+            },
+            {
+                color: 'hsl(240, 100%, 12.5%)',
+            },
+            {
+                color: 'hsl(240, 100%, 25%)',
+            },
+            {
+                color: 'hsl(240, 100%, 37.5%)',
+            },
+            {
+                color: 'hsl(240, 100%, 50%)',
+            },
+            {
+                color: 'hsl(240, 100%, 62.5%)',
+            },
+            {
+                color: 'hsl(240, 100%, 75%)',
+            },
+            {
+                color: 'hsl(240, 100%, 87.5%)',
+            },
+            {
+                color: 'hsl(240, 100%, 90%)',
+                hasBorder: true,
+            },
+            {
+                color: 'hsl(270, 100%, 10%)',
+            },
+            {
+                color: 'hsl(270, 100%, 12.5%)',
+            },
+            {
+                color: 'hsl(270, 100%, 25%)',
+            },
+            {
+                color: 'hsl(270, 100%, 37.5%)',
+            },
+            {
+                color: 'hsl(270, 100%, 50%)',
+            },
+            {
+                color: 'hsl(270, 100%, 62.5%)',
+            },
+            {
+                color: 'hsl(270, 100%, 75%)',
+            },
+            {
+                color: 'hsl(270, 100%, 87.5%)',
+            },
+            {
+                color: 'hsl(270, 100%, 90%)',
+                hasBorder: true,
+            },
+            {
+                color: 'hsl(300, 100%, 10%)',
+            },
+            {
+                color: 'hsl(300, 100%, 12.5%)',
+            },
+            {
+                color: 'hsl(300, 100%, 25%)',
+            },
+            {
+                color: 'hsl(300, 100%, 37.5%)',
+            },
+            {
+                color: 'hsl(300, 100%, 50%)',
+            },
+            {
+                color: 'hsl(300, 100%, 62.5%)',
+            },
+            {
+                color: 'hsl(300, 100%, 75%)',
+            },
+            {
+                color: 'hsl(300, 100%, 87.5%)',
+            },
+            {
+                color: 'hsl(300, 100%, 90%)',
+                hasBorder: true,
+            },
+            {
+                color: 'hsl(330, 100%, 10%)',
+            },
+            {
+                color: 'hsl(330, 100%, 12.5%)',
+            },
+            {
+                color: 'hsl(330, 100%, 25%)',
+            },
+            {
+                color: 'hsl(330, 100%, 37.5%)',
+            },
+            {
+                color: 'hsl(330, 100%, 50%)',
+            },
+            {
+                color: 'hsl(330, 100%, 62.5%)',
+            },
+            {
+                color: 'hsl(330, 100%, 75%)',
+            },
+            {
+                color: 'hsl(330, 100%, 87.5%)',
+            },
+            {
+                color: 'hsl(330, 100%, 90%)',
+                hasBorder: true,
+            }];
+        let editor;
+        ClassicEditor
+            .create( document.querySelector( '#editor' ), {
+                toolbar: [
+                    'undo', 'redo', '|', 'removeFormat', '|', 'heading', '|', 'fontSize', 'fontColor', 'fontBackgroundColor', 'alignment', '|', 'bold', 'italic', 'underline', 'strikethrough', '|', 'subscript', 'superscript', '|', 'code', '|', 'outdent', 'indent', '|', 'bulletedList', 'numberedList', '|', 'link', 'imageUpload', 'mediaEmbed', 'blockQuote', 'insertTable', 'codeBlock', '|', 'horizontalLine'
+                ],
+                fontColor: {
+                    colors: colors,
+                    columns: 9
+                },
+                autosave: {
+                    save( editor ) {
+                        return saveData( editor.getData() );
+                    }
+                },
+            } )
+
+            .then( newEditor => {
+                editor = newEditor;
+            } )
+            .catch( error => {
+                console.error( error );
+            } );
+    </script>
+    <!--suppress JSUnresolvedVariable, JSUnresolvedFunction, JSUnfilteredForInLoop -->
+    <script>
+        function publish() {
+            $("html, body").animate({scrollTop: 0}, 100);
+            document.getElementById("autosave-status").style.opacity = "0";
+            setTimeout(() => {
+                document.getElementById("autosave-status").innerText = "Publishing...";
+                document.getElementById("autosave-status").style.opacity = "1";
+                setTimeout(() => {
+                    $.ajax("/admin/api/setlive.php", {
+                        dataType: 'text',
+                        type: 'post',
+                        contentType: 'application/x-www-form-urlencoded',
+                        data: {
+                            document: "<?= $_GET['file'] ?>",
+                            <?= isset($_GET['article']) ? "article: \"{$_GET['article']}\"" : "" ?>
+                        },
+                        success: (data) => {
+                            document.getElementById("autosave-status").style.opacity = "0";
+                            setTimeout(() => {
+                                document.getElementById("autosave-status").innerText = "Published";
+                                document.getElementById("autosave-status").style.opacity = "1";
+                            }, 200)
+                            document.getElementById("publish-btn").disabled = data.trim() === "false";
+                        },
+                        error: (e) => {
+                            console.error(e);
+                            document.getElementById("autosave-status").style.opacity = "0";
+                            setTimeout(() => {
+                                document.getElementById("autosave-status").innerText = "Unable to publish";
+                                document.getElementById("autosave-status").style.opacity = "1";
+                            }, 200)
+                            alert("An error prevents publishing the document. You may continue editing it but your changes may not be automatically saved on the server");
+                        }
+                    });
+                }, 200)
+            }, 200)
+        }
+
+        function saveData(data) {
+            document.getElementById("autosave-status").style.opacity = "0";
+            setTimeout(() => {
+                document.getElementById("autosave-status").innerText = "Saving...";
+                document.getElementById("autosave-status").style.opacity = "1";
+                setTimeout(() => {
+                    $.ajax("/admin/api/autosave.php", {
+                        dataType: 'text',
+                        type: 'post',
+                        contentType: 'application/x-www-form-urlencoded',
+                        data: {
+                            document: "<?= $_GET['file'] ?>",
+                            <?= isset($_GET['article']) ? "article: \"{$_GET['article']}\"," : "" ?>
+                            content: data
+                        },
+                        success: (data) => {
+                            $.ajax("/admin/api/draftvslive.php", {
+                                dataType: 'text',
+                                type: 'post',
+                                contentType: 'application/x-www-form-urlencoded',
+                                data: {
+                                    document: "<?= $_GET['file'] ?>",
+                                    <?= isset($_GET['article']) ? "article: \"{$_GET['article']}\"" : "" ?>
+                                },
+                                success: (data) => {
+                                    document.getElementById("autosave-status").style.opacity = "0";
+                                    setTimeout(() => {
+                                        document.getElementById("autosave-status").innerText = "Saved as draft";
+                                        document.getElementById("autosave-status").style.opacity = "1";
+                                    }, 200)
+                                    document.getElementById("publish-btn").disabled = data.trim() === "true";
+                                },
+                                error: (e) => {
+                                    console.error(e);
+                                    document.getElementById("autosave-status").style.opacity = "0";
+                                    setTimeout(() => {
+                                        document.getElementById("autosave-status").innerText = "Unable to save";
+                                        document.getElementById("autosave-status").style.opacity = "1";
+                                    }, 200)
+                                    alert("An error prevents saving the document. You may continue editing it but your changes won't be automatically saved on the server");
+                                }
+                            });
+                        },
+                        error: (e) => {
+                            console.error(e);
+                            document.getElementById("autosave-status").style.opacity = "0";
+                            setTimeout(() => {
+                                document.getElementById("autosave-status").innerText = "Unable to save";
+                                document.getElementById("autosave-status").style.opacity = "1";
+                            }, 200)
+                            alert("An error prevents saving the document. You may continue editing it but your changes won't be automatically saved on the server");
+                        }
+                    });
+                }, 200)
+            }, 200)
+        }
+    </script>
+
+    <link rel="stylesheet" href="/static/css/editor.css">
+    <p style="text-align: center;"><button id="publish-btn" onclick="publish();" class="btn btn-primary">Publish changes</button></p>
+</div>
+
+<?php require_once $_SERVER['DOCUMENT_ROOT'] . "/admin/private/footer.php"; ?>
\ No newline at end of file
-- 
cgit