diff --git a/edem-navigation.html b/edem-navigation.html
index 6867b2a..20646ce 100644
--- a/edem-navigation.html
+++ b/edem-navigation.html
@@ -20,10 +20,10 @@
diff --git a/static/edem-navigation/js/edem-navigation.js b/static/edem-navigation/js/edem-navigation.js
index 2feb1d2..fb51476 100644
--- a/static/edem-navigation/js/edem-navigation.js
+++ b/static/edem-navigation/js/edem-navigation.js
@@ -1,3 +1,20 @@
+function closeEdemSidebar() {
+ $('.JS-openSidebar').removeClass('-active');
+ $('body').removeClass('-sidebaropen');
+}
+
+function openEdemSidebar(option) {
+ var contentSelector = '.JS-' + option + 'Content';
+ var linkSelector = '.JS-openSidebar[data-sidebar-content="' + option + '"]';
+
+ $('body').addClass('-sidebaropen');
+ $('.JS-sidebarContent').removeClass('-show');
+ $('.JS-openSidebar').removeClass('-active');
+ $(linkSelector).addClass('-active');
+ $(contentSelector).addClass('-show');
+ resizeRecaptcha();
+}
+
function resizeRecaptcha() {
if (!$('.JS-signupContent').hasClass('JS-signupFinished')){ // Only run if signup is not completed
var accessWidth = $('.JS-signUpForm')[0].getBoundingClientRect().width; // Get value with decimals
@@ -38,49 +55,31 @@ function showSuccessSignupMessage() {
// Resize reCAPTCHA on window resize
$(window).resize(function(){
- resizeRecaptcha();
+ if ($('body').hasClass('-sidebaropen')) {
+ resizeRecaptcha();
+ }
});
-// eDemocracia open sidebar and its contents
+// Create and append to body an overlay div for when the sidebar is opened
+$('', {class: 'edem-overlay'}).appendTo('body');
+
+// Open sidebar via the topbar
$('.JS-openSidebar').click(function() {
if ($(this).hasClass('-active')) {
- $(this).removeClass('-active');
- $('body').removeClass('-sidebaropen');
-
+ closeEdemSidebar();
} else {
- $('body').addClass('-sidebaropen')
- $('.JS-sidebarContent').removeClass('-show');
- $('.JS-openSidebar').removeClass('-active');
- $(this).addClass('-active');
-
- if ($(this).hasClass('JS-showSignin')) {
- $('.JS-signinContent').addClass('-show');
-
- } else if ($(this).hasClass('JS-showSignup')) {
- $('.JS-signupContent').addClass('-show');
- resizeRecaptcha();
-
- } else if ($(this).hasClass('JS-showProfile')) {
- $('.JS-profileContent').addClass('-show');
- }
+ openEdemSidebar($(this).data('sidebarContent'));
}
});
// eDemocracia sidebar close button
$('.JS-closeSidebar').click(function(){
- $('.JS-openSidebar').removeClass('-active');
- $('body').removeClass('-sidebaropen');
+ closeEdemSidebar();
});
-// Close sidebar if click is outside of sidebar or topbar
-document.addEventListener('click', function(e) {
- var onEdemCore = $(e.target).closest('.edem-topbar, .edem-sidebar').length;
- var sidebarOpen = $('body').hasClass('-sidebaropen');
-
- if (!onEdemCore && sidebarOpen ) {
- $('.JS-openSidebar').removeClass('-active');
- $('body').removeClass('-sidebaropen');
- }
+// Close sidebar if click on the overlay
+$('.edem-overlay').click(function(){
+ closeEdemSidebar();
});
// Detect when input is filled
@@ -195,3 +194,11 @@ $('.JS-signUpForm').submit(function(event) {
});
}
});
+
+// XXX This should be exclusively on Audiencias Plugin whenever is possible
+if (location.href.match(/audiencias/)) {
+ $(document).on('click', 'a[href^="/home/?next="]', function(e){
+ e.preventDefault();
+ openEdemSidebar('signin');
+ });
+}
diff --git a/static/edem-navigation/scss/base/_unclassed.scss b/static/edem-navigation/scss/base/_unclassed.scss
index 7732ea0..98eff3b 100644
--- a/static/edem-navigation/scss/base/_unclassed.scss
+++ b/static/edem-navigation/scss/base/_unclassed.scss
@@ -3,18 +3,6 @@ body {
position: relative;
width: 100%;
transition: margin-left 0.3s $swift-out;
-
- &::after {
- content: '';
- position: fixed;
- opacity: 0;
- width: 0;
- height: 0;
- top: 0;
- background-color: $edem-color-primary;
- z-index: 100000;
- transition: opacity 0.3s ease, width 0s 0.3s, height 0s 0.3s;
- }
}
// TODO Remove this after getting rid of Foundation!!
diff --git a/static/edem-navigation/scss/components/_edem-overlay.scss b/static/edem-navigation/scss/components/_edem-overlay.scss
new file mode 100644
index 0000000..045ea18
--- /dev/null
+++ b/static/edem-navigation/scss/components/_edem-overlay.scss
@@ -0,0 +1,18 @@
+.edem-overlay {
+ position: fixed;
+ opacity: 0;
+ width: 0;
+ height: 0;
+ top: 0;
+ background-color: $edem-color-primary;
+ z-index: 100000;
+ transition: opacity 0.3s ease, width 0s 0.3s, height 0s 0.3s;
+
+ body.-sidebaropen & {
+ width: 100%;
+ height: 100vh;
+ opacity: 0.8;
+ cursor: pointer;
+ transition: opacity 0.3s 0s ease, width 0s 0s, height 0s 0s;
+ }
+}
\ No newline at end of file
diff --git a/static/edem-navigation/scss/components/_edem-sidebar.scss b/static/edem-navigation/scss/components/_edem-sidebar.scss
index 95cea46..aa4f108 100644
--- a/static/edem-navigation/scss/components/_edem-sidebar.scss
+++ b/static/edem-navigation/scss/components/_edem-sidebar.scss
@@ -154,11 +154,4 @@
body.-sidebaropen {
margin-left: calc(#{$edem-sidebar-width} * -1); // Calc to give the variable in negative value
overflow: hidden;
- &::after {
- width: 100%;
- height: 100vh;
- opacity: 0.8;
- cursor: pointer;
- transition: opacity 0.3s 0s ease, width 0s 0s, height 0s 0s;
- }
}
\ No newline at end of file
diff --git a/static/edem-navigation/scss/edem.scss b/static/edem-navigation/scss/edem.scss
index 80665d0..b043779 100644
--- a/static/edem-navigation/scss/edem.scss
+++ b/static/edem-navigation/scss/edem.scss
@@ -14,6 +14,7 @@
// Components
@import 'components/edem-topbar';
@import 'components/edem-sidebar';
+@import 'components/edem-overlay';
@import 'components/form-field';
@import 'components/edem-button';
@import 'components/edem-close-button';