Startseite Erkunden Hilfe
Anmelden
sv1313
/
AgularJSBooks
Beobachten 1
Favorit hinzufügen 0
Fork 0
Dateien Issues 0 Pull-Requests 0 Wiki
Quellcode durchsuchen

directive

vlad vor 6 Jahren
Ursprung
e73ef8220c
Commit
72c74f4da0
8 geänderte Dateien mit 52 neuen und 3 gelöschten Zeilen
Geteilte Ansicht Diff-Statistik anzeigen
  1. BIN
      app/directive/lang-swicher/img/en.png
  2. BIN
      app/directive/lang-swicher/img/ru.png
  3. 1 0
      app/directive/lang-swicher/lang-swicher.css
  4. 34 0
      app/directive/lang-swicher/lang-swicher.directive.js
  5. 11 0
      app/directive/lang-swicher/lang-swicher.template.html
  6. 1 1
      app/views/footer.template.html
  7. 1 1
      app/views/header.template.html
  8. 4 1
      index.html

BIN
app/directive/lang-swicher/img/en.png
Datei anzeigen


BIN
app/directive/lang-swicher/img/ru.png
Datei anzeigen


Datei-Diff unterdrückt, da er zu groß ist
+ 1 - 0
app/directive/lang-swicher/lang-swicher.css


+ 34 - 0
app/directive/lang-swicher/lang-swicher.directive.js
Datei anzeigen 

@@ -0,0 +1,34 @@
 
+(function(){
 
+    'use strict';
 
+    app.directive('langSwitcher', langSwitcher);
 
+    function langSwitcher(){
 
+        return {
 
+            restrict: 'E',
 
+            templateUrl: './app/directive/lang-swicher/lang-swicher.template.html',
 
+            scope: {},
 
+            controller: ['$scope', '$translate', function($scope, $translate){
 
+                $scope.languages = [
 
+                    {key: 'en', value: 'English'},
 
+                    {key: 'ru', value: 'Russian'}
 
+                ];
 
+                $scope.showMenu = false;
 
+                $scope.toggleMenu = function(){
 
+                    $scope.showMenu = !$scope.showMenu
 
+                }
 
+                var key = localStorage.getItem('preferredLanguage') || 'en'
 
+                $scope.currentLang = $scope.languages.filter(function(item){
 
+                    return item.key === key;
 
+                })[0];
 
+                $scope.changeLanguage = function(key){
 
+                    $scope.currentLang = $scope.languages.filter(function(item){
 
+                        return item.key === key;
 
+                    })[0];
 
+                    $scope.showMenu = false;
 
+                    $translate.use(key)
 
+                    localStorage.setItem('preferredLanguage', key);
 
+                }
 
+            }]
 
+
 
+        }
 
+    }
 
+})()

+ 11 - 0
app/directive/lang-swicher/lang-swicher.template.html
Datei anzeigen 

@@ -0,0 +1,11 @@
 
+<div class="lang-switcher">
 
+    <button ng-click="toggleMenu()">
 
+            <img ng-src="./app/directive/lang-swicher/img/{{currentLang.key}}.png" alt="fuck">
 
+    </button>
 
+    
+    <ul  class="switcher-menu" ng-class="{'shown': showMenu}">
 
+        <li ng-repeat="lang in languages" ng-click="changeLanguage(lang.key)">
 
+            <img ng-src="./app/directive/lang-swicher/img/{{lang.key}}.png" alt="{{lang.value}}">
 
+        </li>
 
+    </ul>
 
+</div>

+ 1 - 1
app/views/footer.template.html
Datei anzeigen 

@@ -1,5 +1,5 @@
 
 <footer class="navbar-default navbar-fixed-bottom p-t-5 p-b-40">

     <div class="container">

-    	footer

+            <lang-switcher></lang-switcher>

     </div>

 </footer>

+ 1 - 1
app/views/header.template.html
Datei anzeigen 

@@ -14,7 +14,7 @@
 
                  <a href="#/login">Authorization</a>

                </li>

                <li class="p-t-5">

-                   <button class="btn" ng-click="langSwitch()">Language</button>

+                    <lang-switcher></lang-switcher>

                </li>

             </ul>

         </div>

+ 4 - 1
index.html
Datei anzeigen 

@@ -5,7 +5,8 @@
 
 	<title>Angular JS</title>
 
 	<link rel="stylesheet" href="node_modules/@cgross/angular-notify/dist/angular-notify.css"></link>
 
   <link rel="stylesheet" href="node_modules/bootstrap/dist/css/bootstrap.min.css" />
 
-  <link rel="stylesheet" href="css/style.css">
 
+	<link rel="stylesheet" href="css/style.css">
 
+	<link rel="stylesheet" href="./app/directive/lang-swicher/lang-swicher.css">
 
 </head>
 
 	<body ng-controller="Main">
 
 	  <div class="container">	  
@@ -36,5 +37,7 @@
 
 		<script src="app/modals/confirm/confirm.controller.js"></script>
 
 	  <script src="app/services/account.factory.js"></script>
 
 		
+
 
+		<script src="app/directive/lang-swicher/lang-swicher.directive.js"></script>
 
 	</body>
 
 </html>