aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
-rw-r--r--templates/web/fixmybarangay/around/tabbed_lists.html68
-rw-r--r--templates/web/fixmybarangay/header.html4
-rw-r--r--templates/web/fixmybarangay/report/_message_manager.html104
-rw-r--r--web/cobrands/fixmybarangay/message_manager.scss59
4 files changed, 153 insertions, 82 deletions
diff --git a/templates/web/fixmybarangay/around/tabbed_lists.html b/templates/web/fixmybarangay/around/tabbed_lists.html
index 77ca84ee4..14461628c 100644
--- a/templates/web/fixmybarangay/around/tabbed_lists.html
+++ b/templates/web/fixmybarangay/around/tabbed_lists.html
@@ -14,71 +14,5 @@ IF allow_creation %]
</ul>
[% IF allow_creation %]
-<ul id="message_manager" class="issue-list-a tab">
- <li id="message-control">
- <div id="mm-username-container">username:&nbsp;<span id="mm-received-username"></span></div>
- <div id="mm-status-message-container">
- <div id="mm-status-message"></div>
- </div>
- <div id="mm-login-container">
- <div class="input text">
- <label for="mm-htauth-username">MM username</label>
- <input name="mm-htauth-username" id="mm-htauth-username" type="text"/>
- </div>
- <div class="input password">
- <label for="mm-htauth-password">Password</label>
- <input name="mm-htauth-password" id="mm-htauth-password" type="password"/>
- </div>
- <div class="submit">
- <input id="available-submit" type="submit" value="Get available messages"/>
- </div>
- </div>
- </li>
- <li>
- <div id="mm-message-list" style="min-height:1em;"></div>
- </li>
-</ul>
-
-<script type="text/javascript">
-
-$(document).ready(function() {
-
- var mm_url = "[% c.config.MESSAGE_MANAGER_URL %]"; // from config
-
- var mm_populate_list = function(data) {
- $('#mm-status-message-container').text("Accessed message server as " + data['username']);
- $('input[name=mm_text]').prop('checked', false); // uncheck all
- }
-
- var mm_selected_message = function(data) {
- var msg_text = "";
- var service_id = "";
- if (data['success']) {
- // msg_text = $('#form_detail').val( $('input[name=mm_text]:checked').val() ); # == message data
- msg_text = data['data']['Message']['message'];
- service_id = data['data']['Message']['id'];
- } else {
- $('input[name=mm_text]').prop('checked', false); // uncheck all
- }
- $('#form_detail').val(msg_text);
- $('#external_source_id').val(service_id);
- }
-
- message_manager.config({url_root: mm_url});
- message_manager.setup_click_listener({callback:mm_selected_message});
-
- // problem form hidden input "external_source_id": pass the MM id into FMS, if used
- $('<input type="hidden"/>').attr({
- 'id': 'external_source_id',
- 'name': 'external_source_id',
- }).appendTo($('#problem_form'));
-
- $('#available-submit').click(function(e){
- e.preventDefault();
- message_manager.get_available_messages({callback:mm_populate_list});
- });
- $('#available-submit').click();
-});
-
-</script>
+ [% TRY %][% INCLUDE 'report/_message_manager.html' %][% CATCH file %][% END %]
[% END %]
diff --git a/templates/web/fixmybarangay/header.html b/templates/web/fixmybarangay/header.html
index a3c079565..f3ef5078a 100644
--- a/templates/web/fixmybarangay/header.html
+++ b/templates/web/fixmybarangay/header.html
@@ -25,6 +25,10 @@
[% allow_creation = !c.cobrand.only_authed_can_create || (c.user && c.user.from_council); %]
[% IF allow_creation %]
+
+ <link rel="stylesheet" href="[% version('/js/fancybox/jquery.fancybox-1.3.4.css') %]">
+ <script src="[% version('/js/fancybox/jquery.fancybox-1.3.4.pack.js') %]" charset="utf-8"></script>
+
<script src="[% version('/cobrands/fixmybarangay/message_manager_client.js') %]" charset="utf-8"></script>
<script>
$(document).ready(function() {
diff --git a/templates/web/fixmybarangay/report/_message_manager.html b/templates/web/fixmybarangay/report/_message_manager.html
index 2697e156c..ce3173e8f 100644
--- a/templates/web/fixmybarangay/report/_message_manager.html
+++ b/templates/web/fixmybarangay/report/_message_manager.html
@@ -1,6 +1,7 @@
[% IF c.user && c.user.from_council %]
-
+<!--
<input type="button" class="green-btn" value="Show Messages" id="show_messages">
+-->
<ul id="message_manager" class="issue-list-a tab" style="display: none">
<li id="message-control">
<div id="mm-username-container">username:&nbsp;<span id="mm-received-username"></span></div>
@@ -8,16 +9,16 @@
<div id="mm-status-message"></div>
</div>
<div id="mm-login-container">
- <div class="input text">
- <label for="mm-htauth-username">MM username</label>
+ <div>
+ <label for="mm-htauth-username">Username:</label>
<input name="mm-htauth-username" id="mm-htauth-username" type="text"/>
</div>
- <div class="input password">
- <label for="mm-htauth-password">Password</label>
+ <div>
+ <label for="mm-htauth-password">Password:</label>
<input name="mm-htauth-password" id="mm-htauth-password" type="password"/>
</div>
<div class="submit">
- <input id="available-submit" type="submit" value="Get available messages"/>
+ <input id="available-submit" type="submit" value="Get available messages" class="green-btn"/>
</div>
</div>
</li>
@@ -25,15 +26,35 @@
<div id="mm-message-list" style="min-height:1em;"></div>
</li>
</ul>
+<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">
+ <input type="hidden" name="message_id" id="reply_to_msg_id"/>
+ <div>
+ <label for="reply_text">Reply text:</label>
+ <textarea name="reply_text" id="reply_text"></textarea>
+ </div>
+ <div class="submit">
+ <input id="reply-submit" type="submit" value="Send Reply" class="green-btn"/>
+ </div>
+ </form>
+ </div>
+</div>
<script type="text/javascript">
$(document).ready(function() {
var mm_url = "[% c.config.MESSAGE_MANAGER_URL %]"; // from config
-
+ var problem_id = "[% problem.id %]";
+ var dummy_busy = false;
+
+ function sanitise_id(css_id) {
+ return css_id.replace(/\D/g, "");
+ }
+
var mm_populate_list = function(data) {
- $('#mm-status-message-container').text("Accessed message server as " + data['username']);
+ $('#mm-status-message-container').text("Accessed Message Manager as " + data['username']);
$('input[name=mm_text]').prop('checked', false); // uncheck all
}
@@ -50,6 +71,15 @@ $(document).ready(function() {
$('#form_detail').val(msg_text);
$('#external_source_id').val(service_id);
}
+
+ var dummy_reply_cleanup = function(data) {
+ $('#reply_text').val('');
+ dummy_busy = false;
+ }
+
+ var dummy_hide_cleanup = function(data) {
+ dummy_busy = false;
+ }
message_manager.config({url_root: mm_url});
message_manager.setup_click_listener({callback:mm_selected_message});
@@ -66,11 +96,57 @@ $(document).ready(function() {
});
$('#available-submit').click();
- $('<input type="button" value="Copy to update"/>').attr({
- 'id': 'add_support',
- 'name': 'add_support',
- 'class': 'green-btn'
- }).appendTo($('#message_manager'));
+ $('#hide-button').click(function() {
+ if ($('#message_id').val()) {
+ message_manager.hide(
+ $('#message_id').val(),
+ {callback:dummy_hide_cleanup});
+ }
+ });
+
+ $('#mm-message-list').on('mouseover', 'li.mm-msg', function(e){
+ e.stopPropagation(); // because replies are nested
+ $('.mm-msg-action', $('#mm-message-list')).stop().fadeOut(200);
+ $(this).find('> .mm-msg-action').stop().show();
+ console.log("clicked on: " + $(this).attr('id'));
+ });
+
+ $('#mm-message-list').on('click', '.mm-hide', function(e){
+ var want_hide =
+ confirm('Are you sure you want to delete the following message?\n\n"'
+ + $('p', $(this).parent()).first().text() + '"\n');
+ if (want_hide) {
+ message_manager.hide(
+ sanitise_id($(this).parent().attr('id')),
+ {callback:dummy_hide_cleanup});
+ }
+ });
+
+ $('#mm-message-list').on('click', '.mm-rep', function(e){
+ console.log("call message_manager.reply(" + $(this).parent().attr('id') + ", reply_text)");
+ });
+
+ $('#reply-submit').click(function(e) {
+ e.preventDefault();
+ if (! dummy_busy) {
+ dummy_busy = true;
+ console.log("sending reply to: " + $('#reply_to_msg_id').val());
+ message_manager.reply(
+ $('#reply_to_msg_id').val(),
+ $('#reply_text').val(),
+ {callback:dummy_reply_cleanup});
+ }
+ });
+
+ $("a#reply").fancybox({onClosed: function(){dummy_busy=false;}});
+
+
+
+ // $('<input type="button" value="Copy to update"/>').attr({
+ // 'id': 'add_support',
+ // 'name': 'add_support',
+ // 'class': 'green-btn'
+ // }).appendTo($('#message_manager'));
$('#add_support').click(function(e){
e.preventDefault();
@@ -80,7 +156,7 @@ $(document).ready(function() {
$('#external_source_id').val(id);
$('#form_update').val( $(this).val() );
$('#form_update_form').on('submit', function(e) {
- message_manager.assign_fms_id( $('#external_source_id').val(), [% problem.id %], { 'is_async': false } );
+ message_manager.assign_fms_id( $('#external_source_id').val(), problem_id, { 'is_async': false } );
});
});
});
diff --git a/web/cobrands/fixmybarangay/message_manager.scss b/web/cobrands/fixmybarangay/message_manager.scss
index 46567efce..baf461ef7 100644
--- a/web/cobrands/fixmybarangay/message_manager.scss
+++ b/web/cobrands/fixmybarangay/message_manager.scss
@@ -1,6 +1,16 @@
$mm_status_message_color: #a66;
$mm_border_color: #eee;
+$color_reply_bg: #cccccc;
+$color_bg_reply_0: #E8E8E8;
+$color_bg_reply_1: #DEDEDE;
+$color_bg_reply_2: #D6D6D6;
+$color_bg_reply_3: #D1D1D1;
+$color_bg_reply_4: #C9C9C9;
+$color_bg_reply_5: #BFBFBF;
+$color_bg_reply_6: #B8B8B8;
+
+
#message_manager {
#message-control {
@@ -38,7 +48,8 @@ $mm_border_color: #eee;
list-style-type: none;
padding: 0;
margin: 0;
- li {
+ li, ul.mm-reply-thread li {
+ position: relative;
clear: both;
margin: 4px 0 0 0;
padding: 0;
@@ -46,6 +57,25 @@ $mm_border_color: #eee;
background-color: #F6F6F6;
p {
background-color: inherit;
+ margin: 0.25em 0 0 0;
+ padding: 0.5em 1em;
+ &:hover { background-color: #efe;}
+ }
+ ul.mm-reply-thread {
+ li {
+ margin:0;
+ }
+ .mm-reply {
+ background-color: #ccc;
+ &:hover {background-color: #eef;}
+ }
+ .mm-reply-0 { margin-left: 0em; background-color: $color_bg_reply_0;}
+ .mm-reply-1 { margin-left: 1em; background-color: $color_bg_reply_1;}
+ .mm-reply-2 { margin-left: 2em; background-color: $color_bg_reply_2;}
+ .mm-reply-3 { margin-left: 3em; background-color: $color_bg_reply_3;}
+ .mm-reply-4 { margin-left: 4em; background-color: $color_bg_reply_4;}
+ .mm-reply-5 { margin-left: 5em; background-color: $color_bg_reply_5;}
+ .mm-reply-6 { margin-left: 6em; background-color: $color_bg_reply_6;}
}
&.msg-is-locked { background-color: #fdd;}
&.msg-is-owned { background-color: #dfd;}
@@ -64,6 +94,23 @@ $mm_border_color: #eee;
font-weight: normal;
margin: 0.1em 0 0.1em 4.5em;
}
+ .mm-msg-action {
+ display: none;
+ padding: 0.2em 0.4em;
+ color: white;
+ text-align: center;
+ position: absolute;
+ top: 0;
+ &:hover { background-color: black;}
+ }
+ .mm-hide {
+ right:0px;
+ background-color: red;
+ }
+ .mm-rep {
+ right:1.4em;
+ background-color: green;
+ }
}
}
}
@@ -71,3 +118,13 @@ $mm_border_color: #eee;
margin: 1em;
}
}
+#reply-form-container {
+ #reply-form{
+ margin-top: 2em;
+ border: 1px solid $mm_border_color;
+ background-color: #ffdddd;
+ }
+ .submit {
+ margin: 1em 0;
+ }
+}