https://msreddy09.github.io/script.js

1var ms_dev = {};
2(context => { 
3    context.companies_template_obj = mySkills.companies_template_obj;
4    context.education_template_obj = mySkills.education;
5    context.createCompanies = () => {
6        $('body .companies_section').empty();  
7        context.companies_template_obj.forEach(company => {
8            context.companies_template = `
9            <div class='col-sm-12 col-md-4'>
10                <div class="card">
11                    <img class ='logo' src=${company.logo}>
12                    <div class="card-header">${company.c_name} <br><small style='color: gray; font-size: 70%'>${company.exp}</small> </div>
13                    <div class="card-body">
14                        <small>
15                            <div class='card-text'> ${company.current_role}</div>
16                            <div>${company.DOJ}</div>
17                            <div>${company.location}</div>
18                        </small>
19                    </div>
20                </div>
21            </div>`;
22            $('body .companies_section').append(context.companies_template);
23        });
24    }
25    context.createSkills = () => {
26        $('#skills #prof div').remove();
27        $('#skills #interm div').remove();
28        $('#skills #begginer div').remove();
29        mySkills.skills.forEach(skill => {
30            let skillTemplate;
31            let progresStyle = 'bg-success';
32            let elCont = ''
33            let perInt = parseInt(skill.per)
34            if(perInt >= 70) {
35                progresStyle = 'bg-success';
36                elCont = '#prof'
37            }else if(perInt > 50 && perInt < 70) {
38                progresStyle = 'bg-info';
39                elCont = '#interm'
40            }else{
41                progresStyle = 'bg-warning';
42                elCont = '#begginer'
43            }
44            skillTemplate =  `<div class="progress">
45            <div class="progress-bar ${progresStyle}" role="progressbar" style="width: ${skill.per}; transition: width 2s linear" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100">
46            <div style="
47            line-height: 10;
48            line-height: 15px;
49            position: absolute;
50            right: 5px; color: #ccc; font-weight: bold;"
51            
52            >${skill.per}</div>
53            <div style="
54            line-height: 10;
55            line-height: 15px;
56            position: absolute;
57            left: 10px;">${skill.name}</div>
58            </div>
59            </div>`
60            //$('#skills '+ elCont).empty();
61            $('#skills '+ elCont).append(skillTemplate);
62        })
63    }
64
65    context.createEducation = () => {
66        $('body #edu .education_section').empty();
67        context.education_template_obj.forEach(edu => {
68            context.education_template = `
69            <div class='col-sm-12 col-md-4'>
70                <div class="card">
71                    <div class="card-header">${edu.course} <br><small style='color: gray; font-size: 70%'><b>Grade: </b>${edu.per}</small> </div>
72                    <div class="card-body">
73                        <small>
74                            <div class='card-text'> ${edu.institute}</div>
75                            <div>${edu.year}</div>
76                            <div>${edu.location}</div>
77                        </small>
78                    </div>
79                </div>
80            </div>`;
81            $('body #edu .education_section').append(context.education_template);
82        });
83
84    }
85
86    context.createContat = () => {
87        $('#contact').empty();
88        let contact_template = `<div class="media">
89        <img width="64" style='margin-right: 15px;border-radius: 32px' src="https://media-exp1.licdn.com/dms/image/C5103AQGRGig68EGT1Q/profile-displayphoto-shrink_100_100/0/1567564097988?e=1616630400&v=beta&t=7hHlzHUq-1j_BIPvnizNm-6FGxkDgk9OWXoh4Kiq3qU" loading="lazy" height="64" alt="" id="ember799" class="d-none d-sm-none d-md-block feed-identity-module__member-photo profile-rail-card__member-photo EntityPhoto-circle-5 lazy-image ember-view">
90        <div class="media-body">
91          <h5 class="mt-0">Sudhakar Reddy Medagam</h5>
92          <div><i class="fas fa-phone"></i> +91 9502030789</div>
93          <div><i class="far fa-envelope"></i> <a href="mailto:[email protected]">[email protected]</a></div>
94          <div><i class="fab fa-linkedin"></i> <a href="https://www.linkedin.com/in/msreddy09/">https://www.linkedin.com/in/msreddy09</a> </div>
95          <div><i class="fab fa-github"></i> <a href="https://github.com/msreddy09">https://msreddy09.github.io/</a> </div>
96          <br/>            
97          <p><a class='btn btn-primary'
98            href='https://docs.google.com/gview?url=https://raw.githubusercontent.com/msreddy09/msreddy09.github.io/master/sudhakar_Sr_Fullstack_JS_developer.docx'
99            download>Download Resume</a> </p>
100        </div>
101      </div>`
102      $('#contact').append(contact_template);
103    }
104    //context.createSkills();
105    //context.createCompanies();
106    //context.createEducation();
107    let tabs = document.querySelectorAll('.nav-link');

108    tabs.forEach((tab) => {
109        tab.addEventListener('click', function(event){
110            let tabName = (event.currentTarget.id);
111            switch(tabName) {
112                case 'skills-tab':  
113                    context.createSkills();
114                    break;
115                case 'exp-tab':
116                    context.createCompanies();
117                    break;
118                case 'port-tab':
119                    context.createEducation()
120                    break;
121                case 'edu-tab':  
122                    context.createEducation()
123                    break;
124                case 'contact-tab':  
125                    context.createContat();
126                    break;
127                default :  break;
128            }
129        })
130    })
131   
132})(ms_dev)
133