${seo.title}

import { myspaceCSS } from "https://esm.town/v/jdan/myspaceCSS"; interface MyspaceProfileArgs { displayName: string; info: { imageUrl: string; allImagesUrl?: string; status: string; gender?: string; age: number; location: string[]; lastLogin: string; }; contact: { sendMessage: string; forwardToFriend: string; addToFriends: string; addToFavorites: string; }; links: { url: string; text: string }[]; interests: { general?: string; music?: string; movies?: string; television?: string; books?: string; heroes?: string; }; details: { status?: string; hereFor?: string; hometown?: string; sign?: string; smokeDrink?: string; occupation?: string; }; schools: { details: string[]; start: string; end: string; }[]; blog: { allPostsUrl?: string; posts: { title: string; url: string }[]; }; blurbs: { aboutMe: string; whoIdLikeToMeet: string; }; top8: { allFriendsUrl?: string; friends: Friend[]; }; comments: { friend: Friend; timestamp: string; content: string; }[]; seo: { title: string; description?: string; iconUrl?: string; }; } interface Friend { name: string; url: string; imageUrl: string; } export function myspaceHtml( { displayName, links, info, contact, interests, details, schools, blog, blurbs, top8, comments, seo, }: MyspaceProfileArgs, ) { const css = myspaceCSS(); return ` ${seo.title} ${seo.description ? `` : ""} ${seo.iconUrl ? `` : ""}

${ links.map(({ url, text }) => ``).join(" | \n") }

${displayName}

${ info.allImagesUrl ? `` : "" }

		"${info.status}" ${info.gender ? info.gender + " " : ""} ${info.age} years old ${info.location.join(" ")} Last Login: ${info.lastLogin}
View more pics

Contacting ${displayName}

${displayName}'s Interests

${ interests.general ? `` : "" } ${ interests.music ? `` : "" } ${ interests.movies ? `` : "" } ${ interests.television ? `` : "" } ${ interests.books ? `` : "" } ${ interests.heroes ? `` : "" }

General	${interests.general}
Music	${interests.music}
Movies	${interests.movies}
Television	${interests.television}
Books	${interests.books}
Heroes	${interests.heroes}

${displayName}'s Details

${ details.status ? `` : "" } ${ details.hereFor ? `` : "" } ${ details.hometown ? `` : "" } ${ details.sign ? `` : "" } ${ details.smokeDrink ? `` : "" } ${ details.occupation ? `` : "" }

Status:	${details.status}
Here for:	${details.hereFor}
Hometown:	${details.hometown}
Sign:	${details.sign}
Smoke / Drink:	${details.smokeDrink}
Occupation:	${details.occupation}

${displayName}'s Schools

${ schools.map(({ details, start, end }) => ` `).join("") }

${details.join("
")}

From ${start} to ${end}

${displayName} is in your extended network

${ blog.posts.map(({ title, url }) => ` `).join("") }

${displayName}'s Latest Blog Entry ${blog.allPostsUrl ? `[See all posts]` : ""}

${title} (view more)

Jordan's Blurbs

About me:
${blurbs.aboutMe}

Who I'd like to meet:
${blurbs.whoIdLikeToMeet}

${displayName}'s Top 8

${ top8.allFriendsUrl ? `` : "" }

${top8FriendsHtml(top8.friends)}

View All of ${displayName}'s Friends

${displayName}'s Friends Comments

${comments.map(commentHtml).join("")}

`; } function top8FriendsHtml(friends: Friend[]) { // Divide friends into groups of at most four const friendRows = []; for (let i = 0; i < friends.length; i += 4) { const row = []; if (friends[i]) row.push(friends[i]); if (friends[i + 1]) row.push(friends[i + 1]); if (friends[i + 2]) row.push(friends[i + 2]); if (friends[i + 3]) row.push(friends[i + 3]); friendRows.push(row); } return friendRows.map((friends) => { return ` ${ friends.map(({ name, url, imageUrl }) => `

${name}

`).join("") } `; }).join(""); } function commentHtml(comment: { friend: Friend; timestamp: string; content: string; }) { const { friend, timestamp, content } = comment; return ` ${friend.name}

${timestamp}

${content} `; }