Skip to content

Commit efbc7f1

Browse files
mlynchmlynch
committed
Some new text examples for fun 🎅
1 parent b9449c7 commit efbc7f1

9 files changed

+568
-0
lines changed

Diff for: ‎test/html/contenteditable.html

+47
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,47 @@
1+
2+
<!DOCTYPE html>
3+
<html ng-app="navTest">
4+
<head>
5+
<meta charset="utf-8">
6+
<title>Content</title>
7+
8+
<!-- Sets initial viewport load and disables zooming -->
9+
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
10+
<link rel="stylesheet" href="../../../../dist/css/ionic.css">
11+
12+
<script src="../../../../dist/js/ionic.bundle.js"></script>
13+
</head>
14+
<body>
15+
<ion-pane>
16+
<ion-header-bar id="header" class="bar-positive">
17+
<h1 class="title">Video Test</h1>
18+
</ion-header-bar>
19+
20+
<ion-content id="container">
21+
<div contenteditable="true" data-tap-disabled="true">
22+
<h1>Test for &lt;video /&gt; native controls.</h1>
23+
<h2>Confirmed by the behavior of the browser Internet Explorer 11.</h2>
24+
25+
<p>default: (working)</p>
26+
<video id="without" controls="controls">
27+
<source src="http://www.w3schools.com/html/mov_bbb.mp4" type="video/mp4" />
28+
</video>
29+
30+
<p>with stopPropagation on mousedown: (working)</p>
31+
<video id="with-propagation" controls="controls">
32+
<source src="http://www.w3schools.com/html/mov_bbb.mp4" type="video/mp4" />
33+
</video>
34+
35+
<p>with preventDefault on mousedown: (<strong>doesn't working</strong>)</p>
36+
<video id="with-prevent" controls="controls">
37+
<source src="http://www.w3schools.com/html/mov_bbb.mp4" type="video/mp4" />
38+
</video>
39+
</div>
40+
</ion-content>
41+
</ion-pane>
42+
43+
<script>
44+
angular.module('navTest', ['ionic'])
45+
</script>
46+
</body>
47+
</html>

Diff for: ‎test/html/input-range.html

+34
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
<html ng-app="ionicApp">
2+
<head>
3+
<meta charset="utf-8">
4+
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
5+
6+
<title>Radio Buttons</title>
7+
8+
<link rel="stylesheet" href="../../dist/css/ionic.css">
9+
<script src="../../../../dist/js/ionic.bundle.js"></script>
10+
</head>
11+
12+
<body ng-controller="MainCtrl">
13+
14+
<ion-header-bar class="bar-positive">
15+
<h1 class="title">Radio Buttons</h1>
16+
</ion-header-bar>
17+
18+
<ion-content>
19+
<div class="list">
20+
<div class="item range range-positive">
21+
<i class="icon ion-ios-sunny-outline"></i>
22+
<input type="range" name="volume" min="0" max="100" value="33">
23+
<i class="icon ion-ios-sunny"></i>
24+
</div>
25+
</div>
26+
</ion-content>
27+
<script>
28+
angular.module('ionicApp', ['ionic'])
29+
.controller('MainCtrl', function($scope) {
30+
$scope.formData = {};
31+
});
32+
</script>
33+
</body>
34+
</html>

Diff for: ‎test/html/loading.html

+8
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,14 @@
2323
delay: 100,
2424
duration: 3000
2525
});
26+
$ionicLoading.hide();
27+
$ionicLoading.show({
28+
//template: '<div>Connection problem.</div><br/><div>Please check your internet connection!</div>',
29+
delay: 100,
30+
duration: 3000
31+
});
32+
33+
console.log('Loading', l);
2634
};
2735
});
2836
</script>

Diff for: ‎test/html/navParams.html

