Issue #36. [Ionic 1.2] - Create a module that demonstrates the Native scrolling feature

Author: genna

app/scripts/app.js

@@ -17,6 +17,7 @@ angular.module('starter', [
 	'supermodular.menu',
 	'supermodular.elements',
 	'supermodular.popover-menu',
+	'supermodular.native-scrolling',
 	'gMaps',
 	'ngCordova'
 ])

app/scripts/menu/menu.html

@@ -34,6 +34,10 @@ <h1 class="title">Left</h1>
 					<i class="icon ion-android-checkbox-outline"></i>
 					Elements
 				</ion-item>
+				<ion-item nav-clear menu-close class="item-icon-left" href="#/app/native-scrolling">
+					<i class="icon ion-ios-list-outline"></i>
+					Native scrolling
+				</ion-item>
 				<ion-item nav-clear menu-close class="item-icon-left" href="#/app/map">
 				<i class="icon ion-map"></i>
 					Map

app/scripts/native-scrolling/native-scrolling.controller.js

@@ -0,0 +1,29 @@
+(function() {
+	'use strict';
+
+	angular
+		.module('supermodular.native-scrolling')
+		.controller('NativeScrollingController', NativeScrollingController);
+
+	NativeScrollingController.$inject = ['nativeScrollingService'];
+
+	/* @ngInject */
+	function NativeScrollingController(nativeScrollingService) {
+		var vm = angular.extend(this, {
+			items: []
+		});
+
+		(function activate() {
+			getItems();
+		})();
+
+		// ********************************************************************
+
+		function getItems() {
+			nativeScrollingService.getItems(200)
+				.then(function(items) {
+					vm.items = items;
+				});
+		}
+	}
+})();

app/scripts/native-scrolling/native-scrolling.html

@@ -0,0 +1,9 @@
+<ion-view view-title="Native scrolling">
+	<ion-content>
+		<ion-list ng-repeat="item in vm.items">
+			<ion-item>
+				{{item}}
+			</ion-item>
+		</ion-list>
+	</ion-content>
+</ion-view>

app/scripts/native-scrolling/native-scrolling.module.js

@@ -0,0 +1,21 @@
+(function() {
+	'use strict';
+
+	angular
+		.module('supermodular.native-scrolling', [
+			'ionic',
+			'supermodular.common'
+		])
+		.config(function($stateProvider) {
+			$stateProvider
+				.state('app.native-scrolling', {
+					url: '/native-scrolling',
+					views: {
+						'menuContent': {
+							templateUrl: 'scripts/native-scrolling/native-scrolling.html',
+							controller: 'NativeScrollingController as vm'
+						}
+					}
+				});
+		});
+})();

app/scripts/native-scrolling/native-scrolling.service.js

@@ -0,0 +1,27 @@
+(function() {
+	'use strict';
+
+	angular
+		.module('supermodular.native-scrolling')
+		.factory('nativeScrollingService', nativeScrollingService);
+
+	nativeScrollingService.$inject = ['$q'];
+
+	/* @ngInject */
+	function nativeScrollingService($q) {
+		var service = {
+			getItems: getItems
+		};
+		return service;
+
+		// *************************************************************************
+
+		function getItems(numberOfItems) {
+			var items = [];
+			for (var i = 0;i < numberOfItems;i++) {
+				items.push('Item #' + (i + 1));
+			}
+			return $q.when(items);
+		}
+	}
+})();