A photo manager for VRChat.
1import { invoke } from "@tauri-apps/api/core";
2import { Vars } from "./Vars";
3
4let imagesLoading = 0;
5
6export class Photo{
7 path: string;
8 loaded: boolean = false;
9 loading: boolean = false;
10 metaLoaded: boolean = false;
11 image?: HTMLCanvasElement;
12 imageEl?: HTMLImageElement;
13 width?: number;
14 height?: number;
15 loadingRotate: number = 0;
16 metadata: any;
17
18 frames: number = 0;
19 shown: boolean = false;
20
21 x: number = 0;
22 y: number = 0;
23 scaledWidth?: number;
24 scaledHeight?: number;
25
26 dateString: string;
27 date: Date;
28
29 legacy: boolean = false;
30 index: number = 0;
31
32 public onMetaLoaded: () => void = () => {};
33
34 constructor( path: string, isLegacy: boolean = false, i: number ){
35 this.path = path;
36 this.legacy = isLegacy;
37 this.index = i;
38
39 let split = this.path.split('_');
40
41 if(this.legacy)
42 this.dateString = split[2];
43 else
44 this.dateString = split[1];
45
46 let splitDateString = this.dateString.split('-');
47
48 this.date = new Date();
49
50 this.date.setFullYear(parseInt(splitDateString[0]));
51 this.date.setMonth(parseInt(splitDateString[1]));
52 this.date.setDate(parseInt(splitDateString[2]));
53
54 let resSplit = split[3].split('x');
55
56 let width = parseInt(resSplit[0]);
57 let height = parseInt(resSplit[1]);
58
59 if(!isNaN(width) || !isNaN(height)){
60 this.width = width;
61 this.height = height;
62
63 let scale = Vars.PHOTO_HEIGHT / this.height;
64
65 this.scaledWidth = this.width * scale;
66 this.scaledHeight = Vars.PHOTO_HEIGHT;
67 }
68 }
69
70 loadMeta(){
71 invoke('load_photo_meta', { photo: this.path });
72 }
73
74 loadImage(){
75 if(this.loading || this.loaded || imagesLoading >= Vars.MAX_IMAGE_LOAD)return;
76
77 // this.loadMeta();
78 if(!this.metaLoaded)return this.loadMeta();
79
80 this.loading = true;
81
82 imagesLoading++;
83
84 this.image = document.createElement('canvas');
85
86 this.imageEl = document.createElement('img');
87 this.imageEl.crossOrigin = 'anonymous';
88
89 this.imageEl.src = (window.OS === "windows" ? "http://photo.localhost/" : "photo://localhost/") + this.path + "?downscale";
90
91 this.imageEl.onload = () => {
92 this.image!.width = this.scaledWidth!;
93 this.image!.height = this.scaledHeight!;
94
95 this.image!.getContext('2d')!.drawImage(this.imageEl!, 0, 0, this.scaledWidth!, this.scaledHeight!);
96
97 this.loaded = true;
98 this.loading = false;
99
100 imagesLoading--;
101 }
102 }
103}