<div class="circle position-absolute"></div>

<h3>Group Chat demo</h3> 
<hr>  
<p>Adding to group after auth</p>
<hr>
<p></p>
<script src="https://api.imbachat.com/imbachat/v1/6470/widget"></script>
   
.main-phone {
  background: url(https://imbachat.com/themes/imbachat/assets/img/main-phone.svg)
    no-repeat;
  width: 380px;
  height: 700px;
  float: right;
  margin-top: -25px;
}
.position-absolute {
  position: absolute !important;
}
.circle {
  width: 2000px;
  height: 2000px;
  top: -1200px;
  right: 50px;
  z-index: -1;
  border-radius: 50%;
  background: linear-gradient(183.15deg, #b2dfff 63.89%, #549cff 97.24%);
}


.room_right_list{
  display: none !important;
}

#imbachat .roomvideochat #imbaSynergyChat-theme .chat_body .room_area{
  max-width: 100% !important;
}

  window.imbaApi.load();
  window.imbaApi.on('ImbaChat.Auth.Success', () => {
    
    //unique name of group
    let pipe = "GR_chat";
    
    //Title of group
    let title = "Group chat for all"
    
    window.imbaApi.addToRoom({
      pipe: pipe,
      title: title,
      is_public: 1,
      type: imbaApi.room_type.conference,
    })
  });

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.