FEATURE: style menu

This commit adds some markup to sidebars in admin.

app/MenuPresenters/FoundationDrilldownMenuPresenter.php

@@ -0,0 +1,77 @@
+<?php
+namespace App\MenuPresenters;
+
+use Pingpong\Menus\MenuItem;
+use Pingpong\Menus\Presenters\Presenter;
+
+class FoundationDrilldownMenuPresenter extends Presenter
+{
+    /**
+     * {@inheritdoc }
+     */
+    public function getOpenTagWrapper()
+    {
+        return PHP_EOL . '<ul class="vertical menu" data-drilldown>' . PHP_EOL;
+    }
+
+    /**
+     * {@inheritdoc }
+     */
+    public function getCloseTagWrapper()
+    {
+        return PHP_EOL . '</ul>' . PHP_EOL;
+    }
+
+    /**
+     * {@inheritdoc }
+     */
+    public function getMenuWithoutDropdownWrapper($item)
+    {
+        return '<li' . $this->getActiveState($item) . '><a href="' . $item->getUrl() . '">' . $item->getIcon() . ' ' . $item->title . '</a></li>' . PHP_EOL;
+    }
+
+    /**
+     * {@inheritdoc }
+     */
+    public function getActiveState(MenuItem $item)
+    {
+        $active = ' class="active"';
+
+        if (empty($item->getChilds())) {
+            // for direct menu input return if page is active
+            return \Request::is($item->getRequest()) ? $active : null;
+        } else {
+            // on nested menu inputs loop over children and in case any of them is active, mark active also root level
+            foreach ($item->getChilds() as $child) {
+                if ($this->getActiveState($child)) {
+                    return $active;
+                }
+            }
+        }
+
+        return null;
+    }
+
+    /**
+     * {@inheritdoc }
+     */
+    public function getDividerWrapper()
+    {
+        return '<li class="divider"></li>' . PHP_EOL;
+    }
+
+    /**
+     * {@inheritdoc }
+     */
+    public function getMenuWithDropDownWrapper($item)
+    {
+        $active = $this->getActiveState($item);
+
+        return '<li>
+                <a ' . $active . ' href="#">' . $item->getIcon() . ' ' . $item->title . '</a>
+                <ul class="vertical menu">
+                  ' . $this->getChildMenuItems($item) . '
+                </ul>
+              </li>' . PHP_EOL;;
+    }
+}

app/MenuPresenters/FoundationDropdownMenuPresenter.php

@@ -0,0 +1,61 @@
+<?php
+namespace App\MenuPresenters;
+
+use Pingpong\Menus\Presenters\Presenter;
+
+class FoundationDropdownMenuPresenter extends Presenter
+{
+    /**
+     * {@inheritdoc }
+     */
+    public function getOpenTagWrapper()
+    {
+        return PHP_EOL . '<ul class="vertical dropdown menu" data-dropdown-menu>' . PHP_EOL;
+    }
+
+    /**
+     * {@inheritdoc }
+     */
+    public function getCloseTagWrapper()
+    {
+        return PHP_EOL . '</ul>' . PHP_EOL;
+    }
+
+    /**
+     * {@inheritdoc }
+     */
+    public function getMenuWithoutDropdownWrapper($item)
+    {
+        $link = '<a href="' . $item->getUrl() . '">' . $item->getIcon() . ' ' . $item->title . '</a>';
+        return '<li' . $this->getActiveState($item) . '>' . $link . '</li>'.PHP_EOL;
+    }
+
+    /**
+     * {@inheritdoc }
+     */
+    public function getActiveState($item)
+    {
+        return \Request::is($item->getRequest()) || $item->hasActiveOnChild ? ' class="active"' : null;
+    }
+
+    /**
+     * {@inheritdoc }
+     */
+    public function getDividerWrapper()
+    {
+        return '<li class="divider"></li>'.PHP_EOL;
+    }
+
+    /**
+     * {@inheritdoc }
+     */
+    public function getMenuWithDropDownWrapper($item)
+    {
+        return '<li>
+                <a href="#">' . $item->getIcon() . ' ' . $item->title . '</a>
+                <ul class="vertical menu">
+                  ' . $this->getChildMenuItems($item) . '
+                </ul>
+              </li>' . PHP_EOL;;
+    }
+}

app/MenuPresenters/FoundationInitializedDropdownMenuPresenter.php

@@ -0,0 +1,10 @@
+<?php
+namespace App\MenuPresenters;
+
+class FoundationInitializedDropdownMenuPresenter extends FoundationDropdownMenuPresenter
+{
+    public function getOpenTagWrapper()
+    {
+        return PHP_EOL . '<ul class="menu">' . PHP_EOL;
+    }
+}

app/MenuPresenters/FoundationMenuPresenter.php

