@ministryofjustice/frontend - npm Package Compare versions

Comparing version 0.0.5-alpha to 0.0.6-alpha

all.js

@@ -0,1 +1,2 @@
+var MOJFrontend = {};
 MOJFrontend.removeAttributeValue = function(el, attr, value) {
@@ -28,3 +29,2 @@ var re, m;
 };
-var MOJFrontend = {};
 MOJFrontend.AddAnother = function(container) {
@@ -102,2 +102,87 @@ this.container = $(container);
 };
+MOJFrontend.FilterToggleButton = function(options) {
+  this.options = options;
+  this.container = this.options.toggleButton.container;
+  this.createToggleButton();
+  this.setupResponsiveChecks();
+  this.options.filter.container.attr('tabindex', '-1');
+  if(this.options.startHidden) {
+    this.hideMenu();
+  }
+};
+
+MOJFrontend.FilterToggleButton.prototype.setupResponsiveChecks = function() {
+  this.mq = window.matchMedia(this.options.bigModeMediaQuery);
+  this.mq.addListener($.proxy(this, 'checkMode'));
+  this.checkMode(this.mq);
+};
+
+MOJFrontend.FilterToggleButton.prototype.createToggleButton = function() {
+  this.menuButton = $('<button class="govuk-button '+this.options.toggleButton.classes+'" type="button" aria-haspopup="true" aria-expanded="false">'+this.options.toggleButton.showText+'</button>');
+  this.menuButton.on('click', $.proxy(this, 'onMenuButtonClick'));
+  this.options.toggleButton.container.append(this.menuButton);
+};
+
+MOJFrontend.FilterToggleButton.prototype.checkMode = function(mq) {
+  if(mq.matches) {
+    this.enableBigMode();
+  } else {
+    this.enableSmallMode();
+  }
+};
+
+MOJFrontend.FilterToggleButton.prototype.enableBigMode = function() {
+  this.showMenu();
+  this.removeCloseButton();
+};
+
+MOJFrontend.FilterToggleButton.prototype.enableSmallMode = function() {
+  this.hideMenu();
+  this.addCloseButton();
+};
+
+MOJFrontend.FilterToggleButton.prototype.addCloseButton = function() {
+  if(this.options.closeButton) {
+    this.closeButton = $('<button class="moj-filter__close" type="button">'+this.options.closeButton.text+'</button>');
+    this.closeButton.on('click', $.proxy(this, 'onCloseClick'));
+    this.options.closeButton.container.append(this.closeButton);
+  }
+};
+
+MOJFrontend.FilterToggleButton.prototype.onCloseClick = function() {
+  this.hideMenu();
+  this.menuButton.focus();
+};
+
+MOJFrontend.FilterToggleButton.prototype.removeCloseButton = function() {
+  if(this.closeButton) {
+    this.closeButton.remove();
+    this.closeButton = null;
+  }
+};
+
+MOJFrontend.FilterToggleButton.prototype.hideMenu = function() {
+  this.menuButton.attr('aria-expanded', 'false');
+  this.options.filter.container.addClass('moj-hidden');
+  this.menuButton.text(this.options.toggleButton.showText);
+};
+
+MOJFrontend.FilterToggleButton.prototype.showMenu = function() {
+  this.menuButton.attr('aria-expanded', 'true');
+  this.options.filter.container.removeClass('moj-hidden');
+  this.menuButton.text(this.options.toggleButton.hideText);
+};
+
+MOJFrontend.FilterToggleButton.prototype.onMenuButtonClick = function() {
+  this.toggle();
+};
+
+MOJFrontend.FilterToggleButton.prototype.toggle = function() {
+  if(this.menuButton.attr('aria-expanded') == 'false') {
+    this.showMenu();
+    this.options.filter.container.focus();
+  } else {
+    this.hideMenu();
+  }
+};
 MOJFrontend.FormValidator = function(form, options) {
@@ -395,3 +480,3 @@ this.form = form;
 	} else {
-		this.container.find('[role=menutiem]').first().focus();
+		this.container.find('[role=menuitem]').first().focus();
 	}
@@ -405,3 +490,3 @@ };
 	} else {
-		this.container.find('[role=menutiem]').last().focus();
+		this.container.find('[role=menuitem]').last().focus();
 	}
@@ -408,0 +493,0 @@ };

components/moj-menu/menu.js

@@ -137,3 +137,3 @@ MOJFrontend.Menu = function(params) {
 	} else {
-		this.container.find('[role=menutiem]').first().focus();
+		this.container.find('[role=menuitem]').first().focus();
 	}
@@ -147,4 +147,4 @@ };
 	} else {
-		this.container.find('[role=menutiem]').last().focus();
+		this.container.find('[role=menuitem]').last().focus();
 	}
 };

components/moj-timeline/README.md

@@ -12,6 +12,6 @@ # Timeline
 // Add filters from MOJ Frontend
-let mojFilters = require('./src/filters/all')();
+let mojFilters = require('./node_modules/@ministryofjustice/frontend/filters/all')();
 mojFilters = Object.assign(mojFilters);
 Object.keys(mojFilters).forEach(function (filterName) {
-  nunjucksEnvironment.addFilter(filterName, mojFilters[filterName])
+  nunjucksAppEnv.addFilter(filterName, mojFilters[filterName])
 });
@@ -18,0 +18,0 @@ ```

package.json

 {
   "name": "@ministryofjustice/frontend",
   "description": "The MOJ Frontend contains the code you need to start building user interfaces for UK Ministry of Justice government services.",
-  "version": "0.0.5-alpha",
+  "version": "0.0.6-alpha",
   "main": "all.js",
@@ -6,0 +6,0 @@ "sass": "all.scss",

No alert changes

Improved metrics

Total package byte prevSize

461357

increased by1.48%

Number of package files

136

increased by3.03%

Lines of code

9460

increased by1.56%

No dependency changes