Created
February 10, 2014 19:49
-
-
Save anonymous/8922874 to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| .hide { | |
| display: none; | |
| } | |
| #lnkNew { | |
| font-size: .85em; | |
| font-weight: normal; | |
| margin-left: 1em; | |
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> | |
| <script> | |
| var cache = {}; | |
| function publish(topic, args) { | |
| cache[topic] && $.each(cache[topic], function () { | |
| this.apply($, args || []); | |
| }); | |
| } | |
| function subscribe(topic, callback) { | |
| if (!cache[topic]) { | |
| cache[topic] = []; | |
| } | |
| cache[topic].push(callback); | |
| return [topic, callback]; | |
| } | |
| function unsubscribe(handle) { | |
| //remove a subscribed function for a topic | |
| var t = handle[0]; | |
| cache[t] && $.each(cache[t], function (i) { | |
| if (this === handle[1]) { | |
| cache[t].splice(i, 1); | |
| } | |
| }); | |
| } | |
| $(document).ready(function() { | |
| $('#lnkNew').click(function() { | |
| publish('/person/add', []); | |
| }); | |
| $('#btnSubmit').click(function() { | |
| publish('/person/added', [$('#txtName').val()]); | |
| }); | |
| }); | |
| </script> | |
| <meta charset="utf-8"> | |
| <title>JS Bin</title> | |
| </head> | |
| <body> | |
| <div id="addPerson" class="hide"> | |
| <label for="txtName">Name:</label> | |
| <input type="text" id="txtName" /> | |
| <button id="btnSubmit">Add New Person</button> | |
| </div> | |
| <div id="people"> | |
| <h4>Publix Peeps <a href="#" id="lnkNew">Add Person</a></h4> | |
| <ul> | |
| <li>Shilpa</li> | |
| <li>Jeff</li> | |
| </ul> | |
| </div> | |
| </body> | |
| </html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| function showAddForm() { | |
| $('#people').hide(); | |
| $('#addPerson').show(); | |
| } | |
| function addPerson(name) { | |
| $('ul').append('<li>' + name + '</li>'); | |
| $('#addPerson').hide(); | |
| $('#people').show(); | |
| } | |
| //subscriptions | |
| var addHandler = subscribe("/person/add", showAddForm); | |
| subscribe("/person/added", addPerson); | |
| setTimeout(function() { | |
| unsubscribe(addHandler); | |
| }, 8000); | |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment