feat: Generic custom Oauth provider form
This commit is contained in:
Simon Trockel
parent
ec97e845a2
commit
8233881c44
|
|
@ -315,7 +315,7 @@ App::get('/v1/account/sessions/oauth2/callback/:provider/:projectId')
|
|||
->label('docs', false)
|
||||
->param('projectId', '', new Text(1024), 'Project ID.')
|
||||
->param('provider', '', new WhiteList(\array_keys(Config::getParam('providers')), true), 'OAuth2 provider.')
|
||||
->param('code', '', new Text(1024), 'OAuth2 code.')
|
||||
->param('code', '', new Text(2048), 'OAuth2 code.')
|
||||
->param('state', '', new Text(2048), 'Login state params.', true)
|
||||
->inject('request')
|
||||
->inject('response')
|
||||
|
|
|
|||
|
|
@ -478,8 +478,8 @@ $smtpEnabled = $this->getParam('smtpEnabled', false);
|
|||
<input name="secret" data-forms-show-secret id="oauth2<?php echo $this->escape(ucfirst($provider)); ?>Secret" type="password" autocomplete="off" data-ls-bind="{{console-project.provider<?php echo $this->escape(ucfirst($provider)); ?>Secret}}">
|
||||
<?php else: ?>
|
||||
<?php
|
||||
$form_view = new View(__DIR__.'/oauth/'.$this->escape($form));
|
||||
echo $form_view
|
||||
$form = new View(__DIR__.'/oauth/'.$this->escape($form));
|
||||
echo $form
|
||||
->setParam("provider", $provider)
|
||||
->render();
|
||||
?>
|
||||
|
|
|
|||
|
|
@ -9,4 +9,4 @@ $provider = $this->getParam('provider', '');
|
|||
<label for="oauth2<?php echo $this->escape(ucfirst($provider)); ?>TenantId">Target Tenant<span class="tooltip" data-tooltip="'common', 'organizations', 'consumers' or your TenantId"><i class="icon-info-circled"></i></span><a href="https://docs.microsoft.com/en-us/azure/active-directory/develop/active-directory-v2-protocols#endpoints">More info</a></label>
|
||||
<input name="appSecret" id="oauth2<?php echo $this->escape(ucfirst($provider)); ?>TenantId" type="text" autocomplete="off" placeholder="'common', 'organizations', 'consumers' or your TenantId" />
|
||||
<?php /*Hidden input for the final secret. Gets filled with a JSON via JS. */ ?>
|
||||
<input name="secret" data-forms-oauth-microsoft id="oauth2<?php echo $this->escape(ucfirst($provider)); ?>Secret" type="hidden" autocomplete="off" data-ls-bind="{{console-project.provider<?php echo $this->escape(ucfirst($provider)); ?>Secret}}" />
|
||||
<input name="secret" data-forms-oauth-custom="<?php echo $this->escape(ucfirst($provider)); ?>" id="oauth2<?php echo $this->escape(ucfirst($provider)); ?>Secret" type="hidden" autocomplete="off" data-ls-bind="{{console-project.provider<?php echo $this->escape(ucfirst($provider)); ?>Secret}}" />
|
||||
|
|
@ -58,7 +58,7 @@ const configApp = {
|
|||
'public/scripts/views/forms/move-up.js',
|
||||
'public/scripts/views/forms/nav.js',
|
||||
'public/scripts/views/forms/oauth-apple.js',
|
||||
'public/scripts/views/forms/oauth-microsoft.js',
|
||||
'public/scripts/views/forms/oauth-custom.js',
|
||||
'public/scripts/views/forms/password-meter.js',
|
||||
'public/scripts/views/forms/pell.js',
|
||||
'public/scripts/views/forms/required.js',
|
||||
|
|
|
|||
8
public/dist/scripts/app-all.js
vendored
8
public/dist/scripts/app-all.js
vendored
|
|
@ -3761,10 +3761,14 @@ console.log('old',minLink);minDistance=distance;minElement=title;minLink=links[i
|
|||
function sync(){if(!element.value){return;}
|
||||
let json={};try{json=JSON.parse(element.value);}catch(error){console.error('Failed to parse secret key');}
|
||||
teamID.value=json.teamID||'';keyID.value=json.keyID||'';p8.value=json.p8||'';}
|
||||
sync();}});})(window);(function(window){"use strict";window.ls.container.get("view").add({selector:"data-forms-oauth-microsoft",controller:function(element){let clientSecret=document.getElementById("oauth2MicrosoftClientSecret");let tenantId=document.getElementById("oauth2MicrosoftTenantId");element.addEventListener('change',sync);clientSecret.addEventListener('change',update);tenantId.addEventListener('change',update);function update(){let json={};json.clientSecret=clientSecret.value;json.tenantId=tenantId.value;element.value=JSON.stringify(json);}
|
||||
sync();}});})(window);(function(window){"use strict";window.ls.container.get("view").add({selector:"data-forms-oauth-custom",controller:function(element){let providers={"Microsoft":{"clientSecret":"oauth2MicrosoftClientSecret","tenantId":"oauth2MicrosoftTenantId"}}
|
||||
let provider=element.getAttribute("data-forms-oauth-custom");if(!provider||!providers.hasOwnProperty(provider)){console.error("Provider for custom form not set or unkown")}
|
||||
let config=providers[provider];element.addEventListener('change',sync);let elements={};for(const key in config){if(Object.hasOwnProperty.call(config,key)){elements[key]=document.getElementById(config[key]);elements[key].addEventListener('change',update);}}
|
||||
function update(){let json={};for(const key in elements){if(Object.hasOwnProperty.call(elements,key)){json[key]=elements[key].value}}
|
||||
element.value=JSON.stringify(json);}
|
||||
function sync(){if(!element.value){return;}
|
||||
let json={};try{json=JSON.parse(element.value);}catch(error){console.error('Failed to parse secret key');}
|
||||
clientSecret.value=json.clientSecret||'';tenantId.value=json.tenantId||'';}
|
||||
for(const key in elements){if(Object.hasOwnProperty.call(elements,key)){elements[key].value=json[key]||'';}}}
|
||||
sync();}});})(window);(function(window){"use strict";window.ls.container.get("view").add({selector:"data-forms-password-meter",controller:function(element,window){var calc=function(password){var score=0;if(!password)return score;var letters=new window.Object();for(var i=0;i<password.length;i++){letters[password[i]]=(letters[password[i]]||0)+1;score+=5.0/letters[password[i]];}
|
||||
var variations={digits:/\d/.test(password),lower:/[a-z]/.test(password),upper:/[A-Z]/.test(password),nonWords:/\W/.test(password)};var variationCount=0;for(var check in variations){if(variations.hasOwnProperty(check)){variationCount+=variations[check]===true?1:0;}}
|
||||
score+=(variationCount-1)*10;return parseInt(score);};var callback=function(){var score=calc(this.value);if(""===this.value)return(meter.className="password-meter");if(score>60)return(meter.className="password-meter strong");if(score>30)return(meter.className="password-meter medium");if(score>=0)return(meter.className="password-meter weak");};var meter=window.document.createElement("div");meter.className="password-meter";element.parentNode.insertBefore(meter,element.nextSibling);element.addEventListener("change",callback);element.addEventListener("keypress",callback);element.addEventListener("keyup",callback);element.addEventListener("keydown",callback);}});})(window);(function(window){"use strict";window.ls.container.get("view").add({selector:"data-forms-pell",controller:function(element,window,document,markdown,rtl){var div=document.createElement("div");element.className="pell hide";div.className="input pell";element.parentNode.insertBefore(div,element);element.tabIndex=-1;var turndownService=new TurndownService();turndownService.addRule("underline",{filter:["u"],replacement:function(content){return"__"+content+"__";}});var editor=window.pell.init({element:div,onChange:function onChange(html){alignText();element.value=turndownService.turndown(html);},defaultParagraphSeparator:"p",actions:[{name:"bold",icon:'<i class="icon-bold"></i>'},{name:"underline",icon:'<i class="icon-underline"></i>'},{name:"italic",icon:'<i class="icon-italic"></i>'},{name:"olist",icon:'<i class="icon-list-numbered"></i>'},{name:"ulist",icon:'<i class="icon-list-bullet"></i>'},{name:"link",icon:'<i class="icon-link"></i>'}]});var clean=function(e){e.stopPropagation();e.preventDefault();var clipboardData=e.clipboardData||window.clipboardData;console.log(clipboardData.getData("Text"));window.pell.exec("insertText",clipboardData.getData("Text"));return true;};var alignText=function(){let paragraphs=editor.content.querySelectorAll('p,li');let last='';for(let paragraph of paragraphs){var content=paragraph.textContent;if(content.trim()===''){content=last.textContent;}
|
||||
|
|
|
|||
8
public/dist/scripts/app.js
vendored
8
public/dist/scripts/app.js
vendored
|
|
@ -782,10 +782,14 @@ console.log('old',minLink);minDistance=distance;minElement=title;minLink=links[i
|
|||
function sync(){if(!element.value){return;}
|
||||
let json={};try{json=JSON.parse(element.value);}catch(error){console.error('Failed to parse secret key');}
|
||||
teamID.value=json.teamID||'';keyID.value=json.keyID||'';p8.value=json.p8||'';}
|
||||
sync();}});})(window);(function(window){"use strict";window.ls.container.get("view").add({selector:"data-forms-oauth-microsoft",controller:function(element){let clientSecret=document.getElementById("oauth2MicrosoftClientSecret");let tenantId=document.getElementById("oauth2MicrosoftTenantId");element.addEventListener('change',sync);clientSecret.addEventListener('change',update);tenantId.addEventListener('change',update);function update(){let json={};json.clientSecret=clientSecret.value;json.tenantId=tenantId.value;element.value=JSON.stringify(json);}
|
||||
sync();}});})(window);(function(window){"use strict";window.ls.container.get("view").add({selector:"data-forms-oauth-custom",controller:function(element){let providers={"Microsoft":{"clientSecret":"oauth2MicrosoftClientSecret","tenantId":"oauth2MicrosoftTenantId"}}
|
||||
let provider=element.getAttribute("data-forms-oauth-custom");if(!provider||!providers.hasOwnProperty(provider)){console.error("Provider for custom form not set or unkown")}
|
||||
let config=providers[provider];element.addEventListener('change',sync);let elements={};for(const key in config){if(Object.hasOwnProperty.call(config,key)){elements[key]=document.getElementById(config[key]);elements[key].addEventListener('change',update);}}
|
||||
function update(){let json={};for(const key in elements){if(Object.hasOwnProperty.call(elements,key)){json[key]=elements[key].value}}
|
||||
element.value=JSON.stringify(json);}
|
||||
function sync(){if(!element.value){return;}
|
||||
let json={};try{json=JSON.parse(element.value);}catch(error){console.error('Failed to parse secret key');}
|
||||
clientSecret.value=json.clientSecret||'';tenantId.value=json.tenantId||'';}
|
||||
for(const key in elements){if(Object.hasOwnProperty.call(elements,key)){elements[key].value=json[key]||'';}}}
|
||||
sync();}});})(window);(function(window){"use strict";window.ls.container.get("view").add({selector:"data-forms-password-meter",controller:function(element,window){var calc=function(password){var score=0;if(!password)return score;var letters=new window.Object();for(var i=0;i<password.length;i++){letters[password[i]]=(letters[password[i]]||0)+1;score+=5.0/letters[password[i]];}
|
||||
var variations={digits:/\d/.test(password),lower:/[a-z]/.test(password),upper:/[A-Z]/.test(password),nonWords:/\W/.test(password)};var variationCount=0;for(var check in variations){if(variations.hasOwnProperty(check)){variationCount+=variations[check]===true?1:0;}}
|
||||
score+=(variationCount-1)*10;return parseInt(score);};var callback=function(){var score=calc(this.value);if(""===this.value)return(meter.className="password-meter");if(score>60)return(meter.className="password-meter strong");if(score>30)return(meter.className="password-meter medium");if(score>=0)return(meter.className="password-meter weak");};var meter=window.document.createElement("div");meter.className="password-meter";element.parentNode.insertBefore(meter,element.nextSibling);element.addEventListener("change",callback);element.addEventListener("keypress",callback);element.addEventListener("keyup",callback);element.addEventListener("keydown",callback);}});})(window);(function(window){"use strict";window.ls.container.get("view").add({selector:"data-forms-pell",controller:function(element,window,document,markdown,rtl){var div=document.createElement("div");element.className="pell hide";div.className="input pell";element.parentNode.insertBefore(div,element);element.tabIndex=-1;var turndownService=new TurndownService();turndownService.addRule("underline",{filter:["u"],replacement:function(content){return"__"+content+"__";}});var editor=window.pell.init({element:div,onChange:function onChange(html){alignText();element.value=turndownService.turndown(html);},defaultParagraphSeparator:"p",actions:[{name:"bold",icon:'<i class="icon-bold"></i>'},{name:"underline",icon:'<i class="icon-underline"></i>'},{name:"italic",icon:'<i class="icon-italic"></i>'},{name:"olist",icon:'<i class="icon-list-numbered"></i>'},{name:"ulist",icon:'<i class="icon-list-bullet"></i>'},{name:"link",icon:'<i class="icon-link"></i>'}]});var clean=function(e){e.stopPropagation();e.preventDefault();var clipboardData=e.clipboardData||window.clipboardData;console.log(clipboardData.getData("Text"));window.pell.exec("insertText",clipboardData.getData("Text"));return true;};var alignText=function(){let paragraphs=editor.content.querySelectorAll('p,li');let last='';for(let paragraph of paragraphs){var content=paragraph.textContent;if(content.trim()===''){content=last.textContent;}
|
||||
|
|
|
|||
68
public/scripts/views/forms/oauth-custom.js
Normal file
68
public/scripts/views/forms/oauth-custom.js
Normal file
|
|
@ -0,0 +1,68 @@
|
|||
(function (window) {
|
||||
"use strict";
|
||||
|
||||
//TODO: Make this generic
|
||||
|
||||
window.ls.container.get("view").add({
|
||||
selector: "data-forms-oauth-custom",
|
||||
controller: function (element) {
|
||||
// provider configuration for custom forms. Keys will be property names in JSON, values the elementIDs for the according inputs
|
||||
let providers = {
|
||||
"Microsoft": {
|
||||
"clientSecret": "oauth2MicrosoftClientSecret",
|
||||
"tenantId": "oauth2MicrosoftTenantId"
|
||||
}
|
||||
}
|
||||
let provider = element.getAttribute("data-forms-oauth-custom");
|
||||
if (!provider || !providers.hasOwnProperty(provider)) { console.error("Provider for custom form not set or unkown") }
|
||||
let config = providers[provider];
|
||||
|
||||
// Add Change Listeners for element
|
||||
element.addEventListener('change', sync);
|
||||
|
||||
// Get all inputs by id and register change event listener
|
||||
let elements = {};
|
||||
for (const key in config) {
|
||||
if (Object.hasOwnProperty.call(config, key)) {
|
||||
elements[key] = document.getElementById(config[key]);
|
||||
elements[key].addEventListener('change', update);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Build the JSON based on input in custom input fields
|
||||
function update() {
|
||||
let json = {};
|
||||
for (const key in elements) {
|
||||
if (Object.hasOwnProperty.call(elements, key)) {
|
||||
json[key] = elements[key].value
|
||||
}
|
||||
}
|
||||
|
||||
element.value = JSON.stringify(json);
|
||||
}
|
||||
|
||||
// When the JSON changes (on load) change values in custom input fields
|
||||
function sync() {
|
||||
if (!element.value) {
|
||||
return;
|
||||
}
|
||||
|
||||
let json = {};
|
||||
|
||||
try {
|
||||
json = JSON.parse(element.value);
|
||||
} catch (error) {
|
||||
console.error('Failed to parse secret key');
|
||||
}
|
||||
|
||||
for (const key in elements) {
|
||||
if (Object.hasOwnProperty.call(elements, key)) {
|
||||
elements[key].value = json[key] || '';
|
||||
}
|
||||
}
|
||||
}
|
||||
sync();
|
||||
}
|
||||
});
|
||||
})(window);
|
||||
|
|
@ -1,50 +0,0 @@
|
|||
(function (window) {
|
||||
"use strict";
|
||||
|
||||
//TODO: Make this generic
|
||||
|
||||
window.ls.container.get("view").add({
|
||||
selector: "data-forms-oauth-microsoft",
|
||||
controller: function (element) {
|
||||
// element contains the final secret
|
||||
|
||||
// Get all custom input fields by their ID
|
||||
let clientSecret = document.getElementById("oauth2MicrosoftClientSecret");
|
||||
let tenantId = document.getElementById("oauth2MicrosoftTenantId");
|
||||
|
||||
// Add Change Listeners for element and all custom input fields
|
||||
|
||||
element.addEventListener('change', sync);
|
||||
clientSecret.addEventListener('change', update);
|
||||
tenantId.addEventListener('change', update);
|
||||
|
||||
// Build the JSON based on input in custom input fields
|
||||
function update() {
|
||||
let json = {};
|
||||
|
||||
json.clientSecret = clientSecret.value;
|
||||
json.tenantId = tenantId.value;
|
||||
|
||||
element.value = JSON.stringify(json);
|
||||
}
|
||||
|
||||
function sync() {
|
||||
if (!element.value) {
|
||||
return;
|
||||
}
|
||||
|
||||
let json = {};
|
||||
|
||||
try {
|
||||
json = JSON.parse(element.value);
|
||||
} catch (error) {
|
||||
console.error('Failed to parse secret key');
|
||||
}
|
||||
|
||||
clientSecret.value = json.clientSecret || '';
|
||||
tenantId.value = json.tenantId || '';
|
||||
}
|
||||
sync();
|
||||
}
|
||||
});
|
||||
})(window);
|
||||
Loading…
Reference in a new issue