ilia/resume
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

ADD auto adjust font size

Browse Source
This commit is contained in:
unpregnant 2017-02-07 22:19:22 +01:00
parent 049aaafeab
commit 6150d916e1
25 changed files with 117 additions and 210 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
less/style.less
View File

@ -22,6 +22,11 @@ body {
display: block;
page-break-after: auto;
overflow: hidden;
.resume {
display: inline-block;
width: 100%;
}
}
#forkme {

58
lib/htmlToPdf.js
View File

@ -1,58 +0,0 @@
let convertToPdf = (() => {
var _ref = _asyncToGenerator(function* () {
const layoutTemplate = yield readFileContent('views/layout.mustache');
for (let resume of directories) {
const resumeTemplate = yield readFileContent(resume + '/' + resume + '.mustache');
const html = Mustache.render(layoutTemplate, {
person: person
}, {
content: resumeTemplate
});
yield generatePdf(html, resume + '.pdf');
}
console.log('Generated resumes into /pdf.');
});
return function convertToPdf() {
return _ref.apply(this, arguments);
};
})();
function _asyncToGenerator(fn) { return function () { var gen = fn.apply(this, arguments); return new Promise(function (resolve, reject) { function step(key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { return Promise.resolve(value).then(function (value) { step("next", value); }, function (err) { step("throw", err); }); } } return step("next"); }); }; }
const person = require('./person.js');
const Mustache = require('mustache');
const pdf = require('html-pdf');
const fs = require('fs');
const path = require('path');
const dir = __dirname.replace('lib', '');
const directories = getDirectories(dir + '/resumes');
function getDirectories(srcpath) {
return fs.readdirSync(srcpath).filter(file => file.includes('resume-'));
}
function readFileContent(fileName) {
const dir = path.join(__dirname, '../resumes/' + fileName);
return new Promise((res, rej) => {
fs.readFile(dir, 'utf8', (err, template) => {
if (err) rej(err);else res(template);
});
});
}
function generatePdf(html, fileName) {
const dir = path.join(__dirname, '../pdf/' + fileName);
return new Promise((resolve, rej) => {
pdf.create(html, {
'type': 'pdf',
'format': 'A4',
'base': 'http://localhost:3000'
}).toFile(dir, function (err, res) {
if (err) rej(err);else resolve();
});
});
}
convertToPdf();

62
lib/person.js
View File

@ -1,62 +0,0 @@
module.exports = {
name: 'John Doe',
position: 'Software Developer',
experience: [{
company: 'Company A',
position: 'Developer',
timeperiod: 'since January 2016',
description: 'Programming and watching cute cat videos.'
}, {
company: 'Company B',
position: 'Frontend Developer',
timeperiod: 'January 2015 - December 2015',
description: 'Fulfillment of extremly important tasks.'
}, {
company: 'Company C',
position: 'Trainee',
timeperiod: 'March 2014 - December 2014',
description: 'Making coffee and baking cookies.'
}],
education: [{
degree: 'Master of Arts',
description: 'Major in Hacking and Computer Penetration, University A, New York, USA.'
}, {
degree: 'Bachelor of Science',
description: 'Major in Engineering, University B, Los Angeles, USA.'
}],
// skill level goes 0 to 100
skills: [{
name: 'HTML5',
level: '99'
}, {
name: 'CSS3',
level: '95'
}, {
name: 'JavaScript',
level: '97'
}, {
name: 'Node.js',
level: '93'
}, {
name: 'Angular 2',
level: '60'
}, {
name: 'TypeScript',
level: '80'
}, {
name: 'ES.Next',
level: '70'
}, {
name: 'Docker',
level: '99'
}],
skillDescription: 'Also proficient in Adobe Photoshop and Illustrator, grew up bilingual (English and Klingon).',
contact: {
email: 'john.doe@email.com',
phone: '0123 456789',
street: '1234 Broadway',
city: 'New York',
website: 'johndoe.com',
github: 'github.com/JohnDoe'
}
};

36
lib/renderReadMe.js
View File

