Updated to new IRMAjs version

Gruntfile.js

 module.exports = function (grunt) {
     // Setup urls for the keyshare server, api server, and irma_js
     // these are used to configure the webclient
-    if ( (typeof(grunt.option("api_server_url")) === "undefined") ) {
-        console.log("INFO: set api_server_url (possibly also irma_js_url) to enable issuing");
+    if ( (typeof(grunt.option("irma_server_url")) === "undefined") ) {
+        console.log("INFO: don't forget setting irma_server_url in conf.json or specify as grunt parameter");
     }
     if ( (typeof(grunt.option("idin_server_url")) === "undefined") ) {
-        console.log("INFO: set idin_server_url to enable app");
+        console.log("INFO: don't forget setting idin_server_url in conf.json or specify as grunt parameter");
     }
     if ( (typeof(grunt.option("language")) === "undefined") ) {
         console.log("INFO: No language chosen, assuming nl");
     }
 
     var conf = {
-        idin_server_url: grunt.option("idin_server_url"),
-        api_server_url: grunt.option("api_server_url") + "/api/v2/",
-        api_web_url: grunt.option("api_web_url") || grunt.option("api_server_url"),
-        irma_js_url: grunt.option("irma_js_url") || grunt.option("api_server_url"),
+        idin_server_url: grunt.option("idin_server_url") || "<IDIN_SERVER_URL>",
+        irma_server_url: grunt.option("irma_server_url") || "<IRMA_SERVER_URL>",
         language: grunt.option("language") || "nl",
-    }
-    conf.api_web_url += "/server/";
-    conf.irma_js_url += "/client/";
+    };
+    conf.irma_server_url += "/api/v2";
 
     console.log("Configuration:", conf);
 
     grunt.initConfig({
         copy: {
-            // Copying the bower bundles is a bit of a hack
-            bower_bundle: {
-                cwd: "bower_components",
-                src: ["**/*"],
-                dest: "build/bower_components",
+            node_modules: {
+                cwd: "node_modules",
+                src: [
+                    "@privacybydesign/irmajs/dist/irma.js",
+                    "bootstrap/dist/**",
+                    "jquery/dist/jquery.min.js",
+                    "js-cookie/src/js.cookie.js",
+                    "jwt-decode/build/jwt-decode.js"
+                ],
+                dest: "build/node_modules",
                 expand: "true",
             },
             non_html: {
@@ -45,34 +47,6 @@ module.exports = function (grunt) {
                 expand: "true",
             },
         },
-        "string-replace": {
-            examples: {
-                files: [{
-                    cwd: "./src",
-                    src: ["**/*.html"],
-                    dest: "translated/",
-                    expand: "true",
-                }],
-                options: {
-                    replacements: [{
-                        pattern: /\[API_SERVER_URL\]/g,
-                        replacement: conf.api_server_url,
-                    }, {
-                        pattern: /\[API_WEB_URL\]/g,
-                        replacement: conf.api_web_url,
-                    }, {
-                        pattern: /\[IRMA_JS_URL\]/g,
-                        replacement: conf.irma_js_url,
-                    }, {
-                        pattern: /\[IDIN_SERVER_URL\]/g,
-                        replacement: conf.idin_server_url,
-                    }, {
-                        pattern: /\[LANGUAGE\]/g,
-                        replacement: conf.language,
-                    }],
-                },
-            },
-        },
         watch: {
             webfiles: {
                 files: [
@@ -119,15 +93,13 @@ module.exports = function (grunt) {
 
     grunt.loadNpmTasks("grunt-contrib-watch");
     grunt.loadNpmTasks("grunt-contrib-copy");
-    grunt.loadNpmTasks("grunt-string-replace");
     grunt.loadNpmTasks("grunt-multi-lang-site-generator");
     grunt.loadNpmTasks("grunt-json-generator");
 
     grunt.registerTask("default", [
         "copy:non_html",
         "json_generator",
-        "copy:bower_bundle",
-        "string-replace",
+        "copy:node_modules",
         "multi_lang_site_generator",
         "copy:translated",
         "watch",
@@ -135,13 +107,11 @@ module.exports = function (grunt) {
     grunt.registerTask("build", [
         "copy:non_html",
         "json_generator",
-        "copy:bower_bundle",
-        "string-replace",
+        "copy:node_modules",
         "multi_lang_site_generator",
         "copy:translated",
     ]);
     grunt.registerTask("translate", [
-        "string-replace",
         "multi_lang_site_generator",
         "copy:translated",
     ]);

bower.json

-{
-  "name": "irma_idin_webclient",
-  "description": "Webclient for IRMA iDIN server",
-  "main": "",
-  "authors": [
-    "Fabian van den Broek",
-    "Sietse Ringers",
-    "Radboud University",
-    "Privacy by Design Foundation"
-  ],
-  "license": "BSD-3-Clause",
-  "moduleType": [
-    "es6",
-    "globals"
-  ],
-  "homepage": "https://privacybydesign.foundation/",
-  "private": true,
-  "ignore": [
-    "**/.*",
-    "node_modules",
-    "bower_components",
-    "test",
-    "tests"
-  ],
-  "dependencies": {
-    "jquery": "~2.1.4",
-    "js-cookie": "2.1.3",
-    "jwt-decode": "~1.4.0",
-    "bootstrap": "~3.3.6"
-  }
-}

gitlab-ci.yml

+image: privacybydesign/node_yarn:latest
+
+stages:
+  - build
+
+before_script:
+  - set -euxo pipefail
+  - yarn install
+
+build-en:
+  stage: build
+  script:
+    - yarn run grunt --language="en"
+  artifacts:
+    paths:
+      - build/*
+
+build-nl:
+  stage: build
+  script:
+    - yarn run grunt --language="nl"
+  artifacts:
+    paths:
+      - build/*
\ No newline at end of file

package.json

@@ -10,6 +10,10 @@
     "grunt-contrib-watch": "^0.6.1",
     "grunt-json-generator": "^0.1.0",
     "grunt-multi-lang-site-generator": "^0.6.0",
-    "grunt-string-replace": "^1.2.0"
+    "@privacybydesign/irmajs": "^0.1.5",
+    "jquery": "~2.1.4",
+    "js-cookie": "2.1.3",
+    "jwt-decode": "~1.4.0",
+    "bootstrap": "~3.3.6"
   }
 }

src/done.html

@@ -4,21 +4,14 @@
     <meta charset="utf-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1" />
 
-    <meta name="irma-web-server" value="[API_WEB_URL]" />
-    <meta name="irma-api-server" value="[API_SERVER_URL]" />
+    <link href="node_modules/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">
 
-    <link href="bower_components/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">
-
-    <script type="text/javascript" src="bower_components/jwt-decode/build/jwt-decode.js"></script>
-    <script type="text/javascript" src="bower_components/jquery/dist/jquery.js"></script>
-    <script type="text/javascript" src="[IRMA_JS_URL]irma.js"></script>
+    <script type="text/javascript" src="node_modules/jwt-decode/build/jwt-decode.js"></script>
+    <script type="text/javascript" src="node_modules/jquery/dist/jquery.min.js"></script>
+    <script type="text/javascript" src="node_modules/@privacybydesign/irmajs/dist/irma.js"></script>
     <script type="text/javascript" src="js/common.js"></script>
     <script type="text/javascript" src="js/iDIN-verify.js"></script>
 
-    <script type="text/javascript">
-        var server = "[IDIN_SERVER_URL]/api/v1/idin";
-    </script>
-
     <title><%= done_title %></title>
 </head>
 

src/enroll.html

@@ -4,16 +4,13 @@
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, initial-scale=1">
 
-    <meta name="irma-web-server" value="[API_WEB_URL]" />
-    <meta name="irma-api-server" value="[API_SERVER_URL]" />
+    <link href="node_modules/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">
 
-    <link href="bower_components/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">
+    <script type="text/javascript" src="node_modules/jwt-decode/build/jwt-decode.js"></script>
+    <script type="text/javascript" src="node_modules/jquery/dist/jquery.min.js"></script>
+    <script type="text/javascript" src="node_modules/js-cookie/src/js.cookie.js"></script>
 
-    <script type="text/javascript" src="bower_components/jwt-decode/build/jwt-decode.js"></script>
-    <script type="text/javascript" src="bower_components/jquery/dist/jquery.js"></script>
-    <script type="text/javascript" src="bower_components/js-cookie/src/js.cookie.js"></script>
-
-    <script type="text/javascript" src="[IRMA_JS_URL]irma.js"></script>
+    <script type="text/javascript" src="node_modules/@privacybydesign/irmajs/dist/irma.js"></script>
     <script type="text/javascript" src="js/common.js"></script>
     <script type="text/javascript" src="js/iDIN-enroll.js"></script>
 

src/error.html

@@ -6,10 +6,10 @@
 
     <title><%= error_title %></title>
 
-    <link href="bower_components/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">
+    <link href="node_modules/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">
 
-    <script type="text/javascript" src="bower_components/jquery/dist/jquery.js"></script>
-    <script type="text/javascript" src="bower_components/js-cookie/src/js.cookie.js"></script>
+    <script type="text/javascript" src="node_modules/jquery/dist/jquery.min.js"></script>
+    <script type="text/javascript" src="node_modules/js-cookie/src/js.cookie.js"></script>
     <script type="text/javascript" src="js/common.js"></script>
     <script type="text/javascript" src="js/iDIN-error.js"></script>
 </head>

src/index.html

@@ -5,14 +5,11 @@
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width, initial-scale=1">
 
-    <link href="bower_components/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">
+    <link href="node_modules/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">
 
-    <script type="text/javascript" src="bower_components/jquery/dist/jquery.js"></script>
+    <script type="text/javascript" src="node_modules/jquery/dist/jquery.min.js"></script>
     <script type="text/javascript" src="js/common.js"></script>
     <script type="text/javascript" src="js/iDIN.js"></script>
-    <script type="text/javascript">
-        var server = "[IDIN_SERVER_URL]/api/v1/idin";
-    </script>
 
     <title><%= index_title %></title>
 </head>

src/js/common.js

-var conf, strings, server;
+var conf, strings, server, irma_server_conf;
 
-function getSetupFromJson() {
+function getSetupFromJson(successFunc) {
     console.log("Running getSetupFromJson");
 
     $.getJSON("conf.json", function(json) {
         conf = json;
+        irma_server_conf = {
+            lang: conf.language,
+            server: conf.irma_server_url,
+            legacyResultJwt: true,
+        };
+        server = `${conf.idin_server_url}/api/v1/idin`;
+
         console.log("Configuration:", conf);
 
         $.getJSON("languages/" + conf.language + ".json", function(text) {
             strings = text;
             console.log("Loaded language strings");
+            successFunc();
         });
     });
 }
@@ -28,7 +36,3 @@ var showSuccess = function(msg) {
     $("#alert_box").html("<div class=\"alert alert-success\" role=\"alert\">"
         + msg + "</div>");
 };
-
-$(function() {
-    getSetupFromJson();
-})

src/js/iDIN-enroll.js

-$(function() {
+getSetupFromJson(function() {
     var doneURL = "done.html";
 
     function addTableLine(table, head, data){
@@ -27,6 +27,15 @@ $(function() {
         });
     }
 
+    function irma_session_failed (msg) {
+        $("#enroll").prop('disabled', false);
+        if(msg === 'CANCELLED') {
+            showWarning(msg);
+        } else {
+            showError(msg);
+        }
+    }
+
     //set issuing functionality to button
     $("#enroll").on("click", function() {
         // Clear errors
@@ -34,18 +43,12 @@ $(function() {
         $("#alert_box").empty();
         //disable enroll button
         $("#enroll").prop('disabled', true);
-        IRMA.issue(Cookies.get("jwt"),
-            function() {
+
+        irma.startSession(conf.irma_server_url, Cookies.get("jwt"), "publickey")
+            .then(({sessionPtr, token}) => irma.handleSession(sessionPtr, {...irma_server_conf, token}))
+            .then(() => {
                 window.location.replace(doneURL);
-            },
-            function(msg) {
-                $("#enroll").prop('disabled', false);
-                showWarning(msg);
-            },
-            function(msg) {
-                $("#enroll").prop('disabled', false);
-                showError(msg);
-            });
+            }, irma_session_failed);
     });
 
     //decode the issuing JWT and show the values in a table

src/js/iDIN-verify.js

-$(function() {
+getSetupFromJson(function() {
     var success_fun = function(data) {
         $("#result_status").html(strings.verify_success);
         $("#result_header").html(strings.verify_result);
@@ -19,6 +19,14 @@ $(function() {
         $("#result_status").html(strings.verify_failed);
     }
 
+    function irma_session_failed (msg) {
+        if(msg === 'CANCELLED') {
+            cancel_fun(msg);
+        } else {
+            error_fun(msg);
+        }
+    }
+
     $("#verify_idin_bd_btn").on("click", function() {
         $("#result_header").text("");
         $("#result_status").text("");
@@ -27,12 +35,12 @@ $(function() {
             type: "GET",
             url: server + "/verify",
             success: function(data) {
-                IRMA.verify(data, success_fun, cancel_fun, error_fun);
+                irma.startSession(conf.irma_server_url, data, "publickey")
+                    .then(({sessionPtr, token}) => irma.handleSession(sessionPtr, {...irma_server_conf, token}))
+                    .then(success_fun, irma_session_failed);
             },
             error: showError,
         });
-
-        IRMA.verify(jwt, success_fun, error_fun);
     });
 
 });

src/js/iDIN.js

-$(function() {
+getSetupFromJson(function() {
 
 
     function getBanks (){