NOC Codes Suggester
Upload your resume to receive AI-powered suggestions for Canadian NOC codes that best match your work experience.
.navio-tools-wrapper {
display: flex;
gap: 2rem;
max-width: 1400px;
margin: 2rem auto;
padding: 0 2rem;
}
.beta-badge {
position: absolute;
top: 20px;
right: 20px;
background: #663151;
color: white;
padding: 4px 12px;
border-radius: 4px;
font-size: 0.8em;
font-weight: bold;
text-transform: uppercase;
letter-spacing: 1px;
box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}
.navio-noc-tool-container {
flex: 1;
background: #fff;
border-radius: 8px;
box-shadow: 0 2px 4px rgba(0,0,0,0.1);
font-family: 'Apertura', sans-serif;
padding: 2rem;
position: relative;
}
.navio-form {
background: #fff;
padding: 2rem;
border-radius: 8px;
box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}
.form-group {
margin-bottom: 1.5rem;
}
.form-group label {
display: block;
margin-bottom: 0.5rem;
font-weight: 600;
color: #333;
}
.form-group input[type="file"] {
width: 100%;
padding: 0.75rem;
border: 1px solid #ddd;
border-radius: 4px;
font-size: 1rem;
font-family: 'Apertura', sans-serif;
}
.submit-button {
background-color: #663151;
color: white;
padding: 1rem 2rem;
border: none;
border-radius: 4px;
font-size: 1rem;
cursor: pointer;
transition: background-color 0.3s ease;
font-family: 'Apertura', sans-serif;
font-weight: bold;
text-transform: uppercase;
}
.submit-button:hover {
background-color: #3EA5A5;
}
.loading-indicator {
text-align: center;
padding: 2rem;
}
.spinner {
display: inline-block;
width: 50px;
height: 50px;
border: 3px solid #f3f3f3;
border-top: 3px solid #663151;
border-radius: 50%;
animation: spin 1s linear infinite;
margin-bottom: 1rem;
}
@keyframes spin {
0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }
}
.noc-results {
margin-top: 2rem;
padding: 2rem;
background: #f9f9f9;
border-radius: 8px;
border: 1px solid #ddd;
font-family: 'Apertura', sans-serif;
}
.results-content {
margin-top: 1rem;
line-height: 1.8;
color: #000;
}
.results-content strong {
display: inline;
color: #000;
font-weight: bold;
}
.results-content .result-section {
margin: 15px 0 10px 0;
font-weight: normal;
}
.results-content ul {
list-style-type: none;
padding-left: 20px;
margin: 10px 0;
}
.results-content li {
margin-bottom: 8px;
position: relative;
font-weight: normal;
}
.results-content li:before {
content: "•";
position: absolute;
left: -15px;
color: #000;
}
.job-listing {
background: white;
padding: 20px;
margin-bottom: 20px;
border-radius: 4px;
box-shadow: 0 1px 3px rgba(0,0,0,0.1);
}
.job-listing h4 {
margin: 0 0 15px 0;
color: #663151;
}
.job-listing h4 a {
color: #663151;
text-decoration: none;
transition: color 0.3s;
}
.job-listing h4 a:hover {
color: #3EA5A5;
text-decoration: underline;
}
.job-listing .job-details {
color: #666;
font-size: 0.95em;
}
.job-detail-row {
margin-bottom: 8px;
display: flex;
align-items: center;
}
.job-detail-row i {
width: 20px;
margin-right: 10px;
color: #663151;
}
.load-more-button {
display: inline-block;
background-color: #663151;
color: white;
padding: 1rem 2rem;
text-decoration: none;
border-radius: 4px;
font-size: 1rem;
font-weight: bold;
text-transform: uppercase;
transition: background-color 0.3s ease;
}
.load-more-button:hover {
background-color: #3EA5A5;
color: white;
}
.job-separator {
border: none;
border-top: 1px solid #ddd;
margin: 20px 0;
}
/* Responsive adjustments */
@media (max-width: 768px) {
.navio-noc-tool-container {
padding: 1rem;
margin: 1rem;
}
.submit-button,
.load-more-button {
width: 100%;
}
}
.tool-description {
margin-top: 20px;
padding: 1.5rem;
border-radius: 6px;
list-style-type: none;
align-self: flex-start;
position: sticky;
top: 2rem;
}
.tool-description h4 {
color: #663151;
margin-bottom: 1rem;
font-size: 1.1em;
font-weight: bold;
}
.tool-description ul {
list-style-type: none;
padding: 0;
margin: 0;
}
.tool-description li {
position: relative;
padding-left: 1.5rem;
margin-bottom: 0.75rem;
color: #555;
line-height: 1.5;
}
.tool-description li:before {
content: "•";
position: absolute;
left: 0;
color: #663151;
font-weight: bold;
}
.tool-description li:last-child {
margin-bottom: 0;
}
.noc-title-highlight {
background: #fffbe6;
border-left: 5px solid #663151;
padding: 12px 18px;
margin: 18px 0;
font-size: 1.15em;
font-weight: bold;
color: #663151;
border-radius: 4px;
box-shadow: 0 1px 3px rgba(102,49,81,0.07);
}
.navio-disclaimer {
background: #fff3cd;
color: #856404;
border-left: 5px solid #ffc107;
padding: 16px 22px;
margin: 24px 0 0 0;
border-radius: 4px;
font-size: 1em;
box-shadow: 0 1px 3px rgba(133,100,4,0.07);
}
/* New NOC Results Styles */
.lead-statement {
margin: 20px 0;
padding: 15px;
background: #f8f9fa;
border-left: 4px solid #663151;
}
.lead-statement blockquote {
margin: 10px 0 0 0;
font-style: italic;
color: #555;
}
.duty-alignment {
margin: 20px 0;
}
.duty-table {
width: 100%;
border-collapse: collapse;
margin: 10px 0;
}
.duty-table th,
.duty-table td {
padding: 12px;
border: 1px solid #ddd;
text-align: left;
}
.duty-table th {
background-color: #f5f5f5;
font-weight: 600;
}
.duty-table tr:nth-child(even) {
background-color: #f9f9f9;
}
.duty-overlap,
.rationale {
margin: 15px 0;
padding: 12px;
background: #f8f9fa;
border-radius: 4px;
}
.alternate-match {
margin: 25px 0;
padding: 15px;
background: #fff;
border: 1px solid #ddd;
border-radius: 4px;
}
.alternate-match h3 {
color: #663151;
margin: 0 0 10px 0;
}
.key-fit,
.key-gap {
margin: 10px 0;
padding: 10px;
background: #f8f9fa;
border-radius: 4px;
}
.recommendation {
margin: 25px 0;
padding: 20px;
background: #fffbe6;
border-left: 5px solid #663151;
border-radius: 4px;
}
.recommendation h3 {
color: #663151;
margin: 0 0 15px 0;
}
.recommendation blockquote {
margin: 0;
font-style: italic;
color: #555;
}
jQuery(document).ready(function($) {
// Function to format the NOC analysis content
function formatNocContent(content) {
try {
if (!content) {
throw new Error('No content provided for formatting');
}
// Remove markdown code block markers and convert horizontal rules
content = content
.replace(/^```html\n?/gm, '') // Remove opening HTML code block at start of line
.replace(/^```\n?/gm, '') // Remove closing code block at start of line
.replace(/^---$/gm, '
'); // Convert horizontal rules if (!content.trim()) { throw new Error('No content was formatted successfully'); } return content; } catch (error) { console.error('Error formatting content:', error); return ''; } } // Function to fetch and display job listings function fetchJobListings(nocCode, jobTitle) { console.log('Fetching job listings for:', nocCode, jobTitle); // Show job loading indicator $('.jobs-content').html('');
$.ajax({
url: 'https://navioimmigration.com/wp-admin/admin-ajax.php',
type: 'GET',
data: {
action: 'fetch_job_bank_jobs',
nonce: 'd8fd393372',
noc_code: nocCode,
job_title: jobTitle
},
success: function(response) {
console.log('Received job listings response');
if (response.success) {
// Parse the HTML response to extract job listings
const parser = new DOMParser();
const doc = parser.parseFromString(response.data, 'text/html');
const jobListings = doc.querySelectorAll('article');
if (jobListings && jobListings.length > 0) {
const jobsHtml = Array.from(jobListings)
.slice(0, 10) // Limit to first 10 results
.map(job => {
const jobLink = job.querySelector('a.resultJobItem')?.href || '';
const jobPath = jobLink.split('/jobsearch/')[1] || '';
const fullJobLink = `https://www.jobbank.gc.ca/jobsearch/${jobPath}`;
const title = job.querySelector('.noctitle')?.textContent?.trim() || '';
const company = job.querySelector('.business')?.textContent?.trim() || '';
const location = job.querySelector('.location')?.textContent?.trim() || '';
const salary = job.querySelector('.salary')?.textContent?.trim() || '';
const date = job.querySelector('.date')?.textContent?.trim() || '';
return `
`; }).join(''); $('.jobs-content').html(jobsHtml); console.log('Displayed job listings'); } else { $('.jobs-content').html('
'); // Convert horizontal rules if (!content.trim()) { throw new Error('No content was formatted successfully'); } return content; } catch (error) { console.error('Error formatting content:', error); return ''; } } // Function to fetch and display job listings function fetchJobListings(nocCode, jobTitle) { console.log('Fetching job listings for:', nocCode, jobTitle); // Show job loading indicator $('.jobs-content').html('
Searching for related jobs...
${title}
${company}
${location}
${salary}
${date}
`; }).join(''); $('.jobs-content').html(jobsHtml); console.log('Displayed job listings'); } else { $('.jobs-content').html('
No related jobs found at this time.
'); console.log('No job listings found'); } } else { $('.jobs-content').html('Unable to fetch related jobs. Please try again later.
'); console.log('Error in job listings response'); } // Set the load more button URL $('.load-more-button').attr('href', `https://www.jobbank.gc.ca/jobsearch/jobsearch?term=${encodeURIComponent(jobTitle)}&page=1&sort=M`); }, error: function() { console.error('Error fetching job listings'); $('.jobs-content').html('Unable to fetch related jobs. Please try again later.
'); } }); } $('#noc-tool-form').on('submit', function(e) { e.preventDefault(); const formData = new FormData(this); formData.append('action', 'analyze_resume'); formData.append('nonce', 'd8fd393372'); // Complete cleanup of all content $('#noc-results').hide(); $('.results-content').empty().hide(); $('.jobs-content').empty(); $('.loading-indicator').show(); console.log('Form submitted - cleaning up previous content'); $.ajax({ url: 'https://navioplatform.com/SelectNocCodes', type: 'POST', data: formData, processData: false, contentType: false, success: function(response) { try { console.log('Received response from server'); if (!response) { throw new Error('No response received from server'); } // Store the original response for NOC code extraction const originalResponse = response; // Try to find Primary Match in both formats let primaryMatchIndex = originalResponse.indexOf('Primary Match
'); if (primaryMatchIndex === -1) { primaryMatchIndex = originalResponse.indexOf('# Primary Match'); } if (primaryMatchIndex === -1) { console.log('Response content:', originalResponse); throw new Error('Could not find Primary Match section in response'); } // Get everything from the first occurrence of Primary Match const cleanedResponse = originalResponse.substring(primaryMatchIndex); console.log('Cleaned response:', cleanedResponse); // Try both formats for NOC code extraction let nocCodeMatch = cleanedResponse.match(/NOC (\d+) – ([^<]+)/); if (!nocCodeMatch) { nocCodeMatch = cleanedResponse.match(/\*\*NOC (\d+) – ([^*]+)\*\*/); } console.log('NOC Code Match:', nocCodeMatch); // Format the content const formattedContent = formatNocContent(cleanedResponse); console.log('Formatted content:', formattedContent); // Create a temporary container for the formatted content const resultsContainer = $('').html(formattedContent);
// Hide loading indicator
$('.loading-indicator').hide();
// Show results container with formatted content
$('#noc-results').show();
$('.results-content').html(resultsContainer).show();
console.log('Displaying formatted content');
if (nocCodeMatch) {
const nocCode = nocCodeMatch[1];
const jobTitle = nocCodeMatch[2].trim();
console.log('Extracted NOC Code:', nocCode);
console.log('Extracted Job Title:', jobTitle);
// Now fetch job listings
fetchJobListings(nocCode, jobTitle);
} else {
console.log('No NOC code or job title found in the response');
$('.jobs-content').html('
No NOC code matches found in the resume.
'); } } catch (error) { console.error('Error processing response:', error); $('.loading-indicator').hide(); $('.results-content').html('').show(); $('#noc-results').show(); } }, error: function(xhr, status, error) { console.error('Error occurred:', error); $('.loading-indicator').hide(); $('.results-content').html('').show(); $('#noc-results').show(); } }); }); });