facebookarchive · shivkumarsah · Jul 14, 2017 · Sep 5, 2017 · Sep 27, 2017
diff --git a/cloud/endagaweb/static/js/dashboard/sms-broadcast.js b/cloud/endagaweb/static/js/dashboard/sms-broadcast.js
@@ -0,0 +1,98 @@
+/*
+ * Copyright (c) 2016-present, Facebook, Inc.
+ * All rights reserved.
+ *
+ * This source code is licensed under the BSD-style license found in the
+ * LICENSE file in the root directory of this source tree. An additional grant
+ * of patent rights can be found in the PATENTS file in the same directory.
+ */
+  function broadcastSms() {
+    var data = {
+      sendto: $('input[type=radio][name="send_to"]:checked').val(),
+      network_id: $('#network_id').val(),
+      tower_id: $('#bts_id').val(),
+      imsi: $('#imsi').val(),
+      message: $('#message').val(),
+      csrfmiddlewaretoken: $('#token').val(),
+    };
+    $.post('/dashboard/broadcast', data, function(response) {
+      if (response['status'] == 'ok') {
+        // Show that it was successful and then reload the page.
+        // Clear out any old messages and show the div again.
+        $('#messages-container').html();
+        $('#messages-container').css('opacity', 1);
+        var html = '';
+        response['messages'].map(function(message) {
+          html += '<div class="alert alert-success">' + message + '</div>';
+        });
+        $('#messages-container').html(html).show();
+        setTimeout(function() {
+          location.reload();
+        }, 800);
+      } else {
+        // Show the messages that were sent back.
+        // Clear out any old messages and show the div again.
+        $('#messages-container').html();
+        $('#messages-container').css('opacity', 1);
+        var html = '';
+        response['messages'].map(function(message) {
+          html += '<div class="alert alert-danger">' + message + '</div>';
+        });
+        $('#messages-container').html(html).show();
+        setTimeout(function() {
+          $('#messages-container').fadeTo(500, 0);
+          $('#messages-container').hide();
+        }, 4000);
+      }
+    });
+    return false;
+  }
+
+$(document).ready(function() {
+
+  $('input[type=radio][name="send_to"]').change(function() {
+    if (this.value == 'network') {
+        $('#network_row').show();
+        $('#tower_row').hide();
+        $('#imsi_row').hide();
+    } else if (this.value == 'tower') {
+        $('#network_row').hide();
+        $('#tower_row').show();
+        $('#imsi_row').hide();
+    } else if (this.value == 'imsi') {
+        $('#network_row').hide();
+        $('#tower_row').hide();
+        $('#imsi_row').show();
+    } else {
+        $('#network_row').hide();
+        $('#tower_row').hide();
+        $('#imsi_row').show();
+    }
+  });
+  $('#broadcast-modal').on('shown.bs.modal', function() {
+    $('#broadcast-form')[0].reset();
+    $('#network_row').hide();
+    $('#tower_row').hide();
+    $('#imsi_row').show();
+    if($('input[type=radio][name="send_to"]:checked').val()) {
+        var selected = $('input[type=radio][name="send_to"]:checked').val();
+        if (selected == 'network') {
+            $('#network_row').show();
+            $('#tower_row').hide();
+            $('#imsi_row').hide();
+        } else if (selected == 'tower') {
+            $('#network_row').hide();
+            $('#tower_row').show();
+            $('#imsi_row').hide();
+        } else if (selected == 'imsi') {
+            $('#network_row').hide();
+            $('#tower_row').hide();
+            $('#imsi_row').show();
+        } else {
+            $('#network_row').hide();
+            $('#tower_row').hide();
+            $('#imsi_row').show();
+        }
+    }
+  });
+});
diff --git a/cloud/endagaweb/templates/dashboard/activity.html b/cloud/endagaweb/templates/dashboard/activity.html
@@ -145,14 +145,45 @@ <h4>No events match these filters!</h4>
         </span>
     </div>
 </div>
