Skip to Content
Last modified by XWikiGuest on 2026/03/11 21:09
From version 3.1
edited by XWikiGuest
on 2026/03/11 21:09
Change comment: There is no comment for this version
To version 1.1
edited by Ad Min
on 2026/03/10 19:02
Change comment: There is no comment for this version

Summary

Details

Page properties
Author
... ... @@ -1,1 +1,1 @@
1 -XWiki.XWikiGuest
1 +xwiki:XWiki.admin
Content
... ... @@ -1,237 +1,3 @@
1 1  = Machine Learning en Data Science =
2 2  
3 3  //Deze sectie wordt nog gevuld.//
4 -
5 -{{html clean="false"}}
6 -<style>
7 -#ldsf-container-mldatascience {
8 - display: flex;
9 - height: 65vh;
10 - border: 1px solid #4e5d6c;
11 - border-radius: 4px;
12 - overflow: hidden;
13 -}
14 -#ldsf-container-mldatascience .ldsf-left {
15 - width: 35%;
16 - min-width: 200px;
17 - max-width: 60%;
18 - overflow-y: auto;
19 - background: #2b3e50;
20 - display: flex;
21 - flex-direction: column;
22 -}
23 -#ldsf-container-mldatascience .ldsf-divider {
24 - width: 6px;
25 - background: #4e5d6c;
26 - cursor: col-resize;
27 - flex-shrink: 0;
28 - transition: background 0.2s;
29 -}
30 -#ldsf-container-mldatascience .ldsf-divider:hover,
31 -#ldsf-container-mldatascience .ldsf-divider.dragging { background: #df691a; }
32 -#ldsf-container-mldatascience .ldsf-right {
33 - flex: 1;
34 - min-width: 200px;
35 - display: flex;
36 - flex-direction: column;
37 -}
38 -#ldsf-container-mldatascience .ldsf-status {
39 - color: #6b7c8d;
40 - font-size: 13px;
41 - padding: 8px 12px;
42 - flex-shrink: 0;
43 -}
44 -#ldsf-container-mldatascience .ldsf-bm {
45 - overflow-y: auto;
46 - flex: 1;
47 -}
48 -#ldsf-container-mldatascience .ldsf-bm ul {
49 - list-style: none;
50 - padding: 0;
51 - margin: 0;
52 -}
53 -#ldsf-container-mldatascience .ldsf-bm li {
54 - padding: 6px 12px;
55 - border-bottom: 1px solid rgba(78,93,108,0.3);
56 - display: flex;
57 - align-items: center;
58 - gap: 8px;
59 -}
60 -#ldsf-container-mldatascience .ldsf-bm li:hover { background: #3b4e60; }
61 -#ldsf-container-mldatascience .ldsf-bm a {
62 - color: #5bc0de;
63 - text-decoration: none;
64 - overflow: hidden;
65 - text-overflow: ellipsis;
66 - white-space: nowrap;
67 - font-size: 13px;
68 -}
69 -#ldsf-container-mldatascience .ldsf-bm a:hover { color: #df691a; }
70 -#ldsf-container-mldatascience .sf-num {
71 - display: inline-flex;
72 - align-items: center;
73 - justify-content: center;
74 - width: 22px;
75 - height: 22px;
76 - border-radius: 50%;
77 - background: #df691a;
78 - color: #fff;
79 - font-size: 11px;
80 - font-weight: bold;
81 - flex-shrink: 0;
82 -}
83 -#ldsf-container-mldatascience .sf-btn {
84 - cursor: pointer;
85 - background: #4e5d6c;
86 - border: none;
87 - color: #5bc0de;
88 - padding: 2px 6px;
89 - border-radius: 3px;
90 - font-size: 13px;
91 - flex-shrink: 0;
92 -}
93 -#ldsf-container-mldatascience .sf-btn:hover { background: #df691a; color: #fff; }
94 -#ldsf-container-mldatascience .ldsf-vbar {
95 - display: none;
96 - justify-content: space-between;
97 - align-items: center;
98 - padding: 4px 12px;
99 - background: #2b3e50;
100 - color: #ebebeb;
101 - font-size: 12px;
102 - flex-shrink: 0;
103 - border-bottom: 1px solid #4e5d6c;
104 -}
105 -#ldsf-container-mldatascience .ldsf-vbar .close-btn {
106 - cursor: pointer;
107 - color: #d9534f;
108 - font-size: 18px;
109 - padding: 0 4px;
110 -}
111 -#ldsf-container-mldatascience .ldsf-vbar .close-btn:hover { color: #ff6b6b; }
112 -#ldsf-container-mldatascience .ldsf-frame {
113 - width: 100%;
114 - flex: 1;
115 - border: none;
116 - background: #fff;
117 - display: none;
118 -}
119 -#ldsf-container-mldatascience .ldsf-ph {
120 - display: flex;
121 - align-items: center;
122 - justify-content: center;
123 - flex: 1;
124 - color: #6b7c8d;
125 - font-size: 15px;
126 - background: #2b3e50;
127 -}
128 -</style>
129 -
130 -<div id="ldsf-container-mldatascience">
131 - <div class="ldsf-left" id="ldsf-left-mldatascience">
132 - <div class="ldsf-status" id="ldsf-status-mldatascience">Laden...</div>
133 - <div class="ldsf-bm" id="ldsf-bm-mldatascience"></div>
134 - </div>
135 - <div class="ldsf-divider" id="ldsf-div-mldatascience"></div>
136 - <div class="ldsf-right">
137 - <div class="ldsf-vbar" id="ldsf-vbar-mldatascience">
138 - <span id="ldsf-vtitle-mldatascience"></span>
139 - <span class="close-btn" data-sfclose-mldatascience="1">&times;</span>
140 - </div>
141 - <div class="ldsf-ph" id="ldsf-ph-mldatascience">Klik op &#128196; om een archief te bekijken</div>
142 - <iframe class="ldsf-frame" id="ldsf-frame-mldatascience" sandbox="allow-same-origin"></iframe>
143 - </div>
144 -</div>
145 -
146 -<script>
147 -(function() {
148 - var U = 'mldatascience';
149 - var CFG = {
150 - linkding: 'https://bookmarks.rhebergen.org/api/bookmarks/',
151 - token: '3b7443e0f84e2b2b269adebb96d7475e4a5e653e',
152 - tag: 'AI-&-Machine-Learning',
153 - count: 20,
154 - share: 'eT2X9ttBHK5GoEY',
155 - webdav: 'https://cloud.rhebergen.org/public.php/webdav/'
156 - };
157 - CFG.auth = 'Basic ' + btoa(CFG.share + ':');
158 -
159 - var urlToFile = {}, fileMap = {};
160 -
161 - function match(url) {
162 - var t = [url, url.replace(/\/$/, ''), url + '/', url.replace(/\?.*$/, '')];
163 - for (var i = 0; i < t.length; i++) { if (urlToFile[t[i]]) return urlToFile[t[i]]; }
164 - return null;
165 - }
166 -
167 - function show(f) {
168 - document.getElementById('ldsf-vtitle-' + U).textContent = f.replace(/\.html?$/i, '');
169 - document.getElementById('ldsf-vbar-' + U).style.display = 'flex';
170 - document.getElementById('ldsf-ph-' + U).style.display = 'none';
171 - var fr = document.getElementById('ldsf-frame-' + U);
172 - fr.style.display = 'block';
173 - fr.srcdoc = '<p style="padding:20px;color:#888">Laden...</p>';
174 - fetch(CFG.webdav + encodeURIComponent(f), { headers: { 'Authorization': CFG.auth } })
175 - .then(function(r) { return r.text(); })
176 - .then(function(h) { fr.srcdoc = h; })
177 - .catch(function(e) { fr.srcdoc = '<p style="padding:20px;color:#d9534f">' + e.message + '</p>'; });
178 - }
179 -
180 - function close() {
181 - document.getElementById('ldsf-vbar-' + U).style.display = 'none';
182 - document.getElementById('ldsf-frame-' + U).style.display = 'none';
183 - document.getElementById('ldsf-ph-' + U).style.display = 'flex';
184 - }
185 -
186 - function render(data) {
187 - var total = data.count || 0, arc = 0;
188 - var html = '<ul>';
189 - (data.results || []).forEach(function(bm, i) {
190 - var title = bm.title || bm.website_title || bm.url;
191 - var f = match(bm.url);
192 - if (f) { arc++; fileMap[i] = f; }
193 - html += '<li><span class="sf-num">' + (i + 1) + '</span>';
194 - if (f) html += '<span class="sf-btn" data-sf-' + U + '="' + i + '" title="Archief bekijken">&#128196;</span>';
195 - html += '<a href="' + bm.url + '" target="_blank">' + title + '</a></li>';
196 - });
197 - document.getElementById('ldsf-bm-' + U).innerHTML = html + '</ul>';
198 - document.getElementById('ldsf-status-' + U).textContent = total + ' bookmarks, ' + arc + ' met archief';
199 - }
200 -
201 - document.addEventListener('click', function(e) {
202 - var t = e.target;
203 - if (!t || !t.getAttribute) return;
204 - var sf = t.getAttribute('data-sf-' + U);
205 - if (sf !== null && fileMap[sf]) show(fileMap[sf]);
206 - if (t.getAttribute('data-sfclose-' + U) !== null) close();
207 - }, true);
208 -
209 - var drag = false;
210 - document.getElementById('ldsf-div-' + U).addEventListener('mousedown', function(e) {
211 - drag = true; this.classList.add('dragging'); e.preventDefault();
212 - });
213 - document.addEventListener('mousemove', function(e) {
214 - if (!drag) return;
215 - var box = document.getElementById('ldsf-container-' + U).getBoundingClientRect();
216 - var w = e.clientX - box.left;
217 - if (w >= 200 && w <= box.width * 0.6)
218 - document.getElementById('ldsf-left-' + U).style.width = w + 'px';
219 - });
220 - document.addEventListener('mouseup', function() {
221 - if (drag) { drag = false; document.getElementById('ldsf-div-' + U).classList.remove('dragging'); }
222 - });
223 -
224 - fetch(CFG.webdav + 'index.json', { headers: { 'Authorization': CFG.auth } })
225 - .then(function(r) { return r.ok ? r.json() : {}; })
226 - .then(function(idx) { for (var f in idx) { if (idx.hasOwnProperty(f)) urlToFile[idx[f]] = f; } })
227 - .catch(function() {})
228 - .then(function() {
229 - return fetch(CFG.linkding + '?limit=' + CFG.count + '&q=%23' + encodeURIComponent(CFG.tag),
230 - { headers: { 'Authorization': 'Token ' + CFG.token } });
231 - })
232 - .then(function(r) { return r.json(); })
233 - .then(render)
234 - .catch(function(e) { document.getElementById('ldsf-status-' + U).textContent = 'Fout: ' + e.message; });
235 -})();
236 -</script>
237 -{{/html}}