App.call_waiter = App.cable.subscriptions.create('CallWaiterChannel', {
//  App.messages = App.cable.subscriptions.create('MessagesChannel', {

  connected: function() {},

  disconnected: function() {},

  received: function(data) {

   var hostname = location.hostname.trim();
    if(data.from == "" || hostname == data.from)
    {
        table = data.table;
        time  = data.time;
        // for Notificaiotn message
        var class_name     = "";
        if(data.shift_ids != "" && data.shift_ids!=null){
          if(data.shift_ids.length == 1){
            class_name = ".shift_" + data.shift_ids;
          }
        }
        var element        = "#notify-wrapper"+ class_name;
        var animateEnter   = "";
        var animateExit    = "";
        if (time == 'print_error') {
          var colorName      = "alert-danger";
          var placementFrom  = "center";
          var placementAlign = "center";
          var text           = " Hello <br>  "+table ;
          style =""
        }else{
          var colorName      = "alert-warning";
          var placementFrom  = "top";
          var placementAlign = "center";
          var text           = " Calling Waiter <br>  "+table.name ;
          style ="width:180px !important;"
        }


        if (text != null || colorName != null){
         showNotification(element, colorName, text, placementFrom, placementAlign, animateEnter, animateExit);
       }

       function showNotification(element, colorName, text, placementFrom, placementAlign, animateEnter, animateExit) {
        if (colorName === null || colorName === '') { colorName = 'bg-black'; }
        if (animateEnter === null || animateEnter === '') { animateEnter = 'animated fadeInDown'; }
        if (animateExit === null || animateExit === '') { animateExit = 'animated fadeOutUp'; }
        var allowDismiss = true;

        $.notify({
          message: text
        },
        {
          element: element,
          type: colorName,
          allow_dismiss: allowDismiss,
          timer: 200000000000000,
          placement: {
            from: placementFrom,
            align: placementAlign
          },
          animate: {
            enter: animateEnter,
            exit: animateExit
          },
          template: '<div data-notify="container" style="'+style+'" class="bootstrap-notify-container alert alert-dismissible {0} ' + (allowDismiss ? "p-r-30" : "") + '" role="alert">' +
          '<button type="button" aria-hidden="true" class="close notify-close float-right m-l-5 m-t--5" data-notify="dismiss">×</button>' +
          '<span data-notify="icon"></span> ' +
          '<span data-notify="title">{1}</span> ' +
          '<span data-notify="message">{2}</span>' +
          '<div class="progress" data-notify="progressbar">' +
          '<div class="progress-bar progress-bar-{0}" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" style="width: 0%;"></div>' +
          '</div>' +
          '<a href="{3}" target="{4}" data-notify="url"></a>' +
          '</div>'
        });
      }
      //end Notificaiotn message
    }
  }
});