Made the game grid accessible

This commit is contained in:
Paulin Jorys 2017-05-21 18:22:28 +02:00
parent 38a7a058ab
commit 053cd9a830
2 changed files with 14 additions and 14 deletions

View File

@ -122,7 +122,7 @@ main {
.mdl-dialog__title { .mdl-dialog__title {
padding: 24px 24px 0; padding: 24px 24px 0;
margin: 0; margin: 0;
font-size: 2.5rem; font-size: 2.5rem;
} }
.mdl-dialog__content { .mdl-dialog__content {
padding: 20px 24px 24px 24px; padding: 20px 24px 24px 24px;
@ -191,7 +191,7 @@ main {
cursor: pointer; cursor: pointer;
transition: all .2s ease-in-out; transition: all .2s ease-in-out;
} }
#host-grid .mdl-card:hover, #game-grid .mdl-card:hover { #host-grid .mdl-card:hover, #host-grid .mdl-card:focus, #host-grid .mdl-card:active, #game-grid .mdl-card:hover, #game-grid .mdl-card:focus, #game-grid .mdl-card:active {
transform: scale(1.1); transform: scale(1.1);
} }
#host-grid .mdl-card__title { #host-grid .mdl-card__title {

View File

@ -28,7 +28,7 @@ function fullscreenChromeWindow() {
// FIRST restore it to the previous size, then fullscreen it to the whole screen // FIRST restore it to the previous size, then fullscreen it to the whole screen
// this prevents the previous window size from being 'maximized', // this prevents the previous window size from being 'maximized',
// and allows us to functionally retain two window sizes // and allows us to functionally retain two window sizes
// so that when the user hits `esc`, they go back to the "restored" size, // so that when the user hits `esc`, they go back to the "restored" size,
// instead of "maximized", which would immediately go to fullscreen // instead of "maximized", which would immediately go to fullscreen
chrome.app.window.current().restore(); chrome.app.window.current().restore();
chrome.app.window.current().fullscreen(); chrome.app.window.current().fullscreen();
@ -192,14 +192,14 @@ function moduleDidLoad() {
} }
if(!pairingCert) { // we couldn't load a cert. Make one. if(!pairingCert) { // we couldn't load a cert. Make one.
console.log("Failed to load local cert. Generating new one"); console.log("Failed to load local cert. Generating new one");
sendMessage('makeCert', []).then(function (cert) { sendMessage('makeCert', []).then(function (cert) {
storeData('cert', cert, null); storeData('cert', cert, null);
pairingCert = cert; pairingCert = cert;
console.log("Generated new cert."); console.log("Generated new cert.");
}, function (failedCert) { }, function (failedCert) {
console.log('ERROR: failed to generate new cert!'); console.log('ERROR: failed to generate new cert!');
console.log('Returned error was: ' + failedCert); console.log('Returned error was: ' + failedCert);
}).then(function (ret) { }).then(function (ret) {
sendMessage('httpInit', [pairingCert.cert, pairingCert.privateKey, myUniqueid]).then(function (ret) { sendMessage('httpInit', [pairingCert.cert, pairingCert.privateKey, myUniqueid]).then(function (ret) {
restoreUiAfterNaClLoad(); restoreUiAfterNaClLoad();
@ -290,11 +290,11 @@ function hostChosen(host) {
api = host; api = host;
if (!host.paired) { if (!host.paired) {
// Still not paired; go to the pairing flow // Still not paired; go to the pairing flow
pairTo(host, function() { pairTo(host, function() {
showApps(host); showApps(host);
saveHosts(); saveHosts();
}, },
function(){ function(){
startPollingHosts(); startPollingHosts();
}); });
} else { } else {
@ -351,7 +351,7 @@ function addHostToGrid(host, ismDNSDiscovered) {
$(outerDiv).append(cell); $(outerDiv).append(cell);
if (!ismDNSDiscovered) { if (!ismDNSDiscovered) {
// we don't have the option to delete mDNS hosts. So don't show it to the user. // we don't have the option to delete mDNS hosts. So don't show it to the user.
$(outerDiv).append(removalButton); $(outerDiv).append(removalButton);
} }
$('#host-grid').append(outerDiv); $('#host-grid').append(outerDiv);
hosts[host.serverUid] = host; hosts[host.serverUid] = host;
@ -385,7 +385,7 @@ function removeClicked(host) {
// and puts the CSS style for non-current app apps that aren't running // and puts the CSS style for non-current app apps that aren't running
// this requires a hot-off-the-host `api`, and the appId we're going to stylize // this requires a hot-off-the-host `api`, and the appId we're going to stylize
// the function was made like this so that we can remove duplicated code, but // the function was made like this so that we can remove duplicated code, but
// not do N*N stylizations of the box art, or make the code not flow very well // not do N*N stylizations of the box art, or make the code not flow very well
function stylizeBoxArt(freshApi, appIdToStylize) { function stylizeBoxArt(freshApi, appIdToStylize) {
if (freshApi.currentGame === appIdToStylize){ // stylize the currently running game if (freshApi.currentGame === appIdToStylize){ // stylize the currently running game
// destylize it, if it has the not-current-game style // destylize it, if it has the not-current-game style
@ -429,7 +429,7 @@ function showApps(host) {
// to mitigate this we ensure we don't add a duplicate. // to mitigate this we ensure we don't add a duplicate.
// This isn't perfect: there's lots of RTTs before the logic prevents anything // This isn't perfect: there's lots of RTTs before the logic prevents anything
var imageBlob = new Blob([resolvedPromise], {type: "image/png"}); var imageBlob = new Blob([resolvedPromise], {type: "image/png"});
var outerDiv = $("<div>", {class: 'game-container mdl-card mdl-shadow--4dp', id: 'game-'+app.id, backgroundImage: URL.createObjectURL(imageBlob) }); var outerDiv = $("<div>", {class: 'game-container mdl-card mdl-shadow--4dp', id: 'game-'+app.id, backgroundImage: URL.createObjectURL(imageBlob), role: 'link', tabindex: 0, title: app.title, 'aria-label': app.title });
$(outerDiv).append($("<img \>", {src: URL.createObjectURL(imageBlob), id: 'game-'+app.id, name: app.title })); $(outerDiv).append($("<img \>", {src: URL.createObjectURL(imageBlob), id: 'game-'+app.id, name: app.title }));
$(outerDiv).append($("<div>", {class: "game-title", html: $("<span>", {html: app.title} )})); $(outerDiv).append($("<div>", {class: "game-title", html: $("<span>", {html: app.title} )}));
$("#game-grid").append(outerDiv); $("#game-grid").append(outerDiv);
@ -529,7 +529,7 @@ function startGame(host, appID) {
if(host.currentGame != 0 && host.currentGame != appID) { if(host.currentGame != 0 && host.currentGame != appID) {
host.getAppById(host.currentGame).then(function (currentApp) { host.getAppById(host.currentGame).then(function (currentApp) {
var quitAppDialog = document.querySelector('#quitAppDialog'); var quitAppDialog = document.querySelector('#quitAppDialog');
document.getElementById('quitAppDialogText').innerHTML = document.getElementById('quitAppDialogText').innerHTML =
currentApp.title + ' is already running. Would you like to quit ' + currentApp.title + ' is already running. Would you like to quit ' +
currentApp.title + '?'; currentApp.title + '?';
quitAppDialog.showModal(); quitAppDialog.showModal();
@ -677,7 +677,7 @@ function stopGame(host, callbackFunction) {
} }
var appName = runningApp.title; var appName = runningApp.title;
snackbarLog('Stopping ' + appName); snackbarLog('Stopping ' + appName);
host.quitApp().then(function (ret2) { host.quitApp().then(function (ret2) {
host.refreshServerInfo().then(function (ret3) { // refresh to show no app is currently running. host.refreshServerInfo().then(function (ret3) { // refresh to show no app is currently running.
showAppsMode(); showAppsMode();
stylizeBoxArt(host, runningApp.id); stylizeBoxArt(host, runningApp.id);