+<div class='modal fade' id='pwd-dialog-modal'>
+    <div class='modal-dialog'>
+        <div class='modal-content'>
+            <div class='modal-header'>
+                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+                    <span aria-hidden="true">&times;</span>
+                </button>
+                <h4 class='modal-title'>
+                    <p>Hello <strong>{{ user_profile.display_name }}</strong>, please enter your password for authorization.</p>
+                 </h4>
+            </div>
+            <div class='modal-body'>
+                 <div id='messages-container'></div>
+                <form id='password-authorization'>
+                    <div class='form-group'>
+                        <div class='controls'>
+                              <input class='textinput textInput form-control' id='pwd-input' name='pwd' type='password'>
+                        </div>
+                    </div><!-- /.form-group -->
+
+                </form>
+            </div> <!-- /.modal-body -->
+            <div class='modal-footer' id="modal-footerId">
+                <button type='button' class='btn btn-default' data-dismiss='modal'>Cancel</button>
+                <button class='btn btn-primary' type='button' id='pwd-dialog-submit'>
+                    OK
+                </button>
+            </div>
+        </div>
+    </div>
+</div>
 
 <div class="row">
     <div class="col-xs-12">
     <p>
     {% if event_count > 100000 %}
         Too many results to export, try a shorter date range.
     {% elif event_count > 0 %}
-        <a href="?page={{ events.number }}&csv=1">Export results as CSV</a>
+        <a href='#' data-toggle='modal' data-target='#pwd-dialog-modal'>Export results as CSV</a>
     {% endif %}
     </p>
     </div>
@@ -175,4 +206,58 @@ <h4>No events match these filters!</h4>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.9.0/moment.min.js"></script>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.14.30/js/bootstrap-datetimepicker.min.js"></script>
 <script src="/static/js/dashboard/activity.js"></script>
+<script>
+
+      // Handle clicks on the pwd-dialog-submit button.
+      $('#pwd-dialog-submit').click(function() {
+        submitPwdDialogData();
+      });
+
+      // Handle <enter> keypress on pwd-dialog-submit.
+      $('input, #pwd-dialog-submit').keypress(function(e) {
+        if (e.keyCode == 13) {
+          e.preventDefault();
+          submitPwdDialogData();
+        }
+      });
+
+      $('#pwd-dialog-modal').on('hide.bs.modal', function (e) {
+        $(this).find('form').trigger('reset');
+      });
+
+    function submitPwdDialogData() {
+
+      var data = {
+        password: $('#pwd-input').val(),
+        csrfmiddlewaretoken: '{{ csrf_token }}',
+      };
+      $.post('/dashboard/activity', data, function(response) {
+        if (response['status'] == 'ok') {
+          // Clear out any old messages and show the div again.
+          $('#messages-container').html();
+          $('#messages-container').css('opacity', 1);
+          var message = 'Password Authorization Successful.';
+          var html = '<div class="alert alert-success">' + message + '</div>';
+          $('#messages-container').html(html);
+          setTimeout(function() {
+             window.location="?page={{ events.number }}&csv=1"
+             $('#pwd-dialog-modal').modal('hide');
+             $('#messages-container').fadeTo(200, 0);
+          }, 2000);
+        } else {
+          $('#messages-container').html();
+          $('#messages-container').css('opacity', 1);
+          var message = 'Incorrect password.';
+          var html = '<div class="alert alert-danger">' + message + '</div>';
+          $('#messages-container').html(html);
+          setTimeout(function() {
+            $('#messages-container').html("")
+            $('#pwd-input').val("");
+          }, 2000);
+        }
+      });
+    }
+
+  </script>
+
 {% endblock %}
diff --git a/cloud/endagaweb/templates/dashboard/network_detail/denomination.html b/cloud/endagaweb/templates/dashboard/network_detail/denomination.html
@@ -149,6 +149,7 @@ <h4>
 
     <script type="text/javascript"
             src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.10.0/jquery.validate.min.js"></script>
