diff --git a/Readme.md b/Readme.md index 0801636..1253ee2 100644 --- a/Readme.md +++ b/Readme.md @@ -7,7 +7,6 @@ Description Simple explorer for the [CISP-2](https://fr.wikipedia.org/wiki/Classification_internationale_des_soins_primaires_%28CISP%29), the French version of International Classification of Primary Care. -Changing the csv file should allow you to make the english version work. It is built on top of [LokiJS](http://lokijs.org), [jquery-csv](https://code.google.com/p/jquery-csv) and @@ -17,15 +16,16 @@ Ideally, this would only be the first building block for a proper (meaning great and open-source) software suite for [General practitioners](https://en.wikipedia.org/wiki/General_practitioner). -Start it by calling you internet navigator on `cherche.html`. +Start it by pointing your internet navigator to the page `cherche.html`. -Todo (sorted by priority) +TODOs (sorted by priority) ------------------------- 0. ~~Make the search case-insensitive (as well as accents insensitive)~~ 0. ~~BUG: trim spaces from search expression~~ 0. ~~BUG: fix search for codes also~~ 0. ~~BUG: don't search for empty string~~ - 0. Create a nice html page (may take several steps) + 0. ~~Create a nice html page (may take several steps)~~ 0. Make it chrome compatible (some trouble with the first ajax call) 0. Make the search mis-spelling safe (like Google does) + 0. Changing the csv file should allow to make other databases work too. diff --git a/cherche.css b/cherche.css new file mode 100644 index 0000000..5700519 --- /dev/null +++ b/cherche.css @@ -0,0 +1,84 @@ +/* This is the main style file for + the search module */ +/* http://meyerweb.com/eric/tools/css/reset/ + v2.0 | 20110126 + License: none (public domain) */ +html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, +blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, +img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, +center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, +tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, +figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, +time, mark, audio, video { + margin: 0; + padding: 0; + border: 0; + font-size: 100%; + font: inherit; + vertical-align: baseline; } + +/* HTML5 display-role reset for older browsers */ +article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, +section { + display: block; } + +body { + line-height: 1; } + +ol, ul { + list-style: none; } + +blockquote, q { + quotes: none; } + +blockquote:before, blockquote:after { + content: ''; + content: none; } + +q:before, q:after { + content: ''; + content: none; } + +table { + border-collapse: collapse; + border-spacing: 0; } + +body { + background-color: #222; } + +#question { + background-color: #EEE; + width: 40em; + display: block; + border: none; + margin: 20ex auto 0 auto; + padding: 1em 1em 0em 1em; + color: #000; + font-size: inherit; } + +#proposition { + background-color: #EEE; + width: 40em; + display: block; + margin: 0 auto; + padding: 0em 1em 1em 1em; + color: #666666; + font-size: inherit; } + +#selected { + font-weight: bold; } + +#answer { + background-color: #DFE; + width: 40em; + display: block; + margin: 1em auto; + padding: 1em; + color: #666666; + font-size: inherit; } + +#answerTable { + width: inherit; + text-align: left; } + #answerTable th { + font-weight: bold; } diff --git a/cherche.html b/cherche.html index 809b0c1..f94ed10 100644 --- a/cherche.html +++ b/cherche.html @@ -3,14 +3,18 @@ Chercher dans la norme CISP-2 - + - ? -
Réponse ici
+ +
+
+ +
+
diff --git a/cherche.js b/cherche.js index c4c3c2a..870cf83 100644 --- a/cherche.js +++ b/cherche.js @@ -1,5 +1,4 @@ // Create a new db and fill it with the CISP info -// TODO: remove this step and create a persistent DB object // Using lokiJS, because it is enough and fast var db = new loki('db.json'); @@ -12,6 +11,8 @@ cisp.ensureUniqueIndex("Code"); var words = db.addCollection('vocabulaire2db'); words.ensureUniqueIndex("Word"); +// Some config variables +var maxNbRes = 5; //////////////////////////////////////////////////////////////////////////////// //////////////////////////////////////////////////////////////////////////////// @@ -167,8 +168,25 @@ $.ajax({ } }); -function displayMany (a) { - var out = a.map(function (o) { +function listMany (a,c) { + var out = a.slice(0,maxNbRes).map(function (o) { + return o.Orig; + }).reduce(function (pv,cv,i,a) { + if (i==c) { cv = "" + cv + "" } + return pv + cv + "
"; + },""); + + return out; +} + +var title = ""; +title += "Code"; +title += "Description"; +title += "Thème"; +title += "Catégorie"; +title += ""; + +function displayOne (o) { var d = cisp.by("Description", o.Orig); var ds = d ? ""+d.Code+"" @@ -187,35 +205,40 @@ function displayMany (a) { : ""; } return ds + cs; - }).reduce(function (pv,cv,i,a) { +} + +function displayMany (a) { + var out = a.map(displayOne).reduce(function (pv,cv,i,a) { return pv + cv; },""); - var table = ""; - table += ""; - table += ""; - table += ""; - table += ""; - table += ""; - table += ""; - - table += out; - - table += "
CodeDescriptionThèmeCatégorie
"; - return table; + return out; } // Main application function main() { + var currentSelection = 0; //console.log(cisp.data); //console.log(words.data); - $( "#question" ).keyup(function () { + $( "#question" ).keyup(function (e) { var str = removeDiacritics($( "#question" ).val()); var cleanstr = str ? str.trim() : null; + if (str == "" || str == null) { + $( "#proposition" ).empty(); + $( "#answerTable" ).empty(); + return; + } + $( "#answerTable" ).empty().append(title); var ans = words.find({'Word': { '$contains': cleanstr }}); - //console.log("Words found: ",ans); - //console.log(displayMany(ans)); - $( "#answer" ).empty().append(displayMany(ans)); + if (ans.length > 0) { + if (e.key == "ArrowDown") { + currentSelection = (currentSelection + 1) % Math.min(maxNbRes,ans.length); + } else { + currentSelection = 0; + } + $( "#proposition" ).empty().append(listMany(ans,currentSelection)); + $( "#answerTable" ).append(displayOne(ans[currentSelection])); + } }); } diff --git a/cherche.sass b/cherche.sass new file mode 100644 index 0000000..9c8de5f --- /dev/null +++ b/cherche.sass @@ -0,0 +1,49 @@ +/* This is the main style file for + the search module + +@import reset.sass + +$textColor: #000 +$mainWidth: 40em +$bgColor: #EEE +$altbgColor: #DFE + +body + :background-color #222 + +#question + :background-color $bgColor + :width $mainWidth + :display block + :border none + :margin 20ex auto 0 auto + :padding 1em 1em 0em 1em + :color $textColor + :font-size inherit + +#proposition + :background-color $bgColor + :width $mainWidth + :display block + :margin 0 auto + :padding 0em 1em 1em 1em + :color lighten($textColor,40) + :font-size inherit + +#selected + :font-weight bold + +#answer + :background-color $altbgColor + :width $mainWidth + :display block + :margin 1em auto + :padding 1em + :color lighten($textColor,40) + :font-size inherit + +#answerTable + :width inherit + :text-align left + & th + :font-weight bold diff --git a/reset.sass b/reset.sass new file mode 100644 index 0000000..28002e7 --- /dev/null +++ b/reset.sass @@ -0,0 +1,46 @@ +/* http://meyerweb.com/eric/tools/css/reset/ + v2.0 | 20110126 + License: none (public domain) + +html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, +blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, +img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, +center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, +tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, +figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, +time, mark, audio, video + margin: 0 + padding: 0 + border: 0 + font-size: 100% + font: inherit + vertical-align: baseline + +/* HTML5 display-role reset for older browsers */ + +article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, +section + display: block + +body + line-height: 1 + +ol, ul + list-style: none + +blockquote, q + quotes: none + +blockquote + &:before, &:after + content: '' + content: none + +q + &:before, &:after + content: '' + content: none + +table + border-collapse: collapse + border-spacing: 0