Skip to content

Commit ae6e3c9

Browse files
committed
url test 04
1 parent d79e319 commit ae6e3c9

37 files changed

+2273
-49
lines changed

docs/CNAME

Lines changed: 0 additions & 1 deletion
This file was deleted.

docs/index.html

Lines changed: 32 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66
<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@100;300&display=swap" rel="stylesheet">
77
<meta charset="UTF-8">
88
<meta name="viewport" content="width=device-width, initial-scale=1.0">
9-
<link rel="stylesheet" href="https://github.com/vizzuhq/codeviz/blob/master/media/main.css"></link>
9+
<link href="main.css"></link>
1010
<title>Code Counter Vizzu</title>
1111
</head>
1212
<body>
@@ -43,38 +43,38 @@ <h1 class="title" id="label_title">CodeViz</h1>
4343
<div style="aspect-ratio: 1/1; width: 100%; height: 60vh;" id="infoVizzu"></div>
4444
</div>
4545
<div class="control-div">
46-
<img style="cursor: pointer;" src="https://github.com/vizzuhq/codeviz/blob/master/assets/vizzu_logo.png" width="100px" onclick="onVizzuLogo()">
46+
<img style="cursor: pointer;" type="image/png" src="vizzu_logo.png" width="100px" onclick="onVizzuLogo()">
4747
</div>
4848
<script src="vscodeapi.js"></script>
49-
<script type="text/javascript" src="https://github.com/vizzuhq/codeviz/blob/master/media/scripts/anim-initial.js"></script>
50-
<script type="text/javascript" src="https://github.com/vizzuhq/codeviz/blob/master/media/scripts/anim-0100-0110.js"></script>
51-
<script type="text/javascript" src="https://github.com/vizzuhq/codeviz/blob/master/media/scripts/anim-0100-1000.js"></script>
52-
<script type="text/javascript" src="https://github.com/vizzuhq/codeviz/blob/master/media/scripts/anim-0100-1001.js"></script>
53-
<script type="text/javascript" src="https://github.com/vizzuhq/codeviz/blob/master/media/scripts/anim-0110-0100.js"></script>
54-
<script type="text/javascript" src="https://github.com/vizzuhq/codeviz/blob/master/media/scripts/anim-0110-1010.js"></script>
55-
<script type="text/javascript" src="https://github.com/vizzuhq/codeviz/blob/master/media/scripts/anim-0110-1011.js"></script>
56-
<script type="text/javascript" src="https://github.com/vizzuhq/codeviz/blob/master/media/scripts/anim-1000-0100.js"></script>
57-
<script type="text/javascript" src="https://github.com/vizzuhq/codeviz/blob/master/media/scripts/anim-1000-1001.js"></script>
58-
<script type="text/javascript" src="https://github.com/vizzuhq/codeviz/blob/master/media/scripts/anim-1000-1010.js"></script>
59-
<script type="text/javascript" src="https://github.com/vizzuhq/codeviz/blob/master/media/scripts/anim-1001-0100.js"></script>
60-
<script type="text/javascript" src="https://github.com/vizzuhq/codeviz/blob/master/media/scripts/anim-1001-1000.js"></script>
61-
<script type="text/javascript" src="https://github.com/vizzuhq/codeviz/blob/master/media/scripts/anim-1001-1011.js"></script>
62-
<script type="text/javascript" src="https://github.com/vizzuhq/codeviz/blob/master/media/scripts/anim-1010-0110.js"></script>
63-
<script type="text/javascript" src="https://github.com/vizzuhq/codeviz/blob/master/media/scripts/anim-1010-1000.js"></script>
64-
<script type="text/javascript" src="https://github.com/vizzuhq/codeviz/blob/master/media/scripts/anim-1010-1011.js"></script>
65-
<script type="text/javascript" src="https://github.com/vizzuhq/codeviz/blob/master/media/scripts/anim-1011-0110.js"></script>
66-
<script type="text/javascript" src="https://github.com/vizzuhq/codeviz/blob/master/media/scripts/anim-1011-1001.js"></script>
67-
<script type="text/javascript" src="https://github.com/vizzuhq/codeviz/blob/master/media/scripts/anim-1011-1010.js"></script>
68-
<script type="text/javascript" src="https://github.com/vizzuhq/codeviz/blob/master/media/scripts/nav-anim-record-filter.js"></script>
69-
<script type="text/javascript" src="https://github.com/vizzuhq/codeviz/blob/master/media/scripts/nav-anim-initial.js"></script>
70-
<script type="text/javascript" src="https://github.com/vizzuhq/codeviz/blob/master/media/scripts/nav-anim-10xx-filter-fw.js"></script>
71-
<script type="text/javascript" src="https://github.com/vizzuhq/codeviz/blob/master/media/scripts/nav-anim-10xx-filter-bw.js"></script>
72-
<script type="text/javascript" src="https://github.com/vizzuhq/codeviz/blob/master/media/scripts/nav-anim-10xx-01xx.js"></script>
73-
<script type="text/javascript" src="https://github.com/vizzuhq/codeviz/blob/master/media/scripts/nav-anim-01xx-filter-fw.js"></script>
74-
<script type="text/javascript" src="https://github.com/vizzuhq/codeviz/blob/master/media/scripts/nav-anim-01xx-filter-bw.js"></script>
75-
<script type="text/javascript" src="https://github.com/vizzuhq/codeviz/blob/master/media/scripts/nav-anim-01xx-10xx.js"></script>
76-
<script type="text/javascript" src="https://github.com/vizzuhq/codeviz/blob/master/media/scripts/uiLogic-controls.js"></script>
77-
<script type="text/javascript" src="https://github.com/vizzuhq/codeviz/blob/master/media/scripts/uiLogic-animations.js"></script>
78-
<script type="text/javascript" src="https://github.com/vizzuhq/codeviz/blob/master/media/scripts/uiLogic-main.js"></script>
49+
<script src="scripts/anim-initial.js"></script>
50+
<script src="scripts/anim-0100-0110.js"></script>
51+
<script src="scripts/anim-0100-1000.js"></script>
52+
<script src="scripts/anim-0100-1001.js"></script>
53+
<script src="scripts/anim-0110-0100.js"></script>
54+
<script src="scripts/anim-0110-1010.js"></script>
55+
<script src="scripts/anim-0110-1011.js"></script>
56+
<script src="scripts/anim-1000-0100.js"></script>
57+
<script src="scripts/anim-1000-1001.js"></script>
58+
<script src="scripts/anim-1000-1010.js"></script>
59+
<script src="scripts/anim-1001-0100.js"></script>
60+
<script src="scripts/anim-1001-1000.js"></script>
61+
<script src="scripts/anim-1001-1011.js"></script>
62+
<script src="scripts/anim-1010-0110.js"></script>
63+
<script src="scripts/anim-1010-1000.js"></script>
64+
<script src="scripts/anim-1010-1011.js"></script>
65+
<script src="scripts/anim-1011-0110.js"></script>
66+
<script src="scripts/anim-1011-1001.js"></script>
67+
<script src="scripts/anim-1011-1010.js"></script>
68+
<script src="scripts/nav-anim-record-filter.js"></script>
69+
<script src="scripts/nav-anim-initial.js"></script>
70+
<script src="scripts/nav-anim-10xx-filter-fw.js"></script>
71+
<script src="scripts/nav-anim-10xx-filter-bw.js"></script>
72+
<script src="scripts/nav-anim-10xx-01xx.js"></script>
73+
<script src="scripts/nav-anim-01xx-filter-fw.js"></script>
74+
<script src="scripts/nav-anim-01xx-filter-bw.js"></script>
75+
<script src="scripts/nav-anim-01xx-10xx.js"></script>
76+
<script src="scripts/uiLogic-controls.js"></script>
77+
<script src="scripts/uiLogic-animations.js"></script>
78+
<script src="scripts/uiLogic-main.js"></script>
7979
</body>
8080
</html>