+    <script src="/static/js/dashboard/sms-broadcast.js"></script>
     <script type="text/javascript">
         $(document).ready(function () {
             $('.number').keypress(function (event) {

diff --git a/cloud/endagaweb/templates/dashboard/network_detail/edit.html b/cloud/endagaweb/templates/dashboard/network_detail/edit.html
@@ -78,6 +78,7 @@
 
 {% block js %}
 <script>
+<script src="/static/js/dashboard/sms-broadcast.js"></script>
 $(function() {
   // Show or hide parts of the form when autoupgrade is enabled or disabled.
   $('input:radio').change(function() {

diff --git a/cloud/endagaweb/templates/dashboard/network_detail/inactive-subscribers.html b/cloud/endagaweb/templates/dashboard/network_detail/inactive-subscribers.html
@@ -150,5 +150,6 @@
     });
   });
 </script>
+<script src="/static/js/dashboard/sms-broadcast.js"></script>
 {% endblock %}
 
diff --git a/cloud/endagaweb/templates/dashboard/network_detail/info.html b/cloud/endagaweb/templates/dashboard/network_detail/info.html
@@ -81,3 +81,7 @@
   </div> <!-- /.col-md-4 -->
 </div>
 {% endblock %}
+
+{% block js %}
+<script src="/static/js/dashboard/sms-broadcast.js"></script>
+{% endblock %}
diff --git a/cloud/endagaweb/templates/dashboard/network_detail/nav.html b/cloud/endagaweb/templates/dashboard/network_detail/nav.html
@@ -43,5 +43,10 @@
         {% else %}{% url 'network-edit' %}
         {% endif %}">Edit</a>
     </li>
+
+    <li role="presentation">
+      <a href="javascript:void(0);" data-toggle='modal' data-target='#broadcast-modal'>SMS Broadcast</a>
+    </li>
   </ul>
 </div>
+{% include "dashboard/subscriber_detail/broadcast.html" with target='network' %}
diff --git a/cloud/endagaweb/templates/dashboard/subscriber_detail/activity.html b/cloud/endagaweb/templates/dashboard/subscriber_detail/activity.html
@@ -121,4 +121,5 @@ <h4>No events matched your search.</h4>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.9.0/moment.min.js"></script>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.14.30/js/bootstrap-datetimepicker.min.js"></script>
 <script src="/static/js/dashboard/activity.js"></script>
+<script src="/static/js/dashboard/sms-broadcast.js"></script>
 {% endblock %}
diff --git a/cloud/endagaweb/templates/dashboard/subscriber_detail/adjust_credit.html b/cloud/endagaweb/templates/dashboard/subscriber_detail/adjust_credit.html
@@ -69,4 +69,5 @@
   var adjust_credit_url = "{% url 'subscriber-adjust-credit' imsi=subscriber.imsi %}";
 </script>
 <script src="/static/js/dashboard/subscriber.js"></script>
-{% endblock %}
+<script src="/static/js/dashboard/sms-broadcast.js"></script>
+{% endblock %}
diff --git a/cloud/endagaweb/templates/dashboard/subscriber_detail/broadcast.html b/cloud/endagaweb/templates/dashboard/subscriber_detail/broadcast.html
@@ -0,0 +1,71 @@
+{% load apptags %}
+<div class='modal fade' id='broadcast-modal'>
+    <form id='broadcast-form' name="broadcast-form" method="post" onsubmit="return broadcastSms();">
+        <div class='modal-dialog'>
+            <div class='modal-content'>
+                <div class='modal-header'>
+                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+                        <span aria-hidden="true">&times;</span>
+                    </button>
+                    <h4 class='modal-title'>
+                        Broadcast SMS
+                        <i class='fa fa-bullhorn'></i>
+                    </h4>
+                </div>
+                <div class='modal-body'>
+                    <div id='messages-container'></div>
+                    <div class="form-group">
+                        <label class="control-label">Send to</label>
+                        <div class='controls'>
+                            <label class="radio radio-inline">
+                                <input id="send_to_network" type="radio" name="send_to"
+                                       value="network" {% if target == 'network' %} checked="checked" {% endif %}>Network
+                            </label>
+                            <label class="radio radio-inline">
+                                <input id="send_to_tower" type="radio" name="send_to"
+                                       value="tower" {% if target == 'tower' %} checked="checked" {% endif %}>Tower
+                            </label>
+                            <label class="radio radio-inline">
+                                <input id="send_to_imsi" type="radio" name="send_to"
+                                       value="imsi" {% if target == 'imsi' %} checked="checked" {% endif %}>IMSI
+                            </label>
+                        </div>
+                    </div>
+                    <div class="form-group" id="network_row">
+                        <label class="control-label">Network</label>
+                        <div class='controls'>
+                            <span>{{user_profile.network.name }}</span>
+                            <input type="hidden" name="network_id" id="network_id" value="{{user_profile.network.id }}"/>
+                        </div>
+                    </div>
+                    <div class="form-group" id="tower_row">
+                        <label class="control-label">Tower</label>
+                        <div class='controls'>
+                            {% get_towers network.id uuid %}
+                        </div>
+                    </div>
+                    <div class="form-group" id="imsi_row">
+                        <label class="control-label">IMSI(s)</label>
+                        <div class='controls'>
+                            <input type="text" name="imsi" id="imsi" class="form-control" value="{{ imsi }}" />
+                            <span>You can add multiple IMSIs seperated by comma(,)</span>
+                        </div>
+                    </div>
+
+                    <div class="form-group">
+                        <label for="message" class="control-label">Message</label>
+                        <div class='controls'>
+                            <textarea name="message" id="message" cols="48" rows="4" class="form-control" maxlength="140" required></textarea>
+                            <span>Maximum 140 characters.</span>
+                        </div>
+                    </div>
+                </div> <!-- /.modal-body -->
+                <div class='modal-footer'>
+                    <button type='button' class='btn btn-default' data-dismiss='modal'>Cancel</button>
+                    <input type="hidden" name="token" id="token" value="{{ csrf_token }}">
+                    <input class="btn btn-primary" type="submit" value="Broadcast" id='broadcast_submit'>
+                </div>
+            </div>
+        </div>
+    </form>
+</div>
diff --git a/cloud/endagaweb/templates/dashboard/subscriber_detail/edit.html b/cloud/endagaweb/templates/dashboard/subscriber_detail/edit.html
@@ -131,6 +131,7 @@ <h4 class='modal-title'>
 {% endblock %}
 
 {% block js %}
+<script src="/static/js/dashboard/sms-broadcast.js"></script>
 <script>
   /* Number Deactivation
     1) click a deactivation link

diff --git a/cloud/endagaweb/templates/dashboard/subscriber_detail/info.html b/cloud/endagaweb/templates/dashboard/subscriber_detail/info.html
@@ -70,3 +70,7 @@
   </div>
 </div>
 {% endblock %}
+
+{% block js %}
+<script src="/static/js/dashboard/sms-broadcast.js"></script>
+{% endblock %}
diff --git a/cloud/endagaweb/templates/dashboard/subscriber_detail/nav.html b/cloud/endagaweb/templates/dashboard/subscriber_detail/nav.html
@@ -23,11 +23,8 @@
         {% endif %}">Activity</a>
     </li>
 
-    <li role="presentation" class="{% if active_tab == 'send_sms' %} active {% endif %}">
-      <a href="
-        {% if active_tab == 'send sms' %} #
-        {% else %} {% url 'subscriber-send-sms' imsi=imsi %}
-        {% endif %}">Send SMS</a>
+    <li role="presentation">
+      <a href="javascript:void(0);" data-toggle='modal' data-target='#broadcast-modal'>Send SMS</a>
     </li>
 
     <li role="presentation" class="{% if active_tab == 'adjust_credit' %} active {% endif %}">
@@ -46,3 +43,5 @@
 
   </ul>
 </div>
+
+{% include "dashboard/subscriber_detail/broadcast.html" with target='imsi' imsi=subscriber.imsi %}
diff --git a/cloud/endagaweb/templates/dashboard/tower_detail/deregister.html b/cloud/endagaweb/templates/dashboard/tower_detail/deregister.html
@@ -150,14 +150,13 @@ <h4 class='modal-title'>
 </div>
 {% endif %}
 
-
 {% endblock %}
 
 </div>
 
 
 {% block js %}
-
+  <script src="/static/js/dashboard/sms-broadcast.js"></script>
   <script>
 
     $(function() {

diff --git a/cloud/endagaweb/templates/dashboard/tower_detail/edit.html b/cloud/endagaweb/templates/dashboard/tower_detail/edit.html
@@ -86,6 +86,7 @@
   <script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet/0.7.7/leaflet.js"></script>
   <script src="https://cdnjs.cloudflare.com/ajax/libs/Leaflet.awesome-markers/2.0.2/leaflet.awesome-markers.js"></script>
   <script src="https://homes.cs.washington.edu/~kheimerl/ccm/leaflet-animated-draggable-marker.js"></script>
+  <script src="/static/js/dashboard/sms-broadcast.js"></script>
   <script>
 
     // Init the map so we can move it later and