From db074a58049d3aa0fb1a55cb68fd82d754c62468 Mon Sep 17 00:00:00 2001
From: "Jonathan Leibiusky @xetorthio" <ionathan@gmail.com>
Date: Tue, 15 Nov 2016 13:20:59 -0300
Subject: [PATCH] Add expiration clock to sessions

---
 services/session.go  | 4 ++++
 www/assets/app.js    | 8 ++++++++
 www/assets/style.css | 9 +++++++++
 www/index.html       | 2 ++
 4 files changed, 23 insertions(+)

diff --git a/services/session.go b/services/session.go
index 3600bf7..c2db13a 100644
--- a/services/session.go
+++ b/services/session.go
@@ -19,6 +19,8 @@ type Session struct {
 	Id        string               `json:"id"`
 	Instances map[string]*Instance `json:"instances"`
 	clients   []*Client            `json:"-"`
+	CreatedAt time.Time            `json:"created_at"`
+	ExpiresAt time.Time            `json:"expires_at"`
 }
 
 func (s *Session) Lock() {
@@ -87,6 +89,8 @@ func NewSession() (*Session, error) {
 	s := &Session{}
 	s.Id = uuid.NewV4().String()
 	s.Instances = map[string]*Instance{}
+	s.CreatedAt = time.Now()
+	s.ExpiresAt = s.CreatedAt.Add(4 * time.Hour)
 	log.Printf("NewSession id=[%s]\n", s.Id)
 
 	sessions[s.Id] = s
diff --git a/www/assets/app.js b/www/assets/app.js
index ad9cd1e..57e6e6e 100644
--- a/www/assets/app.js
+++ b/www/assets/app.js
@@ -9,6 +9,7 @@
         $scope.idx = {};
 		$scope.selectedInstance = null;
         $scope.isAlive = true;
+        $scope.ttl = '--:--:--';
 
       angular.element($window).bind('resize', function(){
         if ($scope.selectedInstance) {
@@ -68,6 +69,13 @@
 				method: 'GET',
 				url: '/sessions/' + $scope.sessionId,
 			}).then(function(response) {
+                if (response.data.created_at) {
+                    $scope.expiresAt = moment(response.data.expires_at);
+                    setInterval(function() {
+                        $scope.ttl = moment.utc($scope.expiresAt.diff(moment())).format('HH:mm:ss');
+                        $scope.$apply();
+                    }, 1000);
+                }
                 var socket = io({path: '/sessions/' + sessionId + '/ws'});
 
                 socket.on('terminal out', function(name, data) {
diff --git a/www/assets/style.css b/www/assets/style.css
index 47f6d22..d98c539 100644
--- a/www/assets/style.css
+++ b/www/assets/style.css
@@ -1,3 +1,5 @@
+@import url('http://fonts.googleapis.com/css?family=Rationale');
+
 .selected button {
 	background-color: rgba(158,158,158,0.2);
 }
@@ -18,3 +20,10 @@ md-card-content.terminal {
 .terminal .xterm-rows {
     background-color: #000;
 }
+
+.clock {
+    font-family: 'Rationale', sans-serif;
+    font-size: 3.0em;
+    color: #1da4eb;
+    text-align: center;
+}
diff --git a/www/index.html b/www/index.html
index 7084005..03c6aed 100644
--- a/www/index.html
+++ b/www/index.html
@@ -26,6 +26,7 @@
                   md-whiteframe="4" layout="column">
 
                 <md-toolbar class="md-theme-indigo">
+                  <span class="clock">{{ttl}}</span>
                   <md-button class="md-warn md-raised" ng-click="closeSession()">Close session</md-button>
                   <h1 class="md-toolbar-tools">Instances</h1>
                 </md-toolbar>
@@ -89,6 +90,7 @@
         <script src="/assets/xterm.js"></script>
         <script src="/assets/xterm-addons/fit.js"></script>
         <script src="/assets/attach.js"></script>
+        <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.16.0/moment.min.js"></script>
         <script type="text/javascript" charset="utf-8">
             window.onbeforeunload = function (e) {
                 e = e || window.event;