WIP PWA for Grain
feat: pass current photo focus to comment sheet in timeline
+17
-2
+17
-2
src/components/pages/grain-timeline.js
+17
-2
src/components/pages/grain-timeline.js
···
18
18
_cursor: { state: true },
19
19
_error: { state: true },
20
20
_commentSheetOpen: { state: true },
21
-
_commentGalleryUri: { state: true }
21
+
_commentGalleryUri: { state: true },
22
+
_focusPhotoUri: { state: true },
23
+
_focusPhotoUrl: { state: true }
22
24
};
23
25
24
26
static styles = css`
···
53
55
this._error = null;
54
56
this._commentSheetOpen = false;
55
57
this._commentGalleryUri = '';
58
+
this._focusPhotoUri = null;
59
+
this._focusPhotoUrl = null;
56
60
57
61
// Check cache synchronously to avoid flash
58
62
this.#initFromCache();
···
160
164
}
161
165
162
166
#handleCommentClick(e) {
163
-
const galleryUri = e.target.closest('grain-gallery-card')?.gallery?.uri;
167
+
const card = e.target.closest('grain-gallery-card');
168
+
const galleryUri = card?.gallery?.uri;
164
169
if (!galleryUri) return;
165
170
166
171
if (!auth.isAuthenticated) {
···
171
176
return;
172
177
}
173
178
179
+
// Get current photo from carousel inside the card
180
+
const carousel = card.shadowRoot?.querySelector('grain-image-carousel');
181
+
const currentPhoto = carousel?.getCurrentPhoto();
182
+
174
183
this._commentGalleryUri = galleryUri;
184
+
this._focusPhotoUri = currentPhoto?.uri || null;
185
+
this._focusPhotoUrl = currentPhoto?.url || null;
175
186
this._commentSheetOpen = true;
176
187
}
177
188
178
189
#handleCommentSheetClose() {
179
190
this._commentSheetOpen = false;
180
191
this._commentGalleryUri = '';
192
+
this._focusPhotoUri = null;
193
+
this._focusPhotoUrl = null;
181
194
}
182
195
183
196
render() {
···
208
221
<grain-comment-sheet
209
222
?open=${this._commentSheetOpen}
210
223
galleryUri=${this._commentGalleryUri}
224
+
focusPhotoUri=${this._focusPhotoUri || ''}
225
+
focusPhotoUrl=${this._focusPhotoUrl || ''}
211
226
@close=${this.#handleCommentSheetClose}
212
227
></grain-comment-sheet>
213
228
</grain-feed-layout>