kevin/hypothetical
1
0
Fork 0
mirror of https://github.com/prurigro/hypothetical.git synced 2024-09-18 17:54:27 -04:00
Code Issues Projects Releases Packages Wiki Activity

Add a credits page to the dashboard showing the project authors and front-facing libraries used on the website, use /dashboard/edit for both the edit-list and edit-item pages, organize the dashboard styles a bit better, use relative paths instead of the url() function to render the dashboard URLs, add active nav link functionality to links other than the main dashboard pages, pull the nav blade out of the sections folder now that it's the only section, and keep the traditional template in sync

Browse source
This commit is contained in:
Kevin MacMartin 2018-04-18 23:32:22 -04:00
parent 679ef84d55
commit 58902bb5ee
10 changed files with 225 additions and 130 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

18
app/Http/Controllers/DashboardController.php
View file

@ -11,9 +11,7 @@ use App\Models\Dashboard;
class DashboardController extends Controller {
/**
* Create a new controller instance.
*
* @return void
* Create a new controller instance
*/
public function __construct()
{
@ -21,17 +19,23 @@ class DashboardController extends Controller {
}
/**
* Show the application dashboard.
*
* @return Response
* Show the application dashboard
*/
public function index()
public function getIndex()
{
return view('dashboard.home', [
'heading' => 'Dashboard Home'
]);
}
/**
* Show the dashboard credits
*/
public function getCredits()
{
return view('dashboard.credits');
}
/**
* Dashboard View
*/

29
app/Models/Dashboard.php
View file

@ -34,6 +34,35 @@ class Dashboard
]
];
/**
* Authors (Credits Page)
*
* @return array
*/
public static $author_credits = [
[ 'name' => 'Kevin MacMartin', 'url' => 'https://github.com/prurigro' ]
];
/**
* Libraries (Credits Page)
*
* @return array
*/
public static $library_credits = [
[ 'name' => 'Bootstrap', 'url' => 'https://getbootstrap.com' ],
[ 'name' => 'Font Awesome', 'url' => 'https://fontawesome.com' ],
[ 'name' => 'GreenSock', 'url' => 'https://greensock.com/gsap' ],
[ 'name' => 'jQuery', 'url' => 'https://jquery.org' ],
[ 'name' => 'List.js', 'url' => 'http://listjs.com' ],
[ 'name' => 'pickadate.js', 'url' => 'http://amsul.ca/pickadate.js/' ],
[ 'name' => 'Popper.js', 'url' => 'https://popper.js.org' ],
[ 'name' => 'SimpleMDE Markdown Editor', 'url' => 'https://simplemde.com' ],
[ 'name' => 'Sortable', 'url' => 'https://github.com/RubaXa/Sortable' ],
[ 'name' => 'SpinKit', 'url' => 'http://tobiasahlin.com/spinkit/' ],
[ 'name' => 'Vue.js', 'url' => 'https://vuejs.org' ],
[ 'name' => 'what-input', 'url' => 'https://github.com/ten1seven/what-input' ]
];
/**
* Retrieve a Dashboard Model
*

4
resources/assets/js/dashboard.js vendored
View file

@ -120,7 +120,7 @@ function editListInit() {
const $newButton = $(".btn.new-button");
$newButton.on("click", function() {
window.location.href = "/dashboard/edit-item/" + model + "/new";
window.location.href = "/dashboard/edit/" + model + "/new";
});
};
@ -134,7 +134,7 @@ function editListInit() {
itemId = $listItem.data("id");
// go to the edit page
window.location.href = "/dashboard/edit-item/" + model + "/" + itemId;
window.location.href = "/dashboard/edit/" + model + "/" + itemId;
});
};

240
resources/assets/sass/dashboard.scss vendored
View file

@ -149,37 +149,6 @@ body {
margin-top: 20px;
margin-bottom: 20px;
.card-body {
padding: 15px;
background-color: lighten($c-dashboard-light, 1%);
&.dashboard {
@include media-breakpoint-down(sm) {
padding: 0px;
}
}
.search {
margin-bottom: 10px;
width: 100%;
@include media-breakpoint-down(sm) {
margin: 3px 3px 0px 3px;
width: calc(100% - 6px);
}
}
.help-text {
margin-top: 10px;
margin-bottom: 10px;
padding: 5px 10px;
border: 1px solid darken($c-dashboard-dark, 5%);
border-radius: 5px;
background-color: $c-dashboard-dark;
color: $c-text-light;
}
}
> .card-header {
position: relative;
padding: 9px 15px;
@ -210,92 +179,147 @@ body {
}
}
}
}
.card-body .form-group {
margin-bottom: 15px;
.card-body {
padding: 15px;
background-color: lighten($c-dashboard-light, 1%);
label {
@include font-sans-semibold;
font-size: 14px;
@include media-breakpoint-up(md) {
text-align: right;
}
}
.form-control {
font-size: 14px;
transition: border-color 150ms, box-shadow 150ms;
&:focus {
border-color: $c-dashboard-dark;
box-shadow: inset 0 1px 1px fade-out(#000, 0.925), 0 0 8px fade-out($c-dashboard-dark, 0.4);
}
}
&.has-error .form-control {
border-color: $c-dashboard-error;
}
.checkbox {
position: relative;
display: inline-block;
min-height: 0px;
padding-top: 0px;
padding-left: 22px;
user-select: none;
span, input {
position: absolute;
top: 50%;
left: 0px;
transform: translateY(-50%);
display: block;
width: 16px;
height: 16px;
}
span {
border: 1px solid lighten($c-text, 50%);
border-radius: 4px;
background-color: $c-input-bg;
pointer-events: none;
&:after {
content: "";
position: absolute;
top: 0px;
left: 0px;
transform: scale(0);
display: block;
width: 100%;
height: 100%;
background-image: url("/img/dashboard/checkmark.svg");
background-position: center center;
background-size: 65% auto;
background-repeat: no-repeat;
opacity: 0;
transition: transform 150ms, opacity 150ms;
&.dashboard {
@include media-breakpoint-down(sm) {
padding: 0px;
}
}
input {
margin: 0px;
padding: 0px;
opacity: 0;
cursor: pointer;
.search {
margin-bottom: 10px;
width: 100%;
&:checked + span:after {
transform: scale(1);
opacity: 1;
@include media-breakpoint-down(sm) {
margin: 3px 3px 0px 3px;
width: calc(100% - 6px);
}
}
}
.text-muted {
font-size: 10px;
text-transform: uppercase;
.help-text {
margin-top: 10px;
margin-bottom: 10px;
padding: 5px 10px;
border: 1px solid darken($c-dashboard-dark, 5%);
border-radius: 5px;
background-color: $c-dashboard-dark;
color: $c-text-light;
}
.form-group {
margin-bottom: 15px;
label {
@include font-sans-semibold;
font-size: 14px;
@include media-breakpoint-up(md) {
text-align: right;
}
}
.form-control {
font-size: 14px;
transition: border-color 150ms, box-shadow 150ms;
&:focus {
border-color: $c-dashboard-dark;
box-shadow: inset 0 1px 1px fade-out(#000, 0.925), 0 0 8px fade-out($c-dashboard-dark, 0.4);
}
}
&.has-error .form-control {
border-color: $c-dashboard-error;
}
.checkbox {
position: relative;
display: inline-block;
min-height: 0px;
padding-top: 0px;
padding-left: 22px;
user-select: none;
span, input {
position: absolute;
top: 50%;
left: 0px;
transform: translateY(-50%);
display: block;
width: 16px;
height: 16px;
}
span {
border: 1px solid lighten($c-text, 50%);
border-radius: 4px;
background-color: $c-input-bg;
pointer-events: none;
&:after {
content: "";
position: absolute;
top: 0px;
left: 0px;
transform: scale(0);
display: block;
width: 100%;
height: 100%;
background-image: url("/img/dashboard/checkmark.svg");
background-position: center center;
background-size: 65% auto;
background-repeat: no-repeat;
opacity: 0;
transition: transform 150ms, opacity 150ms;
}
}
input {
margin: 0px;
padding: 0px;
opacity: 0;
cursor: pointer;
&:checked + span:after {
transform: scale(1);
opacity: 1;
}
}
}
.text-muted {
font-size: 10px;
text-transform: uppercase;
}
}
.dashboard-credits {
padding: $grid-gutter-width;
h2 {
@include font-sans-semibold;
margin-bottom: 15px;
font-size: 18px;
text-transform: uppercase;
&:not(:first-child) {
margin-top: 25px;
}
}
ul {
margin-bottom: 0px;
padding-left: 20px;
li a {
color: $c-text;
}
}
}
}
}

35
resources/views/dashboard/credits.blade.php Normal file
View file

@ -0,0 +1,35 @@
@extends('templates.dashboard')
@section('page-content')
<div class="container spark-screen">
<div class="row">
<div class="col-12">
<div class="card">
<div class="card-header">
Credits
</div>
<div class="card-body dashboard">
<div class="dashboard-credits">
<h2>Authors</h2>
<ul>
@foreach(App\Models\Dashboard::$author_credits as $credit)
<li><a href="{{ $credit['url'] }}" target="_blank" rel="noreferrer">{{ $credit['name'] }}</a></li>
@endforeach
</ul>
<h2>Libraries</h2>
<ul>
@foreach(App\Models\Dashboard::$library_credits as $credit)
<li><a href="{{ $credit['url'] }}" target="_blank" rel="noreferrer">{{ $credit['name'] }}</a></li>
@endforeach
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
@endsection

4
resources/views/dashboard/home.blade.php
View file

@ -10,7 +10,7 @@
<a
class="list-group-item-link"
href="{{ url('/dashboard/' . $submenu_item['type'] . '/' . $submenu_item['model']) }}">
href="/dashboard/{{ $submenu_item['type'] }}/{{ $submenu_item['model'] }}">
</a>
</li>
@endforeach
@ -20,7 +20,7 @@
<a
class="list-group-item-link"
href="{{ url('/dashboard/' . $menu_item['type'] . '/' . $menu_item['model']) }}">
href="/dashboard/{{ $menu_item['type'] }}/{{ $menu_item['model'] }}">
</a>
</li>
@endif

13
resources/views/dashboard/sections/nav.blade.php → resources/views/dashboard/nav.blade.php
View file

@ -1,7 +1,7 @@
<nav class="navbar navbar-expand-lg">
@set('current_page', preg_replace([ '/^.*\//', '/\/.*/' ], [ '', '' ], Request::url()))
<a class="navbar-brand" href="{{ url('/dashboard') }}">
<a class="navbar-brand" href="/dashboard">
{{ env('APP_NAME') }} Dashboard
</a>
@ -16,10 +16,10 @@
<div id="dashboard-navbar" class="collapse navbar-collapse">
<ul class="navbar-nav ml-auto">
@if (Auth::guest())
<li class="nav-item"><a class="nav-link" href="{{ url('/login') }}">Login</a></li>
<li class="nav-item"><a class="nav-link {{ $current_page == 'login' ? 'active' : '' }}" href="/login">Login</a></li>
@if(env('REGISTRATION', false))
<li class="nav-item"><a class="nav-link" href="{{ url('/register') }}">Register</a></li>
<li class="nav-item"><a class="nav-link {{ $current_page == 'register' ? 'active' : '' }}" href="/register">Register</a></li>
@endif
@else
@foreach(App\Models\Dashboard::$menu as $menu_item)
@ -33,13 +33,13 @@
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="menu-dropdown-{{ $dropdown_id }}">
@foreach($menu_item['submenu'] as $submenu_item)
<a class="dropdown-item {{ $current_page == $submenu_item['model'] ? 'active' : '' }}" href="{{ url('/dashboard/' . $submenu_item['type'] . '/' . $submenu_item['model']) }}">{{ $submenu_item['title'] }}</a>
<a class="dropdown-item {{ $current_page == $submenu_item['model'] ? 'active' : '' }}" href="/dashboard/{{ $submenu_item['type'] }}/{{ $submenu_item['model'] }}">{{ $submenu_item['title'] }}</a>
@endforeach
</div>
</li>
@else
<li class="nav-item">
<a class="nav-link {{ $current_page == $menu_item['model'] ? 'active' : '' }}" href="{{ url('/dashboard/' . $menu_item['type'] . '/' . $menu_item['model']) }}">
<a class="nav-link {{ $current_page == $menu_item['model'] ? 'active' : '' }}" href="/dashboard/{{ $menu_item['type'] }}/{{ $menu_item['model'] }}">
{{ $menu_item['title'] }}
</a>
</li>
@ -52,7 +52,8 @@
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="user-dropdown">
<a class="dropdown-item" href="{{ url('/logout') }}">Logout</a>
<a class="dropdown-item {{ $current_page == 'credits' ? 'active' : '' }}" href="/dashboard/credits">Credits</a>
<a class="dropdown-item" href="/logout">Logout</a>
</div>
</li>
@endif

