AS gallery view script

Regis

New member
Trusted Member
Jan 17, 2013
14
1
Hello, I created a little script to display the threads in the download section as a gallery view, similar to other websites.
It's a bit quick and dirty but works well so far. I thought i share it with you guys.

To use it you will need a userscript manager like Tampermonkey.

Here is the script, just copy it in a new entry.
Tested with Tampermonkey and chrome/firefox.

Code:
// ==UserScript==
// @name         [anime-sharing] gallery-view
// @namespace    http://www.anime-sharing.com
// @version      1
// @description  Gallery View for anime-sharing. Very simple quick n diry script
// @author       Regis|http://www.anime-sharing.com/forum/members/regis-41307/
// @run-at       document-start

// @match        http://www.anime-sharing.com/forum/hentai-games-38/*
// @match        http://www.anime-sharing.com/forum/hentai-ovas-36/*
// @match        http://www.anime-sharing.com/forum/hentai-manga-32/*
// @match        http://www.anime-sharing.com/forum/light-novels-61/*
// @match        http://www.anime-sharing.com/forum/raw-manga-30/*
// @match        http://www.anime-sharing.com/forum/torrents-47/*

// @require      https://code.jquery.com/jquery-3.3.0.min.js
// @grant        GM_addStyle
// ==/UserScript==

(function() {
    'use strict';

    //USER OPTIONS START

    //How many days the NEW word ist displayed for a thread
    var threadAgeIsNew = 14;

    //How wide the one gallery is. Lets you display more/fewer items in a row. Default: 330 1K/ 337 4K
    var galleryItemWidth = 370;

    //USER OPTIONS END

    GM_addStyle(`

#threadlist { display:none; }

#thGalleryView { width: 100%; }
.gvitem { float:left; width:${galleryItemWidth}px; height:310px; background:#f8f8f8; margin:5px; padding: 8px; border:1px solid #c4c4c4 }
.gvitemtitle { height:50px; text-align: center; overflow: hidden; }
.gvitemimg {
  height:225px;
  margin-bottom: 4px;
}
.gvitemimg > img {
	max-width: calc(100% - 8px);;
	max-height: calc(100% - 8px);
	border: 2px solid #c8c8c8;
	background: #fff;
	padding: 2px;
	display: block;
	margin-left: auto;
	margin-right: auto;
}
.newTh { color: #f3cd01; font-weight: bold; font-style: italic; text-shadow: 2px 2px 4px #7c6d33;margin-right:4px; }
    `);

    document.onreadystatechange = function () {
        if (document.readyState === "interactive") {
            start();
        }
    }


    function start() {
        createGViewer();

        $("#threadlist").find(".threadbit").each(function() {
            if ($(this).attr("id") == null)
                return;
            var threadInfoObj = getThreadData($(this));
            addItemToView(threadInfoObj);
        });
    }

    function getThreadData(trObj) {
        var infoObj = {};
        infoObj.title = trObj.find(".threadtitle").find(".title").html().trim();
        infoObj.thread = trObj.find(".threadtitle").find("a.title").attr("href");
        infoObj.img = trObj.find("img.preview").attr("src");
        infoObj.authorHtml = trObj.find(".author").find(".username").removeClass("understate").prop('outerHTML');
        infoObj.lastPostHtml = trObj.find(".threadlastpost").find(".username").prop('outerHTML');
        infoObj.lastPostDate = parseDateInfo(trObj.find(".threadlastpost").find(".lastpostdate").parent().text().trim());
        infoObj.postDate = parseDateInfo(trObj.find(".author").find(".username").parent().text());;
        infoObj.isSticky = trObj.find(".threadtitle").find("img[title='Sticky Thread']").length > 0;
        infoObj.isNew = dateDiffInDays(infoObj.postDate, new Date()) < threadAgeIsNew;

        infoObj.lastPostStr = null;
        infoObj.infoStr = null;

        return infoObj;
    }


    function createGViewer() {
        var contHtml = `
          <div id='thGalleryView'>
          </div>
        `;

        $("#threadlist").before(contHtml);
    }

    function addItemToView(itemInfo) {
        var itemHtml = `
          <div class='gvitem'>
            <a href='${itemInfo.thread}'>
              <div class='gvitemtitle' title='${itemInfo.title}'>
                <span title='sticky thread' class='gvSticky' style='float:left; display:${disOpt(itemInfo.isSticky)}'>????</span>
                <span style='display:${disOpt(itemInfo.isNew)}' class='newTh'>NEW</span>
                <span>${itemInfo.title}</span>
              </div>
              <div class='gvitemimg'><img src='${itemInfo.img}' /></div>
            </a>
            <div class='gvitemInfo'>
              <div><span>created by </span>${itemInfo.authorHtml}<span><span style='float:right'>last post by ${itemInfo.lastPostHtml}</span></div>
              <div>on </span><span>${formatDate(itemInfo.postDate)}</span>
                   <span style='float:right'>on ${formatDate(itemInfo.lastPostDate)}</span></div>
            </div>
          </div>
        `;

        $("#thGalleryView").append(itemHtml);
    }

    function disOpt(isDisplay) {
        return (isDisplay ? "inline" : "none") ;
    }

    function formatDate(date) {
        if (date == undefined || date == null)
            return "";

        var dtstr = date.toLocaleDateString();
        dtstr += " " + ("0" + date.getHours()).slice(-2) + ":" + ("0" + date.getMinutes()).slice(-2);

        return dtstr;
    }

    function parseDateInfo(dstr) {

        var year, month, day, hour, min;
        if (dstr.includes("Yesterday") || dstr.includes("Today")) {
            var xdate = new Date();
            if (dstr.toLowerCase().includes("Yesterday"))
                xdate.setDate(xdate.getDate() -1);

            year = xdate.getFullYear();
            month = xdate.getMonth();
            day = xdate.getDay();
            var regexTime = RegExp(/\d+\:\d+\s[AMP]+/, 'g');
            let matchArr = regexTime.exec(dstr);
            if (matchArr == null)
                console.log("1-match failed-src:" + dstr + "|reg:" + regexTime);

            let timeStr = convertTime12to24(matchArr[0].trim());
            hour = timeStr.split(":")[0];
            min = timeStr.split(":")[1];
        }
        else {
            var regexDate = RegExp(/([A-z]+) (\d+)[A-z,\s]+(\d+)[,\s]([\d:\sAMP]+)/, 'g');
            //'Started by hentaigraal, August 7th, 2020 01:09 PM';
            let matchArr = regexDate.exec(dstr);
            if (matchArr == null)
                console.log("2-match failed-src:" + dstr + "|reg:" + regexDate);

            var monthName = matchArr[1].trim().toLowerCase();
            var monthNameArr = ["jan", "feb", "mar", "apr", "may", "jun", "jul", "aug", "sep", "oct", "nov", "dec"];
            month = monthNameArr.indexOf(monthName.substr(0,3));
            day = matchArr[2].trim();
            year = matchArr[3].trim();
            let timeStr = convertTime12to24(matchArr[4].trim());
            hour = timeStr.split(":")[0];
            min = timeStr.split(":")[1];
        }

        return new Date(year, month, day, hour, min);
    }

    //Input: 01:09 PM | output: 13:09
    function convertTime12to24(time12h) {
        let [time, modifier] = time12h.split(' ');
        let [hours, minutes] = time.split(':');
        if (hours === '12') {
            hours = '00';
        }

        if (modifier === 'PM') {
            hours = parseInt(hours, 10) + 12;
        }

        return `${hours}:${minutes}`;
    }

    function dateDiffInDays(first, second) {
        return Math.round((second-first)/(1000*60*60*24));
    }

})();
 
