From 6b4ec65b0303487fc45024dae8b814c054e535ef Mon Sep 17 00:00:00 2001 From: Dan Brown Date: Wed, 7 Oct 2015 23:17:48 +0100 Subject: [PATCH] Added logo selector --- gulpfile.js | 13 +------ package.json | 6 ++-- resources/assets/js/global.js | 32 +++++++++++++++++ .../{book-dashboard.js => pages/book-show.js} | 3 +- .../assets/js/templates/image-picker.html | 10 ++++++ resources/assets/sass/_buttons.scss | 3 ++ resources/assets/sass/_header.scss | 4 +-- resources/assets/sass/_text.scss | 8 ++++- resources/views/base.blade.php | 8 +++-- resources/views/books/show.blade.php | 2 -- resources/views/settings/index.blade.php | 35 ++++++++++++++----- 11 files changed, 93 insertions(+), 31 deletions(-) rename resources/assets/js/{book-dashboard.js => pages/book-show.js} (96%) create mode 100644 resources/assets/js/templates/image-picker.html diff --git a/gulpfile.js b/gulpfile.js index 1494c2a5b..7974350d1 100644 --- a/gulpfile.js +++ b/gulpfile.js @@ -1,19 +1,8 @@ var elixir = require('laravel-elixir'); -/* - |-------------------------------------------------------------------------- - | Elixir Asset Management - |-------------------------------------------------------------------------- - | - | Elixir provides a clean, fluent API for defining some basic Gulp tasks - | for your Laravel application. By default, we are compiling the Sass - | file for our application, as well as publishing vendor resources. - | - */ elixir(function(mix) { mix.sass('styles.scss'); mix.scripts('image-manager.js', 'public/js/image-manager.js'); - mix.scripts('book-dashboard.js', 'public/js/book-dashboard.js'); - mix.scripts(['jquery-extensions.js', 'global.js'], 'public/js/common.js'); + mix.browserify(['jquery-extensions.js', 'pages/book-show.js' ,'global.js'], 'public/js/common.js'); }); diff --git a/package.json b/package.json index e28a44f23..5106741e3 100644 --- a/package.json +++ b/package.json @@ -2,10 +2,12 @@ "private": true, "devDependencies": { "gulp": "^3.8.8", - "laravel-elixir-livereload": "0.0.3" + "insert-css": "^0.2.0", + "laravel-elixir-livereload": "1.1.3" }, "dependencies": { "bootstrap-sass": "^3.0.0", - "laravel-elixir": "^2.0.0" + "laravel-elixir": "^3.3.1", + "vue": "^0.12.16" } } diff --git a/resources/assets/js/global.js b/resources/assets/js/global.js index a75a4dc74..66326da23 100644 --- a/resources/assets/js/global.js +++ b/resources/assets/js/global.js @@ -16,4 +16,36 @@ $(function () { $(this).closest('.chapter').find('.inset-list').slideToggle(180); }); +}); + + +// Vue Components + +Vue.component('image-picker', { + template: require('./templates/image-picker.html'), + props: ['currentImage', 'name', 'imageClass'], + data: function() { + return { + image: this.currentImage + } + }, + methods: { + showImageManager: function(e) { + var _this = this; + ImageManager.show(function(image) { + _this.image = image.url; + }); + }, + reset: function() { + this.image = ''; + }, + remove: function() { + this.image = 'none'; + } + } +}); + +// Global Vue Instance +var app = new Vue({ + el: '#app' }); \ No newline at end of file diff --git a/resources/assets/js/book-dashboard.js b/resources/assets/js/pages/book-show.js similarity index 96% rename from resources/assets/js/book-dashboard.js rename to resources/assets/js/pages/book-show.js index 1315843ab..3d5d35255 100644 --- a/resources/assets/js/book-dashboard.js +++ b/resources/assets/js/pages/book-show.js @@ -1,4 +1,5 @@ -var bookDashboard = new Vue({ + +new Vue({ el: '#book-dashboard', data: { searching: false, diff --git a/resources/assets/js/templates/image-picker.html b/resources/assets/js/templates/image-picker.html new file mode 100644 index 000000000..82f0ef7f3 --- /dev/null +++ b/resources/assets/js/templates/image-picker.html @@ -0,0 +1,10 @@ + +
+
+ Image Preview +
+ +
+ | + +
\ No newline at end of file diff --git a/resources/assets/sass/_buttons.scss b/resources/assets/sass/_buttons.scss index 19c7b84e4..bafb68165 100644 --- a/resources/assets/sass/_buttons.scss +++ b/resources/assets/sass/_buttons.scss @@ -59,6 +59,9 @@ $button-border-radius: 2px; &:focus, &:active { outline: 0; } + &.neg { + color: $negative; + } } .button-group { diff --git a/resources/assets/sass/_header.scss b/resources/assets/sass/_header.scss index adc1df197..60a14fde8 100644 --- a/resources/assets/sass/_header.scss +++ b/resources/assets/sass/_header.scss @@ -91,9 +91,9 @@ form.search-box { line-height: 1; } .logo-image { - padding: $-m $-s $-m 0; + margin: $-m $-s $-m 0; vertical-align: top; - height: 75px; + height: 43px; } .dropdown-container { diff --git a/resources/assets/sass/_text.scss b/resources/assets/sass/_text.scss index 3dc48efc8..d50134522 100644 --- a/resources/assets/sass/_text.scss +++ b/resources/assets/sass/_text.scss @@ -256,6 +256,11 @@ ul { } } +span.sep { + color: #BBB; + padding: 0 $-xs; +} + .list > * { display: block; } @@ -265,4 +270,5 @@ ul { */ i { padding-right: $-xs; -} \ No newline at end of file +} + diff --git a/resources/views/base.blade.php b/resources/views/base.blade.php index 39bbfee32..de774042a 100644 --- a/resources/views/base.blade.php +++ b/resources/views/base.blade.php @@ -16,13 +16,12 @@ - @yield('head') - + @if(Session::has('success'))
@@ -41,7 +40,9 @@
@@ -90,5 +91,6 @@ @yield('bottom') + diff --git a/resources/views/books/show.blade.php b/resources/views/books/show.blade.php index d8001b19a..edd8a9b47 100644 --- a/resources/views/books/show.blade.php +++ b/resources/views/books/show.blade.php @@ -91,6 +91,4 @@
- - @stop \ No newline at end of file diff --git a/resources/views/settings/index.blade.php b/resources/views/settings/index.blade.php index 5e484be65..f6ecadce0 100644 --- a/resources/views/settings/index.blade.php +++ b/resources/views/settings/index.blade.php @@ -12,16 +12,30 @@ {!! csrf_field() !!}

App Settings

-
- - -
-
- - - + +
+
+
+ + +
+
+ + + +
+
+
+
+ +

This image should be 43px in height.

+ +
+
+ +

Registration Settings

@@ -70,4 +84,9 @@
+@stop + +@section('bottom') + @include('pages/image-manager') + @stop \ No newline at end of file