Jake Vanderwerf
2026-01-01 c06013234d16ab3889bd7fce09f6606b45fd2b9f
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
<?php
if (!defined('ABSPATH')) {
    exit; // Exit if accessed directly
}
if (!current_user_can('can_favourite')) {
    wp_redirect(get_home_url(null, '/dash'));
    exit;
}
 
$user_id = get_current_user_id();
$JVB = JVB();
$favourites = $JVB->routes('favourites');
$counts =$favourites->getFavouriteCounts($user_id, false);
$lists =get_user_meta($user_id, BASE.'favourite_lists', true)?:[];
 
global $types;
global $feed_types;
?>
 
<div class="favourites container">
    <!-- Tab navigation -->
    <div class="tabs" role="tablist">
        <button type="button" class="tab active" data-tab="items" role="tab" aria-selected="true">
            <h2><?= jvbIcon('heart')?>Favourites</h2>
        </button>
        <button type="button" class="tab" data-tab="lists" role="tab" aria-selected="false">
            <h2><?= jvbIcon('list-heart')?>Lists</h2>
        </button>
    </div>
 
    <!-- Favourites Content Tab -->
    <div class="tab-content active" data-tab="items" role="tabpanel">
        <?php if (array_sum($counts) !== 0) { ?>
            <!-- Type filter tabs -->
            <div class="controls">
                <div class="type-filters">
                    <button type="button" class="type-filter active" data-type="all">
                        <?= jvbIcon('infinity'); ?>
                        <span>Everything</span>
                        <span class="count">(<?= array_sum($counts); ?>)</span>
                    </button>
 
                    <?php
                    global $types;
                    $temp = $types;
                    unset($temp[BASE.'news']);
                    foreach ($temp as $type => $options) :
                        $type = str_replace(BASE, '', $type);
 
                        $count = $counts[$type] ?? 0;
                        if ($count == 0) {
                            continue;
                        }
                        ?>
                        <button type="button" class="type-filter" data-type="<?= esc_attr($type); ?>">
                            <?= jvbIcon(str_replace(BASE, '', $type)); ?>
                            <span><?= $feed_types[$type] ?></span>
                            <span class="count">(<?= $count; ?>)</span>
                        </button>
                    <?php endforeach; ?>
                </div>
 
                <div class="view-controls">
                    <button type="button" class="view-toggle" data-view="grid" aria-pressed="true">
                        <?= jvbIcon('squares-four'); ?>
                    </button>
                    <button type="button" class="view-toggle" data-view="list" aria-pressed="false">
                        <?= jvbIcon('rows'); ?>
                    </button>
                </div>
            </div>
        <?php } ?>
 
        <!-- Bulk edit controls -->
        <div class="bulk-controls list">
            <div class="bulk-select">
                <input type="checkbox" id="select-all" class="select-all">
                <label for="select-all">Select All</label>
                <span class="selected-count"></span>
            </div>
 
            <div class="bulk-actions" hidden>
                <select class="bulk-action-select">
                    <option value="">Bulk Actions...</option>
                    <option value="create-list">Create New List</option>
                    <option value="add-to-list">Add to List</option>
                    <option value="unfavourite">Remove from Favourites</option>
                    <option value="add-notes">Add Notes</option>
                </select>
                <button type="button" class="apply-bulk">Apply</button>
                <button type="button" class="cancel-bulk">
                    <?= jvbIcon('x', ['title'=>'Cancel']); ?>
                </button>
            </div>
        </div>
    </div>
 
        <!-- Lists Content Tab -->
        <div class="tab-content" data-tab="lists" role="tabpanel" aria-hidden="true">
            <div class="lists-header">
                <button type="button" class="create-list-btn" onclick="window.userFavouritesManager.showCreateListModal()">
                    <?= jvbIcon('plus-square', ['title'=>'Create List']); ?>
                    <span>Create List</span>
                </button>
            </div>
 
 
            <div class="lists-container">
                <!-- Lists will be populated by JavaScript -->
            </div>
 
 
 
            <div class="list-details" hidden>
                <div class="list-header">
                    <label for="list-title">YOUR LIST</label>
                    <input type="text" id="list-title" class="list-title" value="List Title"/>
                </div>
                <div class="list-actions">
                    <button type="button" class="share-list" title="Share List">
                        <?= jvbIcon('share')?>
                        <span>Share</span>
                    </button>
                    <button type="button" class="duplicate-list" title="Duplicate List">
                        <?= jvbIcon('copy-simple')?>
                        <span>Duplicate</span>
                    </button>
                    <button type="button" class="delete-list" title="Delete List">
                        <?= jvbIcon('trash')?>
                        <span>Delete</span>
                    </button>
                </div>
                <label for="list-description">Description</label>
                <textarea id="list-description" class="list-description"></textarea>
                <div class="bulk-controls">
                    <div class="bulk-select">
                        <input type="checkbox" id="select-all" class="select-all">
                        <label for="select-all">Select All</label>
                        <span class="selected-count"></span>
                    </div>
 
                    <div class="bulk-actions" hidden>
                        <select class="bulk-action-select">
                            <option value="">Bulk Actions...</option>
                            <option value="move-list">Move to List</option>
                            <option value="remove-list">Remove from List</option>
                            <option value="add-notes">Add Notes</option>
                        </select>
                        <button type="button" class="apply-bulk">Apply</button>
                        <button type="button" class="cancel-bulk">
                            <?= jvbIcon('x', ['title'=>'Cancel']); ?>
                        </button>
                    </div>
                </div>
            </div>
        </div>
 
 
 
        <!-- Content grid -->
        <div class="favourites item-grid<?= (array_sum($counts) == 0) ? ' empty' : ''?>" role="grid">
            <!-- Items will be populated by JavaScript -->
        </div>
 
        <!-- Empty state message -->
        <div class="no-favourites" hidden>
            <h3>♡ BLANK CANVAS ♡</h3>
            <p>You haven't fallen in love with any pieces... yet!</p>
            <p>Hit that heart icon when something stops your scroll.</p>
            <p>Your dream collection is waiting to start.</p>
        </div>
 
        <!-- Infinite scroll sentinel -->
        <div class="scroll-sentinel" aria-hidden="true"></div>
    </div>
