Merge branch 'dev'

"merge dev to master"

pom.xml

@@ -35,11 +35,23 @@
         </dependency>
 
         <dependency>
-            <groupId>mysql</groupId>
-            <artifactId>mysql-connector-java</artifactId>
-            <scope>runtime</scope>
+            <groupId>org.postgresql</groupId>
+            <artifactId>postgresql</artifactId>
+            <version>42.2.1</version>
+        </dependency>
+        <!--<dependency>-->
+            <!--<groupId>mysql</groupId>-->
+            <!--<artifactId>mysql-connector-java</artifactId>-->
+            <!--<scope>runtime</scope>-->
+        <!--</dependency>-->
+        <dependency>
+            <groupId>org.springframework.boot</groupId>
+            <artifactId>spring-boot-starter-websocket</artifactId>
+        </dependency>
+        <dependency>
+            <groupId>org.springframework.boot</groupId>
+            <artifactId>spring-boot-starter-data-rest</artifactId>
         </dependency>
-
         <!--<dependency>-->
             <!--<groupId>com.h2database</groupId>-->
             <!--<artifactId>h2</artifactId>-->
@@ -55,6 +67,36 @@
             <artifactId>spring-restdocs-mockmvc</artifactId>
             <scope>test</scope>
         </dependency>
+
+        <dependency>
+            <groupId>org.webjars</groupId>
+            <artifactId>webjars-locator-core</artifactId>
+        </dependency>
+        <dependency>
+            <groupId>org.webjars</groupId>
+            <artifactId>sockjs-client</artifactId>
+            <version>1.0.2</version>
+        </dependency>
+        <dependency>
+            <groupId>org.webjars</groupId>
+            <artifactId>stomp-websocket</artifactId>
+            <version>2.3.3</version>
+        </dependency>
+        <dependency>
+            <groupId>org.webjars</groupId>
+            <artifactId>bootstrap</artifactId>
+            <version>3.3.7</version>
+        </dependency>
+        <dependency>
+            <groupId>org.webjars</groupId>
+            <artifactId>jquery</artifactId>
+            <version>3.1.0</version>
+        </dependency>
+        <dependency>
+            <groupId>org.apache.tomcat</groupId>
+            <artifactId>tomcat-jdbc</artifactId>
+            <version>8.5.31</version>
+        </dependency>
     </dependencies>
 
     <build>

src/main/java/com/ziplinegreen/vault/Config/WebSocketConfig.java

@@ -0,0 +1,26 @@
+package com.ziplinegreen.vault.Config;
+
+
+import org.springframework.context.annotation.ComponentScan;
+import org.springframework.context.annotation.Configuration;
+import org.springframework.messaging.simp.config.MessageBrokerRegistry;
+import org.springframework.web.socket.config.annotation.EnableWebSocketMessageBroker;
+import org.springframework.web.socket.config.annotation.StompEndpointRegistry;
+import org.springframework.web.socket.config.annotation.WebSocketMessageBrokerConfigurer;
+
+@Configuration
+@EnableWebSocketMessageBroker
+@ComponentScan(basePackages = "com.ziplinegreen.vault")
+public class WebSocketConfig implements WebSocketMessageBrokerConfigurer {
+
+    @Override
+    public void configureMessageBroker(MessageBrokerRegistry config) {
+        config.enableSimpleBroker("/topic");
+        config.setApplicationDestinationPrefixes("/app"); //where the frontend sends things
+    }
+
+    @Override
+    public void registerStompEndpoints(StompEndpointRegistry registry) {
+        registry.addEndpoint("/vault-socket").setAllowedOrigins("*").withSockJS();
+    }
+}

src/main/java/com/ziplinegreen/vault/Controller/PostController.java

@@ -1,65 +1,73 @@
 package com.ziplinegreen.vault.Controller;
 
-import com.ziplinegreen.vault.Exception.ResourceNotFoundException;
 import com.ziplinegreen.vault.Model.Post;