Last edited:
Did you mean the grid view?

In the next major rehaul dubbed the AS Community 2.0, I'll make some section to displayed as Grid. It is still under development since it was a lot bigger than I originally planned.
 
yea, some call it gallery view, others grid view. Since there hasnt been one for such a long time, i made a script for that.
 

Users who are viewing this thread

Latest profile posts

nobis_c wrote on biohrd's profile.
To y'all, he's been gone for a while now. Like, for years. When he'll be back? Who knows.

I'm just here to tell you, save your breath.
gaoda1347 wrote on Shine's profile.
the 「Clear Girlー無色透明彼女ー」 has a fix patch was uploaded. could you reupload it plz?
https://www.anime-sharing.com/threa...ftware-clear-girlー無色透明彼女ー-rj01093304.1489533/
AoToHime wrote on ramori's profile.
Hello there. Can you please upload this?

https://www.dlsite.com/maniax/work/=/product_id/RJ01199671.html/

Thanks in advance!
[Request] [RJ01110786]【巨根裏垢Keyくん。】マスクの下が見たい?じゃあ……ここにDMして

RJ01110786_img_main.webp

https://www.dlsite.com/girls/work/=/product_id/RJ01110786.html

https://www.dlsite.com/girls/work/=/product_id/RJ01110786.html
hc1992 wrote on Otokonoko's profile.
Hi, RJ323169 RJ328721 RJ342268 links are dead, could you please reupload these?