website/scripts/japanese.js

/**
 **-
 * JavaScript providing functions for
 * generating the HTML elements 
 * required for the Japanese pages on
 * the site
 *
 * Author - Philip Osztromok
 *
 * 2 March 2024
 *+
*/

import { romajiToHiragana } from '/scripts/japanese_conversion.js';

function addCharacter(hiragana,letter,data) {
	const newAlpha = document.createElement("div")
    newAlpha.innerHTML =`
        <div class="pair">
            <h1 class="alphabet">${hiragana}</h1>
            <p class="letter">${letter}<p>
			<p class="data">${data}<p>	
        </div>
    `
	return newAlpha
}

const addTopGap = function () {
    const newTopGap = document.createElement("div")
	newTopGap.className = "topgap"
    
    return newTopGap
}

const addTitle = function (header1, header2) {
    const newTitle = document.createElement("div")
	newTitle.classList.add("title")
    newTitle.innerHTML =`
        <h1 class="header1">${header1}</h1>
        <h2 class="header2">${header2}</h2>
    `
    return newTitle
}

function addLessonHeader(lesson) {
	const newLessonHeader = document.createElement("h2")
	newLessonHeader.classList.add("lessonHeader")
	const id = "Lesson_" + lesson
	newLessonHeader.setAttribute("id", id)
	newLessonHeader.innerHTML = id
	console.log("Lesson header is ", newLessonHeader)
	return newLessonHeader
}

const addLessonLink = function (lesson) {
	const newLesson = document.createElement("h2")
	const id = "lesson_" + lesson
	newLesson.setAttribute("id", id)
    newLesson.innerHTML =`
        <h2 class="title"><a href='#lesson_${lesson}'>Lesson ${lesson}</a></h2>
    `
	console.log("Lesson link is ", newLesson)
    return newLesson
}

//function addVocab(hiragana, romaji, english) {
//	const newVocab = document.createElement("div")
//	const newH = document.createElement("h3")
//	newH.innerHTML = `${hiragana}`
//	const newR = document.createElement("p")
//	newR.innerHTML = `${romaji}`
//	const newE = document.createElement("p")
//	newE.innerHTML = `${english}`
//	
//	newVocab.append(newH);
//	newVocab.append(newR);
//	newVocab.append(newE);
//	
//	console.log("Adding new vocabulary item: ", newVocab)
//	
//	return newVocab
//}

function addVocab(romaji, english) {
	if (typeof english === 'undefined') {
		english = "No English tranlsation provided";
		console.log("Type of English is ", typeof english);
		console.log("Default value assigned to English");
	}
	const newVocab = document.createElement("div")
	console.log("Romaji is: ", romaji);
	const hiragana = romajiToHiragana(romaji);
	console.log("The returned hiragana is: ", hiragana);
	console.log("The returned english is: ", english);
	const vocabulary = hiragana + " : " + romaji + " : " + english;
	
	newVocab.innerHTML = vocabulary;
	console.log("The vocabulary item is: ", vocabulary);
		  
	console.log("Adding new vocabulary item: ", newVocab);
	
	return newVocab
}

function addHVocab(hiragana, english) {
	const newVocab = document.createElement("div");
	const newH = document.createElement("h3");
	newH.innerHTML = `${hiragana}`
	const newE = document.createElement("p");
	newE.innerHTML = `${english}`
	
	newVocab.append(newH);
	newVocab.append(newE);
	
	console.log("Adding new vocabulary item: ", newVocab)
	
	return newVocab
}

function addKVocab(katakana, english) {
	const newVocab = document.createElement("div")
	const newH = document.createElement("h3")
	newH.innerHTML = `${katakana}`
	const newE = document.createElement("p")
	newE.innerHTML = `${english}`
	
	newVocab.append(newH);
	newVocab.append(newE);
	
	console.log("Adding new vocabulary item: ", newVocab)
	
	return newVocab
}