docs/main.css

Lines changed: 51 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,51 @@
1+
.title {
2+
font-family: roboto;
3+
text-align: center;
4+
padding-top: 10px;
5+
color: rgb(120, 120, 120);
6+
font-size: 200%
7+
}
8+
9+
.info {
10+
font-family: roboto;
11+
text-align: center;
12+
color: rgb(130, 130, 130);
13+
font-size: 100%
14+
}
15+
16+
.info-item {
17+
font-family: roboto;
18+
font-size: 100%;
19+
}
20+
21+
.info-value {
22+
font-family: roboto;
23+
font-size: 130%;
24+
color: var(--vscode-focusBorder);
25+
}
26+
27+
.vizzu-div {
28+
display: grid;
29+
grid-template-columns: 45.0000% 55.0000%;
30+
grid-template-rows: auto;
31+
width: 100%;
32+
}
33+
34+
.control-div {
35+
display: flex;
36+
justify-content: center;
37+
width: 100%;
38+
grid-template-rows: auto auto;
39+
}
40+
41+
.click-label {
42+
border: none;
43+
background-color: transparent;
44+
color: inherit;
45+
}
46+
47+
.click-label:disabled {
48+
border: none;
49+
background-color: transparent;
50+
color: rgb(97, 97, 97);
51+
}

