projects/fipamo
1
0
Fork 1
Code Issues 8 Pull requests Projects 1 Releases 23 Wiki Activity

added CORS handling, added external API access toggle to settings UI and updated front end script

Browse source
This commit is contained in:
Ro 2021-06-09 13:36:08 -07:00
parent 2f1f6678b7
commit 3df2720009
12 changed files with 246 additions and 80 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
brain/App.inc.php
View file

@ -19,11 +19,14 @@ include "../brain/utility/Sorting.inc.php";
include "../brain/utility/Setup.inc.php"; include "../brain/utility/Setup.inc.php";
include "../brain/utility/Maintenance.inc.php"; include "../brain/utility/Maintenance.inc.php";
include "../brain/utility/Mailer.inc.php"; include "../brain/utility/Mailer.inc.php";
include "../brain/utility/HandleCors.inc.php";
class App class App
{ {
public function __construct() public function __construct()
{ {
// set up cors
new HandleCors();
$app = AppFactory::create(); $app = AppFactory::create();
$twig = Twig::create("../brain/views/"); $twig = Twig::create("../brain/views/");
$app->add(TwigMiddleware::create($app, $twig)); $app->add(TwigMiddleware::create($app, $twig));

3
brain/controller/DashControl.inc.php
View file

@ -37,6 +37,9 @@ class DashControl
"lastBackup" => $updated->format("Y M D d"), "lastBackup" => $updated->format("Y M D d"),
"currentTheme" => $settings["global"]["theme"], "currentTheme" => $settings["global"]["theme"],
"themes" => $themes, "themes" => $themes,
"apiStatus" => isset($settings["global"]["externalAPI"])
? $settings["global"]["externalAPI"]
: "false",
"mailOption" => $settings["email"]["active"], "mailOption" => $settings["email"]["active"],
"mailConfig" => $settings["email"], "mailConfig" => $settings["email"],
"status" => Session::active(), "status" => Session::active(),

1
brain/data/Settings.inc.php
View file

@ -38,6 +38,7 @@ class Settings
$settings["global"]["private"] = $data["global"]["private"]; $settings["global"]["private"] = $data["global"]["private"];
$settings["global"]["renderOnSave"] = $data["global"]["renderOnSave"]; $settings["global"]["renderOnSave"] = $data["global"]["renderOnSave"];
$settings["global"]["theme"] = $data["global"]["theme"]; $settings["global"]["theme"] = $data["global"]["theme"];
$settings["global"]["externalAPI"] = $data["global"]["externalAPI"];
Member::updateData("handle", $data["member"]["handle"]); Member::updateData("handle", $data["member"]["handle"]);
Member::updateData("email", $data["member"]["email"]); Member::updateData("email", $data["member"]["email"]);

51
brain/utility/HandleCors.inc.php Normal file
View file

@ -0,0 +1,51 @@
<?php
class handleCors
{
public function __construct()
{
//check settings to see if external api access is allowed
$config = new Settings();
$settings = $config->getSettings();
if ($settings["global"]["externalAPI"]) {
//echo "API STATUS: " . $settings["global"]["externalAPI"];
if ($settings["global"]["externalAPI"] == "true") {
//echo "API ACCESS ACTIVE";
// checks to see if origin is set
if (isset($_SERVER["HTTP_ORIGIN"])) {
// You can decide if the origin in $_SERVER['HTTP_ORIGIN'] is something you want to allow, or as we do here, just allow all
header("Access-Control-Allow-Origin: {$_SERVER["HTTP_ORIGIN"]}");
} else {
//No HTTP_ORIGIN set, so we allow any. You can disallow if needed here
//never allow just any domain, so turn CORS off if no No HTTP_ORIGIN is set
//header("Access-Control-Allow-Origin: *");
}
header("Access-Control-Allow-Credentials: true");
header("Access-Control-Max-Age: 600"); // cache for 10 minutes
if ($_SERVER["REQUEST_METHOD"] == "OPTIONS") {
if (isset($_SERVER["HTTP_ACCESS_CONTROL_REQUEST_METHOD"])) {
header(
"Access-Control-Allow-Methods: POST, GET, OPTIONS, DELETE, PUT"
);
} //Make sure you remove those you do not want to support
if (isset($_SERVER["HTTP_ACCESS_CONTROL_REQUEST_HEADERS"])) {
header(
"Access-Control-Allow-Headers: {$_SERVER["HTTP_ACCESS_CONTROL_REQUEST_HEADERS"]}"
);
}
//Just exit with 200 OK with the above headers for OPTIONS method
exit(0);
}
} else {
//echo "API ACCESS ACTIVE";
}
} else {
//value doesn't exist, so whatevs
//echo "API ACCESS VALUE NOT PRESENT";
}
}
}

23
brain/views/dash/settings.twig
View file

@ -11,7 +11,7 @@
{% endblock %} {% endblock %}
{% block stylesheets %} {% block stylesheets %}
<link rel="stylesheet" type="text/css" href="/assets/css/dash.css?=dfdvcvb"> <link rel="stylesheet" type="text/css" href="/assets/css/dash.css?=adfdf">
{% endblock %} {% endblock %}
{% block mainContent %} {% block mainContent %}
@ -115,6 +115,27 @@
{{ include("dash/partials/mailforms.twig") }} {{ include("dash/partials/mailforms.twig") }}
{% endapply %} {% endapply %}
<button id="send-mail">TEST MAIL</button> <button id="send-mail">TEST MAIL</button>
<br /><br />
<label>API SETTINGS</label><br />
<div id="settings-api">
{% if apiStatus is defined and apiStatus == "true" %}
<button id="api-access-toggle" title="allow external api" data-enabled="true">
<svg id="api-access-toggle" class="icons">
<use id="api-access-toggle" xlink:href="/assets/images/global/sprite.svg#entypo-landline"/>
</svg>
</button>
<span id="api-status">EXTERNAL API ACCESS ENABLED</span>
{% else %}
<button id="api-access-toggle" title="allow external api" data-enabled="false">
<svg id="api-access-toggle" class="icons">
<use id="api-access-toggle" xlink:href="/assets/images/global/sprite.svg#entypo-landline"/>
</svg>
</button>
<span id="api-status">EXTERNAL API ACCESS NOT ENABLED</span>
{% endif %}
</div>
</div> </div>
</div> </div>

36
public/assets/css/dash.css
View file

@ -2585,6 +2585,42 @@ svg.icons {
display: none; display: none;
visibility: hidden; visibility: hidden;
} }
#settings-index #settings-index-wrapper #option-settings #mail-settings #settings-api {
background: #1D3040;
border-radius: 3px;
padding: 10px;
}
#settings-index #settings-index-wrapper #option-settings #mail-settings #settings-api span {
color: #EFEBE3 !important;
margin: -13px 0 0 5px;
position: relative;
vertical-align: middle;
display: inline-block;
font-weight: bold;
}
#settings-index #settings-index-wrapper #option-settings #mail-settings #settings-api button {
color: #EFEBE3;
border-radius: 3px;
width: 40px;
margin: 0;
}
#settings-index #settings-index-wrapper #option-settings #mail-settings #settings-api button svg {
width: 25px;
height: 20px;
fill: #EFEBE3;
}
#settings-index #settings-index-wrapper #option-settings #mail-settings #settings-api button[data-enabled=false] {
background: #b2cce5;
}
#settings-index #settings-index-wrapper #option-settings #mail-settings #settings-api button[data-enabled=false] svg {
fill: #1D3040;
}
#settings-index #settings-index-wrapper #option-settings #mail-settings #settings-api button[data-enabled=true] {
background: #fc6399;
}
#settings-index #settings-index-wrapper #option-settings #mail-settings #settings-api button[data-enabled=true] svg {
fill: #EFEBE3;
}
@media only screen and (max-width: 480px) { @media only screen and (max-width: 480px) {
#settings-actions { #settings-actions {

8
public/assets/scripts/dash.min.js vendored
View file

File diff suppressed because one or more lines are too long

1
public/index.php
View file

@ -1,4 +1,5 @@
<?php <?php
require "../vendor/autoload.php"; require "../vendor/autoload.php";
include "../brain/App.inc.php"; include "../brain/App.inc.php";
new App(); new App();

133
src/com/actions/SettingsActions.js
View file

@ -1,67 +1,72 @@
export default class SettingsActions { export default class SettingsActions {
//-------------------------- //--------------------------
// constructor // constructor
//-------------------------- //--------------------------
constructor() {} constructor() {}
//-------------------------- //--------------------------
// methods // methods
//-------------------------- //--------------------------
getInfo() { getInfo() {
let handle = document.getElementById('settings-handle').value; let handle = document.getElementById("settings-handle").value;
let email = document.getElementById('settings-email').value; let email = document.getElementById("settings-email").value;
let url = document.getElementById('settings-url').value; let url = document.getElementById("settings-url").value;
let title = document.getElementById('settings-title').value; let title = document.getElementById("settings-title").value;
let desc = document.getElementById('settings-desc').value; let desc = document.getElementById("settings-desc").value;
//let privacy = document.getElementById('privacy-toggle').getAttribute('data-private'); //let privacy = document.getElementById('privacy-toggle').getAttribute('data-private');
let render = document.getElementById('render-toggle').getAttribute('data-render'); let render = false; //document.getElementById("render-toggle").getAttribute("data-render");
let background = document.getElementById('background').src; let background = document.getElementById("background").src;
let selected = ''; let selected = "";
let selects = document.querySelectorAll('.theme-select'); let selects = document.querySelectorAll(".theme-select");
let smtpDomain = document.getElementById('smtp-domain').value; let smtpDomain = document.getElementById("smtp-domain").value;
let smtpEmail = document.getElementById('smtp-email').value; let smtpEmail = document.getElementById("smtp-email").value;
let smtpPass = document.getElementById('smtp-pass').value; let smtpPass = document.getElementById("smtp-pass").value;
let mgDomain = document.getElementById('mg-domain').value; let mgDomain = document.getElementById("mg-domain").value;
let mgKey = document.getElementById('mg-key').value; let mgKey = document.getElementById("mg-key").value;
let mailActive = ''; let mailActive = "";
let mailOptions = document.querySelectorAll('.mail-option'); let mailOptions = document.querySelectorAll(".mail-option");
var i, count; let apiStatus = document
for (i = 0, count = selects.length; i < count; i++) { .getElementById("api-access-toggle")
if (selects[i].getAttribute('data-enabled') == 'true') selected = selects[i].id; .getAttribute("data-enabled");
} var i, count;
for (i = 0, count = selects.length; i < count; i++) {
if (selects[i].getAttribute("data-enabled") == "true")
selected = selects[i].id;
}
for (i = 0, count = mailOptions.length; i < count; i++) { for (i = 0, count = mailOptions.length; i < count; i++) {
if (mailOptions[i].getAttribute('data-enabled') == 'true') if (mailOptions[i].getAttribute("data-enabled") == "true")
mailActive = mailOptions[i].id; mailActive = mailOptions[i].id;
} }
let settingsData = { let settingsData = {
global: { global: {
base_url: url, base_url: url,
title: title, title: title,
descriptions: desc, descriptions: desc,
background: background, background: background,
private: false, private: false,
renderOnSave: render, renderOnSave: render,
theme: selected theme: selected,
}, externalAPI: apiStatus
member: { handle: handle, email: email }, },
email: { member: { handle: handle, email: email },
active: mailActive, email: {
smtp: { active: mailActive,
domain: smtpDomain, smtp: {
email: smtpEmail, domain: smtpDomain,
password: smtpPass email: smtpEmail,
}, password: smtpPass
mailgun: { },
domain: mgDomain, mailgun: {
key: mgKey domain: mgDomain,
} key: mgKey
} }
}; }
return new Promise(function (resolve) { };
resolve(settingsData); return new Promise(function (resolve) {
}); resolve(settingsData);
} });
//-------------------------- }
// event handlers //--------------------------
//-------------------------- // event handlers
//--------------------------
} }

23
src/com/controllers/SettingsIndex.js
View file

@ -57,16 +57,21 @@ export default class SettingsIndex {
}, },
false false
); );
//handle api access toggle
var apiButton = document.getElementById("api-access-toggle");
var apiStatus = document.getElementById("api-status");
apiButton.addEventListener("click", (e) => {
e.stopPropagation();
e.preventDefault();
if (apiButton.getAttribute("data-enabled") == "false") {
apiButton.setAttribute("data-enabled", "true");
apiStatus.innerHTML = "EXTERNAL API ACCESS IS ENABLED";
} else {
apiButton.setAttribute("data-enabled", "false");
apiStatus.innerHTML = "EXTERNAL API ACCESS IS NOT ENABLED";
}
});
//handle privacy toggle
//document
//.getElementById('privacy-toggle')
//.addEventListener('click', e => this.togglePrivacy(e));
/*
document
.getElementById("render-toggle")
.addEventListener("click", (e) => this.toggleRender(e));
*/
document document
.getElementById("send-mail") .getElementById("send-mail")
.addEventListener("click", (e) => this.handleMailer(e)); .addEventListener("click", (e) => this.handleMailer(e));