+123
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,123 @@
1+
<html ng-app="nav">
2+
<head>
3+
<meta charset="utf-8">
4+
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
5+
6+
<title>navViews and ion-tabs w/ nested navViews</title>
7+
8+
<link rel="stylesheet" href="../../../../dist/css/ionic.css">
9+
<script src="../../../../dist/js/ionic.bundle.js"></script>
10+
<script src="dom-trace.js"></script>
11+
</head>
12+
<body>
13+
14+
<div>
15+
<ion-nav-bar class="bar-positive">
16+
<ion-nav-back-button class="button-icon" from-title>
17+
Back
18+
</ion-nav-back-button>
19+
</ion-nav-bar>
20+
<ion-nav-view></ion-nav-view>
21+
</div>
22+
23+
<script id="page1.html" type="text/ng-template">
24+
<ion-view title="Page 1">
25+
<ion-nav-buttons side="right">
26+
<button class="button button-icon ion-android-search"></button>
27+
</ion-nav-buttons>
28+
<ion-content padding="true">
29+
<h2>Random {{random}}</h2>
30+
<ion-list>
31+
<div class="item item-divider">
32+
Things
33+
</div>
34+
<ion-item ng-repeat="item in items" ui-sref="page2({itemId: item.id})">
35+
Item {{$index}}
36+
</ion-item>
37+
<div class="item item-divider">
38+
Stuff
39+
</div>
40+
<ion-item ng-repeat="item in items2" ui-sref="page2({item: item})">
41+
Item {{$index}}
42+
</ion-item>
43+
</ion-list>
44+
</ion-content>
45+
</ion-view>
46+
</script>
47+
<script id="page2.html" type="text/ng-template">
48+
<ion-view title="Page 2">
49+
<ion-content padding="true">
50+
<h2>Item ID: {{itemId}}</h2>
51+
<a ng-click="goBack()" class="button button-positive">Back</a>
52+
<a ui-sref="page3({itemId: itemId})" class="button button-positive">Page 3</a>
53+
</ion-content>
54+
</ion-view>
55+
</script>
56+
<script id="page3.html" type="text/ng-template">
57+
<ion-view title="Page 3">
58+
<ion-content padding="true">
59+
<h2>IITTEEEM {{itemId}}</h2>
60+
<a ng-click="goBack()" class="button button-positive">Back</a>
61+
<a href="#/page1" class="button button-positive">Page 1</a>
62+
</ion-content>
63+
</ion-view>
64+
</script>
65+
<script>
66+
angular.module('nav', ['ionic'])
67+
68+
.config(function($stateProvider, $urlRouterProvider, $ionicConfigProvider) {
69+
70+
//$ionicConfigProvider.views.maxCache(0);
71+
72+
$stateProvider
73+
.state('page1', {
74+
url: "/page1",
75+
templateUrl: "page1.html",
76+
controller: 'Page1Ctrl'
77+
})
78+
.state('page2', {
79+
url: "/page2/:itemId",
80+
templateUrl: "page2.html",
81+
controller: 'Page2Ctrl'
82+
})
83+
.state('page3', {
84+
url: "/page3/:itemId",
85+
templateUrl: "page3.html",
86+
controller: 'Page3Ctrl'
87+
})
88+
89+
$urlRouterProvider.otherwise("/page1");
90+
})
91+
92+
.controller('Page1Ctrl', function($scope, $ionicHistory) {
93+
$scope.random = Math.random() * 100;
94+
$scope.items = [];
95+
for(var i = 0; i < 4; i++) {
96+
$scope.items.push({ id: i });
97+
}
98+
99+
$scope.items2 = [];
100+
for(var i = 0; i < 4; i++) {
101+
$scope.items2.push({id: i});
102+
}
103+
})
104+
105+
.controller('Page2Ctrl', function($timeout, $scope, $ionicNavBarDelegate, $ionicHistory, $stateParams) {
106+
console.log('Page 2 params', $stateParams);
107+
$scope.itemId = $stateParams.itemId;
108+
$scope.goBack = function() {
109+
$ionicNavBarDelegate.back();
110+
};
111+
})
112+
113+
.controller('Page3Ctrl', function($scope, $ionicNavBarDelegate, $stateParams) {
114+
console.log('State params 3', $stateParams);
115+
$scope.itemId = $stateParams.itemId;
116+
$scope.goBack = function() {
117+
$ionicNavBarDelegate.back();
118+
};
119+
})
120+
121+
</script>
122+
</body>
123+
</html>

Diff for: ‎test/html/openLayers.html

+59
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,59 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta charset="utf-8">
5+
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
6+
7+
<title>Maps</title>
8+
9+
<script type="text/javascript" src="http://maps.google.com/maps/api/js?v=3.15&sensor=true&region=PL&language=pl"></script>
10+
<script type="text/javascript" src="http://google-maps-utility-library-v3.googlecode.com/svn/tags/markerwithlabel/1.1.9/src/markerwithlabel.js"></script>
11+
<link rel="stylesheet" href="../../../../dist/css/ionic.css">
12+
<link rel="stylesheet" href="http://openlayers.org/en/v3.11.2/css/ol.css">
13+
<script src="http://openlayers.org/en/v3.11.2/build/ol.js"></script>
14+
<script src="../../../../dist/js/ionic.bundle.js"></script>
15+
<style>
16+
.map:-moz-full-screen {
17+
height: 100%;
18+
}
19+
.map:-webkit-full-screen {
20+
height: 100%;
21+
}
22+
.map:fullscreen {
23+
height: 100%;
24+
}
25+
/* position the rotate control lower than usual */
26+
.ol-rotate {
27+
top: 3em;
28+
}
29+
30+
</style>
31+
</head>
32+
<body ng-controller="mainCtrl">
33+
<div class="row-fluid">
34+
<div class="span12">
35+
<div id="map" class="map" data-tap-disabled="true"></div>
36+
</div>
37+
</div>
38+
<script>
39+
var map = new ol.Map({
40+
interactions: ol.interaction.defaults().extend([
41+
new ol.interaction.DragRotateAndZoom()
42+
]),
43+
layers: [
44+
new ol.layer.Tile({
45+
source: new ol.source.OSM({})
46+
})
47+
],
48+
// Use the canvas renderer because it's currently the fastest
49+
target: 'map',
50+
view: new ol.View({
51+
center: [-33519607, 5616436],
52+
rotation: -Math.PI / 8,
53+
zoom: 8
54+
})
55+
});
56+
57+
</script>
58+
</body>
59+
</html>

