mirror of
https://github.com/YunoHost/SSOwat.git
synced 2024-09-03 20:06:27 +02:00
Simplify ynhpanel.js and ynhpanel.css making the YNH inapp panel an iframe that loads the info.html page.
This commit is contained in:
chateau
Alexandre Aubin
parent
5bd4de4bfa
commit
94e15d9fe6
7 changed files with 110 additions and 704 deletions
|
|
@ -550,6 +550,7 @@ function get_data_for(view)
|
|||
local mails = get_mails(user)
|
||||
data = {
|
||||
connected = true,
|
||||
theme = conf.theme,
|
||||
portal_url = conf.portal_url,
|
||||
uid = user,
|
||||
cn = cache:get(user.."-cn"),
|
||||
|
|
@ -682,7 +683,7 @@ function edit_user()
|
|||
|
||||
-- Open the LDAP connection
|
||||
local ldap = lualdap.open_simple(conf["ldap_host"], dn, args.currentpassword)
|
||||
|
||||
|
||||
local password = hash_password(args.newpassword)
|
||||
|
||||
-- Modify the LDAP information
|
||||
|
|
@ -909,7 +910,7 @@ function login()
|
|||
local uri_args = ngx.req.get_uri_args()
|
||||
|
||||
args.user = string.lower(args.user)
|
||||
|
||||
|
||||
local user = authenticate(args.user, args.password)
|
||||
if user then
|
||||
ngx.status = ngx.HTTP_CREATED
|
||||
|
|
|
|||
|
|
@ -127,38 +127,6 @@ img {
|
|||
.ynh-wrapper:after {clear: both;}
|
||||
|
||||
|
||||
|
||||
/* Logo */
|
||||
.logo {
|
||||
text-align: center;
|
||||
margin-bottom: 0;
|
||||
opacity: 0.7;
|
||||
}
|
||||
|
||||
.logo img {
|
||||
margin-top: 4%;
|
||||
width: 4em;
|
||||
}
|
||||
|
||||
.logged .logo {
|
||||
position: fixed;
|
||||
bottom: 20px;
|
||||
right: 20px;
|
||||
z-index: 0;
|
||||
opacity: 0.7;
|
||||
}
|
||||
.logged .logo img {
|
||||
margin-top: 0;
|
||||
width: 2.5em;
|
||||
padding: 0.3em;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
.ynh-panel-active .logo {
|
||||
display: none;
|
||||
}
|
||||
|
||||
|
||||
/* messages */
|
||||
.messages {
|
||||
color: #FFF;
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
|
|
@ -1,3 +1,36 @@
|
|||
|
||||
// scripts loader
|
||||
function loadScript(url, callback) {
|
||||
var script = document.createElement('script');
|
||||
script.type = 'text/javascript';
|
||||
script.src = url;
|
||||
// There are several events for cross browser compatibility.
|
||||
script.onreadystatechange = callback;
|
||||
script.onload = callback;
|
||||
// Fire the loading
|
||||
document.head.appendChild(script);
|
||||
}
|
||||
|
||||
// handle app links so they work both in plain info page and in the info iframe called from ynhpanel.js
|
||||
function appClick (evnt, url) {
|
||||
|
||||
// if asked to open in new tab
|
||||
if (
|
||||
evnt.ctrlKey ||
|
||||
evnt.shiftKey ||
|
||||
evnt.metaKey ||
|
||||
(evnt.button && evnt.button == 1)
|
||||
) return
|
||||
|
||||
// if asked in current tab
|
||||
else {
|
||||
evnt.preventDefault();
|
||||
parent.location.href= url;
|
||||
return false;
|
||||
};
|
||||
|
||||
}
|
||||
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
|
||||
// Variables
|
||||
|
|
@ -35,4 +68,20 @@ document.addEventListener('DOMContentLoaded', function() {
|
|||
addMaildrop.parentNode.insertBefore(inputDropClone, addMaildrop);
|
||||
});
|
||||
|
||||
|
||||
// Get user's infos
|
||||
var r = new XMLHttpRequest();
|
||||
r.open("GET", "/ynhpanel.json", true);
|
||||
r.onreadystatechange = function () {
|
||||
// Die if error
|
||||
if (r.readyState != 4 || r.status != 200) return;
|
||||
// Response is JSON
|
||||
response = JSON.parse(r.responseText);
|
||||
|
||||
// load additional theme's script
|
||||
loadScript("/yunohost/sso/assets/themes/"+ response.theme +"/js/ynhpanel.js");
|
||||
|
||||
};
|
||||
r.send();
|
||||
|
||||
});
|
||||
|
|
|
|||
|
|
@ -204,6 +204,16 @@ function domReady(cb) {
|
|||
: cb();
|
||||
}
|
||||
|
||||
function loadScript(url, callback) {
|
||||
var script = document.createElement('script');
|
||||
script.type = 'text/javascript';
|
||||
script.src = url;
|
||||
// There are several events for cross browser compatibility.
|
||||
script.onreadystatechange = callback;
|
||||
script.onload = callback;
|
||||
// Fire the loading
|
||||
document.head.appendChild(script);
|
||||
}
|
||||
|
||||
/* ----------------------------------------------------------
|
||||
Main
|
||||
|
|
@ -223,12 +233,6 @@ domReady(function(){
|
|||
meta_viewport = document.querySelector('meta[name="viewport"]');
|
||||
meta_viewport_content = meta_viewport.getAttribute('content');
|
||||
|
||||
// Add portal stylesheet
|
||||
var portalStyle = document.createElement("link");
|
||||
portalStyle.setAttribute("rel", "stylesheet");
|
||||
portalStyle.setAttribute("type", "text/css");
|
||||
portalStyle.setAttribute("href", '/ynhpanel.css');
|
||||
document.getElementsByTagName("head")[0].insertBefore(portalStyle, null);
|
||||
|
||||
// Create portal link
|
||||
var portal = document.createElement('a');
|
||||
|
|
@ -242,14 +246,13 @@ domReady(function(){
|
|||
|
||||
|
||||
// Create overlay element
|
||||
var overlay = document.createElement("div");
|
||||
var overlay = document.createElement('iframe');
|
||||
overlay.src = "/yunohost/sso/info.html";
|
||||
overlay.setAttribute("id","ynh-overlay");
|
||||
overlay.setAttribute("style","display:none");
|
||||
overlay.setAttribute("style","opacity:0"); // make sure the overlay is invisible already when loading it
|
||||
|
||||
document.body.insertBefore(overlay, null);
|
||||
|
||||
//Color Application
|
||||
var colors = ['redbg','purpledarkbg','darkbluebg','orangebg','greenbg','darkbluebg','purpledarkbg','yellowbg','lightpinkbg','pinkbg','turquoisebg','yellowbg','lightbluebg','purpledarkbg', 'bluebg'];
|
||||
|
||||
// Get user's app
|
||||
var r = new XMLHttpRequest();
|
||||
|
|
@ -261,39 +264,6 @@ domReady(function(){
|
|||
// Response is JSON
|
||||
response = JSON.parse(r.responseText);
|
||||
|
||||
// Add overlay header
|
||||
overlay.innerHTML += '<div id="ynh-user" class="ynh-wrapper info">' +
|
||||
'<ul class="ul-reset user-menu"><li><a class="icon icon-connexion disableAjax" href="'+ response.portal_url +'?action=logout">'+response.t_logout+'</a></li></ul>'+
|
||||
'<a class="user-container user-container-info disableAjax" href="'+ response.portal_url +'edit.html">' +
|
||||
'<h2 class="user-username">'+ response.uid +'</h2>' +
|
||||
'<small class="user-fullname">'+ response.givenName + ' ' + response.sn +'</small>' +
|
||||
'<span class="user-mail">'+ response.mail +'</span>' +
|
||||
'</a>' +
|
||||
'</div>';
|
||||
|
||||
|
||||
// Add application links
|
||||
var links = [];
|
||||
Array.prototype.forEach.call(response.app, function(app, n){
|
||||
randomColorNumber = parseInt(app.name, 36) % colors.length;
|
||||
links.push('<li><a class="'+colors[randomColorNumber]+' disableAjax" href="//'+app.url+'"><span class="first-letter" data-first-letter="'+ app.name.substr(0,2) +'"></span><span class="name">'+app.name+'</span></a></li>');
|
||||
});
|
||||
overlay.innerHTML += '<div id="ynh-apps" class="ynh-wrapper apps"><ul class="listing-apps">'+ links.join("\n") +'</ul></div>';
|
||||
|
||||
// Add footer links
|
||||
overlay.innerHTML += '<div id="ynh-footer" class="ynh-wrapper footer"><nav>' + "\n" +
|
||||
'<a class="link-profile-edit" href="/yunohost/sso/edit.html">'+ response.t_footerlink_edit +'</a>' + "\n" +
|
||||
'<a class="link-documentation" href="//yunohost.org/docs" target="_blank">'+ response.t_footerlink_documentation +'</a>' + "\n" +
|
||||
'<a class="link-documentation" href="//yunohost.org/support" target="_blank">'+ response.t_footerlink_support +'</a>' + "\n" +
|
||||
'<a class="link-admin" href="/yunohost/admin/" target="_blank">'+ response.t_footerlink_administration +'</a>' + "\n" +
|
||||
'</nav></div>';
|
||||
|
||||
// Add overlay to DOM
|
||||
var btn = document.getElementById('logo'),
|
||||
yunoverlay = document.getElementById('ynh-overlay'),
|
||||
user = document.getElementById('ynh-user'),
|
||||
apps = document.getElementById('ynh-apps');
|
||||
|
||||
var pfx = ["webkit", "moz", "MS", "o", ""];
|
||||
function PrefixedEvent(element, type, callback) {
|
||||
for (var p = 0; p < pfx.length; p++) {
|
||||
|
|
@ -302,28 +272,44 @@ domReady(function(){
|
|||
}
|
||||
}
|
||||
|
||||
|
||||
// Load all stylesheets after getting config
|
||||
|
||||
// Add portal stylesheet
|
||||
var portalStyle = document.createElement("link");
|
||||
portalStyle.setAttribute("rel", "stylesheet");
|
||||
portalStyle.setAttribute("type", "text/css");
|
||||
portalStyle.setAttribute("href", '/ynhpanel.css');
|
||||
document.getElementsByTagName("head")[0].insertBefore(portalStyle, null);
|
||||
|
||||
// Custom style from theme
|
||||
if (response.theme) {
|
||||
var portalThemeStyle = document.createElement("link");
|
||||
portalThemeStyle.setAttribute("rel", "stylesheet");
|
||||
portalThemeStyle.setAttribute("type", "text/css");
|
||||
portalThemeStyle.setAttribute("href", '/yunohost/sso/assets/themes/'+ response.theme +'/css/ynhpanel.css');
|
||||
document.getElementsByTagName("head")[0].insertBefore(portalThemeStyle, null);
|
||||
};
|
||||
|
||||
|
||||
// Bind YNH Button
|
||||
window.addEvent(portal, 'click', function(e){
|
||||
// Prevent default click
|
||||
window.eventPreventDefault(e);
|
||||
// Toggle overlay on YNHPortal button
|
||||
//Element.toggleClass(overlay, 'visible');
|
||||
// Toggle overlay on YNHPortal button click
|
||||
Element.toggleClass(overlay, 'visible');
|
||||
Element.toggleClass(portal, 'visible');
|
||||
Element.toggleClass(document.querySelector('html'), 'ynh-panel-active');
|
||||
Element.toggleClass(overlay, 'ynh-active');
|
||||
|
||||
|
||||
if(yunoverlay.classList.contains('ynh-active')) {
|
||||
if(overlay.classList.contains('ynh-active')) {
|
||||
meta_viewport.setAttribute('content', meta_viewport_content);
|
||||
yunoverlay.classList.add('ynh-fadeOut');
|
||||
PrefixedEvent(yunoverlay, "AnimationEnd", function(){
|
||||
if(yunoverlay.classList.contains('ynh-fadeOut')) {
|
||||
yunoverlay.classList.remove('ynh-active');
|
||||
}
|
||||
});
|
||||
Element.addClass(overlay, 'ynh-fadeIn');
|
||||
Element.removeClass(overlay, 'ynh-fadeOut');
|
||||
}else {
|
||||
meta_viewport.setAttribute('content', "width=device-width");
|
||||
yunoverlay.classList.remove('ynh-fadeOut');
|
||||
yunoverlay.classList.add('ynh-active');
|
||||
Element.removeClass(overlay, 'ynh-fadeIn');
|
||||
Element.addClass(overlay, 'ynh-fadeOut');
|
||||
}
|
||||
});
|
||||
|
||||
|
|
|
|||
|
|
@ -13,6 +13,9 @@
|
|||
|
||||
<!-- Stylesheets -->
|
||||
<link rel="stylesheet" href="assets/css/ynh-style.css">
|
||||
{{#theme}}
|
||||
<link rel="stylesheet" href="assets/themes/{{theme}}/css/ynh-style.css">
|
||||
{{/theme}}
|
||||
|
||||
<!-- Icons -->
|
||||
<link rel="shortcut icon" href="assets/icons/favicon.ico">
|
||||
|
|
@ -34,10 +37,6 @@
|
|||
</head>
|
||||
<body class="{{#connected}}logged{{/connected}}">
|
||||
|
||||
<h1 id="logo" class="logo">
|
||||
<img src="assets/img/logo-ynh-white.svg"/><span class="element-invisible">Yunohost</span>
|
||||
</h1>
|
||||
|
||||
<div class="overlay">
|
||||
{{#flash_win}}
|
||||
<div class="wrapper messages success">{{.}}</div>
|
||||
|
|
@ -50,4 +49,3 @@
|
|||
{{#flash_info}}
|
||||
<div class="wrapper messages info">{{.}}</div>
|
||||
{{/flash_info}}
|
||||
|
||||
|
|
|
|||
|
|
@ -14,7 +14,7 @@
|
|||
<div id="apps" class="wrapper apps">
|
||||
<ul class="listing-apps">
|
||||
{{#app}}
|
||||
<li><a href="https://{{url}}"><span class="first-letter"></span><span class="name">{{name}}</span></a></li>
|
||||
<li><a class="app_logo" href="https://{{url}}" onclick="appClick(event, 'https://{{url}}')"><span class="first-letter"></span><span class="name">{{name}}</span></a></li>
|
||||
{{/app}}
|
||||
</ul>
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue