Skip to content

Commit 56f25b2

Browse files
ariel-frischerariel-frischer
committed
feat(Results.svelte): add support for displaying language logos and improve layout
style(Results.svelte): enhance styling for better responsiveness and visual appeal The changes introduce the ability to display language logos using the `imgURL` property, enhancing the visual representation of each language. The layout is improved for better user experience, with adjustments to spacing, font sizes, and responsive design to ensure the component looks good on various screen sizes. This makes the results more engaging and informative for users. feat(languages): add imgURL property to Language interface and update languages data with image URLs feat(validate page): create a new Svelte page for validating programming languages and their image URLs The imgURL property is added to the Language interface to support image URLs for each programming language. A new Svelte page is created to validate and display these languages, allowing users to see which languages have valid image URLs and handle any loading errors gracefully. This enhances the user experience by providing visual representation and error handling for language icons.
1 parent ce21efe commit 56f25b2

12 files changed

Lines changed: 2131 additions & 190 deletions

‎scripts/add-logo-urls.ts‎

Lines changed: 163 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,163 @@
1+
#!/usr/bin/env tsx
2+
3+
import { languages } from '../src/lib/data/languages';
4+
import fs from 'fs';
5+
import path from 'path';
6+
import { fileURLToPath } from 'url';
7+
8+
const __filename = fileURLToPath(import.meta.url);
9+
const __dirname = path.dirname(__filename);
10+
11+
// Logo URL mappings from Perplexity research
12+
const logoUrls: Record<string, string> = {
13+
// First batch (40 languages)
14+
'python': 'https://commons.wikimedia.org/wiki/File:Python-logo-notext.svg',
15+
'javascript': 'https://commons.wikimedia.org/wiki/File:Unofficial_JavaScript_logo_2.svg',
16+
'typescript': 'https://commons.wikimedia.org/wiki/File:Typescript_logo_2020.svg',
17+
'rust': 'https://commons.wikimedia.org/wiki/File:Rust_programming_language_black_logo.svg',
18+
'go': 'https://commons.wikimedia.org/wiki/File:Go_Logo_Blue.svg',
19+
'java': 'https://commons.wikimedia.org/wiki/File:Java_programming_language_logo.svg',
20+
'cpp': 'https://commons.wikimedia.org/wiki/File:ISO_C%2B%2B_Logo.svg',
21+
'ruby': 'https://commons.wikimedia.org/wiki/File:Ruby_logo.svg',
22+
'swift': 'https://commons.wikimedia.org/wiki/File:Swift_logo.svg',
23+
'haskell': 'https://commons.wikimedia.org/wiki/File:Haskell-Logo.svg',
24+
'csharp': 'https://commons.wikimedia.org/wiki/File:C_Sharp_wordmark.svg',
25+
'c': 'https://commons.wikimedia.org/wiki/File:C_Programming_Language.svg',
26+
'php': 'https://commons.wikimedia.org/wiki/File:PHP-logo.svg',
27+
'kotlin': 'https://commons.wikimedia.org/wiki/File:Kotlin-logo.svg',
28+
'r': 'https://commons.wikimedia.org/wiki/File:R_logo.svg',
29+
'matlab': 'https://commons.wikimedia.org/wiki/File:Matlab_Logo.png',
30+
'scala': 'https://commons.wikimedia.org/wiki/File:Scala-full-color.svg',
31+
'dart': 'https://commons.wikimedia.org/wiki/File:Dart_programming_language_logo.svg',
32+
'objectivec': 'https://commons.wikimedia.org/wiki/File:Objective-C_Logo.png',
33+
'perl': 'https://commons.wikimedia.org/wiki/File:Perl_Code_Logo.svg',
34+
'lua': 'https://commons.wikimedia.org/wiki/File:Lua-Logo.svg',
35+
'julia': 'https://commons.wikimedia.org/wiki/File:Julia_Logo_color.svg',
36+
'elixir': 'https://commons.wikimedia.org/wiki/File:Elixir_logo.png',
37+
'clojure': 'https://commons.wikimedia.org/wiki/File:Clojure_logo.svg',
38+
'fsharp': 'https://commons.wikimedia.org/wiki/File:F_Sharp_logo.svg',
39+
'erlang': 'https://commons.wikimedia.org/wiki/File:Erlang_logo.svg',
40+
'visualbasic': 'https://commons.wikimedia.org/wiki/File:VisualBasic_6.0_logo.png',
41+
'delphi': 'https://commons.wikimedia.org/wiki/File:Delphi_Programming_Language_logo.png',
42+
'cobol': 'https://commons.wikimedia.org/wiki/File:COBOL_logo.svg',
43+
'sql': 'https://commons.wikimedia.org/wiki/File:Structured_Query_Language_logo.svg',
44+
'bash': 'https://commons.wikimedia.org/wiki/File:Bash_Logo_Colored.svg',
45+
'groovy': 'https://commons.wikimedia.org/wiki/File:Groovy-logo.svg',
46+
'assembly': 'https://commons.wikimedia.org/wiki/File:Assembly_wikipedia_logo.png',
47+
'fortran': 'https://commons.wikimedia.org/wiki/File:Fortran_logo.svg',
48+
'ada': 'https://commons.wikimedia.org/wiki/File:Ada_Mascot_with_slogan.svg',
49+
'powershell': 'https://commons.wikimedia.org/wiki/File:PowerShell_Logo.svg',
50+
'vba': 'https://commons.wikimedia.org/wiki/File:VB_logo.png',
51+
'plsql': 'https://commons.wikimedia.org/wiki/File:PLSQL_logo.png',
52+
'prolog': 'https://commons.wikimedia.org/wiki/File:Prolog_logo.png',
53+
'lisp': 'https://commons.wikimedia.org/wiki/File:LISP_logo.svg',
54+
55+
// Second batch (60 languages)
56+
'd': 'https://commons.wikimedia.org/wiki/File:D_Programming_Language_logo.svg',
57+
'scratch': 'https://commons.wikimedia.org/wiki/File:Scratch_logo.svg',
58+
'scheme': 'https://commons.wikimedia.org/wiki/File:Scheme.svg',
59+
'ocaml': 'https://commons.wikimedia.org/wiki/File:OCaml_logo.svg',
60+
'solidity': 'https://commons.wikimedia.org/wiki/File:Solidity_logo.svg',
61+
'racket': 'https://commons.wikimedia.org/wiki/File:Racket-logo.svg',
62+
'awk': 'https://techicons.dev/icons/awk.svg',
63+
'sas': 'https://commons.wikimedia.org/wiki/File:SAS_logo.svg',
64+
'tcl': 'https://commons.wikimedia.org/wiki/File:Tcl_logo.svg',
65+
'vbnet': 'https://commons.wikimedia.org/wiki/File:VB.NET_Logo.svg',
66+
'nim': 'https://commons.wikimedia.org/wiki/File:Nim-logo.svg',
67+
'crystal': 'https://commons.wikimedia.org/wiki/File:Crystal_language_logo.svg',
68+
'zig': 'https://commons.wikimedia.org/wiki/File:Zig-logo.svg',
69+
'vlang': 'https://commons.wikimedia.org/wiki/File:V_logo.svg',
70+
'elm': 'https://commons.wikimedia.org/wiki/File:Elm_logo.svg',
71+
'purescript': 'https://commons.wikimedia.org/wiki/File:Purescript_logo.svg',
72+
'reasonml': 'https://commons.wikimedia.org/wiki/File:ReasonML_logo.svg',
73+
'commonlisp': 'https://commons.wikimedia.org/wiki/File:Common_Lisp_logo.svg',
74+
'standardml': 'https://commons.wikimedia.org/wiki/File:Standard_ML_Logo.svg',
75+
'smalltalk': 'https://commons.wikimedia.org/wiki/File:Smalltalk_logo.png',
76+
'sed': 'https://techicons.dev/icons/sed.svg',
77+
'verilog': 'https://commons.wikimedia.org/wiki/File:Verilog_logo.svg',
78+
'vhdl': 'https://commons.wikimedia.org/wiki/File:VHDL-Logo.svg',
79+
'cuda': 'https://commons.wikimedia.org/wiki/File:Nvidia_cuda_logo.svg',
80+
'opencl': 'https://commons.wikimedia.org/wiki/File:OpenCL_logo.svg',
81+
'glsl': 'https://commons.wikimedia.org/wiki/File:OpenGL_Shading_Language_logo.png',
82+
'hlsl': 'https://commons.wikimedia.org/wiki/File:HLSL_Logo.svg',
83+
'mojo': 'https://commons.wikimedia.org/wiki/File:Mojo_(programming_language)_logo.svg',
84+
'carbon': 'https://commons.wikimedia.org/wiki/File:Carbon-language-logo.svg',
85+
'actionscript': 'https://commons.wikimedia.org/wiki/File:ActionScript_Icon.png',
86+
'autohotkey': 'https://commons.wikimedia.org/wiki/File:Autohotkey_logo.png',
87+
'apl': 'https://commons.wikimedia.org/wiki/File:APL_logo.png',
88+
'coffeescript': 'https://techicons.dev/icons/coffeescript.svg',
89+
'chapel': 'https://commons.wikimedia.org/wiki/File:Chapel-logo.svg',
90+
'eiffel': 'https://commons.wikimedia.org/wiki/File:Eiffel_programming_language_logo.png',
91+
'factor': 'https://commons.wikimedia.org/wiki/File:Factor_(programming_language)_logo.png',
92+
'forth': 'https://commons.wikimedia.org/wiki/File:Forth_logo.png',
93+
'io': 'https://commons.wikimedia.org/wiki/File:Io_phoenix_logo.png',
94+
'j': 'https://commons.wikimedia.org/wiki/File:J_logo.png',
95+
'labview': 'https://commons.wikimedia.org/wiki/File:Labview_logo.svg',
96+
'logo': 'https://commons.wikimedia.org/wiki/File:Logo_turtle.svg',
97+
'mql4': 'https://commons.wikimedia.org/wiki/File:MetaQuotes_Logo.png',
98+
'monkey': 'https://commons.wikimedia.org/wiki/File:Monkey-X-logo.png',
99+
'purebasic': 'https://commons.wikimedia.org/wiki/File:PureBasic_logo.png',
100+
'rexx': 'https://commons.wikimedia.org/wiki/File:Rexx_logo.png',
101+
'ring': 'https://commons.wikimedia.org/wiki/File:Ring_logo.svg',
102+
'simula': 'https://commons.wikimedia.org/wiki/File:Simula_logo.png',
103+
'xslt': 'https://commons.wikimedia.org/wiki/File:XSLT_logo.svg',
104+
'tcltk': 'https://commons.wikimedia.org/wiki/File:Tcl_Tk_logo.svg',
105+
'qsharp': 'https://commons.wikimedia.org/wiki/File:Q_Sharp_logo.svg',
106+
'wasm': 'https://commons.wikimedia.org/wiki/File:WebAssembly_Logo.svg',
107+
'systemverilog': 'https://commons.wikimedia.org/wiki/File:SystemVerilog_logo.svg',
108+
'pony': 'https://commons.wikimedia.org/wiki/File:Pony-programming-language-logo.png',
109+
'idris': 'https://commons.wikimedia.org/wiki/File:Idris_logo.svg',
110+
'vale': 'https://commons.wikimedia.org/wiki/File:Vale_logo.svg',
111+
'odin': 'https://commons.wikimedia.org/wiki/File:Odin_logo.png',
112+
'janet': 'https://commons.wikimedia.org/wiki/File:Janet-language-logo.svg',
113+
'nix': 'https://commons.wikimedia.org/wiki/File:Nix_logo.svg',
114+
'dhall': 'https://commons.wikimedia.org/wiki/File:Dhall_logo.svg',
115+
'lean': 'https://commons.wikimedia.org/wiki/File:Lean_logo.svg'
116+
};
117+
118+
console.log('Adding logo URLs to languages array...\n');
119+
120+
// Read the current languages.ts file
121+
const languagesPath = path.join(__dirname, '../src/lib/data/languages.ts');
122+
let languagesContent = fs.readFileSync(languagesPath, 'utf-8');
123+
124+
// Track which languages we update
125+
let updated = 0;
126+
let missing = 0;
127+
128+
languages.forEach((lang) => {
129+
const logoUrl = logoUrls[lang.id];
130+
131+
if (logoUrl) {
132+
// Find the language object in the file content and add imgURL
133+
const langRegex = new RegExp(
134+
`(\\{\\s*id:\\s*'${lang.id}'[\\s\\S]*?)color:\\s*'[^']*'`,
135+
'g'
136+
);
137+
138+
languagesContent = languagesContent.replace(langRegex, (match) => {
139+
// Check if imgURL already exists
140+
if (match.includes('imgURL:')) {
141+
return match;
142+
}
143+
// Add imgURL after color
144+
return match + `,\n\t\timgURL: '${logoUrl}'`;
145+
});
146+
147+
console.log(`✅ ${lang.name}: ${logoUrl}`);
148+
updated++;
149+
} else {
150+
console.log(`❌ ${lang.name}: No URL found`);
151+
missing++;
152+
}
153+
});
154+
155+
// Write back to file
156+
fs.writeFileSync(languagesPath, languagesContent, 'utf-8');
157+
158+
console.log(`\n=== Summary ===`);
159+
console.log(`Updated: ${updated} languages`);
160+
console.log(`Missing: ${missing} languages`);
161+
console.log(`Total: ${languages.length} languages`);
162+
163+
export {};

‎scripts/analyze-distribution.ts‎

Lines changed: 126 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,126 @@
1+
#!/usr/bin/env tsx
2+
3+
import { languages } from '../src/lib/data/languages';
4+
5+
// All 16 MBTI personality types
6+
const MBTI_TYPES = [
7+
'ISTJ', 'ISFJ', 'INFJ', 'INTJ',
8+
'ISTP', 'ISFP', 'INFP', 'INTP',
9+
'ESTP', 'ESFP', 'ENFP', 'ENTP',
10+
'ESTJ', 'ESFJ', 'ENFJ', 'ENTJ'
11+
] as const;
12+
13+
console.log('=== Programming Language MBTI Distribution Analysis ===\n');
14+
15+
// Count total languages
16+
console.log(`Total Languages: ${languages.length}\n`);
17+
18+
// MBTI Distribution
19+
console.log('=== MBTI Type Distribution ===');
20+
const mbtiCounts: Record<string, number> = {};
21+
const mbtiLanguages: Record<string, string[]> = {};
22+
23+
// Initialize counts
24+
MBTI_TYPES.forEach(type => {
25+
mbtiCounts[type] = 0;
26+
mbtiLanguages[type] = [];
27+
});
28+
29+
// Count languages per MBTI type
30+
languages.forEach(lang => {
31+
if (mbtiCounts[lang.mbti] !== undefined) {
32+
mbtiCounts[lang.mbti]++;
33+
mbtiLanguages[lang.mbti].push(lang.name);
34+
} else {
35+
console.log(`⚠️ Unknown MBTI type: ${lang.mbti} for language: ${lang.name}`);
36+
}
37+
});
38+
39+
// Display distribution
40+
MBTI_TYPES.forEach(type => {
41+
const count = mbtiCounts[type];
42+
const percentage = ((count / languages.length) * 100).toFixed(1);
43+
console.log(`${type}: ${count} languages (${percentage}%)`);
44+
});
45+
46+
console.log('\n=== Detailed MBTI Language Lists ===');
47+
MBTI_TYPES.forEach(type => {
48+
const count = mbtiCounts[type];
49+
if (count > 0) {
50+
console.log(`\n${type} (${count} languages):`);
51+
mbtiLanguages[type].forEach(name => {
52+
console.log(` - ${name}`);
53+
});
54+
}
55+
});
56+
57+
// Domain Distribution
58+
console.log('\n=== Primary Domain Distribution ===');
59+
const domainCounts: Record<string, number> = {};
60+
languages.forEach(lang => {
61+
if (lang.primaryDomain) {
62+
domainCounts[lang.primaryDomain] = (domainCounts[lang.primaryDomain] || 0) + 1;
63+
}
64+
});
65+
66+
Object.entries(domainCounts)
67+
.sort(([,a], [,b]) => b - a)
68+
.forEach(([domain, count]) => {
69+
const percentage = ((count / languages.length) * 100).toFixed(1);
70+
console.log(`${domain}: ${count} languages (${percentage}%)`);
71+
});
72+
73+
// Year Distribution
74+
console.log('\n=== Year Created Distribution ===');
75+
const yearCounts: Record<string, number> = {};
76+
languages.forEach(lang => {
77+
if (lang.yearCreated) {
78+
const decade = Math.floor(lang.yearCreated / 10) * 10;
79+
const decadeStr = `${decade}s`;
80+
yearCounts[decadeStr] = (yearCounts[decadeStr] || 0) + 1;
81+
}
82+
});
83+
84+
Object.entries(yearCounts)
85+
.sort(([a,], [b,]) => a.localeCompare(b))
86+
.forEach(([decade, count]) => {
87+
const percentage = ((count / languages.length) * 100).toFixed(1);
88+
console.log(`${decade}: ${count} languages (${percentage}%)`);
89+
});
90+
91+
// Paradigm Distribution
92+
console.log('\n=== Paradigm Distribution ===');
93+
const paradigmCounts: Record<string, number> = {};
94+
languages.forEach(lang => {
95+
if (lang.paradigm) {
96+
paradigmCounts[lang.paradigm] = (paradigmCounts[lang.paradigm] || 0) + 1;
97+
}
98+
});
99+
100+
Object.entries(paradigmCounts)
101+
.sort(([,a], [,b]) => b - a)
102+
.forEach(([paradigm, count]) => {
103+
const percentage = ((count / languages.length) * 100).toFixed(1);
104+
console.log(`${paradigm}: ${count} languages (${percentage}%)`);
105+
});
106+
107+
// Balance Analysis
108+
console.log('\n=== MBTI Balance Analysis ===');
109+
const idealCount = languages.length / 16;
110+
console.log(`Ideal count per MBTI type: ${idealCount.toFixed(1)} languages`);
111+
112+
const imbalances = MBTI_TYPES
113+
.map(type => ({
114+
type,
115+
count: mbtiCounts[type],
116+
deviation: Math.abs(mbtiCounts[type] - idealCount)
117+
}))
118+
.sort((a, b) => b.deviation - a.deviation);
119+
120+
console.log('\nMost over/under-represented types:');
121+
imbalances.slice(0, 5).forEach(({ type, count, deviation }) => {
122+
const status = count > idealCount ? 'over' : 'under';
123+
console.log(` ${type}: ${count} (${deviation.toFixed(1)} ${status})`);
124+
});
125+
126+
export {};

‎scripts/bulk-add-urls.ts‎

Lines changed: 58 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,58 @@
1+
#!/usr/bin/env tsx
2+
3+
import fs from 'fs';
4+
import path from 'path';
5+
import { fileURLToPath } from 'url';
6+
7+
const __filename = fileURLToPath(import.meta.url);
8+
const __dirname = path.dirname(__filename);
9+
10+
// All 100 programming language logo URLs with corrected Python URL
11+
const edits = [
12+
// TypeScript
13+
{ search: "\t\ticon: '🔷',\n\t\tcolor: '#3776AB',\n\t\tprimaryDomain: 'enterprise',",
14+
replace: "\t\ticon: '🔷',\n\t\tcolor: '#3776AB',\n\t\timgURL: 'https://upload.wikimedia.org/wikipedia/commons/4/4c/Typescript_logo_2020.svg',\n\t\tprimaryDomain: 'enterprise'," },
15+
16+
// Rust
17+
{ search: "\t\ticon: '🦀',\n\t\tcolor: '#3776AB',\n\t\tprimaryDomain: 'systems',",
18+
replace: "\t\ticon: '🦀',\n\t\tcolor: '#3776AB',\n\t\timgURL: 'https://upload.wikimedia.org/wikipedia/commons/d/d5/Rust_programming_language_black_logo.svg',\n\t\tprimaryDomain: 'systems'," },
19+
20+
// Go
21+
{ search: "\t\ticon: '🐹',\n\t\tcolor: '#3776AB',\n\t\tprimaryDomain: 'systems',",
22+
replace: "\t\ticon: '🐹',\n\t\tcolor: '#3776AB',\n\t\timgURL: 'https://upload.wikimedia.org/wikipedia/commons/0/05/Go_Logo_Blue.svg',\n\t\tprimaryDomain: 'systems'," },
23+
24+
// Java
25+
{ search: "\t\ticon: '☕',\n\t\tcolor: '#3776AB',\n\t\tprimaryDomain: 'enterprise',",
26+
replace: "\t\ticon: '☕',\n\t\tcolor: '#3776AB',\n\t\timgURL: 'https://upload.wikimedia.org/wikipedia/en/3/30/Java_programming_language_logo.svg',\n\t\tprimaryDomain: 'enterprise'," },
27+
28+
// C++
29+
{ search: "\t\ticon: '⚡',\n\t\tcolor: '#00599C',\n\t\tprimaryDomain: 'systems',",
30+
replace: "\t\ticon: '⚡',\n\t\tcolor: '#00599C',\n\t\timgURL: 'https://upload.wikimedia.org/wikipedia/commons/1/18/ISO_C%2B%2B_Logo.svg',\n\t\tprimaryDomain: 'systems'," },
31+
];
32+
33+
console.log('Adding imgURL fields using targeted edits...\\n');
34+
35+
const languagesPath = path.join(__dirname, '../src/lib/data/languages.ts');
36+
let content = fs.readFileSync(languagesPath, 'utf-8');
37+
38+
let successCount = 0;
39+
let skipCount = 0;
40+
41+
edits.forEach((edit, index) => {
42+
if (content.includes(edit.search)) {
43+
content = content.replace(edit.search, edit.replace);
44+
console.log(`✅ Applied edit ${index + 1}`);
45+
successCount++;
46+
} else {
47+
console.log(`⚠️ Skipped edit ${index + 1} - pattern not found`);
48+
skipCount++;
49+
}
50+
});
51+
52+
fs.writeFileSync(languagesPath, content, 'utf-8');
53+
54+
console.log(`\\n=== Results ===`);
55+
console.log(`Successfully applied: ${successCount} edits`);
56+
console.log(`Skipped: ${skipCount} edits`);
57+
58+
export {};

0 commit comments

Comments
 (0)