15
src/libraries/FipamoAPI.js
View file

@ -27,7 +27,12 @@ export default class FipamoAPI {
//-------------------------- //--------------------------
// constructor // constructor
//-------------------------- //--------------------------
constructor() {} constructor(baseURL = null) {
this.baseURL = null;
if (baseURL) {
this.baseURL = baseURL;
}
}
//-------------------------- //--------------------------
// methods // methods
//-------------------------- //--------------------------
@ -36,7 +41,7 @@ export default class FipamoAPI {
login(data) { login(data) {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
this._request( this._request(
API_LOGIN, this.baseURL ? this.baseURL + API_LOGIN : API_LOGIN,
AUTH_STATUS, AUTH_STATUS,
REQUEST_TYPE_POST, REQUEST_TYPE_POST,
CONTENT_TYPE_JSON, CONTENT_TYPE_JSON,
@ -189,6 +194,12 @@ export default class FipamoAPI {
"Content-type", "Content-type",
"application/" + contentType "application/" + contentType
); );
/**
request.setRequestHeader(
"Access-Control-Allow-Origin",
self.baseURL
);
**/
request.send(JSON.stringify(requestData)); request.send(JSON.stringify(requestData));
break; break;
case CONTENT_TYPE_FORM: case CONTENT_TYPE_FORM:

29
src/styles/main/_settings.sass
View file

@ -189,6 +189,35 @@
div[data-enabled='false'] div[data-enabled='false']
display: none display: none
visibility: hidden visibility: hidden
#settings-api
background: $primary
border-radius: 3px
padding: 10px
span
color: $white !important
margin: -13px 0 0 5px
position: relative
vertical-align: middle
display: inline-block
font-weight: bold
button
color: $white
border-radius: 3px
width: 40px
margin: 0
svg
width: 25px
height: 20px
fill: $white
button[data-enabled='false']
background: $secondary
svg
fill: $primary
button[data-enabled='true']
background: $highlight
svg
fill: $white
// responsive // responsive
@media only screen and (max-width: 480px) @media only screen and (max-width: 480px)