minicms/core
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

FEATURE: add scripts and styles into gulpfile

Browse Source
This commit is contained in:
Michal Kváček
2017-02-10 02:13:03 +01:00
parent 724478d0c9
commit 0d22a14604
11 changed files with 548 additions and 74 deletions
Download Patch File Download Diff File Expand all files Collapse all files
resources/assets/css/admin/custom.css → resources/assets/admin/css/custom.css
Vendored
View File
resources/assets/admin/js/app.js
+510
View File
@@ -0,0 +1,510 @@
var config = window.config = {};
// Config reference element
var $ref = $ ("#ref");
// Configure responsive bootstrap toolkit
config.ResponsiveBootstrapToolkitVisibilityDivs = {
'xs': $ ('<div class="device-xs hidden-sm-up"></div>'),
'sm': $ ('<div class="device-sm hidden-xs-down hidden-md-up"></div>'),
'md': $ ('<div class="device-md hidden-sm-down hidden-lg-up"></div>'),
'lg': $ ('<div class="device-lg hidden-md-down hidden-xl-up"></div>'),
'xl': $ ('<div class="device-xl hidden-lg-down"></div>')
};
ResponsiveBootstrapToolkit.use ('Custom', config.ResponsiveBootstrapToolkitVisibilityDivs);
//validation configuration
config.validations = {
debug: true,
errorClass: 'has-error',
validClass: 'success',
errorElement: "span",
// add error class
highlight: function (element, errorClass, validClass) {
$ (element).parents ("div.form-group")
.addClass (errorClass)
.removeClass (validClass);
},
// add error class
unhighlight: function (element, errorClass, validClass) {
$ (element).parents (".has-error")
.removeClass (errorClass)
.addClass (validClass);
},
// submit handler
submitHandler: function (form) {
form.submit ();
}
};
//delay time configuration
config.delayTime = 50;
// chart configurations
config.chart = {};
/***********************************************
* Animation Settings
***********************************************/
function animate(options) {
var animationName = "animated " + options.name;
var animationEnd = "webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend";
$ (options.selector)
.addClass (animationName)
.one (animationEnd,
function () {
$ (this).removeClass (animationName);
}
);
}
$ (function () {
var $itemActions = $ (".item-actions-dropdown");
$ (document).on ('click', function (e) {
if (!$ (e.target).closest ('.item-actions-dropdown').length) {
$itemActions.removeClass ('active');
}
});
$ ('.item-actions-toggle-btn').on ('click', function (e) {
e.preventDefault ();
var $thisActionList = $ (this).closest ('.item-actions-dropdown');
$itemActions.not ($thisActionList).removeClass ('active');
$thisActionList.toggleClass ('active');
});
});
// /***********************************************
// * NProgress Settings
// ***********************************************/
// var npSettings = {
// easing: 'ease',
// speed: 500
// };
//
// NProgress.configure (npSettings);
// $ (function () {
// setSameHeights ();
//
// var resizeTimer;
//
// $ (window).resize (function () {
// clearTimeout (resizeTimer);
// resizeTimer = setTimeout (setSameHeights, 150);
// });
// });
function setSameHeights($container) {
$container = $container || $ ('.sameheight-container');
var viewport = ResponsiveBootstrapToolkit.current ();
$container.each (function () {
var $items = $ (this).find (".sameheight-item");
// Get max height of items in container
var maxHeight = 0;
$items.each (function () {
$ (this).css ({height: 'auto'});
maxHeight = Math.max (maxHeight, $ (this).innerHeight ());
});
// Set heights of items
$items.each (function () {
// Ignored viewports for item
var excludedStr = $ (this).data ('exclude') || '';
var excluded = excludedStr.split (',');
// Set height of element if it's not excluded on
if (excluded.indexOf (viewport) === -1) {
$ (this).innerHeight (maxHeight);
}
});
});
}
$ (function () {
animate ({
name: 'flipInY',
selector: '.error-card > .error-title-block'
});
setTimeout (function () {
var $el = $ ('.error-card > .error-container');
animate ({
name: 'fadeInUp',
selector: $el
});
$el.addClass ('visible');
}, 500);
});
$ (function () {
$ ('#sidebar-menu, #customize-menu').metisMenu ({
activeClass: 'open'
});
$ ('#sidebar-collapse-btn').on ('click', function (event) {
event.preventDefault ();
$ ("#app").toggleClass ("sidebar-open");
});
$ ("#sidebar-overlay").on ('click', function () {
$ ("#app").removeClass ("sidebar-open");
});
});
$ (function () {
$ ('.actions-list > li').on ('click', '.check', function (e) {
e.preventDefault ();
$ (this).parents ('.tasks-item')
.find ('.checkbox')
.prop ("checked", true);
// removeActionList ();
});
});
// $ (function () {
// // set sortable options
// $ ('.images-container').sortable ({
// animation: 150,
// handle: ".control-btn.move",
// draggable: ".image-container",
// onMove: function (evt) {
// var $relatedElem = $ (evt.related);
//
// if ($relatedElem.hasClass ('add-image')) {
// return false;
// }
// }
// });
//
// var $controlsButtons = $ ('.controls');
//
// var $controlsButtonsStar = $controlsButtons.find ('.star');
//
// $controlsButtonsStar.on ('click', function (e) {
// e.preventDefault ();
//
// $controlsButtonsStar.removeClass ('active');
// $controlsButtonsStar.parents ('.image-container').removeClass ('main');
//
// $ (this).addClass ('active');
//
// $ (this).parents ('.image-container').addClass ('main');
// })
// });
$ (function () {
$ ('.nav-profile > li > a').on ('click', function () {
var $el = $ (this).next ();
animate ({
name: 'flipInX',
selector: $el
});
});
});
$ (function () {
// Local storage settings
var themeSettings = getThemeSettings ();
// Elements
var $app = $ ('#app');
var $styleLink = $ ('#theme-style');
var $customizeMenu = $ ('#customize-menu');
// Color switcher
var $customizeMenuColorBtns = $customizeMenu.find ('.color-item');
// Position switchers
var $customizeMenuRadioBtns = $customizeMenu.find ('.radio');
// /////////////////////////////////////////////////
// Initial state
// On setting event, set corresponding options
// Update customize view based on options
// Update theme based on options
/************************************************
* Initial State
*************************************************/
setThemeSettings ();
/************************************************
* Events
*************************************************/
// set theme type
$customizeMenuColorBtns.on ('click', function () {
themeSettings.themeName = $ (this).data ('theme');
setThemeSettings ();
});
$customizeMenuRadioBtns.on ('click', function () {
var optionName = $ (this).prop ('name');
themeSettings[optionName] = $ (this).val ();
setThemeSettings ();
});
function setThemeSettings() {
setThemeState ()
.delay (config.delayTime)
.queue (function (next) {
setThemeColor ();
setThemeControlsState ();
saveThemeSettings ();
$ (document).trigger ("themechange");
next ();
});
}
/************************************************
* Update theme based on options
*************************************************/
function setThemeState() {
// set theme type
if (themeSettings.themeName) {
$styleLink.attr ('href', window.cssPath + '/app-' + themeSettings.themeName + '.css');
}
else {
$styleLink.attr ('href', window.cssPath + '/app.css');
}
// App classes
$app.removeClass ('header-fixed footer-fixed sidebar-fixed');
// set header
$app.addClass (themeSettings.headerPosition);
// set footer
$app.addClass (themeSettings.footerPosition);
// set footer
$app.addClass (themeSettings.sidebarPosition);
return $app;
}
/************************************************
* Update theme controls based on options
*************************************************/
function setThemeControlsState() {
// set color switcher
$customizeMenuColorBtns.each (function () {
if ($ (this).data ('theme') === themeSettings.themeName) {
$ (this).addClass ('active');
}
else {
$ (this).removeClass ('active');
}
});
// set radio buttons
$customizeMenuRadioBtns.each (function () {
var name = $ (this).prop ('name');
var value = $ (this).val ();
if (themeSettings[name] === value) {
$ (this).prop ("checked", true);
}
else {
$ (this).prop ("checked", false);
}
});
}
/************************************************
* Update theme color
*************************************************/
function setThemeColor() {
config.chart.colorPrimary = tinycolor ($ref.find (".chart .color-primary").css ("color"));
config.chart.colorSecondary = tinycolor ($ref.find (".chart .color-secondary").css ("color"));
}
/************************************************
* Storage Functions
*************************************************/
function getThemeSettings() {
var settings = (localStorage.getItem ('themeSettings')) ? JSON.parse (localStorage.getItem ('themeSettings')) : {};
settings.headerPosition = settings.headerPosition || '';
settings.sidebarPosition = settings.sidebarPosition || '';
settings.footerPosition = settings.footerPosition || '';
return settings;
}
function saveThemeSettings() {
localStorage.setItem ('themeSettings', JSON.stringify (themeSettings));
}
});
$ (function () {
$ ("body").addClass ("loaded");
var notification = $ ('.notification');
if (notification.length) {
notification.click (function () {
$ (this).fadeOut ('fast');
});
setTimeout (function () {
notification.fadeOut (1500)
}, 5 * 1000)
}
});
/**
* Makes slug from input string
*
* @param text
* @param trimSpaces
*
* @returns {string}
*/
function slugify(text, trimSpaces) {
text = text.toString ().toLowerCase ();
if (trimSpaces)
text = text.trim ();
return text.replace (/ /g, '-')
.replace (/[àáâãäå]/g, "a")
.replace (/[čç]/g, "c")
.replace (/[ěèéêë]/g, "e")
.replace (/[ùúûüů]/g, "u")
.replace (/[ìíîï]/g, "i")
.replace (/[ňńñ]/g, "n")
.replace (/[òóôõö]/g, "o")
.replace (/[ýÿ]/g, "y")
.replace (/œ/g, "oe")
.replace (/ď/g, "d")
.replace (/ř/g, "r")
.replace (/š/g, "s")
.replace (/ž/g, "z")
.replace (/ť/g, "t")
.replace (/æ/g, "ae")
.replace (/[^a-z0-9\-]+/g, '')
.replace (/--+/g, '-');
}
// bind some custom methods
$ (document).ready (function () {
var previousTitle, previousMessage;
$ ('.confirm').click (function (e) {
var titleElement = $ ('#confirmation-title');
var messageElement = $ ('#confirmation-message');
previousTitle = titleElement.text ();
previousMessage = messageElement.text ();
var confirmTitle = $ (this).data ('title');
var confirmMessage = $ (this).data ('message');
var href = $ (this).attr ('href');
$ ('#confirm-button').attr ('href', href);
if (confirmTitle)
titleElement.text (confirmTitle);
if (confirmMessage)
messageElement.text (confirmMessage);
$ ('#confirm-modal').modal ('show');
e.preventDefault ();
});
$ ('#confirm-modal').on ('hidden.bs.modal', function () {
$ ('#confirmation-title').text (previousTitle);
$ ('#confirmation-message').text (previousMessage);
});
$ ('#lockUrl').change (function () {
$ ('.slug-source').keyup ();
});
$ ('.slug-target').keyup (function () {
$ (this).val (slugify ($ (this).val (), false));
$ ('#lockUrl').prop ('checked', true);
});
$ ('.slug-source').keyup (function () {
var source = $ (this);
var target = $ ('.slug-target');
var locked = $ ('#lockUrl');
if (!locked.is (':checked'))
target.val (slugify (source.val (), true));
});
$ (function () {
$ ('[data-toggle="tooltip"]').tooltip ()
});
// find if any error occured and mark tab with that error
$ ('.has-error').each (function () {
var error = $ (this);
var tabCard = error.closest ('.tab-pane');
$ ("#" + tabCard.prop ('id') + "-tab").addClass ('tab-with-error');
});
$('#removeTitlePhoto').click(function () {
$('#titlePhotoContainer').remove();
// $('existingTitlePhoto').val(null);
});
$('form').areYouSure();
});
// /***********************************************
// * NProgress Settings
// ***********************************************/
//
// // start load bar
// NProgress.start ();
//
// // end loading bar
// NProgress.done ();
resources/assets/sass/admin/_common/_styles/typography.scss
+1 -1
View File
@@ -48,7 +48,7 @@
}
.text-primary {
color: $color-primary;
color: $color-primary !important;
}
.text-muted {
resources/assets/sass/admin/_main.scss
+1 -1
View File
@@ -1,6 +1,6 @@
@import url(http://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,800,700,600);
@import '_variables';
@import 'variables';
@import 'bootstrap/scss/_variables';
@import 'bootstrap/scss/_mixins';
@import '_common/_styles/mixins';
resources/assets/sass/admin/_variables.scss
+1
View File
@@ -6,6 +6,7 @@
/*************************************************************
* Colors Definitions
**************************************************************/
@import '../../../../public/css/admin/theme';
$color-primary: #85CE36 !default;
$color-primary-light: lighten($color-primary, 10%) !default;
resources/assets/sass/admin/app/app.scss
+1 -1
View File
@@ -1,4 +1,4 @@
@import "../imports";
@import "../main";
.app {
position: relative;
resources/assets/sass/bootstrap/_variables.scss
-1
View File
@@ -1 +0,0 @@
@import "bootstrap/scss/variables";
resources/assets/sass/bootstrap/bootstrap.scss
Vendored
+2 -49
View File
@@ -1,49 +1,2 @@
// Core variables and mixins
@import "bootstrap/scss/variables";
@import "bootstrap/scss/mixins";
// Reset and dependencies
@import "bootstrap/scss/normalize";
@import "bootstrap/scss/print";
// Core CSS
@import "bootstrap/scss/reboot";
@import "bootstrap/scss/type";
@import "bootstrap/scss/images";
@import "bootstrap/scss/code";
@import "bootstrap/scss/grid";
@import "bootstrap/scss/tables";
@import "bootstrap/scss/forms";
@import "bootstrap/scss/buttons";
// Components
@import "bootstrap/scss/animation";
@import "bootstrap/scss/dropdown";
@import "bootstrap/scss/button-group";
@import "bootstrap/scss/input-group";
//@import "bootstrap/scss/custom-forms";
@import "bootstrap/scss/nav";
@import "bootstrap/scss/navbar";
@import "bootstrap/scss/card";
@import "bootstrap/scss/breadcrumb";
@import "bootstrap/scss/pagination";
@import "bootstrap/scss/tags";
//@import "bootstrap/scss/jumbotron";
@import "bootstrap/scss/alert";
//@import "bootstrap/scss/progress";
@import "bootstrap/scss/media";
@import "bootstrap/scss/list-group";
//@import "bootstrap/scss/responsive-embed";
@import "bootstrap/scss/close";
// Components w/ JavaScript
@import "bootstrap/scss/modal";
@import "bootstrap/scss/tooltip";
@import "bootstrap/scss/popover";
//@import "bootstrap/scss/carousel";
// Utility classes
@import "bootstrap/scss/utilities";
@import "variables.scss";
@import "bower_components/bootstrap/scss/bootstrap";
resources/assets/sass/bootstrap/variables.scss
+5
View File
@@ -0,0 +1,5 @@
@import '../../../../public/css/admin/theme';
$font-family-sans-serif: 'Open Sans', sans-serif;
@import 'bower_components/bootstrap/scss/variables';
resources/views/admin/layout.blade.php
+4 -5
View File
@@ -11,15 +11,15 @@
<link rel="stylesheet" href="{{asset('public/css/admin/style.css')}}">
@yield('stylesheets')
<script>
window.assetsPath = "{{asset('resources/assets/admin')}}";
window.cssPath = "{{asset('public/css/admin')}}";
var themeSettings = (localStorage.getItem ('themeSettings')) ? JSON.parse (localStorage.getItem ('themeSettings')) :
{};
var themeName = themeSettings.themeName || '';
if (themeName) {
document.write ('<link rel="stylesheet" id="theme-style" href="{{asset('resources/assets/admin/css/')}}/app-' + themeName + '.css">');
document.write ('<link rel="stylesheet" id="theme-style" href="{{asset('public/css/admin/')}}/app-' + themeName + '.css">');
} else {
document.write ('<link rel="stylesheet" id="theme-style" href="{{asset('resources/assets/admin/css/')}}/app.css">');
document.write ('<link rel="stylesheet" id="theme-style" href="{{asset('public/css/admin/')}}/app.css">');
}
</script>
</head>
@@ -76,8 +76,7 @@
<!-- /.modal-dialog -->
</div>
<script src="{{asset('resources/assets/admin/js')}}/vendor.min.js"></script>
<script src="{{asset('resources/assets/admin/js')}}/app.js"></script>
<script src="{{asset('public/js/vendor.js')}}"></script>
@yield('javascripts')