//comic_settings.js was created by geno7, with much needed assistance from Dannarchy

//this is the main file you'll be messing with to manage and update your comic. most (not all) of the main toggle-able settings are here.

//comic_archive has more settings pertaining to the archive page, and comic_show has settings pertaining to the main place that pages of your comic are displayed.

let pg = Number(findGetParameter("pg")); //make "pg" mean the current page number (this line doesnt work unless I put it here, if you're inexperienced with js dont worry about it)

////////////////////////
//VARIABLES FOR TWEAKING
////////////////////////

//REALLY IMPORTANT ONES
const maxpg = 14; //the current number of pages your comic has in total. this DOESNT necessarily mean number of IMAGE FILES as it doesn't count pages split into multiple files.
//YOU MUST UPDATE THIS NUMBER EVERY TIME YOU ADD A NEW PAGE or else it wont display the most recent page

// COMIC PAGE SETTINGS
const folder = "img/comics"; //directory of the folder where you keep all the comics
const image = "pg"; //what you'll name all your comic pages
const imgPart = "_" //special character(s) you put after the page number to subdivide pages into multiple image files (ie pg2_1, pg2_2, etc)
const ext = "webp"; //file extension of your comic pages

//THUMBNAIL SETTINGS
const thumbFolder = "img/thumbs" //directory of the folder where you keep all the thumbnail images for the comics, in case you want the archive page to use thumbnails.
const thumbExt = "webp" //file extension of thumbnails
const thumbDefault = "default" //name of the default thumbnail that displays when no thumbnail is set, located in the directory you set thumbFolder to.

//NAVIGATION SETTINGS
const navText = ["First","Previous","Next","Last"]; //alt text for your nav images, or just the text that shows up if you're not using images
const navFolder = "img/comicnav"; //directory where nav images are stored
const navExt = "png" //file extension of nav images
const navScrollTo = "#showComic"; //id of the div you want the page to automatically scroll to when you click to the next comic. will turn off if you delete text between quotation marks

if (pg == 0) {pg = maxpg;} //display MOST RECENT COMIC when the webpage is loaded. if you want to instead have the FIRST COMIC displayed first, change maxpg to 1.

//pgData holds all the parameters for each of your pages. copypaste this and fill out accordingly:
/* 
    {
        pgNum: ,
        title: "",
        date: writeDate([YEAR],[MONTH],[DAY]),
        altText: "",
        imageFiles: "",
        authorNotes: ``
    },
*/
//Note: the formatting is important! The whole thing won't show up if you forget to include the commas or curly braces in the right place.

