diff options
| -rw-r--r-- | templates/web/fixmybarangay/footer.html | 57 | ||||
| -rw-r--r-- | templates/web/fixmybarangay/report/_message_manager.html | 11 | ||||
| -rw-r--r-- | web/cobrands/fixmybarangay/message_manager.scss | 48 |
3 files changed, 97 insertions, 19 deletions
diff --git a/templates/web/fixmybarangay/footer.html b/templates/web/fixmybarangay/footer.html index 737b151ac..cb1a8369f 100644 --- a/templates/web/fixmybarangay/footer.html +++ b/templates/web/fixmybarangay/footer.html @@ -28,7 +28,7 @@ </div> [% IF global.want_fmb_hidden_dialogs %] - <!-- fancybox hidden dialogues for message-manager reply/hide --> + <!-- fancybox hidden dialogues for message-manager reply/hide/help --> <div style="display:none"> <div id="reply-form-container"> <form action="#" id="reply-form" onsubmit="event.returnValue = false; return false;" method="post" accept-charset="utf-8"> @@ -74,6 +74,61 @@ </form> </div> </div> + <div style="display:none"> + <div id="mm-help" style="font-size:90%;"> + <h2> Accessing Message Manager from FixMyBarangay (FMB)</h2> + <h3> + Logging into Message Manager + </h3> + <p> + You'll need a username and password (ask your manager if you haven't already got one). Your Message Manager password + might not be the same as your FMB password. + </p> + <p> + When you've logged in, you'll see the currently available messages (and any replies that have been sent to them). + You <em>only</em> see messages that are waiting to be used to make reports, and which are tagged with the keywords + your login allows you to see (these may mean you only see messages for your own barangay). + If you want to see any other messages, you'll need to have a manager or admin account on Message Manager: click on the + <a href="[% c.config.MESSAGE_MANAGER_URL %]">admin</a> link to get there. + </p> + <h3> + Creating a new report from a message + </h3> + <p> + If you want to use a message to create a problem report, you'll need to select it first. Click on the radio button. When the message + is selected, it will go bright green. Now when you click on the map, the report will be used to create the report. + </p> + <p> + To stop two people replying to a message at the same time, if anyone else has just started working on it, you'll see a message + warning you, and you won't be able to select the radio button. Normally, if nobody works with a message, such a lock is released + after about 3 minutes. + </p> + <h3> + Replying to a message + </h3> + <p> + You can send an SMS back to the original sender: just hover over the message and click <span class="demo_reply_btn">reply</span>. It will usually + take a few minutes for the message to arrive. + </p> + <h3> + Getting message info + </h3> + <p> + Hover over a message and click on its <span class="demo_info_btn">i</span> button to see when it was sent. + You can also see the sender, although not their + actual number (instead the number is scrambled, but will be the <em>same scrambled number</em> on other message's they've sent). + </p> + <h3> + Hiding a message + </h3> + <p> + If a message can't be used to create a report, you can hide it by hovering over it and clicking its <span class="demo_hide_btn">X</span> button. If you're not + going to create a problem report with this message, you might like to reply first, to tell the person who sent the message why not. + When you click the X, give a reason why you're hiding it so other staff (managers in Message Manager) can see why the message was hidden. + </p> + </div> + </div> + [% END %] <!-- [% INCLUDE 'debug_footer.html' %] --> diff --git a/templates/web/fixmybarangay/report/_message_manager.html b/templates/web/fixmybarangay/report/_message_manager.html index e7f6d3ca9..137bb6ca8 100644 --- a/templates/web/fixmybarangay/report/_message_manager.html +++ b/templates/web/fixmybarangay/report/_message_manager.html @@ -5,11 +5,12 @@ [% END %] <ul id="message_manager" class="issue-list-a tab" style="display: none"> + <li id="mm-admin-buttons"> + <a id="mm-link-to-refresh" href="#">refresh</a> + <a id="mm-link-to-admin" href="[% c.config.MESSAGE_MANAGER_URL %]">admin</a> + <a id="mm-link-to-help" href="#mm-help">help</a> + </li> <li id="message-control"> - <div id="mm-admin-buttons"> - <a id="mm-link-to-admin" href="[% c.config.MESSAGE_MANAGER_URL %]">[admin]</a> - <a id="mm-link-to-refresh" href="#">[refresh]</a> - </div> <div id="mm-username-container">username: <span id="mm-received-username"></span></div> <div id="mm-status-message-container"> <img id="mm-spinner" src="/cobrands/fixmybarangay/images/fmb-spinner-16x16.gif" alt=""/> @@ -193,6 +194,8 @@ $(document).ready(function() { mm_refresh_messages(); }); + $("a#mm-link-to-help").fancybox(); + message_manager.populate_boilerplate_strings('hide-reason'); message_manager.populate_boilerplate_strings('reply'); }); diff --git a/web/cobrands/fixmybarangay/message_manager.scss b/web/cobrands/fixmybarangay/message_manager.scss index a58e44509..ac1e6b976 100644 --- a/web/cobrands/fixmybarangay/message_manager.scss +++ b/web/cobrands/fixmybarangay/message_manager.scss @@ -13,10 +13,31 @@ $color_bg_reply_5: #BFBFBF; $color_bg_reply_6: #B8B8B8; $color_bg_mm_list: #F6F6F6; +$color_bg_btn_hide: #ff0000; +$color_bg_btn_reply: #008000; +$color_bg_btn_info: #0000ff; + + $weak_text_color: #666; #message_manager { - + margin-top: 0; + li#mm-admin-buttons { + margin: -0.5em 0 0 0; + text-align: right; + font-size:80%; + padding:4px 8px 4px 0; + a { + padding: 0.25em 0.5em; + border:1px solid $mm_border_color; + margin: 0 0.5em; + display: inline-block; + } + background-color: #fff; + &:hover { + background-color: #fff; + } + } #message-control { #mm-username-container { display: none; // hidden during dev @@ -134,15 +155,15 @@ $weak_text_color: #666; } .mm-hide { right:0px; - background-color: red; + background-color: $color_bg_btn_hide; } .mm-info { right:1.5em; - background-color: blue; + background-color: $color_bg_btn_info; } .mm-rep { right:2.6em; - background-color: green; + background-color: $color_bg_btn_reply; } } } @@ -173,14 +194,13 @@ $weak_text_color: #666; display: none; } } -div#mm-admin-buttons { - display:block; - text-align: right; - float:right; - font-size:80%; - padding:4px 8px 4px 0; - a { - display: block; - } - +#mm-help { + .demo_hide_btn, .demo_reply_btn, .demo_info_btn { + color: #fff; + font-weight: bold; + padding: 0.2em 0.4em; + } + .demo_hide_btn { background-color: $color_bg_btn_hide; } + .demo_reply_btn { background-color: $color_bg_btn_reply; } + .demo_info_btn { background-color: $color_bg_btn_info; } } |