Cleaned up examples folder
Max Lynch
@ -1,27 +0,0 @@
|
|||||||
.pane {
|
|
||||||
position: fixed;
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
.reveal-animation {
|
|
||||||
/*
|
|
||||||
-webkit-transform: translate3d(0%, 0, 0);
|
|
||||||
transform: translate3d(0%, 0, 0);
|
|
||||||
|
|
||||||
-webkit-transition: -webkit-transform 1s ease-in-out;
|
|
||||||
transition: transform 1s ease-in-out;
|
|
||||||
*/
|
|
||||||
}
|
|
||||||
.reveal-animation.ng-enter {
|
|
||||||
-webkit-transition: 0.2s linear all;
|
|
||||||
-webkit-transform:translate3d(100%,0,0) ;
|
|
||||||
}
|
|
||||||
.reveal-animation.ng-enter-active {
|
|
||||||
-webkit-transform:translate3d(0,0,0) ;
|
|
||||||
}
|
|
||||||
.reveal-animation.ng-leave {
|
|
||||||
-webkit-transition: 0.2s linear all;
|
|
||||||
-webkit-transform:translate3d(0,0,0);
|
|
||||||
}
|
|
||||||
.reveal-animation.ng-leave-active {
|
|
||||||
-webkit-transform:translate3d(-100%,0,0);
|
|
||||||
}
|
|
||||||
@ -1,47 +0,0 @@
|
|||||||
document.addEventListener('touchstart', function() {});
|
|
||||||
|
|
||||||
var app = angular.module('peopleApp', ['ngRoute', 'ngAnimate']);
|
|
||||||
|
|
||||||
app.config( ["$routeProvider", function($routeProvider){
|
|
||||||
$routeProvider.when("/customers", {"templateUrl" : "customers.html", controller: 'CustomersCtrl'});
|
|
||||||
$routeProvider.when("/customer/:id", {"templateUrl" : "customer.html", controller: 'CustomerCtrl'});
|
|
||||||
$routeProvider.otherwise({"redirectTo":"/customers"});
|
|
||||||
|
|
||||||
}]
|
|
||||||
);
|
|
||||||
|
|
||||||
app.provider('Customers', function() {
|
|
||||||
var customers = [
|
|
||||||
{'name': 'Max Lynch', id: 1},
|
|
||||||
{'name': 'Max Lynch', id: 2},
|
|
||||||
{'name': 'Max Lynch', id: 3},
|
|
||||||
{'name': 'Max Lynch', id: 4},
|
|
||||||
{'name': 'Max Lynch', id: 5},
|
|
||||||
{'name': 'Max Lynch', id: 6},
|
|
||||||
{'name': 'Max Lynch', id: 7},
|
|
||||||
{'name': 'Max Lynch', id: 8},
|
|
||||||
{'name': 'Max Lynch', id: 9},
|
|
||||||
{'name': 'Max Lynch', id: 10},
|
|
||||||
{'name': 'Max Lynch', id: 11},
|
|
||||||
];
|
|
||||||
|
|
||||||
this.$get = function() {
|
|
||||||
return {
|
|
||||||
list: customers,
|
|
||||||
getById: function(id) {
|
|
||||||
for(var i = 0; i < this.list.length; i++) { if(this.list[i].id == id) return this.list[i]; }
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
app.controller('CustomersCtrl', function($scope, Customers) {
|
|
||||||
$scope.customers = Customers;
|
|
||||||
});
|
|
||||||
|
|
||||||
app.controller('CustomerCtrl', function($scope, $routeParams, Customers) {
|
|
||||||
var id = $routeParams.id;
|
|
||||||
var customer = Customers.getById(id);
|
|
||||||
$scope.customer = customer;
|
|
||||||
console.log('Showing user', id, customer);
|
|
||||||
});
|
|
||||||
@ -1,54 +0,0 @@
|
|||||||
<html>
|
|
||||||
<head>
|
|
||||||
<meta charset="utf-8">
|
|
||||||
<title>Example</title>
|
|
||||||
|
|
||||||
<!-- Sets initial viewport load and disables zooming -->
|
|
||||||
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
|
|
||||||
<link rel="stylesheet" href="../dist/ionic.css">
|
|
||||||
<link rel="stylesheet" href="app.css">
|
|
||||||
<style>
|
|
||||||
.swiperight {
|
|
||||||
-webkit-transition: 0.1s ease-in-out all;
|
|
||||||
-webkit-transform:translate3d(120%,0,0) ;
|
|
||||||
}
|
|
||||||
#remove-box {
|
|
||||||
width: 200px;
|
|
||||||
height: 200px;
|
|
||||||
}
|
|
||||||
.relative {
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
button {
|
|
||||||
width: 100px;
|
|
||||||
height: 100px;
|
|
||||||
}
|
|
||||||
.overlay {
|
|
||||||
position: absolute;
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
z-index: 2;
|
|
||||||
background-color: red;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<div class="content padded">
|
|
||||||
<a href="#" id="tap-button" class="button button-success">Tap me!</a>
|
|
||||||
<a href="#" id="swipe-button" class="button button-success">Swipe me!</a>
|
|
||||||
<div id="remove-box" class="relative">
|
|
||||||
<div id="remove-box-overlay" class="overlay">Tap to remove me</div>
|
|
||||||
<form action="/badurl">
|
|
||||||
<button type="submit">Under click</button>
|
|
||||||
</form>
|
|
||||||
</div>
|
|
||||||
<div id="event-log"></div>
|
|
||||||
</div>
|
|
||||||
<script src="../js/utils.js"></script>
|
|
||||||
<script src="../js/gestures.js"></script>
|
|
||||||
<script src="../js/events.js"></script>
|
|
||||||
<script src="events.js"></script>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
@ -1,90 +0,0 @@
|
|||||||
var logEvent = function(data) {
|
|
||||||
var e = document.getElementById('event-log');
|
|
||||||
var l = document.createElement('div');
|
|
||||||
l.innerHTML = 'EVENT: ' + data.type;
|
|
||||||
console.log(data.event);
|
|
||||||
e.appendChild(l);
|
|
||||||
}
|
|
||||||
|
|
||||||
var tb = document.getElementById('tap-button');
|
|
||||||
var sb = document.getElementById('swipe-button');
|
|
||||||
var rb = document.getElementById('remove-box-overlay');
|
|
||||||
|
|
||||||
window.FM.on('click', function(e) {
|
|
||||||
console.log('GOT CLICK', e);
|
|
||||||
logEvent({
|
|
||||||
type: 'click',
|
|
||||||
event: e
|
|
||||||
});
|
|
||||||
}, tb);
|
|
||||||
|
|
||||||
window.FM.onGesture('tap', function(e) {
|
|
||||||
e.target.parentNode.removeChild(e.target);
|
|
||||||
console.log('GOT CLICK ON BOX', e);
|
|
||||||
logEvent({
|
|
||||||
type: 'clickbox',
|
|
||||||
event: e
|
|
||||||
});
|
|
||||||
}, rb);
|
|
||||||
|
|
||||||
window.FM.onGesture('tap', function(e) {
|
|
||||||
console.log('GOT TAP', e);
|
|
||||||
logEvent({
|
|
||||||
type: 'tap',
|
|
||||||
event: e
|
|
||||||
});
|
|
||||||
}, tb);
|
|
||||||
window.FM.onGesture('touch', function(e) {
|
|
||||||
console.log('GOT TOUCH', e);
|
|
||||||
logEvent({
|
|
||||||
type: 'touch',
|
|
||||||
event: e
|
|
||||||
});
|
|
||||||
}, tb);
|
|
||||||
|
|
||||||
window.FM.onGesture('release', function(e) {
|
|
||||||
console.log('GOT RELEASE', e);
|
|
||||||
logEvent({
|
|
||||||
type: 'release',
|
|
||||||
event: e
|
|
||||||
});
|
|
||||||
}, tb);
|
|
||||||
window.FM.onGesture('swipe', function(e) {
|
|
||||||
console.log('GOT SWIPE', e);
|
|
||||||
logEvent({
|
|
||||||
type: 'swipe',
|
|
||||||
event: e
|
|
||||||
});
|
|
||||||
}, sb);
|
|
||||||
window.FM.onGesture('swiperight', function(e) {
|
|
||||||
console.log('GOT SWIPE RIGHT', e);
|
|
||||||
logEvent({
|
|
||||||
type: 'swiperight',
|
|
||||||
event: e
|
|
||||||
});
|
|
||||||
|
|
||||||
e.target.classList.add('swiperight');
|
|
||||||
}, sb);
|
|
||||||
window.FM.onGesture('swipeleft', function(e) {
|
|
||||||
console.log('GOT SWIPE LEFT', e);
|
|
||||||
logEvent({
|
|
||||||
type: 'swipeleft',
|
|
||||||
event: e
|
|
||||||
});
|
|
||||||
|
|
||||||
e.target.classList.add('swipeleft');
|
|
||||||
}, sb);
|
|
||||||
window.FM.onGesture('swipeup', function(e) {
|
|
||||||
console.log('GOT SWIPE UP', e);
|
|
||||||
logEvent({
|
|
||||||
type: 'swipeup',
|
|
||||||
event: e
|
|
||||||
});
|
|
||||||
}, sb);
|
|
||||||
window.FM.onGesture('swipedown', function(e) {
|
|
||||||
console.log('GOT SWIPE DOWN', e);
|
|
||||||
logEvent({
|
|
||||||
type: 'swipedown',
|
|
||||||
event: e
|
|
||||||
});
|
|
||||||
}, sb);
|
|
||||||
|
Before Width: | Height: | Size: 20 KiB After Width: | Height: | Size: 20 KiB |
|
Before Width: | Height: | Size: 1.4 KiB After Width: | Height: | Size: 1.4 KiB |
|
Before Width: | Height: | Size: 1.8 KiB After Width: | Height: | Size: 1.8 KiB |
|
Before Width: | Height: | Size: 7.5 KiB After Width: | Height: | Size: 7.5 KiB |
|
Before Width: | Height: | Size: 12 KiB After Width: | Height: | Size: 12 KiB |
|
Before Width: | Height: | Size: 29 KiB After Width: | Height: | Size: 29 KiB |
|
Before Width: | Height: | Size: 49 KiB After Width: | Height: | Size: 49 KiB |
|
Before Width: | Height: | Size: 16 KiB After Width: | Height: | Size: 16 KiB |
|
Before Width: | Height: | Size: 193 KiB After Width: | Height: | Size: 193 KiB |
|
Before Width: | Height: | Size: 136 KiB After Width: | Height: | Size: 136 KiB |
|
Before Width: | Height: | Size: 403 KiB After Width: | Height: | Size: 403 KiB |
|
Before Width: | Height: | Size: 348 KiB After Width: | Height: | Size: 348 KiB |
|
Before Width: | Height: | Size: 221 KiB After Width: | Height: | Size: 221 KiB |
|
Before Width: | Height: | Size: 133 KiB After Width: | Height: | Size: 133 KiB |
|
Before Width: | Height: | Size: 180 KiB After Width: | Height: | Size: 180 KiB |
|
Before Width: | Height: | Size: 13 KiB After Width: | Height: | Size: 13 KiB |