pre integration commit

This commit is contained in:
nova 2019-12-06 19:51:07 +05:30
parent f0e8beb27c
commit 29a31ab60d
47 changed files with 2535 additions and 31200 deletions

5
chatto/package.json Normal file
View File

@ -0,0 +1,5 @@
{
"dependencies": {
"@types/sjcl": "^1.0.28"
}
}

File diff suppressed because one or more lines are too long

View File

@ -1,5 +1,6 @@
{
"dependencies": {
"@types/markdown-it": "^0.0.9",
"alertifyjs": "^1.12.0",
"chart.js": "^2.9.3",
"dompurify": "^2.0.7",

File diff suppressed because one or more lines are too long

View File

@ -0,0 +1,66 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
require("../model/AbstractModel");
require("../model/UserModel");
require("../view/AbstractView");
require("../view/UserView");
var ChatMessageViewModel_1 = require("../viewmodel/ChatMessageViewModel");
var ChatController = /** @class */ (function () {
function ChatController(model, view) {
this._model = model;
this._view = view;
}
Object.defineProperty(ChatController.prototype, "model", {
/**
* Getter model
* @return {Model}
*/
get: function () {
return this._model;
},
/**
* Setter model
* @param {Model} value
*/
set: function (value) {
this._model = value;
},
enumerable: true,
configurable: true
});
Object.defineProperty(ChatController.prototype, "view", {
/**
* Getter view
* @return {View}
*/
get: function () {
return this._view;
},
/**
* Setter view
* @param {View} value
*/
set: function (value) {
this._view = value;
},
enumerable: true,
configurable: true
});
/**
* eventHandler
*/
ChatController.prototype.eventHandler = function (vm) {
this.model.someBusinessMethod(vm);
};
ChatController.prototype.test = function () {
var chatMessageViewModels = [];
var chatMessageViewModelMock = new ChatMessageViewModel_1.ChatMessageViewModel();
chatMessageViewModelMock.fromUser = "user1";
chatMessageViewModelMock.toUser = "user2";
chatMessageViewModelMock.messageCipher = "";
chatMessageViewModelMock.messageTime = new Date();
chatMessageViewModels.push(chatMessageViewModelMock);
};
return ChatController;
}());
exports.ChatController = ChatController;

View File

@ -4,6 +4,7 @@ require("../model/AbstractModel");
require("../model/UserModel");
require("../view/AbstractView");
require("../view/UserView");
var ActiveUserViewModel_1 = require("../viewmodel/ActiveUserViewModel");
var UserController = /** @class */ (function () {
function UserController(model, view) {
this._model = model;
@ -45,6 +46,26 @@ var UserController = /** @class */ (function () {
enumerable: true,
configurable: true
});
/**
* eventHandler
*/
UserController.prototype.eventHandler = function (vm) {
this.model.someBusinessMethod(vm);
};
UserController.prototype.test = function () {
var activeUsersMock = [];
var activeUserViewModelMock = new ActiveUserViewModel_1.ActiveUserViewModel();
activeUserViewModelMock.userName = "some user";
activeUserViewModelMock.lastActive = "3 hrs ago";
activeUserViewModelMock.online = true;
activeUsersMock.push(activeUserViewModelMock);
activeUserViewModelMock = new ActiveUserViewModel_1.ActiveUserViewModel();
activeUserViewModelMock.lastActive = "3 hrs ago";
activeUserViewModelMock.online = true;
activeUserViewModelMock.userName = "some user 2";
activeUsersMock.push(activeUserViewModelMock);
this.eventHandler(activeUsersMock);
};
return UserController;
}());
exports.UserController = UserController;

View File

@ -1,10 +1,58 @@
"use strict";
var __importStar = (this && this.__importStar) || function (mod) {
if (mod && mod.__esModule) return mod;
var result = {};
if (mod != null) for (var k in mod) if (Object.hasOwnProperty.call(mod, k)) result[k] = mod[k];
result["default"] = mod;
return result;
};
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
var UserModel_1 = require("./model/UserModel");
var UserView_1 = require("./view/UserView");
var UserController_1 = require("./controller/UserController");
var Handlebars = __importStar(require("handlebars"));
var markdownit = require("markdown-it");
var ChatModel_1 = require("./model/ChatModel");
var ChatView_1 = require("./view/ChatView");
var ChatController_1 = require("./controller/ChatController");
var JsonAPI_1 = require("./singleton/JsonAPI");
// import log = require('loglevel')
// import * as log from 'loglevel';
var loglevel_1 = __importDefault(require("loglevel"));
var SJCLEncryptionService_1 = require("./service/SJCLEncryptionService");
// var markdownit = require('markdown-it');
var md = new markdownit();
var userBox = document.getElementById('contacts-box');
loglevel_1.default.setLevel("TRACE");
var chatModel = new ChatModel_1.ChatModel();
var userModel = new UserModel_1.UserModel();
var userView = new UserView_1.UserView(userModel, 2);
// const userModel = ModelFactory.createModel("USER");
// @ts-ignore: Argument of type 'HTMLElement | null' is not assignable to parameter of type 'HTMLElement'. Type 'null' is not assignable to type 'HTMLElement'.
var userView = new UserView_1.UserView(userModel, chatModel, userBox);
// console.log(userBox);
userModel.attach(userView);
// userView.model
var userController = new UserController_1.UserController(userModel, userView);
userController.test();
// userModel.someBusinessMethod(activeUsersMock);
loglevel_1.default.info("hello");
var chatArea = document.getElementById('chat-area-new');
// @ts-ignore: Argument of type 'HTMLElement | null' is not assignable to parameter of type 'HTMLElement'. Type 'null' is not assignable to type 'HTMLElement'.
var chatView = new ChatView_1.ChatView(chatModel, chatArea);
var chatController = new ChatController_1.ChatController(chatModel, chatView);
function someFunc(vm) {
// log.info(vm);
// logger.info(vm)
}
loglevel_1.default.info("test");
// someFunc(activeUserViewModelMock);
// @ts-ignore: Object is possibly 'null'.
var source = document.getElementById("msg_container_template").innerHTML;
var msgContainerTemplate = Handlebars.compile(source);
JsonAPI_1.JsonAPI.ACTIVE_USERS_GET + 'aef';
var encryptionService = new SJCLEncryptionService_1.SJCLEncryptionService();
var ct = encryptionService.encrypt("password", "data");
console.log(encryptionService.decrypt("password", ct));

View File

@ -0,0 +1,162 @@
"use strict";
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
return new (P || (P = Promise))(function (resolve, reject) {
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
step((generator = generator.apply(thisArg, _arguments || [])).next());
});
};
var __generator = (this && this.__generator) || function (thisArg, body) {
var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
function verb(n) { return function (v) { return step([n, v]); }; }
function step(op) {
if (f) throw new TypeError("Generator is already executing.");
while (_) try {
if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
if (y = 0, t) op = [op[0] & 2, t.value];
switch (op[0]) {
case 0: case 1: t = op; break;
case 4: _.label++; return { value: op[1], done: false };
case 5: _.label++; y = op[1]; op = [0]; continue;
case 7: op = _.ops.pop(); _.trys.pop(); continue;
default:
if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
if (t[2]) _.ops.pop();
_.trys.pop(); continue;
}
op = body.call(thisArg, _);
} catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
}
};
Object.defineProperty(exports, "__esModule", { value: true });
var FetchErrorHandler_1 = require("./FetchErrorHandler");
var JsonAPI_1 = require("../singleton/JsonAPI");
var log = require("loglevel");
var ChatModel = /** @class */ (function () {
function ChatModel() {
/**
* @type {Observer[]} List of subscribers. In real life, the list of
* subscribers can be stored more comprehensively (categorized by event
* type, etc.).
*/
this.observers = [];
// @ts-ignore: Cannot find name 'hostAddress'.
this.getActiveUsersUrl = "";
this.state = null;
}
/**
* The subscription management methods.
*/
ChatModel.prototype.attach = function (observer) {
console.log('Subject: Attached an observer.');
this.observers.push(observer);
};
ChatModel.prototype.detach = function (observer) {
var observerIndex = this.observers.indexOf(observer);
this.observers.splice(observerIndex, 1);
console.log('Subject: Detached an observer.');
};
/**
* Trigger an update in each subscriber.
*/
ChatModel.prototype.notify = function () {
console.log('Subject: Notifying observers...');
for (var _i = 0, _a = this.observers; _i < _a.length; _i++) {
var observer = _a[_i];
observer.update(this.state);
}
};
ChatModel.prototype.someBusinessMethod = function (activeuserList) {
this.state = activeuserList;
this.helperMethod();
console.log("Subject: My state has just changed");
console.log(activeuserList);
this.notify();
};
/**
* getActiveUsers
*/
ChatModel.prototype.getMessages = function () {
var _this = this;
this.getAllMessagesAjax(":")
.then(function (data) {
// // activeUsers = data;
// sessionStorage.setItem('activeUsers', JSON.stringify(data));
// console.log(sessionStorage.getItem('activeUsers'));
console.log("Subject: received ajax active users");
_this.state = data;
_this.notify();
});
};
ChatModel.prototype.getAllMessagesAjax = function (authToken2) {
return __awaiter(this, void 0, Promise, function () {
var headers, response, data;
return __generator(this, function (_a) {
switch (_a.label) {
case 0:
headers = new Headers();
// headers.append('Authorization', basicAuthToken);
if (JsonAPI_1.JsonAPI.authToken == null) {
log.error("authToken null");
return [2 /*return*/];
}
;
headers.append('X-AUTH-TOKEN', JsonAPI_1.JsonAPI.authToken);
return [4 /*yield*/, fetch(this.getActiveUsersUrl, {
method: 'GET',
headers: headers
})];
case 1:
response = _a.sent();
console.log(response.clone());
if (FetchErrorHandler_1.fetchErrorHandler(response.clone())) {
return [2 /*return*/, null];
}
return [4 /*yield*/, response.json()];
case 2:
data = _a.sent();
return [2 /*return*/, data];
}
});
});
};
ChatModel.prototype.getNewMessages = function (authToken, toUser, lastMessageTimeStamp) {
return __awaiter(this, void 0, void 0, function () {
var headers, response, data;
return __generator(this, function (_a) {
switch (_a.label) {
case 0:
headers = new Headers();
// headers.append('Authorization', basicAuthToken);
headers.append('X-AUTH-TOKEN', authToken);
return [4 /*yield*/, fetch("" + JsonAPI_1.JsonAPI.CHAT_MESSAGES_GET + toUser + "/" + lastMessageTimeStamp, {
method: 'GET',
headers: headers
})];
case 1:
response = _a.sent();
console.log(response.clone());
if (FetchErrorHandler_1.fetchErrorHandler(response.clone())) {
return [2 /*return*/, null];
}
return [4 /*yield*/, response.json()];
case 2:
data = _a.sent();
return [2 /*return*/, data];
}
});
});
};
ChatModel.prototype.helperMethod = function () { };
ChatModel.prototype.populateMessages = function () {
};
return ChatModel;
}());
exports.ChatModel = ChatModel;

View File

@ -0,0 +1,22 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
function fetchErrorHandler(response) {
// alertify.success('Current position : ' + alertify.get('notifier', 'position'));
if (!response.ok) {
return response.text().catch(function (err) {
// the status was not ok and there is no json body
// throw new Error(response.statusText);
// window.alert(sprintf('Some error occured. Http code is %s', response.status));
// alertify.error(sprintf('Some error occured. Http code is %s', response.status));
return true;
}).then(function (json) {
// the status was not ok but there is a json body
// throw new Error(json.error.message); // example error message returned by a REST API
// window.alert(sprintf('Error: %s (Http code %s)', json, response.status));
// alertify.error(sprintf('Some error occured. Http code is %s', response.status));
console.log(json);
return true;
});
}
}
exports.fetchErrorHandler = fetchErrorHandler;

View File

@ -0,0 +1,17 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var UserModel_1 = require("./UserModel");
var ModelFactory = /** @class */ (function () {
function ModelFactory() {
}
ModelFactory.createModel = function (modelName) {
switch (modelName) {
case "USER":
return new UserModel_1.UserModel();
break;
default: throw new Error("Invalid model name");
}
};
return ModelFactory;
}());
exports.ModelFactory = ModelFactory;

View File

@ -1,5 +1,43 @@
"use strict";
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
return new (P || (P = Promise))(function (resolve, reject) {
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
step((generator = generator.apply(thisArg, _arguments || [])).next());
});
};
var __generator = (this && this.__generator) || function (thisArg, body) {
var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
function verb(n) { return function (v) { return step([n, v]); }; }
function step(op) {
if (f) throw new TypeError("Generator is already executing.");
while (_) try {
if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
if (y = 0, t) op = [op[0] & 2, t.value];
switch (op[0]) {
case 0: case 1: t = op; break;
case 4: _.label++; return { value: op[1], done: false };
case 5: _.label++; y = op[1]; op = [0]; continue;
case 7: op = _.ops.pop(); _.trys.pop(); continue;
default:
if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
if (t[2]) _.ops.pop();
_.trys.pop(); continue;
}
op = body.call(thisArg, _);
} catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
}
};
Object.defineProperty(exports, "__esModule", { value: true });
var FetchErrorHandler_1 = require("./FetchErrorHandler");
var JsonAPI_1 = require("../singleton/JsonAPI");
var UserModel = /** @class */ (function () {
function UserModel() {
/**
@ -8,7 +46,8 @@ var UserModel = /** @class */ (function () {
* type, etc.).
*/
this.observers = [];
this.state = 0;
// @ts-ignore: Cannot find name 'hostAddress'.
this.getActiveUsersUrl = "";
}
/**
* The subscription management methods.
@ -32,10 +71,56 @@ var UserModel = /** @class */ (function () {
observer.update(this.state);
}
};
UserModel.prototype.someBusinessMethod = function () {
console.log("Subject: My state has just changed to: " + this.state);
UserModel.prototype.someBusinessMethod = function (activeuserList) {
this.state = activeuserList;
this.helperMethod();
console.log("Subject: My state has just changed");
console.log(activeuserList);
this.notify();
};
/**
* getActiveUsers
*/
UserModel.prototype.getActiveUsers = function () {
var _this = this;
this.getActiveUsersAjax("", JsonAPI_1.JsonAPI.ACTIVE_USERS_GET)
.then(function (data) {
// // activeUsers = data;
// sessionStorage.setItem('activeUsers', JSON.stringify(data));
// console.log(sessionStorage.getItem('activeUsers'));
console.log("Subject: received ajax active users");
_this.state = data;
_this.notify();
});
};
UserModel.prototype.getActiveUsersAjax = function (authToken2, URL) {
return __awaiter(this, void 0, void 0, function () {
var headers, response, data;
return __generator(this, function (_a) {
switch (_a.label) {
case 0:
headers = new Headers();
// headers.append('Authorization', basicAuthToken);
headers.append('X-AUTH-TOKEN', authToken2);
return [4 /*yield*/, fetch(this.getActiveUsersUrl, {
method: 'GET',
headers: headers
})];
case 1:
response = _a.sent();
console.log(response.clone());
if (FetchErrorHandler_1.fetchErrorHandler(response.clone())) {
return [2 /*return*/, null];
}
return [4 /*yield*/, response.json()];
case 2:
data = _a.sent();
return [2 /*return*/, data];
}
});
});
};
UserModel.prototype.helperMethod = function () { };
return UserModel;
}());
exports.UserModel = UserModel;

View File

@ -0,0 +1,64 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
/**
* The Subject owns some important state and notifies observers when the state
* changes.
*/
// class ConcreteSubject implements Subject {
// /**
// * @type {number} For the sake of simplicity, the Subject's state, essential
// * to all subscribers, is stored in this variable.
// */
// public state: number;
// /**
// * @type {Observer[]} List of subscribers. In real life, the list of
// * subscribers can be stored more comprehensively (categorized by event
// * type, etc.).
// */
// private observers: Observer[] = [];
// /**
// * The subscription management methods.
// */
// public attach(observer: Observer): void {
// console.log('Subject: Attached an observer.');
// this.observers.push(observer);
// }
// public detach(observer: Observer): void {
// const observerIndex = this.observers.indexOf(observer);
// this.observers.splice(observerIndex, 1);
// console.log('Subject: Detached an observer.');
// }
// /**
// * Trigger an update in each subscriber.
// */
// public notify(): void {
// console.log('Subject: Notifying observers...');
// for (const observer of this.observers) {
// observer.update(this);
// }
// }
// /**
// * Usually, the subscription logic is only a fraction of what a Subject can
// * really do. Subjects commonly hold some important business logic, that
// * triggers a notification method whenever something important is about to
// * happen (or after it).
// */
// public someBusinessLogic(): void {
// console.log('\nSubject: I\'m doing something important.');
// this.state = Math.floor(Math.random() * (10 + 1));
// console.log(`Subject: My state has just changed to: ${this.state}`);
// this.notify();
// }
// }
// /**
// * The client code.
// */
// const subject = new ConcreteSubject();
// const observer1 = new ConcreteObserverA();
// subject.attach(observer1);
// const observer2 = new ConcreteObserverB();
// subject.attach(observer2);
// subject.someBusinessLogic();
// subject.someBusinessLogic();
// subject.detach(observer2);
// subject.someBusinessLogic();

View File

@ -0,0 +1,27 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
// /**
// * The Observer interface declares the update method, used by subjects.
// */
// interface Observer {
// // Receive update from subject.
// update(subject: Subject): void;
// }
// /**
// * Concrete Observers react to the updates issued by the Subject they had been
// * attached to.
// */
// class ConcreteObserverA implements Observer {
// public update(subject: Subject): void {
// if (subject.state < 3) {
// console.log('ConcreteObserverA: Reacted to the event.');
// }
// }
// }
// class ConcreteObserverB implements Observer {
// public update(subject: Subject): void {
// if (subject.state === 0 || subject.state >= 2) {
// console.log('ConcreteObserverB: Reacted to the event.');
// }
// }
// }

View File

@ -0,0 +1,2 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });

View File

@ -0,0 +1,23 @@
"use strict";
var __importStar = (this && this.__importStar) || function (mod) {
if (mod && mod.__esModule) return mod;
var result = {};
if (mod != null) for (var k in mod) if (Object.hasOwnProperty.call(mod, k)) result[k] = mod[k];
result["default"] = mod;
return result;
};
Object.defineProperty(exports, "__esModule", { value: true });
var sjcl = __importStar(require("sjcl"));
var SJCLEncryptionService = /** @class */ (function () {
function SJCLEncryptionService() {
this.params = { mode: "gcm", ts: 128, adata: "", iter: 10000 };
}
SJCLEncryptionService.prototype.encrypt = function (passphrase, plainText) {
return sjcl.encrypt(passphrase, plainText, this.params);
};
SJCLEncryptionService.prototype.decrypt = function (passphrase, cipher) {
return sjcl.decrypt(passphrase, cipher, undefined, undefined);
};
return SJCLEncryptionService;
}());
exports.SJCLEncryptionService = SJCLEncryptionService;

View File

@ -0,0 +1,4 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.authToken = null;
// localStorage.getItem('authToken')

View File

@ -0,0 +1,9 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var JsonAPI;
(function (JsonAPI) {
// @ts-ignore: Cannot find name 'hostAddress'.
JsonAPI.authToken = null;
JsonAPI.ACTIVE_USERS_GET = "/api/chat/get/active-users/";
JsonAPI.CHAT_MESSAGES_GET = "";
})(JsonAPI = exports.JsonAPI || (exports.JsonAPI = {}));

View File

@ -0,0 +1,14 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var TemplateFactory = /** @class */ (function () {
function TemplateFactory() {
}
TemplateFactory.getTemplate = function () {
// @ts-ignore: Object is possibly 'null'.
var source = document.getElementById("user-contact-online-template").innerHTML;
var msgContainerTemplate = Handlebars.compile(source);
return msgContainerTemplate;
};
return TemplateFactory;
}());
exports.TemplateFactory = TemplateFactory;

View File

@ -0,0 +1,103 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var TemplateFactory_1 = require("../template/TemplateFactory");
var ChatView = /** @class */ (function () {
// private userBoxes: any[] = [];
function ChatView(model, element) {
this._model = model;
this._element = element;
}
Object.defineProperty(ChatView.prototype, "model", {
/**
* Getter model
* @return {Model}
*/
get: function () {
return this._model;
},
enumerable: true,
configurable: true
});
Object.defineProperty(ChatView.prototype, "element", {
/**
* Getter element
* @return {any}
*/
get: function () {
return this._element;
},
enumerable: true,
configurable: true
});
// /**
// * Setter model
// * @param {Model} value
// */
// public set model(value: Model) {
// this._model = value;
// }
// /**
// * Setter element
// * @param {any} value
// */
// public set element(value: any) {
// this._element = value;
// }
ChatView.prototype.update = function (data) {
var template = TemplateFactory_1.TemplateFactory.getTemplate();
var html = "";
data.forEach(function (element) {
html += template(element);
});
this.element.innerHTML = html;
this.addUserCallBacks();
console.log(this.element.innerHTML);
};
ChatView.prototype.helper = function () {
};
ChatView.prototype.addUserCallBacks = function () {
var userBoxes = document.getElementsByClassName('user-box');
for (var i = 0; i < userBoxes.length; i++) {
var userBox = userBoxes[i];
userBoxes[i].addEventListener('click', this.userCallBack.bind(this, userBox));
}
};
ChatView.prototype.userCallBack = function (el) {
var current = document.getElementsByClassName('user-box active');
var passphrase = "";
if (current.length > 0) {
if (passphrase == '') {
// alert('Please input passphrase')
// alertify.error('Please enter a passphrase');
// return;
}
current[0].className = current[0].className.replace(" active", "");
}
// Add the active class to the current/clicked button
else if (current.length == 0) {
var elem_1 = document.getElementById('passphrase-initial');
passphrase = "";
if (passphrase == '') {
// // alert('Please input passphrase')
// // alertify.error('Please enter a passphrase');
// return;
}
// @ts-ignore: Object is possibly 'null'.
document.getElementById('no-user-selected').hidden = true;
// @ts-ignore: Object is possibly 'null'.
document.getElementById('chat-card').hidden = false;
// @ts-ignore: Object is possibly 'null'.
elem_1.hidden = true;
}
// console.log(this.getElementsByClassName('to-user-span'));
var elem = el.getElementsByClassName('to-user-span')[0];
var userName = elem.innerText;
// @ts-ignore: Object is possibly 'null'.
document.getElementById('user-name-span').innerText = userName;
// populateMessages(userName, passphrase);
sessionStorage.setItem('selectedUser', userName);
el.className += " active";
};
return ChatView;
}());
exports.ChatView = ChatView;

View File

@ -1,8 +1,11 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var TemplateFactory_1 = require("../template/TemplateFactory");
var UserView = /** @class */ (function () {
function UserView(model, element) {
// private userBoxes: any[] = [];
function UserView(model, chatModel, element) {
this._model = model;
this._chatModel = chatModel;
this._element = element;
}
Object.defineProperty(UserView.prototype, "model", {
@ -13,13 +16,6 @@ var UserView = /** @class */ (function () {
get: function () {
return this._model;
},
/**
* Setter model
* @param {Model} value
*/
set: function (value) {
this._model = value;
},
enumerable: true,
configurable: true
});
@ -31,18 +27,77 @@ var UserView = /** @class */ (function () {
get: function () {
return this._element;
},
/**
* Setter element
* @param {any} value
*/
set: function (value) {
this._element = value;
},
enumerable: true,
configurable: true
});
// /**
// * Setter model
// * @param {Model} value
// */
// public set model(value: Model) {
// this._model = value;
// }
// /**
// * Setter element
// * @param {any} value
// */
// public set element(value: any) {
// this._element = value;
// }
UserView.prototype.update = function (data) {
console.log(data);
var template = TemplateFactory_1.TemplateFactory.getTemplate();
var html = "";
data.forEach(function (element) {
html += template(element);
});
this.element.innerHTML = html;
this.addUserCallBacks();
console.log(this.element.innerHTML);
};
UserView.prototype.helper = function () {
};
UserView.prototype.addUserCallBacks = function () {
var userBoxes = document.getElementsByClassName('user-box');
for (var i = 0; i < userBoxes.length; i++) {
var userBox = userBoxes[i];
userBoxes[i].addEventListener('click', this.userCallBack.bind(this, userBox));
}
};
UserView.prototype.userCallBack = function (el) {
var current = document.getElementsByClassName('user-box active');
var passphrase = "";
if (current.length > 0) {
if (passphrase == '') {
// alert('Please input passphrase')
// alertify.error('Please enter a passphrase');
// return;
}
current[0].className = current[0].className.replace(" active", "");
}
// Add the active class to the current/clicked button
else if (current.length == 0) {
var elem_1 = document.getElementById('passphrase-initial');
passphrase = "";
if (passphrase == '') {
// // alert('Please input passphrase')
// // alertify.error('Please enter a passphrase');
// return;
}
// @ts-ignore: Object is possibly 'null'.
document.getElementById('no-user-selected').hidden = true;
// @ts-ignore: Object is possibly 'null'.
document.getElementById('chat-card').hidden = false;
// @ts-ignore: Object is possibly 'null'.
elem_1.hidden = true;
}
// console.log(this.getElementsByClassName('to-user-span'));
var elem = el.getElementsByClassName('to-user-span')[0];
var userName = elem.innerText;
// @ts-ignore: Object is possibly 'null'.
document.getElementById('user-name-span').innerText = userName;
// populateMessages(userName, passphrase);
sessionStorage.setItem('selectedUser', userName);
el.className += " active";
};
return UserView;
}());

View File

@ -0,0 +1,8 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var ActiveUserViewModel = /** @class */ (function () {
function ActiveUserViewModel() {
}
return ActiveUserViewModel;
}());
exports.ActiveUserViewModel = ActiveUserViewModel;

View File

@ -0,0 +1,8 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var ChatMessageViewModel = /** @class */ (function () {
function ChatMessageViewModel() {
}
return ChatMessageViewModel;
}());
exports.ChatMessageViewModel = ChatMessageViewModel;

View File

@ -0,0 +1,41 @@
import { Controller } from "./AbstractController";
import "../model/AbstractModel"
import "../model/UserModel"
import "../view/AbstractView"
import "../view/UserView"
import { Model } from "../model/AbstractModel";
import { View } from "../view/AbstractView";
import { ChatMessageViewModel } from "../viewmodel/ChatMessageViewModel";
import { ChatModel } from "../model/ChatModel";
import { ChatView } from "../view/ChatView";
export class ChatController {
private _model: ChatModel;
private _view: ChatView;
constructor(model: ChatModel, view: ChatView) {
this._model = model;
this._view = view;
}
/**
* eventHandler
*/
public eventHandler(vm: ChatMessageViewModel[]): void {
this._model.someBusinessMethod(vm);
}
public test(): void {
const chatMessageViewModels: ChatMessageViewModel[] = [];
let chatMessageViewModelMock = new ChatMessageViewModel();
chatMessageViewModelMock.fromUser = "user1";
chatMessageViewModelMock.toUser = "user2";
chatMessageViewModelMock.message = "";
chatMessageViewModelMock.messageTime = new Date();
chatMessageViewModels.push(chatMessageViewModelMock);
}
}

View File

@ -5,47 +5,41 @@ import "../view/AbstractView"
import "../view/UserView"
import { Model } from "../model/AbstractModel";
import { View } from "../view/AbstractView";
import { ActiveUserViewModel } from "../viewmodel/ActiveUserViewModel";
import { UserView } from "../view/UserView";
export class UserController implements Controller{
private _model: Model;
private _view: View;
export class UserController {
private _model: Model;
private _view: UserView;
constructor(model: Model, view: View) {
this._model = model;
this._view = view;
}
constructor(model: Model, view: UserView) {
this._model = model;
this._view = view;
}
/**
* Getter model
* @return {Model}
* eventHandler
*/
public get model(): Model {
return this._model;
}
public eventHandler(vm: ActiveUserViewModel[]): void {
this._model.someBusinessMethod(vm);
}
/**
* Getter view
* @return {View}
*/
public get view(): View {
return this._view;
}
public test(): void {
const activeUsersMock: ActiveUserViewModel[] = [];
let activeUserViewModelMock = new ActiveUserViewModel();
activeUserViewModelMock.userName = "some user";
activeUserViewModelMock.lastActive = "3 hrs ago";
activeUserViewModelMock.online = true;
activeUsersMock.push(activeUserViewModelMock);
activeUserViewModelMock = new ActiveUserViewModel();
activeUserViewModelMock.lastActive = "3 hrs ago";
activeUserViewModelMock.online = true;
activeUserViewModelMock.userName = "some user 2";
activeUsersMock.push(activeUserViewModelMock);
this.eventHandler(activeUsersMock);
}
/**
* Setter model
* @param {Model} value
*/
public set model(value: Model) {
this._model = value;
}
/**
* Setter view
* @param {View} value
*/
public set view(value: View) {
this._view = value;
}
}

View File

@ -0,0 +1,8 @@
import { MessageCipherDTO } from "./MessageCipherDTO";
export class ChatMessageDTO {
public toUser: string | undefined;
public fromUser: string | undefined;
public messageCipher!: MessageCipherDTO;
public messageTime!: Date;
}

View File

@ -0,0 +1,27 @@
export class MessageCipherDTO {
// iv!: string;
// v!: number;
// iterations!: number;
// keySize!: number;
// tagSize!: number;
// mode!: string;
// adata!: string;
// cipher!: string;
// salt!: string;
// cipherText!: string;
iv!: string;
v!: number;
iter!: number;
ks!: number;
ts!: number;
mode!: string;
adata!: string;
cipher!: string;
salt!: string;
ct!: string;
// public toMessageCipherDTO {
// }
}

View File

@ -4,38 +4,74 @@ import { Model } from "./model/AbstractModel";
import { View } from "./view/AbstractView";
import { UserView } from "./view/UserView";
import { UserController } from "./controller/UserController";
import log from "loglevel";
import { ModelFactory } from "./model/ModelFactory";
import { ActiveUserViewModel } from "./viewmodel/ActiveUserViewModel";
import { ChatMessageViewModel } from "./viewmodel/ChatMessageViewModel";
import Handlebars from "handlebars";
import * as Handlebars from "handlebars";
import markdownit = require('markdown-it');
import { ChatModel } from "./model/ChatModel";
import { ChatView } from "./view/ChatView";
import { ChatController } from "./controller/ChatController";
import { JsonAPI } from "./singleton/JsonAPI";
// import log = require('loglevel')
import * as log from 'loglevel';
// import log from 'loglevel';
import { EncryptionService } from "./service/EncryptionService";
import { SJCLEncryptionService } from "./service/SJCLEncryptionService";
// var markdownit = require('markdown-it');
var md = new markdownit();
const userBox = document.getElementById('contacts-box');
log.setLevel("TRACE")
// let userModel = new UserModel();
const userModel = ModelFactory.createModel("USER");
const userView = new UserView(userModel, 2);
const chatModel = new ChatModel();
const userModel = new UserModel();
// const userModel = ModelFactory.createModel("USER");
// @ts-ignore: Argument of type 'HTMLElement | null' is not assignable to parameter of type 'HTMLElement'. Type 'null' is not assignable to type 'HTMLElement'.
const userView = new UserView(userModel, chatModel, userBox);
// console.log(userBox);
userModel.attach(userView);
// userView.model
const userController = new UserController(userModel, userView);
userModel.someBusinessMethod(5);
userController.test();
// userModel.someBusinessMethod(activeUsersMock);
log.info("hello");
const chatMessageViewModel= new ChatMessageViewModel();
const chatArea = document.getElementById('chat-area-new');
// @ts-ignore: Argument of type 'HTMLElement | null' is not assignable to parameter of type 'HTMLElement'. Type 'null' is not assignable to type 'HTMLElement'.
const chatView = new ChatView(chatModel, chatArea);
const chatController = new ChatController(chatModel, chatView);
const activeUserViewModel = new ActiveUserViewModel();
activeUserViewModel.userName = "some user";
activeUserViewModel.lastActive = new Date();
activeUserViewModel.online = true;
function someFunc(vm: ActiveUserViewModel): void {
log.info(vm);
// log.info(vm);
// logger.info(vm)
}
someFunc(activeUserViewModel);
log.info("test");
// someFunc(activeUserViewModelMock);
// @ts-ignore: Object is possibly 'null'.
var source = document.getElementById("msg_container_template").innerHTML;
var msgContainerTemplate = Handlebars.compile(source);
JsonAPI.ACTIVE_USERS_GET + 'aef';
const encryptionService: EncryptionService = new SJCLEncryptionService();
let ct = encryptionService.encrypt("password","data");
console.log(encryptionService.decrypt("password", ct));
Handlebars.registerHelper('avatar', function() {
return '<div class="img_cont_msg"> <img src="https://static.turbosquid.com/Preview/001292/481/WV/_D.jpg" class="rounded-circle user_img_msg"> </div>';
});

View File

@ -1,5 +1,7 @@
import { Subject } from "../observe/Observable";
import { ActiveUserViewModel } from "../viewmodel/ActiveUserViewModel";
export interface Model extends Subject{
someBusinessMethod(data: any): void;
someBusinessMethod(data: Object): void;
}

View File

@ -0,0 +1,87 @@
import { Subject } from "../observe/Observable";
import { Model } from "./AbstractModel";
import { Observer } from "../observe/Observer";
import { fetchErrorHandler } from "./FetchErrorHandler";
import { ActiveUserViewModel } from "../viewmodel/ActiveUserViewModel";
import { ChatMessageViewModel } from "../viewmodel/ChatMessageViewModel";
import { JsonAPI } from "../singleton/JsonAPI";
import log = require('loglevel');
import { EncryptionService } from "../service/EncryptionService";
import { SJCLEncryptionService } from "../service/SJCLEncryptionService";
import { ChatMessageDTO } from "../dto/ChatMessageDTO";
import { ChatModelHelper } from "./ChatModelHelper";
export class ChatModel implements Subject {
/**
* @type {Observer[]} List of subscribers. In real life, the list of
* subscribers can be stored more comprehensively (categorized by event
* type, etc.).
*/
private readonly _observers: Observer[] = [];
private state: ChatMessageViewModel[] | null;
private readonly _messagesMap: Map<string, ChatMessageViewModel[]>;
constructor() {
this.state = null;
this._messagesMap = new Map();
}
/**
* The subscription management methods.
*/
public attach(observer: Observer): void {
console.log('Subject: Attached an observer.');
this._observers.push(observer);
}
public detach(observer: Observer): void {
const observerIndex = this._observers.indexOf(observer);
this._observers.splice(observerIndex, 1);
console.log('Subject: Detached an observer.');
}
public setUserMessages(username: string, messages: ChatMessageViewModel[]) {
this._messagesMap.set(username, messages);
}
/**
* Trigger an update in each subscriber.
*/
public notify(): void {
console.log('Subject: Notifying observers...');
for (const observer of this._observers) {
observer.update(this.state);
}
}
public someBusinessMethod(chatMessageList: ChatMessageViewModel[]): void {
this.state = chatMessageList;
this.helperMethod();
console.log(`Subject: My state has just changed`);
console.log(chatMessageList);
this.notify();
}
public getmessages(userName: string, passphrase: string, lastMessageTime: string | null): void {
const cVMs = ChatModelHelper.getMessages(userName, passphrase, lastMessageTime, this);
if (cVMs != null) {
log.info('Subject: My state has just changed')
log.debug(cVMs);
this._messagesMap.set(userName, cVMs);
this.notify();
}
else {
log.error('Messages were null');
}
}
private helperMethod() { }
public populateMessages(): void {
}
}

View File

@ -0,0 +1,94 @@
import { ChatMessageDTO } from "../dto/ChatMessageDTO";
import * as log from "loglevel";
import { ChatMessageViewModel } from "../viewmodel/ChatMessageViewModel";
import { JsonAPI } from "../singleton/JsonAPI";
import { fetchErrorHandler } from "./FetchErrorHandler";
import { EncryptionService } from "../service/EncryptionService";
import { SJCLEncryptionService } from "../service/SJCLEncryptionService";
import { ChatModel } from "./ChatModel";
export class ChatModelHelper {
private static readonly encryptionService = new SJCLEncryptionService();
public static getMessages(userName: string, passphrase: string, lastMessageTime: string | null, chatModel: ChatModel): ChatMessageViewModel[] | null {
switch (lastMessageTime) {
case null: {
this.getAllMessagesAjax(userName)
.then((data: ChatMessageDTO[]) => {
log.debug(`Subject: received all messages`);
// let userNames = data.map(ChatMessageViewModel => ChatMessageViewModel.fromUser)
// let sumt = data.map(chatMessageViewModel => { return this.encryptionService.decrypt(passphrase, chatMessageViewModel.messageCipher) });
return data.map(vm => this.toChatMessageVM(vm, passphrase));
// chatModel.setUserMessages(userName, chatMessageVMs);
// chatModel.notify();
})
break;
}
default: {
this.getNewMessagesAjax(userName, lastMessageTime)
.then((data: ChatMessageDTO[]) => {
log.debug(`Subject: received new messages`);
return data.map(vm => this.toChatMessageVM(vm, passphrase));
// chatModel.setUserMessages(userName, chatMessageVMs);
// this.state = data;
// chatModel.notify();
})
break;
}
}
return null;
}
private static toChatMessageVM(chatMessageDTO: ChatMessageDTO, passphrase: string): ChatMessageViewModel {
const vm = new ChatMessageViewModel();
vm.fromUser = chatMessageDTO.fromUser;
vm.toUser = chatMessageDTO.toUser;
vm.messageTime = chatMessageDTO.messageTime;
vm.message = this.encryptionService.decrypt(passphrase, chatMessageDTO.messageCipher) as string;
return vm;
}
private static async getAllMessagesAjax(toUser: string): Promise<any> {
let headers = new Headers();
if (JsonAPI.authToken == null) {
log.error("authToken null");
return;
};
headers.append('X-AUTH-TOKEN', JsonAPI.authToken);
let response = await fetch(`${JsonAPI.CHAT_MESSAGES_GET}/${toUser}`, {
method: 'GET',
headers: headers
});
console.log(response.clone());
if (fetchErrorHandler(response.clone())) {
return null;
}
let data: Promise<any> = await response.json();
return data;
}
private static async getNewMessagesAjax(toUser: string, lastMessageTimeStamp: string): Promise<any> {
let headers = new Headers();
if (JsonAPI.authToken == null) {
log.error("authToken null");
return;
};
headers.append('X-AUTH-TOKEN', JsonAPI.authToken);
let response = await fetch(`${JsonAPI.CHAT_MESSAGES_GET}/${toUser}/${lastMessageTimeStamp}`, {
method: 'GET',
headers: headers
});
console.log(response.clone());
if (fetchErrorHandler(response.clone())) {
return null;
}
let data: Promise<any> = await response.json();
return data;
}
}

View File

@ -0,0 +1,19 @@
export function fetchErrorHandler(response: Response) {
// alertify.success('Current position : ' + alertify.get('notifier', 'position'));
if (!response.ok) {
return response.text().catch(err => {
// the status was not ok and there is no json body
// throw new Error(response.statusText);
// window.alert(sprintf('Some error occured. Http code is %s', response.status));
// alertify.error(sprintf('Some error occured. Http code is %s', response.status));
return true;
}).then(json => {
// the status was not ok but there is a json body
// throw new Error(json.error.message); // example error message returned by a REST API
// window.alert(sprintf('Error: %s (Http code %s)', json, response.status));
// alertify.error(sprintf('Some error occured. Http code is %s', response.status));
console.log(json);
return true;
});
}
}

View File

@ -1,15 +1,20 @@
import { Subject } from "../observe/Observable";
import { Model } from "./AbstractModel";
import { Observer } from "../observe/Observer";
import { fetchErrorHandler } from "./FetchErrorHandler";
import { ActiveUserViewModel } from "../viewmodel/ActiveUserViewModel";
import { JsonAPI } from "../singleton/JsonAPI";
import { ChatMessageViewModel } from "../viewmodel/ChatMessageViewModel";
export class UserModel implements Model, Subject {
export class UserModel implements Subject {
/**
* @type {Observer[]} List of subscribers. In real life, the list of
* subscribers can be stored more comprehensively (categorized by event
* type, etc.).
*/
private observers: Observer[] = [];
private state: number = 0;
private readonly observers: Observer[] = [];
private state: ActiveUserViewModel[] | undefined;
// @ts-ignore: Cannot find name 'hostAddress'.
constructor() { }
/**
@ -36,13 +41,51 @@ export class UserModel implements Model, Subject {
}
}
public someBusinessMethod(num: number): void {
this.state = num;
public someBusinessMethod(activeuserList: ActiveUserViewModel[]): void {
this.state = activeuserList;
this.helperMethod();
console.log(`Subject: My state has just changed to: ${this.state}`);
console.log(`Subject: My state has just changed`);
console.log(activeuserList);
this.notify();
}
private helperMethod() {}
/**
* getActiveUsers
*/
public getActiveUsers(): void {
this.getActiveUsersAjax("", JsonAPI.ACTIVE_USERS_GET)
.then(data => {
// // activeUsers = data;
// sessionStorage.setItem('activeUsers', JSON.stringify(data));
// console.log(sessionStorage.getItem('activeUsers'));
console.log(`Subject: received ajax active users`);
this.state = data;
this.notify();
})
}
async getActiveUsersAjax(authToken2: string, URL: string): Promise<any> {
let headers = new Headers();
// headers.append('Authorization', basicAuthToken);
headers.append('X-AUTH-TOKEN', authToken2);
let response = await fetch(JsonAPI.ACTIVE_USERS_GET, {
method: 'GET',
headers: headers
});
console.log(response.clone());
if (fetchErrorHandler(response.clone())) {
return null;
}
let data = await response.json();
// return data;
return new Promise((resolve, reject) => {
if (data != null)
resolve(data)
else
reject('Response data null')
})
}
private helperMethod() { }
}

View File

@ -0,0 +1,4 @@
export interface EncryptionService {
encrypt(passphrase: string, plainText: string): Object,
decrypt(passphrase: string, cipher: Object): Object
}

View File

@ -0,0 +1,13 @@
import { EncryptionService } from "./EncryptionService";
import * as sjcl from "sjcl";
export class SJCLEncryptionService implements EncryptionService {
private readonly params: any = { mode: "gcm", ts: 128, adata: "", iter: 10000}
public encrypt(passphrase: string, plainText: string): Object {
return sjcl.encrypt(passphrase, plainText, this.params);
}
public decrypt(passphrase: string, cipher: Object): Object {
return sjcl.decrypt(passphrase, cipher as sjcl.SjclCipherEncrypted, undefined, undefined);
}
}

View File

@ -0,0 +1,2 @@
export let authToken: string | null = null;
// localStorage.getItem('authToken')

View File

@ -0,0 +1,8 @@
export namespace JsonAPI {
// @ts-ignore: Cannot find name 'hostAddress'.
export let userName: string | null = localStorage.getItem('userName');
export let authToken: string | null = localStorage.getItem('authToken');
export const ACTIVE_USERS_GET = `/api/chat/get/active-users`;
export const CHAT_MESSAGES_GET = ``;
}

View File

@ -0,0 +1,34 @@
export class TemplateFactory {
// static getTemplate(templateName: string): Handlebars.TemplateDelegate<any> {
// switch (templateName) {
// case "user-contact-online-template": {
// // let source = document.getElementById("user-contact-online-template").innerHTML;
// // let msgContainerTemplate = Handlebars.compile(source);
// // return msgContainerTemplate;
// return this.createTemplate(templateName);
// }
// case "msg_container_send_template": {
// // let source = document.getElementById("msg_container_send_template").innerHTML;
// // let msgContainerTemplate = Handlebars.compile(source);
// // return msgContainerTemplate;
// return this.createTemplate(templateName);
// }
// case "msg_container_template": {
// // let source = document.getElementById("msg_container_send_template").innerHTML;
// // let msgContainerTemplate = Handlebars.compile(source);
// // return msgContainerTemplate;
// return this.createTemplate(templateName);
// }
// default:
// throw new Error('invalid template name');
// }
// }
static getTemplate(templateName: string): Handlebars.TemplateDelegate<any> {
//@ts-ignore: Object is possibly 'null'.
let source = document.getElementById(templateName).innerHTML;
let msgContainerTemplate = Handlebars.compile(source);
return msgContainerTemplate;
}
}

View File

@ -3,6 +3,6 @@ import { Model } from "../model/AbstractModel";
import { Controller } from "../controller/AbstractController";
import { Observer } from "../observe/Observer";
export interface View extends Observer {
model: Model,
element: any
readonly model: Model,
readonly element: any
}

View File

@ -0,0 +1,32 @@
import { Observer } from "../observe/Observer";
import { Model } from "../model/AbstractModel";
import { Subject } from "../observe/Observable";
import { View } from "./AbstractView";
import { Controller } from "../controller/AbstractController";
import { TemplateFactory } from "../template/TemplateFactory";
import { ActiveUserViewModel } from "../viewmodel/ActiveUserViewModel";
import { ChatModel } from "../model/ChatModel";
import { ChatMessageViewModel } from "../viewmodel/ChatMessageViewModel";
import * as log from 'loglevel';
export class ChatView implements Observer {
private readonly _model: ChatModel;
private readonly _element: HTMLElement;
private readonly _messageSendTemplate = TemplateFactory.getTemplate('msg_container_send_template');
constructor(model: ChatModel, element: HTMLElement) {
this._model = model;
this._element = element;
}
update(data: ChatMessageViewModel[]): void {
let html: string = "";
data.forEach((vm: ChatMessageViewModel) => {
html += this._messageSendTemplate(vm);
});
this._element.innerHTML = html;
log.debug(this._element.innerHTML);
}
}

View File

@ -3,61 +3,103 @@ import { Model } from "../model/AbstractModel";
import { Subject } from "../observe/Observable";
import { View } from "./AbstractView";
import { Controller } from "../controller/AbstractController";
import { TemplateFactory } from "../template/TemplateFactory";
import { ActiveUserViewModel } from "../viewmodel/ActiveUserViewModel";
import { ChatModel } from "../model/ChatModel";
import log = require("loglevel");
export class UserView implements Observer, View {
private _model: Model;
private _element: any;
export class UserView implements Observer {
private readonly _model: Model;
private readonly _chatModel: ChatModel;
private readonly _element: HTMLElement;
// private userBoxes: any[] = [];
constructor(model: Model, element: any) {
constructor(model: Model, chatModel: ChatModel, element: HTMLElement) {
this._model = model;
this._chatModel = chatModel;
this._element = element;
}
/**
* Getter model
* @return {Model}
*/
public get model(): Model {
return this._model;
update(data: ActiveUserViewModel[]): void {
let template = TemplateFactory.getTemplate('user-contact-online-template');
let html: string = "";
data.forEach((element: ActiveUserViewModel) => {
html += template(element);
});
this._element.innerHTML = html;
this.addUserCallBacks();
console.log(this._element.innerHTML);
}
private helper(): void {
}
private addUserCallBacks(): void {
let userBoxes = document.getElementsByClassName('user-box');
for (let i = 0; i < userBoxes.length; i++) {
let userBox = userBoxes[i];
userBoxes[i].addEventListener('click', this.userCallBack.bind(this, userBox));
}
}
/**
* Getter element
* @return {any}
*/
public get element(): any {
return this._element;
}
private userCallBack(el: Element): void {
let current = document.getElementsByClassName('user-box active');
/**
* Setter model
* @param {Model} value
*/
public set model(value: Model) {
this._model = value;
}
let passphrase: string = '';
if (current.length > 0) {
let passphraseInput = document.getElementById('passphrase') as any;
if (passphraseInput == null) {
log.error('passphraseInput element reference is null');
return;
}
passphrase = passphraseInput.value
if (passphrase == '' || passphrase == null) {
// alert('Please input passphrase')
// alertify.error('Please enter a passphrase');
log.error('passphrase is empty or null');
return;
}
current[0].className = current[0].className.replace(" active", "");
/**
* Setter element
* @param {any} value
*/
public set element(value: any) {
this._element = value;
}
update(data: any): void {
this.element = data;
console.log(this.element);
}
// Add the active class to the current/clicked button
else if (current.length == 0) {
let elem = document.getElementById('passphrase-initial') as any;
if(elem == null)
{
log.error('passphraseInput element reference is null');
return;
}
passphrase = elem.value;
if (passphrase == '' || passphrase == null) {
// // alert('Please input passphrase')
// // alertify.error('Please enter a passphrase');
log.error('passphrase is empty or null');
return;
}
// @ts-ignore: Object is possibly 'null'.
document.getElementById('no-user-selected').hidden = true;
// @ts-ignore: Object is possibly 'null'.
document.getElementById('chat-card').hidden = false;
// @ts-ignore: Object is possibly 'null'.
elem.hidden = true;
}
// console.log(this.getElementsByClassName('to-user-span'));
let elem = el.getElementsByClassName('to-user-span')[0] as HTMLElement;
let userName = elem.innerText;
// @ts-ignore: Object is possibly 'null'.
document.getElementById('user-name-span').innerText = userName;
this._chatModel.getmessages(userName, passphrase, null);
// populateMessages(userName, passphrase);
sessionStorage.setItem('selectedUser', userName);
el.className += " active";
}
}

View File

@ -1,5 +1,5 @@
export class ActiveUserViewModel {
userName: string | undefined;
online: boolean | undefined;
lastActive: Date | undefined;
lastActive: string| undefined;
}

View File

@ -1,7 +1,7 @@
export class ChatMessageViewModel {
public toUser: string | undefined;
public fromUser: string | undefined;
public messageCipher: any;
public message!: string;
public messageTime!: Date;

View File

@ -2,8 +2,9 @@
"compilerOptions": {
/* Basic Options */
// "incremental": true, /* Enable incremental compilation */
"target": "es5", /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017', 'ES2018', 'ES2019' or 'ESNEXT'. */
"target": "es6", /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017', 'ES2018', 'ES2019' or 'ESNEXT'. */
"module": "commonjs", /* Specify module code generation: 'none', 'commonjs', 'amd', 'system', 'umd', 'es2015', or 'ESNext'. */
// "lib": [ "ES2015" ],
// "lib": [], /* Specify library files to be included in the compilation. */
// "allowJs": true, /* Allow javascript files to be compiled. */
// "checkJs": true, /* Report errors in .js files. */

View File

@ -2,6 +2,18 @@
# yarn lockfile v1
"@types/linkify-it@*":
version "2.1.0"
resolved "https://registry.yarnpkg.com/@types/linkify-it/-/linkify-it-2.1.0.tgz#ea3dd64c4805597311790b61e872cbd1ed2cd806"
integrity sha512-Q7DYAOi9O/+cLLhdaSvKdaumWyHbm7HAk/bFwwyTuU0arR5yyCeW5GOoqt4tJTpDRxhpx9Q8kQL6vMpuw9hDSw==
"@types/markdown-it@^0.0.9":
version "0.0.9"
resolved "https://registry.yarnpkg.com/@types/markdown-it/-/markdown-it-0.0.9.tgz#a5d552f95216c478e0a27a5acc1b28dcffd989ce"
integrity sha512-IFSepyZXbF4dgSvsk8EsgaQ/8Msv1I5eTL0BZ0X3iGO9jw6tCVtPG8HchIPm3wrkmGdqZOD42kE0zplVi1gYDA==
dependencies:
"@types/linkify-it" "*"
"@webassemblyjs/ast@1.8.5":
version "1.8.5"
resolved "https://registry.yarnpkg.com/@webassemblyjs/ast/-/ast-1.8.5.tgz#51b1c5fe6576a34953bf4b253df9f0d490d9e359"

View File

@ -6,40 +6,29 @@
<script th:src="@{/js/scljs.js}" type="text/javascript"></script>
<!--<script th:src="@{js/my_Crypto.js}" type="text/javascript"></script>-->
<script src="https://cdnjs.cloudflare.com/ajax/libs/sprintf/1.1.2/sprintf.min.js"
type="text/javascript"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/sprintf/1.1.2/sprintf.min.js" type="text/javascript"></script>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.3.1/js/bootstrap.bundle.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.8.0/Chart.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.8.0/Chart.css">
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.3.1/css/bootstrap.css" rel="stylesheet"
type="text/css">
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.3.1/css/bootstrap.css" rel="stylesheet" type="text/css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.11.2/css/all.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/sjcl/1.0.8/sjcl.min.js"
integrity="sha256-nIoG9XIePM1QNttI6KAGLYGNxc4DNinxxmOZW0/Z7uA=" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/handlebars.js/4.4.2/handlebars.min.js"
integrity="sha256-oh7N5nthuhldTk8/34Za7FXv3BkeVN9vAnYk/pLfC78=" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/dompurify/2.0.3/purify.min.js"
integrity="sha256-58eGKW6SunbeAY1RP9WEbg3nViB9o1qDnxV4yCITqx4=" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/sjcl/1.0.8/sjcl.min.js" integrity="sha256-nIoG9XIePM1QNttI6KAGLYGNxc4DNinxxmOZW0/Z7uA=" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/handlebars.js/4.4.2/handlebars.min.js" integrity="sha256-oh7N5nthuhldTk8/34Za7FXv3BkeVN9vAnYk/pLfC78=" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/dompurify/2.0.3/purify.min.js" integrity="sha256-58eGKW6SunbeAY1RP9WEbg3nViB9o1qDnxV4yCITqx4=" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/markdown-it/10.0.0/markdown-it.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/AlertifyJS/1.12.0/alertify.min.js"
integrity="sha256-yscIZgtlDR9q6eoYCRmcaiNE6W80UFSnq+6Llwu4NLI=" crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/AlertifyJS/1.12.0/css/alertify.min.css"
integrity="sha256-nhstgDCuZGQRk+wvwXZIPt278arHtuZKJ1YQ0rrXiL4=" crossorigin="anonymous" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/AlertifyJS/1.12.0/css/themes/default.css"
integrity="sha256-dawRQVhnqw8jRXaGnK0aj/NpOsPaQm+Em1sWN+fvegI=" crossorigin="anonymous" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/AlertifyJS/1.12.0/css/themes/bootstrap.css"
integrity="sha256-1fgYpB3cyITZIur7E+Mj3R54NtlN9HwHykgKTJf0pmU=" crossorigin="anonymous" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/fuse.js/3.4.5/fuse.min.js"
integrity="sha256-Yrh3VGzE4d9b4KANknPJAhfcKt9SgHTL0v/FrJFoPzw=" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/loglevel/1.6.4/loglevel.min.js"
integrity="sha256-ACTlnmNCkOooSKkPCKYbiex8WLE82aeiN+Z9ElZag5Q=" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/AlertifyJS/1.12.0/alertify.min.js" integrity="sha256-yscIZgtlDR9q6eoYCRmcaiNE6W80UFSnq+6Llwu4NLI=" crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/AlertifyJS/1.12.0/css/alertify.min.css" integrity="sha256-nhstgDCuZGQRk+wvwXZIPt278arHtuZKJ1YQ0rrXiL4=" crossorigin="anonymous" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/AlertifyJS/1.12.0/css/themes/default.css" integrity="sha256-dawRQVhnqw8jRXaGnK0aj/NpOsPaQm+Em1sWN+fvegI=" crossorigin="anonymous" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/AlertifyJS/1.12.0/css/themes/bootstrap.css" integrity="sha256-1fgYpB3cyITZIur7E+Mj3R54NtlN9HwHykgKTJf0pmU=" crossorigin="anonymous" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/fuse.js/3.4.5/fuse.min.js" integrity="sha256-Yrh3VGzE4d9b4KANknPJAhfcKt9SgHTL0v/FrJFoPzw=" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/loglevel/1.6.4/loglevel.min.js" integrity="sha256-ACTlnmNCkOooSKkPCKYbiex8WLE82aeiN+Z9ElZag5Q=" crossorigin="anonymous"></script>
<link th:href="@{/css/master.css}" href="../../static/css/master.css" rel="stylesheet">
<link th:href="@{/css/colors.css}" href="../../static/css/colors.css" rel="stylesheet">
<link th:href="@{/css/master.css}" href="../../resources/static/css/master.css" rel="stylesheet">
<link th:href="@{/css/colors.css}" href="../../resources/static/css/colors.css" rel="stylesheet">
<script th:inline="javascript">
var hostAddress = window.location.host;

View File

@ -20,7 +20,7 @@
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/AlertifyJS/1.12.0/css/themes/bootstrap.css" integrity="sha256-1fgYpB3cyITZIur7E+Mj3R54NtlN9HwHykgKTJf0pmU=" crossorigin="anonymous" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/fuse.js/3.4.5/fuse.min.js" integrity="sha256-Yrh3VGzE4d9b4KANknPJAhfcKt9SgHTL0v/FrJFoPzw=" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/loglevel/1.6.4/loglevel.min.js" integrity="sha256-ACTlnmNCkOooSKkPCKYbiex8WLE82aeiN+Z9ElZag5Q=" crossorigin="anonymous"></script>
<script src="./../../javascript/ts/bundle.js" defer></script>
<script src="./../../javascript/bundle.js" defer></script>
<link rel="stylesheet" th:href="@{/css/chat.css}" href="../../resources/static/css/chat.css">
@ -159,7 +159,7 @@
</ul>
</div>
</div>
<div class="card-body msg_card_body" id="chat_area_new">
<div class="card-body msg_card_body" id="chat-area-new">
</div>
<div class="card-footer">
<form action="#" th:object="${chatMessageDTO}" method="post" id="chatMessageForm" class="needs-validation" novalidate>

8
chatto/yarn.lock Normal file
View File

@ -0,0 +1,8 @@
# THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.
# yarn lockfile v1
"@types/sjcl@^1.0.28":
version "1.0.28"
resolved "https://registry.yarnpkg.com/@types/sjcl/-/sjcl-1.0.28.tgz#4693eb6943e385e844a70fb25b4699db286c7214"
integrity sha1-RpPraUPjhehEpw+yW0aZ2yhschQ=