Skip to content

Commit

Permalink
Browse files Browse the repository at this point in the history
Removed some options
Instead of styling via JS, I'm adding more control for the classes. Then
people can style however they want.
  • Loading branch information
jfitzsimmons2 committed Apr 5, 2014
1 parent 0085d61 commit b0542b6
Showing 1 changed file with 24 additions and 19 deletions.
43 changes: 24 additions & 19 deletions src/toc.scroll.progress.js
Expand Up @@ -2,19 +2,20 @@

(function ( $, window, document ) {

var $this;

$.fn.tocProgress = function( options ) {

//reference to the element that called the plugin
var $this = $(this);
$this = $(this);
console.log($this);

var settings = $.extend({
// Defaults
storyElem: '.story',
barsContainer: 'barsContainer',
barClass: 'toc-storybar',
headlineSelector: 'h2',
barColorBG: 'gray',
barColor: 'blue',
topText: 'Back to top'
}, options );

Expand All @@ -24,15 +25,14 @@
setupHTML( settings.storyElem );
initProgressBars(
settings.barsContainer,
settings.barClass,
settings.barColorBG,
settings.barClass,
settings.headlineSelector,
settings.topText
);

makeBarsClickable( thestories() );
$(window).scroll(function(event) {
calcProgress(settings.barColor);
calcProgress();
});
return this;

Expand All @@ -41,9 +41,13 @@
/* Helpers */
function Story() {}

var numStories = function() {
return $('[data-index]');
}
function numStories() {
var i = 0;
$('[data-index]').each(function() {
i++;
});
return i;
}

var getHeadline = function( i,elem ) {
return $('[data-index='+i+'] ' + elem + '').first().text();
Expand All @@ -57,27 +61,28 @@

}

var initProgressBars = function( barsContainer, barClass, barColorBG, headlineSelector, topText ) {
var initProgressBars = function( barsContainer, barClass, headlineSelector, topText ) {

var numStories = 4;
var output = "";
for (var i = 0; i < numStories; i++) {
output += '<div class="' + barClass + '" style="background: ' + barColorBG + ';" data-story="'+i+'">';
for (var i = 0; i < numStories(); i++) {
output += '<div class="' + barClass + '";" data-story="'+i+'">';
output += '<p>' + getHeadline(i, headlineSelector) + '</p>';
output += '<div class="toc-bar"></div>';
output += '</div>';
};

$( '#' + barsContainer ).append(output);
$( '.' + barClass ).css('cursor', 'pointer');

addTopLink( topText ); //

}

var addTopLink = function( wording ) {
$("#progress").append('<div class="top">' + wording + '</div>');
$('.top').css('cursor','pointer');
$('.top').click(function(event) {
function addTopLink( wording ) {

$this.append('<div class="toc-top">' + wording + '</div>');
$('.toc-top').css('cursor','pointer');
$('.toc-top').click(function(event) {
$('body,html').animate({ 'scrollTop': 0 });
});
}
Expand Down Expand Up @@ -117,7 +122,7 @@

}

var calcProgress = function(color) {
var calcProgress = function() {
var scrollTop = $(window).scrollTop();
var temp;
var width;
Expand All @@ -127,7 +132,7 @@
$.each(s, function(index, story) {
temp = scrollTop - story.top;
width = temp / story.height * 100;
setBarWidth(story.index, width, color);
setBarWidth(story.index, width);
});

}
Expand Down

0 comments on commit b0542b6

Please sign in to comment.