const pgData = [
    {
        pgNum: 1, //what page number it is
        title: "Life on Mars 1-8", //the title of the page (leaving this blank will default it to "Page X")
        date: writeDate(2022, 1, 01), //the date on which the page was posted (mainly for the archive). The date is written using a function called "writeDate", basically just put writeDate and then some parenthesis and, comma separated, the year followed by the month and the day. Don't forget another comma at the end outside the parenthesis!
        altText: "", //the alt text (mouse over text) for this particular comic. put nothing inbetween the quotes for no alt text
        imageFiles: 8, //how many image files this page is split into
        authorNotes: `
            <p>If this is your first time reading Nuzzle, welcome!</p>
            <p>Meet Rocky, who is about to start a new career in a new town... </p>
            `,
    },
    {
        pgNum: 2,
        title: "Life on Mars 9-16",
        date: writeDate(2022, 1, 01),
        altText: "",
        imageFiles: 8,
        authorNotes: `
            <p>The feeling I want to convey in these pages make me recall to one time I was settling in a new town, living my myself, and knowing no one.</p>
            <p>Also, as you may notice, this story takes place in the 2010's decade, but I'm leaving the exact year ambiguous to make things simpler, think 201X.</p>
            `,
    },
    {
        pgNum: 3,
        title: "Life on Mars 17-24",
        date: writeDate(2022, 1, 01),
        altText: "Here's even more alt text!",
        imageFiles: 8,
        authorNotes: `
            <p>Who's this girl? Why does she act that way? Why isn't she mad?</p>
            <p>It would be nice if more people we're more optimistic when situations like these happen. No one got hurt so why be mad?</p>
            <p>Also keep in mind this note with the name 'Leo' in it, save it in your inventory.</p>
            `,
    },
    {
        pgNum: 4,
        title: "Life on Mars 25-31",
        date: writeDate(2022, 1, 01),
        altText: "Here's even more alt text!",
        imageFiles: 8,
        authorNotes: `
            <p>I believe taking the time to notice the little details in life make everything more enjoyable, especially when you surround yourself in a new setting. All the feel-good parts of waking up in the morning like that first bite from breakfast (and all the lazy, boring and annoying things too).</p>
            <p>An example of this I come back to is the fact that I recall every small detail of the train lines and buses I ride whenever I'm in a big city, since I never grew up with a decent public transport system.</p>
            <p>But also with new experiences come all sorts of new scenarios, and sometimes you don't know what to make of all the new things put in front of you. Despite things getting overwhelming fast, one has to face them anyways.</p>
            <p>And yeah the setting here is Canada.</p>
            `,
    },
    {
        pgNum: 5,
        title: "Life on Mars 32-39",
        date: writeDate(2022, 1, 01),
        altText: "Here's even more alt text!",
        imageFiles: 8,
        authorNotes: `
            <p>And here's that girl again, now we get to meet her proper!</p>
            <p>But hold on! Who's this other person? What are they doing?</p>
            `,
    },
    {
        pgNum: 6,
        title: "Life on Mars 40-47",
        date: writeDate(2022, 1, 01),
        altText: "Here's even more alt text!",
        imageFiles: 8,
        authorNotes: `
            <p>Tim! The red panda invades! And who's this teacher?</p>
            `,
    },
    {
        pgNum: 7,
        title: "Life on Mars 48-55",
        date: writeDate(2022, 1, 01),
        altText: "Here's even more alt text!",
        imageFiles: 8,
        authorNotes: `
            <p>One of the first things I noticed going from high school to college was that people are way more chill and open minded. This was a very weird thing to experience, even if it was something I was half-expecting.</p>
            `,
    },
    {
        pgNum: 8,
        title: "Life on Mars 56-63",
        date: writeDate(2022, 1, 01),
        altText: "Here's even more alt text!",
        imageFiles: 8,
        authorNotes: `
            <p>Well here we have Hazel and Tim being much more lax and unmasking more in front of Rocky.</p>
            <p>Growing up this was one of the things that made meeting new friends weird because I didn't get sarcasm or friendly teasefulness and such.</p>
            `,
    },
    {
        pgNum: 9,
        title: "Life on Mars 64-71",
        date: writeDate(2022, 1, 01),
        altText: "Here's even more alt text!",
        imageFiles: 8,
        authorNotes: `
            <p>Origin of Hazel and Tim's friendship!</p>
            <p>I strive to be as flamboyant as Tim is...</p>
            `,
    },
    {
        pgNum: 10,
        title: "Life on Mars 72-79",
        date: writeDate(2022, 1, 01),
        altText: "Here's even more alt text!",
        imageFiles: 8,
        authorNotes: `
            <p>You can sort of tell Rocky's never really hung out with people, she doesn't really know how to react to a lot of things, especially the more relatively taboo things she's only ever heard of but never directly interacted with.</p>
            `,
    },
    {
        pgNum: 11,
        title: "Life on Mars 80-88",
        date: writeDate(2022, 1, 01),
        altText: "Here's even more alt text!",
        imageFiles: 8,
        authorNotes: `
            <p>We gotta remember that in this confusing world there's still people who don't know their way through. And what would seem like a normal task to you, can be a monumental task for others.</p>
            <p>Despite having known Rocky for only a week, Hazel and Tim unconditionally take her in as a friend. Sometimes the weirdos that regular people tend to avoid are actually the greatest swethearts.</p>
            `,
    },
    {
        pgNum: 12,
        title: "Life on Mars 89-96",
        date: writeDate(2022, 1, 01),
        altText: "Here's even more alt text!",
        imageFiles: 8,
        authorNotes: `
            <p>The last pages in Episode 1, "Life on Mars?". A reminder to focus on your goals and dreams, to never forget what makes you unique, and why you're here in the first place.</p>
            <p>And we get to see a new roomate?</p>
            `,
    },
    {
        pgNum: 13,
        title: "Walk on The Wild Side 1-4",
        date: writeDate(2023, 1, 01),
        altText: "Here's even more alt text!",
        imageFiles: 4,
        authorNotes: `
            <p>Remember that sticky note you saved in your inventory? Well here it is again!</p>
            <p>We get to meet Leo the jackalope! And welcome to Episode 2, "Walk on the Wild Side!"</p>
            `,
    },
    {
        pgNum: 14,
        title: "Walk on The Wild Side 5-8",
        date: writeDate(2024, 1, 01),
        altText: "Here's even more alt text!",
        imageFiles: 4,
        authorNotes: `
            <p>Ah! The joys of adjusting to a new life and learning some small but significant facts about life itself, like never underestimating time.</p>
            `,
    },
];

//below is a function you dont rly need to mess with but if you're more experienced with js you can

function findGetParameter(parameterName) { //function used to write a parameter to append to the url, to give each comic page its own unique url
    let result = null,
    tmp = []; 
    let items = location.search.substr(1).split("&");
    for (let index = 0; index < items.length; index++) {
        tmp = items[index].split("=");
        if (tmp[0] === parameterName) result = decodeURIComponent(tmp[1]);
    }
    return result;
}

function writeDate(year,month,day) { //write date of comic page
    const date = new Date(year,month-1,day)
    .toDateString() //format date as Day Month Date Year
    .toString() //convert it to a string
    .slice(4) //remove the Day
    return date
}