Skip to content

Instantly share code, notes, and snippets.

View amitasaurus's full-sized avatar

Amit Singh amitasaurus

12 followers · 26 following
View GitHub Profile
@amitasaurus
amitasaurus / index.html
Created May 2, 2024 05:23
HTML5 Boilerplate
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>HTML 5 Boilerplate</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
@amitasaurus
amitasaurus / getElementsByClassName.ts
Created April 30, 2024 05:12
getElementsByClassName() is a method which exists on HTML Documents and Elements to return an HTMLCollection of descendant elements within the Document/Element which has the specified class name(s).
export default function getElementsByClassName(
element: Element,
classNames: string
): Array<Element> {
const elementsArr: Element[] = [];
function traverseNode(el: Element) {
if (el.hasChildNodes()) {
el.childNodes.forEach((node) => {
const nodeEl = node as Element;
@amitasaurus
amitasaurus / textSearch.ts
Last active April 30, 2024 10:50
Given a content string and a query string, implement a function textSearch that finds all case-insensitive matches with the query string, wrapping the matches in <b>...</b> tags.
export default function textSearch(text: string, query: string): string {
if (query.length === 0) return text;
const regex = new RegExp(query, 'gi');
const matches = Array.from(text.matchAll(regex));
console.log(matches);
let offset = 0;
if (matches.length === 0) return text;
matches.forEach((match) => {
const textString = text;
const index = match.index + offset;
@amitasaurus
amitasaurus / JQuery.ts
Created April 30, 2024 03:16
jQuery (using the $ alias function), provided convenient APIs to toggle, add, and remove classes from elements via .toggleClass(), .addClass() and .removeClass().
interface JQuery {
toggleClass: (className: string, state?: boolean) => JQuery;
addClass: (className: string) => JQuery;
removeClass: (className: string) => JQuery;
}
export default function $(selector: string): JQuery {
const element = document.querySelector(selector);
return {
@amitasaurus
amitasaurus / identicalDOMTrees.ts
Last active April 30, 2024 03:15
Implement a function identicalDOMTrees that checks if two DOM trees are identical or not.
export default function identicalDOMTrees(nodeA: Node, nodeB: Node): boolean {
//traversing two root nodes at the same time and compare them
if (nodeA.nodeType !== nodeB.nodeType) return false;
if (nodeA.nodeType === Node.TEXT_NODE)
return nodeA.textContent === nodeB.textContent;
// We can assume it's an element node from here on.
const elA = nodeA as Element;
const elB = nodeB as Element;
@amitasaurus
amitasaurus / serializeHTML.ts
Created April 30, 2024 03:13
Given an object which resembles a DOM tree, implement a function that serializes the object into a formatted string with proper indentation (one tab (\t character) per nesting level) and one tag per line.
type Element = { tag: string; children: Array<string | Element> };
export default function serializeHTML(element: Element): string {
let html: string[] = [];
html.push(`<${element.tag}>`);
function traverseHTML(children: (string | Element)[]) {
children.forEach((child: string | Element) => {
let tag = '\n\t';
if (typeof child === 'string') {
@amitasaurus
amitasaurus / getElementsByTagName.ts
Created April 30, 2024 03:12
`getElementsByTagName()` is a method which exists on the Document and Element objects and returns an HTMLCollection of descendant elements within the Document/Element given a tag name.
export default function getElementsByTagName(
el: Element,
tagName: string,
): Array<Element> {
const elements: Array<Element> = [];
function traverseNode(el: Node) {
const nodes = el.childNodes;
nodes.forEach((node) => {
if (node.nodeName === tagName.toUpperCase()) {
@amitasaurus
amitasaurus / app.tsx
Created April 30, 2024 03:11
Implement the jQuery single-character function $ which only needs to supports the css() method that either gets the value of a computed style property or sets a CSS property on the matched element.
import $ from './functions/jQuery.css';
document.body.innerHTML = '<button>Click me</button>';
$('button')
.css('color', 'red')
.css('backgroundColor', 'tomato')
.css('fontSize', '16px');
$('button').css('color');
@amitasaurus
amitasaurus / gainMaxValue.ts
Last active March 5, 2024 12:07
In a computer network with n servers numbered from 1 to n, each server has an associated security value denoted by security_val[i]. A hacker aims to compromise servers in the network to maximize their total security value.
function gainMaxValue(security_val: number[], k: number): number {
let maxValue = Number.NEGATIVE_INFINITY;
for (let startNode = 0; startNode < security_val.length; startNode++) {
let currentNode = startNode;
let currentValue = security_val[startNode];
while (currentNode + k < security_val.length) {
currentNode += k;
currentValue += security_val[currentNode];
if (currentValue && currentValue > maxValue) maxValue = currentValue;
}
@amitasaurus
amitasaurus / hashtag-generator.ts
Created February 29, 2024 05:14
https://www.codewars.com/kata/52449b062fb80683ec000024/train/javascript
export default function generateHashtag(str: string): string | boolean {
if (str.length === 0) return false;
const formattedStr = str.split(' ').map(capitalise).join('');
if (formattedStr.length >= 140 || formattedStr.length === 0) return false;
return `#${formattedStr}`;
}
function capitalise(str: string): string {
if (str.length === 0) return '';
const capital = str[0].toUpperCase() + str.substring(1, str.length);