@ -1,36 +0,0 @@
let renderReadMe = (() => {
var _ref = _asyncToGenerator(function* () {
const readme = yield readFileContent('README.md');
const githubPagesTemplate = yield readFileContent('resumes/views/githubPages.mustache');
var html = Mustache.render(githubPagesTemplate, {
content: readme
});
writeFile('index.html', html, function (err) {
if (err) console.log(err);else console.log('Github pages index.html was successfully generated from README.');
});
});
return function renderReadMe() {
return _ref.apply(this, arguments);
};
})();
function _asyncToGenerator(fn) { return function () { var gen = fn.apply(this, arguments); return new Promise(function (resolve, reject) { function step(key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { return Promise.resolve(value).then(function (value) { step("next", value); }, function (err) { step("throw", err); }); } } return step("next"); }); }; }
const showdown = require('showdown');
const converter = new showdown.Converter();
const fs = require('fs');
const path = require('path');
const Mustache = require('mustache');
const writeFile = require('write');
function readFileContent(fileName) {
const dir = path.join(__dirname, '../' + fileName);
return new Promise((res, rej) => {
fs.readFile(dir, 'utf8', (err, template) => {
if (err) rej(err);else res(template);
});
});
}
renderReadMe();

40
lib/server.js
View File

@ -1,40 +0,0 @@
const path = require('path');
const fs = require('fs');
const person = require('./person.js');
const express = require('express');
const mustacheExpress = require('mustache-express');
let app = express();
app.set('views', path.join(__dirname, '../resumes'));
app.engine('mustache', require('hogan-express'));
app.set('view engine', 'mustache');
app.use(express.static(path.join(__dirname, '../public')));
app.use(express.static(path.join(__dirname, '../node_modules')));
const dir = __dirname.replace('lib', '');
const directories = getDirectories(dir + '/resumes');
function getDirectories(srcpath) {
return fs.readdirSync(srcpath).filter(file => file.includes('resume-'));
}
app.get('/', (req, res) => {
res.render('views/layout', {
partials: {
content: 'views/index'
}
});
});
for (let resume of directories) {
app.get('/' + resume, (req, res) => {
res.render('views/layout', {
partials: {
content: resume + '/' + resume
},
person: person
});
});
}
app.listen(3000, '0.0.0.0', () => console.log('Listening on localhost:3000!'));

0
lib/util.js
View File

BIN
pdf/resume-1.pdf
View File

Binary file not shown.

BIN
pdf/resume-2.pdf
View File

Binary file not shown.

BIN
pdf/resume-3.pdf
View File

Binary file not shown.

BIN
pdf/resume-4.pdf
View File

Binary file not shown.

BIN
pdf/resume-5.pdf
View File

Binary file not shown.

BIN
pdf/resume-6.pdf
View File

Binary file not shown.

92
public/javascript.js Normal file
View File

@ -0,0 +1,92 @@
// minimum margin of content to bottom of page
var marginBottom = 50;
// DOM-element of <page></page>
var page;
/**
* gets all DOM-elements on page
* @return {HTMLElement[]} DOM-elements
*/
function getAllDOMElements() {
return document.getElementsByTagName('*');
}
/**
* gets DOM-element of #resumeX
* @return {HTMLElement}
*/
function getResumeDOMElement() {
return page.children[0];
}
/**
* sets variable "page" to DOM-element of <page></page>
*/
function setPageDOMElement() {
page = document.getElementsByTagName('page')[0];
}
/**
* checks whether font needs to be fixed, and if fixes it
*/
function checkFont() {
var resume = getResumeDOMElement();
if (contentIsGreaterThanPage(resume)) fixFont();
}
/**
* checks whether content is greater than page
* @param {HTMLElement} resume
* @return {Boolean} false if content fits to page
*/
function contentIsGreaterThanPage(resume) {
var pageHeight = page.offsetHeight;
var resumeHeight = resume.offsetHeight + marginBottom;
if (pageHeight < resumeHeight) return true;
else return false;
}
/**
* gets font size of DOM-elemnt
* @param {HTMLElement} element
* @return {Number} font size of element
*/
function getFontSizeOfElement(element) {
var style = window.getComputedStyle(element, null).getPropertyValue('font-size');
return parseFloat(style);
}
/**
* sets font size of DOM-element
* @param {HTMLElement} element
* @param {Number} fontSize
*/
function setFontSizeOfElement(element, fontSize) {
element.style.fontSize = fontSize + 'px';
}
/**
* decreases font size of all DOM-elements
*/
function decreaseFontSizes() {
var elements = getAllDOMElements();
var current;
for (var i = 0; i < elements.length; i++) {
current = elements[i];
console.log(getFontSizeOfElement(current));
newFontSize = getFontSizeOfElement(current) * 0.99;
setFontSizeOfElement(current, newFontSize);
}
}
/**
* decreases font size until content fits to page
*/
function fixFont() {
decreaseFontSizes();
var resume = getResumeDOMElement();
if (contentIsGreaterThanPage(resume)) fixFont();
}
setPageDOMElement();
checkFont();

