beginning to support new icons.

resources/public/finance-font/Read Me.txt

@@ -0,0 +1,7 @@
+Open *demo.html* to see a list of all the glyphs in your font along with their codes/ligatures.
+
+To use the generated font in desktop programs, you can install the TTF font. In order to copy the character associated with each icon, refer to the text box at the bottom right corner of each glyph in demo.html. The character inside this text box may be invisible; but it can still be copied. See this guide for more info: https://icomoon.io/#docs/local-fonts
+
+You won't need any of the files located under the *demo-files* directory when including the generated font in your own projects.
+
+You can import *selection.json* back to the IcoMoon app using the *Import Icons* button (or via Main Menu → Manage Projects) to retrieve your icon selection.

resources/public/finance-font/demo-files/demo.css

@@ -0,0 +1,152 @@
+body {
+  padding: 0;
+  margin: 0;
+  font-family: sans-serif;
+  font-size: 1em;
+  line-height: 1.5;
+  color: #555;
+  background: #fff;
+}
+h1 {
+  font-size: 1.5em;
+  font-weight: normal;
+}
+small {
+  font-size: .66666667em;
+}
+a {
+  color: #e74c3c;
+  text-decoration: none;
+}
+a:hover, a:focus {
+  box-shadow: 0 1px #e74c3c;
+}
+.bshadow0, input {
+  box-shadow: inset 0 -2px #e7e7e7;
+}
+input:hover {
+  box-shadow: inset 0 -2px #ccc;
+}
+input, fieldset {
+  font-family: sans-serif;
+  font-size: 1em;
+  margin: 0;
+  padding: 0;
+  border: 0;
+}
+input {
+  color: inherit;
+  line-height: 1.5;
+  height: 1.5em;
+  padding: .25em 0;
+}
+input:focus {
+  outline: none;
+  box-shadow: inset 0 -2px #449fdb;
+}
+.glyph {
+  font-size: 16px;
+  width: 15em;
+  padding-bottom: 1em;
+  margin-right: 4em;
+  margin-bottom: 1em;
+  float: left;
+  overflow: hidden;
+}
+.liga {
+  width: 80%;
+  width: calc(100% - 2.5em);
+}
+.talign-right {
+  text-align: right;
+}
+.talign-center {
+  text-align: center;
+}
+.bgc1 {
+  background: #f1f1f1;
+}
+.fgc1 {
+  color: #999;
+}
+.fgc0 {
+  color: #000;
+}
+p {
+  margin-top: 1em;
+  margin-bottom: 1em;
+}
+.mvm {
+  margin-top: .75em;
+  margin-bottom: .75em;
+}
+.mtn {
+  margin-top: 0;
+}
+.mtl, .mal {
+  margin-top: 1.5em;
+}
+.mbl, .mal {
+  margin-bottom: 1.5em;
+}
+.mal, .mhl {
+  margin-left: 1.5em;
+  margin-right: 1.5em;
+}
+.mhmm {
+  margin-left: 1em;
+  margin-right: 1em;
+}
+.mls {
+  margin-left: .25em;
+}
+.ptl {
+  padding-top: 1.5em;
+}
+.pbs, .pvs {
+  padding-bottom: .25em;
+}
+.pvs, .pts {
+  padding-top: .25em;
+}
+.unit {
+  float: left;
+}
+.unitRight {
+  float: right;
+}
+.size1of2 {
+  width: 50%;
+}
+.size1of1 {
+  width: 100%;
+}
+.clearfix:before, .clearfix:after {
+  content: " ";
+  display: table;
+}
+.clearfix:after {
+  clear: both;
+}
+.hidden-true {
+  display: none;
+}
+.textbox0 {
+  width: 3em;
+  background: #f1f1f1;
+  padding: .25em .5em;
+  line-height: 1.5;
+  height: 1.5em;
+}
+#testDrive {
+  display: block;
+  padding-top: 24px;
+  line-height: 1.5;
+}
+.fs0 {
+  font-size: 16px;
+}
+.fs1 {
+  font-size: 32px;
+}
+

resources/public/finance-font/demo-files/demo.js

@@ -0,0 +1,30 @@
+if (!('boxShadow' in document.body.style)) {
+    document.body.setAttribute('class', 'noBoxShadow');
+}
+
+document.body.addEventListener("click", function(e) {
+    var target = e.target;
+    if (target.tagName === "INPUT" &&
+        target.getAttribute('class').indexOf('liga') === -1) {
+        target.select();
+    }
+});
+
+(function() {
+    var fontSize = document.getElementById('fontSize'),
+        testDrive = document.getElementById('testDrive'),
+        testText = document.getElementById('testText');
+    function updateTest() {
+        testDrive.innerHTML = testText.value || String.fromCharCode(160);
+        if (window.icomoonLiga) {
+            window.icomoonLiga(testDrive);
+        }
+    }
+    function updateSize() {
+        testDrive.style.fontSize = fontSize.value + 'px';
+    }
+    fontSize.addEventListener('change', updateSize, false);
+    testText.addEventListener('input', updateTest, false);
+    testText.addEventListener('change', updateTest, false);
+    updateSize();
+}());