function homework_menu() {
	const new_menu = ["Week 1", "Week 2", "Week 3", "Week 4", "Week 5", "Week 6", "Week 7", "Week 8", "Week 9", "Week 10", "Week 11", "Week 12", "Week 13", "Week 14", "Week 15", "Week 16", "Week 17", "Week 18", "Week 19", "Week 20", "Week 21", "Week 22", "Week 23", "Adjectives", "Shinano no Kuni"];
	const new_menu_links = ["week1.html", "week2.html", "week3.html", "week4.html", "week5.html", "week6.html", "week7.html", "week8.html", "week9.html", "week10.html", "week11.html", "week12.html", "week13.html", "week14.html", "week15.html", "week16.html", "week17.html", "week18.html", "week19.html", "week20.html", "week21.html", "week22.html", "week23.html", "adjectives.html", "shinano_no_kuni.html"];
	const new_homework_menu = document.createElement("div");
	
	for (let index=0; index < new_menu.length; index++) {
		var link = document.createElement("a");
		link.innerHTML = new_menu[index];
		link.setAttribute("href", new_menu_links[index]);
		console.log("The link is", link);
		new_homework_menu.append(link);
	}
		
	return new_homework_menu;
}

function homework_menu_1() {
	const new_menu = ["Week 1", "Week 2", "Week 3", "Week 4", "Week 5", "Week 6", "Week 7", "Week 8", "Week 9", "Week 10", "Week 11", "Week 12", "Week 13", "Week 14", "Week 15", "Week 16", "Week 17", "Week 18", "Week 19", "Week 20", "Week 21", "Week 22", "Week 23", "Adjectives", "Shinano no Kuni"];
	const new_menu_links = ["week1.html", "week2.html", "week3.html", "week4.html", "week5.html", "week6.html", "week7.html", "week8.html", "week9.html", "week10.html", "week11.html", "week12.html", "week13.html", "week14.html", "week15.html", "week16.html", "week17.html", "week18.html", "week19.html", "week20.html", "week21.html", "week22.html", "week23.html", "adjectives.html", "shinano_no_kuni.html"];
	const new_homework_menu = document.getElementsByClassName("local_menu");
	const links=[];
	
	for (let index=0; index < new_menu.length; index++) {
		var link = document.createElement("a");
		link.innerHTML = new_menu[index];
		link.setAttribute("href", new_menu_links[index]);
		console.log("The link is", link);
		links.append(link);

		return links;
	}
}

function udemy_menu() {
	const new_menu = ["Section 1", "Section 2", "Section 3", "Section 4", "Section 5", "Section 6", "Section 7", "Section 8", "Section 9", "Section 10", "Section 11", "Section 12", "Section 13", "Section 14", "Section 15"];
	const new_menu_links = ["section1.html", "section2.html", "section3.html", "section4.html", "section5.html", "section6.html", "section7.html", "section8.html", "section9.html", "section10.html", "section11.html", "section12.html", "section13.html", "section14.html", "section15.html"];
	const new_udemy_menu = document.createElement("div");
	
	for (let index=0; index < new_menu.length; index++) {
		var link = document.createElement("a");
		link.innerHTML = new_menu[index];
		link.setAttribute("href", new_menu_links[index]);
		console.log("The link is", link);
		new_udemy_menu.append(link);
	}
		
	return new_udemy_menu;
}

function addLink(base) {
	const linkDiv = document.createElement("div");
	const link = document.createElement("a");
	let link_href = base;
	console.log("Link href value is", link_href);
	// link_href = link_href.split(" ", "");
	console.log("Link href value is", link_href);
	link_href = link_href.toLowerCase() + ".html";
	const link_desc = base;
	link.innerHTML = link_desc;
	link.setAttribute("href", "/japan/language/homework/" + link_href);
	
	linkDiv.innerHTML = link;
	
	console.log(link);
	
	return linkDiv;
}

export { addCharacter, addTopGap, addTitle, addLessonHeader, addLessonLink, addVocab, addHVocab, addKVocab, homework_menu, homework_menu_1, udemy_menu, addLink }



/*
 *
 * helper functions
 *
*/