<!DOCTYPE html>
<html ng-app="app">

  <head>
    <link data-require="bootstrap-css@3.3.6" data-semver="3.3.6" rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.css" />
    <script data-require="jquery@3.0.0" data-semver="3.0.0" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0/jquery.js"></script>
    <script data-require="angularjs@1.5.7" data-semver="1.5.7" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular.min.js"></script>
    <link rel="stylesheet" href="style.css" />
    <script src="script.js"></script>
  </head>

  <body ng-controller="Ctrl">
    <div class="container">
      <h1>Send a Message</h1>
      <form ng-submit="send()">
        <div class="form-group">
          <label for="subject">Subject</label>
          <input ng-model="title" type="text" class="form-control" id="subject" placeholder="Subject" required/>
        </div>
        <div class="form-group">
          <label for="contentMessage">Body Message</label>
          <textarea ng-model="message" class="form-control" placeholder="content message" required></textarea>
        </div>
        <button id="btnSend" type="submit" class="btn btn-primary btn-lg">Send</button>
      </form>
      <br/>
      <pre>{{console | json}}</pre>
      <pre ng-if="error" class="bg-danger">{{error}}</pre>
    </div>
  </body>

</html>
(function(){
  
angular.module('app', [])
.controller('Ctrl', function($scope, $timeout, $http) {                    
    
    var API_ACCESS_KEY = 'AIzaSyCD6FpPz-hyZ-FvZvgdyqAeYYdX2X1iE18';
    var ajaxUrl = 'https://fcm.googleapis.com/fcm/send';
    
    var token = '';
    ajaxUrl = 'https://onesignal.com/api/v1/notifications';
    var APP_ID = ''; 
    
    
    /*
      Here we add the tokens ids the cellphone
      SEE:
      https://firebase.google.com/docs/cloud-messaging/server
      https://firebase.google.com/docs/cloud-messaging/concept-options#senderid
    */
    var listIds = ['fXpRufJNqAE:APA91bG_kGbNu0HgQj6tePSGdwEGNbicoLPz_LqZ3UxFD-ATSfKMxICw0wXiU2pOK43agjanL7hb64PvM0QEPgHixwgaaT2RMOfdgb2xpS_QGWxz6K6Jn2q72KrbTUyzfQUPeVRYjvDg'];
    
    $scope.console = {};
    $scope.error = null;
    
    $scope.title = "this is title";
    $scope.message = "the description form to do a test.";
    
    
    $scope.send = function(){
				  
				  var btn = jQuery('#btnSend');
				  
				  var params = {
  				  registration_ids: listIds,// or "to" param
    				  data: {
    				    body: $scope.message,
    				    title: $scope.title
    				  },
    				  body: $scope.message,
    				  title: $scope.title
  				};
  				
  				params = {
              app_id: APP_ID,
            included_segments: ["All"],
            data: {
    				    body: $scope.message,
    				    title: $scope.title
    			  },
            contents: {"en": "Are you ok? Open the app"},
            headings: {"en": "Hello Carlos"}
          };
				  
				  btn.attr('disabled', true).text('Loading...');
          
				  
          jQuery.ajax({
            url: ajaxUrl,
            method: 'post',
            contentType: 'application/json',
            processData: false,
            dataType: 'json',
            headers: {
             // Authorization: 'key='+API_ACCESS_KEY
              Authorization: 'Basic '+token
            },
            data: JSON.stringify(params)
          }).done(function(result){
            btn.attr('disabled', false).text('Send');
            $timeout(function(){
              $scope.console = result;
            });
          }).fail(function(error){
            btn.attr('disabled', false).text('Send');
            $timeout(function(){
              $scope.error = error.responseText;
            });
          });
          
    };
    
});
 
 
})();
/* Styles go here */