Skip to content

Commit

Permalink
Merge pull request #37 from soumak77/refactor-text-logic
Browse files Browse the repository at this point in the history 
Only create SVG once and update child elements as needed
  • Loading branch information
@germanattanasio
germanattanasio authored Mar 25, 2018
2 parents 034199a + 2ac2405 commit e5b6b8c
Show file tree
Hide file tree
Showing 12 changed files with 1,436 additions and 725 deletions.
77 changes: 60 additions & 17 deletions docs/index-d3v4-test.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -53,6 +53,7 @@ <h4>Personality Insights Sunburst Chart</h4>
</div>

<script>
var chart = null;
var options = {
selector: '#sunburstChart',
version: 'v2',
Expand All @@ -61,39 +62,81 @@ <h4>Personality Insights Sunburst Chart</h4>
};

$('#personality-insights-v2').click(function() {
options.version = 'v2';
$('#personality-insights-v2').removeClass('btn-default').addClass('btn-primary');
$('#personality-insights-v3').removeClass('btn-primary').addClass('btn-default');
show();
if (!chart || options.version === 'v3') {
options.version = 'v2';
show();
} else {
options.version = 'v2';
$.getJSON(getFilePath(), '', function ( profile ) {
// TODO: randomize data in profile
chart.setProfile(profile);
});
}
updateButtonClasses();
});

$('#personality-insights-v3').click(function() {
options.version = 'v3';
$('#personality-insights-v2').removeClass('btn-primary').addClass('btn-default');
$('#personality-insights-v3').removeClass('btn-default').addClass('btn-primary');
show();
if (!chart || options.version === 'v2') {
options.version = 'v3';
show();
} else {
options.version = 'v3';
$.getJSON(getFilePath(), '', function ( profile ) {
// TODO: randomize data in profile
chart.setProfile(profile);
});
}
updateButtonClasses();
});

$('#locale-en').click(function() {
options.locale = 'en';
$('#locale-en').removeClass('btn-default').addClass('btn-primary');
$('#locale-es').removeClass('btn-primary').addClass('btn-default');
show();
if (chart) {
chart.setLocale('en', true);
} else {
show();
}
updateButtonClasses();
});

$('#locale-es').click(function() {
options.locale = 'es';
$('#locale-en').removeClass('btn-primary').addClass('btn-default');
$('#locale-es').removeClass('btn-default').addClass('btn-primary');
show();
if (chart) {
chart.setLocale('es', true);
} else {
show();
}
updateButtonClasses();
});

function updateButtonClasses() {
if (options.locale === 'es') {
$('#locale-en').removeClass('btn-primary').addClass('btn-default');
$('#locale-es').removeClass('btn-default').addClass('btn-primary');
} else {
$('#locale-en').removeClass('btn-default').addClass('btn-primary');
$('#locale-es').removeClass('btn-primary').addClass('btn-default');
}

if (options.version === 'v2') {
$('#personality-insights-v2').removeClass('btn-default').addClass('btn-primary');
$('#personality-insights-v3').removeClass('btn-primary').addClass('btn-default');
} else {
$('#personality-insights-v2').removeClass('btn-primary').addClass('btn-default');
$('#personality-insights-v3').removeClass('btn-default').addClass('btn-primary');
}
}

function getFilePath() {
var suffix = Math.random() > 0.5 ? '_2' : '';
return './profiles/en_' + options.version + suffix + '.json';
}

function show() {
var file = './profiles/en_' + options.version + '.json';
$.getJSON(file, '', function ( profile ) {
$.getJSON(getFilePath(), '', function ( profile ) {
$('#profile').empty();
$('#profile').append('<pre>' + JSON.stringify(profile, null, 2) + '</pre>');
var chart = new PersonalitySunburstChart(options);
chart = new PersonalitySunburstChart(options);
chart.show(profile, './profile_photo.jpg');
});
}
Expand Down
75 changes: 58 additions & 17 deletions docs/index-test.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -51,6 +51,7 @@ <h4>Personality Insights Sunburst Chart</h4>
</div>

<script>
var chart = null;
var options = {
selector: '#sunburstChart',
version: 'v2',
Expand All @@ -59,39 +60,79 @@ <h4>Personality Insights Sunburst Chart</h4>
};

$('#personality-insights-v2').click(function() {
options.version = 'v2';
$('#personality-insights-v2').removeClass('btn-default').addClass('btn-primary');
$('#personality-insights-v3').removeClass('btn-primary').addClass('btn-default');
show();
if (!chart || options.version === 'v3') {
options.version = 'v2';
show();
} else {
options.version = 'v2';
$.getJSON(getFilePath(), '', function ( profile ) {
chart.setProfile(profile);
});
}
updateButtonClasses();
});

$('#personality-insights-v3').click(function() {
options.version = 'v3';
$('#personality-insights-v2').removeClass('btn-primary').addClass('btn-default');
$('#personality-insights-v3').removeClass('btn-default').addClass('btn-primary');
show();
if (!chart || options.version === 'v2') {
options.version = 'v3';
show();
} else {
options.version = 'v3';
$.getJSON(getFilePath(), '', function ( profile ) {
chart.setProfile(profile);
});
}
updateButtonClasses();
});

$('#locale-en').click(function() {
options.locale = 'en';
$('#locale-en').removeClass('btn-default').addClass('btn-primary');
$('#locale-es').removeClass('btn-primary').addClass('btn-default');
show();
if (chart) {
chart.setLocale('en', true);
} else {
show();
}
updateButtonClasses();
});

$('#locale-es').click(function() {
options.locale = 'es';
$('#locale-en').removeClass('btn-primary').addClass('btn-default');
$('#locale-es').removeClass('btn-default').addClass('btn-primary');
show();
if (chart) {
chart.setLocale('es', true);
} else {
show();
}
updateButtonClasses();
});

function updateButtonClasses() {
if (options.locale === 'es') {
$('#locale-en').removeClass('btn-primary').addClass('btn-default');
$('#locale-es').removeClass('btn-default').addClass('btn-primary');
} else {
$('#locale-en').removeClass('btn-default').addClass('btn-primary');
$('#locale-es').removeClass('btn-primary').addClass('btn-default');
}

if (options.version === 'v2') {
$('#personality-insights-v2').removeClass('btn-default').addClass('btn-primary');
$('#personality-insights-v3').removeClass('btn-primary').addClass('btn-default');
} else {
$('#personality-insights-v2').removeClass('btn-primary').addClass('btn-default');
$('#personality-insights-v3').removeClass('btn-default').addClass('btn-primary');
}
}

function getFilePath() {
var suffix = Math.random() > 0.5 ? '_2' : '';
return './profiles/en_' + options.version + suffix + '.json';
}

function show() {
var file = './profiles/en_' + options.version + '.json';
$.getJSON(file, '', function ( profile ) {
$.getJSON(getFilePath(), '', function ( profile ) {
$('#profile').empty();
$('#profile').append('<pre>' + JSON.stringify(profile, null, 2) + '</pre>');
var chart = new PersonalitySunburstChart(options);
chart = new PersonalitySunburstChart(options);
chart.show(profile, './profile_photo.jpg');
});
}
Expand Down
Loading

0 comments on commit e5b6b8c

Please sign in to comment.