Skip to content

Commit

Permalink
fw-v5 updates
Browse files Browse the repository at this point in the history
  • Loading branch information
RobertPeek committed Sep 10, 2020
1 parent fc9061a commit 664b205
Show file tree
Hide file tree
Showing 6 changed files with 169 additions and 167 deletions.
4 changes: 2 additions & 2 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -51,8 +51,8 @@ The Logo attribute group contains values for **_isEnabled**, **_position**, **_g
>>**_parentPage** (boolean): If set to `true`, the link will be the parent of the current page.
----------------------------
**Version number:** 2.2.0
**Framework versions supported:** 2+
**Version number:** 3.0.0
**Framework versions supported:** 5+
**Author / maintainer:** DeltaNet with [contributors](https://github.com/deltanet/adapt-logo/graphs/contributors)
**Accessibility support:** Yes
**RTL support:** Yes
Expand Down
6 changes: 3 additions & 3 deletions bower.json
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
{
"name": "adapt-logo",
"version": "2.2.0",
"framework": ">=2",
"version": "3.0.0",
"framework": ">=5",
"homepage": "https://github.com/deltanet/adapt-logo",
"issues": "https://github.com/deltanet/adapt-logo/issues",
"displayName": "Logo",
Expand All @@ -12,6 +12,6 @@
"adapt-plugin",
"adapt-extension"
],
"license": "GPLv3",
"license": "GPL-3.0",
"targetAttribute": "_logo"
}
72 changes: 36 additions & 36 deletions js/adapt-logo.js
Original file line number Diff line number Diff line change
@@ -1,52 +1,52 @@
define([
'core/js/adapt',
'./logoView'
], function(Adapt, LogoView) {
'core/js/adapt',
'./logoView'
], function (Adapt, LogoView) {

var Logo = _.extend({
var Logo = _.extend({

initialize: function() {
this.listenToOnce(Adapt, 'app:dataReady', this.onAppDataReady);
},
initialize: function () {
this.listenToOnce(Adapt, 'app:dataReady', this.onAppDataReady);
},

onAppDataReady: function() {
this.listenTo(Adapt.config, 'change:_activeLanguage', this.onLangChange);
onAppDataReady: function () {
this.listenTo(Adapt.config, 'change:_activeLanguage', this.onLangChange);

if (!Adapt.course.get('_logo')) return;
if (!Adapt.course.get('_logo')) return;

if (Adapt.course.get('_logo')._isEnabled) {
this.setupLogo();
this.setupListeners();
}
},
if (Adapt.course.get('_logo')._isEnabled) {
this.setupLogo();
this.setupListeners();
}
},

onLangChange: function() {
this.removeListeners();
this.listenToOnce(Adapt, 'app:dataReady', this.onAppDataReady);
},
onLangChange: function () {
this.removeListeners();
this.listenToOnce(Adapt, 'app:dataReady', this.onAppDataReady);
},

setupLogo: function() {
this.config = Adapt.course.get('_logo');
this.model = new Backbone.Model(this.config);
},
setupLogo: function () {
this.config = Adapt.course.get('_logo');
this.model = new Backbone.Model(this.config);
},

setupListeners: function() {
this.listenTo(Adapt, 'navigationView:postRender', this.renderLogoView);
},
setupListeners: function () {
this.listenTo(Adapt, 'navigationView:postRender', this.renderLogoView);
},

removeListeners: function() {
this.stopListening(Adapt, 'navigationView:postRender', this.renderLogoView);
this.stopListening(Adapt.config, 'change:_activeLanguage', this.onLangChange);
},
removeListeners: function () {
this.stopListening(Adapt, 'navigationView:postRender', this.renderLogoView);
this.stopListening(Adapt.config, 'change:_activeLanguage', this.onLangChange);
},

renderLogoView: function() {
new LogoView({model: this.model});
}
renderLogoView: function () {
new LogoView({model: this.model});
}

}, Backbone.Events);
}, Backbone.Events);

Logo.initialize();
Logo.initialize();

return Logo;
return Logo;

});
210 changes: 105 additions & 105 deletions js/logoView.js
Original file line number Diff line number Diff line change
@@ -1,111 +1,111 @@
define([
'core/js/adapt'
], function(Adapt) {

var LogoView = Backbone.View.extend({

className: 'logo',

events: {
'click .logo-button': 'onClick'
},

initialize: function() {
this.listenTo(Adapt.config, 'change:_activeLanguage', this.remove);
this.listenTo(Adapt, 'device:changed', this.setupLogo);
this.render();
},

render: function() {
var data = this.model.toJSON();
var template = Handlebars.templates['logo'];

// Check position
if (this.model.get('_position') == "left" || this.model.get('_position') == "right") {
this.$el.html(template(data)).prependTo('.navigation'+'>.navigation-inner');
} else {
this.$el.html(template(data)).appendTo('.navigation'+'>.navigation-inner');
}

this.image = "";
this.title = "";

this.setupLogo();
},

setupLogo: function () {
this.deviceSize = Adapt.device.screenSize;
this.image = "";
this.title = "";

// Add image if enabled
if (this.model.get('_graphic')._isEnabled) {
// Check device size
switch (this.deviceSize) {
case "large":
this.image = this.model.get('_graphic')._large;
break;
case "medium":
this.image = this.model.get('_graphic')._medium;
break;
default:
// If "small"
this.image = this.model.get('_graphic')._small;
}
// Add image
this.$('img').attr('src', this.image);
}
// add title if enabled
if (this.model.get('_title')._isEnabled) {
// Check device size
switch (this.deviceSize) {
case "large":
this.title = this.model.get('_title').large;
break;
case "medium":
this.title = this.model.get('_title').medium;
break;
default:
// If "small"
this.title = this.model.get('_title').small;
}
// Add title
this.$('.course-title').html(this.title);
}

// Add class to logo
this.$el.addClass(this.model.get('_position'));

// Hide elements if they are empty
if (this.image == "") {
this.$('.course-logo').hide();
} else {
this.$('.course-logo').show();
}

if (this.title == "") {
this.$('.course-title').hide();
} else {
this.$('.course-title').show();
}
},

onClick: function(event) {
if (event && event.preventDefault) event.preventDefault();

var currentId = Adapt.location._currentId;
var parentId = Adapt.contentObjects.findWhere({ _id: currentId }).get('_parentId');

// Don't continue if the page is in the root of the course
if (parentId === "course") return;

if (this.model.get('_link')._parentPage) {
Adapt.trigger('navigation:parentButton');
}
'core/js/adapt'
], function (Adapt) {

var LogoView = Backbone.View.extend({

className: 'logo',

events: {
'click .js-nav-logo-btn': 'onClick'
},

initialize: function () {
this.listenTo(Adapt.config, 'change:_activeLanguage', this.remove);
this.listenTo(Adapt, 'device:changed', this.setupLogo);
this.render();
},

render: function () {
var data = this.model.toJSON();
var template = Handlebars.templates['logo'];

// Check position
if (this.model.get('_position') == "left" || this.model.get('_position') == "right") {
this.$el.html(template(data)).prependTo('.nav'+'>.nav__inner');
} else {
this.$el.html(template(data)).appendTo('.nav'+'>.nav__inner');
}

this.image = "";
this.title = "";

this.setupLogo();
},

setupLogo: function () {
this.deviceSize = Adapt.device.screenSize;
this.image = "";
this.title = "";

// Add image if enabled
if (this.model.get('_graphic')._isEnabled) {
// Check device size
switch (this.deviceSize) {
case "large":
this.image = this.model.get('_graphic')._large;
break;
case "medium":
this.image = this.model.get('_graphic')._medium;
break;
default:
// If "small"
this.image = this.model.get('_graphic')._small;
}
// Add image
this.$('img').attr('src', this.image);
}
// add title if enabled
if (this.model.get('_title')._isEnabled) {
// Check device size
switch (this.deviceSize) {
case "large":
this.title = this.model.get('_title').large;
break;
case "medium":
this.title = this.model.get('_title').medium;
break;
default:
// If "small"
this.title = this.model.get('_title').small;
}
// Add title
this.$('.logo__title').html(this.title);
}

// Add class to logo
this.$el.addClass(this.model.get('_position'));

// Hide elements if they are empty
if (this.image == "") {
this.$('.logo__image').hide();
} else {
this.$('.logo__image').show();
}

if (this.title == "") {
this.$('.logo__title').hide();
} else {
this.$('.logo__title').show();
}
},

onClick: function (event) {
if (event && event.preventDefault) event.preventDefault();

var currentId = Adapt.location._currentId;
var parentId = Adapt.contentObjects.findWhere({ _id: currentId }).get('_parentId');

// Don't continue if the page is in the root of the course
if (parentId === "course") return;

if (this.model.get('_link')._parentPage) {
Adapt.router.navigateToParent();
}
}

});
});

return LogoView;
return LogoView;

});
25 changes: 13 additions & 12 deletions less/logo.less
Original file line number Diff line number Diff line change
@@ -1,36 +1,37 @@
.logo {

.logo-button {
&__btn {
&.inactive {
cursor: default;
}
background-color: @nav;
padding: 0;
}

.course-title {
padding: @navigation-padding / 2;
color: @tertiary-color-inverted;
&__title {
color: @nav-inverted;

font-size: @sub-title-font-size;
font-weight: @sub-title-font-weight;
line-height: @navigation-padding + @icon-size;
font-size: @body-size;
font-weight: @font-weight-bold;
line-height: (@icon-padding * 2) + @icon-size;

margin-left: @navigation-padding;
margin-right: @navigation-padding;
margin-left: @icon-padding;
margin-right: @icon-padding;

float: left;
.dir-rtl & {
float: right;
}
}

.course-logo {
padding: @navigation-padding / 2;
&__image {
padding: @icon-padding / 2;
float: left;
.dir-rtl & {
float: right;
}
img {
height: @navigation-padding + @icon-size;
height: @icon-padding + @icon-size;
}
}

Expand Down
Loading

0 comments on commit 664b205

Please sign in to comment.