@@ -1,63 +0,0 @@
-<?php
-namespace App\MenuPresenters;
-
-use Pingpong\Menus\Presenters\Presenter;
-
-class FoundationMenuPresenter extends Presenter
-{
-    /**
-     * {@inheritdoc }
-     */
-    public function getOpenTagWrapper()
-    {
-        return  PHP_EOL . '<ul class="vertical menu-bar icon-left">' . PHP_EOL;
-    }
-
-    /**
-     * {@inheritdoc }
-     */
-    public function getCloseTagWrapper()
-    {
-        return  PHP_EOL . '</ul>' . PHP_EOL;
-    }
-
-    /**
-     * {@inheritdoc }
-     */
-    public function getMenuWithoutDropdownWrapper($item)
-    {
-        return '<li'.$this->getActiveState($item).'><a href="'. $item->getUrl() .'">'.$item->getIcon().' '.$item->title.'</a></li>';
-    }
-
-    /**
-     * {@inheritdoc }
-     */
-    public function getActiveState($item)
-    {
-        return \Request::is($item->getRequest()) ? ' class="active"' : null;
-    }
-
-    /**
-     * {@inheritdoc }
-     */
-    public function getDividerWrapper()
-    {
-        return '<li class="divider"></li>';
-    }
-
-    /**
-     * {@inheritdoc }
-     */
-    public function getMenuWithDropDownWrapper($item)
-    {
-        return '<li class="has-dropdown">
-                <a href="#">
-                 '.$item->getIcon().' '.$item->title.'
-                </a>
-                <ul class="dropdown">
-                  '.$this->getChildMenuItems($item).'
-                </ul>
-              </li>' . PHP_EOL;
-        ;
-    }
-}

app/Models/User.php

@@ -3,7 +3,6 @@
 namespace App\Models;
 
 use Illuminate\Auth\Authenticatable;
-use Illuminate\Auth\Passwords\CanResetPassword;
 use Illuminate\Contracts\Auth\Authenticatable as AuthenticableInterface;
 use Illuminate\Database\Eloquent\Model;
 use Illuminate\Foundation\Auth\Access\Authorizable;
@@ -14,7 +13,6 @@ use Illuminate\Foundation\Auth\Access\Authorizable;
 class User extends Model implements AuthenticableInterface
 {
     use Authenticatable, Authorizable;
-
     public $timestamps = false;
     protected $fillable = [
         'email',
@@ -32,11 +30,24 @@ class User extends Model implements AuthenticableInterface
         'password',
         'remember_token',
     ];
-
     const STATE_DELETED = 'deleted';
     const STATE_BLOCKED = 'blocked';
     const STATE_ACTIVE = 'active';
     const ROLE_VISITOR = 'visitor';
     const ROLE_EDITOR = 'editor';
     const ROLE_ADMIN = 'admin';
+
+    /**
+     * Getter for Gravatar URL
+     *
+     * This method returns full path (url) to user's Gravatar. It accepts optional parameter for setting size.
+     *
+     * @param int $size size of rendered gravatar
+     *
+     * @return string
+     */
+    public function gravatar($size = 50)
+    {
+        return "http://www.gravatar.com/avatar/" . md5(strtolower(trim($this->email))) . "?s=" . $size;
     }
+}

app/Providers/AdminMenusProvider.php

@@ -4,7 +4,7 @@ namespace App\Providers;
 
 use Illuminate\Support\ServiceProvider;
 
