Skip to content

Minds Frontend
Minds Frontend
Source
Select Git revision
...
Target
Select Git revision
 
Commits (9)
Hide whitespace changes
Inline Side-by-side
Showing with 113 additions and 75 deletions
src/app/common/components/infinite-scroll/horizontal-infinite-scroll.component.ts
View file @ 7c6f47dc
......@@ -7,6 +7,7 @@ import { Subscription } from "rxjs";
template: `
<div class="mdl-spinner mdl-js-spinner is-active" [mdl] [hidden]="!inProgress"></div>
<div class="m-infinite-scroll-manual"
[class.m-infinite-scroll-manual__loadMore]="!iconOnly"
[class.mdl-color--blue-grey-200]="!iconOnly"
[class.mdl-color-text--blue-grey-500]="!iconOnly"
[hidden]="inProgress || !moreData"
......@@ -17,6 +18,7 @@ import { Subscription } from "rxjs";
<i class="material-icons" *ngIf="iconOnly">keyboard_arrow_right</i>
</div>
<div class="m-infinite-scroll-manual"
[class.m-infinite-scroll-manual__noMore]="!iconOnly"
[class.mdl-color--blue-grey-200]="!iconOnly"
[class.mdl-color-text--blue-grey-500]="!iconOnly"
[hidden]="moreData"
......
src/app/common/components/infinite-scroll/infinite-scroll.scss
View file @ 7c6f47dc
......@@ -14,4 +14,27 @@ infinite-scroll{
font-weight: 600;
cursor:pointer;
}
.m-infinite-scroll-manual__noMore{
cursor: text;
@include m-theme(){
color: themed($m-blue-grey-300) !important;
background-color: themed($m-blue-grey-50) !important;
}
}
.m-infinite-scroll-manual__loadMore{
&:hover {
@include m-theme(){
color: themed($m-blue-grey-700) !important;
background-color: themed($m-blue-grey-300) !important;
}
}
&:active {
@include m-theme(){
background-color: themed($m-blue-grey-200) !important;
}
}
}
}
src/app/common/components/infinite-scroll/infinite-scroll.ts
View file @ 7c6f47dc
......@@ -7,6 +7,7 @@ import { Subscription } from "rxjs";
template: `
<div class="mdl-spinner mdl-js-spinner is-active" [mdl] [hidden]="!inProgress"></div>
<div class="m-infinite-scroll-manual"
[class.m-infinite-scroll-manual__loadMore]="!iconOnly"
[class.mdl-color--blue-grey-200]="!iconOnly"
[class.mdl-color-text--blue-grey-500]="!iconOnly"
[hidden]="inProgress || !moreData"
......@@ -17,6 +18,7 @@ import { Subscription } from "rxjs";
<i class="material-icons" *ngIf="iconOnly">keyboard_arrow_down</i>
</div>
<div class="m-infinite-scroll-manual"
[class.m-infinite-scroll-manual__noMore]="!iconOnly"
[class.mdl-color--blue-grey-200]="!iconOnly"
[class.mdl-color-text--blue-grey-500]="!iconOnly"
[hidden]="moreData"
......
src/app/modules/messenger/conversation/conversation.component.html
View file @ 7c6f47dc
<div class="m-messenger--conversation m-messenger--dockpane mdl-shadow--4dp" [class.m-messenger--dockpane-open]="conversation.open">
<div class="m-messenger--conversation m-messenger--dockpane" [class.m-messenger--dockpane-open]="conversation.open">
<div class="m-messenger--dockpane-tab"
[class.mdl-color--amber]="conversation.unread"
(click)="dockpanes.toggle(conversation); initialLoad()">
(click)="toggle(); initialLoad()">
<div class="m-messenger--dockpane-tab-title">
<span *ngFor="let participant of conversation.participants">{{participant.username}}</span>
</div>
<div class="m-messenger--dockpane-tab-actions" (click)="$event.stopPropagation()">
<i class="material-icons mdl-color-text--blue-grey-100" [hidden]="live">sync_problem</i>
<i class="material-icons"
(click)="ribbon.open = !ribbon.open"
[ngClass]="{ 'm-status-active': ribbon.open }"
>more_vert</i>
(click)="ribbonToggle()"
>more_vert</i>
<i class="material-icons" (click)="dockpanes.close(conversation)">close</i>
</div>
</div>
<div class="m-messenger--dockpane-container mdl-shadow--2dp">
<div class="m-messenger--dockpane-tab-ribbon" #ribbon [hidden]="!ribbon.open">
<div class="m-messenger--dockpane-tab-icon mdl-color-text--blue-grey-300" (click)="deleteHistory(); ribbon.open = false" *ngIf="showMessages">
<div class="m-messenger--dockpane-container">
<div class="m-messenger--dockpane-tab-ribbon" #ribbon [hidden]="!ribbonOpened">
<div class="m-messenger--dockpane-tab-icon mdl-color-text--blue-grey-300" (click)="deleteHistory(); ribbonOpened = false">
<i class="material-icons mdl-color-text--blue-grey-100" title="Delete chat history" i18n-title="@@MESSENGER__CONVERSATION__DELETE_TOOLTIP">delete</i>
<ng-container i18n="@@MESSENGER__CONVERSATION__DESTROY">Destroy</ng-container>
</div>
<div class="m-messenger--dockpane-tab-icon mdl-color-text--blue-grey-300" (click)="block(); ribbon.open = false" *ngIf="!blocked">
<div class="m-messenger--dockpane-tab-icon mdl-color-text--blue-grey-300" (click)="block(); ribbonOpened = false" *ngIf="!blocked">
<i class="material-icons mdl-color-text--blue-grey-100" title="Block participants" i18n-title="@@MESSENGER__CONVERSATION__BLOCK_TOOLTIP">block</i>
<ng-container i18n="@@MESSENGER__CONVERSATION__BLOCK">Block</ng-container>
</div>
<div class="m-messenger--dockpane-tab-icon mdl-color-text--blue-grey-300" (click)="block(); ribbon.open = false" *ngIf="blocked">
<div class="m-messenger--dockpane-tab-icon mdl-color-text--blue-grey-300" (click)="block(); ribbonOpened = false" *ngIf="blocked">
<i class="material-icons mdl-color-text--blue-grey-100" title="Un-block chat" i18n-title="@@MESSENGER__CONVERSATION__UNBLOCK_TOOLTIP">restore</i>
<ng-container i18n="@@MESSENGER__CONVERSATION__UNBLOCK">Un-block</ng-container>
</div>
......
src/app/modules/messenger/conversation/conversation.component.scss
View file @ 7c6f47dc
@import 'defaults.scss';
.m-messenger--conversation{
border-radius: 3px 3px 0 0;
@include m-theme(){
box-shadow: 0 2px 4px 0 rgba(themed($m-black), .15), 0 1px 0px -2px rgba(themed($m-black), .15), 0 1px 5px 0 rgba(themed($m-black), .15);
}
.m-messenger--conversation-messages{
max-height:240px;
......@@ -83,6 +87,15 @@
margin-bottom: $minds-padding * 2;
line-height: 1.35;
}
button:not([disabled]) {
&:hover {
@include m-theme(){
background-color: themed($m-blue-grey-700);
}
}
}
}
}
.m-messenger--conversation-composer{
......
src/app/modules/messenger/conversation/conversation.component.ts
View file @ 7c6f47dc
......@@ -64,6 +64,8 @@ export class MessengerConversation {
invitable: any[] | null = null;
invited: boolean = false;
ribbonOpened: boolean = false;
constructor(
public session: Session,
public client: Client,
......@@ -360,8 +362,22 @@ export class MessengerConversation {
has = true;
}
});
return has;
}
// Open the conversation with the ribbon
ribbonToggle() {
if (!this.ribbonOpened && !this.conversation.open) {
this.dockpanes.open(this.conversation);
}
this.ribbonOpened = !this.ribbonOpened;
}
// Close the ribbon with the conversation
toggle() {
if (this.ribbonOpened) {
this.ribbonOpened = false;
}
this.dockpanes.toggle(this.conversation);
}
}
src/app/modules/messenger/dockpanes/dockpanes.component.scss
View file @ 7c6f47dc
......@@ -37,7 +37,6 @@
@include m-theme(){
background-color: themed($m-white);
color: themed($m-grey-800);
border: 1px solid themed($m-grey-50);
}
.m-messenger--dockpane-tab-title{
......@@ -63,7 +62,6 @@
}
.m-messenger--dockpane-tab-actions{
display: inline-block;
text-align: right;
vertical-align: middle;
float: right;
......@@ -75,10 +73,9 @@
line-height: 12px;
border-radius: 0 3px 0 0;
&:hover,
&.m-status-active{
&:hover{
@include m-theme(){
color: themed($m-blue-grey-700) !important;
color: themed($m-grey-500) !important;
}
}
}
......@@ -121,6 +118,17 @@
padding-bottom: 8px;
cursor: pointer;
&:hover{
@include m-theme(){
color: themed($m-blue-grey-500) !important;
}
> i {
@include m-theme(){
color: themed($m-blue-grey-500) !important;
}
}
}
> i{
width: 100%;
font-size: 16px;
......@@ -128,12 +136,6 @@
line-height: 12px;
border-radius: 0 3px 0 0;
cursor: pointer;
&:hover{
@include m-theme(){
color: themed($m-blue-grey-700) !important;
}
}
}
}
}
......
src/app/modules/messenger/encryption/encryption.component.scss
View file @ 7c6f47dc
......@@ -23,13 +23,13 @@
font-size: 11px;
line-height: 1.35;
margin: 0;
padding: $minds-padding;
padding: 8px 12px;
}
.m-messenger--encryption-setup-help {
font-size: 11px;
line-height: 1.35;
margin: 0;
padding: $minds-padding;
padding: 8px 12px;
@include m-theme(){
color: themed($m-blue-grey-700);
}
......
src/app/modules/messenger/userlist/userlist.component.html
View file @ 7c6f47dc
......@@ -4,32 +4,30 @@
<div class="m-messenger--dockpane-tab-title"><i class="material-icons">chat_bubble</i><span i18n="@@MESSENGER__USERLIST__MESSENGER_TITLE">Messenger</span></div>
<div class="m-messenger--dockpane-tab-actions" (click)="$event.stopPropagation()">
<i class="material-icons"
(click)="ribbonToggle()"
[ngClass]="{ 'm-status-active': opened_ribbon }">
(click)="ribbonToggle()">
settings
</i>
</div>
</div>
<div class="m-messenger--dockpane-container">
<div class="m-messenger--dockpane-tab-ribbon mdl-color-text--blue-grey-300" #ribbon [hidden]="!opened_ribbon">
<div class="m-messenger--dockpane-tab-icon" (click)="logout(); opened_ribbon = false" [hidden]="!encryption.isOn()">
<div class="m-messenger--dockpane-tab-ribbon mdl-color-text--blue-grey-300" #ribbon [hidden]="!ribbonOpened">
<div class="m-messenger--dockpane-tab-icon" (click)="logout(); ribbonOpened = false" [hidden]="!encryption.isOn()">
<i class="material-icons mdl-color-text--blue-grey-100"
title="Logout of chat" i18n-title="@@MESSENGER__USERLIST__LOGOUT_TOOLTIP"
>exit_to_app</i>
<ng-container i18n="@@MESSENGER__USERLIST__LOGOUT">Logout</ng-container>
</div>
<div class="m-messenger--dockpane-tab-icon mdl-color-text--blue-grey-300" (click)="sounds.mute(); opened_ribbon = false" [hidden]="!sounds.canPlay()">
<div class="m-messenger--dockpane-tab-icon mdl-color-text--blue-grey-300" (click)="sounds.mute(); ribbonOpened = false" [hidden]="!sounds.canPlay()">
<i class="material-icons mdl-color-text--blue-grey-100"
title="Disable sounds" i18n-title="@@MESSENGER__USERLIST__DISABLE_SOUNDS_TOOLTIP">notifications</i>
<ng-container i18n="@@MESSENGER__USERLIST__MUTE">Mute</ng-container>
</div>
<div class="m-messenger--dockpane-tab-icon mdl-color-text--blue-grey-300" (click)="sounds.unmute(); opened_ribbon = false" [hidden]="sounds.canPlay()">
<div class="m-messenger--dockpane-tab-icon mdl-color-text--blue-grey-300" (click)="sounds.unmute(); ribbonOpened = false" [hidden]="sounds.canPlay()">
<i class="material-icons mdl-color-text--blue-grey-100"
title="Enable sounds" i18n-title="@@MESSENGER__USERLIST__ENABLE_SOUNDS_TOOLTIP">notifications_off</i>
<ng-container i18n="@@MESSENGER__USERLIST__UNMUTE">Unmute</ng-container>
</div>
<div class="m-messenger--dockpane-tab-icon mdl-color-text--blue-grey-300" (click)="encryption.reKeying = !encryption.reKeying; opened_ribbon = false">
<div class="m-messenger--dockpane-tab-icon mdl-color-text--blue-grey-300" (click)="encryption.reKeying = !encryption.reKeying; ribbonOpened = false">
<i class="material-icons mdl-color-text--blue-grey-100"
title="Change your encryption password" i18n-title="@@MESSENGER__USERLIST__CHANGE_PWD_TOOLTIP">vpn_key</i>
<ng-container i18n="@@MESSENGER__USERLIST__REKEY">Re-key</ng-container>
......@@ -53,11 +51,9 @@
<div [hidden]="!inProgress" style="width:100%; text-align:center; ">
<div class="mdl-spinner mdl-js-spinner is-active" [mdl] style="margin: 16px auto;"></div>
</div>
</div>
<div class="m-messenger--userlist-search" [hidden]="opened_ribbon">
<div class="m-messenger--userlist-search" [hidden]="ribbonOpened">
<i class="material-icons">search</i>
<input type="text" placeholder="Search" i18n-placeholder="@@MESSENGER__USERLIST__SEARCH_PH" #q (keyup)="search(q);">
</div>
......
src/app/modules/messenger/userlist/userlist.component.scss
View file @ 7c6f47dc
......@@ -3,6 +3,10 @@
#{if(&, "&", "*")}.m-messenger--userlist{
width:200px;
border-radius: 3px 3px 0 0;
@include m-theme(){
box-shadow: 0 2px 4px 0 rgba(themed($m-black), .15), 0 1px 0px -2px rgba(themed($m-black), .15), 0 1px 5px 0 rgba(themed($m-black), .15);
}
.m-messenger--userlist-search{
height: 30px;
......@@ -42,6 +46,12 @@
display: flex;
align-items: center;
&:hover {
@include m-theme(){
background-color: rgba(themed($m-blue-grey-50), 0.5);
}
}
img{
width: 24px;
margin: 8px;
......
src/app/modules/messenger/userlist/userlist.component.ts
View file @ 7c6f47dc
......@@ -28,7 +28,7 @@ export class MessengerUserlist {
hasMoreData: boolean = true;
inProgress: boolean = false;
cb: number = Date.now();
opened_ribbon: boolean = false;
minds: Minds = window.Minds;
storage: Storage = new Storage();
......@@ -37,7 +37,8 @@ export class MessengerUserlist {
};
userListToggle: boolean = false;
ribbonOpened: boolean = false;
search_timeout;
constructor(
......@@ -170,14 +171,19 @@ export class MessengerUserlist {
}
}
// Open the userlist with the ribbon
ribbonToggle() {
if (!this.userListToggle) {
if (!this.ribbonOpened && !this.userListToggle) {
this.userListToggle = true;
}
this.opened_ribbon = !this.opened_ribbon;
this.ribbonOpened = !this.ribbonOpened;
}
// Close the ribbon with the userlist
toggle() {
if (this.ribbonOpened) {
this.ribbonOpened = false;
}
this.userListToggle = !this.userListToggle;
if (this.userListToggle)
this.load({ refresh: true });
......
src/app/modules/wallet/tokens/contributions/chart.component.html
View file @ 7c6f47dc
......@@ -35,41 +35,7 @@
</div>
</div>
<div class="m-token-contributions--chart--contribution">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="Capa_1" x="0px" y="0px" width="512px" height="512px" viewBox="0 0 457.03 457.03" style="enable-background:new 0 0 457.03 457.03;" xml:space="preserve">
<g>
<path d="M421.512,207.074l-85.795,85.767c-47.352,47.38-124.169,47.38-171.529,0c-7.46-7.439-13.296-15.821-18.421-24.465 l39.864-39.861c1.895-1.911,4.235-3.006,6.471-4.296c2.756,9.416,7.567,18.33,14.972,25.736c23.648,23.667,62.128,23.634,85.762,0 l85.768-85.765c23.666-23.664,23.666-62.135,0-85.781c-23.635-23.646-62.105-23.646-85.768,0l-30.499,30.532 c-24.75-9.637-51.415-12.228-77.373-8.424l64.991-64.989c47.38-47.371,124.177-47.371,171.557,0 C468.869,82.897,468.869,159.706,421.512,207.074z M194.708,348.104l-30.521,30.532c-23.646,23.634-62.128,23.634-85.778,0 c-23.648-23.667-23.648-62.138,0-85.795l85.778-85.767c23.665-23.662,62.121-23.662,85.767,0 c7.388,7.39,12.204,16.302,14.986,25.706c2.249-1.307,4.56-2.369,6.454-4.266l39.861-39.845 c-5.092-8.678-10.958-17.03-18.421-24.477c-47.348-47.371-124.172-47.371-171.543,0L35.526,249.96 c-47.366,47.385-47.366,124.172,0,171.553c47.371,47.356,124.177,47.356,171.547,0l65.008-65.003 C246.109,360.336,219.437,357.723,194.708,348.104z" fill="#5f7d8b"/>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
</svg>
<i class="material-icons">link</i>
<div class="m-token-contributions--chart--contribution-text">
<span>OnChain Transactions</span>
<span>+10 (receiver)</span>
......
src/app/services/api/upload.ts
View file @ 7c6f47dc
......@@ -46,10 +46,13 @@ export class Upload {
}
xhr.open('POST', this.base + endpoint, true);
xhr.upload.addEventListener('progress', function (e: any) {
progress(e.loaded / e.total * 100);
if (e.lengthComputable) {
progress((e.loaded / (e.total) * 99));
}
});
xhr.onload = function (this: XMLHttpRequest) {
if (this.status === 200) {
progress(100);
resolve(JSON.parse(this.response));
} else {
reject(this.response);
......