docs/main.html

Lines changed: 51 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,51 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<link rel="preconnect" href="https://fonts.googleapis.com">
5+
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
6+
<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@100;300&display=swap" rel="stylesheet">
7+
<meta charset="UTF-8">
8+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
9+
<link rel="stylesheet" href="${styleMain}"></link>
10+
<script type="module" src="${scriptToolkit}"></script>
11+
<title>Code Counter Vizzu</title>
12+
</head>
13+
<body>
14+
<h1 class="title" id="label_title">CodeViz</h1>
15+
<p class="info">
16+
<span id="label_date">date placeholder</span>
17+
&nbsp;&nbsp;-&nbsp;&nbsp;
18+
<span id="label_dir">dir placeholder</span>
19+
</p>
20+
<p class="info">
21+
<span class="info-item">files: </span><span class="info-value" id="label_files"></span>&nbsp;&nbsp;&nbsp;
22+
<span class="info-item">lines: </span><span class="info-value" id="label_lines"></span>&nbsp;&nbsp;&nbsp;
23+
<span class="info-item">code: </span><span class="info-value" id="label_code"></span>&nbsp;&nbsp;&nbsp;
24+
<span class="info-item">comment: </span><span class="info-value" id="label_comment"></span>&nbsp;&nbsp;&nbsp;
25+
<span class="info-item">blank: </span><span class="info-value" id="label_blank"></span>
26+
</p>
27+
<div id="idControlDiv" class="vizzu-div">
28+
<div style="margin-left: 10%;">
29+
<vscode-dropdown id="idDispType" position="below" onchange="onDisplayTypeChanged()">
30+
<vscode-option id="idLineCount">Line count</vscode-option>
31+
<vscode-option id="idFileCount">File count</vscode-option>
32+
</vscode-dropdown>
33+
</div>
34+
<div style="margin-right: 10%; display: grid; grid-template-rows: auto auto; justify-items: end;">
35+
<div>
36+
<vscode-checkbox id="idChkBoxLang" onchange="onCheckboxLanguages()" checked>Languages</vscode-checkbox>
37+
<vscode-checkbox id="idChkBoxFiles" onchange="onCheckboxFiles()">Files</vscode-checkbox>
38+
</div>
39+
</div>
40+
</div>
41+
<p style="margin-left: 4.5%; margin-right: 4.5%;" id="idBackLabelContainer"></p>
42+
<div class="vizzu-div">
43+
<div style="aspect-ratio: 1/1; width: 100%; height: 60vh;" id="navVizzu"></div>
44+
<div style="aspect-ratio: 1/1; width: 100%; height: 60vh;" id="infoVizzu"></div>
45+
</div>
46+
<div class="control-div">
47+
<img style="cursor: pointer;" src="${logo}" width="100px" onclick="onVizzuLogo()">
48+
</div>
49+
${scripts}
50+
</body>
51+
</html>

docs/scripts/anim-0100-0110.js

