=

arikaim-package.json

@@ -4,7 +4,7 @@
     "package-type": "template",
     "description": "Arikaim CMS Control Panel",
     "repository": "https://github.com/arikaim/system-template.git",
-    "version": "1.11.8",
+    "version": "1.11.9",
     "icon": "sliders horizontals",
     "image": {
         "src": "",

components/admin/modules/module/details/tabs/tabs.html

@@ -76,7 +76,7 @@
                     }) 
                 }}
             </div>
-            <div class="ui segment fluid">
+            <div class="mt-4">
                 <div class="ui stackable top attached tabular menu" id="module_details_tab">
                     <a class="item active" data-tab="drivers_tab">
                         <i class="icon blue code"></i>

components/admin/packages/store/login/login.html

@@ -0,0 +1,53 @@
+<div 
+    class="flex h-full mt-32 w-full justify-center">
+    <div
+        class="flex-shrink-0 w-74 h-64 self-center">
+        <div class="ui raised card fluid">   
+            <div class="content">
+                <h3 class="ui dividing header">
+                {{ title }}
+                </h3>
+                <form class="ui form" id="store_login_form" method="post">
+                    <div class="field">
+                        <label>{{ user_name.label }}</label>
+                        <div class="ui left icon input">
+                            <i class="icon user"></i>
+                            <input rule="empty" type="text" name="user_name" id="user_name" {{ user_name.placeholder|attr("placeholder") }}>    
+                        </div>
+                    </div>
+                    <div class="field">
+                        <label>{{ password.label }}</label>
+                        <div class="ui left icon right action input">
+                            <i class="icon lock"></i>
+                            <input rule="empty" type="password" name="password" id="password" {{ password.placeholder|attr("placeholder") }}>  
+                            <a class="ui icon basic link button view-password">               
+                                <i class="eye slash outline icon"></i>
+                            </a>    
+                        </div>
+                    </div>                  
+                    {{  component('semantic~form.footer',{ 
+                            button_title: buttons.login.title,                   
+                            button_class: 'button large primary fluid login-button'
+                        })
+                    }}                   
+                </form>
+            </div>    
+        </div>
+        <!-- 
+        <div class="ui two mini buttons">
+            <a 
+                target="_arikaim_store"
+                class="ui basic min button "
+                href="{{ store.getSignupUrl() }}">
+                {{ links.create }}
+            </a>
+            <a 
+                target="_arikaim_store"
+                class="ui basic min button"
+                href="{{ store.getResetPasswordUrl() }}">
+                {{ links.forgotten }}
+            </a>
+        </div>
+        -->
+    </div>       
+</div>

components/admin/packages/store/login/login.js

@@ -0,0 +1,24 @@
+'use strict';
+
+arikaim.component.onLoaded(function() {  
+    arikaim.ui.viewPasswordButton('.view-password','#password');
+    arikaim.ui.form.addRules("#store_login_form");
+
+    arikaim.ui.form.onSubmit('#store_login_form',function() {
+        arikaim.ui.form.disable('#store_login_form');
+        arikaim.ui.disableButton('.login-button');
+
+        return arikaimStore.login('#store_login_form',function(result) {   
+            arikaim.ui.form.disable('#store_login_form');     
+
+            arikaim.ui.loadComponent({
+                mountTo: 'tool_content',
+                component: 'system:admin.packages.store'
+            });
+
+        },function(error) {
+            arikaim.ui.form.enable('#store_login_form');
+            arikaim.ui.enableButton('.login-button');
+        });
+    });
+});

components/admin/packages/store/login/login.json

@@ -0,0 +1,20 @@
+{
+    "title": "Log in",
+    "buttons": {
+        "login": {
+            "title": "Log in"
+        }
+    },
+    "user_name":{
+        "label": "Username",
+        "placeholder": "Enter Username"            
+    },
+    "password":{
+        "placeholder": "Enter Password",
+        "label": "Password"
+    },
+    "links": {
+        "forgotten" :"Forgotten password",
+        "create": "Create Account"
+    }
+}

components/admin/packages/store/menu/menu.html

@@ -0,0 +1,17 @@
+{% set store = arikaimStore() %}
+<div class="ui vertical pointing fluid menu">
+{% if store.isLogged() == false %}
+    <div class="item">     
+        {{ items.login }}
+    </div>
+{% else %}
+    <a class="item store-packages" href="#">
+        <i class="box open icon"></i>
+        {{ items.packages }}
+    </a>
+    <a class="item store-logout" href="#">
+        <i class="sign out alternate icon"></i>
+        {{ items.logout }}
+    </a>
+{% endif %}
+</div>

components/admin/packages/store/menu/menu.js

@@ -0,0 +1,22 @@
+'use strict';
+
+arikaim.component.onLoaded(function() {  
+
+    arikaim.ui.button('.store-packages',function(button) {
+        return arikaimStore.logout(function(result) {           
+            arikaim.ui.loadComponent({
+                mountTo: 'store_packages',
+                component: 'system:admin.packages.store.view'
+            });
+        });
+    }); 
+
+    arikaim.ui.button('.store-logout',function(button) {
+        return arikaimStore.logout(function(result) {           
+            arikaim.ui.loadComponent({
+                mountTo: 'tool_content',
+                component: 'system:admin.packages.store'
+            });
+        });
+    }); 
+});

components/admin/packages/store/menu/menu.json

@@ -0,0 +1,6 @@
+{
+    "items": {
+        "logout": "Logout",
+        "packages": "My Packages"
+    }
+}