Get rid of _prettifyNumber. Don't reinvent the wheel.

dumbbillyhardy · Jul 29, 2017 · 4e211cf · 4e211cf
1 parent 761292b
commit 4e211cf
Show file tree

Hide file tree

Showing 3 changed files with 27 additions and 40 deletions.
diff --git a/chrome_extension/common/main.js b/chrome_extension/common/main.js
@@ -5,20 +5,14 @@ function defineCustomElement(tag, elementClass) {
 }
 
 var Utils = {
-    _prettifyNumber(n) {
-        n = Math.round(n * 100) / 100; // round to 2 decimal places
-
-        // pad to 2 decimal places if necessary
-        var s = n.toString();
-
-        if (s.indexOf('.') === -1) {
-            s += '.';
+    /**
+     * @param {number} number to be formatted
+     * @return {string} undefined if param is not a number
+     */
+    _formatUSD(number) {
+        if (typeof number !== 'number') {
+            return;
         }
-
-        while (s.length < s.indexOf('.') + 3) {
-            s += '0';
-        }
-
-        return s;
+        return number.toLocaleString('en', {style: 'currency', currency: 'USD', useGrouping: true});
     }
 };
diff --git a/elements/order-input.html b/elements/order-input.html
@@ -110,7 +110,7 @@
                     let query = 'tax=' + order.tax + '&fee=' + order.fee + '&tip=' + order.tipDollars;
 
                     for (var [person, val] of order.people) {
-                        query += '&' + encodeURIComponent(person) + '=' + Utils._prettifyNumber(val);
+                        query += '&' + encodeURIComponent(person) + '=' + Utils._formatUSD(val).slice(1);
                     }
                     this.$.location.query = query;
                 }

diff --git a/elements/order-split-results-table.html b/elements/order-split-results-table.html
@@ -43,44 +43,44 @@
                         </td>
                         <td>
                             +
-                            <span class="chip">$[[_multiply(item.price, order.taxPercent)]] tax <paper-tooltip>[[item.price]] x [[order.taxPercent]]</paper-tooltip></span>
+                            <span class="chip">[[_multiplyUSD(item.price, order.taxPercent)]] tax <paper-tooltip>[[item.price]] x [[order.taxPercent]]</paper-tooltip></span>
                         </td>
                         <td>
                             +
-                            <span class="chip">$[[_computeFeesPerPerson(order, item.name)]] fee <paper-tooltip>[[_computeFeesPerPersonTooltip(order, item.name)]]</paper-tooltip></span>
+                            <span class="chip">[[_computeFeesPerPersonUSD(order, item.name)]] fee <paper-tooltip>[[_computeFeesPerPersonTooltip(order, item.name)]]</paper-tooltip></span>
                         </td>
                         <td>
                             +
-                            <span class="chip">$[[_multiply(item.price, order.tipPercent)]] tip <paper-tooltip>[[item.price]] x [[order.tipPercent]]</paper-tooltip></span>
+                            <span class="chip">[[_multiplyUSD(item.price, order.tipPercent)]] tip <paper-tooltip>[[item.price]] x [[order.tipPercent]]</paper-tooltip></span>
                         </td>
                         <td>
                             =
-                            <span class="chip">$[[_computePersonTotal(item.name)]]</span>
+                            <span class="chip">[[_computePersonTotalUSD(item.name)]]</span>
                         </td>
                     </tr>
                 </template>
                 <tr class="totals-row">
                     <td>Everyone</td>
                     <td>
-                        <span class="chip">$[[_prettifyNumber(order.subTotal)]] subtotal</span>
+                        <span class="chip">[[_formatUSD(order.subTotal)]] subtotal</span>
                     </td>
                     <td>
                         +
-                        <span class="chip">$[[_prettifyNumber(order.tax)]] tax</span>
+                        <span class="chip">[[_formatUSD(order.tax)]] tax</span>
                         <paper-tooltip>[[_divide(order.tax, order.subTotal)]]%</paper-tooltip>
                     </td>
                     <td>
                         +
-                        <span class="chip">$[[_prettifyNumber(order.fee)]] fee</span>
+                        <span class="chip">[[_formatUSD(order.fee)]] fee</span>
                     </td>
                     <td>
                         +
-                        <span class="chip">$[[_prettifyNumber(order.tipDollars)]] tip</span>
+                        <span class="chip">[[_formatUSD(order.tipDollars)]] tip</span>
                         <paper-tooltip>[[_divide(order.tip, order.subTotal)]]%</paper-tooltip>
                     </td>
                     <td>
                         =
-                        <span class="chip">$[[_prettifyNumber(order.total)]] total<paper-tooltip>subtotal + tax + fees + tip</paper-tooltip></span>
+                        <span class="chip">[[_formatUSD(order.total)]] total<paper-tooltip>subtotal + tax + fees + tip</paper-tooltip></span>
                     </td>
                 </tr>
             </table>
@@ -114,19 +114,19 @@
                     }
                     return Array.from(this.order.people.entries()).map(([name, price]) => ({ name, price }));
                 }
-                _computeFeesPerPerson(order, name) {
+                _computeFeesPerPersonUSD(order, name) {
                     if (!order) return;
-                    return this._prettifyNumber(order.feesPerPerson[name]);
+                    return this._formatUSD(order.feesPerPerson[name]);
                 }
                 _computeFeesPerPersonTooltip(order, name) {
                     if (!order) return;
                     return `${order.untaxedFees} x ${order.people.get(name)} / ${order.subTotal}`;
                 }
-                _computePersonTotal(name) {
-                    return this._prettifyNumber(this.order.totals.get(name));
+                _computePersonTotalUSD(name) {
+                    return this._formatUSD(this.order.totals.get(name));
                 }
-                _multiply(a, b) {
-                    return this._prettifyNumber(a * b);
+                _multiplyUSD(a, b) {
+                    return this._formatUSD(a * b);
                 }
                 constructor() {
                     super();
@@ -148,15 +148,8 @@
                     }
                     this.hidden = !order;
                 }
-                /**
-                 * Returns a string of a number in the format "#.##"
-                 * @example
-                 * _prettifyNumber(12); // returns "12.00"
-                 * @param {number} n - The number to prettify
-                 * @returns {string} A string of a number rounded and padded to 2 decimal places
-                 */
-                _prettifyNumber(n) {
-                    return Utils._prettifyNumber(n);
+                _formatUSD(n) {
+                    return Utils._formatUSD(n);
                 }
                 _divide(dividend, divisor) {
                     return dividend/divisor;
@@ -186,7 +179,7 @@
                         for (var i = person.length; i < longestName; i++) {
                             name += ' ';
                         }
-                        output += name + '$' + this._prettifyNumber(price) + '\n';
+                        output += name + '$' + this._formatUSD(price) + '\n';
                     }
 
                     return output + '\n' + this._makeUrl(this.order);