Lines changed: 90 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,90 @@
1+
function anim_0100_0110(chart) {
2+
3+
return chart.animate({
4+
config: {
5+
channels: {
6+
y: { set: ['$count'] },
7+
x: { set: null },
8+
color: { set: null },
9+
label: { set: ['$count'] },
10+
},// '13 File count 2',
11+
legend: null
12+
},
13+
style: {
14+
plot: {
15+
paddingLeft: '9em',
16+
marker: { label: { position: 'center' } },
17+
xAxis: { label: { angle: -0.7 } }
18+
}
19+
}
20+
},
21+
{ duration: 0.1 }
22+
)
23+
24+
.then(chart => chart.animate({
25+
config: {
26+
channels: {
27+
y: { set: ['$count', 'Language', 'File name'] },
28+
x: { set: null },
29+
label: { set: null },
30+
color: { set: ['Language'] }
31+
},// '12 File count 1',
32+
legend: null
33+
},
34+
style: {
35+
plot: {
36+
paddingLeft: '9em',
37+
marker: { label: { position: 'center' } },
38+
xAxis: { label: { angle: -0.7 } }
39+
}
40+
}
41+
},
42+
{ duration: 0.5 }
43+
))
44+
45+
.then(chart => chart.animate({
46+
config: {
47+
channels: {
48+
y: { set: ['$count', 'File name'] },
49+
x: { set: ['Language'] },
50+
color: { set: ['Language'] }
51+
},// '9 File count + types 1',
52+
sort: 'byValue',
53+
legend: null,
54+
reverse: true,
55+
},
56+
style: {
57+
plot: {
58+
paddingLeft: '9em',
59+
marker: { label: { position: 'top' } },
60+
xAxis: { label: { angle: -0.7 } }
61+
}
62+
}
63+
},
64+
{ duration: 2 }
65+
))
66+
67+
.then(chart => chart.animate({
68+
config: {
69+
channels: {
70+
y: { set: ['$count'] },
71+
x: { set: ['Language'] },
72+
label: { set: ['$count'] },
73+
color: { set: ['Language'] }
74+
},
75+
// '10 File count + types 2',
76+
sort: 'byValue',
77+
legend: null,
78+
reverse: true,
79+
},
80+
style: {
81+
plot: {
82+
paddingLeft: '9em',
83+
marker: { label: { position: 'top' } },
84+
xAxis: { label: { angle: -0.7 } }
85+
}
86+
}
87+
},
88+
{ duration: 0.5 }
89+
));
90+
}

docs/scripts/anim-0100-1000.js

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
function anim_0100_1000(chart) {
2+
3+
return chart.animate({
4+
config: {
5+
channels: {
6+
y: { set: null },
7+
x: { set: ['Line count'] },
8+
color: { set: null },
9+
label: { set: ['Line count'] },
10+
},
11+
//1 code 1
12+
},
13+
style: {
14+
legend: { paddingLeft: '5.789473684' },
15+
plot: {
16+
paddingLeft: '9em',
17+
marker: { label: { position: 'center' } },
18+
yAxis: { label: { paddingRight: '1.2em' } },
19+
xAxis: { label: { angle: 0 } }
20+
}
21+
}
22+
},
23+
{ duration: 2 }
24+
);
25+
}

docs/scripts/anim-0100-1001.js

Lines changed: 72 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,72 @@
1+
function anim_0100_1001(chart) {
2+
3+
return chart.animate({
4+
config: {
5+
channels: {
6+
y: { set: ['$count'] },
7+
x: { set: null },
8+
color: { set: null },
9+
label: { set: ['$count'] },
10+
},
11+
// '13 File count 2',
12+
legend: null
13+
},
14+
style: {
15+
plot: {
16+
paddingLeft: '9em',
17+
marker: { label: { position: 'center' } },
18+
xAxis: { label: { angle: 0 } }
19+
}
20+
}
21+
},
22+
{ duration: 0.2 }
23+
)
24+
25+
.then(chart => chart.animate({
26+
config: {
27+
channels: {
28+
y: { set: ['$count', 'Language', 'File name'] },
29+
x: { set: null },
30+
color: { detach: ['Language'] },
31+
label: { set: null }
32+
},
33+
// '7 code + Files 1',
34+
sort: 'byValue',
35+
legend: null,
36+
reverse: false,
37+
},
38+
style: {
39+
plot: {
40+
paddingLeft: '9em',
41+
yAxis: { label: { color:'#12345600' } },
42+
xAxis: { label: { angle: 0 } }
43+
}
44+
}
45+
},
46+
{ duration: 0.2 }
47+
))
48+
49+
.then(chart => chart.animate({
50+
config: {
51+
channels: {
52+
y: { set: ['Language', 'File name'] },
53+
x: { set: ['Line count'] },
54+
color: { detach: ['Language'] },
55+
label: { set: null }
56+
},
57+
// '7 code + Files 1',
58+
sort: 'byValue',
59+
legend: null,
60+
reverse: false,
61+
},
62+
style: {
63+
plot: {
64+
paddingLeft: '9em',
65+
yAxis: { label: { color:'#12345600' } },
66+
xAxis: { label: { angle: 0 } }
67+
}
68+
}
69+
},
70+
{ duration: 1.8 }
71+
));
72+
}

0 commit comments

Comments
 (0)