Merge branch 'master' of github.com:matrix-org/synapse into develop

paul/schema_breaking_changes
Erik Johnston 2014-08-20 10:29:16 +01:00
commit 2ffb075772
10 changed files with 415 additions and 171 deletions

View File

@ -23,6 +23,8 @@ Accounts
Before you can send and receive messages, you must **register** for an account.
If you already have an account, you must **login** into it.
**Try out the fiddle: http://jsfiddle.net/jrf1h02d/**
Registration
------------
The aim of registration is to get a user ID and access token which you will need
@ -78,6 +80,8 @@ Communicating
In order to communicate with another user, you must **create a room** with that
user and **send a message** to that room.
**Try out the fiddle: http://jsfiddle.net/jnwqcshc/**
Creating a room
---------------
If you want to send a message to someone, you have to be in a room with them. To

View File

@ -0,0 +1,17 @@
.loggedin {
visibility: hidden;
}
p {
font-family: monospace;
}
table
{
border-spacing:5px;
}
th,td
{
padding:5px;
}

View File

@ -0,0 +1,30 @@
<div>
<p>This room creation / message sending demo requires a home server to be running on http://localhost:8080</p>
</div>
<form class="loginForm">
<input type="text" id="userLogin" placeholder="Username"></input>
<input type="password" id="passwordLogin" placeholder="Password"></input>
<input type="button" class="login" value="Login"></input>
</form>
<div class="loggedin">
<form class="createRoomForm">
<input type="text" id="roomAlias" placeholder="Room alias (optional)"></input>
<input type="button" class="createRoom" value="Create Room"></input>
</form>
<form class="sendMessageForm">
<input type="text" id="roomId" placeholder="Room ID"></input>
<input type="text" id="messageBody" placeholder="Message body"></input>
<input type="button" class="sendMessage" value="Send Message"></input>
</form>
<table id="rooms">
<tbody>
<tr>
<th>Room ID</th>
<th>My state</th>
<th>Room Alias</th>
<th>Latest message</th>
</tr>
</tbody>
</table>
</div>

View File

@ -0,0 +1,109 @@
var accountInfo = {};
var showLoggedIn = function(data) {
accountInfo = data;
getCurrentRoomList();
$(".loggedin").css({visibility: "visible"});
};
$('.login').live('click', function() {
var user = $("#userLogin").val();
var password = $("#passwordLogin").val();
$.ajax({
url: "http://localhost:8080/matrix/client/api/v1/login",
type: "POST",
contentType: "application/json; charset=utf-8",
data: JSON.stringify({ user: user, password: password, type: "m.login.password" }),
dataType: "json",
success: function(data) {
showLoggedIn(data);
},
error: function(err) {
alert(JSON.stringify($.parseJSON(err.responseText)));
}
});
});
var getCurrentRoomList = function() {
var url = "http://localhost:8080/matrix/client/api/v1/im/sync?access_token=" + accountInfo.access_token + "&from=END&to=START&limit=1";
$.getJSON(url, function(data) {
for (var i=0; i<data.length; ++i) {
data[i].latest_message = data[i].messages.chunk[0].content.body;
addRoom(data[i]);
}
}).fail(function(err) {
alert(JSON.stringify($.parseJSON(err.responseText)));
});
};
$('.createRoom').live('click', function() {
var roomAlias = $("#roomAlias").val();
var data = {};
if (roomAlias.length > 0) {
data.room_alias_name = roomAlias;
}
$.ajax({
url: "http://localhost:8080/matrix/client/api/v1/rooms?access_token="+accountInfo.access_token,
type: "POST",
contentType: "application/json; charset=utf-8",
data: JSON.stringify(data),
dataType: "json",
success: function(data) {
data.membership = "join"; // you are automatically joined into every room you make.
data.latest_message = "";
addRoom(data);
},
error: function(err) {
alert(JSON.stringify($.parseJSON(err.responseText)));
}
});
});
var addRoom = function(data) {
row = "<tr>" +
"<td>"+data.room_id+"</td>" +
"<td>"+data.membership+"</td>" +
"<td>"+data.room_alias+"</td>" +
"<td>"+data.latest_message+"</td>" +
"</tr>";
$("#rooms").append(row);
};
$('.sendMessage').live('click', function() {
var roomId = $("#roomId").val();
var body = $("#messageBody").val();
var msgId = $.now();
if (roomId.length === 0 || body.length === 0) {
return;
}
var url = "http://localhost:8080/matrix/client/api/v1/rooms/$roomid/messages/$user/$msgid?access_token=$token";
url = url.replace("$token", accountInfo.access_token);
url = url.replace("$roomid", encodeURIComponent(roomId));
url = url.replace("$user", encodeURIComponent(accountInfo.user_id));
url = url.replace("$msgid", msgId);
var data = {
msgtype: "m.text",
body: body
};
$.ajax({
url: url,
type: "PUT",
contentType: "application/json; charset=utf-8",
data: JSON.stringify(data),
dataType: "json",
success: function(data) {
$("#messageBody").val("");
// wipe the table and reload it. Using the event stream would be the best
// solution but that is out of scope of this fiddle.
$("#rooms").find("tr:gt(0)").remove();
getCurrentRoomList();
},
error: function(err) {
alert(JSON.stringify($.parseJSON(err.responseText)));
}
});
});