2
resources/views/templates/dashboard.blade.php
View file

@ -7,5 +7,5 @@
@endsection
@section('page-top')
@include('dashboard.sections.nav')
@include('dashboard.nav')
@endsection

5
routes/web.php
View file

@ -29,10 +29,11 @@ Route::get('/logout', 'Auth\LoginController@logout');
*/
Route::group([ 'prefix' => 'dashboard' ], function() {
Route::get('/', 'DashboardController@index');
Route::get('/', 'DashboardController@getIndex');
Route::get('/credits', 'DashboardController@getCredits');
Route::get('/view/{model}', 'DashboardController@getView');
Route::get('/edit/{model}', 'DashboardController@getEditList');
Route::get('/edit-item/{model}/{id}', 'DashboardController@getEditItem');
Route::get('/edit/{model}/{id}', 'DashboardController@getEditItem');
Route::get('/export/{model}', 'DashboardController@getExport');
Route::post('/image-upload', 'DashboardController@postImageUpload');
Route::post('/file-upload', 'DashboardController@postFileUpload');

5
traditional-bootstrap/routes/web.php
View file

@ -29,10 +29,11 @@ Route::get('/logout', 'Auth\LoginController@logout');
*/
Route::group([ 'prefix' => 'dashboard' ], function() {
Route::get('/', 'DashboardController@index');
Route::get('/', 'DashboardController@getIndex');
Route::get('/credits', 'DashboardController@getCredits');
Route::get('/view/{model}', 'DashboardController@getView');
Route::get('/edit/{model}', 'DashboardController@getEditList');
Route::get('/edit-item/{model}/{id}', 'DashboardController@getEditItem');
Route::get('/edit/{model}/{id}', 'DashboardController@getEditItem');
Route::get('/export/{model}', 'DashboardController@getExport');
Route::post('/image-upload', 'DashboardController@postImageUpload');
Route::post('/file-upload', 'DashboardController@postFileUpload');