From 948263a867eea38cd91bdd40ec321c25c598ae85 Mon Sep 17 00:00:00 2001 From: Pierre-antoine Comby Date: Sat, 28 Mar 2020 17:44:22 +0100 Subject: [PATCH] color codes from note balances --- static/js/base.js | 131 +++++++++++++++++++-------------- templates/note/conso_form.html | 16 ++-- 2 files changed, 87 insertions(+), 60 deletions(-) diff --git a/static/js/base.js b/static/js/base.js index f7085850..61372c76 100644 --- a/static/js/base.js +++ b/static/js/base.js @@ -48,10 +48,27 @@ function getMatchedNotes(pattern, fun) { /** * Generate a
  • entry with a given id and text */ -function li(id, text) { - return "
  • " + text + "
    • \n"; } +/** + * Return style to apply according to the balance of the note + * @param balance The balance of the note. + */ +function displayStyle(balance){ + if (balance < -5000){ + return " text-danger bg-dark" + } + else if(balance <-1000){ + return " text-danger" + } + else if(balance < 0){ + return "text-warning" + } + return "" +} + /** * Render note name and picture @@ -62,24 +79,28 @@ function li(id, text) { */ function displayNote(note, alias, user_note_field=null, profile_pic_field=null) { if (!note.display_image) { - note.display_image = 'https://nk20.ynerant.fr/media/pic/default.png'; - $.getJSON("/api/note/note/" + note.id + "/?format=json", function(new_note) { - note.display_image = new_note.display_image.replace("http:", "https:"); - note.name = new_note.name; - note.balance = new_note.balance; - - displayNote(note, alias, user_note_field, profile_pic_field); - }); - return; + note.display_image = '/media/pic/default.png'; } let img = note.display_image; if (alias !== note.name) alias += " (aka. " + note.name + ")"; if (user_note_field !== null) + + $("#" + user_note_field).addClass(displayStyle(note.balance)); $("#" + user_note_field).text(alias + (note.balance == null ? "" : (" : " + pretty_money(note.balance)))); - if (profile_pic_field != null) + if (profile_pic_field != null){ $("#" + profile_pic_field).attr('src', img); + $("#" + profile_pic_field).click(function(){ + console.log(note); + if(note.resourcetype == "NoteUser"){ + document.location.href = "/accounts/user/" + note.user; + } + else if(note.resourcetype == "NoteClub"){ + document.location.href = "/accounts/club/" + note.club; + } + }); + } } /** @@ -153,8 +174,11 @@ function autoCompleteNote(field_id, alias_matched_id, note_list_id, notes, notes // When the user type "Enter", the first alias is clicked field.keypress(function(event) { - if (event.originalEvent.charCode === 13) - $("#" + alias_matched_id + " li").first().trigger("click"); + if (event.originalEvent.charCode === 13 && notes.length > 0) { + let li_obj = $("#" + alias_matched_id + " li").first(); + displayNote(notes[0], li_obj.text(), user_note_field, profile_pic_field); + li_obj.trigger("click"); + } }); // When the user type something, the matched aliases are refreshed @@ -164,51 +188,46 @@ function autoCompleteNote(field_id, alias_matched_id, note_list_id, notes, notes let pattern = field.val(); // If the pattern is not modified, we don't query the API - if (pattern === old_pattern || pattern === "") + if (pattern === old_pattern) return; - old_pattern = pattern; - - // Clear old matched notes notes.length = 0; let aliases_matched_obj = $("#" + alias_matched_id); let aliases_matched_html = ""; - - // Get matched notes with the given pattern - getMatchedNotes(pattern, function(aliases) { + // get matched Alias with note associated + if(pattern == ""){ + aliases_matched_obj = $("#" + alias_matched_id); + aliases_matched_html = ""; + aliases_matched_obj.html("") + notes.length = 0; + return; + } + + $.getJSON("/api/note/consumer/?format=json&alias=" + + pattern + + "&search=user|club&ordering=normalized_name", + function(consumers){ // The response arrived too late, we stop the request if (pattern !== $("#" + field_id).val()) return; - - aliases.results.forEach(function (alias) { - let note = alias.note; - note = { - id: note, - name: alias.name, - alias: alias, - balance: null - }; - aliases_matched_html += li(alias_prefix + "_" + alias.id, alias.name); + consumers.results.forEach(function (consumer){ + let note = consumer.note; + extra_css = displayStyle(note.balance); + aliases_matched_html += li(alias_prefix + '_' + consumer.id, + consumer.name, + extra_css); notes.push(note); }); - - // Display the list of matched aliases aliases_matched_obj.html(aliases_matched_html); - - notes.forEach(function (note) { - let alias = note.alias; - let alias_obj = $("#" + alias_prefix + "_" + alias.id); - // When an alias is hovered, the profile picture and the balance are displayed at the right place - alias_obj.hover(function () { - displayNote(note, alias.name, user_note_field, profile_pic_field); + consumers.results.forEach(function(consumer){ + let note = consumer.note; + let consumer_obj = $("#" + alias_prefix+ "_" + consumer.id); + consumer_obj.hover(function(){ + displayNote(consumer.note, consumer.name, user_note_field,profile_pic_field) }); - - // When the user click on an alias, the associated note is added to the emitters - alias_obj.click(function () { - field.val(""); - old_pattern = ""; - // If the note is already an emitter, we increase the quantity + consumer_obj.click(function(){ + field.val(""); old_pattern = ""; // reset input field var disp = null; notes_display.forEach(function (d) { // We compare the note ids @@ -220,8 +239,8 @@ function autoCompleteNote(field_id, alias_matched_id, note_list_id, notes, notes // In the other case, we add a new emitter if (disp == null) { disp = { - name: alias.name, - id: note.id, + name: consumer.name, + id: consumer.id, note: note, quantity: 1 }; @@ -236,8 +255,11 @@ function autoCompleteNote(field_id, alias_matched_id, note_list_id, notes, notes let note_list = $("#" + note_list_id); let html = ""; notes_display.forEach(function (disp) { - html += li(note_prefix + "_" + disp.id, disp.name - + "" + disp.quantity + ""); + html += li(note_prefix + "_" + disp.id, + disp.name + + "" + + disp.quantity + "", + displayStyle(disp.note.balance)); }); // Emitters are displayed @@ -254,11 +276,12 @@ function autoCompleteNote(field_id, alias_matched_id, note_list_id, notes, notes line_obj.click(removeNote(disp, note_prefix, notes_display, note_list_id, user_note_field, profile_pic_field)); }); - }); + }) }); - }); - }); -} + + });// end getJSON alias + }); +}// end function autocomplete // When a validate button is clicked, we switch the validation status function de_validate(id, validated) { diff --git a/templates/note/conso_form.html b/templates/note/conso_form.html index b108a96f..36659849 100644 --- a/templates/note/conso_form.html +++ b/templates/note/conso_form.html @@ -11,9 +11,10 @@
    {# User details column #}
    -
    +
    + id="profile_pic" alt="" + class="img-thumbnail">
    @@ -25,14 +26,17 @@

    - {% trans "Select emitters" %} + {% trans "Consum" %}

    +
    -
    - -
      +
    +
    + +