-class AdminProvider extends ServiceProvider
+class AdminMenusProvider extends ServiceProvider
 {
     /**
      * Bootstrap the application services.
@@ -28,14 +28,18 @@ class AdminProvider extends ServiceProvider
             $menu->url(action('Admin\Dashboard@getIndex'), trans('admin/mainMenu.dashboard'), 1, ['icon' => 'fa fa-dashboard']);
             $menu->dropdown(trans('admin/mainMenu.userManagement'), function($sub) {
                 $sub->url(action('Admin\UserManagement@getNewUser'), trans('admin/mainMenu.newUser'), 1, ['icon' => 'fa fa-user-plus']);
-                $sub->url(action('Admin\UserManagement@getOverview', ['state' => 'all']), trans('admin/mainMenu.usersOverview'), 2, ['icon' => 'fa fa-users']);
+                $sub->url(action('Admin\UserManagement@getOverview'), trans('admin/mainMenu.usersOverview'), 2, ['icon' => 'fa fa-users']);
 
             }, ['icon' => 'fa fa-users']);
+            $menu->url('#', trans('admin/mainMenu.customFields'), 30, ['icon' => 'fa fa-code']);
+            $menu->url('#', trans('admin/mainMenu.settings'), 50, ['icon' => 'fa fa-gear']);
+
         });
 
         // create menu with user profile
         \Menu::create('profileMenu', function ($menu) {
-            // @todo add profile menu
+            $menu->url('#', trans('admin/userManagement.profile'));
+            $menu->url('#', trans('admin/common.logout'));
         });
     }
 

app/Providers/GlobalViewDataProvider.php

@@ -13,7 +13,6 @@ class GlobalViewDataProvider extends ServiceProvider
      */
     public function boot()
     {
-        view()->share('something', 'some value');
         view()->share('vendorName', 'ja s.r.o.');
     }
 

config/app.php

@@ -148,7 +148,7 @@ return [
         App\Providers\EventServiceProvider::class,
         App\Providers\RouteServiceProvider::class,
         App\Providers\GlobalViewDataProvider::class,
-        App\Providers\AdminProvider::class,
+        App\Providers\AdminMenusProvider::class,
 
     ],
     /*

config/menus.php

@@ -9,9 +9,10 @@ return [
         'nav-tab'                         => 'Pingpong\Menus\Presenters\Bootstrap\NavTabPresenter',
         'sidebar'                         => 'Pingpong\Menus\Presenters\Bootstrap\SidebarMenuPresenter',
         'navmenu'                         => 'Pingpong\Menus\Presenters\Bootstrap\NavMenuPresenter',
-        'foundation'  =>  'App\MenuPresenters\FoundationMenuPresenter',
+        'foundation-drilldown'            => 'App\MenuPresenters\FoundationDrilldownMenuPresenter',
+        'foundation-dropdown'             => 'App\MenuPresenters\FoundationDropdownMenuPresenter',
+        'foundation-dropdown-initialized' => 'App\MenuPresenters\FoundationInitializedDropdownMenuPresenter',
     ],
-
     'ordering' => false,
 
 ];

resources/assets/css/admin.css

@@ -5,15 +5,24 @@
 }
 
 header {
-	background: #ddd;
 }
 
 .sidebar {
-	background: #eee;
-
 }
 
 
 .login-form {
 	margin-top: 4em;
 }
+
+.active {
+	font-weight: bolder;
+}
+
+/**
+	Footer
+*/
+
+footer {
+	margin-top: 10em;
+}

resources/lang/en/admin/common.php

@@ -0,0 +1,5 @@
+<?php
+return [
+    'admin' => 'Administration',
+    'logout' => 'Log out'
+];

resources/lang/en/admin/mainMenu.php

@@ -2,7 +2,9 @@
 
 return [
     'dashboard'      => 'Dashboard',
-    'userManagement' => 'User Management',
+    'userManagement' => 'Users',
     'newUser'        => 'New User',
-    'usersOverview' => 'Overview'
+    'usersOverview'  => 'Overview',
+    'customFields'   => 'Custom fields',
+    'settings'       => 'Settings'
 ];

resources/lang/en/admin/userManagement.php

@@ -10,6 +10,7 @@ return [
     'role_editor' => 'Editor',
     'role_visitor' => 'Visitor',
     'register' => 'Create user',
-    'registrationSuccessfull' => 'New user successfully added.'
+    'registrationSuccessfull' => 'New user successfully added.',
+    'profile' => 'Your profile'
 
 ];

resources/views/admin/layout.blade.php

@@ -5,7 +5,7 @@
     <meta http-equiv="x-ua-compatible" content="ie=edge">
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     @yield('head_meta')
-    <title>@yield('pageName') {{$vendorName}}</title>
+    <title>@yield('pageName', @trans('admin/common.admin')) | {{$vendorName}}</title>
     <link rel="stylesheet" href="{{asset('../resources/assets/css/foundation.min.css')}}" />
     <link rel="stylesheet" href="{{asset('../resources/assets/css/font-awesome.min.css')}}" />
     <link rel="stylesheet" href="{{asset('../resources/assets/css/admin.css')}}" />
@@ -16,30 +16,38 @@
 <div id="container">
 
     <header class="row">
-        <section class="logo columns large-2">
+        <section class="logo columns small-1 medium-3 large-2">
-            ...
+
         </section>
 
-        <section class="heading columns large-8">
+        <section class="heading columns small-10 medium-8 large-8">
-            <h1>{{$vendorName}}</h1>
+
         </section>
 
-        <section class="profile columns large-2">
+        <section class="profile columns small-10 medium-1 large-2">
-            {!! Menu::render('profileMenu') !!}
+            <ul class="vertical dropdown menu" data-dropdown-menu>
+                <li>
+                    <a href="#">
+                        <img src="{{Auth::user()->gravatar(25)}}" alt="" />
+                        {{Auth::user()->getAttribute('name')}}
+                    </a>
+                    {!! Menu::render('profileMenu', 'foundation-dropdown-initialized') !!}
+                </li>
+            </ul>
         </section>
     </header>
 
     <div class="row">
         <section class="sidebar large-2 columns">
-            {!! Menu::render('mainMenu', 'foundation') !!}
+            {!! Menu::render('mainMenu', 'foundation-drilldown') !!}
         </section>
 
-        <section class="content large-10 columns">
+        <section class="content small-11 medium-9 large-10 columns">
             @yield('content')
         </section>
     </div>
 
-    <footer>
+    <footer class="row text-center">
         &copy; {{$vendorName}} {{date('Y')}}
     </footer>
 </div>
@@ -49,5 +57,9 @@
 
 @yield('javascripts')
 
+<script type="application/javascript">
+    $ (document).foundation ();
+</script>
+
 </body>
 </html>