MirrorHub/synapse
0
0
Fork 1
mirror of https://mau.dev/maunium/synapse.git synced 2024-12-24 20:34:22 +01:00
Code Issues Projects Releases Wiki Activity
synapse/syweb/webclient/index.html

144 lines
8.7 KiB
HTML
Raw Normal View History

Reference Matrix Home Server
2014-08-12 16:10:52 +02:00
<!doctype html>
<html xmlns:ng="http://angularjs.org" ng-app="matrixWebClient" ng-controller="MatrixWebClientController">
<head>
<title>[matrix]</title>
very quick and dirty responsive design for iPhones
2014-08-23 21:45:00 +02:00
Reference Matrix Home Server
2014-08-12 16:10:52 +02:00
<link rel="stylesheet" href="app.css">
nasty big monolithic commit of a whole bunch of UI/UX improvements: - add a simple CSS template across the app for navigation & cosmetics - split login into login & register, and totally reskin it - restructure room CSS to play nicely with it - implement basis 1:1 chat from user pages - disable autofocus on iOS to improve UX
2014-08-31 01:40:42 +02:00
<link rel="stylesheet" href="mobile.css">
Implement SYWEB-121 : Display JSON when clicking messages. JSON is displayed as a modal dialog via AngularJS' bootstrap module, "ui.bootstrap".
2014-10-27 17:28:33 +01:00
<link rel="stylesheet" href="bootstrap.css">
nasty big monolithic commit of a whole bunch of UI/UX improvements: - add a simple CSS template across the app for navigation & cosmetics - split login into login & register, and totally reskin it - restructure room CSS to play nicely with it - implement basis 1:1 chat from user pages - disable autofocus on iOS to improve UX
2014-08-31 01:40:42 +02:00
Reference Matrix Home Server
2014-08-12 16:10:52 +02:00
<link rel="icon" href="favicon.ico">
Added infinite scrolling. It's sliiiightly buggy in that it jumps down the list a bit, but it is overall working pretty well. Added ng-infinite-scroll-matrix.js and jquery-1.8.3 as deps.
2014-08-15 18:42:02 +02:00
very quick and dirty responsive design for iPhones
2014-08-23 21:45:00 +02:00
<meta name="viewport" content="width=device-width">
Added basic captcha, not hooked up
2014-09-05 22:31:47 +02:00
<script type='text/javascript' src='js/jquery-1.8.3.min.js'></script>
https when loading recaptcha js
2014-09-06 18:47:30 +02:00
<script type="text/javascript" src="https://www.google.com/recaptcha/api/js/recaptcha_ajax.js"></script>
room.html now displays messages from model-service. Add debugging fields. Hook up the room member *at the time* to the message so it can display the right historical member info.
2014-10-31 17:22:15 +01:00
<script src="js/angular.js"></script>
use minified angular by default
2014-08-16 23:09:42 +02:00
<script src="js/angular-route.min.js"></script>
autohyperlink messages using linky
2014-08-16 23:21:52 +02:00
<script src="js/angular-sanitize.min.js"></script>
remove nganimate dependency as it seems to feature disproportionately highly in the FF profiler, and removing it seems to have stopped my FF stalling for seconds on end
2014-11-13 15:34:51 +01:00
<!--
Animation on call end icon.
2014-09-10 16:45:09 +02:00
<script src="js/angular-animate.min.js"></script>
remove nganimate dependency as it seems to feature disproportionately highly in the FF profiler, and removing it seems to have stopped my FF stalling for seconds on end
2014-11-13 15:34:51 +01:00
-->
major CSS overhaul to try to make things look a bit cleaner
2014-11-11 05:39:16 +01:00
<script src="js/jquery.peity.min.js"></script>
<script src="js/angular-peity.js"></script>
Implement SYWEB-121 : Display JSON when clicking messages. JSON is displayed as a modal dialog via AngularJS' bootstrap module, "ui.bootstrap".
2014-10-27 17:28:33 +01:00
<script type='text/javascript' src="js/ui-bootstrap-tpls-0.11.2.js"></script>
Added infinite scrolling. It's sliiiightly buggy in that it jumps down the list a bit, but it is overall working pretty well. Added ng-infinite-scroll-matrix.js and jquery-1.8.3 as deps.
2014-08-15 18:42:02 +02:00
<script type='text/javascript' src='js/ng-infinite-scroll-matrix.js'></script>
Use autofill-event.js to workaround browsers issue: Form model doesn't update on autocomplete https://github.com/angular/angular.js/issues/1460
2014-09-11 15:07:44 +02:00
<script type='text/javascript' src='js/autofill-event.js'></script>
SYWEB-12: More formatting and tweaking of state event JSON. Use a proper elastic directive to make the <textarea> resize dynamically. Use an 'asjson' directive to turn an ngModel of a JSON object into a formatted JSON string so it can be displayed on the textarea. Also, deep copy the state events being displayed, else it actually alters the underlying data structures when playing around with the JSON in the textarea!
2014-10-30 17:21:27 +01:00
<script type='text/javascript' src='js/elastic.js'></script>
Reference Matrix Home Server
2014-08-12 16:10:52 +02:00
<script src="app.js"></script>
Added webclient config.js for storing recaptcha public key.
2014-09-06 02:36:09 +02:00
<script src="config.js"></script>
Reference Matrix Home Server
2014-08-12 16:10:52 +02:00
<script src="app-controller.js"></script>
File organisation sanity: put directives and filters into dedicated files
2014-08-20 11:28:36 +02:00
<script src="app-directive.js"></script>
<script src="app-filter.js"></script>
Use /home everywhere
2014-08-22 18:08:03 +02:00
<script src="home/home-controller.js"></script>
Reference Matrix Home Server
2014-08-12 16:10:52 +02:00
<script src="login/login-controller.js"></script>
nasty big monolithic commit of a whole bunch of UI/UX improvements: - add a simple CSS template across the app for navigation & cosmetics - split login into login & register, and totally reskin it - restructure room CSS to play nicely with it - implement basis 1:1 chat from user pages - disable autofocus on iOS to improve UX
2014-08-31 01:40:42 +02:00
<script src="login/register-controller.js"></script>
Moved recents things into a separate (and reusable) controler
2014-08-27 15:09:16 +02:00
<script src="recents/recents-controller.js"></script>
Sort recents in anti-chronological order
2014-08-27 15:50:07 +02:00
<script src="recents/recents-filter.js"></script>
Reference Matrix Home Server
2014-08-12 16:10:52 +02:00
<script src="room/room-controller.js"></script>
File organisation sanity: put directives and filters into dedicated files
2014-08-20 11:28:36 +02:00
<script src="room/room-directive.js"></script>
Move profile parts of the rooms page and the config content into a new page: settings
2014-08-22 17:11:39 +02:00
<script src="settings/settings-controller.js"></script>
Created boilerplate for user profile page
2014-08-18 18:05:42 +02:00
<script src="user/user-controller.js"></script>
Reference Matrix Home Server
2014-08-12 16:10:52 +02:00
<script src="components/matrix/matrix-service.js"></script>
Moved mRoomName filter into matrix-filter.js, a place for all generic filters using Matrix data.
2014-09-04 11:19:28 +02:00
<script src="components/matrix/matrix-filter.js"></script>
WIP voip support on web client
2014-08-27 19:57:54 +02:00
<script src="components/matrix/matrix-call.js"></script>
<script src="components/matrix/matrix-phone-service.js"></script>
Added event stream service which neatly blobs together requests / state for the event stream. This depends on matrix service to do the actual hit. Currently this has exactly the same behaviour as before.
2014-08-15 11:20:14 +02:00
<script src="components/matrix/event-stream-service.js"></script>
Added event handler service which.. handles events. More specifically, it $broadcasts events depending on their type, and does processing on events (shuffling keys, adding events to $rootScope so displays will automatically update, sending delivery receipts, and so on). Some of this logic was previously contained in the RoomController, which fails the moment you add >1 room into the mix, hence requiring a Service to handle events, rather than having each individual controller maintain their part of the world.
2014-08-15 12:31:13 +02:00
<script src="components/matrix/event-handler-service.js"></script>
Add notification-service.js to handle binging/notifications. Shift logic to this service.
2014-10-31 12:20:07 +01:00
<script src="components/matrix/notification-service.js"></script>
Add recents-service to store shared state between recents-controllers. Remove the selectedRoomId from rootScope and instead store it in recents-service. Add a broadcast to notify listeners (recents-controller) to updates of this.
2014-11-12 15:55:57 +01:00
<script src="components/matrix/recents-service.js"></script>
SYWEB-152: Migrate IRC command logic to commands-service.
2014-11-13 12:55:02 +01:00
<script src="components/matrix/commands-service.js"></script>
Added model-service.js to store model data.
2014-10-31 15:26:51 +01:00
<script src="components/matrix/model-service.js"></script>
Determine and send user presence state
2014-08-26 16:25:27 +02:00
<script src="components/matrix/presence-service.js"></script>
Created m-file-input. A directive to open a file selection dialog on whatever HTML element
2014-08-14 11:36:11 +02:00
<script src="components/fileInput/file-input-directive.js"></script>
Create a temporary upload service server side (by hacking demos/webserver.py) and client side with an angularjs service component.
2014-08-14 18:39:23 +02:00
<script src="components/fileUpload/file-upload-service.js"></script>
Send images with their imageInfo (size, mymetype, width & height)
2014-08-20 16:18:50 +02:00
<script src="components/utilities/utilities-service.js"></script>
Reference Matrix Home Server
2014-08-12 16:10:52 +02:00
</head>
<body>
Prettier and stabler video with basic support for viewing mode. For now, transition into 'large' mode is disabled.
2014-09-18 16:51:30 +02:00
<div id="videoBackground" ng-class="videoMode">
<div id="videoContainer" ng-class="videoMode">
First working version of UI chrome for video calls.
2014-09-19 17:18:15 +02:00
<div id="videoContainerPadding"></div>
Various fixes to try & make openwebrtc safari extension work (still doesn't work).
2014-11-07 18:56:28 +01:00
<div ng-class="[videoMode, currentCall.state]" ng-show="currentCall && currentCall.type == 'video' && (currentCall.state == 'connected' || currentCall.state == 'connecting' || currentCall.state == 'invite_sent' || currentCall.state == 'ended')"><video id="localVideo"></video></div>
<div ng-class="[videoMode, currentCall.state]" ng-show="currentCall && currentCall.type == 'video' && (currentCall.state == 'connected' || (currentCall.state == 'ended' && currentCall.didConnect))"><video id="remoteVideo"></video></div>
Prettier and stabler video with basic support for viewing mode. For now, transition into 'large' mode is disabled.
2014-09-18 16:51:30 +02:00
</div>
</div>
Reference Matrix Home Server
2014-08-12 16:10:52 +02:00
nasty big monolithic commit of a whole bunch of UI/UX improvements: - add a simple CSS template across the app for navigation & cosmetics - split login into login & register, and totally reskin it - restructure room CSS to play nicely with it - implement basis 1:1 chat from user pages - disable autofocus on iOS to improve UX
2014-08-31 01:40:42 +02:00
<div id="header">
Reference Matrix Home Server
2014-08-12 16:10:52 +02:00
<!-- Do not show buttons on the login page -->
nasty big monolithic commit of a whole bunch of UI/UX improvements: - add a simple CSS template across the app for navigation & cosmetics - split login into login & register, and totally reskin it - restructure room CSS to play nicely with it - implement basis 1:1 chat from user pages - disable autofocus on iOS to improve UX
2014-08-31 01:40:42 +02:00
<div id="headerContent" ng-hide="'/login' == location || '/register' == location">
Better call bar (visually: still lacks ring[back] tones).
2014-09-06 01:14:02 +02:00
<div id="callBar" ng-show="currentCall">
<img id="callPeerImage" ng-show="currentCall.userProfile.avatar_url" ngSrc="{{ currentCall.userProfile.avatar_url }}" />
<img class="callIcon" src="img/green_phone.png" ng-show="currentCall.state != 'ended'" />
<img class="callIcon" id="callEndedIcon" src="img/red_phone.png" ng-show="currentCall.state == 'ended'" />
<div id="callPeerNameAndState">
<span id="callPeerName">{{ currentCall.userProfile.displayname }}</span>
<br />
<span id="callState">
<span ng-show="currentCall.state == 'invite_sent'">Calling...</span>
Prettier and stabler video with basic support for viewing mode. For now, transition into 'large' mode is disabled.
2014-09-18 16:51:30 +02:00
<span ng-show="currentCall.state == 'ringing' && currentCall && currentCall.type == 'video'">Incoming Video Call</span>
<span ng-show="currentCall.state == 'ringing' && currentCall && currentCall.type == 'voice'">Incoming Voice Call</span>
Better call bar (visually: still lacks ring[back] tones).
2014-09-06 01:14:02 +02:00
<span ng-show="currentCall.state == 'connecting'">Call Connecting...</span>
<span ng-show="currentCall.state == 'connected'">Call Connected</span>
Add stun server fallback and I-told-you-so message if we get no TURN server and the connection fails.
2014-09-25 12:13:32 +02:00
<span ng-show="currentCall.state == 'ended' && currentCall.hangupReason == 'ice_failed'">Media Connection Failed{{ haveTurn ? "" : " (VoIP relaying unsupported by Home Server)" }}</span>
Better logging of ICE candidates and fail the call when ICE fails.
2014-09-22 11:54:14 +02:00
<span ng-show="currentCall.state == 'ended' && !currentCall.hangupReason && !currentCall.didConnect && currentCall.direction == 'outbound' && currentCall.hangupParty == 'remote'">Call Rejected</span>
<span ng-show="currentCall.state == 'ended' && !currentCall.hangupReason && !currentCall.didConnect && currentCall.direction == 'outbound' && currentCall.hangupParty == 'local'">Call Canceled</span>
<span ng-show="currentCall.state == 'ended' && currentCall.hangupReason == 'invite_timeout' && !currentCall.didConnect && currentCall.direction == 'outbound' && currentCall.hangupParty == 'local'">User Not Responding</span>
<span ng-show="currentCall.state == 'ended' && !currentCall.hangupReason && currentCall.didConnect && currentCall.direction == 'outbound'">Call Ended</span>
<span ng-show="currentCall.state == 'ended' && !currentCall.hangupReason && !currentCall.didConnect && currentCall.direction == 'inbound'">Call Canceled</span>
<span ng-show="currentCall.state == 'ended' && !currentCall.hangupReason && currentCall.didConnect && currentCall.direction == 'inbound'">Call Ended</span>
Better call bar (visually: still lacks ring[back] tones).
2014-09-06 01:14:02 +02:00
<span ng-show="currentCall.state == 'wait_local_media'">Waiting for media permission...</span>
</span>
Fairly simple move of the call status widget to the header bar (and therefore into the index page rather than the rooms page).
2014-09-01 18:15:26 +02:00
</div>
Better call bar (visually: still lacks ring[back] tones).
2014-09-06 01:14:02 +02:00
<span ng-show="currentCall.state == 'ringing'">
Don't cache isWebRTCSupported because whether webRTC is supported might change part-way through the page's lifecycle if your webrtc support comes from some kind of injected content script (hello OpenWebRTC Sarafi extension)
2014-11-06 17:48:01 +01:00
<button ng-click="answerCall()" ng-disabled="!isWebRTCSupported()" title="{{isWebRTCSupported() ? '' : 'Your browser does not support VoIP' }}">Answer {{ currentCall.type }} call</button>
Better call bar (visually: still lacks ring[back] tones).
2014-09-06 01:14:02 +02:00
<button ng-click="hangupCall()">Reject</button>
</span>
Fairly simple move of the call status widget to the header bar (and therefore into the index page rather than the rooms page).
2014-09-01 18:15:26 +02:00
<button ng-click="hangupCall()" ng-show="currentCall && currentCall.state != 'ringing' && currentCall.state != 'ended' && currentCall.state != 'fledgling'">Hang up</button>
add sounds to the calling interface
2014-09-08 17:10:36 +02:00
<audio id="ringAudio" loop>
<source src="media/ring.ogg" type="audio/ogg" />
<source src="media/ring.mp3" type="audio/mpeg" />
</audio>
<audio id="ringbackAudio" loop>
<source src="media/ringback.ogg" type="audio/ogg" />
<source src="media/ringback.mp3" type="audio/mpeg" />
</audio>
<audio id="callendAudio">
<source src="media/callend.ogg" type="audio/ogg" />
<source src="media/callend.mp3" type="audio/mpeg" />
</audio>
<audio id="busyAudio">
<source src="media/busy.ogg" type="audio/ogg" />
<source src="media/busy.mp3" type="audio/mpeg" />
</audio>
Fairly simple move of the call status widget to the header bar (and therefore into the index page rather than the rooms page).
2014-09-01 18:15:26 +02:00
</div>
Video calling (in a tiny box at the moment)
2014-09-17 17:26:35 +02:00
nasty big monolithic commit of a whole bunch of UI/UX improvements: - add a simple CSS template across the app for navigation & cosmetics - split login into login & register, and totally reskin it - restructure room CSS to play nicely with it - implement basis 1:1 chat from user pages - disable autofocus on iOS to improve UX
2014-08-31 01:40:42 +02:00
<a href id="headerUserId" ng-click='goToUserPage(user_id)'>{{ user_id }}</a>
&nbsp;
actually add a 'home' button
2014-08-30 01:44:56 +02:00
<button ng-click='goToPage("/")'>Home</button>
Rename go() into goToPage() which is available from everywhere thanks to the inheritance of $scope
2014-08-27 10:25:27 +02:00
<button ng-click='goToPage("settings")'>Settings</button>
Reference Matrix Home Server
2014-08-12 16:10:52 +02:00
<button ng-click="logout()">Log out</button>
</div>
nasty big monolithic commit of a whole bunch of UI/UX improvements: - add a simple CSS template across the app for navigation & cosmetics - split login into login & register, and totally reskin it - restructure room CSS to play nicely with it - implement basis 1:1 chat from user pages - disable autofocus on iOS to improve UX
2014-08-31 01:40:42 +02:00
</div>
Reference Matrix Home Server
2014-08-12 16:10:52 +02:00
SYWEB-13: Do not start the app if the browser does not support WEBStorage. Internet Explorer case: Launch the app only for versions 9 and higher.
2014-09-19 15:18:30 +02:00
<div class="page" ng-hide="unsupportedBrowser" ng-view></div>
Reference Matrix Home Server
2014-08-12 16:10:52 +02:00
SYWEB-13: Do not start the app if the browser does not support WEBStorage. Internet Explorer case: Launch the app only for versions 9 and higher.
2014-09-19 15:18:30 +02:00
<div class="page" ng-show="unsupportedBrowser">
<div id="unsupportedBrowser" ng-show="unsupportedBrowser">
Sorry, your browser is not supported. <br/>
Reason: {{ unsupportedBrowser.reason }}
<br/><br/>
Your browser: <br/>
{{ unsupportedBrowser.browser }}
</div>
</div>
<div id="footer" ng-hide="location.indexOf('/room') === 0">
nasty big monolithic commit of a whole bunch of UI/UX improvements: - add a simple CSS template across the app for navigation & cosmetics - split login into login & register, and totally reskin it - restructure room CSS to play nicely with it - implement basis 1:1 chat from user pages - disable autofocus on iOS to improve UX
2014-08-31 01:40:42 +02:00
<div id="footerContent">
missing semicolon
2014-09-01 17:22:57 +02:00
&copy; 2014 Matrix.org
nasty big monolithic commit of a whole bunch of UI/UX improvements: - add a simple CSS template across the app for navigation & cosmetics - split login into login & register, and totally reskin it - restructure room CSS to play nicely with it - implement basis 1:1 chat from user pages - disable autofocus on iOS to improve UX
2014-08-31 01:40:42 +02:00
</div>
</div>
Reference Matrix Home Server
2014-08-12 16:10:52 +02:00
</body>
</html>
Reference in a new issue Copy permalink