jedp/b2g-test.html

## b2g-test.html
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta http-equiv="pragma" content="no-cache">
    <title>B2G Persona test</title>

    <link rel="stylesheet" type="text/css" href="style/style.css">
  </head>

  <body>

    <div>
      <p>Options</p>
      <div><label for="issuer-name">Force Issuer:</label><input type="text" id="issuer-name" value=""/></div>
      <div><label for="unverified-ok">Allow Unverified:</label><input type="checkbox" id="unverified-ok"/></div>
    </div>

    <div>
      <p>Tests</p>
      <ul>
        <li><button id="t-request">Request</button> (Standard, verified email)</li>
        <li><button id="t-request-withOnCancel">Request</button> (With <code>oncancel</code> handler)</li>
        <li><button id="t-request-allowUnverified">Request</button> (Unverified OK)</li>
        <li><button id="t-request-forceIssuer">Request</button> (Force issuer)</li>
        <li><button id="t-request-forceIssuer-allowUnverified">Request</button> (Force issuer; unverified ok)</li>
        <li><button id="t-logout">Logout</button></li>
      </ul>
    </div>

    <div>
      <p>Events:</p>
      <ul id="event-stream">
        <li><span>0</span> Page render</li>
      </ul>
    </div>

    <script src="http://127.0.0.1:10010/include.js"></script>
    <script type="text/javascript">
function getUnverifiedOk() {
  return document.getElementById("unverified-ok").checked;
}

function getIssuerName() {
  return document.getElementById("issuer-name").value;
}

var IdentityTests = {
  _eventNum: 1,

  recordEvent: function id_recordEvent(message, cklass) {
    var li = document.createElement('li');
    if (cklass)
      li.classList.add(cklass)
    var events = document.getElementById('event-stream');
    li.innerHTML = "<span>" + this._eventNum + "</span> " + message;
    events.appendChild(li);
    this._eventNum += 1;
  },


  init: function id_init() {
    var self = this;
    window.addEventListener("DOMContentLoaded", function() {
      // Set up identity calbacks
      try {
        navigator.id.watch({
          loggedInUser: null,

          onlogin: function(assertion) {
            self.recordEvent("login; assertion: " + assertion, 'login');
          },

          onlogout: function() {
            self.recordEvent("logout", 'logout');
          },

          onready: function() {
            self.recordEvent("ready", 'ready');
          }
        });
      } catch (err) {
        err += " (are you loading include.js correctly?)";
        self.recordEvent("Oh noes!! " + err);
        throw new Error(err);
      }

      // Bind selectors and onclick callbacks
      testElementHandlers = {
        't-request': function() {
          navigator.id.request();
        },

        't-request-withOnCancel': function() {
          navigator.id.request({oncancel: function() { self.recordEvent("cancel", 'cancel') }});
        },

        't-request-allowUnverified': function() {
          navigator.id.request({
            allowUnverified: getUnverifiedOk()
          });
        },

        't-request-forceIssuer': function() {
          navigator.id.request({
            forceIssuer: getIssuerName()
          });
        },

        't-request-forceIssuer-allowUnverified': function() {
          navigator.id.request({
            allowUnverified: getUnverifiedOk(),
            forceIssuer: getIssuerName()
          });
        },

        't-logout': function() {
          navigator.id.logout();
        }
      };

      Object.keys(testElementHandlers).forEach(function(selector) {
        document.getElementById(selector).addEventListener(
          'click', testElementHandlers[selector]);
      });
    });
  }
};
IdentityTests.init();
    </script>
  </body>

</html>
	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="utf-8">
	<meta http-equiv="pragma" content="no-cache">
	<title>B2G Persona test</title>

	<link rel="stylesheet" type="text/css" href="style/style.css">
	</head>

	<body>

	<div>
	<p>Options</p>
	<div><label for="issuer-name">Force Issuer:</label><input type="text" id="issuer-name" value=""/></div>
	<div><label for="unverified-ok">Allow Unverified:</label><input type="checkbox" id="unverified-ok"/></div>
	</div>

	<div>
	<p>Tests</p>
	<ul>
	<li><button id="t-request">Request</button> (Standard, verified email)</li>
	<li><button id="t-request-withOnCancel">Request</button> (With <code>oncancel</code> handler)</li>
	<li><button id="t-request-allowUnverified">Request</button> (Unverified OK)</li>
	<li><button id="t-request-forceIssuer">Request</button> (Force issuer)</li>
	<li><button id="t-request-forceIssuer-allowUnverified">Request</button> (Force issuer; unverified ok)</li>
	<li><button id="t-logout">Logout</button></li>
	</ul>
	</div>

	<div>
	<p>Events:</p>
	<ul id="event-stream">
	<li><span>0</span> Page render</li>
	</ul>
	</div>

	<script src="http://127.0.0.1:10010/include.js"></script>
	<script type="text/javascript">
	function getUnverifiedOk() {
	return document.getElementById("unverified-ok").checked;
	}

	function getIssuerName() {
	return document.getElementById("issuer-name").value;
	}

	var IdentityTests = {
	_eventNum: 1,

	recordEvent: function id_recordEvent(message, cklass) {
	var li = document.createElement('li');
	if (cklass)
	li.classList.add(cklass)
	var events = document.getElementById('event-stream');
	li.innerHTML = "<span>" + this._eventNum + "</span> " + message;
	events.appendChild(li);
	this._eventNum += 1;
	},


	init: function id_init() {
	var self = this;
	window.addEventListener("DOMContentLoaded", function() {
	// Set up identity calbacks
	try {
	navigator.id.watch({
	loggedInUser: null,

	onlogin: function(assertion) {
	self.recordEvent("login; assertion: " + assertion, 'login');
	},

	onlogout: function() {
	self.recordEvent("logout", 'logout');
	},

	onready: function() {
	self.recordEvent("ready", 'ready');
	}
	});
	} catch (err) {
	err += " (are you loading include.js correctly?)";
	self.recordEvent("Oh noes!! " + err);
	throw new Error(err);
	}

	// Bind selectors and onclick callbacks
	testElementHandlers = {
	't-request': function() {
	navigator.id.request();
	},

	't-request-withOnCancel': function() {
	navigator.id.request({oncancel: function() { self.recordEvent("cancel", 'cancel') }});
	},

	't-request-allowUnverified': function() {
	navigator.id.request({
	allowUnverified: getUnverifiedOk()
	});
	},

	't-request-forceIssuer': function() {
	navigator.id.request({
	forceIssuer: getIssuerName()
	});
	},

	't-request-forceIssuer-allowUnverified': function() {
	navigator.id.request({
	allowUnverified: getUnverifiedOk(),
	forceIssuer: getIssuerName()
	});
	},

	't-logout': function() {
	navigator.id.logout();
	}
	};

	Object.keys(testElementHandlers).forEach(function(selector) {
	document.getElementById(selector).addEventListener(
	'click', testElementHandlers[selector]);
	});
	});
	}
	};
	IdentityTests.init();
	</script>
	</body>

	</html>