Diff for: ‎test/html/popupRace.html

+35
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
<html ng-app="myApp">
2+
<head>
3+
<meta charset="utf-8">
4+
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
5+
6+
<title>Ionic Pull to Refresh</title>
7+
8+
<link rel="stylesheet" href="../../dist/css/ionic.css">
9+
<script src="../../../../dist/js/ionic.bundle.js"></script>
10+
</head>
11+
<ion-content ng-controller="HomeCtrl as homeCtrl">
12+
<button class="button button-positive"
13+
ng-click="homeCtrl.showAlerts()">Click Me</button>
14+
</ion-content>
15+
<script>
16+
var app = angular.module('myApp', ['ionic']);
17+
app.controller('HomeCtrl', function($scope, $ionicPopup, $state, $timeout) {
18+
this.showAlerts = function() {
19+
/* show first popup */
20+
var alertPopup = $ionicPopup.alert({
21+
title: 'First Popup',
22+
template: 'You don\'t see me'
23+
});
24+
/* something changed - close immediately and show different popup */
25+
alertPopup.close();
26+
/*
27+
var newPopup = $ionicPopup.alert({
28+
title: 'Second Popup',
29+
buttons: [{text: 'You can\'t close me', type: 'button-assertive'}],
30+
template: 'Ouch, stuck with new message'
31+
});*/
32+
};
33+
});
34+
</script>
35+
</html>

Diff for: ‎test/html/sideMenuExpose.html

+74
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,74 @@
1+
<!DOCTYPE html>
2+
<html ng-app="sideMenuTest">
3+
<head>
4+
<meta charset="utf-8">
5+
<title>Side Menus</title>
6+
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
7+
<link rel="stylesheet" href="../../../../dist/css/ionic.css">
8+
<script src="../../../../dist/js/ionic.bundle.js"></script>
9+
</head>
10+
<body>
11+
<div>
12+
<ion-side-menus>
13+
14+
<ion-side-menu side="left">
15+
<header class="bar bar-header bar-stable">
16+
<h1 class="title">Left</h1>
17+
</header>
18+
<ion-content class="has-header">
19+
<ion-list>
20+
<ion-item nav-clear menu-close href="#/app/search">
21+
Search
22+
</ion-item>
23+
<ion-item nav-clear menu-close href="#/app/browse">
24+
Browse
25+
</ion-item>
26+
<ion-item nav-clear menu-close href="#/app/playlists">
27+
Playlists
28+
</ion-item>
29+
</ion-list>
30+
</ion-content>
31+
</ion-side-menu>
32+
33+
<ion-pane ion-side-menu-content>
34+
<ion-nav-bar class="bar-stable">
35+
<ion-nav-back-button class="button-clear"><i class="icon ion-chevron-left"></i> Back</ion-nav-back-button>
36+
</ion-nav-bar>
37+
<ion-nav-view name="menuContent" animation="slide-left-right"></ion-nav-view>
38+
<ion-nav-buttons side="right">
39+
<button menu-toggle="right" class="button button-icon icon ion-navicon"></button>
40+
</ion-nav-buttons>
41+
</ion-pane>
42+
43+
<ion-side-menu side="right" expose-aside-when="large">
44+
<header class="bar bar-header bar-stable">
45+
<h1>Right</h1>
46+
</header>
47+
<ion-content class="has-header">
48+
test
49+
</ion-content>
50+
</ion-side-menu>
51+
</ion-side-menus>
52+
</div>
53+
54+
<script>
55+
angular.module('sideMenuTest', ['ionic'])
56+
57+
.controller('MenuCtrl', function($scope, $ionicSideMenuDelegate) {
58+
59+
$scope.list = [];
60+
for(var i = 0; i < 20; i++) {
61+
$scope.list.push({
62+
text: 'Item ' + i
63+
});
64+
}
65+
})
66+
67+
.controller('LeftCtrl', function($scope) {
68+
$scope.value = true;
69+
$scope.list = [{text:1},{text:2},{text:3}];
70+
});
71+
72+
</script>
73+
</body>
74+
</html>

0 commit comments

Comments
 (0)