initial commit

Author: lc-thomasberger

LICENSE

@@ -0,0 +1,5 @@
+# adapt-contrib-languagePicker  
+
+**language Picker** is an *extension* bundled with the [Adapt framework](https://github.com/adaptlearning/adapt_framework).  
+
+todo:

README.md

@@ -0,0 +1,17 @@
+{
+    "name": "adapt-contrib-pageLevelProgress",
+    "version": "1.0.0",
+    "framework": "^2.0.0",
+    "homepage": "https://github.com/lc-thomasberger/adapt-languagePicker",
+    "issues": "https://github.com/adaptlearning/adapt_framework/issues",
+    "displayName": "Langauge Picker",
+    "extension": "languagePicker",
+    "description": "An extension to select a Language",
+    "main": "/js/adapt-languagePicker.js",
+    "keywords": [
+        "adapt-plugin",
+        "adapt-extension"
+    ],
+    "license": "GPLv3",
+    "targetAttribute": "_languages"
+}

bower.json

@@ -0,0 +1,40 @@
+// To go on in config
+
+"_languagePicker": {
+    "_isEnabled": true,
+    "displayTitle": "Please select a language",
+    "body": "This course is available in the following languages",
+    "_languages": [
+        {
+            "_language": "en",
+            "_direction": "ltr",
+            "displayName": "English",
+            "warningTitle": "Change language?",
+            "warningMessage": "Changing the language will reset course progress.<br><br>Would you like to proceed?",
+            "_buttons": {
+                "yes": "Yes",
+                "no": "No"
+            }
+        },
+        {
+            "_language": "de",
+            "_direction": "ltr",
+            "displayName": "Deutsch",
+            "warningTitle": "Sprache ändern?",
+            "warningMessage": "Ändern der Sprache wird den Fortschritt des Kurses zurücksetzen.<br><br>Möchte Sie fortfahren?",
+            "_buttons": {
+                "yes": "Ja",
+                "no": "Nein"
+            }
+        }
+    ],
+    "_accessibility": {
+        "_accessibilityToggleTextOn": "Turn accessibility on?",
+        "_accessibilityToggleTextOff": "Turn accessibility off?",
+        "_accessibilityInstructions": {
+            "touch": "Usage instructions. Use swipe right for next. Use swipe left for previous. Use a double tap to select. Use a two finger slide up to go to the top of the page.",
+            "notouch": "Usage instructions. Use tab for next. Use shift tab for previous. Use enter to select. Use escape to go to the top of the page.",
+            "ipad": "Usage instructions for touchscreens. Use swipe right for next. Use swipe left for previous. Use a double tap to select. Use a two finger slide up to go to the top of the page. Usage instructions for keyboard access. Use right for next. Use left for previous. Use up and down together to select."
+        }
+    }
+}

example.json

@@ -0,0 +1,164 @@
+define([
+    'coreJS/adapt'
+], function(Adapt) {
+
+    var cookie = (function cookie(){function e(){for(var e=0,n={};e<arguments.length;e++){var t=arguments[e];for(var r in t)n[r]=t[r]}return n}function n(t){function r(n,o,i){var c;if("undefined"!=typeof document){if(arguments.length>1){if(i=e({path:"/"},r.defaults,i),"number"==typeof i.expires){var a=new Date;a.setMilliseconds(a.getMilliseconds()+864e5*i.expires),i.expires=a}try{c=JSON.stringify(o),/^[\{\[]/.test(c)&&(o=c)}catch(s){}return o=t.write?t.write(o,n):encodeURIComponent(String(o)).replace(/%(23|24|26|2B|3A|3C|3E|3D|2F|3F|40|5B|5D|5E|60|7B|7D|7C)/g,decodeURIComponent),n=encodeURIComponent(String(n)),n=n.replace(/%(23|24|26|2B|5E|60|7C)/g,decodeURIComponent),n=n.replace(/[\(\)]/g,escape),document.cookie=[n,"=",o,i.expires&&"; expires="+i.expires.toUTCString(),i.path&&"; path="+i.path,i.domain&&"; domain="+i.domain,i.secure?"; secure":""].join("")}n||(c={});for(var p=document.cookie?document.cookie.split("; "):[],u=/(%[0-9A-Z]{2})+/g,d=0;d<p.length;d++){var f=p[d].split("="),l=f[0].replace(u,decodeURIComponent),m=f.slice(1).join("=");'"'===m.charAt(0)&&(m=m.slice(1,-1));try{if(m=t.read?t.read(m,l):t(m,l)||m.replace(u,decodeURIComponent),this.json)try{m=JSON.parse(m)}catch(s){}if(n===l){c=m;break}n||(c[l]=m)}catch(s){}}return c}}return r.set=r,r.get=function(e){return r(e)},r.getJSON=function(){return r.apply({json:!0},[].slice.call(arguments))},r.defaults={},r.remove=function(n,t){r(n,"",e(t,{expires:-1}))},r.withConverter=n,r}return n(function(){})})();
+
+    var AccessibilityView = Backbone.View.extend({
+
+        el: '#accessibility-toggle',
+
+        initialize: function() {
+            this.setupHelpers();
+
+            var settings = this.getStoredSettings();
+            Adapt.config.get("_accessibility")._isActive = settings.a11y || false;
+            
+            this.configureAccessibility();
+            this.setupUsageInstructions();
+
+            this.render();
+        },
+
+        getStoredSettings: function() {
+            var str = cookie.get("_languagePicker") || "{}";
+            var settings = JSON.parse(str);
+            return settings;
+        },
+
+        setStoredSettings: function(settings) {
+            var str = JSON.stringify(settings);
+            cookie.set("_languagePicker", str);
+        },
+
+        events: {
+            'click' : 'toggleAccessibility'
+        },
+
+        render: function() {
+            var hasAccessibility = Adapt.config.has('_accessibility')
+                && Adapt.config.get('_accessibility')._isEnabled;
+
+            if (!hasAccessibility) {
+                return;
+            } else {
+                var isActive = Adapt.config.get('_accessibility')._isActive;
+                var offLabel = this.model.get("_accessibility") && this.model.get("_accessibility")._accessibilityToggleTextOff;
+                var onLabel = this.model.get("_accessibility") && this.model.get("_accessibility")._accessibilityToggleTextOn;
+
+                var toggleText = isActive ? offLabel : onLabel;
+
+                this.$el.html(toggleText);
+
+                if (isActive) {
+                    $("html").addClass('accessibility');
+                    $("#accessibility-instructions").a11y_focus();
+                } else {
+                    $("html").removeClass('accessibility');
+                }
+            }
+        },
+
+        toggleAccessibility: function(event) {
+            event.preventDefault();
+
+            var hasAccessibility = Adapt.config.get('_accessibility')._isActive;
+
+            var toggleAccessibility = (hasAccessibility) ? false : true;
+
+            Adapt.config.get('_accessibility')._isActive = toggleAccessibility;
+
+            Adapt.trigger('languagepicker:accessibility:toggle');
+
+            this.configureAccessibility();
+            this.setupUsageInstructions();
+
+            this.render();           
+            
+            window.location.reload();
+        },
+
+        setupHelpers: function() {
+            var config = Adapt.config.get("_accessibility");
+
+            Handlebars.registerHelper('a11y_text', function(text) {
+                //ALLOW ENABLE/DISABLE OF a11y_text HELPER
+                if (config && config._isTextProcessorEnabled === false) {
+                    return text;
+                } else {
+                    return $.a11y_text(text);
+                }
+            });
+        },
+
+        configureAccessibility: function() {
+
+            var isActive = Adapt.config.get('_accessibility')._isActive;
+
+            if (!Modernizr.touch) {
+                var settings = {
+                    a11y: Adapt.config.get("_accessibility")._isActive
+                };
+                this.setStoredSettings(settings);
+                Adapt.offlineStorage.set("a11y", settings.a11y);
+            }
+
+            if (isActive) {
+
+                _.extend($.a11y.options, {
+                    isTabbableTextEnabled: true,
+                    isUserInputControlEnabled: true,
+                    isFocusControlEnabled: true,
+                    isFocusLimited: true,
+                    isRemoveNotAccessiblesEnabled: true,
+                    isAriaLabelFixEnabled: true,
+                    isFocusWrapEnabled: true,
+                    isScrollDisableEnabled: true,
+                    isScrollDisabledOnPopupEnabled: false,
+                    isSelectedAlertsEnabled: true,
+                    isAlertsEnabled: true
+                });
+            } else {
+                _.extend($.a11y.options, {
+                    isTabbableTextEnabled: false,
+                    isUserInputControlEnabled: true,
+                    isFocusControlEnabled: true,
+                    isFocusLimited: false,
+                    isRemoveNotAccessiblesEnabled: true,
+                    isAriaLabelFixEnabled: true,
+                    isFocusWrapEnabled: true,
+                    isScrollDisableEnabled: true,
+                    isScrollDisabledOnPopupEnabled: false,
+                    isSelectedAlertsEnabled: false,
+                    isAlertsEnabled: false
+                });
+            }
+
+            $.a11y.ready();
+        },
+
+        setupUsageInstructions: function() {
+            if (!this.model.get("_accessibility") || !this.model.get("_accessibility")._accessibilityInstructions) {
+                $("#accessibility-instructions").remove();
+                return;
+            }
+
+            var instructionsList =  this.model.get("_accessibility")._accessibilityInstructions;
+
+            var usageInstructions;
+            if (instructionsList[Adapt.device.browser]) {
+                usageInstructions = instructionsList[Adapt.device.browser];
+            } else if (Modernizr.touch) {
+                usageInstructions = instructionsList.touch || "";
+            } else {
+                usageInstructions = instructionsList.notouch || "";
+            }
+
+           $("#accessibility-instructions").html( usageInstructions );
+        }
+
+    });
+
+    return AccessibilityView;
+
+});

js/accessibilityView.js

@@ -0,0 +1,62 @@
+define([
+  'coreJS/adapt',
+  'backbone',
+  './languagePickerView',
+  './languagePickerNavView',
+  './languagePickerModel'
+], function(Adapt, Backbone, LanguagePickerView, LanguagePickerNavView, LanguagePickerModel) {
+
+  var languagePickerModel;
+
+  Adapt.once('configModel:dataLoaded', onConfigLoaded);
+
+  function onConfigLoaded() {
+      if (!Adapt.config.has('_languagePicker')) return;
+      if (!Adapt.config.get('_languagePicker')._isEnabled) return;
+    
+      // stop default language loading
+      Adapt.config.set("_canLoadData", false);
+      languagePickerModel = new LanguagePickerModel(Adapt.config.get('_languagePicker'));
+      
+      Adapt.on('router:page', setupNavigationView);
+      Adapt.on('router:menu', setupNavigationView);
+      
+      // wait for spoor to initialize on the configModel:dataLoaded event
+      _.defer(onSpoorInitialized);
+  }
+
+  function onSpoorInitialized() {
+      // see if a language was previously saved
+      var previousLanguage = Adapt.offlineStorage.get("lang");
+      if (!previousLanguage) {
+        // ask user for lanugage if non specified
+        showLanguagePickerView();
+      } else {
+        // set config default language
+        languagePickerModel.setDefaultLanguage(previousLanguage);
+        loadLanguage();
+      }
+  }
+
+  function showLanguagePickerView () {
+      var languagePickerView = new LanguagePickerView({
+        model: languagePickerModel
+      });
+      
+      languagePickerView.$el.appendTo('#wrapper');
+  }
+
+  function loadLanguage () {
+      // continue loading course
+      Adapt.trigger('configModel:loadCourseData');
+  }
+  
+  function setupNavigationView () {
+    var languagePickerNavView = new LanguagePickerNavView({
+      model: languagePickerModel
+    });
+    
+    languagePickerNavView.$el.appendTo('.navigation-inner');
+  }
+  
+});

js/adapt-languagePicker.js

@@ -0,0 +1,98 @@
+define([
+  'coreJS/adapt',
+  'backbone'
+], function(Adapt, Backbone) {
+  
+  var LanguagePickerDrawerView = Backbone.View.extend({
+    
+    events: {
+      'click button': 'onButtonClick'
+    },
+    
+    initialize: function () {
+      this.listenTo(Adapt, 'remove', this.remove);
+      this.listenTo(Adapt, 'languagepicker:changelanguage:yes', this.onDoChangeLanguage);
+      this.listenTo(Adapt, 'languagepicker:changelanguage:no', this.onDontChangeLanguage);
+      this.render();
+    },
+    
+    render: function () {
+      var data = this.model.toJSON();
+      var template = Handlebars.templates[this.constructor.template];
+      this.$el.html(template(data));
+    },
+    
+    onButtonClick: function (event) {
+      var newLanguge = $(event.target).attr('data-language');
+      this.model.set('newLanguge', newLanguge);
+      var data = this.model.getLanguageDetails(newLanguge);
+      
+      var promptObject = {
+        title: data.warningTitle,
+        body: data.warningMessage,
+        _prompts:[
+          {
+            promptText: data._buttons.yes,
+            _callbackEvent: "languagepicker:changelanguage:yes",
+          },
+          {
+            promptText: data._buttons.no,
+            _callbackEvent: "languagepicker:changelanguage:no"
+          }
+        ],
+        _showIcon: true
+      }
+
+      
+      //keep active element incase the user cancels - usually navigation bar icon
+      this.$finishFocus = $.a11y.state.focusStack.pop();
+      //move drawer close focus to #focuser
+      $.a11y.state.focusStack.push($("#focuser"));
+
+      Adapt.once('drawer:closed', function() {
+        //wait for drawer to fully close
+        _.delay(function(){
+          //show yes/no popup
+          Adapt.once('popup:opened', function() {
+            //move popup close focus to #focuser
+            $.a11y.state.focusStack.pop();
+            $.a11y.state.focusStack.push($("#focuser"));  
+          });
+
+          Adapt.trigger('notify:prompt', promptObject);
+        }, 250);
+      });
+      Adapt.trigger('drawer:closeDrawer');
+      
+    },
+    
+    onDoChangeLanguage: function () {
+      // set default languge
+      var newLanguge = this.model.get('newLanguge');
+      this.model.setDefaultLanguage(newLanguge);
+      // reset progress
+      // this.model.resetCourseProgress();
+      // reload course Data
+      this.model.reloadCourseData();
+      
+      this.remove();
+    },
+    
+    onDontChangeLanguage: function () {
+      this.remove();
+
+      //wait for notify to close fully
+      _.delay(_.bind(function(){
+        //focus on navigation bar icon
+        this.$finishFocus.a11y_focus();
+      }, this), 500);
+
+    }
+    
+  }, {
+    template: 'languagePickerDrawerView'
+  });
+
+  return LanguagePickerDrawerView;
+
+});