...
 
Commits (18)
......@@ -6,6 +6,7 @@
display: inline-flex;
.m-phone-input--wrapper {
margin-bottom: $minds-padding;
@include m-theme(){
background-color: themed($m-white);
}
......@@ -53,6 +54,8 @@
display: inline-flex;
align-items: center;
cursor: pointer;
border-top-left-radius: 6px;
border-bottom-left-radius: 6px;
@include m-theme(){
background-color: themed($m-white);
}
......
......@@ -57,17 +57,6 @@
</a>
</li>
<li
class="m-dropdownList__item m-user-menuDropdown__Item"
*ngIf="getCurrentUser()"
(click)="closeMenu()"
>
<a routerLink="/settings/general">
<i class="material-icons">settings</i>
<span i18n>Settings</span>
</a>
</li>
<li
class="m-dropdownList__item m-user-menuDropdown__Item"
*ngIf="getCurrentUser()"
......@@ -112,27 +101,48 @@
</li>
</ng-template>
<li
class="m-dropdownList__item m-user-menuDropdown__Item"
*ngIf="getCurrentUser()"
(click)="closeMenu()"
>
<a routerLink="/canary">
<i class="material-icons">new_releases</i>
<span *ngIf="!getCurrentUser()?.canary; else canaryDropdownItem" i18n>Canary Mode</span>
<ng-template #canaryDropdownItem>
<span i18n>Canary Mode</span>
</ng-template>
</a>
</li>
<li
class="m-dropdownList__item m-user-menuDropdown__Item"
(click)="closeMenu()"
>
<a target="_blank" [href]="minds.cdn_assets_url + 'assets/documents/Whitepaper-v0.5.pdf'">
<i class="material-icons">description</i>
<span i18n>Whitepaper</span>
<a routerLink="/mobile">
<i class="material-icons">phone_iphone</i>
<span i18n>Mobile App</span>
</a>
</li>
<li
class="m-dropdownList__item m-user-menuDropdown__Item"
(click)="closeMenu()"
>
<a target="_blank" href="https://www.teespring.com/stores/minds">
<i class="material-icons">shopping_cart</i>
<span i18n>Store</span>
</a>
</li>
<li
class="m-dropdownList__item m-user-menuDropdown__Item"
*ngIf="getCurrentUser()"
(click)="closeMenu()"
>
<a routerLink="/canary">
<i class="material-icons">new_releases</i>
<span *ngIf="!getCurrentUser()?.canary; else canaryDropdownItem" i18n>Opt-in to Experiments</span>
<ng-template #canaryDropdownItem>
<span i18n>Canary</span>
</ng-template>
<a routerLink="/content-policy">
<i class="material-icons">gavel</i>
<span i18n>Content Policy</span>
</a>
</li>
......@@ -154,9 +164,9 @@
*ngIf="getCurrentUser()"
(click)="closeMenu()"
>
<a routerLink="/content-policy">
<i class="material-icons">gavel</i>
<span i18n>Content Policy</span>
<a routerLink="/settings/general">
<i class="material-icons">settings</i>
<span i18n>Settings</span>
</a>
</li>
......@@ -174,3 +184,4 @@
</div>
<div class="minds-bg-overlay" (click)="closeMenu()" [hidden]="!isOpen"></div>
<section class="m-video-banner">
<div class="video">
<video autoplay muted loop poster="{{minds.cdn_assets_url}}assets/videos/earth-1/earth-1.png" *ngIf="flags.canPlayInlineVideos">
<!--<source src="assets/videos/traffic-1/traffic-1.webm" type="video/webm">
<source src="assets/videos/traffic-1/traffic-1.mp4" type="video/mp4">-->
<source src="{{minds.cdn_assets_url}}assets/videos/earth-1/earth-1.webm" type="video/webm">
<source src="{{minds.cdn_assets_url}}assets/videos/earth-1/earth-1.mp4" type="video/mp4">
<section class="m-register--hero">
<div class="m-register--hero--video">
<video autoplay muted loop *ngIf="!videoError; else fallback">
<source [src]="minds.cdn_assets_url + 'assets/videos/what-1/what-1.mp4'" type="video/mp4" (error)="onSourceError()">
</video>
<ng-template #fallback>
<img [src]="minds.cdn_assets_url + 'assets/photos/cover.png'">
</ng-template>
</div>
<div class="overlay overlay--0.6">
<div class="" style="max-width:400px">
<div class="mdl-color-text--white">
<h3 i18n="@@M__COMMON__START_A_CHANNEL">Not on Minds? Start a channel</h3>
</div>
<div class="m-register--hero--inner">
<div class="m-register--hero--overlay"></div>
<div class="m-register--hero--slogans">
<h1 i18n="@@M__SOCIAL_NETWORK_SLOGAN">Where minds gather</h1>
<h3 i18n="@@MINDS__HOME__register__LAUNCH_CTA">
The leading open source social network for Internet freedom.
Earn crypto and free promotion for your contributions.
</h3>
</div>
<div class="m-register--signup" [hidden]="session.isLoggedIn()">
<minds-form-register (done)="registered()" [referrer]="referrer"></minds-form-register>
</div>
</div>
</section>
<div class="mdl-grid mdl-grid--no-spacing m-register--footer">
<section class="mdl-cell mdl-cell--12-col m-footer">
<img [src]="minds.cdn_assets_url + 'assets/logos/logo.svg'" />
<ul class="m-footer-nav m-footer-nav-inline">
<li *ngFor="let page of navigation.getItems('footer')" class="m-footer-nav-item ">
<a *ngIf="page.path && page.path.indexOf('p/') > -1" [routerLink]="[page.path]">{{page.title}}</a>
<a *ngIf="page.path.indexOf('p/') < 0" [href]="page.path" target="_blank">{{page.title}}</a>
</li>
</ul>
<span class="copyright" i18n="@@M__COMMON__COPYRIGHT_YEAR">&#169; Minds {{'2019'}}</span>
</section>
</div>
This diff is collapsed.
import { Component } from '@angular/core';
import { Component, OnInit, OnDestroy } from '@angular/core';
import { Router, ActivatedRoute } from '@angular/router';
import { Subscription } from 'rxjs';
import { Navigation as NavigationService } from '../../services/navigation';
import { Client } from '../../services/api';
import { Session } from '../../services/session';
import { SignupModalService } from '../modals/signup/service';
......@@ -14,13 +15,14 @@ import { OnboardingService } from '../onboarding/onboarding.service';
templateUrl: 'register.component.html'
})
export class RegisterComponent {
export class RegisterComponent implements OnInit, OnDestroy {
minds = window.Minds;
errorMessage: string = '';
twofactorToken: string = '';
hideLogin: boolean = false;
inProgress: boolean = false;
videoError: boolean = false;
referrer: string;
flags = {
......@@ -37,35 +39,44 @@ export class RegisterComponent {
private loginReferrer: LoginReferrerService,
public session: Session,
private onboarding: OnboardingService,
) { }
public navigation: NavigationService,
) {
if (this.session.isLoggedIn()) {
this.router.navigate(['/newsfeed']);
return;
}
}
ngOnInit() {
this.paramsSubscription = this.route.queryParams.subscribe(params => {
// Set referrer if there is one
if (params['referrer']) {
this.referrer = params['referrer'];
}
if (this.session.isLoggedIn() && this.referrer) {
this.loginReferrer.navigate({ defaultUrl: '/' + this.referrer});
} else if (this.session.isLoggedIn()) {
this.loginReferrer.navigate();
}
});
if (/iP(hone|od)/.test(window.navigator.userAgent)) {
this.flags.canPlayInlineVideos = false;
this.flags.canPlayInlineVideos = false; // Where is this used?
}
}
ngOnDestroy() {
this.paramsSubscription.unsubscribe();
}
registered() {
this.loginReferrer.navigate({
defaultUrl: '/' + this.session.getLoggedInUser().username
});
// this.loginReferrer.navigate({
// defaultUrl: '/' + this.session.getLoggedInUser().username
// });
this.router.navigate(['/' + this.session.getLoggedInUser().username]);
}
onSourceError() {
this.videoError = true;
}
ngOnDestroy() {
if (this.paramsSubscription) {
this.paramsSubscription.unsubscribe();
}
}
}
......@@ -102,10 +102,6 @@ m-channel{
}
.m-channel--city{
//margin:auto;
}
.m-channel--blocked{
margin: 100px auto;
h3{
......@@ -168,27 +164,39 @@ m-channel{
justify-content: center;
align-items: center;
position: relative;
margin: auto;
> * {
margin: 4px;
}
> *:last-child {
margin-right: 0;
padding: 4px;
}
.m-channel--badges {
min-width: 118px;
justify-content: center;
> i {
padding: 4px;
}
}
.m-channel--edit-button-wrapper {
flex-shrink: 0;
}
minds-button-subscribe > button {
height: 32px;
padding: 8px 16px 8px 12px;
}
.minds-button-edit > button, minds-button-user-dropdown > button{
font-size: 16px;
border:0;
}
@media screen and (max-width: $max-mobile * 1.25) {
m-messenger--channel-button {
display: none;
}
}
}
.minds-channel-sidebar, .m-channel-sidebar{
......@@ -198,28 +206,28 @@ m-channel{
overflow:visible;
min-height:0;
minds-button-user-dropdown {
> button {
position: relative;
}
.minds-dropdown-menu {
position: absolute;
top: 112px;
right: -124px;
}
minds-button-user-dropdown {
> button {
position: relative;
}
.minds-button-edit > button, minds-button-user-dropdown > button{
.minds-dropdown-menu {
position: absolute;
top: 112px;
right: -124px;
}
}
.minds-button-edit > button, minds-button-user-dropdown > button{
@include m-theme(){
color: rgba(themed($m-black), 0.3);
}
&:hover {
@include m-theme(){
color: rgba(themed($m-black), 0.5);
}
}
}
}
minds-avatar{
margin:-75px auto 0;
......
......@@ -25,6 +25,7 @@ import { ExplicitOverlayComponent } from './explicit-overlay/overlay.component';
import { HashtagsModule } from '../hashtags/hashtags.module';
import { ChannelSortedComponent } from './sorted/sorted.component';
import { ChannelSortedModuleComponent } from './sorted/module.component';
import { ReferralsModule } from '../wallet/tokens/referrals/referrals.module';
const routes: Routes = [
{ path: 'channels/:filter', component: ChannelsListComponent },
......@@ -45,6 +46,7 @@ const routes: Routes = [
PosterModule,
NewsfeedModule,
HashtagsModule,
ReferralsModule,
],
declarations: [
ChannelModulesComponent,
......
......@@ -8,13 +8,11 @@
<button class="material-icons" [hidden]="!editing">done</button>
</span>
<minds-button-user-dropdown [(user)]="user" *ngIf="session.getLoggedInUser().guid != user.guid"></minds-button-user-dropdown>
</div>
<div class="m-channel--username">
<h2><span>@</span>{{user.username}}</h2>
</div>
<div class="mdl-card__supporting-text" id="bio" [hidden]="editing" style="white-space:pre-line; text-align:center;" [innerHtml]="user.briefdescription | tags"></div>
<div class="minds-editable-container mdl-card__supporting-text" *ngIf="editing && isOwner()">
<!-- OWNER EDIT FORM -->
<textarea
......@@ -48,7 +46,7 @@
<div class="m-channel-bio-field mdl-color-text--blue-grey-300" *ngIf="user.tags && !editing">
<div [hidden]="editing || !user.tags" class="m-channel-bio-field__tags-container">
<div class="m-channel-bio-field__tags-container" [hidden]="editing || !user.tags">
<i class="material-icons mdl-color-text--blue-grey-300">local_offer</i>
<span *ngFor="let tag of user.tags">#{{tag}}</span>
</div>
......@@ -119,10 +117,17 @@
</div>
</div>
<div class="m-channel--action-buttons" >
<div class="m-channel--action-buttons">
<minds-button-subscribe [user]="user" *ngIf="session.isLoggedIn() && session.getLoggedInUser().guid != user.guid && !user.blocked && !user.subscribed"></minds-button-subscribe>
<m-messenger--channel-button [user]="user" *ngIf="user.subscribed && session.getLoggedInUser().guid != user.guid"></m-messenger--channel-button>
<div class="m-channel--edit-button-wrapper" (click)="toggleEditing()" *ngIf="session.getLoggedInUser().guid == user.guid">
<div *ngIf="session.getLoggedInUser().guid == user.guid"
(click)="openReferralsModal()">
<button class="m-btn m-btn--with-icon m-btn--slim">
<i class="material-icons">people</i>
<span>Refer Friends</span>
</button>
</div>
<div *ngIf="session.getLoggedInUser().guid == user.guid" class="m-channel--edit-button-wrapper" (click)="toggleEditing()">
<button class="m-btn m-btn--with-icon m-btn--slim">
<i [hidden]="editing" class="material-icons">edit</i>
<i [hidden]="!editing" class="material-icons">done</i>
......@@ -130,7 +135,7 @@
<span [hidden]="!editing" i18n="@@M__ACTION__SAVE">Save</span>
</button>
</div>
<minds-button-boost [object]="user" *ngIf="session.getLoggedInUser().guid == user.guid"></minds-button-boost>
<minds-button-boost *ngIf="session.getLoggedInUser().guid == user.guid" [object]="user"></minds-button-boost>
<m-channel--badges [user]="user"></m-channel--badges>
</div>
</div>
......
......@@ -41,19 +41,3 @@
}
}
}
.m-channel--action-buttons {
// @media screen and (max-width: $min-desktop) and (min-width: $min-tablet){
// m-messenger--channel-button {
// span {
// display:none;
// }
// }
// }
@media screen and (max-width: $max-mobile * 1.25) {
m-messenger--channel-button {
display: none;
}
}
}
\ No newline at end of file
......@@ -5,6 +5,8 @@ import { MindsUser } from '../../../interfaces/entities';
import { Tag } from '../../hashtags/types/tag';
import { ChannelOnboardingService } from "../../onboarding/channel/onboarding.service";
import { Storage } from '../../../services/storage';
import { OverlayModalService } from '../../../services/ux/overlay-modal';
import { ReferralsLinksComponent } from '../../wallet/tokens/referrals/links/links.component';
@Component({
moduleId: module.id,
......@@ -36,7 +38,8 @@ export class ChannelSidebar {
public upload: Upload,
public session: Session,
public onboardingService: ChannelOnboardingService,
protected storage: Storage
protected storage: Storage,
private overlayModal: OverlayModalService,
) {
if (onboardingService && onboardingService.onClose)
onboardingService.onClose.subscribe(progress => {
......@@ -76,7 +79,6 @@ export class ChannelSidebar {
}
toggleEditing() {
if (this.tooManyTags) {
return;
}
......@@ -144,5 +146,11 @@ export class ChannelSidebar {
this.user.social_profiles = value;
}
openReferralsModal() {
this.overlayModal.create(ReferralsLinksComponent, {}, {
class: 'm-overlay-modal--referrals-links m-overlay-modal--medium'
}).present();
}
}
......@@ -20,6 +20,9 @@
@media screen and(max-width: $min-desktop) {
padding-right: 0;
&::-webkit-scrollbar, &::-webkit-scrollbar:horizontal {
display: none;
}
}
infinite-scroll {
......
......@@ -42,7 +42,7 @@ export class HomepageComponent {
) {
this.title.setTitle('Minds Social Network', false);
this.loadStream();
if (this.session.isLoggedIn()) {
this.router.navigate(['/newsfeed']);
return;
......
......@@ -3,19 +3,19 @@
m-messenger--channel-button{
> button {
background: transparent;
font-size: 12px;
padding: 4px 8px !important;
min-width: 128px;
background: transparent;
font-size: 12px;
padding: 4px 8px !important;
min-width: 128px;
> i, &.material-icons {
padding-bottom: 1px;
vertical-align:middle;
margin-top: 2px;
}
> span {
padding-left: $minds-padding;
}
> i, &.material-icons {
padding-bottom: 1px;
vertical-align:middle;
margin-top: 2px;
}
> span {
padding-left: $minds-padding;
}
}
}
import { Component, EventEmitter } from '@angular/core';
import { Session } from '../../../services/session';
import { MindsUser } from '../../../interfaces/entities';
@Component({
selector: 'm-modal-invite',
inputs: ['open'],
outputs: ['closed'],
template: `
<m-modal [open]="open" (closed)="close($event)">
<div class="mdl-card__supporting-text">
<ng-container i18n="@@MODALS__INVITE__DESCRIPTION">Send the link below to your contacts to earn tokens for your referrals:</ng-container>
</div>
<div class="mdl-card__supporting-text">
<input class="" value="{{url}}" (focus)="copy($event)" (click)="copy($event)" autofocus/>
</div>
<div class="mdl-card__supporting-text">
<ng-container i18n="@@MODALS__INVITE__DESCRIPTION">Add this code to the end of any Minds link you share and earn tokens for signups within 24 hours:</ng-container>
</div>
<div class="mdl-card__supporting-text">
<input class="" value="?referrer={{user.username}}" (focus)="copy($event)" (click)="copy($event)" autofocus/>
</div>
<div class="m-social-share-buttons">
<button class="mdl-button mdl-button--raised mdl-color-text--white m-social-share-fb"
(click)="openWindow('https://www.facebook.com/sharer/sharer.php?u=' + encodedUrl + '&display=popup&ref=plugin&src=share_button')">
<ng-container i18n="@@M__NAMES__FACEBOOK">Facebook</ng-container>
</button>
<button class="mdl-button mdl-button--raised mdl-color-text--white m-social-share-twitter"
(click)="openWindow('https://twitter.com/intent/tweet?text=Join%20me%20on%20Minds&tw_p=tweetbutton&url=' + encodedUrl)">
<ng-container i18n="@@M__NAMES__TWITTER">Twitter</ng-container>
</button>
<button class="mdl-button mdl-button--raised mdl-color-text--white m-social-share-email" (click)="openEmail()">
<ng-container i18n="@@M__COMMON__EMAIL">Email</ng-container>
</button>
</div>
</m-modal>
`
})
export class InviteModal {
open: boolean = false;
closed: EventEmitter<any> = new EventEmitter();
url: string = '';
encodedUrl: string = '';
embedCode: string = '';
user: MindsUser = window.Minds.user;
constructor(public session: Session) { }
ngOnInit() {
this.url = window.Minds.site_url + 'register?referrer=' + this.session.getLoggedInUser().username;
this.encodedUrl = encodeURI(this.url);
}
close(e?) {
this.open = false;
this.closed.next(true);
}
copy(e) {
e.target.select();
document.execCommand('copy');
}
openWindow(url: string) {
window.open(url, '_blank', 'width=600, height=300, left=80, top=80');
}
openEmail() {
window.location.href = 'mailto:?subject=Join%20me%20on%20minds&body=Join me on Minds ' + this.encodedUrl;
}
}
......@@ -88,7 +88,7 @@ m-modal-signup, m-modal-signup-on-action{
justify-content: center;
padding: 0 30px;
}
.m-androidApp__download {
margin: 0;
}
......@@ -110,7 +110,7 @@ m-modal-signup, m-modal-signup-on-action{
}
}
m-modal-share, m-modal-invite {
m-modal-share {
z-index: 1000;
position: relative;
......
......@@ -7,7 +7,6 @@ import { CommonModule } from '../../common/common.module';
import { MindsFormsModule } from '../forms/forms.module';
import { ConfirmModal } from './confirm/confirm';
import { InviteModal } from './invite/invite';
import { RemindComposerModal } from './remind-composer/remind-composer';
import { ShareModal } from './share/share';
import { SignupOnActionModal } from './signup/signup-on-action';
......@@ -27,7 +26,6 @@ import { TOSUpdatedModal } from './tos-updated/tos.component';
],
declarations: [
ConfirmModal,
InviteModal,
RemindComposerModal,
ShareModal,
SignupOnActionModal,
......@@ -41,7 +39,6 @@ import { TOSUpdatedModal } from './tos-updated/tos.component';
],
exports: [
ConfirmModal,
InviteModal,
RemindComposerModal,
ShareModal,
SignupOnActionModal,
......
......@@ -31,16 +31,14 @@ export class SignupOnScrollModal {
ngOnDestroy() {
this.unListen();
if (this.scroll_listener) {
this.scroll.unListen(this.scroll_listener);
}
}
listen() {
this.routerSubscription = this.router.events.subscribe((navigationEvent: NavigationEnd) => {
try {
if (navigationEvent instanceof NavigationEnd) {
this.unlistenScroll();
if (!navigationEvent.urlAfterRedirects) {
return;
}
......@@ -51,7 +49,12 @@ export class SignupOnScrollModal {
url = url.substr(1);
}
let fragments = url.replace(/\//g, ';').split(';');
const fragments = url.replace(/\//g, ';').split(';');
// Remove referrer param from register fragment
if (fragments[0].substr(0, 8) === 'register') {
fragments[0] = 'register';
}
this.route = navigationEvent.urlAfterRedirects;
......@@ -69,7 +72,6 @@ export class SignupOnScrollModal {
this.open = false;
else
this.open = true;
this.scroll.unListen(this.scroll_listener);
}
}, 100);
}
......@@ -82,5 +84,12 @@ export class SignupOnScrollModal {
unListen() {
this.routerSubscription.unsubscribe();
this.unlistenScroll();
}
private unlistenScroll() {
if (this.scroll_listener) {
this.scroll.unListen(this.scroll_listener);
}
}
}
......@@ -17,7 +17,7 @@
<!-- referral ping -->
<ng-template ngSwitchCase="referral_ping">
<a [routerLink]="['/wallet/tokens/contributions']">
<p i18n="@@NOTIFICATIONS__NOTIFICATION__REFERRAL_PING">Free tokens are waiting for you! Once you join the rewards program by setting up your Minds wallet, you and <span class="pseudo-link mdl-color-text--blue-grey-400">{{notification.fromObj.name}}</span> will both earn tokens for your referral</p>
<p i18n="@@NOTIFICATIONS__NOTIFICATION__REFERRAL_PING">Free tokens are waiting for you! Once you join the rewards program by setting up your Minds wallet, both you and <span class="pseudo-link mdl-color-text--blue-grey-400">{{notification.fromObj.name}}</span> will earn tokens for your referral</p>
</a>
</ng-template>
......@@ -123,13 +123,13 @@
[routerLink]="['/media', notification.entityObj.guid]"
[queryParams]="{ focusedCommentUrn: notification.params?.focusedCommentUrn }">
<p>
<ng-container i18n="@@NOTIFICATIONS__NOTIFICATION__COMMENTED_ON"
<ng-container i18n="@@NOTIFICATIONS__NOTIFICATION__COMMENTED_ON"
*ngIf="!notification.params?.is_reply">
{{notification.fromObj.name}} commented on
</ng-container>
<ng-container i18n="@@NOTIFICATIONS__NOTIFICATION__REPLIED_TO"
<ng-container i18n="@@NOTIFICATIONS__NOTIFICATION__REPLIED_TO"
*ngIf="notification.params?.is_reply">
{{notification.fromObj.name}} replied to your comment on
{{notification.fromObj.name}} replied to your comment on
</ng-container>
<span class="pseudo-link mdl-color-text--blue-grey-400" *ngIf="notification.entityObj.title" >{{notification.entityObj.title | excerpt}}</span>
<span class="pseudo-link mdl-color-text--blue-grey-400" *ngIf="notification.entityObj.owner_guid != session.getLoggedInUser().guid && !notification.entityObj.title" i18n="object belonging to user@@NOTIFICATIONS__NOTIFICATION__OTHER_OBJECT">{{notification.entityObj.ownerObj.name}}'s {{notification.entityObj.subtype}}</span>
......@@ -146,9 +146,9 @@
[routerLink]="['/groups/profile', notification.entityObj.guid]"
[queryParams]="{ focusedCommentUrn: notification.params?.focusedCommentUrn }">
<p>
<ng-container i18n="@@NOTIFICATIONS__NOTIFICATION__REPLIED_TO_GROUP_CONVERSATION"
<ng-container i18n="@@NOTIFICATIONS__NOTIFICATION__REPLIED_TO_GROUP_CONVERSATION"
*ngIf="notification.params?.is_reply">
{{notification.fromObj.name}} replied to your message in
{{notification.fromObj.name}} replied to your message in
</ng-container>
<span class="pseudo-link mdl-color-text--blue-grey-400" *ngIf="notification.entityObj.name" >{{notification.entityObj.name | excerpt}}</span>'s conversation
</p>
......@@ -185,7 +185,7 @@
</a>
<ng-container *ngIf="notification.entityObj.type == 'comment'">
<a
<a
[routerLink]="['/newsfeed', notification.entityObj.entity_guid]"
[queryParams]="{ focusedCommentUrn: notification.params?.focusedCommentUrn }"
*ngIf="notification.params?.parent?.type != 'group'"
......@@ -199,8 +199,8 @@
</p>
</a>
<a
[routerLink]="['/groups/profile', notification.entityObj.entity_guid]"
<a
[routerLink]="['/groups/profile', notification.entityObj.entity_guid]"
[queryParams]="{ focusedCommentUrn: notification.params?.focusedCommentUrn }"
*ngIf="notification.params?.parent?.type == 'group'"
>
......@@ -311,7 +311,7 @@
<p i18n="@@NOTIFICATIONS__NOTIFICATION__TAG__IN_A_COMMENT">{{notification.fromObj.name}} tagged you in a comment</p>
</a>
<a
<a
[routerLink]="['/groups/profile', notification.params?.parent?.guid, 'feed']"
[queryParams]="{ focusedCommentUrn: notification.params?.focusedCommentUrn }"
*ngIf="notification.params?.parent?.type == 'group'"
......@@ -518,7 +518,7 @@
<!-- Programs (accepted) -->
<ng-template ngSwitchCase="program_accepted">
<a routerLink="/wallet">
<p>
<p>
<ng-container i18n="@@NOTIFICATIONS__NOTIFICATION__PROGRAM_ACCEPTED">Your application for {{ notification.params.program }} program was approved. Congratulations!</ng-container>
</p>
</a>
......@@ -527,7 +527,7 @@
<!-- Channel monetized -->
<ng-template ngSwitchCase="channel_monetized">
<a routerLink="/wallet">
<p>
<p>
<ng-container i18n="@@NOTIFICATIONS__NOTIFICATION__CHANNEL_MONETIZED">Your channel is now monetized. Congratulations!</ng-container>
</p>
</a>
......@@ -536,7 +536,7 @@
<!-- Programs (declined) -->
<ng-template ngSwitchCase="program_declined">
<a routerLink="/wallet">
<p>
<p>
<ng-container i18n="@@NOTIFICATIONS__NOTIFICATION__PROGRAM_DECLINED">Your application for {{ notification.params.program }} program was declined.</ng-container>
</p>
</a>
......@@ -655,7 +655,7 @@
<!-- report actioned notification -->
<ng-template ngSwitchCase="report_actioned">
<div *ngIf="notification.entityObj">
<!-- Activity -->
<a *ngIf="notification.entityObj.type == 'activity'"
target="_blank"
......@@ -683,7 +683,7 @@
<ng-container i18n="@@NOTIFICATIONS__NOTIFICATION__ERROR_VIEWING">There was an error viewing this notification.</ng-container>
</p>
</a>
</div>
</div>
</ng-template>
<ng-template ngSwitchCase="contributions"></ng-template>
......
......@@ -135,6 +135,16 @@ m-channel--onboarding {
}
}
.m-channelOnboarding__rewardsReferralNotice {
border-radius: 8px;
padding: 16px;
@include m-theme(){
background-color: themed($m-blue-light);
color: white;
}
}
.m-channelOnboardingSlide__component {
display: flex;
......
import { ChangeDetectorRef, Component, EventEmitter, Input, Output } from '@angular/core';
import { ChangeDetectorRef, Component, EventEmitter, Input, Output, OnInit, OnDestroy } from '@angular/core';
import { Client } from "../../../../services/api/client";
import { Session } from "../../../../services/session";
import { Subscription } from 'rxjs';
import { ActivatedRoute } from '@angular/router';
@Component({
selector: 'm-channel--onboarding--rewards',
template: `
<div class="m-channelOnboarding__slide">
<h2>Earn tokens for your activity</h2>
<p *ngIf="referrer" class="m-channelOnboarding__rewardsReferralNotice">
You're about to earn extra free tokens for joining the rewards program with {{referrer}}'s referral link!
</p>
<p>
Tokens can be used to support other channels or boost your content for additional views (1 token = 1,000 views).
</p>
......@@ -69,7 +74,7 @@ import { Session } from "../../../../services/session";
`
})
export class TokenRewardsOnboardingComponent {
export class TokenRewardsOnboardingComponent implements OnInit, OnDestroy {
static items = ['tokens_verification'];
static canSkip: boolean = true;
......@@ -83,14 +88,27 @@ export class TokenRewardsOnboardingComponent {
confirming: boolean;
error: string;
secret: string;
referrer: string;
user: any;
paramsSubscription: Subscription;
constructor(
protected client: Client,
protected cd: ChangeDetectorRef,
protected session: Session,
private route: ActivatedRoute,
) {
}
ngOnInit() {
// this.paramsSubscription = this.route.queryParams.subscribe((params) => {
// if (params['referrer']) {
// this.referrer = params['referrer'];
// }
// });
// };
}
async verify() {
this.inProgress = true;
......@@ -137,4 +155,10 @@ export class TokenRewardsOnboardingComponent {
join() {
this.onClose.emit();
}
ngOnDestroy() {
// if (this.paramsSubscription) {
// this.paramsSubscription.unsubscribe();
// };
}
}
......@@ -12,7 +12,7 @@
<i class="material-icons">settings</i>
<span i18n="@@SETTINGS__NAVIGATION__GENERAL_NAV">General</span>
</a>
<a class="m-page--sidebar--navigation--item"
routerLink="/settings/emails"
routerLinkActive="m-page--sidebar--navigation--item-active"
......@@ -28,7 +28,7 @@
<i class="ion-icon ion-flash"></i>
<span i18n="@@SETTINGS__NAVIGATION__GENERAL_NAV">Wire</span>
</a>
<a class="m-page--sidebar--navigation--item"
routerLink="/settings/disable"
routerLinkActive="m-page--sidebar--navigation--item-active"
......@@ -36,7 +36,7 @@
<i class="material-icons">warning</i>
<span i18n="@@SETTINGS__NAVIGATION__DISABLE_NAV">Deactivate Channel</span>
</a>
<a class="m-page--sidebar--navigation--item"
routerLink="/settings/twoFactor"
routerLinkActive="m-page--sidebar--navigation--item-active"
......@@ -78,14 +78,14 @@
</a>
<!-- <a class="m-page--sidebar--navigation--item"
(click)="openHashtagsSelector()"
(click)="openHashtagsSelector()"
>
<i class="material-icons">label</i>
<span i18n="@@M__ACTION__SUGGESTED_HASHTAGS">Suggested Hashtags</span>
</a> -->
<a class="m-page--sidebar--navigation--item"
(click)="openReferralsModal()"
(click)="openReferralsModal()"
>
<i class="material-icons">people</i>
<span i18n="@@M__ACTION__REFERRAL_LINK">Referrals</span>
......@@ -96,7 +96,7 @@
<div class="m-page--main">
<router-outlet></router-outlet>
<p class="m-settings--created-date">
<span i18n="@@MINDS__SETTINGS__ACCOUNT_TIMESTAMP">Account created on:</span>
<span i18n="@@MINDS__SETTINGS__ACCOUNT_TIMESTAMP">Account created on:</span>
{{ account_time_created * 1000 | date: 'medium' }}
</p>
</div>
......
......@@ -19,11 +19,11 @@
The day the referral created an account with Minds
</m-tooltip>
</div>
<div class="m-referrals-dashboard__cell m-referrals-dashboard__joinCol">
<div class="m-referrals-dashboard__cell m-referrals-dashboard__rewardsCol">
<span i18n="@@M_REFERRALS_DASHBOARD__HEADER_REWARDS_SIGNUP">Rewards Signup</span>
<m-tooltip icon="help" i18n="@@M_REFERRALS_DASHBOARD__REWARDS_SIGNUP_TOOLTIP">
The day the referral sets up their wallet (and you are rewarded with tokens). Hit 'ping' to send a pending referral
a notification to let them know they ought to sign up for the rewards program.
The day the referral sets up their wallet (and you are rewarded with tokens). Click 'ping' to send a pending referral
a notification to let them know they ought to join the rewards program.
</m-tooltip>
</div>
</div>
......@@ -47,24 +47,43 @@
<div class="m-referrals-dashboard__cell m-referrals-dashboard__registerCol">
<span>{{ referral.register_timestamp | date }}</span>
</div>
<div class="m-referrals-dashboard__cell m-referrals-dashboard__joinCol">
<div class="m-referrals-dashboard__cell m-referrals-dashboard__rewardsCol">
<span *ngIf="referral.state === 'complete'; else ping"
class="m-referrals-dashboard__joinDate">{{ referral.join_timestamp | date:'mediumDate' }}</span>
class="m-referrals-dashboard__rewardsDate">{{ referral.join_timestamp | date:'mediumDate' }}</span>
</div>
<ng-template #ping>
<div class="m-referrals-dashboard__pingButton"
(click)="triggerNotification(referral)"
<div class="m-referrals-dashboard__pingButtonContainer"
>
<button class="m-btn m-btn--slim m-btn--with-icon" [disabled]="!referral.pingable">
<i class="material-icons">notifications_active</i>
<span>ping</span>
</button>
<m-tooltip [anchor]="top">
<div m-tooltip--anchor class="m-referrals-dashboard__pingTooltip">
<div>
<button class="m-btn m-btn--slim m-btn--with-icon"
[ngClass]="{'m-referrals-dashboard__pingButton--disabled': !referral.pingable}"
(click)="triggerNotification(referral)"
>
<i *ngIf="referral.pingable" class="m-referrals-dashboard__pingIcon material-icons" [ngClass]="{'m-referrals-dashboard__pingIcon--wiggle': referral.pingInProgress}">notifications_active</i>
<i *ngIf="!referral.pingable" class="m-referrals-dashboard__pingIcon material-icons">notifications</i>
<span>ping</span>
</button>
</div>
</div>
<ng-container *ngIf="referral.pingable">
Send {{ referral.prospect.username }} a notification to let them know they ought to join the rewards program
</ng-container>
<ng-container *ngIf="!referral.pingable && !referral.pingRecentlySent">
You can only ping once every 7 days
</ng-container>
<ng-container *ngIf="!referral.pingable && referral.pingRecentlySent">
Ping notification sent!
</ng-container>
</m-tooltip>
</div>
</ng-template>
</div>
</ng-container>
<div *ngIf="showNotice" class="m-referrals-dashboard__row m-referrals-dashboard__footer m-referrals-dashboard__notice">
<div *ngIf="noResults" class="m-referrals-dashboard__row m-referrals-dashboard__footer m-referrals-dashboard__notice">
<div class="m-referrals-dashboard__cell" i18n="@@M_REFERRALS_DASHBOARD__NOTICE">You don't have any referrals yet.</div>
</div>
<div *ngIf="!fewerResultsThanLimit" class="m-referrals-dashboard__row m-referrals-dashboard__footer">
......
......@@ -16,14 +16,14 @@
width: 100%;
}
m-tooltip i {
m-tooltip i:not(.m-referrals-dashboard__pingIcon) {
font-size: 12px;
margin-left: 1px;
@include m-theme() {
color: themed($m-grey-500);
}
}
.m-referrals-dashboard__row {
display: flex;
justify-content: space-between;
......@@ -37,6 +37,13 @@
color: themed($m-grey-500) !important;
}
}
.m-referrals-dashboard__rewardsCol {
.m-tooltip--bubble {
right: 2px;
}
}
}
&.m-referrals-dashboard__dataRow {
font-size: 13px;
......@@ -54,8 +61,9 @@
white-space: nowrap;
height: 32px;
}
.m-referrals-dashboard__userCol {
min-width: 130px;
min-width: 130px;
flex: 6 2 0;
padding-left: $minds-padding * 2;
......@@ -92,16 +100,14 @@
min-width: 50px;
flex: 3 4 0;
}
.m-referrals-dashboard__joinCol {
.m-referrals-dashboard__rewardsCol {
min-width: 80px;
flex: 4 2 0;
padding-right: $minds-padding * 2;
overflow: visible;
white-space: normal;
.m-tooltip--bubble {
right: 2px;
}
.m-referrals-dashboard__pingButton {
.m-referrals-dashboard__pingButtonContainer {
display: flex;
button {
......@@ -124,13 +130,18 @@
color: themed($m-blue-light);
}
}
&:disabled {
&.m-referrals-dashboard__pingButton--disabled {
cursor: default;
@include m-theme() {
border-color: rgba(themed($m-grey-200),0.7);
color: rgba(themed($m-grey-200),0.7);
}
}
.m-referrals-dashboard__pingIcon {
font-size: 18px;
}
}
}
}
......@@ -139,7 +150,7 @@
justify-content: center;
margin-top: $minds-padding;
padding-bottom: $minds-padding * 2;
&.m-referrals-dashboard__notice {
@include m-theme() {
color: themed($m-grey-500);
......@@ -147,7 +158,7 @@
}
}
.m-referrals-dashboard__joinPendingIcon {
.m-referrals-dashboard__rewardsPendingIcon {
display: none;
margin-left: 12px;
> i {
......@@ -156,7 +167,7 @@
}
}
}
@media screen and (max-width: 910px) {
.m-referrals-dashboard__row.m-referrals-dashboard__headerRow {
......@@ -165,24 +176,24 @@
max-width: 35px;
}
.m-referrals-dashboard__registerCol,
.m-referrals-dashboard__joinCol {
.m-referrals-dashboard__rewardsCol {
align-items: flex-start !important;
}
.m-referrals-dashboard__joinCol span {
.m-referrals-dashboard__rewardsCol span {
max-width: 46px;
}
}
.m-referrals-dashboard__cell.m-referrals-dashboard__joinCol {
.m-referrals-dashboard__cell.m-referrals-dashboard__rewardsCol {
flex: 2 3 0;
.m-referrals-dashboard__pingButton button {
.m-referrals-dashboard__pingButtonContainer button {
padding: 8px;
span {
display: none;
}
}
}
}
}
@media screen and (max-width: 800px) {
.m-referrals-dashboard__cell.m-referrals-dashboard__registerCol {
......@@ -194,10 +205,21 @@
.m-referrals-dashboard__statusCol {
min-width: 60px;
}
.m-referrals-dashboard__joinCol {
.m-referrals-dashboard__rewardsCol {
max-width: 75px;
}
}
}
}
.m-referrals-dashboard__pingIcon--wiggle {
animation: wiggle 0.2s infinite;
}
@keyframes wiggle {
0% { transform: rotate(0deg); }
25% { transform: rotate(-10deg); }
50% { transform: rotate(10deg); }
75% { transform: rotate(-10deg); }
100% { transform: rotate(0deg); }
}
import { Component, OnInit } from '@angular/core';
import { Component, OnInit, OnDestroy } from '@angular/core';
import { Client } from '../../../../../services/api/client';
@Component({
......@@ -6,16 +6,16 @@ import { Client } from '../../../../../services/api/client';
templateUrl: 'dashboard.component.html'
})
export class ReferralsDashboardComponent implements OnInit {
export class ReferralsDashboardComponent implements OnInit, OnDestroy {
minds = window.Minds;
referrals: Array<any> = [];
offset: string = '';
moreData: boolean = true;
inProgress: boolean = false;
showNotice: boolean = false;
limit = 24;
fewerResultsThanLimit: boolean = false;
limit = 12;
moreData = true;
inProgress = false;
noResults = false;
fewerResultsThanLimit = false;
constructor(public client: Client) {
}
......@@ -24,30 +24,40 @@ export class ReferralsDashboardComponent implements OnInit {
this.load(true);
}
load(refresh: boolean = false) {
// Gets a list of the current user's referral prospects and displays the list as a table
// Note: a referral is 'pending' until the prospect joins rewards program
load(init: boolean = false) {
if (this.inProgress) {
return;
}
this.inProgress = true;
if (refresh) {
if (init) {
this.referrals = [];
this.moreData = true;
}
this.client.get('api/v2/referrals', {offset: this.offset})
this.client.get(`api/v2/referrals`, {limit: this.limit, offset: this.offset})
.then((response: any) => {
// Response is an array of current user's referrals (see `Referral.php`)
if (!response.referrals || response.referrals.length === 0 ) {
this.inProgress = false;
// Hide infinite scroll's 'nothing more to load' notice
// if initial load length is less than response limit
if (init && response.referrals.length < this.limit) {
this.fewerResultsThanLimit = true;
this.moreData = false;
this.showNotice = true;
return;
}
if (refresh && response.referrals.length < this.limit) {
this.fewerResultsThanLimit = true;
if (!response.referrals.length) {
this.inProgress = false;
this.moreData = false;
// If no results on initial load, show notice instead of empty table
if (init) {
this.noResults = true;
}
return;
}
if (response['load-next']) {
......@@ -56,8 +66,6 @@ export class ReferralsDashboardComponent implements OnInit {
this.moreData = false;
}
console.log(response.referrals);
this.referrals.push(...response.referrals);
this.inProgress = false;
})
......@@ -67,24 +75,45 @@ export class ReferralsDashboardComponent implements OnInit {
});
}
// If the prospect hasn't joined rewards yet, the 'Rewards Signup' date column
// will display a 'ping' notification button instead
triggerNotification(referral: any) {
console.log(referral);
if (!referral.pingable) {
// Don't trigger a notification if insufficient time has elapsed since last ping
// Note: waiting period duration is set in `Referral.php`
if (!referral.pingable || referral.pingInProgress) {
return;
}
referral.pingable = false;
referral.pingInProgress = true;
// Trigger the ping notification
this.client.put(`api/v2/referrals/` + referral.prospect.guid)
.then((response: any) => {
if (response.done) {
console.log(response);
referral.pingable = false;
referral.pingRecentlySent = true;
referral.pingInProgress = false;
// display 'ping sent!' on tooltip for 3sec after it's clicked
referral.timeout = setTimeout(() => {
referral.pingRecentlySent = false;
}, 3000);
return;
}
throw new Error('Error: ping incomplete');
})
.catch(e => {
// do something?
// Do something?
});
}
}
ngOnDestroy(){
// go through each referral and kill timeout if it exists?
// if (this.timeout) {
// clearTimeout(this.timeout);
// }
}
}
......@@ -4,15 +4,15 @@
i18n="@@M_REFERRALS__LINKS_MODAL_HEADER" >
Earn tokens for referring your friends
</h3>
<p class="m-referrals-links__modalHide"
<p class="m-referrals-links__modalHide"
i18n="@@M_REFERRALS__LINKS_REGISTER_URL_DESC">
Send this link to your friends to earn tokens for referrals
</p>
<div class="m-referrals-links__copyableLink m-border" [class.focused]="registerUrlFocused"
(click)="applyFocus(registerUrlEl, 'registerUrl')"
>
<input class="m-referrals-links__copyableLinkText"
(click)="applyFocus(registerUrlEl, 'registerUrl')"
>
<input class="m-referrals-links__copyableLinkText"
[class.recentlyCopied]="registerUrlRecentlyCopied"
readonly tabindex="-1"
(focus)="registerUrlFocused"
......@@ -26,9 +26,9 @@
<p i18n="@@M_REFERRALS__LINKS_REFERRER_PARAM_DESC">You can also get referrals by adding this code to the end of any Minds link you share</p>
<div class="m-referrals-links__copyableLink m-border" [class.focused]="referrerParamFocused"
(click)="applyFocus(referrerParamEl, 'referrerParam')"
(click)="applyFocus(referrerParamEl, 'referrerParam')"
>
<input class="m-referrals-links__copyableLinkText"
<input class="m-referrals-links__copyableLinkText"
[class.recentlyCopied]="referrerParamRecentlyCopied"
readonly tabindex="-1"
(focus)="referrerParamFocused"
......@@ -48,18 +48,18 @@
(click)="openTwitter()"
>
<svg viewBox="0 0 24 24">
<path d="M24 4.557c-.883.392-1.832.656-2.828.775 1.017-.609 1.798-1.574 2.165-2.724-.951.564-2.005.974-3.127 1.195-.897-.957-2.178-1.555-3.594-1.555-3.179 0-5.515 2.966-4.797 6.045-4.091-.205-7.719-2.165-10.148-5.144-1.29 2.213-.669 5.108 1.523 6.574-.806-.026-1.566-.247-2.229-.616-.054 2.281 1.581 4.415 3.949 4.89-.693.188-1.452.232-2.224.084.626 1.956 2.444 3.379 4.6 3.419-2.07 1.623-4.678 2.348-7.29 2.04 2.179 1.397 4.768 2.212 7.548 2.212 9.142 0 14.307-7.721 13.995-14.646.962-.695 1.797-1.562 2.457-2.549z" fill-rule="evenodd"></path>
<path d="M24 4.557c-.883.392-1.832.656-2.828.775 1.017-.609 1.798-1.574 2.165-2.724-.951.564-2.005.974-3.127 1.195-.897-.957-2.178-1.555-3.594-1.555-3.179 0-5.515 2.966-4.797 6.045-4.091-.205-7.719-2.165-10.148-5.144-1.29 2.213-.669 5.108 1.523 6.574-.806-.026-1.566-.247-2.229-.616-.054 2.281 1.581 4.415 3.949 4.89-.693.188-1.452.232-2.224.084.626 1.956 2.444 3.379 4.6 3.419-2.07 1.623-4.678 2.348-7.29 2.04 2.179 1.397 4.768 2.212 7.548 2.212 9.142 0 14.307-7.721 13.995-14.646.962-.695 1.797-1.562 2.457-2.549z" fill-rule="evenodd"></path>
</svg>
</button>
</button>
<button i18n-title="@@M_REFERRALS__SHARE_BUTTON_FACEBOOK" title="Facebook" class="m-referrals-links__shareButton m-referrals-links__shareButton--facebook"
(click)="openFacebook()"
>
<svg viewBox="0 0 32 32">
<path d="m8 14.41v-4.17c0-.42.35-.81.77-.81h2.52v-2.08c0-4.84 2.48-7.31 7.42-7.35 1.65 0 3.22.21 4.69.64.46.14.63.42.6.88l-.56 4.06c-.04.18-.14.35-.32.53-.21.11-.42.18-.63.14-.88-.25-1.78-.35-2.8-.35-1.4 0-1.61.28-1.61 1.73v1.8h4.52c.42 0 .81.42.81.88l-.35 4.17c0 .42-.35.71-.77.71h-4.21v16c0 .42-.35.81-.77.81h-5.21c-.42 0-.8-.39-.8-.81v-16h-2.52a.78.78 0 0 1 -.78-.77" fill-rule="evenodd"></path>
</svg>
</button>
</button>
<button i18n-title="@@M_REFERRALS__SHARE_BUTTON_MESSENGER" title="Messenger" class="m-referrals-links__shareButton m-referrals-links__shareButton--messenger"
*ngIf="isMobileOrTablet()"
(click)="openMessenger()"
......@@ -68,15 +68,16 @@
<path d="m17.59 19.95-4.07-4.35-7.95 4.35 8.74-9.28 4.17 4.35 7.85-4.35zm-1.59-19.95c-8.84 0-16 6.63-16 14.82 0 4.66 2.33 8.82 5.96 11.54v5.64l5.45-2.99a17.24 17.24 0 0 0 4.59.62c8.84 0 16-6.63 16-14.82 0-8.18-7.16-14.81-16-14.80z" fill-rule="evenodd"></path>
</svg>
</button>
<button i18n-title="@@M_REFERRALS__SHARE_BUTTON_Whatsapp" title="Whatsapp" class="m-referrals-links__shareButton m-referrals-links__shareButton--whatsapp"
(click)="openWhatsapp"
*ngIf="isMobileOrTablet()"
(click)="openWhatsapp"
>
<svg viewBox="0 0 32 32">
<path d="m23.37 21.18c-.31.87-1.8 1.66-2.52 1.77-.65.1-1.46.14-2.35-.15a21.13 21.13 0 0 1 -2.13-.78c-3.74-1.61-6.19-5.36-6.38-5.61s-1.52-2.01-1.52-3.84.97-2.73 1.31-3.1.75-.46 1-.46.5 0 .71.01c.23.01.54-.09.84.64.31.75 1.06 2.57 1.15 2.76.09.18.16.4.03.65-.12.25-.19.4-.37.62-.19.22-.39.48-.56.65-.19.19-.38.39-.16.76s.97 1.59 2.08 2.58c1.43 1.26 2.63 1.66 3 1.84.37.19.59.16.81-.09s.93-1.09 1.18-1.46.5-.31.84-.19 2.18 1.02 2.55 1.21.62.28.72.43c.09.16.09.9-.22 1.77m3.26-15.82a14.88 14.88 0 0 0 -10.57-4.36c-8.23 0-14.94 6.67-14.94 14.87a14.78 14.78 0 0 0 1.99 7.43l-2.12 7.7 7.92-2.07a14.98 14.98 0 0 0 7.14 1.81h.01c8.23 0 14.93-6.67 14.94-14.87a14.74 14.74 0 0 0 -4.37-10.53" fill-rule="evenodd"></path>
</svg>
</button>
</button>
<button i18n-title="@@M_REFERRALS__SHARE_BUTTON_SMS" title="SMS" class="m-referrals-links__shareButton m-referrals-links__shareButton--sms"
*ngIf="isMobile()"
(click)="openSMS()"
......@@ -85,15 +86,15 @@
<path d="m23.5 16.5a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3m-7.5 0a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3m-7.5 0a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3m7.5-14.5c-8.82 0-16 5.94-16 13.32 0 2.9 1.12 5.64 3.14 7.92l-.43 6.23a.5.5 0 0 0 .69.5l6.08-2.51c1.99.78 4.21 1.19 6.52 1.19 8.82 0 16-5.94 16-13.32s-7.18-13.33-16-13.32" fill-rule="evenodd"></path>
</svg>
</button>
<button i18n-title="@@M_REFERRALS__SHARE_BUTTON_EMAIL" title="Email" class="m-referrals-links__shareButton m-referrals-links__shareButton--email"
(click)= "openEmail()"
>
<svg viewBox="0 0 32 32">
<path d="m17.42 18.99c.14-.12.86-.76 2.08-1.86l10.43 8.66h-27.76l10.35-8.67c1.24 1.1 1.98 1.74 2.12 1.85.83.65 1.93.63 2.78.02m11.89-10.67-4.83 4.34c-1.51 1.35-2.8 2.51-3.86 3.46l10.35 8.6c.01.01.01.02.02.03v-17.81c0-.04-.02-.07-.02-.11a3.73 3.73 0 0 0 -.08.07zm-25.19-.7a5347.74 5347.74 0 0 0 4.69 4.19c3.94 3.52 6.51 5.79 6.75 5.97a.76.76 0 0 0 .92.03c.21-.18 2.82-2.52 7.01-6.28l4.82-4.33 1.35-1.21h-27.37l.29.26zm3.66 5.28a4436.65 4436.65 0 0 1 -4.66-4.16c-.56-.5-1.07-.96-1.53-1.37l-.57-.51c0 .03-.01.05-.01.07v17.89l10.38-8.7c-1-.89-2.2-1.95-3.61-3.20" fill-rule="evenodd"></path>
</svg>
</button>
</div>
</button>
</div>
</div>
<div class="m-referrals-links__modalShow m-referrals-links__modalButton">
<a [routerLink]="['/wallet/tokens/referrals']" (click)="closeModal()">
......@@ -102,17 +103,4 @@
</button>
</a>
</div>
<div class="m-referrals-links__modalHide whatsappTests">
<h3>TEMPORARY WHATSAPP TESTS</h3>
<button (click)="openWindowWhatsapp('https://web.whatsapp.com/send?text=' + encodedRegisterMessageAndUrl)">
web
</button>
<button (click)="openWindowWhatsapp('https://api.whatsapp.com/send?text=' + encodedRegisterMessageAndUrl)">
api
</button>
<button (click)="openWindowWhatsapp('https://wa.me/?text=' + encodedRegisterMessageAndUrl)">
wa.me
</button>
</div>
</div>
\ No newline at end of file
// display additional action button and header when displayed as a modal
// display additional action button and header when displayed as a modal
.m-overlay-modal--referrals-links .m-referrals-links {
.m-referrals-links__modalShow {
display: block;
&.m-referrals-links__modalButton {
margin-top: $minds-padding * 3;
}
&:h3 {
margin-bottom: $minds-padding * 2;
margin-top: $minds-padding * 2;
}
}
.m-referrals-links__modalHide, //OJMTODO REMOVE THIS after whatsapp tests
.m-referrals-links__copyableLinks .m-referrals-links__modalHide {
display:none;
}
}
.m-referrals-links {
.m-referrals-links__modalShow {
display: none;
}
@include m-theme() {
color: themed($m-grey-800);
}
......@@ -36,7 +32,7 @@
h3 {
font-size: 28px;
font-weight: 600;
margin: 0 50px 0 0;
margin: 0 50px 26px 0;
@include m-theme() {
color: themed($m-grey-800);
}
......@@ -113,11 +109,11 @@
height: 32px;
width: 32px;
border: none;
margin: 12px 24px 12px 0;
margin: 12px 18px 12px 0;
position: relative;
svg {
position: absolute;
position: absolute;
top: calc(50% - 9px);
left: calc(50% - 9px);
height: 18px;
......@@ -143,7 +139,7 @@
&:focus {
outline: none;
}
}
}
......
......@@ -17,7 +17,6 @@ export class ReferralsLinksComponent implements OnInit, OnDestroy {
encodedRegisterUrl = '';
registerMessage = '';
encodedRegisterMessage = '';
encodedRegisterMessageAndUrl = '';
registerUrlTimeout;
referrerParamTimeout;
......@@ -38,33 +37,25 @@ export class ReferralsLinksComponent implements OnInit, OnDestroy {
this.registerUrl = window.Minds.site_url + 'register' + this.referrerParam;
this.encodedRegisterUrl = encodeURI(window.Minds.site_url) + encodeURIComponent('register' + this.referrerParam);
this.encodedRegisterMessage = 'Join%20me%20on%20Minds%20%f0%9f%92%a1%20';
this.encodedRegisterMessageAndUrl = this.encodedRegisterMessage + this.encodedRegisterUrl;
}
// Used for Facebook Messenger share button
// Only show Messenger/Whatsapp share buttons if mobile or tablet
isMobileOrTablet() {
return isMobileOrTablet();
}
// Used for SMS share button
// Only show SMS share button if mobile
isMobile() {
return isMobile();
}
// TODOOJM: change this to accommodate different height/widths for diff socials
openWindow(url: string) {
window.open(url, '_blank', 'width=600, height=300, left=80, top=80');
}
// TODOOJM: remove this after testing and adjust whatsapp linkwindow
openWindowWhatsapp(url: string) {
window.open(url, '_blank', 'width=700, height=700, left=80, top=80');
}
openTwitter() {
this.openWindow(
'https://twitter.com/intent/tweet?tw_p=tweetbutton&text=' + this.encodedRegisterMessage + '&url=' + this.encodedRegisterUrl
);
const url = 'https://twitter.com/intent/tweet?tw_p=tweetbutton&text=' + this.encodedRegisterMessage + '&url=' + this.encodedRegisterUrl;
window.open(url, '_blank', 'width=620, height=220, left=80, top=80');
}
openFacebook() {
......@@ -81,9 +72,8 @@ export class ReferralsLinksComponent implements OnInit, OnDestroy {
}
openWhatsapp() {
//TODOOJM: don't use open window here because it's not big enough
this.openWindow(
'https://web.whatsapp.com/send?text=' + this.encodedRegisterMessage + this.encodedRegisterUrl
'https://api.whatsapp.com/send?text=' + this.encodedRegisterMessage + this.encodedRegisterUrl
);
}
......@@ -120,7 +110,7 @@ export class ReferralsLinksComponent implements OnInit, OnDestroy {
}
}
// Makes copyable link container appear focused when you click on it
// Make copyable link container appear focused when you click on it
// Receives the inputElement to be focused and linkType ('registerUrl' || 'referrerParam')
applyFocus(inputElement, linkType) {
......
......@@ -4,10 +4,10 @@
</section>
<section class="m-border">
<h3 i18n="@@M_REFERRALS__BLURB_HEADER">How does it work?</h3>
<p class="m-referrals__blurb" i18n="@@M_REFERRALS__BLURB_HEADER"> If your friend signs up for Minds within 24 hours of clicking the link you shared with them, they’ll be added to your pending referrals.
Once they sign up for the rewards program by setting up their Minds wallet, the referral is complete and you’ll get +10 added to your contribution score!
(Hint: check out <a [routerLink]="['/wallet/tokens/101']">Token 101</a> to learn how contribution scores are converted into tokens.)
</p>
<p class="m-referrals__blurb" i18n="@@M_REFERRALS__BLURB_HEADER"> If your friend signs up for Minds within 24 hours of clicking the link you shared with them, they’ll be added to your pending referrals.
Once they sign up for the rewards program by setting up their Minds wallet, the referral is complete and you’ll <span>both</span> get +50 added to your contribution scores!
(Hint: check out <a [routerLink]="['/wallet/tokens/101']">Token 101</a> to learn how contribution scores are converted into tokens)
</p>
</section>
<section class="m-border" style="min-width: 300px">
<m-referrals--dashboard></m-referrals--dashboard>
......
......@@ -6,7 +6,7 @@ m-referrals {
@include m-theme(){
background-color: themed($m-white);
}
&:not(:last-of-type) {
padding: $minds-padding * 2;
}
......@@ -41,6 +41,10 @@ m-referrals {
.m-referrals__blurb {
padding-top: $minds-padding;
span {
font-style: italic;
}
}
}
}
\ No newline at end of file
......@@ -4,7 +4,6 @@ import { ActivatedRoute, Router } from '@angular/router';
import { Client } from '../../../../services/api/client';
import { Session } from '../../../../services/session';
import { Web3WalletService } from '../../../blockchain/web3-wallet.service';
import { InviteModal } from '../../../modals/invite/invite';
@Component({
moduleId: module.id,
......@@ -179,7 +178,7 @@ export class WalletTokenTransactionsComponent {
if (response) {
this.transactions.push(...(response.transactions || []));
if (response['load-next']) {
this.offset = response['load-next'];
} else {
......
......@@ -226,7 +226,6 @@ m-wire-channel {
.m-wire-channel--call-to-action {
margin-bottom: $minds-margin * 2;
//margin-top: $minds-padding * 2;
> button {
display: flex;
......@@ -255,9 +254,6 @@ m-wire-channel {
transform: scale(1.5);
margin: 0 24px 0 18px;
color: #fff;
// @include m-theme(){
// color: themed($m-white);
// }
}
}
......
......@@ -482,7 +482,7 @@ export class AttachmentService {
this.checkVideoDuration(file).then(duration => {
if (window.Minds.user.plus) {
window.Minds.max_video_length = window.Minds.max_video_length * 2; // Hacky
window.Minds.max_video_length = window.Minds.max_video_length * 3; // Hacky
}
if (duration > window.Minds.max_video_length) {
return reject({ message: 'Error: Video duration exceeds ' + window.Minds.max_video_length / 60 + ' minutes' });
......