imterah/element-portable
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge pull request #4865 from matrix-org/travis/room-list/default-vis

Browse source 
Improve resizing interactions in the new room list
This commit is contained in:
Travis Ralston 2020-07-01 11:59:54 -06:00 • committed by GitHub
commit 2cd6fae2ce
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 50 additions and 23 deletions
Download patch file Download diff file Expand all files Collapse all files

24
src/stores/room-list/ListLayout.ts
View file

@ -18,9 +18,9 @@ import { TagID } from "./models";
const TILE_HEIGHT_PX = 44;
// the .65 comes from the CSS where the show more button is
// mathematically 65% of a tile when floating.
const RESIZER_BOX_FACTOR = 0.65;
// this comes from the CSS where the show more button is
// mathematically this percent of a tile when floating.
const RESIZER_BOX_FACTOR = 0.78;
interface ISerializedListLayout {
numTiles: number;
@ -85,10 +85,16 @@ export class ListLayout {
}
public get defaultVisibleTiles(): number {
// TODO: Remove dogfood flag: https://github.com/vector-im/riot-web/issues/14231
// TODO: Resolve dogfooding: https://github.com/vector-im/riot-web/issues/14137
const val = Number(localStorage.getItem("mx_dogfood_rl_defTiles") || 4);
return val + RESIZER_BOX_FACTOR;
// 10 is what "feels right", and mostly subject to design's opinion.
return 10 + RESIZER_BOX_FACTOR;
}
public setVisibleTilesWithin(diff: number, maxPossible: number) {
if (this.visibleTiles > maxPossible) {
this.visibleTiles = maxPossible + diff;
} else {
this.visibleTiles += diff;
}
}
public calculateTilesToPixelsMin(maxTiles: number, n: number, possiblePadding: number): number {
@ -122,6 +128,10 @@ export class ListLayout {
return px / this.tileHeight;
}
public reset() {
localStorage.removeItem(this.key);
}
private save() {
localStorage.setItem(this.key, JSON.stringify(this.serialize()));
}

10
src/stores/room-list/RoomListStore2.ts
View file

@ -30,6 +30,7 @@ import { TagWatcher } from "./TagWatcher";
import RoomViewStore from "../RoomViewStore";
import { Algorithm, LIST_UPDATED_EVENT } from "./algorithms/Algorithm";
import { EffectiveMembership, getEffectiveMembership } from "./membership";
import { ListLayout } from "./ListLayout";
interface IState {
tagsEnabled?: boolean;
@ -396,6 +397,15 @@ export class RoomListStore2 extends AsyncStore<ActionPayload> {
this.emit(LISTS_UPDATE_EVENT, this);
}
// Note: this primarily exists for debugging, and isn't really intended to be used by anything.
public async resetLayouts() {
console.warn("Resetting layouts for room list");
for (const tagId of Object.keys(this.orderedLists)) {
new ListLayout(tagId).reset();
}
await this.regenerateAllLists();
}
public addFilter(filter: IFilterCondition): void {
// TODO: Remove debug: https://github.com/vector-im/riot-web/issues/14035
console.log("Adding filter condition:", filter);