packages/contributors-view/docs/miscellaneous/variables.html
<!doctype html>
<html class="no-js" lang="">
<head>
<meta charset="utf-8">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<title>@java-patterns/contributors-view documentation</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" type="image/x-icon" href="../images/favicon.ico">
<link rel="stylesheet" href="../styles/style.css">
<link rel="stylesheet" href="../styles/dark.css">
</head>
<body>
<div class="navbar navbar-default navbar-fixed-top visible-xs">
<a href="../" class="navbar-brand">@java-patterns/contributors-view documentation</a>
<button type="button" class="btn btn-default btn-menu ion-ios-menu" id="btn-menu"></button>
</div>
<div class="xs-menu menu" id="mobile-menu">
<div id="book-search-input" role="search"><input type="text" placeholder="Type to search"></div> <compodoc-menu></compodoc-menu>
</div>
<div class="container-fluid main">
<div class="row main">
<div class="hidden-xs menu">
<compodoc-menu mode="normal"></compodoc-menu>
</div>
<!-- START CONTENT -->
<div class="content miscellaneous-variables">
<div class="content-data">
<ol class="breadcrumb">
<li>Miscellaneous</li>
<li>Variables</li>
</ol>
<section>
<h3 id="index">Index</h3>
<table class="table table-sm table-bordered index-table">
<tbody>
<tr>
<td class="col-md-4">
<ul class="index-list">
<li>
<a href="#createContributorsList" title="src/index.ts" ><b>createContributorsList</b> (src/.../index.ts)</a>
</li>
<li>
<a href="#createScreenshot" title="src/helpers/screenshots.ts" ><b>createScreenshot</b> (src/.../screenshots.ts)</a>
</li>
<li>
<a href="#editDistance" title="src/helpers/similarity.ts" ><b>editDistance</b> (src/.../similarity.ts)</a>
</li>
<li>
<a href="#fetchContributors" title="src/index.ts" ><b>fetchContributors</b> (src/.../index.ts)</a>
</li>
<li>
<a href="#green" title="src/helpers/painter.ts" ><b>green</b> (src/.../painter.ts)</a>
</li>
<li>
<a href="#init" title="src/index.ts" ><b>init</b> (src/.../index.ts)</a>
</li>
<li>
<a href="#parseLinkHeader" title="src/index.ts" ><b>parseLinkHeader</b> (src/.../index.ts)</a>
</li>
<li>
<a href="#red" title="src/helpers/painter.ts" ><b>red</b> (src/.../painter.ts)</a>
</li>
<li>
<a href="#similarity" title="src/helpers/similarity.ts" ><b>similarity</b> (src/.../similarity.ts)</a>
</li>
<li>
<a href="#toTitleCase" title="src/helpers/titleCase.ts" ><b>toTitleCase</b> (src/.../titleCase.ts)</a>
</li>
<li>
<a href="#yellow" title="src/helpers/painter.ts" ><b>yellow</b> (src/.../painter.ts)</a>
</li>
</ul>
</td>
</tr>
</tbody>
</table>
</section>
<h3>src/index.ts</h3>
<section>
<h3></h3> <table class="table table-sm table-bordered">
<tbody>
<tr>
<td class="col-md-4">
<a name="createContributorsList"></a>
<span class="name">
<span ><b>createContributorsList</b></span>
<a href="#createContributorsList"><span class="icon ion-ios-link"></span></a>
</span>
</td>
</tr>
<tr>
<td class="col-md-4">
<i>Default value : </i><code>(contributors: Contributor[]) => {
const list = contributors
.map((c) => {
return `<li title="${c.login}"><img src="${c.avatar_url}" alt="${c.login}"/></li>`
})
.join('\n')
const htmlDoctype = '<!DOCTYPE html>'
const styling = '<link rel="stylesheet" href="contributors.css">'
const generatedHtml = `${htmlDoctype}${styling}<ul>${list}</ul>`
const outputPath = path.join(__dirname, '..', 'assets', 'contributors.html')
fs.writeFileSync(outputPath, generatedHtml)
return outputPath
}</code>
</td>
</tr>
</tbody>
</table>
<table class="table table-sm table-bordered">
<tbody>
<tr>
<td class="col-md-4">
<a name="fetchContributors"></a>
<span class="name">
<span ><b>fetchContributors</b></span>
<a href="#fetchContributors"><span class="icon ion-ios-link"></span></a>
</span>
</td>
</tr>
<tr>
<td class="col-md-4">
<i>Default value : </i><code>(
page: string
): Promise<{ contributorsOfPage: Contributor[]; nextPage: string }> => {
return new Promise((resolve, reject) => {
const requestOptions: https.RequestOptions = {
method: 'GET',
hostname: 'api.github.com',
path: `/repos/AlexRogalskiy/java-patterns/contributors?page=${page}`,
port: 443,
headers: {
link: 'next',
accept: 'application/json',
'User-Agent': 'Contributors script',
},
}
const req = https.request(requestOptions, (res) => {
const {nextPage, lastPage, prevPage} = parseLinkHeader(
res.headers?.link?.toString() ?? ''
)
console.log(
'> Material Icon Theme:',
painter.yellow(
`[${page}/${
lastPage ? lastPage[1] : prevPage ? +prevPage[1] + 1 : 1
}] Loading contributors from GitHub...`
)
)
const result: Uint8Array[] = []
res.on('data', (data: Buffer) => {
result.push(data)
})
res.on('end', () => {
try {
const buffer = Buffer.concat(result)
const bufferAsString = buffer.toString('utf8')
const contributorsOfPage = JSON.parse(bufferAsString)
resolve({contributorsOfPage, nextPage: nextPage?.[1]})
} catch (error) {
reject(error)
}
})
})
req.on('error', (error) => {
console.error(error)
reject(error)
})
req.end()
})
}</code>
</td>
</tr>
<tr>
<td class="col-md-4">
<div class="io-description"><p>Get all contributors from GitHub API.</p>
</div>
</td>
</tr>
</tbody>
</table>
<table class="table table-sm table-bordered">
<tbody>
<tr>
<td class="col-md-4">
<a name="init"></a>
<span class="name">
<span ><b>init</b></span>
<a href="#init"><span class="icon ion-ios-link"></span></a>
</span>
</td>
</tr>
<tr>
<td class="col-md-4">
<i>Default value : </i><code>async () => {
const contributorsList: Contributor[] = []
let page = '1'
// iterate over the pages of GitHub API
while (page !== undefined) {
const result = await fetchContributors(page)
contributorsList.push(...result.contributorsOfPage)
page = result.nextPage
}
if (contributorsList.length > 0) {
console.log(
'> Material Icon Theme:',
painter.green('Successfully fetched all contributors from GitHub!')
)
} else {
console.log(
'> Material Icon Theme:',
painter.red('Error: Could not fetch contributors from GitHub!')
)
throw Error()
}
const outputPath = createContributorsList(contributorsList)
// create the image
console.log('> Material Icon Theme:', painter.yellow('Creating image...'))
const fileName = 'contributors'
createScreenshot(outputPath, fileName)
.then(() => {
console.log(
'> Material Icon Theme:',
painter.green(`Successfully created ${fileName} image!`)
)
})
.catch(() => {
throw Error(painter.red(`Error while creating ${fileName} image`))
})
}</code>
</td>
</tr>
</tbody>
</table>
<table class="table table-sm table-bordered">
<tbody>
<tr>
<td class="col-md-4">
<a name="parseLinkHeader"></a>
<span class="name">
<span ><b>parseLinkHeader</b></span>
<a href="#parseLinkHeader"><span class="icon ion-ios-link"></span></a>
</span>
</td>
</tr>
<tr>
<td class="col-md-4">
<i>Default value : </i><code>(linkHeader: string) => {
const nextPagePattern = new RegExp(/\bpage=(\d)[^>]*>\srel="next"/)
const lastPagePattern = new RegExp(/\bpage=(\d)[^>]*>\srel="last"/)
const prevPagePattern = new RegExp(/\bpage=(\d)[^>]*>\srel="prev"/)
const nextPage = nextPagePattern.exec(linkHeader) ?? ''
const lastPage = lastPagePattern.exec(linkHeader) ?? ''
const prevPage = prevPagePattern.exec(linkHeader) ?? ''
return {nextPage, lastPage, prevPage}
}</code>
</td>
</tr>
<tr>
<td class="col-md-4">
<div class="io-description"><p>Parse link header</p>
</div>
</td>
</tr>
</tbody>
</table>
</section>
<h3>src/helpers/screenshots.ts</h3>
<section>
<h3></h3> <table class="table table-sm table-bordered">
<tbody>
<tr>
<td class="col-md-4">
<a name="createScreenshot"></a>
<span class="name">
<span ><b>createScreenshot</b></span>
<a href="#createScreenshot"><span class="icon ion-ios-link"></span></a>
</span>
</td>
</tr>
<tr>
<td class="col-md-4">
<i>Default value : </i><code>async (filePath: string, fileName: string) => {
try {
const htmlFilePath = path.join('file:', filePath)
const browser = await puppeteer.launch()
const page = await browser.newPage()
await page.setViewport({
height: 10,
width: 1000,
})
await page.goto(htmlFilePath)
await page.screenshot({
path: `${process.env.IMAGE_DIR}/${fileName}.png`,
omitBackground: true,
fullPage: true,
})
await browser.close()
} catch (error) {
console.error(error)
throw Error('Could not create screenshot for a preview')
}
}</code>
</td>
</tr>
<tr>
<td class="col-md-4">
<div class="io-description"><p>Create a screenshot from an HTML file and save it as image.</p>
</div>
</td>
</tr>
</tbody>
</table>
</section>
<h3>src/helpers/similarity.ts</h3>
<section>
<h3></h3> <table class="table table-sm table-bordered">
<tbody>
<tr>
<td class="col-md-4">
<a name="editDistance"></a>
<span class="name">
<span ><b>editDistance</b></span>
<a href="#editDistance"><span class="icon ion-ios-link"></span></a>
</span>
</td>
</tr>
<tr>
<td class="col-md-4">
<i>Default value : </i><code>(s1: string, s2: string) => {
s1 = s1.toLowerCase()
s2 = s2.toLowerCase()
const costs = new Array<number>()
for (let i = 0; i <= s1.length; i++) {
let lastValue = i
for (let j = 0; j <= s2.length; j++) {
if (i === 0) {
costs[j] = j
} else {
if (j > 0) {
let newValue = costs[j - 1]
if (s1.charAt(i - 1) !== s2.charAt(j - 1)) {
newValue = Math.min(Math.min(newValue, lastValue), costs[j]) + 1
}
costs[j - 1] = lastValue
lastValue = newValue
}
}
}
if (i > 0) {
costs[s2.length] = lastValue
}
}
return costs[s2.length]
}</code>
</td>
</tr>
</tbody>
</table>
<table class="table table-sm table-bordered">
<tbody>
<tr>
<td class="col-md-4">
<a name="similarity"></a>
<span class="name">
<span ><b>similarity</b></span>
<a href="#similarity"><span class="icon ion-ios-link"></span></a>
</span>
</td>
</tr>
<tr>
<td class="col-md-4">
<i>Default value : </i><code>(s1: string, s2: string) => {
let longer = s1
let shorter = s2
if (s1.length < s2.length) {
longer = s2
shorter = s1
}
const longerLength = longer.length
if (longerLength === 0) {
return 1.0
}
return (longerLength - editDistance(longer, shorter)) / longerLength
}</code>
</td>
</tr>
<tr>
<td class="col-md-4">
<div class="io-description"><p>Compares two strings and returns the Levenshtein distance</p>
</div>
</td>
</tr>
</tbody>
</table>
</section>
<h3>src/helpers/painter.ts</h3>
<section>
<h3></h3> <table class="table table-sm table-bordered">
<tbody>
<tr>
<td class="col-md-4">
<a name="green"></a>
<span class="name">
<span ><b>green</b></span>
<a href="#green"><span class="icon ion-ios-link"></span></a>
</span>
</td>
</tr>
<tr>
<td class="col-md-4">
<i>Default value : </i><code>(value: string) => `\x1b[32m${value}\x1b[0m`</code>
</td>
</tr>
</tbody>
</table>
<table class="table table-sm table-bordered">
<tbody>
<tr>
<td class="col-md-4">
<a name="red"></a>
<span class="name">
<span ><b>red</b></span>
<a href="#red"><span class="icon ion-ios-link"></span></a>
</span>
</td>
</tr>
<tr>
<td class="col-md-4">
<i>Default value : </i><code>(value: string) => `\x1b[31m${value}\x1b[0m`</code>
</td>
</tr>
</tbody>
</table>
<table class="table table-sm table-bordered">
<tbody>
<tr>
<td class="col-md-4">
<a name="yellow"></a>
<span class="name">
<span ><b>yellow</b></span>
<a href="#yellow"><span class="icon ion-ios-link"></span></a>
</span>
</td>
</tr>
<tr>
<td class="col-md-4">
<i>Default value : </i><code>(value: string) => `\x1b[33m${value}\x1b[0m`</code>
</td>
</tr>
</tbody>
</table>
</section>
<h3>src/helpers/titleCase.ts</h3>
<section>
<h3></h3> <table class="table table-sm table-bordered">
<tbody>
<tr>
<td class="col-md-4">
<a name="toTitleCase"></a>
<span class="name">
<span ><b>toTitleCase</b></span>
<a href="#toTitleCase"><span class="icon ion-ios-link"></span></a>
</span>
</td>
</tr>
<tr>
<td class="col-md-4">
<i>Default value : </i><code>(str: string): string => {
return str.replace(
/\w\S*/g,
(txt) => txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase()
)
}</code>
</td>
</tr>
<tr>
<td class="col-md-4">
<div class="io-description"><p>TitleCase all words in a string</p>
</div>
</td>
</tr>
</tbody>
</table>
</section>
</div><div class="search-results">
<div class="has-results">
<h1 class="search-results-title"><span class='search-results-count'></span> results matching "<span class='search-query'></span>"</h1>
<ul class="search-results-list"></ul>
</div>
<div class="no-results">
<h1 class="search-results-title">No results matching "<span class='search-query'></span>"</h1>
</div>
</div>
</div>
<!-- END CONTENT -->
</div>
</div>
<label class="dark-mode-switch">
<input type="checkbox">
<span class="slider">
<svg class="slider-icon" viewBox="0 0 24 24" fill="none" height="20" stroke="#000" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" width="20" xmlns="http://www.w3.org/2000/svg">
<path d="M21 12.79A9 9 0 1111.21 3 7 7 0 0021 12.79z"></path>
</svg>
</span>
</label>
<script>
var COMPODOC_CURRENT_PAGE_DEPTH = 1;
var COMPODOC_CURRENT_PAGE_CONTEXT = 'miscellaneous-variables';
var COMPODOC_CURRENT_PAGE_URL = 'variables.html';
var MAX_SEARCH_RESULTS = 15;
</script>
<script src="../js/libs/custom-elements.min.js"></script>
<script src="../js/libs/lit-html.js"></script>
<script src="../js/menu-wc.js" defer></script>
<script nomodule src="../js/menu-wc_es5.js" defer></script>
<script src="../js/libs/bootstrap-native.js"></script>
<script src="../js/libs/es6-shim.min.js"></script>
<script src="../js/libs/EventDispatcher.js"></script>
<script src="../js/libs/promise.min.js"></script>
<script src="../js/libs/zepto.min.js"></script>
<script src="../js/compodoc.js"></script>
<script src="../js/tabs.js"></script>
<script src="../js/menu.js"></script>
<script src="../js/libs/clipboard.min.js"></script>
<script src="../js/libs/prism.js"></script>
<script src="../js/sourceCode.js"></script>
<script src="../js/search/search.js"></script>
<script src="../js/search/lunr.min.js"></script>
<script src="../js/search/search-lunr.js"></script>
<script src="../js/search/search_index.js"></script>
<script src="../js/lazy-load-graphs.js"></script>
</body>
</html>