diywzdh
/
edit.php

<?php
require 'header.php';

////////////////////////////////////////////////////////////////////////////////
/// 思路：
///
/// 是否输入了 pageID？
/// 如果否：
///     提示需要输入有效的 pageID
/// 如果是：
///     该 pageID 是否存在？
///     如果否：
///         提示该 pageID 尚未使用，无法编辑
///     如果是：
///         用户是否已经提交了表单？
///         如果否：
///             从 json 文件中读取数据，在 textarea 中显示出来
///         如果是：
///             用户输入的 pageID 与 safeKey 是否相匹配？
///             如果否：
///                 提示修改失败，因为 pageID 与 safeKey 不匹配
///             如果是：
///                 将 textarea 中的数据写入 json 文件中
///                 在 textarea 中显示修改后的数据
///                 提示修改成功
///

/* 判断是否输入了 pageID */

if (empty($_GET['pageID'])) {
    echo "需要传入有效的 pageID。";
    exit;
}


/* 判断该 pageID 是否存在 */

$pageID = $_GET['pageID'];

$jsonFileName = $datapath . "/siteid_" . $pageID . ".json";

if (!file_exists($jsonFileName)) {
    // 该 pageID 不存在
    echo '"' . $pageID . '" 这个 pageID 尚未使用，无法编辑。';
    exit;
} else {
    // 该 pageID 存在

    $pageData = $datapath . "/siteid_" . $pageID . ".json";

    if ( !isset($_POST['inputPageID']) && !isset($_POST['inputSafeKey']) ){
        // 用户尚未提交表单
        // 将相应的 json 文件中的数据显示在 textarea 中

        $websitesDataString = file_get_contents($pageData);

    } else {
        // 用户已经提交表单
        // 将 textarea 中的数据写入 json 文件中

        // 判断用户输入的 pageID 与 safeKey 是否相匹配
        // 如果否：
        //      提示修改失败，因为 pageID 与 safeKey 不匹配
        // 如果是：
        //      将 textarea 中的数据写入 json 文件中
        //      将修改后的数据在 textarea 中显示出来
        //      提示修改成功

        // 再次判断输入的 pageID 是否存在
        $pageID = $_POST['inputPageID'];
        $jsonFileName = $datapath . "/siteid_" . $pageID . ".json";
        if (!file_exists($jsonFileName)) {

            // 输入的 pageID 不存在
            exit('"' . $pageID . '" 这个 pageID 暂时还没有人使用，无法编辑。');

        } else {
            // 输入的 pageID 存在

            // 将 textarea 中的数据写入相应的 json 文件中
            $str = $_POST['websitesData'];
            file_put_contents($pageData, $str);

            $url = "view.php?pageID=" . $pageID;
            header('Refresh:1,Url=' . $url);
            echo "修改成功。页面跳转中……";
            exit;
        }

    }

}

//$str = utf8_encode($str);
//$jsondata = json_encode($str);

?>

<!doctype html>
<html>
<head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="resources/bootstrap-4.3.1-dist/css/bootstrap.min.css">

    <title>编辑</title>
</head>
<body>

<!-- ----------------------------------------------------------------------- -->

<!--顶部导航栏-->
<!--参考资料：https://bootstrapcreative.com/pattern/navbar-centered-logo-links-left-right/-->
<nav class="navbar navbar-dark bg-dark">
    <div class="navbar-nav">
        <li class="nav-item">
            <a id="backToView" class="nav-link" href="view.php?pageID=<?php echo $pageID ?>">< 返回查看</a>
        </li>
    </div>
</nav>
<!--顶部导航栏-->


<!-- ----------------------------------------------------------------------- -->

<div class="container-fluid mt-2">

    <form method="post" action="">

        <div class="input-group input-group-sm mb-2">
            <div class="input-group-prepend">
                <span class="input-group-text" id="inputGroup-sizing-sm">导航页ID</span>
            </div>
            <input
                    id="inputPageID"
                    name="inputPageID"
                    type="text"
                    class="form-control"
                    required
                    readonly
            >
        </div>

        <div class="form-group mb-2">
            <textarea
                    id="websitesData"
                    name="websitesData"
                    autofocus
                    class="form-control"
                    rows="15"
                    placeholder="网址 json 数据"
                    required></textarea>
        </div>
        <div>
            <button id="btnSubmit" type="submit" class="btn btn-sm btn-outline-primary">保存修改</button>
            <button type="button" id="btnReset" class="btn btn-sm btn-outline-secondary">重置</button>
        </div>
    </form>

</div>
<br />

<!-- ----------------------------------------------------------------------- -->

<!--导入用到的 javascript 库-->
<script src="resources/jquery-3.4.0/jquery-3.4.0.min.js"></script>
<script src="resources/bootstrap-4.3.1-dist/js/bootstrap.min.js"></script>

