Created
April 19, 2012 20:49
-
-
Save Moketronics/2424086 to your computer and use it in GitHub Desktop.
Quickly displays appropriate prices w/ tax for various publications
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 PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" | |
| "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> | |
| <html> | |
| <head> | |
| <title>Quick Price Finder | TSI Network</title> | |
| <script src="./jquery-1.7.2.min.js"></script> | |
| <style type="text/css"> | |
| body { | |
| font-family: Arial, Helvetica, sans-serif; | |
| background-color: #eee; | |
| } | |
| #container { | |
| width: 800px; | |
| margin: 10px auto; | |
| background-color: #fff; | |
| height: 100%; | |
| -moz-border-radius: 15px; | |
| border-radius: 15px; | |
| } | |
| #mainbox { | |
| padding:10px; | |
| } | |
| #controlform { | |
| background-color: #BBF7A8; | |
| -moz-border-radius: 15px; | |
| border-radius: 15px; | |
| padding: 1px; | |
| width: 700px; | |
| margin: 1em auto; | |
| } | |
| .center { | |
| margin:1em auto; | |
| } | |
| .center_text { | |
| text-align: center; | |
| } | |
| td, th { | |
| padding: 1px 5px; | |
| } | |
| table { | |
| border-collapse:collapse; | |
| } | |
| .right_align { | |
| text-align:right; | |
| } | |
| #first_col { | |
| width: 300px; | |
| } | |
| #sec_col { | |
| width: 80px; | |
| } | |
| #third_col { | |
| width: 100px; | |
| } | |
| #fourth_col { | |
| width: 100px; | |
| } | |
| .table_container { | |
| background-color: #D1E1F9; | |
| -moz-border-radius: 15px; | |
| border-radius: 15px; | |
| padding: 1px; | |
| width: 700px; | |
| margin: 1em auto; | |
| } | |
| .alt_row { | |
| background-color: #fff; | |
| } | |
| </style> | |
| </head> | |
| <body> | |
| <div id="container"> | |
| <div id="mainbox"> | |
| <h1 class="center_text">TSI Network Quick Price Finder</h1> | |
| <div id="controlform"> | |
| <table class="center center_text"> | |
| <tbody> | |
| <tr> | |
| <td><b>Select a province:</b></td> | |
| <td><b>Select a publication:</b></td> | |
| <td><b>Select an order type:</b></td> | |
| </tr> | |
| <tr> | |
| <td> | |
| <select name="province" id="province" class="m_input"> | |
| <option value="none">Please choose province</option> | |
| <option value="on">Ontario</option> | |
| <option value="qc">Quebec</option> | |
| <option value="bc">British Columbia</option> | |
| <option value="ab">Alberta</option> | |
| <option value="mb">Manitoba</option> | |
| <option value="sk">Saskatchewan</option> | |
| <option value="ns">Nova Scotia</option> | |
| <option value="nb">New Brunswick</option> | |
| <option value="nl">Newfoundland and Labrador</option> | |
| <option value="pe">Prince Edward Island</option> | |
| <option value="nt">Northwest Territories</option> | |
| <option value="yt">Yukon</option> | |
| <option value="nu">Nunavut</option> | |
| </select> | |
| </td> | |
| <td> | |
| <select name="publication" id="publication" class="m_input"> | |
| <option value="all">All publications</option> | |
| <option value="tsi">The Successful Investor</option> | |
| <option value="spd">Stock Pickers Digest</option> | |
| <option value="wssf">Wall Street Stock Forecaster</option> | |
| <option value="cwa">Canadian Wealth Advisor</option> | |
| <option value="ic">Inner Circle</option> | |
| </select> | |
| </td> | |
| <td> | |
| <select name="type" id="type" class="m_input"> | |
| <option value="all">All types</option> | |
| <option value="new">New Order</option> | |
| <option value="ren-a">Renewal Order</option> | |
| <option value="ren-c"> <b>C</b>onversion</option> | |
| <option value="ren-r"> <b>R</b>egular</option> | |
| </select> | |
| </td> | |
| </tbody> | |
| </table> | |
| </div> | |
| <div id="result"> | |
| <!-- stuff goes here --> | |
| </div> | |
| </div> | |
| <script type="text/javascript"> | |
| // Array of publication data. | |
| var publications = { | |
| "tsi": | |
| [ | |
| { "s_type" : "fullprice", "price" : 139, "savings": '-' }, | |
| { "s_type" : "welcome", "price" : 89, "savings": '$50' }, | |
| { "s_type" : "renewal_c", "price" : 99, "savings": '$40' }, | |
| { "s_type" : "renewal_r", "price" : 123, "savings": '$16' }, | |
| { "s_type" : "auto_c", "price" : 24.75, "savings": '$40'}, | |
| { "s_type" : "auto_r", "price" : 30.75, "savings": "Over 10%" }, | |
| { "s_type" : "twoyear_r", "price" : 246, "savings": '$32' }, | |
| { "s_type" : "webrate", "price" : 89, "savings": '$50' } | |
| ], | |
| "spd": | |
| [ | |
| { "s_type" : "fullprice", "price" : 168, "savings": '-' }, | |
| { "s_type" : "welcome", "price" : 118, "savings": '$50' }, | |
| { "s_type" : "renewal_c", "price" : 134, "savings": '$34' }, | |
| { "s_type" : "renewal_r", "price" : 147, "savings": '$21'}, | |
| { "s_type" : "auto_c", "price" : 33.5, "savings": '$40' }, | |
| { "s_type" : "auto_r", "price" : 36.75, "savings": "Over 10%" }, | |
| { "s_type" : "twoyear_r", "price" : 294, "savings": '$42' }, | |
| { "s_type" : "webrate", "price" : 118, "savings": '$50' } | |
| ], | |
| "wssf": | |
| [ | |
| { "s_type" : "fullprice", "price" : 144, "savings": '-' }, | |
| { "s_type" : "welcome", "price" : 89, "savings": '$55' }, | |
| { "s_type" : "renewal_c", "price" : 99, "savings": '$45' }, | |
| { "s_type" : "renewal_r", "price" : 127, "savings": '$17' }, | |
| { "s_type" : "auto_c", "price" : 24.75, "savings": '$40' }, | |
| { "s_type" : "auto_r", "price" : 31.75, "savings": "Over 10%" }, | |
| { "s_type" : "twoyear_r", "price" : 254, "savings": '$34' }, | |
| { "s_type" : "webrate", "price" : 94, "savings": '$50' } | |
| ], | |
| "cwa": | |
| [ | |
| { "s_type" : "fullprice", "price" : 119, "savings": '-' }, | |
| { "s_type" : "welcome", "price" : 69, "savings": '$50' }, | |
| { "s_type" : "renewal_c", "price" : 89, "savings": '$30' }, | |
| { "s_type" : "renewal_r", "price" : 107, "savings": '$12' }, | |
| { "s_type" : "auto_c", "price" : 22.25, "savings": '$40' }, | |
| { "s_type" : "auto_r", "price" : 26.75, "savings": "Over 10%" }, | |
| { "s_type" : "twoyear_r", "price" : 214, "savings": '$24' }, | |
| { "s_type" : "webrate", "price" : 69, "savings": '$50' } | |
| ], | |
| "ic": | |
| [ | |
| { "s_type" : "aren", "price" : 49, "savings": "-" }, | |
| { "s_type" : "year", "price" : 625, "savings": "-" } | |
| ] | |
| }; | |
| // Array of tax values for provinces. | |
| var taxbrackets = { | |
| "on": 13, | |
| "nb": 13, | |
| "nl": 13, | |
| "ns": 14, | |
| "bc": 12, | |
| "qc": 5, | |
| "ab": 5, | |
| "sk": 5, | |
| "mb": 5, | |
| "pe": 5, | |
| "yt": 5, | |
| "nt": 5, | |
| "nu": 5 | |
| }; | |
| function update_price_table(prov, pub, typ) { | |
| // Start filling out output's HTML. | |
| var html_output = "<div class=\"table_container\">\n<table class=\"center\">\n<thead>\n<tr><th id=\"first_col\">"; | |
| // Get full name for putting into table. | |
| var pub_name = ''; | |
| switch(pub) { | |
| case 'tsi': | |
| pub_name = 'The Successful Investor'; | |
| break; | |
| case 'spd': | |
| pub_name = 'Stock Pickers Digest'; | |
| break; | |
| case 'wssf': | |
| pub_name = "Wall Street Stock Forecaster"; | |
| break; | |
| case 'cwa': | |
| pub_name = "Canadian Wealth Advisor"; | |
| break; | |
| case 'ic': | |
| pub_name = 'Inner Circle'; | |
| break; | |
| } | |
| // Finish off table head. | |
| html_output += pub_name + "</th>\n<th id=\"sec_col\">Price</th>\n<th id=\"third_col\">" + taxbrackets[prov] + "% Tax</th>\n<th id=\"fourth_col\">Savings</th></tr>\n<thead>\n<tbody>\n"; | |
| // Set the full names of rows - this a kind of lazy way to go about things. Could have put this into the arrays. | |
| if (pub == 'ic') { | |
| var value_order = new Array('Automatic Renewal (AREN)', '1 Year'); | |
| } else { | |
| var value_order = new Array('Full Price', 'Early Bird/Welcome Price', 'Renewal Price - <b>C</b>onversion', 'Renewal Price - <b>R</b>egular', 'Automatic Renewal Quarterly - AREN <b>C</b>', 'Automatic Renewal Quarterly - AREN <b>R</b>', '2 Year Renewal Rate - <b>R</b> only', 'TSI WEBSITE RATE'); | |
| } | |
| // Cycle through array. 'i' is a counter for outputting the right row names, the 'flipper' switches row style for readability. | |
| $.each(publications, function(key, object) { | |
| if (key == pub) { | |
| var i = 0; | |
| var flipper = 0 | |
| // Cycle through entries for this pub, adding to the output based on which "type" is chosen. | |
| $.each(object, function() { | |
| switch(typ) { | |
| case 'new': | |
| if (this.s_type == 'fullprice' || this.s_type == 'welcome' || this.s_type == 'webrate' || pub == 'ic') { | |
| html_output += "<tr"; | |
| if (flipper == 0) { | |
| html_output += ' class="alt_row"'; | |
| } | |
| html_output += ">\n<td>" + value_order[i] + "</td>\n<td class=\"right_align\">$" + this.price.toFixed(2) + "</td>\n<td class=\"right_align\">$" + (this.price + ((this.price / 100) * taxbrackets[prov])).toFixed(2) + "</td>\n<td class=\"right_align\">" + this.savings + "</td>\n</tr>\n"; | |
| (flipper == 0) ? flipper = 1 : flipper = 0; | |
| } | |
| break; | |
| case 'ren-a': | |
| if (this.s_type == 'renewal_c' || this.s_type == 'renewal_r' || this.s_type == 'auto_c' || this.s_type == 'auto_r' || this.s_type == 'twoyear_r' || pub == 'ic') { | |
| html_output += "<tr"; | |
| if (flipper == 0) { | |
| html_output += ' class="alt_row"'; | |
| } | |
| html_output += ">\n<td>" + value_order[i] + "</td>\n<td class=\"right_align\">$" + this.price.toFixed(2) + "</td>\n<td class=\"right_align\">$" + (this.price + ((this.price / 100) * taxbrackets[prov])).toFixed(2) + "</td>\n<td class=\"right_align\">" + this.savings + "</td>\n</tr>\n"; | |
| (flipper == 0) ? flipper = 1 : flipper = 0; | |
| } | |
| break; | |
| case 'ren-c': | |
| if (this.s_type == 'renewal_c' || this.s_type == 'auto_c' || pub == 'ic') { | |
| html_output += "<tr"; | |
| if (flipper == 0) { | |
| html_output += ' class="alt_row"'; | |
| } | |
| html_output += ">\n<td>" + value_order[i] + "</td>\n<td class=\"right_align\">$" + this.price.toFixed(2) + "</td>\n<td class=\"right_align\">$" + (this.price + ((this.price / 100) * taxbrackets[prov])).toFixed(2) + "</td>\n<td class=\"right_align\">" + this.savings + "</td>\n</tr>\n"; | |
| (flipper == 0) ? flipper = 1 : flipper = 0; | |
| } | |
| break; | |
| case 'ren-r': | |
| if (this.s_type == 'renewal_r' || this.s_type == 'auto_r' || this.s_type == 'twoyear_r' || pub == 'ic') { | |
| html_output += "<tr"; | |
| if (flipper == 0) { | |
| html_output += ' class="alt_row"'; | |
| } | |
| html_output += ">\n<td>" + value_order[i] + "</td>\n<td class=\"right_align\">$" + this.price.toFixed(2) + "</td>\n<td class=\"right_align\">$" + (this.price + ((this.price / 100) * taxbrackets[prov])).toFixed(2) + "</td>\n<td class=\"right_align\">" + this.savings + "</td>\n</tr>\n"; | |
| (flipper == 0) ? flipper = 1 : flipper = 0; | |
| } | |
| break; | |
| default: | |
| html_output += "<tr"; | |
| if (flipper == 0) { | |
| html_output += ' class="alt_row"'; | |
| } | |
| html_output += ">\n<td>" + value_order[i] + "</td>\n<td class=\"right_align\">$" + this.price.toFixed(2) + "</td>\n<td class=\"right_align\">$" + (this.price + ((this.price / 100) * taxbrackets[prov])).toFixed(2) + "</td>\n<td class=\"right_align\">" + this.savings + "</td>\n</tr>\n"; | |
| (flipper == 0) ? flipper = 1 : flipper = 0; | |
| } | |
| i++ | |
| }); | |
| } | |
| }); | |
| // Finish and output the fully formed table. | |
| html_output += "</tbody>\n</table>\n</div>"; | |
| $('#result').append(html_output); | |
| } | |
| $(document).ready(function() { | |
| $('.m_input').change(function() { | |
| // Clear out currently shown table(s) | |
| $('#result').empty(); | |
| // Assign dropdown values to variables | |
| var province = $('#province').val(); | |
| var publication = $('#publication').val(); | |
| var type = $('#type').val(); | |
| // Check if province is selected | |
| if (province != 'none') { | |
| // If all pubs selected, generate all tables, otherwise pass specific pub value. | |
| if (publication == 'all') { | |
| update_price_table(province, 'tsi', type); | |
| update_price_table(province, 'spd', type); | |
| update_price_table(province, 'wssf', type); | |
| update_price_table(province, 'cwa', type); | |
| update_price_table(province, 'ic', type); | |
| } else { | |
| update_price_table(province, publication, type); | |
| } | |
| } | |
| }); | |
| }); | |
| </script> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment