diff --git a/mpg.png b/mpg.png new file mode 100644 index 0000000..3bea4e5 Binary files /dev/null and b/mpg.png differ diff --git a/script.js b/script.js index 10acc51..c5ea6cc 100644 --- a/script.js +++ b/script.js @@ -131,6 +131,23 @@ var ROUTES = RoutePart([ ], loadTop); */ +var ROUTES = RoutePart( + [ + [ match(/^spam_post$/) + , new RoutePart( + [ + [ match(/^[0-9]+$/) + , new RoutePart([], showSpamPost) + ] + ] + , null + ) + ] + ] + , handlePageRoot +); + +/* var ROUTES = RoutePart( [ [ match(/^static$/) @@ -146,6 +163,7 @@ var ROUTES = RoutePart( ] , null ); +*/ /** * Functions @@ -346,12 +364,13 @@ function _mkelem(etype, child) { return elem; } -var div = _mkelem.bind(this, 'div'); -var li = _mkelem.bind(this, 'li'); -var span = _mkelem.bind(this, 'span'); +var h3 = _mkelem.bind(this, 'h3'); +var div = _mkelem.bind(this, 'div'); +var li = _mkelem.bind(this, 'li'); +var span = _mkelem.bind(this, 'span'); var italic = _mkelem.bind(this, 'i'); -var bold = _mkelem.bind(this, 'b'); -var ul = document.createElement.bind(document, 'ul'); +var bold = _mkelem.bind(this, 'b'); +var ul = _mkelem.bind(this, 'ul'); function magnetLinkHash(m) { return m.split(':').slice(-1)[0]; @@ -477,11 +496,19 @@ function caught(m, e) { alert(new Error(m + e.message)); }; +function renderReasons() { + return span(text('This is Why')); +} + function mkSpamImgElement(img_description) { - console.log(img_description); var img_elem = document.createElement('img'); var mime = img_description.mimetype; - var thumb_url = `/bin/?path=${img_description.thumbnail}&mimetype=image/jpeg` + var thumb_url; + if (!img_description.thumbnail) { + thumb_url = `/bin/?path=${GlobalVars.settings.audio_mpeg_thumbnail_path}&mimetype=image/jpeg` + } else { + thumb_url = `/bin/?path=${img_description.thumbnail}&mimetype=image/jpeg` + } var image_url = `/bin/?path=${img_description.filename}&mimetype=${mime}` img_elem.setAttribute('src', thumb_url); img_elem.setAttribute('decoding', 'async'); @@ -490,34 +517,93 @@ function mkSpamImgElement(img_description) { var a_elem = document.createElement('a'); a_elem.setAttribute('href', image_url); a_elem.appendChild(img_elem); - var img_container_elem = document.createElement('div'); - img_container_elem.appendChild(a_elem); + var img_container_elem = div(a_elem); + img_container_elem.classList.add('post--image_container'); return img_container_elem; } +function renderPostElem(post) { + var postContainer = div(); + postContainer.className = 'post'; + var postElem = div(); + postElem.classList.add('post--body_container'); + postContainer.appendChild(postElem); + var bodyTextElem = div(); + bodyTextElem.classList.add('post--body'); + bodyTextElem.innerText = post.body; + + post.known_spam_post_attachment.forEach(function(attachment) { + postElem.appendChild(mkSpamImgElement(attachment)); + }); + + postElem.appendChild(bodyTextElem); + + return postContainer; +} + +var REASONS = { + RECENTLY_POSTED_ATTACHMENT_ABOVE_RATE: 1 << 0, + LEXICAL_ANALYSIS_SHOWS_NONSENSE: 1 << 1, + SEGMENTED_AVG_ENTROPY_TOO_HIGH: 1 << 2, + TEXT_MATCHES_KNOWN_SPAM: 1 << 3, + RECENTLY_POSTED_TEXT_ABOVE_RATE: 1 << 4, + TEXT_IS_URL: 1 << 5, + TEXT_IS_ONE_LONG_WORD: 1 << 6, + TEXT_IS_RANDOM_WORDS: 1 << 7 +}; + +function reasonsFromBitmap(n) { + var reasons = new Set(); + + for (const [reason, bit] of Object.entries(REASONS)) { + if (n & bit) { + reasons.add(reason); + } + } + + return reasons; +} + +function renderOverviewPost(post) { + var postContainer = renderPostElem(post); + var reasons = ul(); + reasonsFromBitmap(post.reason).forEach(function(r) { + reasons.appendChild(li(text(r))); + }); + postContainer.appendChild(h3(text('Reasons:'))); + postContainer.appendChild(div(reasons)); + return postContainer; +} + function loadKnownSpamImages() { - pageInfoText.innerText = 'Loading known spam images'; + pageInfoText.innerText = 'Loading known spam post'; cancelGlobalEvts(); - var url = GlobalVars.settings.postgrest_url + '/known_spam_attachments' + //var url = GlobalVars.settings.postgrest_url + '/known_spam_post?select=*,known_spam_attachments(*)' + var url = GlobalVars.settings.postgrest_url + '/known_spam_post?select=*,known_spam_post_attachment(*)' var headers = { 'Authorization': 'Bearer ' + GlobalVars.settings.jwt }; - return get(url, cancel, headers) + get(url, cancel, headers) .then(function(response) { - console.log("have known spam images:", response); var json = JSON.parse(response); - console.log("have known spam images:", json); + console.log("results for", url, json); + //console.log("have known spam images:", json); + pageInfoText.innerText = 'Have these known spam posts:'; + var mainElem = document.querySelector('main'); + mainElem.innerHTML = ''; + json.forEach(function (post) { + var postElem = renderOverviewPost(post); - var imgTags = json.map(mkSpamImgElement); - imgTags.forEach(function(imgTag) { - document.querySelector('main').appendChild(imgTag); + postElem.addEventListener('click', function() { + changeUrl('/spam_post/' + post.text_post_id, null, true); + }); + + mainElem.appendChild(postElem); }); - - pageInfoText.innerText = 'Have these known spam images:'; }) - .catch(caught.bind(this, "Failed to load known spam images. Reason:")); + .catch(caught.bind(this, "Failed to load known spam posts. Reason:")); } function loadInfo(info_hash) { @@ -602,44 +688,79 @@ function loadResults(search_query) { .catch(caught.bind(this, "Failed to results: ")); } -function changeUrl(path, search_query) { +function changeUrl(path, search_query, push_state) { var event = new CustomEvent( 'urlchange', { detail: { path: path, - query: search_query + query: search_query, + push_state: push_state, } }); window.dispatchEvent(event); } -function searchInputHandler() { - var input = document.querySelector("input"); - var btn = document.querySelector("button"); - - btn.addEventListener('click', function() { - var search_query = input.value; - window.history.pushState(null, "", - window.location.origin + - '/s?q=' + encodeURIComponent(search_query)); - changeUrl('/s', { q: search_query }); - }); - - input.addEventListener('keydown', function(e) { - if (e.keyCode === 13) { - e.preventDefault(); - btn.click(); - } - }); -} - function handlePageRoot(_, query_params) { console.log("handlePageRoot", query_params); return loadKnownSpamImages(); } +function showSpamPost(path_data, _) { + console.log(path_data); + var post_id = path_data[1]; + pageInfoText.innerText = 'Loading known spam post ' + post_id; + + var url = + GlobalVars.settings.postgrest_url + + '/known_spam_post?text_post_id=eq.' + post_id + + '&select=*,known_spam_post_attachment(*)'; + var headers = { + 'Authorization': 'Bearer ' + GlobalVars.settings.jwt + }; + + var postSectionElem = document.createElement('section'); + + var mainElem = document.querySelector('main'); + mainElem.innerHTML = ''; + mainElem.appendChild(postSectionElem); + + var h2 = document.createElement('h2'); + h2.innerText = 'Known Spam Attachments'; + mainElem.appendChild(postSectionElem); + mainElem.appendChild(h2); + + var knownSpamAttachmentsSectionElem = document.createElement('section'); + mainElem.append(knownSpamAttachmentsSectionElem); + + get(url, cancel, headers) + .then(function(response) { + var json = JSON.parse(response); + console.log(json); + pageInfoText.innerText = 'Known Spam Post'; + + json.forEach(function(p) { + var postElem = renderPostElem(p); + postSectionElem.appendChild(postElem); + }); + + }) + .catch(caught.bind(this, "Failed to load known spam post. Reason:")); + + url = + GlobalVars.settings.postgrest_url + + '/known_spam_attachments?post_id=eq.' + post_id; + + get(url, cancel, headers) + .then(function(response) { + var json = JSON.parse(response); + console.log("known spam attachments:", json); + }) + .catch(caught.bind(this, "Failed to load known spam attachments. Reason:")); + +} + function handleSearch(_, query_params) { var search_query = query_params.q; @@ -660,6 +781,15 @@ function handleInfo(parts, query_params) { function onUrlChange(e) { var path = e.detail.path.split('/').filter(function(s){ return s.length; }); console.log(e, e.detail, path); + + if (e.detail.push_state) { + var params = Object.assign({ __path: e.detail.path }, e.detail.query); + var search_query = new URLSearchParams(params); + + window.history.pushState(null, "", + window.location.origin + window.location.pathname + '?' + search_query.toString()); + } + resolvePath(ROUTES, path, e.detail.query); } @@ -696,8 +826,17 @@ function parseQueryParams(querystring) { } function onRealUrlChange() { - var path = window.location.pathname; + //var path = window.location.pathname; + var path; var query_params = parseQueryParams(window.location.search.substring(1)); + + if (query_params.__path != null) { + path = query_params.__path; + console.log("NEW PATH", path); + } else { + path = '/'; + } + changeUrl(path, query_params); } diff --git a/style.css b/style.css index 72a1d89..9494537 100644 --- a/style.css +++ b/style.css @@ -3,12 +3,12 @@ body { } header { - margin: 1em 4em; + margin: 1em 1em; } .post { background-color: white; - margin: 1em 4em; + margin: 1em 1em; box-shadow: .4em .4em .4em grey; border: 1px solid grey; padding: 1em; @@ -18,4 +18,11 @@ header { background-color: #FFEEEE; } +.post--image_container { + float: left; + margin-right: 1em; +} +.post--body_container { + display: flow-root; +}