-import com.ziplinegreen.vault.Repository.PostRepository;
-import com.ziplinegreen.vault.Repository.UserRepository;
+import com.ziplinegreen.vault.Service.PostService;
 import org.springframework.beans.factory.annotation.Autowired;
 import org.springframework.data.domain.Page;
+import org.springframework.data.domain.PageImpl;
+import org.springframework.data.domain.PageRequest;
 import org.springframework.data.domain.Pageable;
 import org.springframework.http.ResponseEntity;
+import org.springframework.messaging.handler.annotation.MessageMapping;
+import org.springframework.messaging.handler.annotation.SendTo;
 import org.springframework.web.bind.annotation.*;
 
-import javax.validation.Valid;
 
+import java.util.*;
+import java.util.stream.Collectors;
+import java.util.stream.StreamSupport;
 
+@CrossOrigin
+@RestController
 public class PostController {
 
-    @Autowired
-    private PostRepository postRepository;
+    private PostService postService;
+    private UserController userController;
+
 
     @Autowired
-    private UserRepository userRepository;
+    public PostController(PostService postService, UserController userController) {
+        this.postService = postService;
+        this.userController = userController;
+    }
 
-    @GetMapping("/users/{userId}/posts")
-    public Page<Post> getAllPostsByUserId(@PathVariable(value = "userId") Long userId,
-                                             Pageable pageable) {
-        return postRepository.findByUserId(userId, pageable);
+
+    @MessageMapping("/posts")
+    @SendTo("/topic/posts")
+    public Post createPost(@RequestBody Post post) {
+        post.setUserName(userController.getUserById(post.getUserId()).getUsername());
+        return postService.createPost(post);
     }
 
-    @PostMapping("/users/{userId}/posts")
-    public Post createPost(@PathVariable (value = "userId") Long userId,
-                                 @Valid @RequestBody Post post) {
-        return userRepository.findById(userId).map(user -> {
-            post.setUser(user);
-            return postRepository.save(post);
-        }).orElseThrow(() -> new ResourceNotFoundException("UserId " + userId + " not found"));
+
+//    @GetMapping("/posts/all")
+//    public Iterable<Post> getAllPosts() {
+//        return postService.getAllPosts();
+//    }
+
+    @GetMapping("/posts/all")
+    public Page<Post> pageAllPosts(Pageable pageable) {
+       return postService.listAllPostsByPageMostRecentFirst(pageable);
     }
 
-    @PutMapping("/users/{userId}/posts/{postId}")
-    public Post updateComment(@PathVariable (value = "userId") Long userId,
-                                 @PathVariable (value = "postId") Long postId,
-                                 @Valid @RequestBody Post postRequest) {
-        if(!userRepository.existsById(userId)) {
-            throw new ResourceNotFoundException("UserId " + userId + " not found");
-        }
-
-        return postRepository.findById(postId).map(post -> {
-            post.setMessage(postRequest.getMessage());
-            return postRepository.save(post);
-        }).orElseThrow(() -> new ResourceNotFoundException("PostId " + postId + "not found"));
+    @GetMapping("/posts/id/{userId}")
+    public Page<Post> getAllPostsByUserId(@PathVariable Long userId, Pageable pageable) {
+        return postService.findByUserId(userId, pageable);
     }
 
-    @DeleteMapping("/posts/{postId}/comments/{commentId}")
-    public ResponseEntity<?> deleteComment(@PathVariable (value = "userId") Long userId,
-                                           @PathVariable (value = "postId") Long postId) {
-        if(!userRepository.existsById(userId)) {
-            throw new ResourceNotFoundException("UserId " + userId + " not found");
-        }
-
-        return postRepository.findById(postId).map(post -> {
-            postRepository.delete(post);
-            return ResponseEntity.ok().build();
-        }).orElseThrow(() -> new ResourceNotFoundException("PostId " + postId + " not found"));
+    @DeleteMapping("/posts/delete")
+    public ResponseEntity deletePost(@RequestBody Long postId) {
+        return postService.deletePost(postId);
     }
+
+    @DeleteMapping("/posts/deleteAll")
+    public ResponseEntity deleteAllPosts(@RequestBody Long userId) {
+        return postService.deleteAllPosts(userId);
+    }
+
+    @PutMapping("/posts/update/{postId}")
+    public Post updatePost(@PathVariable Long postId, @RequestBody String message) {
+        return postService.updatePost(postId,message);
+    }
+
 }

src/main/java/com/ziplinegreen/vault/Controller/UserController.java

@@ -1,46 +1,45 @@
 package com.ziplinegreen.vault.Controller;
 
-import com.ziplinegreen.vault.Exception.ResourceNotFoundException;
 import com.ziplinegreen.vault.Model.User;
-import com.ziplinegreen.vault.Repository.UserRepository;
+import com.ziplinegreen.vault.Service.UserService;
 import org.springframework.beans.factory.annotation.Autowired;
-import org.springframework.data.domain.Page;
-import org.springframework.data.domain.Pageable;
 import org.springframework.http.ResponseEntity;
 import org.springframework.web.bind.annotation.*;
 
-import javax.validation.Valid;
-
 @RestController
 public class UserController {
 
-    @Autowired
-    private UserRepository userRepository;
+    private UserService userService;
 
-    @GetMapping("/users")
-    public Page<User> getAllPosts(Pageable pageable) {
-        return userRepository.findAll(pageable);
+    @Autowired
+    public UserController(UserService userService) {
+        this.userService = userService;
     }
 
     @PostMapping("/users")
-    public User createPost(@Valid @RequestBody User user) {
-        return userRepository.save(user);
+    public User createUser(@RequestBody User user) {
+        return userService.createUser(user);
     }
 
-    @PutMapping("/users/{userId}")
-    public User updatePost(@PathVariable Long userId, @Valid @RequestBody User userRequest) {
-        return userRepository.findById(userId).map(user -> {
-            user.setUsername(userRequest.getUsername());
-            return userRepository.save(user);
-        }).orElseThrow(() -> new ResourceNotFoundException("UserId " + userId + " not found"));
+    @GetMapping("/users/{userId}")
+    public User getUserById(@PathVariable Long userId) {
+
+        return userService.findUserById(userId);
     }
+    @CrossOrigin
+    @GetMapping("/users/{username}")
+    public User getUserById(@PathVariable String username) {
 
+        return userService.findUserByUsername(username);
+    }
+    @CrossOrigin
+    @PutMapping("/users/{userId}")
+    public User updateUsername(@PathVariable Long userId, @RequestBody String username) {
+        return userService.updateUsername(userId, username);
+    }
 
     @DeleteMapping("/users/{userId}")
-    public ResponseEntity<?> deletePost(@PathVariable Long userId) {
-        return userRepository.findById(userId).map(user -> {
-            userRepository.delete(user);
-            return ResponseEntity.ok().build();
-        }).orElseThrow(() -> new ResourceNotFoundException("UserId " + userId + " not found"));
+    public ResponseEntity<?> deleteUser(@PathVariable Long userId) {
+        return userService.deleteUser(userId);
     }
 }

src/main/java/com/ziplinegreen/vault/Model/Post.java

@@ -1,7 +1,6 @@
 package com.ziplinegreen.vault.Model;
 
 
-import com.fasterxml.jackson.annotation.JsonIgnore;
 import org.hibernate.annotations.OnDelete;
 import org.hibernate.annotations.OnDeleteAction;
 
@@ -13,25 +12,25 @@ import javax.validation.constraints.NotNull;
 public class Post extends AuditModel{
 
     @Id
-    @GeneratedValue
+    @GeneratedValue(strategy = GenerationType.IDENTITY)
     private Long Id;
 
     @NotNull
-    @Lob
     private String message;
-
-    @ManyToOne(fetch = FetchType.LAZY, optional = false)
-    @JoinColumn(name = "user_id", nullable = false)
     @OnDelete(action = OnDeleteAction.CASCADE)
-    @JsonIgnore
-    private User user;
+    private Long userId;
+    private String userName;
 
-    public Long getId() {
-        return Id;
+    public Post(){
+    }
+    public Post(@NotNull String message, Long userId, String userName) {
+        this.message = message;
+        this.userId = userId;
+        this.userName = userName;
     }
 
-    public void setId(Long id) {
-        Id = id;
+    public Long getId() {
+        return Id;
     }
 
     public String getMessage() {
@@ -42,11 +41,23 @@ public class Post extends AuditModel{
         this.message = message;
     }
 
-    public User getUser() {
-        return user;
+    public Long getUserId() {
+        return userId;
+    }
+
+    public String getUserName() { return userName; }
+
+    public void setUserName(String userName) {
+        this.userName = userName;
     }
 
-    public void setUser(User user) {
-        this.user = user;
+    @Override
+    public String toString() {
+        return "Post{" +
+                "Id=" + Id +
+                ", message='" + message + '\'' +
+                ", userId=" + userId +
+                ", userName='" + userName + '\'' +
+                '}';
     }
 }

src/main/java/com/ziplinegreen/vault/Model/User.java

@@ -2,24 +2,63 @@ package com.ziplinegreen.vault.Model;
 
 import javax.persistence.*;
 import javax.validation.constraints.NotNull;
+import java.util.ArrayList;
+import java.util.List;
 
 @Entity
-@Table(name = "user")
+@Table(name = "vault_user")
 public class User extends AuditModel{
     @Id
-    @GeneratedValue
+    @GeneratedValue(strategy = GenerationType.IDENTITY)
     private Long id;
-
-//    @NotNull
-    @Column(name ="USER_USERNAME")
+    @NotNull
     private String username;
+    private String email;
+    private String password;
+    @OneToMany(
+            cascade= {
+                CascadeType.PERSIST,
+                CascadeType.MERGE
+            }, mappedBy = "userId")
+    private List<Post> posts = new ArrayList<>();
+
+    public List<Post> getPosts() {
+        if(posts.size()==0){
+            posts = new ArrayList<>();
+            return posts;
+        }
+        return posts;
+    }
+
+    public User(){}
+    public User(@NotNull String username, String email, String password) {
+        this.username = username;
+        this.email = email;
+        this.password = password;
+    }
+
+    public void setPosts(List<Post> posts) {
+        this.posts = posts;
+    }
 
     public Long getId() {
         return id;
     }
 
-    public void setId(Long id) {
-        this.id = id;
+    public String getEmail() {
+        return email;
+    }
+
+    public void setEmail(String email) {
+        this.email = email;
+    }
+
+    public String getPassword() {
+        return password;
+    }
+
+    public void setPassword(String password) {
+        this.password = password;
     }
 
     public String getUsername() {
@@ -29,4 +68,5 @@ public class User extends AuditModel{
     public void setUsername(String username) {
         this.username = username;
     }
+
 }

src/main/java/com/ziplinegreen/vault/Repository/PostRepository.java

@@ -4,9 +4,12 @@ import com.ziplinegreen.vault.Model.Post;
 import org.springframework.data.domain.Page;
 import org.springframework.data.domain.Pageable;
 import org.springframework.data.jpa.repository.JpaRepository;
-import org.springframework.stereotype.Repository;
+import org.springframework.data.rest.core.annotation.RepositoryRestResource;
+import java.util.Collection;
 
-@Repository
+@RepositoryRestResource
 public interface PostRepository extends JpaRepository<Post,Long> {
-    Page<Post> findByUserId(Long userId, Pageable pageable);
+    Collection<Post> findByUserId(Long userId);
+    Iterable<Post> findAllByUserId(Long userId);
+
 }

src/main/java/com/ziplinegreen/vault/Repository/UserRepository.java

@@ -1,9 +0,0 @@
-package com.ziplinegreen.vault.Repository;
-
-import com.ziplinegreen.vault.Model.User;
-import org.springframework.data.jpa.repository.JpaRepository;
-import org.springframework.stereotype.Repository;
-
-@Repository
-public interface UserRepository extends JpaRepository<User,Long> {
-}

src/main/java/com/ziplinegreen/vault/Repository/UsersRepository.java

@@ -0,0 +1,12 @@
+package com.ziplinegreen.vault.Repository;
+
+import com.ziplinegreen.vault.Model.User;
+import org.springframework.data.jpa.repository.JpaRepository;
+import org.springframework.data.jpa.repository.Query;
+import org.springframework.data.repository.query.Param;
+
+public interface UsersRepository extends JpaRepository<User, Long> {
+
+    @Query(value = "SELECT u FROM User u WHERE u.username = :username")
+    User findUserByUsername(@Param("username") String username);
+}

src/main/java/com/ziplinegreen/vault/Service/PostService.java

@@ -0,0 +1,90 @@
+package com.ziplinegreen.vault.Service;
+
+
+import com.ziplinegreen.vault.Model.Post;
+import com.ziplinegreen.vault.Repository.PostRepository;
+import org.springframework.beans.factory.annotation.Autowired;
+import org.springframework.data.domain.Page;
+import org.springframework.data.domain.PageImpl;
+import org.springframework.data.domain.Pageable;
+import org.springframework.http.HttpStatus;
+import org.springframework.http.ResponseEntity;
+import org.springframework.stereotype.Service;
+import org.springframework.transaction.annotation.Transactional;
+
+import java.util.Collection;
+import java.util.Collections;
+import java.util.List;
+import java.util.stream.Collectors;
+import java.util.stream.StreamSupport;
+
+@Service
+@Transactional
+public class PostService {
+
+
+    private PostRepository postRepository;
+
+    @Autowired
+    public PostService(PostRepository postRepository) {
+        this.postRepository = postRepository;
+    }
+
+    public Post createPost(Post post){
+        return postRepository.save(post);
+    }
+
+    public Iterable<Post> getAllPosts(){
+        return postRepository.findAll();
+    }
+
+    public ResponseEntity deletePost(Long postId){
+        postRepository.delete(postRepository.findById(postId).get());
+        return new ResponseEntity<>(HttpStatus.OK);
+    }
+
+    public ResponseEntity deleteAllPosts(Long userId){
+        Iterable<Post> posts = postRepository.findByUserId(userId);
+        for(Post post: posts){
+            deletePost(post.getId());
+        }
+        return new ResponseEntity<>(HttpStatus.OK);
+    }
+
+    public Page<Post> findByUserId(Long userId, Pageable pageable) {
+        Iterable<Post> posts = postRepository.findByUserId(userId);
+        List<Post> postList = StreamSupport.stream(posts.spliterator(), false)
+                .collect(Collectors.toList());
+        Collections.reverse(postList);
+
+        int start = (int)pageable.getOffset();
+        int end = (start + pageable.getPageSize()) > postList.size() ? postList.size() : (start + pageable.getPageSize());
+
+        return new PageImpl<Post>(postList.subList(start,end),pageable, postList.size());
+    }
+
+
+
+    public Post updatePost(Long postId, String message){
+        Post post = postRepository.findById(postId).get();
+        post.setMessage(message);
+        return postRepository.save(post);
+    }
+
+    public Page<Post> listAllByPage(Pageable pageable) {
+       return postRepository.findAll(pageable);
+    }
+
+    public Page<Post> listAllPostsByPageMostRecentFirst(Pageable pageable){
+        Iterable<Post> posts = getAllPosts();
+        List<Post> postList = StreamSupport.stream(posts.spliterator(), false)
+                .collect(Collectors.toList());
+        Collections.reverse(postList);
+
+        int start = (int)pageable.getOffset();
+        int end = (start + pageable.getPageSize()) > postList.size() ? postList.size() : (start + pageable.getPageSize());
+
+        return new PageImpl<Post>(postList.subList(start,end),pageable, postList.size());
+    }
+}
+

src/main/java/com/ziplinegreen/vault/Service/UserService.java

@@ -0,0 +1,47 @@
+package com.ziplinegreen.vault.Service;
+
+import com.ziplinegreen.vault.Model.User;
+import com.ziplinegreen.vault.Repository.UsersRepository;
+import org.springframework.beans.factory.annotation.Autowired;
+import org.springframework.http.HttpStatus;
+import org.springframework.http.ResponseEntity;
+import org.springframework.stereotype.Service;
+
+@Service
+public class UserService {
+
+    @Autowired
+    private UsersRepository userRepository;
+    private PostService postService;
+    //private PostController postController;
+
+    @Autowired
+    public UserService(UsersRepository userRepository, PostService postService) {
+        this.userRepository = userRepository;
+        this.postService = postService;
+    }
+
+    public User createUser(User user){
+        return userRepository.save(user);
+    }
+
+    public User findUserById(Long id){
+        return userRepository.findById(id).get();
+    }
+
+    public User findUserByUsername(String username) { return userRepository.findUserByUsername(username);}
+
+    public User updateUsername(Long userId, String username){
+        User user = findUserById(userId);
+        user.setUsername(username);
+        return userRepository.save(user);
+    }
+
+    public ResponseEntity deleteUser(Long userId){
+        postService.deleteAllPosts(userId);
+        userRepository.delete(userRepository.findById(userId).get());
+        return new ResponseEntity(HttpStatus.OK);
+    }
+}
+
+

src/main/resources/application.properties

@@ -1,23 +1,11 @@
-## H2
-#spring.h2.console.enabled=true
-#spring.h2.console.path=/h2
-#
-## Datasource
-#spring.datasource.url=jdbc:h2:file:~/test
-#spring.datasource.username=sa
-#spring.datasource.password=
-#spring.datasource.driver-class-name=org.h2.Driver
-
-
-spring.datasource.url=jdbc:mysql://localhost:3306/zipLine?useSSL=false
-spring.datasource.username=root
-spring.datasource.password=Calcifer1650
-
-# The SQL dialect makes Hibernate generate better SQL for the chosen database
-spring.jpa.properties.hibernate.dialect = org.hibernate.dialect.MySQL5InnoDBDialect
-
-# Hibernate ddl auto (create, create-drop, validate, update)
-spring.jpa.hibernate.ddl-auto = update
-
-logging.level.org.hibernate.SQL=DEBUG
-logging.level.org.hibernate.type=TRACE
+#PostGresql set up
+spring.datasource.url= jdbc:postgresql://localhost:5432/thevault 
+spring.datasource.username=postgres
+spring.datasource.password=ZipCode4dot1   
+spring.jpa.hibernate.ddl-auto=update
+        
+# Disable feature detection by this undocumented parameter. Check the org.hibernate.engine.jdbc.internal.JdbcServiceImpl.configure method for more details.
+spring.jpa.properties.hibernate.temp.use_jdbc_metadata_defaults = false
+
+# Because detection is disabled you have to set correct dialect by hand.
+spring.jpa.database-platform=org.hibernate.dialect.PostgreSQL9Dialect

src/main/resources/static/app.js

@@ -0,0 +1,69 @@
+var stompClient = null;
+
+function setConnected(connected) {
+    $('#connect').prop("disabled", connected);
+    $('#disconnect').prop("disabled", !connected);
+    if (connected) {
+        $("#conversation").show();
+    }
+    else {
+        $("#conversation").hide();
+    }
+    $("#messages").html("");
+}
+
+function connect() {
+    var socket = new SockJS('/vault-socket');
+    stompClient = Stomp.over(socket);
+    stompClient.connect({}, function (frame) {
+        setConnected(true);
+        console.log('Connected: ' + frame);
+        stompClient.subscribe('/topic/posts', function (greeting) {
+            showGreeting(JSON.parse(greeting.body).message, JSON.parse(greeting.body).userName);
+        });
+    });
+}
+
+function disconnect() {
+    if (stompClient !== null) {
+        stompClient.disconnect();
+    }
+    setConnected(false);
+    console.log("Disconnected");
+}
+
+var userId = 1;
+var userPostUrl = "/app/posts";
+
+function user1() {
+    $('#user1').prop("disabled", true);
+    $('#user2').prop("disabled", false);
+    userId = 1;
+}
+
+function user2() {
+    $('#user1').prop("disabled", false);
+    $('#user2').prop("disabled", true);
+    userId = 2;
+}
+
+
+function sendName() {
+
+    stompClient.send(userPostUrl, {}, JSON.stringify({'id': '','message': $("#message").val(),'userId': userId}))
+}
+
+function showGreeting(message, userName) {
+    $("#messages").append("<tr><td>" + userName + ": " + message + "</td></tr>");
+}
+
+$(function () {
+    $("form").on('submit', function (e) {
+        e.preventDefault();
+    });
+    $( "#connect" ).click(function() { connect(); });
+    $( "#disconnect" ).click(function() { disconnect(); });
+    $( "#send" ).click(function() { sendName(); });
+    $( "#user1" ).click(function() { user1(); });
+    $( "#user2" ).click(function() { user2(); })
+});

src/main/resources/static/index.html

@@ -0,0 +1,56 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <title>Hello WebSocket</title>
+    <link href="/webjars/bootstrap/css/bootstrap.min.css" rel="stylesheet">
+    <!--<link href="/main.css" rel="stylesheet">-->
+    <script src="/webjars/jquery/jquery.min.js"></script>
+    <script src="/webjars/sockjs-client/sockjs.min.js"></script>
+    <script src="/webjars/stomp-websocket/stomp.min.js"></script>
+    <script src="./app.js"></script>
+
+</head>
+<body style=" background-color: #665D78; color: white">
+<noscript><h2 style="color: #ff0000">Seems your browser doesn't support Javascript! Websocket relies on Javascript being
+    enabled. Please enable
+    Javascript and reload this page!</h2></noscript>
+<div id="main-content" class="container">
+    <div class="row">
+        <div class="col-md-6">
+            <form class="form-inline">
+                <div class="form-group">
+                    <label for="connect">WebSocket connection:</label>
+                    <button id="connect" class="btn btn-default" type="submit">Connect</button>
+                    <button id="disconnect" class="btn btn-default" type="submit" disabled="disabled">Disconnect
+                    </button>
+                    <button id="user1" class="btn btn-default" type="submit" disabled="disabled">User 1</button>
+                    <button id="user2" class="btn btn-default" type="submit">User 2</button>
+                </div>
+            </form>
+        </div>
+        <div class="col-md-6">
+            <form class="form-inline">
+                <div class="form-group">
+                    <label for="message">Message?</label>
+                    <input type="text" id="message" class="form-control" placeholder="What is your message...">
+                </div>
+                <button id="send" class="btn btn-default" type="submit">Send</button>
+            </form>
+        </div>
+    </div>
+    <div class="row">
+        <div class="col-md-12">
+            <table id="conversation" class="table" style="background-color:#BFAEE2">
+                <thead>
+                <tr>
+                    <th>Messages</th>
+                </tr>
+                </thead>
+                <tbody id="messages" style=" background-color:#BFAEE2; border-radius: 6px;">
+                </tbody>
+            </table>
+        </div>
+    </div>
+</div>
+</body>
+</html>