resources/public/finance-font/style.css

@@ -0,0 +1,305 @@
+@font-face {
+  font-family: 'icomoon';
+  src:  url('fonts/icomoon.eot?fy2oti');
+  src:  url('fonts/icomoon.eot?fy2oti#iefix') format('embedded-opentype'),
+    url('fonts/icomoon.ttf?fy2oti') format('truetype'),
+    url('fonts/icomoon.woff?fy2oti') format('woff'),
+    url('fonts/icomoon.svg?fy2oti#icomoon') format('svg');
+  font-weight: normal;
+  font-style: normal;
+}
+
+[class^="icon-"], [class*=" icon-"] {
+  /* use !important to prevent issues with browser extensions that change fonts */
+  font-family: 'icomoon' !important;
+  speak: none;
+  font-style: normal;
+  font-weight: normal;
+  font-variant: normal;
+  text-transform: none;
+  line-height: 1;
+
+  /* Better Font Rendering =========== */
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+.icon-cash-payment-bag-1:before {
+  content: "\e900";
+}
+.icon-cash-payment-bag-2:before {
+  content: "\e901";
+}
+.icon-cash-payment-bag:before {
+  content: "\e902";
+}
+.icon-cash-payment-bill-1:before {
+  content: "\e903";
+}
+.icon-cash-payment-bill-2:before {
+  content: "\e904";
+}
+.icon-cash-payment-bill-3:before {
+  content: "\e905";
+}
+.icon-cash-payment-bill-4:before {
+  content: "\e906";
+}
+.icon-cash-payment-bill:before {
+  content: "\e907";
+}
+.icon-cash-payment-bills-1:before {
+  content: "\e908";
+}
+.icon-cash-payment-bills:before {
+  content: "\e909";
+}
+.icon-cash-payment-coin-1:before {
+  content: "\e90a";
+}
+.icon-cash-payment-coin-stash:before {
+  content: "\e90b";
+}
+.icon-cash-payment-coin:before {
+  content: "\e90c";
+}
+.icon-cash-payment-coins:before {
+  content: "\e90d";
+}
+.icon-cash-payment-person:before {
+  content: "\e90e";
+}
+.icon-cash-payment-wallet:before {
+  content: "\e90f";
+}
+.icon-cash-payment-sign-1:before {
+  content: "\e910";
+}
+.icon-cash-payment-sign-2:before {
+  content: "\e911";
+}
+.icon-check-payment-give:before {
+  content: "\e912";
+}
+.icon-check-payment-sign:before {
+  content: "\e913";
+}
+.icon-credit-card-1:before {
+  content: "\e914";
+}
+.icon-credit-card-amex:before {
+  content: "\e915";
+}
+.icon-credit-card-check:before {
+  content: "\e916";
+}
+.icon-credit-card-disable:before {
+  content: "\e917";
+}
+.icon-credit-card-dollar-1:before {
+  content: "\e918";
+}
+.icon-credit-card-dollar:before {
+  content: "\e919";
+}
+.icon-credit-card-flag:before {
+  content: "\e91a";
+}
+.icon-credit-card-give:before {
+  content: "\e91b";
+}
+.icon-credit-card-laptop-payment:before {
+  content: "\e91c";
+}
+.icon-credit-card-lock:before {
+  content: "\e91d";
+}
+.icon-credit-card-mastercard:before {
+  content: "\e91e";
+}
+.icon-credit-card-monitor-payment:before {
+  content: "\e91f";
+}
+.icon-credit-card-online-payment:before {
+  content: "\e920";
+}
+.icon-credit-card-payment:before {
+  content: "\e921";
+}
+.icon-credit-card-phone-call:before {
+  content: "\e922";
+}
+.icon-credit-card-remove:before {
+  content: "\e923";
+}
+.icon-credit-card-scan:before {
+  content: "\e924";
+}
+.icon-credit-card-shield:before {
+  content: "\e925";
+}
+.icon-credit-card-smartphone:before {
+  content: "\e926";
+}
+.icon-credit-card-sync:before {
+  content: "\e927";
+}
+.icon-credit-card-visa:before {
+  content: "\e928";
+}
+.icon-credit-card:before {
+  content: "\e929";
+}
+.icon-saving-bag-increase:before {
+  content: "\e92a";
+}
+.icon-saving-bank-1:before {
+  content: "\e92b";
+}
+.icon-saving-bank-cash:before {
+  content: "\e92c";
+}
+.icon-saving-bank-drawer:before {
+  content: "\e92d";
+}
+.icon-saving-bank-international:before {
+  content: "\e92e";
+}
+.icon-saving-bank:before {
+  content: "\e92f";
+}
+.icon-saving-bear:before {
+  content: "\e930";
+}
+.icon-saving-bull-decrease:before {
+  content: "\e931";
+}
+.icon-saving-bull-increase:before {
+  content: "\e932";
+}
+.icon-saving-bull:before {
+  content: "\e933";
+}
+.icon-saving-dog-guard-decrease:before {
+  content: "\e934";
+}
+.icon-saving-dog-guard-increase:before {
+  content: "\e935";
+}
+.icon-saving-money-egg:before {
+  content: "\e936";
+}
+.icon-saving-money-flower:before {
+  content: "\e937";
+}
+.icon-saving-money-seedling:before {
+  content: "\e938";
+}
+.icon-saving-money-tree:before {
+  content: "\e939";
+}
+.icon-saving-piggy-bank:before {
+  content: "\e93a";
+}
+.icon-saving-piggy-coins:before {
+  content: "\e93b";
+}
+.icon-saving-piggy-dollars:before {
+  content: "\e93c";
+}
+.icon-saving-safe-1:before {
+  content: "\e93d";
+}
+.icon-saving-safe-open:before {
+  content: "\e93e";
+}
+.icon-saving-safe:before {
+  content: "\e93f";
+}
+.icon-saving-wallet-international:before {
+  content: "\e940";
+}
+.icon-accounting-bill-stack-1:before {
+  content: "\e941";
+}
+.icon-accounting-bill-stack:before {
+  content: "\e942";
+}
+.icon-accounting-bill:before {
+  content: "\e943";
+}
+.icon-accounting-bills-1:before {
+  content: "\e944";
+}
+.icon-accounting-bills:before {
+  content: "\e945";
+}
+.icon-accounting-coins-bill:before {
+  content: "\e946";
+}
+.icon-accounting-coins-stack-1:before {
+  content: "\e947";
+}
+.icon-accounting-coins-stack:before {
+  content: "\e948";
+}
+.icon-accounting-withdraw:before {
+  content: "\e949";
+}
+.icon-coin-purse-1:before {
+  content: "\e94a";
+}
+.icon-coin-purse:before {
+  content: "\e94b";
+}
+.icon-money-atm:before {
+  content: "\e94c";
+}
+.icon-money-bag-dollar:before {
+  content: "\e94d";
+}
+.icon-money-bag-euro:before {
+  content: "\e94e";
+}
+.icon-money-bags:before {
+  content: "\e94f";
+}
+.icon-money-wallet-1:before {
+  content: "\e950";
+}
+.icon-money-wallet-open:before {
+  content: "\e951";
+}
+.icon-money-wallet:before {
+  content: "\e952";
+}
+.icon-accounting-abacus:before {
+  content: "\e953";
+}
+.icon-accounting-calculator-1:before {
+  content: "\e954";
+}
+.icon-accounting-calculator-2:before {
+  content: "\e955";
+}
+.icon-accounting-calculator:before {
+  content: "\e956";
+}
+.icon-accounting-coins:before {
+  content: "\e957";
+}
+.icon-accounting-document:before {
+  content: "\e958";
+}
+.icon-accounting-invoice-hand:before {
+  content: "\e959";
+}
+.icon-accounting-invoice-mail:before {
+  content: "\e95a";
+}
+.icon-accounting-invoice:before {
+  content: "\e95b";
+}
+.icon-calculator-app:before {
+  content: "\e95c";
+}

resources/public/index.html

@@ -10,6 +10,7 @@
   <link rel="stylesheet" href="/css/bulma.min.css" integrity="sha256-HEtF7HLJZSC3Le1HcsWbz1hDYFPZCqDhZa9QsCgVUdw=" crossorigin="anonymous" />
   <link rel="stylesheet" href="/css/bulma-calendar.min.css" />
   <link rel="stylesheet" href="/css/bulma-badge.min.css" />
+  <link rel="stylesheet" href="/finance-font/style.css" />
 
   <style>
     form.dz {  border: 2px dashed lightgray;}
@@ -23,7 +24,7 @@
 }
 
     @keyframes scaleUp {
-        from { opacity: 0; transform: translateY(20px); transform-origin: top center; }
+        from { opacity: 0; transform: translateY(10px); transform-origin: top center; }
     }
     @keyframes appear {
         from { opacity: 0;  }
@@ -118,7 +119,7 @@
         animation: appear .7s ease both;
     }
     .inbox-messages {
-        animation: scaleUp .7s ease both;
+        animation: scaleUp .3s ease both;
     }
 .nav.menu .nav-item .icon-btn .fa {
   font-size: 20px;

src/clj/auto_ap/datomic/invoices.clj

@@ -30,6 +30,7 @@
        (map #(rename-keys % {:invoice-payment/_invoice :invoice/payments}))))
 
 (defn raw-graphql [args]
+  (println (:invoice-number-like args))
   (->> (d/query
         (cond-> {:query {:find [default-read]
                          :in ['$]
@@ -47,7 +48,10 @@
           (:status args) (add-arg '?status (keyword "invoice-status" (:status args))
                                   '[?e :invoice/status ?status])
           (:vendor-id args) (add-arg '?vendor-id (:vendor-id args)
-                                  '[?e :invoice/vendor ?vendor-id])))
+                                     '[?e :invoice/vendor ?vendor-id])
+          (seq (:invoice-number-like args)) (add-arg '?invoice-number-like (:invoice-number-like args)
+                                               '[?e :invoice/invoice-number ?invoice-number]
+                                               '[(.contains ^String ?invoice-number ?invoice-number-like)])))
        (map first)
        (<-datomic)))
 

src/clj/auto_ap/graphql.clj

@@ -204,6 +204,7 @@
                           :status {:type 'String}
                           :client_id {:type :id}
                           :vendor_id {:type :id}
+                          :invoice_number_like {:type 'String}
                           :start {:type 'Int}
                           :sort_by {:type 'String}
                           :asc {:type 'Boolean}}

src/cljs/auto_ap/views/components/invoices/side_bar.cljs

@@ -19,14 +19,14 @@
       [:li.menu-item
        [:a.item {:href (bidi/path-for routes/routes :unpaid-invoices)
                  :class [(active-when ap = :unpaid-invoices)]}
-        [:span {:class "icon"}
-         [:i {:class "fa fa-envelope-open-o"}]]
+        [:span {:class "icon icon-accounting-document" :style {"font-size" "25px"}}]
         [:span {:class "name"} "Unpaid Invoices"]]]
       [:li.menu-item
        [:a.item {:href (bidi/path-for routes/routes :paid-invoices)
                  :class [(active-when ap = :paid-invoices)]}
-        [:span {:class "icon"}
-         [:i {:class "fa fa-envelope-o"}]]
+
+        [:span {:class "icon icon-accounting-invoice-mail" :style {"font-size" "25px"}}]
+        
         [:span {:class "name"} "Paid Invoices"]]]]
      ]
     [:div

src/cljs/auto_ap/views/pages/unpaid_invoices.cljs

@@ -92,7 +92,6 @@
  ::toggle-check
  (fn [db [_ data]]
    (update-in db [::invoice-page :checked] (fn [x]
-                                             
                                              (let [x (or x #{})]
                                                (if (x data)
                                                  (disj x data)
@@ -682,7 +681,7 @@
 
 
 (defn vendor-filter []
-  (let [{:keys [vendor-filter]} @(re-frame/subscribe [::invoice-page])])
+  (let [{:keys [vendor-filter]} @(re-frame/subscribe [::invoice-page])]
   [:div.field
    [:div.control 
     [bind-field
@@ -693,7 +692,16 @@
                  :text-field [:vendor-name]
                  :event [::change-selected-vendor]
                  :spec (s/nilable ::invoice/vendor-id)
-                 :subscription vendor-filter}]]]])
+                 :subscription vendor-filter}]]]]))
+
+(defn invoice-number-filter []
+  (let [{:keys [invoice-number-like] :as params} @(re-frame/subscribe [::params])]
+    [:div.field
+     [:div.control [:input.input {:placeholder "AP-123"
+                                  :value invoice-number-like 
+                                  :on-change (fn [x]
+                                               (re-frame/dispatch [::params-change (assoc params :invoice-number-like (.. x -target -value)) ])
+                                               )} ]]]))
 
 (def unpaid-invoices-content
   (with-meta
@@ -778,9 +786,13 @@
 
 (defn unpaid-invoices-page []
   [side-bar-layout {:side-bar [invoices-side-bar {}
-                               [:div [:p.menu-label "Vendor"]
+                               [:p.menu-label "Vendor"]
+                               [:div 
                                 [vendor-filter]]
-                               ]
+                               [:p.menu-label "Invoice #"]
+                               [:div 
+                                [invoice-number-filter]
+                                ]]
                     :main [unpaid-invoices-content]
                     :bottom [vendor-dialog {:vendor @(re-frame/subscribe [::subs/user-editing-vendor])
                                             :save-event [::events/save-vendor]