<!DOCTYPE html>
<html>
<head>
<title>Qlite Test</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="../Qlite.js"></script>
<style>
* {
margin: 2px;
padding: 2px 4px;
font-family: Arial;
}
.resolved {
background: #5f5;
}
.pending {
background: #55f;
color: #fff;
font-weight: bold;
}
.rejected {
background: #f55;
}
</style>
</head>
<body>
<h1>Qlite Test</h1>
<h4>Q.defer()</h4>
<button onclick="resolve(a)">resolve(a)</button>
<button onclick="delay(a)">delay(a)</button>
<button onclick="reject(a)">reject(a)</button>
<p id="a" class="pending">a Pending</p>
<button onclick="resolve(b)">resolve(b)</button>
<button onclick="delay(b)">delay(b)</button>
<button onclick="reject(b)">reject(b)</button>
<p id="b" class="pending">b Pending</p>
<button onclick="resolve(c)">resolve(c)</button>
<button onclick="delay(c)">delay(c)</button>
<button onclick="reject(c)">reject(c)</button>
<p id="c" class="pending">c Pending</p>
<button onclick="resolve(d)">resolve(d)</button>
<button onclick="delay(d)">delay(d)</button>
<button onclick="reject(d)">reject(d)</button>
<p id="d" class="pending">d Pending</p>
<h4>Q.all()</h4>
<p id="ab" class="pending">ab Pending</p>
<p id="ac" class="pending">ac Pending</p>
<p id="ad" class="pending">ad Pending</p>
<p id="abc" class="pending">abc Pending</p>
<p id="abd" class="pending">abd Pending</p>
<p id="abcd" class="pending">abcd Pending</p>
<script>
var a = Q.defer();
var b = Q.defer();
var c = Q.defer();
var d = Q.defer();
var resolve = function (deferred) {
deferred.resolve();
};
var reject = function (deferred) {
deferred.reject();
};
var delay = function (deferred) {
setTimeout(function () {
deferred.resolve();
}, 4000);
};
function update(elementId, status, message) {
var element = document.getElementById(elementId);
element.className = status;
element.innerText = message || elementId + " " + status;
}
var foo = a.then(function () {
update("a", "resolved");
}).catch(function () {
update("a", "rejected");
});
b.then(function () {
update("b", "resolved");
}).catch(function () {
update("b", "rejected");
});
c.then(function () {
update("c", "resolved");
}).catch(function () {
update("c", "rejected");
});
d.then(function () {
update("d", "resolved");
}).catch(function () {
update("d", "rejected");
});
Q.all([a, b]).then(function () {
update("ab", "resolved");
}).catch(function () {
update("ab", "rejected");
});
Q.all([a, b, c]).then(function () {
update("abc", "resolved");
}).catch(function () {
update("abc", "rejected");
});
Q.all([a, b, d]).then(function () {
update("abd", "resolved");
}).catch(function () {
update("abd", "rejected");
});
Q.all([a, b, c, d]).then(function () {
update("abcd", "resolved");
}).catch(function () {
update("abcd", "rejected");
});
Q.all([a, c]).then(function () {
update("ac", "resolved");
}).catch(function () {
update("ac", "rejected");
});
Q.all([a, d]).then(function () {
update("ad", "resolved");
}).catch(function () {
update("ad", "rejected");
});
</script>
</body>
</html>
|
Download