<!-- ----------------------------------------------------------------------- -->

<script type="text/javascript">

    var jsonStr = '<?php echo base64_encode($websitesDataString); ?>';
    // 解决 atob() 解码中文乱码的问题
    // 参考：https://www.jianshu.com/p/04ab0f0e86de
    jsonStr = decodeURIComponent(escape(window.atob(jsonStr)));
    $('#websitesData').val(jsonStr);

    document.getElementById('inputPageID').value = "<?php echo $pageID; ?>";

</script>

<!-- ----------------------------------------------------------------------- -->
<script>
    var formEdited = false;
    // 监听用户是进行了输入操作
    $('#inputPageID, #inputSafeKey, #websitesData').keydown(function () {
        formEdited = true;
    });

    // 页面刷新或关闭前弹窗警告
    $(window).on('beforeunload', function(){
        if (formEdited == true) {
            return "Are you sure you want to leave?";
        }
    });

    // 点击按钮提交表单刷新页面时不弹窗警告
    $('#btnSubmit').click(function () {
        $(window).off('beforeunload');
    });

</script>

<!-- ----------------------------------------------------------------------- -->

<script type="text/javascript">

    // 重置指定输入框的值
    function resetInput(id) {
        $('#' + id).val(function() {
            return this.defaultValue;
        });
    }

    // 点击重置按钮时执行的动作
    $('#btnReset').click(function () {
        // 重置文本框中的数据
        resetInput('websitesData');
        // 文本框重新获得焦点
        // $('#websitesData').focus();
    });

</script>

<!-- ----------------------------------------------------------------------- -->
<script>
    // 判断 json 数据语法是否正确
    // 参考资料：https://www.geeksforgeeks.org/javascript-check-if-a-string-is-a-valid-json-string/
    function testJSON(text) {
        if (typeof text !== "string") {
            return false;
        }
        try {
            JSON.parse(text);
            return true;
        } catch (error) {
            return false;
        }
    }

    $(document).ready(function(){
        $("form").submit(function(e){
            var jsonstr = $("#websitesData").val();
            if (!testJSON(jsonstr)) {
                e.preventDefault();
                alert("您输入的 json 数据语法有误，请先纠正。");
            }
        });
    });
</script>
<!-- ----------------------------------------------------------------------- -->

<script type="text/javascript">

    // 编辑时按下 tab 键，缩进4个空格
    // 参考：https://stackoverflow.com/questions/5743916/how-to-add-autoindent-to-html-textarea
    $("#websitesData").keydown(function(e)
    {
        if (e.which == 9) //ASCII tab
        {
            e.preventDefault();
            var start = this.selectionStart;
            var end = this.selectionEnd;
            var v = $(this).val();

            if (start == end)
            {
                $(this).val(v.slice(0, start) + "    " + v.slice(start));
                this.selectionStart = start+4;
                this.selectionEnd = start+4;
                return;
            }

            var selectedLines = [];
            var inSelection = false;
            var lineNumber = 0;

            for (var i = 0; i < v.length; i++)
            {
                if (i == start)
                {
                    inSelection = true;
                    selectedLines.push(lineNumber);
                }
                if (i >= end)
                    inSelection = false;

                if (v[i] == "\n")
                {
                    lineNumber++;
                    if (inSelection)
                        selectedLines.push(lineNumber);
                }
            }
            var lines = v.split("\n");
            for (var i = 0; i < selectedLines.length; i++)
            {
                lines[selectedLines[i]] = "    " + lines[selectedLines[i]];
            }

            $(this).val(lines.join("\n"));
        }
    });
</script>

<!------------------------------------------------------------------------- -->

<script>
    // // 编辑时按下回车键，自动缩进
    // $("#websitesData").keypress(function(e)
    // {
    //     if (e.which == 13) // ASCII newline
    //     {
    //         setTimeout(function(that)
    //         {
    //             var start = that.selectionStart;
    //             var v = $(that).val();
    //             var thisLine = "";
    //             var indentation = 0;
    //             for (var i = start-2; i >= 0 && v[i] != "\n"; i--)
    //             {
    //                 thisLine = v[i] + thisLine;
    //             }
    //             for (var i = 0; i < thisLine.length && thisLine[i] == " "; i++)
    //             {
    //
    //                 indentation++;
    //             }
    //             $(that).val(v.slice(0, start) + " ".repeat(indentation) + v.slice(start));
    //             that.selectionStart = start+indentation;
    //             that.selectionEnd = start+indentation;
    //         }, 0.01, this);
    //     }
    // });

</script>

<!-- ----------------------------------------------------------------------- -->

<?php
    echo $analysisCode;
?>

<!-- -------------------------------------------------------------------- -->

    </body>
</html>