2
public/style.min.css vendored
View File

File diff suppressed because one or more lines are too long

4
resumes/resume-1/resume-1.less
View File

@ -58,8 +58,8 @@
margin-bottom: 5px;
font-family: 'Open Sans', sans-serif;
font-size: 35px;
font-weight: bold;
letter-spacing: 5px;
font-weight: 600;
letter-spacing: 10px;
}
.position {

2
resumes/resume-1/resume-1.mustache
View File

@ -1,5 +1,5 @@
<page class="a4">
<div id="resume1">
<div id="resume1" class="resume">
<div class="row text-center">
<span class="name">{{person.name}}</span>
</div>

6
resumes/resume-2/resume-2.less
View File

@ -2,7 +2,6 @@
#resume2 {
font-family: 'Raleway', sans-serif;
font-weight: 200;
h3 {
text-transform: uppercase;
@ -106,7 +105,6 @@
.row {
&:first-child {
font-size: 19px;
margin-bottom: 3px;
}
@ -114,6 +112,10 @@
text-transform: uppercase;
font-size: 19px;
}
.job-title {
font-size: 19px;
}
}
}

2
resumes/resume-2/resume-2.mustache
View File

@ -1,5 +1,5 @@
<page class="a4">
<div id="resume2">
<div id="resume2" class="resume">
<div class="top-row">
<span class="person-name"> {{person.name}} </span>
<span class="person-position"> {{person.position}} </span>

2
resumes/resume-3/resume-3.mustache
View File

@ -1,6 +1,6 @@
<page class="a4">
<div id="resume3">
<div id="resume3" class="resume">
<div class="resume-header">
<div class="triangle"></div>
<div class="person-header">

1
resumes/resume-4/resume-4.less
View File

@ -15,6 +15,7 @@
a:focus,
a:hover {
color: @textDark;
text-decoration: none;
}
.card {

2
resumes/resume-4/resume-4.mustache
View File

@ -1,6 +1,6 @@
<page class="a4 resume4">
<div id="resume4">
<div id="resume4" class="resume">
<div class="resume-header">
<div class="box"></div>
<div class="person-header">

2
resumes/resume-5/resume-5.mustache
View File

@ -1,5 +1,5 @@
<page class="a4 resume4">
<div id="resume5">
<div id="resume5" class="resume">
<div class="introduction">
<div class="wrapper">
<div class="img">

8
resumes/resume-6/resume-6.less
View File

@ -3,6 +3,7 @@
font-family: 'TypoPRO Montserrat';
font-weight: 300;
}
@fontSize: 20px;
#resume6 {
color: white;
@ -42,7 +43,7 @@
.person-name {
width: 100%;
margin-bottom: 10px;
font-size: 20px;
font-size: @fontSize;
}
.person-position {
@ -65,6 +66,7 @@
.skills-other {
color: rgba(154,154,154,.8);
text-align: center;
}
.skills-block {
@ -119,7 +121,7 @@
.education-block,
.experience-block {
font-size: 20px;
font-size: @fontSize;
padding: 20px;
border-bottom: 1px #262626 solid;
color: rgba(154, 154, 154, 0.8);
@ -138,7 +140,7 @@
table {
color: #9a9a9a;
padding: 20px;
font-size: 20px;
font-size: @fontSize;
font-weight: 300;
a,

2
resumes/resume-6/resume-6.mustache
View File

@ -1,5 +1,5 @@
<page class="a4 resume6">
<div id="resume6">
<div id="resume6" class="resume">
<div class="left-col">
<div class="person-box">
<div class="img"></div>

1
resumes/views/layout.mustache
View File

@ -13,6 +13,7 @@
{{>content}}
<script src="/javascript.js"></script>
</body>
</html>