Built with blockbuilder.org
<!DOCTYPE html>
<html lang="en"></html>
<head>
<meta charset="utf-5">
<title>Nina Stawski</title>
<meta name="description">
<meta name="author" content="Nina Stawski">
<link rel="stylesheet" href="ns.css">
<script src="ns.js"></script>
<script src="d3.js"></script>
<script src="d3.layout.cloud.js"></script>
<script src="jquery.js"></script>
<style>
#content-right {
font: 13px sans-serif;
margin-right: -32px;
}
</style>
<script>
jQuery.fn.d3Click = function () {
this.each(function (i, e) {
var evt = document.createEvent("MouseEvents");
evt.initMouseEvent("click", true, true, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
e.dispatchEvent(evt);
});
};
</script>
<script>
$(document).ready(function () {
$(".btn path").eq(16).d3Click();
d3.selectAll("path").on("click", null);
});
</script>
</head>
<body>
<div id="content-right" style="margin-top: 10px;">
<script>var matrix = returnMatrixSfsu();</script>
<script>var matrix = returnMatrixSfsu();</script>
<script>
var chord = d3.layout.chord()
.padding(0.1)
.matrix(matrix);
var width = 326,
height = 360,
innerRadius = Math.min(width, height) * .21,
outerRadius = innerRadius * 1.4;
var fill = d3.scale.ordinal()
.domain(d3.range(4))
.range(["#5958A1", "#5958A1", "#996699", "#996699", "#996699", "#813742", "#813742", "#813742", "#813742", "#813742", "#813742", "#813742", "#813742", "#813742", "#813742", "#813742", "#5958A1", "#996699", "#813742"]);
var svg = d3.select("#content-right").append("svg")
.attr("width", width)
.attr("height", height)
.append("g")
.attr("transform", "translate(" + width / 2.18 + "," + height / 2.01 + ")");
svg.append("g")
.attr("class", "btn")
.selectAll("path")
.data(chord.groups)
.enter().append("path")
.style("fill", function(d) { return fill(d.index); })
.style("stroke", function(d) { return fill(d.index); })
.attr("d", d3.svg.arc().innerRadius(innerRadius).outerRadius(outerRadius))
.on("click", selectElement())
var ticks = svg.append("g").selectAll("g")
.data(chord.groups)
.enter().append("g").selectAll("g")
.data(groupTicks)
.enter().append("g")
.attr("transform", function(d) {
return "rotate(" + (d.angle * 180 / Math.PI - 90) + ")"
+ "translate(" + outerRadius + ",0)";
});
// ticks.append("line")
// .attr("x1", 1)
// .attr("y1", 0)
// .attr("x2", 5)
// .attr("y2", 0)
// .style("stroke", "#999");
ticks.append("text")
.attr("x", 8)
.attr("dy", ".3em")
.attr("transform", function(d) { return d.angle > Math.PI ? "rotate(180)translate(-16)" : null; })
.style("text-anchor", function(d) { return d.angle > Math.PI ? "end" : null; })
.text(function(d) { return d.label; });
svg.append("g")
.attr("class", "chord")
.selectAll("path")
.data(chord.chords)
.enter().append("path")
.attr("d", d3.svg.chord().radius(innerRadius))
.style("fill", function(d) { return fill(d.target.index); })
.style("opacity", 1);
// Returns an array of tick angles and labels, given a group.
function groupTicks(d) {
var k = (d.endAngle - d.startAngle) / d.value;
var labels = ['Illustrator', 'Photoshop', 'Wireframing', 'Prototyping', 'OmniGraffle', 'Python', 'Javascript', 'jQuery', 'jQueryUI', 'jQueryMobile', 'HTML5', 'CSS3', 'Bootstrap', 'GIT', 'jsPlumb', 'PHP', 'Design', 'UX/UI', 'Programming'
];
return d3.range(0, d.value, 1000).map(function(v, i) {
return {
angle: k*0.5 + d.startAngle,
label: labels[d.index]
};
});
}
// Returns an event handler for fading a given chord group.
function fade(opacity) {
return function(g, i) {
svg.selectAll(".chord path")
.filter(function(d) { return d.source.index != i && d.target.index != i; })
.transition()
.duration(100)
.style("opacity", opacity);
};
}
function selectElement() {
return function(g, i) {
var indexes = [];
makeSelection(svg.selectAll(".chord path"), indexes);
selectOther($("g text"), indexes);
selectOther($(".btn path"), indexes);
function makeSelection(selection, indexes) {
indexes.push(i);
selection
.filter(function(d) { return d.source.index != i && d.target.index != i; })
.transition()
.duration(100)
.style("opacity", 0.1);
selection
.filter(function(d) {
if (d.target.index == i) {
indexes.push(d.source.index)
} else if (d.source.index == i && indexes.indexOf(d.target.index) == -1) {
indexes.push(d.target.index)
}; return d.source.index == i || d.target.index == i; })
.transition()
.duration(100)
.style("opacity", 1);
}
function selectOther(selection, indexes) {
selection
.each(function(d){
if (indexes.indexOf(d) == -1) {
$(this)
.css({"opacity" : 0.4, "font-weight" : "normal"});
}
else {
$(this)
.css({"opacity" : 1, "font-weight" : "bold"});
}
})
}
}
}
</script>
</div>
</body>// Word cloud layout by Jason Davies, http://www.jasondavies.com/word-cloud/
// Algorithm due to Jonathan Feinberg, http://static.mrfeinberg.com/bv_ch03.pdf
(function(exports) {
function cloud() {
var size = [256, 256],
text = cloudText,
font = cloudFont,
fontSize = cloudFontSize,
fontStyle = cloudFontNormal,
fontWeight = cloudFontNormal,
rotate = cloudRotate,
padding = cloudPadding,
spiral = archimedeanSpiral,
words = [],
timeInterval = Infinity,
event = d3.dispatch("word", "end"),
timer = null,
cloud = {};
cloud.start = function() {
var board = zeroArray((size[0] >> 5) * size[1]),
bounds = null,
n = words.length,
i = -1,
tags = [],
data = words.map(function(d, i) {
d.text = text.call(this, d, i);
d.font = font.call(this, d, i);
d.style = fontStyle.call(this, d, i);
d.weight = fontWeight.call(this, d, i);
d.rotate = rotate.call(this, d, i);
d.size = ~~fontSize.call(this, d, i);
d.padding = cloudPadding.call(this, d, i);
return d;
}).sort(function(a, b) { return b.size - a.size; });
if (timer) clearInterval(timer);
timer = setInterval(step, 0);
step();
return cloud;
function step() {
var start = +new Date,
d;
while (+new Date - start < timeInterval && ++i < n && timer) {
d = data[i];
d.x = (size[0] * (Math.random() + .5)) >> 1;
d.y = (size[1] * (Math.random() + .5)) >> 1;
cloudSprite(d, data, i);
if (d.hasText && place(board, d, bounds)) {
tags.push(d);
event.word(d);
if (bounds) cloudBounds(bounds, d);
else bounds = [{x: d.x + d.x0, y: d.y + d.y0}, {x: d.x + d.x1, y: d.y + d.y1}];
// Temporary hack
d.x -= size[0] >> 1;
d.y -= size[1] >> 1;
}
}
if (i >= n) {
cloud.stop();
event.end(tags, bounds);
}
}
}
cloud.stop = function() {
if (timer) {
clearInterval(timer);
timer = null;
}
return cloud;
};
cloud.timeInterval = function(x) {
if (!arguments.length) return timeInterval;
timeInterval = x == null ? Infinity : x;
return cloud;
};
function place(board, tag, bounds) {
var perimeter = [{x: 0, y: 0}, {x: size[0], y: size[1]}],
startX = tag.x,
startY = tag.y,
maxDelta = Math.sqrt(size[0] * size[0] + size[1] * size[1]),
s = spiral(size),
dt = Math.random() < .5 ? 1 : -1,
t = -dt,
dxdy,
dx,
dy;
while (dxdy = s(t += dt)) {
dx = ~~dxdy[0];
dy = ~~dxdy[1];
if (Math.min(dx, dy) > maxDelta) break;
tag.x = startX + dx;
tag.y = startY + dy;
if (tag.x + tag.x0 < 0 || tag.y + tag.y0 < 0 ||
tag.x + tag.x1 > size[0] || tag.y + tag.y1 > size[1]) continue;
// TODO only check for collisions within current bounds.
if (!bounds || !cloudCollide(tag, board, size[0])) {
if (!bounds || collideRects(tag, bounds)) {
var sprite = tag.sprite,
w = tag.width >> 5,
sw = size[0] >> 5,
lx = tag.x - (w << 4),
sx = lx & 0x7f,
msx = 32 - sx,
h = tag.y1 - tag.y0,
x = (tag.y + tag.y0) * sw + (lx >> 5),
last;
for (var j = 0; j < h; j++) {
last = 0;
for (var i = 0; i <= w; i++) {
board[x + i] |= (last << msx) | (i < w ? (last = sprite[j * w + i]) >>> sx : 0);
}
x += sw;
}
delete tag.sprite;
return true;
}
}
}
return false;
}
cloud.words = function(x) {
if (!arguments.length) return words;
words = x;
return cloud;
};
cloud.size = function(x) {
if (!arguments.length) return size;
size = [+x[0], +x[1]];
return cloud;
};
cloud.font = function(x) {
if (!arguments.length) return font;
font = d3.functor(x);
return cloud;
};
cloud.fontStyle = function(x) {
if (!arguments.length) return fontStyle;
fontStyle = d3.functor(x);
return cloud;
};
cloud.fontWeight = function(x) {
if (!arguments.length) return fontWeight;
fontWeight = d3.functor(x);
return cloud;
};
cloud.rotate = function(x) {
if (!arguments.length) return rotate;
rotate = d3.functor(x);
return cloud;
};
cloud.text = function(x) {
if (!arguments.length) return text;
text = d3.functor(x);
return cloud;
};
cloud.spiral = function(x) {
if (!arguments.length) return spiral;
spiral = spirals[x + ""] || x;
return cloud;
};
cloud.fontSize = function(x) {
if (!arguments.length) return fontSize;
fontSize = d3.functor(x);
return cloud;
};
cloud.padding = function(x) {
if (!arguments.length) return padding;
padding = d3.functor(x);
return cloud;
};
return d3.rebind(cloud, event, "on");
}
function cloudText(d) {
return d.text;
}
function cloudFont() {
return "serif";
}
function cloudFontNormal() {
return "normal";
}
function cloudFontSize(d) {
return Math.sqrt(d.value);
}
function cloudRotate() {
return (~~(Math.random() * 6) - 3) * 30;
}
function cloudPadding() {
return 1;
}
// Fetches a monochrome sprite bitmap for the specified text.
// Load in batches for speed.
function cloudSprite(d, data, di) {
if (d.sprite) return;
c.clearRect(0, 0, (cw << 5) / ratio, ch / ratio);
var x = 0,
y = 0,
maxh = 0,
n = data.length;
--di;
while (++di < n) {
d = data[di];
c.save();
c.font = d.style + " " + d.weight + " " + ~~((d.size + 1) / ratio) + "px " + d.font;
var w = c.measureText(d.text + "m").width * ratio,
h = d.size << 1;
if (d.rotate) {
var sr = Math.sin(d.rotate * cloudRadians),
cr = Math.cos(d.rotate * cloudRadians),
wcr = w * cr,
wsr = w * sr,
hcr = h * cr,
hsr = h * sr;
w = (Math.max(Math.abs(wcr + hsr), Math.abs(wcr - hsr)) + 0x1f) >> 5 << 5;
h = ~~Math.max(Math.abs(wsr + hcr), Math.abs(wsr - hcr));
} else {
w = (w + 0x1f) >> 5 << 5;
}
if (h > maxh) maxh = h;
if (x + w >= (cw << 5)) {
x = 0;
y += maxh;
maxh = 0;
}
if (y + h >= ch) break;
c.translate((x + (w >> 1)) / ratio, (y + (h >> 1)) / ratio);
if (d.rotate) c.rotate(d.rotate * cloudRadians);
c.fillText(d.text, 0, 0);
c.restore();
d.width = w;
d.height = h;
d.xoff = x;
d.yoff = y;
d.x1 = w >> 1;
d.y1 = h >> 1;
d.x0 = -d.x1;
d.y0 = -d.y1;
d.hasText = true;
x += w;
}
var pixels = c.getImageData(0, 0, (cw << 5) / ratio, ch / ratio).data,
sprite = [];
while (--di >= 0) {
d = data[di];
if (!d.hasText) continue;
var w = d.width,
w32 = w >> 5,
h = d.y1 - d.y0,
p = d.padding;
// Zero the buffer
for (var i = 0; i < h * w32; i++) sprite[i] = 0;
x = d.xoff;
if (x == null) return;
y = d.yoff;
var seen = 0,
seenRow = -1;
for (var j = 0; j < h; j++) {
for (var i = 0; i < w; i++) {
var k = w32 * j + (i >> 5),
m = pixels[((y + j) * (cw << 5) + (x + i)) << 2] ? 1 << (31 - (i % 32)) : 0;
if (p) {
if (j) sprite[k - w32] |= m;
if (j < w - 1) sprite[k + w32] |= m;
m |= (m << 1) | (m >> 1);
}
sprite[k] |= m;
seen |= m;
}
if (seen) seenRow = j;
else {
d.y0++;
h--;
j--;
y++;
}
}
d.y1 = d.y0 + seenRow;
d.sprite = sprite.slice(0, (d.y1 - d.y0) * w32);
}
}
// Use mask-based collision detection.
function cloudCollide(tag, board, sw) {
sw >>= 5;
var sprite = tag.sprite,
w = tag.width >> 5,
lx = tag.x - (w << 4),
sx = lx & 0x7f,
msx = 32 - sx,
h = tag.y1 - tag.y0,
x = (tag.y + tag.y0) * sw + (lx >> 5),
last;
for (var j = 0; j < h; j++) {
last = 0;
for (var i = 0; i <= w; i++) {
if (((last << msx) | (i < w ? (last = sprite[j * w + i]) >>> sx : 0))
& board[x + i]) return true;
}
x += sw;
}
return false;
}
function cloudBounds(bounds, d) {
var b0 = bounds[0],
b1 = bounds[1];
if (d.x + d.x0 < b0.x) b0.x = d.x + d.x0;
if (d.y + d.y0 < b0.y) b0.y = d.y + d.y0;
if (d.x + d.x1 > b1.x) b1.x = d.x + d.x1;
if (d.y + d.y1 > b1.y) b1.y = d.y + d.y1;
}
function collideRects(a, b) {
return a.x + a.x1 > b[0].x && a.x + a.x0 < b[1].x && a.y + a.y1 > b[0].y && a.y + a.y0 < b[1].y;
}
function archimedeanSpiral(size) {
var e = size[0] / size[1];
return function(t) {
return [e * (t *= .1) * Math.cos(t), t * Math.sin(t)];
};
}
function rectangularSpiral(size) {
var dy = 4,
dx = dy * size[0] / size[1],
x = 0,
y = 0;
return function(t) {
var sign = t < 0 ? -1 : 1;
// See triangular numbers: T_n = n * (n + 1) / 2.
switch ((Math.sqrt(1 + 4 * sign * t) - sign) & 3) {
case 0: x += dx; break;
case 1: y += dy; break;
case 2: x -= dx; break;
default: y -= dy; break;
}
return [x, y];
};
}
// TODO reuse arrays?
function zeroArray(n) {
var a = [],
i = -1;
while (++i < n) a[i] = 0;
return a;
}
var cloudRadians = Math.PI / 180,
cw = 1 << 11 >> 5,
ch = 1 << 11,
canvas,
ratio = 1;
if (typeof document !== "undefined") {
canvas = document.createElement("canvas");
canvas.width = 1;
canvas.height = 1;
ratio = Math.sqrt(canvas.getContext("2d").getImageData(0, 0, 1, 1).data.length >> 2);
canvas.width = (cw << 5) / ratio;
canvas.height = ch / ratio;
} else {
// node-canvas support
var Canvas = require("canvas");
canvas = new Canvas(cw << 5, ch);
}
var c = canvas.getContext("2d"),
spirals = {
archimedean: archimedeanSpiral,
rectangular: rectangularSpiral
};
c.fillStyle = "red";
c.textAlign = "center";
exports.cloud = cloud;
})(typeof exports === "undefined" ? d3.layout || (d3.layout = {}) : exports);
body {
margin: 20px auto;
text-align: center;
width: 894px;
background: ghostwhite;
}
a {
color: #000;
/* text-decoration: none;*/
}
#footer {
width:100%;
height: 100%;
clear: both;
}
#footer img {
float: right;
margin-top: 50px;
margin-bottom: 40px;
}
.current {
font-weight: bold;
color: #b6001b;
}
#container {
width: 80%;
padding: 0;
margin: 0;
display: block;
}
#home {
text-decoration: none;
font-size: x-large;
margin: 0;
padding: 5px 20px;
}
#logos {
float: right;
padding: 10px;
}
p {
padding: 8px 0;
margin: 0;
/*width: 80%;*/
}
#header {
width: 100%;
height: 70px;
padding-top: 15px;
padding-bottom: 0;
}
#logo {
float: left;
}
#social-icons {
float: right;
margin-top: 7px;
}
#social-icons a {
margin: 11px 0 0 5px;
}
.divider {
height: 1px;
background: #ccc;
}
#main-content {
margin-top: 20px;
font-size: large;
text-align: left;
}
#content-right {
float: right;
display: inline;
margin-right: -30px;
margin-top: 10px;
}
/* ~~~~~~~~~ aside ~~~~~~~~~~ */
aside {
display: inline;
float: left;
width: 250px;
border: 1px solid black;
padding: 10px 18px 10px 20px;
margin-top: 3px;
-webkit-border-radius:12px;
-moz-border-radius:12px;
-ms-border-radius:12px;
-o-border-radius:12px;
border-radius:12px;
border-right: 3px solid black;
border-bottom: 3px solid black;
}
aside a {
color: #000;
text-decoration: none;
text-align: left;
}
/*aside a:hover {*/
/*background-image: url(../img/bg.png);*/
/*}*/
#logos li {
float: right;
padding: 0 5px;
margin: 0;
list-style-type: none;
}
#pic {
padding-left: 2px;
float:right;
}
.pics {
height: 125px;
padding-left: 10px;
padding-top: 60px;
right: auto;
overflow: hidden;
z-index: 1;
max-width: 880px;
}
.pics img {
width: 100px;
padding: 0 2px;
}
.rotate{
/*transform*/
-webkit-transform:rotate(-8deg);
-moz-transform:rotate(-8deg);
-ms-transform:rotate(-8deg);
-o-transform:rotate(-8deg);
transform:rotate(-8deg);
border-bottom: 3px black solid;
border-right: 1px black solid;
/* border-top: 1px black solid;*/
/* border-left: 1px black solid;*/
padding: 2px 8px;
margin: 2px;
border-radius: 30px;
}
.chord path {
fill-opacity: .67;
stroke: #000;
stroke-width: .5px;
}
.project-icon {
display: inline-block;
float: left;
width: 255px;
height: 170px;
margin: 15px 60px 20px 0;
}
.grey {
background: grey;
}
.project-icon img {
border: 1px solid #ccc;
}
#content-circle {
font: 13px sans-serif;
margin-left: -32px;
margin-top: 40px;
/*margin-right: -23px;*/
display: inline-block;
/*width: 400px;*/
height: 378px;
float: left;
}
#content-circle-right {
font: 13px sans-serif;
margin-right: -32px;
margin-top: 10px;
display: inline;
height: 378px;
float: right;
z-index: 1000;
}
#content-bottom {
width: 100%;
clear: both;
text-align: center;
}/**
* Author: Nina Stawski, me@ninastawski.com
* Date: 5/27/13
* Time: 8:57 PM
*/
function createProjectPreviews(element) {
var projects = ["uxui", "prpr", "sfsu", "olpc", "tsla", "dots", "grph", "frog", "olix"];
for (var project in projects) {
var el = '<div class="project-icon" id="' + projects[project] + '"><a href="' + projects[project] + '.html' + '"><img src="/img/projects/ns-' + projects[project] + '.png"/></a><div>';
if (project <=3) {
$('#' + element).append(el);
}
else {
$('#content-bottom').append(el)
}
}
$('#' + element +' .project-icon:nth-child(2n)').css({'margin-right' : '0'});
$('#content-bottom .project-icon:nth-child(3n)').css({'margin-right' : '0'});
}
function findProjectID(projectName) {
var names = {
"uxui" : 17,
"prpr" : 18,
"frog" : 18,
"olix" : 17,
"sfsu" : 16,
"olpc" : 16,
"tsla" : 17,
"dots" : 16,
"grph" : 16
}
return names[projectName]
}
function getProjectPictures(projectName) {
var num_pictures = {"prpr" : 7, "sfsu" : 5, "dots" : 3, "olpc" : 4, "uxui" : 3, "tsla" : 4, "grph" : 5, "frog" : 1, "olix" : 2};
var pictures = '';
for (var counter = 1; counter < num_pictures[projectName] + 1; counter++) {
var source = '/img/' + projectName + '/' + projectName + '-0' + counter + '.png';
pictures += '<img src="' + source + '" style="border: 1px solid #ccc; margin: 30px auto;" />';
}
return pictures
}
function highlightElements(index) {
var elementGroups = {
0 : ["uxui", "prpr", "sfsu", "olpc", "tsla", "dots", "grph"], //Illustrator
1 : ["uxui", "prpr", "sfsu", "olpc", "tsla", "dots", "grph", "frog", "olix"], //Photoshop
2 : ["uxui", "prpr", "olpc", "tsla" ], //Wireframing
3 : ["uxui", "prpr", "tsla", "olix" ], //Prototyping
4 : ["uxui", "prpr", "tsla" ], //OmniGraffle
5 : ["prpr"], //Python
6 : ["prpr", "frog"], //Javascript
7 : ["prpr"], //jQuery
8 : ["prpr"], //jQueryUI
9 : [], //jQueryMobile
10 : ["prpr", "frog"], //HTML5
11 : ["prpr", "frog"], //CSS3
12 : ["prpr"], //Bootstrap
13 : ["prpr"], //GIT
14 : ["prpr"], //jsPlumb
15 : [], //PHP
16 : ["uxui", "prpr", "sfsu", "olpc", "tsla", "dots", "grph", "olix"], //Design
17 : ["uxui", "prpr", "tsla", "olix"], //UX/UI
18 : ["prpr", "frog"] //Programming
};
dimAll();
for (var num in elementGroups[index]) {
var project = elementGroups[index][num];
$('#' + project + ' img').css({'border' : '1px solid grey'});
$('#' + project + ' a').css({'opacity' : '1'});
}
}
function dimAll() {
$('.project-icon img').each(function() {
$(this).css({'border' : '1px solid #ccc'});
$(this).parent().css({'opacity' : '0.2'});
});
}
function returnMatrix() {
return [
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0, 0], //Illustrator
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0, 0], //Photoshop
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0], //Wireframing
[0, 0, 0, 0, 0.2, 0, 0, 0.2, 0.2, 0.2, 0, 0, 0, 0, 0, 0, 0, 0.2, 0], //Prototyping
[0, 0, 0, 0.5, 0.5, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0.5, 0], //OmniGraffle
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1], //Python
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1], //Javascript
[0, 0, 0, 0.5, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0.5], //jQuery
[0, 0, 0, 0.5, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0.5], //jQueryUI
[0, 0, 0, 0.5, 0, 0, 0, 0, 0, 0.5, 0, 0, 0, 0, 0, 0, 0, 0, 0], //jQueryMobile
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0.5], //HTML5
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0.5], //CSS3
[0, 0, 0, 0.5, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0.5], //Bootstrap
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1], //GIT
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1], //jsPlumb
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0, 0, 0], //PHP
[1, 1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0], //Design
[0, 0, 0.5, 0.5, 0.5, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0], //UX/UI
[0.13, 0, 0.13, 0.13, 0, 0.13, 0.13, 0.13, 0.13, 0, 0.13, 0.13, 0.13, 0.13, 0.13, 0, 0, 0, 0] //Programming
];
}
function returnMatrixPrpr() {
return [
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0, 0], //Illustrator
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0, 0], //Photoshop
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0], //Wireframing
[0, 0, 0, 0, 0.2, 0, 0, 0.2, 0.2, 0.2, 0, 0, 0, 0, 0, 0, 0, 0.2, 0], //Prototyping
[0, 0, 0, 0.5, 0.5, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0.5, 0], //OmniGraffle
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1], //Python
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1], //Javascript
[0, 0, 0, 0.5, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0.5], //jQuery
[0, 0, 0, 0.5, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0.5], //jQueryUI
[0, 0, 0, 0.5, 0, 0, 0, 0, 0, 0.5, 0, 0, 0, 0, 0, 0, 0, 0, 0], //jQueryMobile
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0.5, 0, 0.5], //HTML5
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0.5, 0, 0.5], //CSS3
[0, 0, 0, 0.5, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0.5], //Bootstrap
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1], //GIT
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1], //jsPlumb
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0, 0, 0], //PHP
[0.3, 0.3, 0, 0, 0, 0, 0, 0, 0, 0, 0.3, 0.3, 0, 0, 0, 0, 0.3, 0.3, 0], //Design
[0, 0, 0.3, 0.3, 0.3, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0.3, 0, 0.3], //UX/UI
[0.13, 0, 0.13, 0.13, 0, 0.13, 0.13, 0.13, 0.13, 0, 0.13, 0.13, 0.13, 0.13, 0.13, 0, 0, 0.13, 0] //Programming
];
}
function returnMatrixSfsu() {
return [
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0, 0], //Illustrator
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0, 0], //Photoshop
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0], //Wireframing
[0, 0, 0, 0, 0.2, 0, 0, 0.2, 0.2, 0.2, 0, 0, 0, 0, 0, 0, 0, 0.2, 0], //Prototyping
[0, 0, 0, 0.5, 0.5, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0.5, 0], //OmniGraffle
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1], //Python
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1], //Javascript
[0, 0, 0, 0.5, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0.5], //jQuery
[0, 0, 0, 0.5, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0.5], //jQueryUI
[0, 0, 0, 0.5, 0, 0, 0, 0, 0, 0.5, 0, 0, 0, 0, 0, 0, 0, 0, 0], //jQueryMobile
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0.5], //HTML5
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0.5], //CSS3
[0, 0, 0, 0.5, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0.5], //Bootstrap
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1], //GIT
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1], //jsPlumb
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0, 0, 0], //PHP
[1, 1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0], //Design
[0, 0, 0.3, 0.3, 0.3, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0.3], //UX/UI
[0.13, 0, 0.13, 0.13, 0, 0.13, 0.13, 0.13, 0.13, 0, 0.13, 0.13, 0.13, 0.13, 0.13, 0, 0, 0.13, 0] //Programming
];
}
function returnMatrixUxui() {
return [
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0, 0], //Illustrator
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0, 0], //Photoshop
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0], //Wireframing
[0, 0, 0, 0, 0.2, 0, 0, 0.2, 0.2, 0.2, 0, 0, 0, 0, 0, 0, 0, 0.2, 0], //Prototyping
[0, 0, 0, 0.5, 0.5, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0.5, 0], //OmniGraffle
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1], //Python
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1], //Javascript
[0, 0, 0, 0.5, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0.5], //jQuery
[0, 0, 0, 0.5, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0.5], //jQueryUI
[0, 0, 0, 0.5, 0, 0, 0, 0, 0, 0.5, 0, 0, 0, 0, 0, 0, 0, 0, 0], //jQueryMobile
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0.5], //HTML5
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0.5], //CSS3
[0, 0, 0, 0.5, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0.5], //Bootstrap
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1], //GIT
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1], //jsPlumb
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0, 0, 0], //PHP
[1, 1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0], //Design
[0, 0, 0.5, 0.5, 0.5, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0], //UX/UI
[0.13, 0, 0.13, 0.13, 0, 0.13, 0.13, 0.13, 0.13, 0, 0.13, 0.13, 0.13, 0.13, 0.13, 0, 0, 0, 0] //Programming
];
// return [
// [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0, 0], //Illustrator
// [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0, 0], //Photoshop
// [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0], //Wireframing
// [0, 0, 0, 0, 0.2, 0, 0, 0.2, 0.2, 0.2, 0, 0, 0, 0, 0, 0, 0, 0.2, 0], //Prototyping
// [0, 0, 0, 0.5, 0.5, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0.5, 0], //OmniGraffle
// [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1], //Python
// [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1], //Javascript
// [0, 0, 0, 0.5, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0.5], //jQuery
// [0, 0, 0, 0.5, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0.5], //jQueryUI
// [0, 0, 0, 0.5, 0, 0, 0, 0, 0, 0.5, 0, 0, 0, 0, 0, 0, 0, 0, 0], //jQueryMobile
// [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0.5], //HTML5
// [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0.5], //CSS3
// [0, 0, 0, 0.5, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0.5], //Bootstrap
// [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1], //GIT
// [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1], //jsPlumb
// [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0, 0, 0], //PHP
// [1, 1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0], //Design
// [0, 0, 0.3, 0.3, 0.3, 0, 0, 0, 0, 0, 0, 0.3, 0.3, 0.3, 0, 0, 0, 0, 0.3], //UX/UI
// [0.13, 0, 0.13, 0.13, 0, 0.13, 0.13, 0.13, 0.13, 0, 0.13, 0.13, 0.13, 0.13, 0.13, 0, 0, 0.13, 0] //Programming
// ];
}
function returnMatrixTsla() {
return [
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0, 0], //Illustrator
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0, 0], //Photoshop
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0], //Wireframing
[0, 0, 0, 0, 0.2, 0, 0, 0.2, 0.2, 0.2, 0, 0, 0, 0, 0, 0, 0, 0.2, 0], //Prototyping
[0, 0, 0, 0.5, 0.5, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0.5, 0], //OmniGraffle
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1], //Python
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1], //Javascript
[0, 0, 0, 0.5, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0.5], //jQuery
[0, 0, 0, 0.5, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0.5], //jQueryUI
[0, 0, 0, 0.5, 0, 0, 0, 0, 0, 0.5, 0, 0, 0, 0, 0, 0, 0, 0, 0], //jQueryMobile
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0.5], //HTML5
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0.5], //CSS3
[0, 0, 0, 0.5, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0.5], //Bootstrap
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1], //GIT
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1], //jsPlumb
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0, 0, 0], //PHP
[1, 1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0], //Design
[0, 0, 0.5, 0.5, 0.5, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0], //UX/UI
[0.13, 0, 0.13, 0.13, 0, 0.13, 0.13, 0.13, 0.13, 0, 0.13, 0.13, 0.13, 0.13, 0.13, 0, 0, 0, 0] //Programming
];
}
function returnMatrixFrog() {
return [
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0, 0], //Illustrator
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0, 0], //Photoshop
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0], //Wireframing
[0, 0, 0, 0.2, 0.2, 0, 0, 0.2, 0.2, 0.2, 0, 0, 0, 0, 0, 0, 0, 0, 0], //Prototyping
[0, 0, 0, 0.5, 0.5, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0.5, 0], //OmniGraffle
[0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0], //Python
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1], //Javascript
[0, 0, 0, 0.5, 0, 0, 0, 0.5, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0], //jQuery
[0, 0, 0, 0.5, 0, 0, 0, 0, 0.5, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0], //jQueryUI
[0, 0, 0, 0.5, 0, 0, 0, 0, 0, 0.5, 0, 0, 0, 0, 0, 0, 0, 0, 0], //jQueryMobile
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0.5, 0, 0.5], //HTML5
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0.5, 0, 0.5], //CSS3
[0, 0, 0, 0.5, 0, 0, 0, 0, 0, 0, 0, 0, 0.5, 0, 0, 0, 0, 0, 0], //Bootstrap
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1], //GIT
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0.5, 0, 0, 0, 0], //jsPlumb
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0, 0, 0], //PHP
[0.3, 0.3, 0, 0, 0, 0, 0, 0, 0, 0, 0.3, 0.3, 0, 0, 0, 0, 0.3, 0.3, 0], //Design
[0, 0, 0.4, 0.4, 0.4, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0.4, 0, 0], //UX/UI
[0, 0.15, 0, 0, 0, 0, 0.15, 0, 0, 0, 0.15, 0.15, 0, 0.15, 0, 0, 0, 0, 0] //Programming
];
}