mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-11-07 15:07:13 +08:00
starting ajax stuff
This commit is contained in:
@ -1,2 +1,6 @@
|
|||||||
native-examples
|
Framework!
|
||||||
===============
|
===============
|
||||||
|
|
||||||
|
python -m SimpleHTTPServer 8000
|
||||||
|
|
||||||
|
http://localhost:8000/example/
|
||||||
@ -4,13 +4,17 @@
|
|||||||
<link rel="stylesheet" href="../dist/framework-theme-default.css">
|
<link rel="stylesheet" href="../dist/framework-theme-default.css">
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
|
||||||
|
|
||||||
<header class="bar-header">
|
<header class="bar-header">
|
||||||
<a class="button-prev" data-previous="true" href="#">
|
<a class="button-prev" data-history-go="-1" href="#">
|
||||||
Previous
|
Previous
|
||||||
</a>
|
</a>
|
||||||
<h1 class="title">Willkommen!</h1>
|
<h1 class="title">Willkommen!</h1>
|
||||||
</header>
|
</header>
|
||||||
<div class="content">
|
|
||||||
|
|
||||||
|
<main>
|
||||||
<p>
|
<p>
|
||||||
<a class="button button-default" href="grid.html">Grid</a>
|
<a class="button button-default" href="grid.html">Grid</a>
|
||||||
</p>
|
</p>
|
||||||
@ -20,9 +24,17 @@
|
|||||||
<p>
|
<p>
|
||||||
<a class="button button-secondary" href="index.html">Home</a>
|
<a class="button button-secondary" href="index.html">Home</a>
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</main>
|
||||||
<footer class="bar-footer">
|
|
||||||
</footer>
|
|
||||||
|
<footer class="bar-footer"></footer>
|
||||||
|
|
||||||
|
|
||||||
|
<script id="framework-globals" type="text/globals">
|
||||||
|
asdfasf
|
||||||
|
</script>
|
||||||
|
|
||||||
|
|
||||||
<script src="../js/jquery/jquery-1.10.2.js"></script>
|
<script src="../js/jquery/jquery-1.10.2.js"></script>
|
||||||
<script src="../js/framework/framework-utilities.js"></script>
|
<script src="../js/framework/framework-utilities.js"></script>
|
||||||
<script src="../js/framework/framework-navigation.js"></script>
|
<script src="../js/framework/framework-navigation.js"></script>
|
||||||
|
|||||||
@ -19,42 +19,49 @@
|
|||||||
|
|
||||||
// A link has been clicked
|
// A link has been clicked
|
||||||
function linkClick(e) {
|
function linkClick(e) {
|
||||||
var
|
|
||||||
target = e.target,
|
|
||||||
href = target.getAttribute("href");
|
|
||||||
|
|
||||||
// data-previous="true"
|
|
||||||
// shortcut if they just want to go to the previous page
|
|
||||||
if(target.dataset.previous === "true") {
|
|
||||||
window.history.back();
|
|
||||||
return preventDefault(e);
|
|
||||||
}
|
|
||||||
|
|
||||||
// if they clicked a link while scrolling don't nav to it
|
// if they clicked a link while scrolling don't nav to it
|
||||||
if(framework.isScrolling || href === "#") {
|
if(framework.isScrolling) {
|
||||||
return preventDefault(e);
|
e.preventDefault();
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
var
|
||||||
|
target = e.target;
|
||||||
|
|
||||||
|
// data-history-go="-1"
|
||||||
|
// shortcut if they just want to use window.history.go()
|
||||||
|
if(target.dataset.historyGo) {
|
||||||
|
window.history.go( parseInt(target.dataset.historyGo, 10) );
|
||||||
|
e.preventDefault();
|
||||||
|
return false;
|
||||||
}
|
}
|
||||||
|
|
||||||
// only intercept the nav click if they're going to the same domain
|
// only intercept the nav click if they're going to the same domain
|
||||||
if (location.protocol === target.protocol && location.host === target.host) {
|
if (location.protocol === target.protocol && location.host === target.host) {
|
||||||
// this link is an anchor to the same page
|
// this link is an anchor to the same page
|
||||||
if(href.indexOf("#") === 0) {
|
if(target.getAttribute("href").indexOf("#") === 0) {
|
||||||
hashLinkClick(target, href);
|
hashLinkClick(target);
|
||||||
} else {
|
} else {
|
||||||
pageLinkClick(target, href);
|
pageLinkClick(target);
|
||||||
}
|
}
|
||||||
return preventDefault(e);
|
e.preventDefault();
|
||||||
|
return false;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// they are navigating to another URL within the same domain
|
// they are navigating to another URL within the same domain
|
||||||
function pageLinkClick(target, href) {
|
function pageLinkClick(target) {
|
||||||
console.log("pageLinkClick, get:", href);
|
console.log("pageLinkClick, get:", target.href);
|
||||||
|
|
||||||
|
push({
|
||||||
|
url: target.href
|
||||||
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
// they are navigation to an anchor within the same page
|
// they are navigation to an anchor within the same page
|
||||||
function hashLinkClick(target, href) {
|
function hashLinkClick(target) {
|
||||||
console.log("hashLinkClick, get:", href);
|
console.log("hashLinkClick, get:", target.href);
|
||||||
}
|
}
|
||||||
|
|
||||||
function touchEnd(e) {
|
function touchEnd(e) {
|
||||||
@ -65,9 +72,28 @@
|
|||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
function preventDefault(e) {
|
function push(options) {
|
||||||
e.preventDefault();
|
framework.isRequesting = true;
|
||||||
return false;
|
var xhr = new XMLHttpRequest();
|
||||||
|
xhr.open('GET', options.url, true);
|
||||||
|
xhr.onreadystatechange = function() {
|
||||||
|
if (xhr.readyState === 4) {
|
||||||
|
if(xhr.status === 200) {
|
||||||
|
successRequest(xhr, options);
|
||||||
|
} else {
|
||||||
|
failedRequest(options.url);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
xhr.send();
|
||||||
|
}
|
||||||
|
|
||||||
|
function successRequest(xhr, options) {
|
||||||
|
framework.isRequesting = false;
|
||||||
|
}
|
||||||
|
|
||||||
|
function failedRequest(options) {
|
||||||
|
framework.isRequesting = false;
|
||||||
}
|
}
|
||||||
|
|
||||||
framework.on("ready", function(){
|
framework.on("ready", function(){
|
||||||
|
|||||||
0
js/framework/framework-page.js
Normal file
0
js/framework/framework-page.js
Normal file
Reference in New Issue
Block a user