View File

@ -0,0 +1,38 @@
/*
Copyright 2014 matrix.org
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
'use strict';
angular.module('matrixWebClient')
.directive('ngEnter', function () {
return function (scope, element, attrs) {
element.bind("keydown keypress", function (event) {
if(event.which === 13) {
scope.$apply(function () {
scope.$eval(attrs.ngEnter);
});
event.preventDefault();
}
});
};
})
.directive('ngFocus', ['$timeout', function($timeout) {
return {
link: function(scope, element, attr) {
$timeout(function() { element[0].focus(); }, 0);
}
};
}]);

79
webclient/app-filter.js Normal file
View File

@ -0,0 +1,79 @@
/*
Copyright 2014 matrix.org
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
'use strict';
angular.module('matrixWebClient')
.filter('duration', function() {
return function(time) {
if (!time) return;
var t = parseInt(time / 1000);
var s = t % 60;
var m = parseInt(t / 60) % 60;
var h = parseInt(t / (60 * 60)) % 24;
var d = parseInt(t / (60 * 60 * 24));
if (t < 60) {
return s + "s";
}
if (t < 60 * 60) {
return m + "m "; // + s + "s";
}
if (t < 24 * 60 * 60) {
return h + "h "; // + m + "m";
}
return d + "d "; // + h + "h";
};
})
.filter('orderMembersList', function($sce) {
return function(members) {
var filtered = [];
var displayNames = {};
angular.forEach(members, function(value, key) {
value["id"] = key;
filtered.push( value );
if (value["displayname"]) {
if (!displayNames[value["displayname"]]) {
displayNames[value["displayname"]] = [];
}
displayNames[value["displayname"]].push(key);
}
});
// FIXME: we shouldn't disambiguate displayNames on every orderMembersList
// invocation but keep track of duplicates incrementally somewhere
angular.forEach(displayNames, function(value, key) {
if (value.length > 1) {
// console.log(key + ": " + value);
for (i=0; i < value.length; i++) {
var v = value[i];
members[v].displayname += " (" + v + ")";
// console.log(v + " " + members[v]);
};
}
});
filtered.sort(function (a, b) {
return ((a["mtime_age"] || 10e10) > (b["mtime_age"] || 10e10) ? 1 : -1);
});
return filtered;
};
})
.filter('unsafe', ['$sce', function($sce) {
return function(text) {
return $sce.trustAsHtml(text);
};
}]);

View File

@ -83,84 +83,3 @@ matrixWebClient.run(['$location', 'matrixService', 'eventStreamService', functio
eventStreamService.resume();
}
}]);
matrixWebClient
.directive('ngEnter', function () {
return function (scope, element, attrs) {
element.bind("keydown keypress", function (event) {
if(event.which === 13) {
scope.$apply(function () {
scope.$eval(attrs.ngEnter);
});
event.preventDefault();
}
});
};
})
.directive('ngFocus', ['$timeout', function($timeout) {
return {
link: function(scope, element, attr) {
$timeout(function() { element[0].focus() }, 0);
}
};
}])
.filter('duration', function() {
return function(time) {
if (!time) return;
var t = parseInt(time / 1000);
var s = t % 60;
var m = parseInt(t / 60) % 60;
var h = parseInt(t / (60 * 60)) % 24;
var d = parseInt(t / (60 * 60 * 24));
if (t < 60) {
return s + "s"
}
if (t < 60 * 60) {
return m + "m "; // + s + "s";
}
if (t < 24 * 60 * 60) {
return h + "h "; // + m + "m";
}
return d + "d "; // + h + "h";
}
})
.filter('orderMembersList', function($sce) {
return function(members) {
var filtered = [];
var displayNames = {};
angular.forEach(members, function(value, key) {
value["id"] = key;
filtered.push( value );
if (value["displayname"]) {
if (!displayNames[value["displayname"]]) {
displayNames[value["displayname"]] = [];
}
displayNames[value["displayname"]].push(key);
}
});
// FIXME: we shouldn't disambiguate displayNames on every orderMembersList
// invocation but keep track of duplicates incrementally somewhere
angular.forEach(displayNames, function(value, key) {
if (value.length > 1) {
// console.log(key + ": " + value);
for (i=0; i < value.length; i++) {
var v = value[i];
members[v].displayname += " (" + v + ")";
// console.log(v + " " + members[v]);
};
}
});
filtered.sort(function (a, b) {
return ((a["mtime_age"] || 10e10) > (b["mtime_age"] || 10e10) ? 1 : -1);
});
return filtered;
};
})
.filter('unsafe', ['$sce', function($sce) {
return function(text) {
return $sce.trustAsHtml(text);
};
}]);

View File

@ -13,8 +13,11 @@
<script type='text/javascript' src='js/ng-infinite-scroll-matrix.js'></script>
<script src="app.js"></script>
<script src="app-controller.js"></script>
<script src="app-directive.js"></script>
<script src="app-filter.js"></script>
<script src="login/login-controller.js"></script>
<script src="room/room-controller.js"></script>
<script src="room/room-directive.js"></script>
<script src="rooms/rooms-controller.js"></script>
<script src="user/user-controller.js"></script>
<script src="components/matrix/matrix-service.js"></script>

View File

@ -15,95 +15,6 @@ limitations under the License.
*/
angular.module('RoomController', ['ngSanitize'])
.directive('autoComplete', ['$timeout', function ($timeout) {
return function (scope, element, attrs) {
element.bind("keydown keypress", function (event) {
// console.log("event: " + event.which);
if (event.which === 9) {
if (!scope.autoCompleting) { // cache our starting text
// console.log("caching " + element[0].value);
scope.autoCompleteOriginal = element[0].value;
scope.autoCompleting = true;
}
if (event.shiftKey) {
scope.autoCompleteIndex--;
if (scope.autoCompleteIndex < 0) {
scope.autoCompleteIndex = 0;
}
}
else {
scope.autoCompleteIndex++;
}
var searchIndex = 0;
var targetIndex = scope.autoCompleteIndex;
var text = scope.autoCompleteOriginal;
// console.log("targetIndex: " + targetIndex + ", text=" + text);
// FIXME: use the correct regexp to recognise userIDs
var search = /@?([a-zA-Z0-9_\-:\.]+)$/.exec(text);
if (targetIndex === 0) {
element[0].value = text;
}
else if (search && search[1]) {
// console.log("search found: " + search);
var expansion;
// FIXME: could do better than linear search here
angular.forEach(scope.members, function(item, name) {
if (item.displayname && searchIndex < targetIndex) {
if (item.displayname.toLowerCase().indexOf(search[1].toLowerCase()) == 0) {
expansion = item.displayname;
searchIndex++;
}
}
});
if (searchIndex < targetIndex) { // then search raw mxids
angular.forEach(scope.members, function(item, name) {
if (searchIndex < targetIndex) {
if (name.toLowerCase().indexOf(search[1].toLowerCase()) == 1) {
expansion = name;
searchIndex++;
}
}
});
}
if (searchIndex === targetIndex) {
// xchat-style tab complete
if (search[0].length === text.length)
expansion += " : ";
else
expansion += " ";
element[0].value = text.replace(/@?([a-zA-Z0-9_\-:\.]+)$/, expansion);
// cancel blink
element[0].className = "";
}
else {
// console.log("wrapped!");
element[0].className = "blink"; // XXX: slightly naughty to bypass angular
$timeout(function() {
element[0].className = "";
}, 150);
element[0].value = text;
scope.autoCompleteIndex = 0;
}
}
else {
scope.autoCompleteIndex = 0;
}
event.preventDefault();
}
else if (event.which != 16 && scope.autoCompleting) {
scope.autoCompleting = false;
scope.autoCompleteIndex = 0;
}
});
};
}])
.controller('RoomController', ['$scope', '$http', '$timeout', '$routeParams', '$location', 'matrixService', 'eventStreamService', 'eventHandlerService',
function($scope, $http, $timeout, $routeParams, $location, matrixService, eventStreamService, eventHandlerService) {
'use strict';

View File

@ -0,0 +1,134 @@
/*
Copyright 2014 matrix.org
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
'use strict';
angular.module('RoomController')
.directive('autoComplete', ['$timeout', function ($timeout) {
return function (scope, element, attrs) {
element.bind("keydown keypress", function (event) {
// console.log("event: " + event.which);
if (event.which === 9) {
if (!scope.autoCompleting) { // cache our starting text
// console.log("caching " + element[0].value);
scope.autoCompleteOriginal = element[0].value;
scope.autoCompleting = true;
}
if (event.shiftKey) {
scope.autoCompleteIndex--;
if (scope.autoCompleteIndex < 0) {
scope.autoCompleteIndex = 0;
}
}
else {
scope.autoCompleteIndex++;
}
var searchIndex = 0;
var targetIndex = scope.autoCompleteIndex;
var text = scope.autoCompleteOriginal;
// console.log("targetIndex: " + targetIndex + ", text=" + text);
// FIXME: use the correct regexp to recognise userIDs
var search = /@?([a-zA-Z0-9_\-:\.]+)$/.exec(text);
if (targetIndex === 0) {
element[0].value = text;
}
else if (search && search[1]) {
// console.log("search found: " + search);
var expansion;
// FIXME: could do better than linear search here
angular.forEach(scope.members, function(item, name) {
if (item.displayname && searchIndex < targetIndex) {
if (item.displayname.toLowerCase().indexOf(search[1].toLowerCase()) === 0) {
expansion = item.displayname;
searchIndex++;
}
}
});
if (searchIndex < targetIndex) { // then search raw mxids
angular.forEach(scope.members, function(item, name) {
if (searchIndex < targetIndex) {
if (name.toLowerCase().indexOf(search[1].toLowerCase()) === 1) {
expansion = name;
searchIndex++;
}
}
});
}
if (searchIndex === targetIndex) {
// xchat-style tab complete
if (search[0].length === text.length)
expansion += " : ";
else
expansion += " ";
element[0].value = text.replace(/@?([a-zA-Z0-9_\-:\.]+)$/, expansion);
// cancel blink
element[0].className = "";
}
else {
// console.log("wrapped!");
element[0].className = "blink"; // XXX: slightly naughty to bypass angular
$timeout(function() {
element[0].className = "";
}, 150);
element[0].value = text;
scope.autoCompleteIndex = 0;
}
}
else {
scope.autoCompleteIndex = 0;
}
event.preventDefault();
}
else if (event.which !== 16 && scope.autoCompleting) {
scope.autoCompleting = false;
scope.autoCompleteIndex = 0;
}
});
};
}])
// A directive to anchor the scroller position at the bottom when the browser is resizing.
// When the screen resizes, the bottom of the element remains the same, not the top.
.directive('keepScroll', ['$window', function($window) {
return {
link: function(scope, elem, attrs) {
scope.windowHeight = $window.innerHeight;
// Listen to window size change
angular.element($window).bind('resize', function() {
// If the scroller is scrolled to the bottom, there is nothing to do.
// The browser will move it as expected
if (elem.scrollTop() + elem.height() !== elem[0].scrollHeight) {
// Else, move the scroller position according to the window height change delta
var windowHeightDelta = $window.innerHeight - scope.windowHeight;
elem.scrollTop(elem.scrollTop() - windowHeightDelta);
}
// Store the new window height for the next screen size change
scope.windowHeight = $window.innerHeight;
});
}
};
}]);