|
|
|
@ -1,15 +1,18 @@ |
|
|
|
|
|
|
|
import Button from '../components/button'; |
|
|
|
|
|
|
|
import InputField from '../components/inputField'; |
|
|
|
import { putPreloader } from '../components/misc'; |
|
|
|
import { putPreloader } from '../components/misc'; |
|
|
|
import PopupAvatar from '../components/popups/avatar'; |
|
|
|
import PopupAvatar from '../components/popups/avatar'; |
|
|
|
import appStateManager from '../lib/appManagers/appStateManager'; |
|
|
|
import appStateManager from '../lib/appManagers/appStateManager'; |
|
|
|
//import apiManager from '../lib/mtproto/apiManager';
|
|
|
|
//import apiManager from '../lib/mtproto/apiManager';
|
|
|
|
import apiManager from '../lib/mtproto/mtprotoworker'; |
|
|
|
import apiManager from '../lib/mtproto/mtprotoworker'; |
|
|
|
|
|
|
|
import RichTextProcessor from '../lib/richtextprocessor'; |
|
|
|
import { AuthState } from '../types'; |
|
|
|
import { AuthState } from '../types'; |
|
|
|
import Page from './page'; |
|
|
|
import Page from './page'; |
|
|
|
import pageIm from './pageIm'; |
|
|
|
import pageIm from './pageIm'; |
|
|
|
|
|
|
|
|
|
|
|
let authCode: AuthState.signUp['authCode'] = null; |
|
|
|
let authCode: AuthState.signUp['authCode'] = null; |
|
|
|
|
|
|
|
|
|
|
|
let onFirstMount = () => import('../lib/appManagers/appProfileManager').then(imported => { |
|
|
|
const onFirstMount = () => import('../lib/appManagers/appProfileManager').then(imported => { |
|
|
|
const pageElement = page.pageEl; |
|
|
|
const pageElement = page.pageEl; |
|
|
|
const avatarPreview = pageElement.querySelector('#canvas-avatar') as HTMLCanvasElement; |
|
|
|
const avatarPreview = pageElement.querySelector('#canvas-avatar') as HTMLCanvasElement; |
|
|
|
const appProfileManager = imported.default; |
|
|
|
const appProfileManager = imported.default; |
|
|
|
@ -23,19 +26,18 @@ let onFirstMount = () => import('../lib/appManagers/appProfileManager').then(imp |
|
|
|
|
|
|
|
|
|
|
|
const headerName = pageElement.getElementsByClassName('fullName')[0] as HTMLHeadingElement; |
|
|
|
const headerName = pageElement.getElementsByClassName('fullName')[0] as HTMLHeadingElement; |
|
|
|
|
|
|
|
|
|
|
|
let handleInput = function(this: typeof fieldName, e: Event) { |
|
|
|
const handleInput = (e: Event) => { |
|
|
|
let name = fieldName.value || ''; |
|
|
|
const name = nameInputField.value || ''; |
|
|
|
let lastName = fieldLastName.value || ''; |
|
|
|
const lastName = lastNameInputField.value || ''; |
|
|
|
|
|
|
|
|
|
|
|
let fullName = name || lastName |
|
|
|
const fullName = name || lastName |
|
|
|
? (name + ' ' + lastName).trim() |
|
|
|
? (name + ' ' + lastName).trim() |
|
|
|
: 'Your Name'; |
|
|
|
: 'Your Name'; |
|
|
|
|
|
|
|
|
|
|
|
if(headerName.innerText != fullName) headerName.innerText = fullName; |
|
|
|
if(headerName.innerHTML != fullName) headerName.innerHTML = RichTextProcessor.wrapEmojiText(fullName); |
|
|
|
this.classList.remove('error'); |
|
|
|
|
|
|
|
}; |
|
|
|
}; |
|
|
|
|
|
|
|
|
|
|
|
let sendAvatar = () => new Promise((resolve, reject) => { |
|
|
|
let sendAvatar = () => new Promise<void>((resolve, reject) => { |
|
|
|
if(!uploadAvatar) { |
|
|
|
if(!uploadAvatar) { |
|
|
|
//console.log('User has not selected avatar');
|
|
|
|
//console.log('User has not selected avatar');
|
|
|
|
return resolve(); |
|
|
|
return resolve(); |
|
|
|
@ -49,29 +51,49 @@ let onFirstMount = () => import('../lib/appManagers/appProfileManager').then(imp |
|
|
|
}, reject); |
|
|
|
}, reject); |
|
|
|
}); |
|
|
|
}); |
|
|
|
|
|
|
|
|
|
|
|
const fieldName = document.getElementById('name') as HTMLInputElement; |
|
|
|
const inputWrapper = document.createElement('div'); |
|
|
|
fieldName.addEventListener('input', handleInput); |
|
|
|
inputWrapper.classList.add('input-wrapper'); |
|
|
|
|
|
|
|
|
|
|
|
const fieldLastName = document.getElementById('lastName') as HTMLInputElement; |
|
|
|
const nameInputField = new InputField({ |
|
|
|
fieldLastName.addEventListener('input', handleInput); |
|
|
|
label: 'Name', |
|
|
|
|
|
|
|
maxLength: 70 |
|
|
|
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
|
|
const signUpButton = document.getElementById('signUp') as HTMLButtonElement; |
|
|
|
const lastNameInputField = new InputField({ |
|
|
|
signUpButton.addEventListener('click', function(this: typeof signUpButton, e) { |
|
|
|
label: 'Last Name (optional)', |
|
|
|
this.setAttribute('disabled', 'true'); |
|
|
|
maxLength: 64 |
|
|
|
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const btnSignUp = Button('btn-primary'); |
|
|
|
|
|
|
|
btnSignUp.append('START MESSAGING'); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
inputWrapper.append(nameInputField.container, lastNameInputField.container, btnSignUp); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
headerName.parentElement.append(inputWrapper); |
|
|
|
|
|
|
|
|
|
|
|
if(!fieldName.value.length) { |
|
|
|
nameInputField.input.addEventListener('input', handleInput); |
|
|
|
fieldName.classList.add('error'); |
|
|
|
lastNameInputField.input.addEventListener('input', handleInput); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
btnSignUp.addEventListener('click', function(this: typeof btnSignUp, e) { |
|
|
|
|
|
|
|
if(nameInputField.input.classList.contains('error') || lastNameInputField.input.classList.contains('error')) { |
|
|
|
|
|
|
|
return false; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
if(!nameInputField.value.length) { |
|
|
|
|
|
|
|
nameInputField.input.classList.add('error'); |
|
|
|
return false; |
|
|
|
return false; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
let name = fieldName.value; |
|
|
|
this.setAttribute('disabled', 'true'); |
|
|
|
let lastName = fieldLastName.value; |
|
|
|
|
|
|
|
|
|
|
|
const name = nameInputField.value.trim(); |
|
|
|
|
|
|
|
const lastName = lastNameInputField.value.trim(); |
|
|
|
|
|
|
|
|
|
|
|
let params = { |
|
|
|
const params = { |
|
|
|
'phone_number': authCode.phone_number, |
|
|
|
phone_number: authCode.phone_number, |
|
|
|
'phone_code_hash': authCode.phone_code_hash, |
|
|
|
phone_code_hash: authCode.phone_code_hash, |
|
|
|
'first_name': name, |
|
|
|
first_name: name, |
|
|
|
'last_name': lastName |
|
|
|
last_name: lastName |
|
|
|
}; |
|
|
|
}; |
|
|
|
|
|
|
|
|
|
|
|
//console.log('invoking auth.signUp with params:', params);
|
|
|
|
//console.log('invoking auth.signUp with params:', params);
|
|
|
|
@ -80,7 +102,7 @@ let onFirstMount = () => import('../lib/appManagers/appProfileManager').then(imp |
|
|
|
putPreloader(this); |
|
|
|
putPreloader(this); |
|
|
|
|
|
|
|
|
|
|
|
apiManager.invokeApi('auth.signUp', params) |
|
|
|
apiManager.invokeApi('auth.signUp', params) |
|
|
|
.then((response: any) => { |
|
|
|
.then((response) => { |
|
|
|
//console.log('auth.signUp response:', response);
|
|
|
|
//console.log('auth.signUp response:', response);
|
|
|
|
|
|
|
|
|
|
|
|
switch(response._) { |
|
|
|
switch(response._) { |
|
|
|
|
Eduard Kuzmenko
4 years ago