Many hyperlinks are disabled.
Use anonymous login
to enable hyperlinks.
Overview
Comment: | Some old storkCore examples |
---|---|
Timelines: | family | ancestors | descendants | both | trunk |
Files: | files | file ages | folders |
SHA1: |
fe225ef48ad1a53f1146448252078ad8 |
User & Date: | setok@scred.com 2013-09-25 14:15:37.000 |
Context
2013-09-25
| ||
14:24 | Merge branch 'master' into mistress Conflicts: storkCore.js check-in: 1472fc290a user: setok@scred.com tags: trunk | |
14:15 | Some old storkCore examples check-in: fe225ef48a user: setok@scred.com tags: trunk | |
13:40 | Added some utility things. But basically ignore this as we're bringing in the much updated storkCore. check-in: f2612cb6c8 user: setok@scred.com tags: trunk | |
Changes
Added budgeter.js.
> > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 | var Controller = clone(Stork); var nextElementID = 0; var BudgetModel = clone(Stork); BudgetModel.categories = [ { name: "Accommodation", budgetTotal: "6500", lines: [ { title: "Hotel", budget: "6500" } ] }, { name: "Transport", budgetTotal: "2500", lines: [ { title: "Diesel", budget: "1500" }, { title: "Ferries", budget: "1000" } ] } ]; var BudgetView = clone(StorkView); BudgetView.model = BudgetModel; BudgetView.connectDesign = function(elementID) { this.templateID = elementID; this.baseElement = document.getElementById(elementID); this.budgetTable = document.getElementById(elementID + "_budgetTable"); categoryRowTemplate = document.getElementById(elementID + "_categoryRowTemplate"); this.categoryRowTemplate = categoryRowTemplate.cloneNode(true); // Make the budget row an orphan. We'll clone and use it later. this.budgetRowTemplate = document.getElementById(elementID + "_budgetRowTemplate"); this.budgetRowTemplate.parentNode.removeChild(this.budgetRowTemplate); /* categoryTextTemplate = document.getElementByID(elementID + "_categoryTextTemplate"); categoryTotalTemplate = document.getElementByID(elementID + "_categoryTotalTemplate"); */ } BudgetView.update = function() { categories = this.model.categories; emptyElement(this.budgetTable); for (i=0; i < categories.length; i++) { category = categories[i]; categoryRow = this.categoryRowTemplate.cloneNode(true); cells = categoryRow.getElementsByTagName("td"); // Set the category title and total budgeted sum emptyElement(cells[0]); emptyElement(cells[cells.length - 1]); cells[0].appendChild(document.createTextNode(category.name)); cells[cells.length - 1].appendChild(document. createTextNode(category. budgetTotal)); this.budgetTable.appendChild(categoryRow); lines = category.lines; for (i=0; i < lines.length; i++) { line = lines[i]; budgetRow = this.budgetRowTemplate.cloneNode(true); // Add cloned template to document so we can look up the elements // we want to change based on their IDs. this.budgetTable.appendChild(budgetRow); title = document.getElementById(this.templateID + "_budgetRowTitleTemplate"); emptyElement(title); title.appendChild(document.createTextNode(line.title)); title.id = "_budgetRowTitle#" + nextElementID; nextElementID++; sum = document.getElementById(this.templateID + "_budgetRowSumTemplate"); sum.value = line.budget; sum.id = "_budgetRowSum#" + nextElementID; } } } |
Added examples/budgeter.html.
> > > > > > > > > > > > > > > > > > > > > > > > > > > > > | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 | <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN"> <html> <head> <title>Test Budgeting</title> </head> <body> <script type="text/javascript" src="../storkCore.js"></script> <script type="text/javascript" src="../budgeter.js"></script> <div id="test"> <table id="test_budgetTable"> <tr style="font-weight: bold;" id="test_categoryRowTemplate"> <td>Category</td> <td>242</td> </tr> <tr id="test_budgetRowTemplate"> <td id="test_budgetRowTitleTemplate">Sub-Category</td> <td><input type="text" id="test_budgetRowSumTemplate" value="242"></td> </tr> </table> <script> BudgetView.connectDesign("test"); BudgetView.update(); </script> <hr> <address></address> <!-- hhmts start --> Last modified: Tue Jan 11 20:54:15 EET 2011 <!-- hhmts end --> </body> </html> |
Added examples/fieldRepeater.html.
> > > > > > > > > > > > > > > > > > > > > | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 | <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN"> <html> <head> <title>Test Repeater</title> </head> <body> <script type="text/javascript" src="../storkCore.js"></script> <script type="text/javascript" src="../repeater.js"></script> <ul> <li id="testfield">Foobar</li> </ul> <span id="testadd">Add</span> <script> EditableListView.connectDesign("testfield", "testadd"); </script> </body> </html> |
Added examples/fieldRepeater.html~.
> > > > > > > > > > > > > > | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 | <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN"> <html> <head> <title>Test Repeater</title> </head> <body> <script type="text/javascript" src="../storkCore.js"></script> <script type="text/javascript" src="../repeater.js"></script> <ul> <li>Foobar</li> </ul> </body> </html> |
Added examples/tabbedForm.html~.
> > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190 191 192 193 194 | <html> <body> <script type="text/javascript"> var StorkCoreRoot = "../" </script> <script type="text/javascript" src="../storkCore.js"></script> <div style="text-align: left; margin-left: 3em; display: inline-block;"> <h3>Overview</h3> <p> {% if balance.is_zero %} {{ pool.name }} does not owe <a href="{% url user claimant.username %}"> {{ claimant.displayname }}</a> anything. {% else %} {% if balance.is_positive %} <a href="{% url user claimant.username %}"> {{ claimant.displayname }}</a> owes the group {{ account.balance_balance }}. {% else %} {{ pool.name }} owes {{ balance.negate }} to <a href="{% url user claimant.username %}"> {{ claimant.displayname }}</a>. {% endif %} {% endif %} </p> {# Only show form if group owes user something #} {% if balance.is_zero %} <div class="multi_form_select" id="reimbursementDialog" style="display: none;"> </div> {% endif %} {% if balance.is_positive %} <div class="multi_form_select" id="reimbursementDialog" style="display: none;"> </div> {% else %} <div class="multi_form_select" id="reimbursementDialog" style="display: inline-block; text-align: left; margin-left: 2.5em;"> <div class="content" style="text-align: center;"> <p> Loading </p> <img src="{{ MEDIA_URL }}/images/loading.gif"> </div> </div> {% endif %} <!-- Container div for forms to be showed in 'reimbursementDialog' by storkCore tabbed view --> <div style="display:none;"> <form method="post" id="paypalForm" action="{% url expense-claims-manage-pay pool.name account.code %}"> <div class="form_content" style="min-width: 25em; min-height: 11em;"> <center> <div class="info_layout"> <div class="info"> Reimburse by direct PayPal payment! </div> </div> <table style="margin-top: 1.5em;"> {% with paypal_form as form %} {% include "form_snippet.html" %} {% endwith %} </table> </center> </div> <!-- form_content --> <div class="form_buttons"> <input type="hidden" name="form" value="paypal"> <input type="submit" name="paypal" value="Pay"> </div> </form> <form method="post" id="elsewhereForm" action="{% url expense-claims-manage-pay pool.name account.code %}"> <div class="form_content" style="min-width: 25em; min-height: 11em;"> <center> <div class="info_layout"> <div class="info"> Use this form if reimbursed outside Scred </div> </div> <table> {% with payment_form as form %} {% include "form_snippet.html" %} {% endwith %} </table> </center> </div> <!-- form_content --> <div class="form_buttons"> <input type="hidden" name="form" value="payment"> <input type="submit" name="payment" value="Record Payment"> </div> </form> </div> <!-- Storkcore tab selection --> <script type="text/javascript"> // This is called once document has loaded. loadedCallback = function() { // Controller for the view selection formSelectController = clone(ViewSelectController); formSelectController.viewOptions = [ {text: "Pay with PayPal", value: "paypal"}, {text: "Paid Elsewhere", value: "elsewhere"}] formSelectController.selectedView = "paypal"; formSelectController.setViewElement("paypal", "paypalForm"); formSelectController.setViewElement("elsewhere", "elsewhereForm"); // View for the view selection formSelect = clone(ClickViewSelect); formSelect.parentElement = document.getElementById("reimbursementDialog"); formSelect.delegate = formSelectController; formSelect.render(); } window.onload = loadedCallback; </script> <table class="list_report" style="margin-top: 2em;" width="70%" border="0"> <caption>Logged Expense Claims & Reimbursements</caption> <tr> <th>Date</th> <th>Type</th> <th>Sum</th> <th>Description</th> <th></th> <th></th> </tr> {% for t in transfers %} <tr> <td> <span style="white-space: nowrap;"> {{ t.date|date:"M j," }} </span> {{ t.date|date:"Y" }} </td> <td> {# FIXME: We should derive this from the transaction type. #} {% if t.value_as_money.is_positive %} Reimbursement {% else %} Expense claim {% endif %} </td> <td> <span class="sum"> {# FIXME: This should also happen using the transaction type. #} {% if t.value_as_money.is_positive %} {{ t.value_as_money }} {% else %} {{ t.value_as_money.negate }} {% endif %} </span> </td> <td> {{ t.transaction.description }} </td> <td valign="center"> <div style="white-space: nowrap; vertical-alignment: middle;"> {% if t.transaction.get_attachments %} <a href="{% url mcng-transaction pool.name t.transaction.code %}"> <img src="{{ MEDIA_URL }}/images/Paperclip4-black-24.png" style="border: solid black 0px; vertical-align: middle;" alt="Attachments"> </a> <span style="vertical-align: middle;"> {{ t.transaction.get_attachments|length }} </span> </div> {% endif %} <td style="white-space: nowrap;"> <a class="small_button" href="{% url mcng-transaction pool.name t.transaction.code %}"> View </a> </tr> {% endfor %} </table> </div> |
Added repeater.js.
> > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 | var EditableListView = clone(StorkView); EditableListView.connectDesign = function(repeatedID, addButtonID) { var me = this; this.templateID = repeatedID; this.baseElement = document.getElementById(repeatedID); this.parent = this.baseElement.parentNode; // Make the budget row an orphan. We'll clone and use it later. this.parent.removeChild(this.baseElement); this.addButton = document.getElementById(addButtonID); this.addButton.onclick = function(event) { return me.handleAdd(event); } } EditableListView.updateIDs(element) { id = element.id; } EditableListView.handleAdd = function() { var newElement = this.baseElement.cloneNode(true); this.updateIDs(newElement); this.parent.appendChild(newElement); //alert("add"); } |