Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

bacon.js implementation #417

Closed
wants to merge 2 commits into from
Closed

bacon.js implementation #417

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
45e9ba2
bacon.js implementation
raimohanska Feb 1, 2013
3a8e05a
tab indent, fix jshint errors
raimohanska Feb 2, 2013
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
4 changes: 4 additions & 0 deletions labs/architecture-examples/baconjs/css/app.css
View file
Open in desktop
@@ -0,0 +1,4 @@
/* base.css overrides */
#main,#footer {
display: none;
}
65 changes: 65 additions & 0 deletions labs/architecture-examples/baconjs/index.html
View file
Open in desktop
@@ -0,0 +1,65 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Bacon.js • TodoMVC</title>
<link rel="stylesheet" href="../../../assets/base.css">
<link rel="stylesheet" href="css/app.css">
<!--[if IE]>
<script src="../../../assets/ie.js"></script>
<![endif]-->
</head>
<body>
<script type="text/html" id="todo-template">
<li>
<div class="view">
<input class="toggle" type="checkbox">
<label></label>
<button class="destroy"></button>
</div>
<input class="edit">
</li>
</script>
<section id="todoapp">
<header id="header">
<h1>todos</h1>
<input id="new-todo" placeholder="What needs to be done?" autofocus>
</header>
<section id="main">
<input id="toggle-all" type="checkbox">
<label for="toggle-all">Mark all as complete</label>
<ul id="todo-list">
</ul>
</section>
<footer id="footer">
<span id="todo-count"><strong>1</strong> item left</span>
<ul id="filters">
<li>
<a href="#/">All</a>
</li>
<li>
<a href="#/active">Active</a>
</li>
<li>
<a href="#/completed">Completed</a>
</li>
</ul>
<button id="clear-completed">Clear completed (<span class="count"></span>)</button>
</footer>
</section>
<footer id="info">
<p>Double-click to edit a todo</p>
<p>Created by <a href="http://github.com/raimohanska">Juha Paananen</a></p>
<p>Part of <a href="http://todomvc.com">TodoMVC</a></p>
</footer>
<script src="../../../assets/base.js"></script>
<script src="../../../assets/jquery.min.js"></script>
<script src="../../../assets/lodash.min.js"></script>
<script src="../../../assets/handlebars.min.js"></script>
<script src="js/jquery-hashchange-min.js"></script>
<script src="js/Bacon.js"></script>
<script src="js/Bacon.UI.js"></script>
<script src="js/app.js"></script>
</body>
</html>
67 changes: 67 additions & 0 deletions labs/architecture-examples/baconjs/js/Bacon.UI.js
View file
Open in desktop
@@ -0,0 +1,67 @@
(function() {
var isChrome = navigator.userAgent.toLowerCase().indexOf('chrome') > -1;
function nonEmpty(x) { return x && x.length > 0 }

Bacon.UI = {}
Bacon.UI.textFieldValue = function(textfield, initValue) {
function getValue() { return textfield.val() }
function autofillPoller() {
if (textfield.attr("type") == "password")
return Bacon.interval(100)
else if (isChrome)
return Bacon.interval(100).take(20).map(getValue).filter(nonEmpty).take(1)
else
return Bacon.never()
}
if (initValue !== null) {
textfield.val(initValue)
}
return textfield.asEventStream("keyup input").
merge(textfield.asEventStream("cut paste").delay(1)).
merge(autofillPoller()).
map(getValue).toProperty(getValue()).skipDuplicates()
}
Bacon.UI.optionValue = function(option) {
function getValue() { return option.val() }
return option.asEventStream("change").map(getValue).toProperty(getValue())
}
Bacon.UI.checkBoxGroupValue = function(checkboxes, initValue) {
function selectedValues() {
return checkboxes.filter(":checked").map(function(i, elem) { return $(elem).val()}).toArray()
}
if (initValue) {
checkboxes.each(function(i, elem) {
$(elem).attr("checked", initValue.indexOf($(elem).val()) >= 0)
})
}
return checkboxes.asEventStream("click").map(selectedValues).toProperty(selectedValues())
}
Bacon.UI.ajax = function(params) {
return Bacon.fromPromise($.ajax(params))
}
Bacon.Observable.prototype.awaiting = function(response) {
return this.map(true).merge(response.map(false)).toProperty(false).skipDuplicates()
}
Bacon.EventStream.prototype.ajax = function() {
return this["switch"](Bacon.UI.ajax)
}
Bacon.UI.radioGroupValue = function(options, initValue) {
var initialValue = options.filter(':checked').val()
if (initValue) {
options.filter("[value=" + initValue + "]").attr("checked", true)
}
return options.asEventStream("change").map('.target.value').toProperty(initialValue)
}
Bacon.UI.checkBoxValue = function(checkbox, initValue) {
if (initValue !== null) {
checkbox.attr("checked", initValue)
}
function isChecked() { return !!checkbox.attr("checked") }
return checkbox.asEventStream("change").map(isChecked).toProperty(isChecked()).skipDuplicates()
}
Bacon.UI.hash = function(defaultValue) {
if (defaultValue === undefined) defaultValue = ""
function getHash() { return !!document.location.hash ? document.location.hash : defaultValue }
return $(window).asEventStream("hashchange").map(getHash).toProperty(getHash()).skipDuplicates()
}
})();