</div>
 
<!-- Create List Modal -->
<dialog class="create-list-modal">
    <form method="dialog" data-nocache data-form-id="favourite-list" data-save="favourites/lists">
        <h2>Create New List</h2>
 
        <div class="field">
            <label for="list-name">List Name</label>
            <input type="text" id="list-name" name="list_name" required>
        </div>
 
        <div class="field">
            <label for="list-description">Description</label>
            <textarea id="list-description" name="list_description"></textarea>
        </div>
 
        <div class="actions row">
            <button type="button" class="cancel">Cancel</button>
            <button type="submit" class="create">Create List</button>
        </div>
    </form>
</dialog>
 
<!-- Add to List Modal -->
<dialog class="add-to-list-modal">
    <form method="dialog" data-save="favourites/lists" data-form-id="add-to-favourites-list" data-nocache>
        <h2>Add to List</h2>
 
        <div class="lists-options">
            <!-- List options will be populated by JavaScript -->
        </div>
 
        <div class="actions row">
            <button type="button" class="cancel">Cancel</button>
            <button type="submit" class="add">Add to List</button>
        </div>
    </form>
</dialog>
 
<!-- Share List Modal -->
<dialog class="share-list-modal">
    <form method="dialog" data-form-id="share-list" data-save="favourites/lists/shares">
        <h2>Share List</h2>
 
        <div class="share-input-group">
            <label for="share-email">Share with email</label>
            <div class="input-with-button">
                <input type="email" id="share-email" name="share_email" placeholder="Enter email address">
                <button type="button" class="add-email">
                    <?= jvbIcon('plus-square', ['title'=>'Add share access'])?>
                </button>
            </div>
        </div>
 
        <div class="shared-with">
            <h3>Shared with</h3>
            <div class="shared-users"></div>
        </div>
 
        <div class="actions row">
            <button type="button" class="cancel">Cancel</button>
        </div>
    </form>
</dialog>