From b996e9a8c7eb849fcc3fc4084a6b483a1dc30d3c Mon Sep 17 00:00:00 2001 From: Max Lynch Date: Mon, 16 Dec 2013 15:36:14 -0600 Subject: [PATCH] SEXY --- dist/css/ionic.css | 8 +- dist/js/ionic-angular.js | 21 ++- js/ext/angular/src/directive/ionicBar.js | 2 +- js/ext/angular/src/directive/ionicSlideBox.js | 19 ++- js/ext/angular/test/app_icon.png | Bin 0 -> 12451 bytes js/ext/angular/test/slideBox.html | 121 ++++++++++++------ scss/_slide-box.scss | 6 +- 7 files changed, 123 insertions(+), 54 deletions(-) create mode 100644 js/ext/angular/test/app_icon.png diff --git a/dist/css/ionic.css b/dist/css/ionic.css index 24c398b7f4..312103f999 100644 --- a/dist/css/ionic.css +++ b/dist/css/ionic.css @@ -4408,8 +4408,7 @@ button.item-button-right:after { .slider { position: relative; overflow: hidden; - visibility: hidden; - background-color: #000; } + visibility: hidden; } .slider-slides { position: relative; } @@ -4420,8 +4419,9 @@ button.item-button-right:after { width: 100%; float: left; vertical-align: top; } - .slider-slide img { - width: 100%; } + +.slider-slide-image > img { + width: 100%; } .slider-pager { position: absolute; diff --git a/dist/js/ionic-angular.js b/dist/js/ionic-angular.js index 7f9b15fc39..bda9b4ad77 100644 --- a/dist/js/ionic-angular.js +++ b/dist/js/ionic-angular.js @@ -507,7 +507,7 @@ angular.module('ionic.ui.header', ['ngAnimate']) transclude: true, template: '
\
\ - \
\

\ @@ -1818,6 +1818,7 @@ angular.module('ionic.ui.slideBox', []) replace: true, transclude: true, scope: { + doesContinue: '@', showPager: '@', onSlideChanged: '&' }, @@ -1826,20 +1827,34 @@ angular.module('ionic.ui.slideBox', []) var slider = new ionic.views.Slider({ el: $element[0], + continuous: $scope.$eval($scope.doesContinue) === true, slidesChanged: function() { $scope.currentSlide = slider.getPos(); - // Occasionally we need to trigger a digest + // Try to trigger a digest $timeout(function() {}); }, callback: function(slideIndex) { $scope.currentSlide = slideIndex; $scope.onSlideChanged({index:$scope.currentSlide}); $scope.$parent.$broadcast('slideBox.slideChanged', slideIndex); - $scope.$apply(); + + // Try to trigger a digest + $timeout(function() {}); } }); + $scope.$on('slideBox.nextSlide', function() { + slider.next(); + }); + + $scope.$on('slideBox.prevSlide', function() { + slider.prev(); + }); + + $scope.$on('slideBox.setSlide', function(e, index) { + slider.slide(index); + }); $scope.slider = slider; diff --git a/js/ext/angular/src/directive/ionicBar.js b/js/ext/angular/src/directive/ionicBar.js index 9c78edfa46..bb47afeb5a 100644 --- a/js/ext/angular/src/directive/ionicBar.js +++ b/js/ext/angular/src/directive/ionicBar.js @@ -11,7 +11,7 @@ angular.module('ionic.ui.header', ['ngAnimate']) transclude: true, template: '
\
\ - \
\

\ diff --git a/js/ext/angular/src/directive/ionicSlideBox.js b/js/ext/angular/src/directive/ionicSlideBox.js index acf98705a3..18a71f303e 100644 --- a/js/ext/angular/src/directive/ionicSlideBox.js +++ b/js/ext/angular/src/directive/ionicSlideBox.js @@ -21,6 +21,7 @@ angular.module('ionic.ui.slideBox', []) replace: true, transclude: true, scope: { + doesContinue: '@', showPager: '@', onSlideChanged: '&' }, @@ -29,20 +30,34 @@ angular.module('ionic.ui.slideBox', []) var slider = new ionic.views.Slider({ el: $element[0], + continuous: $scope.$eval($scope.doesContinue) === true, slidesChanged: function() { $scope.currentSlide = slider.getPos(); - // Occasionally we need to trigger a digest + // Try to trigger a digest $timeout(function() {}); }, callback: function(slideIndex) { $scope.currentSlide = slideIndex; $scope.onSlideChanged({index:$scope.currentSlide}); $scope.$parent.$broadcast('slideBox.slideChanged', slideIndex); - $scope.$apply(); + + // Try to trigger a digest + $timeout(function() {}); } }); + $scope.$on('slideBox.nextSlide', function() { + slider.next(); + }); + + $scope.$on('slideBox.prevSlide', function() { + slider.prev(); + }); + + $scope.$on('slideBox.setSlide', function(e, index) { + slider.slide(index); + }); $scope.slider = slider; diff --git a/js/ext/angular/test/app_icon.png b/js/ext/angular/test/app_icon.png new file mode 100644 index 0000000000000000000000000000000000000000..57c77bb4e8381bfd9905a77acf15b63ce8ec3d9a GIT binary patch literal 12451 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 literal 0 HcmV?d00001 diff --git a/js/ext/angular/test/slideBox.html b/js/ext/angular/test/slideBox.html index f7a3125f6f..338e628ccb 100644 --- a/js/ext/angular/test/slideBox.html +++ b/js/ext/angular/test/slideBox.html @@ -14,30 +14,38 @@ @@ -46,23 +54,34 @@ -
-

Thank you for choosing my app!

-

- We've worked super hard to make you happy. -

-

- But if you are angry, please contact us at support@example.com -

+

Thank you for choosing the Awesome App!

+ +

+ We've worked super hard to make you happy. +

+

+ But if you are angry, too bad. +

+ + +

Using Awesome

+ +
+
Just three steps:
+
    +
  1. Be awesome
    2. +
  2. Stay awesome
    3. +
  3. There is no step 3
    4. +
-
-
- - -
-
+

Any questions?

+

+ Too bad! +

@@ -71,46 +90,64 @@ .controller('SlideCtrl', function($scope) { $scope.next = function() { + console.log('NEXT'); + $scope.$broadcast('slideBox.nextSlide'); }; - $scope.rightButtons = [ + + var rightButtons = [ { content: 'Next', type: 'button-positive button-clear', - onTap: function(e) { + tap: function(e) { + console.log('NEXT'); $scope.next(); } } ]; - $scope.leftButtons = [ + var leftButtons = [ { content: 'Skip', type: 'button-positive button-clear', - onTap: function(e) { + tap: function(e) { + alert('Skipping'); } } ]; + + $scope.leftButtons = leftButtons; + $scope.rightButtons = rightButtons; + + $scope.slideChanged = function(index) { console.log('Slide changed', index); + + if(index > 0) { + $scope.leftButtons = [ + { + content: 'Back', + type: 'button-positive button-clear', + tap: function(e) { + $scope.$broadcast('slideBox.prevSlide'); + } + } + ]; + } else { + $scope.leftButtons = leftButtons; + } + if(index == 2) { $scope.rightButtons = [ { content: 'Start using MyApp', type: 'button-positive button-clear', - onTap: function(e) { + tap: function(e) { + alert('Done!'); } } ]; } else { - $scope.rightButtons = [ - { - content: 'Next', - type: 'button-positive button-clear', - onTap: function(e) { - } - } - ]; + $scope.rightButtons = rightButtons; } - $scope.$apply(); }; }); diff --git a/scss/_slide-box.scss b/scss/_slide-box.scss index 1c38f222e7..a13a24c4cd 100644 --- a/scss/_slide-box.scss +++ b/scss/_slide-box.scss @@ -9,7 +9,6 @@ // Make sure items don't scroll over ever overflow: hidden; visibility: hidden; - background-color: #000; } .slider-slides { position: relative; @@ -22,7 +21,10 @@ float: left; vertical-align: top; - img { +} + +.slider-slide-image { + > img { width: 100%; } }