Languages selector

alplora/static/alplora/css/alplora.css

@@ -473,7 +473,31 @@ section h3.section-subheading {
 .ungleich-gallery-text-carousel .carousel-inner .item, .text-carousel .carousel-inner .item {
     padding: 0px 30px;
 }
+.nav-language .select-language{
+    padding: 15px 10px;
+    cursor: pointer;
+}
+.nav-language .select-language span{
+    margin-left: 5px;
+    margin-right: 5px;
 
+}
+.nav-language .drop-language{
+   position: absolute;
+    top: 50px;
+    left: 10px;
+    background: #fff;
+    width: 111px;
+    height: 60px;
+    padding: 10px 25px;
+    -webkit-box-shadow: -8px 13px 31px -8px rgba(77,77,77,1);
+    -moz-box-shadow: -8px 13px 31px -8px rgba(77,77,77,1);
+    box-shadow: -8px 13px 31px -8px rgba(77,77,77,1);
+    display: none;
+}
+.nav-language .drop-language a{
+   cursor: pointer;
+}
 
 @media only screen and (max-device-width: 480px) {
   .carousel-text {

alplora/static/alplora/js/main.js

@@ -16,6 +16,7 @@
 	$( document ).ready(function() {
 		init_nav();
 		initBackgroundsHeader();
+		init_hovers();
 	});
 	
 	//Infinite loop for change Background Header
@@ -45,4 +46,17 @@
     	
     }
 
+    function init_hovers(){
+    	$('.select-language').hover(function() {
+		    $('.drop-language').show();
+		  }, function() {
+		    $('.drop-language').hide();
+		})
+    	$('.drop-language').hover(function() {
+		    $('.drop-language').show();
+		  }, function() {
+		    $('.drop-language').hide();
+		})
+    }
+
 })(jQuery);

alplora/templates/alplora/index.html

@@ -87,6 +87,15 @@
         <!-- Collect the nav links, forms, and other content for toggling -->
         <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
             <ul class="nav navbar-nav navbar-right">
+                <li class="nav-language">
+                  <div class="select-language">
+                      <i class="fa fa-globe" aria-hidden="true"></i>
+                      <span>{{language_activate}}</span>
+                  </div>
+                  <div class="drop-language">
+                    <a class="nav-local" href="/{{list_language.code}}/alplora" >{{list_language.name}}</a>
+                  </div>
+                </li>
                 <li>
                     <a class="nav-local" href="javascript:void(0)" data-href="about">{% trans 'About' %}</a>
                 </li>

alplora/templates/alplora/login.html

@@ -83,6 +83,15 @@
         <!-- Collect the nav links, forms, and other content for toggling -->
         <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
             <ul class="nav navbar-nav navbar-right">
+                <li class="nav-language">
+                  <div class="select-language">
+                      <i class="fa fa-globe" aria-hidden="true"></i>
+                      <span>{{language_activate}}</span>
+                  </div>
+                  <div class="drop-language">
+                    <a class="nav-local" href="/{{list_language.code}}/alplora/login" >{{list_language.name}}</a>
+                  </div>
+                </li>
                 <li>
                     <a href="/alplora#about" data>About</a>
                 </li>

alplora/views.py

@@ -1,17 +1,42 @@
 from django.views.generic import TemplateView
-from django.utils.translation import get_language
+from django.utils.translation import get_language, get_language_info
 
 class IndexView(TemplateView):
 	template_name = "alplora/index.html"
 
 	def get_context_data(self, *args, **kwargs):
 		context = super(IndexView, self).get_context_data(**kwargs)
-    	language = get_language()
+		languages = getlanguages()
-    	context.update({
+		context.update(languages)
-    		'language': language
-    	})
 		return context
 
 
 class LoginView(TemplateView):
 	template_name = "alplora/login.html"
+
+	def get_context_data(self, *args, **kwargs):
+		context = super(LoginView, self).get_context_data(**kwargs)
+		languages = getlanguages()
+		context.update(languages)
+		return context
+
+
+def getlanguages():
+	language = get_language()
+	language_activate = get_language_info(language)
+	if language == 'de':
+		list_language = {
+			'name': 'English',
+			'code': 'en-us'
+		}
+	else:
+		list_language = {
+			'name': 'Deutsch',
+			'code': 'de'
+		}
+
+	return {
+		'language': language,
+		'list_language': list_language,
+		'language_activate': language_activate['name_local']
+	}