settingsplus/render_form.php at main · volty98/settingsplus · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
<?php
    // $this を使ってメソッドを呼べる
    // form()でインクルードされるので完全に埋め込まれる

    // 管理画面フォームの HTML を生成
    $html_render = '<div class="alert alert-primary" role="alert">';
    $html_render .= $this->description();
    $html_render .= '</div>';

    $html_render .= '<h6 class="mt-4 mb-2 pb-2 border-bottom text-uppercase">' . 'Admin settings' . '</h6>';

    // サイトタイトル表示設定
    $html_render .= '<div class="form-group row">';
    $html_render .= '<label class="col-sm-4 col-form-label" for="displaySiteTitle">' . 'Display site title' . '</label>';
    $html_render .= '<div class="col-sm-8">';
    $html_render .= '<select class="custom-select" id="displaySiteTitle" name="displaySiteTitle">';
    $html_render .= '<option value="true" ' . ($this->getValue('displaySiteTitle') === true ? 'selected' : '') . '>Enabled</option>';
    $html_render .= '<option value="false" ' . ($this->getValue('displaySiteTitle') === false ? 'selected' : '') . '>Disabled</option>';
    $html_render .= '</select>';
    $html_render .= '<small class="form-text text-muted">' . 'Display the site title in the admin sidebar.' . '</small>';
    $html_render .= '</div>';
    $html_render .= '</div>';

    // コンテンツページ、各ページのカテゴリバッジ表示設定
    $html_render .= '<div class="form-group row">';
    $html_render .= '<label class="col-sm-4 col-form-label" for="displayContentCategoryName">' . 'Display content category name' . '</label>';
    $html_render .= '<div class="col-sm-8">';
    $html_render .= '<select class="custom-select" id="displayContentCategoryName" name="displayContentCategoryName">';
    $html_render .= '<option value="true" ' . ($this->getValue('displayContentCategoryName') === true ? 'selected' : '') . '>Enabled</option>';
    $html_render .= '<option value="false" ' . ($this->getValue('displayContentCategoryName') === false ? 'selected' : '') . '>Disabled</option>';
    $html_render .= '</select>';
    $html_render .= '<small class="form-text text-muted">' . 'Display the content category name in the content.' . '</small>';
    $html_render .= '</div>';
    $html_render .= '</div>';

    // adminのファビコンにサイトのファビコンを適用させる
    $html_render .= '<div class="form-group row">';
    $html_render .= '<label class="col-sm-4 col-form-label" for="enableFaviconAdmin">' . 'Favicon in the admin' . '</label>';
    $html_render .= '<div class="col-sm-8">';
    $html_render .= '<select class="custom-select" id="enableFaviconAdmin" name="enableFaviconAdmin">';
    $html_render .= '<option value="true" ' . ($this->getValue('enableFaviconAdmin') === true ? 'selected' : '') . '>Enabled</option>';
    $html_render .= '<option value="false" ' . ($this->getValue('enableFaviconAdmin') === false ? 'selected' : '') . '>Disabled</option>';
    $html_render .= '</select>';
    $html_render .= '<div class="container shadow-sm p-3 my-2 bg-white rounded item-align-center">';
    $html_render .= '<input id="faviconAdminFile" name="faviconAdminFile" type="file" accept="image/png" style="display:none;">';
    $html_render .= '<div>';
    $html_render .= '<img class="m-1 p-0" id="faviconAdminFilename" src="' . $this->getValue('faviconAdmin') . '" alt="Favicon" style="width:64px; height:64px;">';
    $html_render .= '<label for="faviconAdminFile" class="btn btn-sm btn-outline-secondary ml-3 align-baseline">Upload favicon</label>';
    $html_render .= '<small class="form-text text-muted">Need to clear cache after uploading a new favicon.</small>';
    $html_render .= '</div>';
    $html_render .= '</div>';
    $html_render .= '</div>';
    $html_render .= '</div>';

    // $html_render .= '<h6 class="mt-4 mb-2 pb-2 border-bottom text-uppercase">' . 'Admin & website settings' . '</h6>';

    // Font Awesome 使用設定
    $html_render .= '<div class="form-group row">';
    $html_render .= '<label class="col-sm-4 col-form-label">' . 'Use Font Awesome' . '</label>';
    $html_render .= '<div class="col-sm-8">';
    $html_render .= '<select class="custom-select mb-3" id="useFontAwesome" name="useFontAwesome">';
    $html_render .= '<option value="true" ' . ($this->getValue('useFontAwesome') === true ? 'selected' : '') . '>Enabled</option>';
    $html_render .= '<option value="false" ' . ($this->getValue('useFontAwesome') === false ? 'selected' : '') . '>Disabled</option>';
    $html_render .= '</select>';
    $html_render .= '<div class="input-group">';
    $html_render .= '<input type="text" class="form-control" name="awesomeURL" value="' . $this->getValue('awesomeURL') . '" placeholder="Font Awesome URL">';
    $html_render .= '</div>';
    $html_render .= '<small class="form-text text-muted">Specify the URL for the Font Awesome CSS file.</small>';
    $html_render .= '<hr>';
    $html_render .= '<div class="d-flex align-items-center">';
    $html_render .= '<span class="border p-1 mr-2 bg-light rounded"><i class="fa-regular fa-house fa-2x"></i></span>';
    $html_render .= '<p class="align-baseline m-0">' . 'When display house icon, it is successfully loaded.' . '</p>';
    $html_render .= '</div>';
    $html_render .= '</div>';
    $html_render .= '</div>';

    // メンテナンスモード設定
    $html_render .= '<div class="form-group row">';
    $html_render .= '<label class="col-sm-4 col-form-label" for="maintenanceMode">' . 'Maintenance mode' . '</label>';
    $html_render .= '<div class="col-sm-8">';
    $html_render .= '<select class="custom-select" id="maintenanceMode" name="maintenanceMode">';
    $html_render .= '<option value="true" ' . ($this->getValue('maintenanceMode') === true ? 'selected' : '') . '>On</option>';
    $html_render .= '<option value="false" ' . ($this->getValue('maintenanceMode') === false ? 'selected' : '') . '>Off</option>';
    $html_render .= '</select>';
    $html_render .= '<small class="form-text text-muted mb-3">' . 'Enable maintenance mode to temporarily take the site offline.' . '</small>';
    $html_render .= '<div class="input-group">';
    $html_render .= '<input type="text" class="form-control" name="maintenanceMessage" value="' . $this->getValue('maintenanceMessage') . '" placeholder="Maintenance message">';
    $html_render .= '</div>';
    $html_render .= '<small class="form-text text-muted">' . 'This message will be displayed when the site is in maintenance mode.' . '</small>';
    $html_render .= '</div>';
    $html_render .= '</div>';

    // ログインページ隠ぺい設定
    $html_render .= '<div class="form-group row">';
    $html_render .= '<label class="col-sm-4 col-form-label" for="hideLoginPage">' . 'Hide login page' . '</label>';
    $html_render .= '<div class="col-sm-8">';
    $html_render .= '<select class="custom-select" id="hideLoginPage" name="hideLoginPage">';
    $html_render .= '<option value="true" ' . ($this->getValue('hideLoginPage') === true ? 'selected' : '') . '>Enabled</option>';
    $html_render .= '<option value="false" ' . ($this->getValue('hideLoginPage') === false ? 'selected' : '') . '>Disabled</option>';
    $html_render .= '</select>';
    $html_render .= '<small class="form-text text-muted mb-3">' . 'When enabled, the login page requires a query.' . '</small>';

    $html_render .= '<div class="input-group mb-3 input-group-sm">';
    $html_render .= '<div class="input-group-prepend"><span class="input-group-text">' . 'Token' . '</span></div>';
    $html_render .= '<input type="text" class="form-control font-weight-bold" name="loginToken" value="' . $this->getValue('loginToken') . '"></input>';
    $html_render .= '<div class="input-group-append">';
    $html_render .= '<button type="button" id="generateToken" class="btn btn-outline-primary">' . 'Generate token' . '</button>';
    $html_render .= '</div>';
    $html_render .= '</div>';

    $html_render .= '<div class="input-group input-group-sm">';
    $html_render .= '<div class="input-group-prepend"><span class="input-group-text">' . 'Access URL' . '</span></div>';
    $html_render .= '<input type="text" class="form-control readonly font-weight-bold" id="generateTokenURL" value="' . DOMAIN_ADMIN . '?token=' . $this->getValue('loginToken') . '" readonly></input>';
    $html_render .= '</div>';
    $html_render .= '<small class="form-text text-info font-weight-bold mb-3">' . '[CAUTION] If you lose the token, you will not be able to access the login page.' . '</small>';

    $html_render .= '</div>';
    $html_render .= '</div>';

    // "Generate token" ボタンのクリックイベント
    $html_render .= '<script>';
    $html_render .= 'document.getElementById("generateToken").addEventListener("click", function() {';
    $html_render .= '  var token = Math.random().toString(36).substr(2);';
    $html_render .= '  document.querySelector("input[name=\'loginToken\']").value = token;';
    $html_render .= '  document.getElementById("generateTokenURL").value = "' . DOMAIN_ADMIN . '?token=" + token;';
    $html_render .= '});';
    $html_render .= '</script>';
    // "Access URL" を更新 name="loginToken" の値に応じて
    $html_render .= '<script>';
    $html_render .= 'document.querySelector("input[name=\'loginToken\']").addEventListener("input", function() {';
    $html_render .= '  var token = this.value;';
    $html_render .= '  document.getElementById("generateTokenURL").value = "' . DOMAIN_ADMIN . '?token=" + token;';
    $html_render .= '});';
    $html_render .= '</script>';

    // ファイル選択後に自動送信
    $html_render .= '<script>';
    $html_render .= 'document.getElementById("faviconAdminFile").addEventListener("change", function() {';
    $html_render .= '  var form = document.querySelector("form");';
    $html_render .= '  if (form) form.submit();';
    $html_render .= '});';
    $html_render .= '</script>';

    // フォーム全体に enctype を設定
    $html_render .= '<script>';
    $html_render .= 'document.addEventListener("DOMContentLoaded", function() {';
    $html_render .= '  var form = document.querySelector("form");';
    $html_render .= '  if (form) form.setAttribute("enctype", "multipart/form-data");';
    $html_render .= '});';
    $html_render .= '</script>';

    // クラス名 .plugin-form を削除
    // 強制的に適用される plugin-form クラスを削除してレイアウトを調整する
    // 代償として、プラグインフォームに適用されるスタイルが失われる可能性があるが、本家Generalの管理画面ににたレイアウトに近づけることができる。
    // したがってdiv class デザインはBLUDIT Adminで使えるものに絞って設計する
    $html_render .= '<script>';
    $html_render .= 'document.addEventListener("DOMContentLoaded", function() {';
    $html_render .= '  var form = document.querySelector("form.plugin-form");';
    $html_render .= '  if (form) {';
    $html_render .= '    form.classList.remove("plugin-form");';
    $html_render .= '    console.log("Plugin form class removed.");';
    $html_render .= '  }';
    $html_render .= '});';
    $html_render .= '</script>';

    // デバッグ要素として実際に保存された値を表示
    $html_render .= '<div id="accordion">
        <hr>
        <label><a data-toggle="collapse" href="#dbg">Actual saved value (debug)<i class="fa fa-chevron-down"></i></a></label>
        <div class="card-body card metric-card" style="display:block;">
        <div id="dbg" class="collapse">';
    $html_render .=
        '<h4>DB</h4><pre>' . var_export($this->db, true) . "(" . gettype($this->db) . ")" . "</pre>" .
        '<h4>layout</h4><pre>' . var_export($layout, true) . "(" . gettype($layout) . ")" . "</pre>";
    $html_render .='</div>
        </div>
        </div>';

?>