Browse Source

Mobile fixes

master
Eduard Kuzmenko 3 years ago
parent
commit
4689a0f22d
  1. 2
      src/components/chat/bubbles.ts
  2. 19
      src/components/chat/contextMenu.ts
  3. 10
      src/components/chat/reactionsMenu.ts
  4. 8
      src/lib/appManagers/appStateManager.ts
  5. 4
      src/scss/partials/_document.scss
  6. 4
      webpack.common.js

2
src/components/chat/bubbles.ts

@ -626,7 +626,7 @@ export default class ChatBubbles {
}); });
} }
attachClickEvent(this.bubblesContainer, this.onBubblesClick, {listenerSetter: this.listenerSetter}); attachClickEvent(this.scrollable.container, this.onBubblesClick, {listenerSetter: this.listenerSetter});
// this.listenerSetter.add(this.bubblesContainer)('click', this.onBubblesClick/* , {capture: true, passive: false} */); // this.listenerSetter.add(this.bubblesContainer)('click', this.onBubblesClick/* , {capture: true, passive: false} */);
if(DEBUG) { if(DEBUG) {

19
src/components/chat/contextMenu.ts

@ -81,12 +81,23 @@ export default class ChatContextMenu {
return; return;
} }
const className = (e.target as HTMLElement).className;
if(!className || !className.includes) return;
chat.log('touchend', e); chat.log('touchend', e);
const good = ['bubble', 'bubble-content-wrapper', 'bubble-content', 'message', 'time', 'inner'].find(c => className.match(new RegExp(c + '($|\\s)'))); const badSelectors = [
'.name',
'.peer-title',
'.reply',
'.document',
'audio-element',
'avatar-element',
'a',
'.bubble-beside-button',
'replies-element',
'[data-saved-from]:not(.bubble)',
'poll-element',
'attachment'
];
let good = !(e.target as HTMLElement).closest(badSelectors.join(', '));
if(good) { if(good) {
cancelEvent(e); cancelEvent(e);
//onContextMenu((e as TouchEvent).changedTouches[0]); //onContextMenu((e as TouchEvent).changedTouches[0]);

10
src/components/chat/reactionsMenu.ts

@ -5,7 +5,7 @@
*/ */
import { IS_TOUCH_SUPPORTED } from "../../environment/touchSupport"; import { IS_TOUCH_SUPPORTED } from "../../environment/touchSupport";
import { IS_SAFARI } from "../../environment/userAgent"; import { IS_MOBILE, IS_SAFARI } from "../../environment/userAgent";
import assumeType from "../../helpers/assumeType"; import assumeType from "../../helpers/assumeType";
import callbackify from "../../helpers/callbackify"; import callbackify from "../../helpers/callbackify";
import { attachClickEvent } from "../../helpers/dom/clickEvent"; import { attachClickEvent } from "../../helpers/dom/clickEvent";
@ -134,6 +134,10 @@ export class ChatReactionsMenu {
}); });
}; };
private canUseAnimations() {
return rootScope.settings.animationsEnabled && !IS_MOBILE;
}
private renderReaction(reaction: AvailableReaction) { private renderReaction(reaction: AvailableReaction) {
const reactionDiv = document.createElement('div'); const reactionDiv = document.createElement('div');
reactionDiv.classList.add(REACTION_CLASS_NAME); reactionDiv.classList.add(REACTION_CLASS_NAME);
@ -145,7 +149,7 @@ export class ChatReactionsMenu {
let selectWrapper: HTMLElement;; let selectWrapper: HTMLElement;;
appearWrapper.classList.add(REACTION_CLASS_NAME + '-appear'); appearWrapper.classList.add(REACTION_CLASS_NAME + '-appear');
if(rootScope.settings.animationsEnabled) { if(this.canUseAnimations()) {
selectWrapper = document.createElement('div'); selectWrapper = document.createElement('div');
selectWrapper.classList.add(REACTION_CLASS_NAME + '-select', 'hide'); selectWrapper.classList.add(REACTION_CLASS_NAME + '-select', 'hide');
} }
@ -172,7 +176,7 @@ export class ChatReactionsMenu {
middleware middleware
}; };
if(!rootScope.settings.animationsEnabled) { if(!this.canUseAnimations()) {
delete options.needFadeIn; delete options.needFadeIn;
delete options.withThumb; delete options.withThumb;

8
src/lib/appManagers/appStateManager.ts

@ -133,8 +133,10 @@ const BACKGROUND_DAY_DESKTOP: Background = {
const BACKGROUND_DAY_MOBILE: Background = { const BACKGROUND_DAY_MOBILE: Background = {
blur: false, blur: false,
slug: '',
color: '#dbddbb,#6ba587,#d5d88d,#88b884', color: '#dbddbb,#6ba587,#d5d88d,#88b884',
highlightningColor: 'hsla(86.4, 43.846153%, 45.117647%, .4)', highlightningColor: 'hsla(86.4, 43.846153%, 45.117647%, .4)',
intensity: 0,
id: '1' id: '1'
}; };
@ -150,9 +152,11 @@ const BACKGROUND_NIGHT_DESKTOP: Background = {
const BACKGROUND_NIGHT_MOBILE: Background = { const BACKGROUND_NIGHT_MOBILE: Background = {
blur: false, blur: false,
slug: '',
color: '#0f0f0f', color: '#0f0f0f',
id: '-1', highlightningColor: 'hsla(0, 0%, 3.82353%, 0.4)',
highlightningColor: 'hsla(0, 0%, 3.82353%, 0.4)' intensity: 0,
id: '-1'
}; };
export const STATE_INIT: State = { export const STATE_INIT: State = {

4
src/scss/partials/_document.scss

@ -50,8 +50,8 @@
border-width: calc(var(--size) / 2); border-width: calc(var(--size) / 2);
border-left-color: rgba(0, 0, 0, .25); border-left-color: rgba(0, 0, 0, .25);
border-bottom-color: rgba(0, 0, 0, .25); border-bottom-color: rgba(0, 0, 0, .25);
border-top-color: #fff; border-top-color: var(--message-background-color);
border-right-color: #fff; border-right-color: var(--message-background-color);
} }
} }

4
webpack.common.js

@ -12,7 +12,7 @@ const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPl
const allowedIPs = ['127.0.0.1']; const allowedIPs = ['127.0.0.1'];
const devMode = process.env.NODE_ENV !== 'production'; const devMode = process.env.NODE_ENV !== 'production';
const useLocal = true; const useLocal = true;
const useLocalNotLocal = false; const useLocalNotLocal = true;
if(devMode) { if(devMode) {
console.log('DEVMODE IS ON!'); console.log('DEVMODE IS ON!');
@ -37,7 +37,7 @@ const opts = {
}; };
const domain = 'yourdomain.com'; const domain = 'yourdomain.com';
const localIp = '192.168.100.167'; const localIp = '10.77.0.84';
const middleware = (req, res, next) => { const middleware = (req, res, next) => {
let IP = ''; let IP = '';

Loading…
Cancel
Save