diff --git a/src/js/views/levelDropdownView.js b/src/js/views/levelDropdownView.js index 889dd5fe..ad0bcee7 100644 --- a/src/js/views/levelDropdownView.js +++ b/src/js/views/levelDropdownView.js @@ -281,7 +281,6 @@ var LevelDropdownView = ContainedBase.extend({ // also go find the series and update the about _.each(this.seriesViews, function(view) { if (view.levelIDs.indexOf(id) === -1) { - view.resetAbout(); return; } view.updateAboutForLevelID(id); @@ -354,8 +353,7 @@ var SeriesView = BaseView.extend({ template: _.template($('#series-view').html()), events: { 'click div.levelIcon': 'click', - 'mouseenter div.levelIcon': 'enterIcon', - 'mouseleave div.levelIcon': 'leaveIcon' + 'mouseenter div.levelIcon': 'enterIcon' }, initialize: function(options) { @@ -365,7 +363,11 @@ var SeriesView = BaseView.extend({ this.levels = LevelStore.getLevelsInSequence(this.name); this.levelIDs = []; + var firstLevelInfo = null; _.each(this.levels, function(level) { + if (firstLevelInfo === null) { + firstLevelInfo = intl.getName(LevelStore.getLevel(level.id)); + } this.levelIDs.push(level.id); }, this); @@ -375,6 +377,7 @@ var SeriesView = BaseView.extend({ this.JSON = { displayName: intl.getIntlKey(this.info, 'displayName'), about: intl.getIntlKey(this.info, 'about') || " ", + levelInfo: firstLevelInfo, ids: this.levelIDs }; @@ -396,13 +399,8 @@ var SeriesView = BaseView.extend({ return $(element).attr('data-id'); }, - resetAbout: function() { - this.$('p.about').text(intl.getIntlKey(this.info, 'about')) - .css('font-style', 'inherit'); - }, - setAbout: function(content) { - this.$('p.about').text(content).css('font-style', 'italic'); + this.$('p.levelInfo').text(content); }, enterIcon: function(ev) { @@ -412,11 +410,10 @@ var SeriesView = BaseView.extend({ updateAboutForLevelID: function(id) { var level = LevelStore.getLevel(id); - this.setAbout(intl.getName(level)); - }, - - leaveIcon: function() { - this.resetAbout(); + // hack -- parse out the level number from + // the ID + var levelNumber = id.replace(/[^0-9]/g, ''); + this.setAbout(levelNumber + ': ' + intl.getName(level)); }, click: function(ev) { diff --git a/src/style/main.css b/src/style/main.css index 18da8cba..d6d283d7 100644 --- a/src/style/main.css +++ b/src/style/main.css @@ -865,6 +865,7 @@ div.displayName h3 { div.iconHolder { } +div.seriesView p.levelInfo, div.seriesView p.about { margin: 0px; padding: 4px; @@ -872,6 +873,10 @@ div.seriesView p.about { color: #CCC; } +div.seriesView p.levelInfo { + font-style: italic; +} + div.levelIcon { height: 40px; width: 40px; diff --git a/src/template.index.html b/src/template.index.html index 4c8458e6..f33306f0 100644 --- a/src/template.index.html +++ b/src/template.index.html @@ -222,6 +222,9 @@

<%= about %>

+

+ <%= levelInfo %> +

<% for (var i = 0; i < ids.length; i++) { %>