I have written a javascript class that contains information from a CV. It has
some helpfull methods to enable the user to print the data into the DOM. A jQuery
plugin have been created to combine my CV class and jQuery. I use a template pattern
to write the CV data into html.
CV class
CV = function() { };
CV.prototype.fillTemplate = function(jQTemplate) {
var marker = jQuery('');
for (var key in this) {
this.runThroughInfo(jQTemplate.find('.' + key), this[key], marker);
}
marker.remove();
};
CV.prototype.runThroughInfo = function(jQTemplate, infoArr, marker) {
jQTemplate.after(marker);
jQTemplate.remove();
for (var i = 0; i < infoArr.length; i++) {
var clone = jQTemplate.clone();
marker.after(clone);
for (var key in infoArr[i]) {
this.insertInfo(clone.find('.' + key), infoArr[i][key]);
}
}
};
/*
The CV class is used to contain information about a CV.
It has an array of methods used to fill the CV's
information into a html-templage.
*/
CV = function() { };
/*
fillTemplate takes a te template as parameter and starts
looping the information of the CV.
*/
CV.prototype.fillTemplate = function(jQTemplate) {
//I create a marker to reuse
var marker = jQuery('');
//Running through the CV to get to all of its data
for (var key in this) {
//Uses runThroughInfo to maschine every parkt
this.runThroughInfo(jQTemplate.find('.' + key), this[key], marker);
}
marker.remove();
};
/*
runThroughInfo runs through a part of the CV and
writes it into the template
*/
CV.prototype.runThroughInfo = function(jQTemplate, infoArr, marker) {
/*
I use encodeURI marker to mark where the info is to
be insertet. This way i can use jqTemplate as a
reuseable subtemplate.
*/
jQTemplate.after(marker);
jQTemplate.remove();
//I loop throug the chosen information
for (var i = 0; i < infoArr.length; i++) {
//I clone jQTemplate to be able to reuse it
var clone = jQTemplate.clone();
//The new clone is insertet after the marker
marker.after(clone);
for (var key in infoArr[i]) {
/*
I call insertInfo to insert data into the subtemplate
*/
this.insertInfo(clone.find('.' + key), infoArr[i][key]);
}
}
};
writeCV jQuery Plugin
/*
* jQuery rg CV plugin
*
* Version 1.1
* 23. april 2010
*
* http://rune.gronkjaer.dk
*
* Developer
* Rune Øllgaard Grønkjær
* rg@co3.dk
*
* Created with jQuery v1.4.2
* Tested with jQuery v1.4.2
*
* Usage:
* Writes a Curriculum Vitae to a html template.
*
* Changelog:
* Version 1.0:
* Created: 28. March 2010
*
* Version 1.1
* Created: 23. april 2010
* Changed:
* Fixed errors when creating the CV twice.
*/
/*
This small jQuery plugin takes a CV as parameter.
It is used by selecting a html template from the
DOM wich then is filled with data.
The plugin method returns a clone of the template
wich can be insertet back into the DOM
*/
jQuery.fn.writeCV = function(cv) {
if (this[0]) {
var cvHtmls = null;
this.each(function() {
/*
The CV template is cloned not to edit the original
*/
var cvHtml = jQuery(this).clone();
/*
I use the CV objects own fillTemplate
method to fill the template
*/
cv.fillTemplate(cvHtml);
if (!cvHtmls) {
cvHtmls = jQuery(cvHtml);
} else {
cvHtmls.add(cvHtml);
}
});
}
return cvHtmls;
};
jQuery document Ready
/*
On the document ready event i start it all by
creating a CV object and fill it with data about
my self. Then i select the CV template from the
DOM and calls the plugin method.
Everything is startet when the click event
is triggered.
*/
jQuery(function() {
var externals = jQuery('#RunesCV').find('a').not('[href^="http://rune.gronkjaer.dk"]');
for (var i = 0; i < externals.length; i++) {
externals[i].removeAttribute('onclick');
}
//Signing up for the click event on the TranslateCV button
jQuery('#TranslateCV').click(translateCV);
jQuery('#CommentCV').click(function() {
jQuery('#TranslateCV').click(translateCV);
jQuery('#RunesCV').css('display', 'none');
jQuery('#CVHtml').remove();
var runesCVMedKommentarer = jQuery('#RunesCVMedKommentarer').css('display', 'block');
jQuery('html, body').animate({
scrollTop: runesCVMedKommentarer.offset().top
}, 1000);
});
});
function translateCV() {
var cvHtml = jQuery('#CVHtml');
if (!cvHtml[0]) {
var runesCV = new CV();
//Adress information
runesCV.address = [{
name: 'Rune Oellgaard Groenkjaer',
street: 'Nygårdparken 45',
zipCity: '7400 Herning',
mobile: '30268797'
}];
//Qualifications
runesCV.qualifications = [{ primaryCompetencies: ['Advanced website development',
'Advanced grafical user interfaces for the web',
'ASP.NET and javascript',
'Umbraco CMS',
'Dynamicweb CMS'],
secondaryCompetencies: 'SQL, LINQ, CSS, XHTML, AJAX.NET, Custom ajax, Photoshop, Dynamicweb implementation, Dynamicweb ecommerce'
}];
//Experience
runesCV.workExperience = [{ place: 'Co3 A/S',
job: 'Webudvikler',
period: '2007 - 2010'
}, { place: 'Tea Solutions',
job: 'Webudvikler',
period: '2010 - ?'
}];
//Education
runesCV.education = [{ place: 'Erhvervsakademi midtjylland',
educationName: 'Graduate in Computer Science',
period: '2005 – 2007',
focus: 'ASP.NET'
},
{ place: 'IT-akademi midtjylland',
educationName: 'Multimedia designer',
period: '2001 – 2003',
focus: 'Usability and design'
},
{ place: 'Vestjyllands handelsskole',
educationName: 'higher commercial examination',
period: '1997 – 2000',
focus: 'Mathematics'}];
//Languages
runesCV.languages = [{ language: 'English',
level: 'Read, write and speak'
},
{ language: 'German',
level: 'basic knowledge'}];
//IT-knowledge
runesCV.ITKnowledge = [{ general: 'Pretty high qualifications'}];
jQuery('#RunesCV, #RunesCVMedKommentarer').css('display', 'none');
var cvTemplate = jQuery('#RunesCVTemplate');
cvHtml = cvTemplate.writeCV(runesCV);
cvHtml.attr('id', 'CVHtml').css('display', 'block');
cvTemplate.after(cvHtml);
jQuery('html, body').animate({
scrollTop: cvHtml.offset().top
}, 1000);
}
}
Qualifications
My primary qualifications:
My secundary qualifications:
Experience
Jobdescription: Place: Period:
Education
Education: Place: Period: Specialty:
Languages
Language: Level:
IT
Don't understand my CV?
Try it with comments:
Or give up and translate my CV by running the above scripts:
dansk version 
Twitter
LinkedIn