Skip to content

Commit 458b877

Browse files
author
lorderikir
committed
[U][P][UX][GAPI] v1.1.0 release - updated GAPI.js for custom file location uploading, security fixes to gapi.js, updated workflow of gapi.js and interface.js, updated interaction between interface.js and gapi.js, fixed some bugs with index.html modals
1 parent 1c6addb commit 458b877

File tree

8 files changed

+94
-49
lines changed

8 files changed

+94
-49
lines changed

README.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22

33
[![Build Status](https://travis-ci.org/MARIE-js/MARIE.js.svg?branch=master)](https://travis-ci.org/MARIE-js/MARIE.js) [![Gitter chat](https://badges.gitter.im/MARIE-js/gitter.png)](https://gitter.im/MARIE-js/Lobby) [![npm version](https://badge.fury.io/js/npm.svg)](https://badge.fury.io/js/npm)
44
==============
5-
Current version: `1.0.12`
5+
Current version: `1.1.0`
66

77
MARIE.js is an implementation of a simulator for a 'Machine Architecture that is Really Intuitive and Easy'
88
from [The Essentials of Computer Organization and Architecture](https://books.google.com.au/books/about/The_Essentials_of_Computer_Organization.html?id=3kQoAwAAQBAJ&redir_esc=y) (Linda Null, Julia Lobur) in JavaScript.

build/about.html

+3-2
Original file line numberDiff line numberDiff line change
@@ -85,6 +85,7 @@
8585
<li class="divider"></li>
8686
<li><a href="https://gitreports.com/issue/MARIE-js/MARIE.js/" target="_blank"><span class="fa fa-bug"></span> Report an Issue</a></li>
8787
<li><a href="https://goo.gl/CWAaES" target="_blank"><span class="fa fa-paperclip"></span> Submit Feedback</a></li>
88+
<li><a href="http://stats.uptimerobot.com/xnjJPTJj0" target="_blank"><span class="fa fa-check-circle"></span> Server Status</a></li>
8889
</ul>
8990
</li>
9091
</ul>
@@ -111,7 +112,7 @@
111112

112113
<main>
113114
<div id="about" class="container">
114-
<h1 class="center">MARIE.js <span class="version">v1.0.12</span></h1>
115+
<h1 class="center">MARIE.js <span class="version">v1.1.0</span></h1>
115116
<h2>About MARIE</h2>
116117
<p>MARIE ('Machine Architecture that is Really Intuitive and Easy') is a machine architecture and assembly language from <a href="https://books.google.com.au/books/about/The_Essentials_of_Computer_Organization.html?id=3kQoAwAAQBAJ&redir_esc=y" target="_blank">The Essentials of Computer Organization and Architecture</a> (Linda Null, Julia Lobur). The publisher provides a set of <a href="http://computerscience.jbpub.com/ecoa/3e/simulators.aspx">simulators for the machine</a>, written in Java. However, since using simulators can be rather difficult, we have implemented a web-based version, so that students are able to access it readily and easily. Since beginning the project we have added many features such as importing and exporting of Marie Assembly Source files (*.mas) to provide compatibility with the existing simulators.</p>
117118
<br>
@@ -154,7 +155,7 @@ <h2>License</h2>
154155
<h4 class="modal-title"> MARIE.js | <i class="fa fa-hashtag"></i> Current Version</h4>
155156
</div>
156157
<div class="modal-body">
157-
<p>This version of <strong>MARIE.js</strong> is: v1.0.12</p>
158+
<p>This version of <strong>MARIE.js</strong> is: v1.1.0</p>
158159
</div>
159160
</div>
160161
</div>

build/index.html

+9-3
Original file line numberDiff line numberDiff line change
@@ -127,6 +127,7 @@
127127
<li class="divider"></li>
128128
<li><a href="https://gitreports.com/issue/MARIE-js/MARIE.js/" target="_blank"><span class="fa fa-bug"></span> Report an Issue</a></li>
129129
<li><a href="https://goo.gl/CWAaES" target="_blank"><span class="fa fa-paperclip"></span> Submit Feedback</a></li>
130+
<li><a href="http://stats.uptimerobot.com/xnjJPTJj0" target="_blank"><span class="fa fa-check-circle"></span> Server Status</a></li>
130131
</ul>
131132
</li>
132133
</ul>
@@ -354,7 +355,7 @@ <h4>Input Value</h4>
354355
<h4 class="modal-title">MARIE.js | <i class="fa fa-hashtag"></i> Current Version</h4>
355356
</div>
356357
<div class="modal-body">
357-
<p>This version of <strong>MARIE.js</strong> is: v1.0.12</p>
358+
<p>This version of <strong>MARIE.js</strong> is: v1.1.0</p>
358359
</div>
359360
</div>
360361
</div>
@@ -369,7 +370,12 @@ <h4 class="modal-title">MARIE.js | <i class="fa fa-hashtag"></i> Current Version
369370
<h4 class="modal-title">MARIE.js | Google Drive Save Link</h4>
370371
</div>
371372
<div class="modal-body">
372-
<p id="linkText">The file is saved to: </p>
373+
<div class="row">
374+
<p id="linkText">The file is saved to: </p>
375+
</div>
376+
<div class="row">
377+
You will need to manually add sharing permissions in your drive.
378+
</div>
373379
</div>
374380
</div>
375381
</div>
@@ -575,7 +581,7 @@ <h4 class="modal-title"><span class="fa fa-download"></span> Save File to Google
575581
</div>
576582
<div class="modal-body">
577583
<div class="row">
578-
<p>This will save to your root (home) of your Google Drive</p>
584+
<p>Enter the file name you want to call this file, after select the Folder you want to save it in.</p>
579585
</div>
580586
<div class="row">
581587
<div class="col-md-8 text-left">

package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "MARIE.js",
3-
"version": "1.0.12",
3+
"version": "1.1.0",
44
"description": "MARIE.js is an implementation of a simulator for a 'Machine Architecture that is Really Intuitive and Easy' from The Essentials of Computer Organization and Architecture (Linda Null, Julia Lobur) in JavaScript.",
55
"main": "index.js",
66
"scripts": {

src/js/ext/gapi.js

+45-26
Original file line numberDiff line numberDiff line change
@@ -42,7 +42,6 @@
4242

4343
/**
4444
* Google Picker Creation Handler.
45-
* @class gapi
4645
*
4746
* @return Returns Picker and Handles a callback once file is selected
4847
*/
@@ -63,7 +62,6 @@
6362

6463
/**
6564
* Google Picker Handler.
66-
* @class gapi
6765
*
6866
* @see createPicker
6967
* @param {string} data Passes authentication
@@ -139,8 +137,9 @@
139137
'userId': 'me'
140138
});
141139
request.execute(function(resp) {
142-
name = resp.displayName
143-
console.log('Retrieved profile for:' + name);
140+
name = resp.displayName;
141+
console.info('Successfully Logged In');
142+
console.info('Retrieved profile for:' + name);
144143
if(name !== undefined || name !== "undefined"){
145144
$('#nameLink').html('Hello ' + name);
146145
$('#nameLink').show();
@@ -158,39 +157,56 @@
158157
}
159158

160159
folderPicker = function(){
160+
console.info('Loading FilePicker');
161+
//enable docsView to allow user to pick and interact with Google Drive Folder(s)
162+
var docsView = new google.picker.DocsView()
163+
.setIncludeFolders(true)
164+
.setMimeTypes('application/vnd.google-apps.folder')
165+
.setSelectFolderEnabled(true);
161166
if(pickerApiLoaded && oauthToken) {
162167
var picker = new google.picker.PickerBuilder().
163-
addView(google.picker.ViewId.FOLDERS).
168+
addView(docsView).
164169
setOAuthToken(oauthToken).
165170
setDeveloperKey(developerKey).
166-
setCallback(folderPickerCallback).
171+
setCallback(function(data){
172+
var fileName = $("#GFileName").val();
173+
var fileType = $('#saveGFileMode option:selected').val();
174+
175+
if(fileName === "" || fileName === null){
176+
fileName = "code"; //default name set to code.<extension> if not selected
177+
}
178+
if(fileType === "" || fileType === null){
179+
fileType = "mas"; //default name set to <name>.mas if not selected
180+
}
181+
182+
var code = sessionStorage.getItem('code');
183+
var pickerAction = data[google.picker.Response.ACTION];
184+
var pickedState = google.picker.Action.PICKED;
185+
if (pickerAction === pickedState) {
186+
console.log(fileName,fileType);
187+
var doc = data[google.picker.Response.DOCUMENTS][0]; // set the variable doc as First document
188+
var locationID = doc[google.picker.Document.PARENT_ID] // Folder ID Is the file's Parent ID
189+
console.log(locationID);
190+
var fullFileName = fileName + "." + fileType;
191+
console.log(fullFileName);
192+
saveToGDrive("",locationID,code, fullFileName);
193+
}
194+
}).
167195
build();
168196
picker.setVisible(true);
169197
}
170198
}
171199

172-
folderPickerCallback = function(data,callback){
173-
var pickerAction = data[google.picker.Response.ACTION];
174-
var pickedState = google.picker.Action.PICKED;
175-
if (pickerAction === pickedState) {
176-
var doc = data[google.picker.Response.DOCUMENTS][0]; // set the variable doc as First document
177-
var fileID = doc[google.picker.Document.ID]; // Get FileID
178-
var folderID = doc[google.picker.Document.PARENT_ID] // Folder ID Is the file's Parent ID
179-
}
180-
console.log(folderID,fileID)
181-
}
182-
183200

184201
/**
185202
* saveToGDrive function
186-
* @class gapi
187203
* Load a file from Drive. Fetches both the metadata & content in parallel.
188204
*
189205
* @param {string} fileID Unique File ID from Google Drive which identifies it
190206
* @param {string} folderId Unique Folder ID of File ID
191207
* @param {string} text text to be updated
192208
*/
193-
saveToGDrive = function(fileID,folderId,text, callback){
209+
saveToGDrive = function(fileID,folderId,text, filename, callback){
194210
//NProgress starts with 10% when entering this function
195211

196212
//GAPI POST/PUT REQUST CONSTs
@@ -202,10 +218,8 @@
202218
var contentType = "plain/text";
203219
var myToken = gapi.auth.getToken();
204220

205-
var filename = $("#GFileName").val();
206-
var fileType = $('#saveGFileMode option:selected').val();
207221

208-
filename = filename + "." + fileType;
222+
209223
NProgress.inc(0.1);
210224

211225
if (fileID === "" || fileID === null) {
@@ -216,7 +230,8 @@
216230
var contentType = fileData.type || 'plain/text';
217231
var metadata = {
218232
'title': filename,
219-
'mimeType': contentType
233+
'mimeType': contentType,
234+
'parents':[{"id": folderId}]
220235
};
221236

222237
var base64Data = btoa(reader.result);
@@ -263,7 +278,7 @@
263278
NProgress.done();
264279
});
265280
}
266-
} else {
281+
} else { //attempt to update file
267282
var metadata = {'mimeType': contentType,};
268283

269284
var multipartRequestBody =
@@ -274,10 +289,13 @@
274289
close_delim;
275290

276291
if (!callback) {
277-
callback = function(file) {f
292+
callback = function(file) {
278293
console.log("Update Complete ",file);
279-
savedToURL = request.webViewLink;
294+
var savedToURL = file.alternateLink;
280295
console.log(savedToURL);
296+
text = 'The file is located to <a href="' + savedToURL + '" target="_blank">' + savedToURL + '</a>' ;
297+
$('#linkText').html(text);
298+
$('#saveLink').modal('toggle');
281299
NProgress.done();
282300
};
283301
}
@@ -291,6 +309,7 @@
291309
'body': multipartRequestBody,
292310
});
293311
request.execute(callback);
312+
console.log(request.alternateLink);
294313
}
295314
}
296315
}());

src/js/interface.js

+27-14
Original file line numberDiff line numberDiff line change
@@ -1623,6 +1623,31 @@ window.addEventListener("load", function() {
16231623
}
16241624
NProgress.done();
16251625
});
1626+
1627+
$('#opensgdModal').click(function(){
1628+
NProgress.start();
1629+
var fileID = sessionStorage.getItem('savedFileID');
1630+
var folderID = sessionStorage.getItem("parentID");
1631+
var code = programCodeMirror.getValue()
1632+
sessionStorage.setItem('code',code);
1633+
1634+
NProgress.inc(0.1);
1635+
// case when saving for first time
1636+
if (fileID === "" || fileID === null || folderID === null || folderID === "" ){
1637+
$('#savetoGDriveModal').modal('show'); //Toggle Modal if file is not actually saved to GoogleDrive
1638+
} else { //otherwise call a direct function
1639+
saveToGDrive(fileID,folderID,code);
1640+
console.log(programCodeMirror.getValue());
1641+
}
1642+
});
1643+
1644+
1645+
1646+
$('#saveToGDrive').click(function(){
1647+
$('#savetoGDriveModal').modal('hide'); //hide Modal if file is not actually saved to GoogleDrive
1648+
var code = localStorage.getItem('marie-program');
1649+
folderPicker();
1650+
});
16261651
});
16271652

16281653
$(document).ready(function(){
@@ -1636,19 +1661,7 @@ $(document).ready(function(){
16361661
$('#logOut').hide();
16371662
$('#opensgdModal').hide();
16381663

1639-
$('#saveToGDrive').click(function(){
1640-
NProgress.start();
1641-
var fileID = sessionStorage.getItem('savedFileID');
1642-
var folderID = sessionStorage.getItem("parentID");
1643-
var code = localStorage.getItem('marie-program');
1644-
NProgress.inc(0.1);
1645-
if (fileID === "" || folderID === "" ){
1646-
$('#savetoGDriveModal').modal('toggle'); //Toggle Modal if file is not actually saved to GoogleDrive
1647-
}
1648-
saveToGDrive(fileID,folderID,code);
1649-
});
16501664

1651-
$('#opensgdModal').click(function(){
1652-
$('#savetoGDriveModal').modal('toggle');
1653-
});
1665+
1666+
16541667
});

src/templates/index.ejs

+7-2
Original file line numberDiff line numberDiff line change
@@ -178,7 +178,12 @@
178178
<h4 class="modal-title">MARIE.js | Google Drive Save Link</h4>
179179
</div>
180180
<div class="modal-body">
181-
<p id="linkText">The file is saved to: </p>
181+
<div class="row">
182+
<p id="linkText">The file is saved to: </p>
183+
</div>
184+
<div class="row">
185+
You will need to manually add sharing permissions in your drive.
186+
</div>
182187
</div>
183188
</div>
184189
</div>
@@ -384,7 +389,7 @@
384389
</div>
385390
<div class="modal-body">
386391
<div class="row">
387-
<p>This will save to your root (home) of your Google Drive</p>
392+
<p>Enter the file name you want to call this file, after select the Folder you want to save it in.</p>
388393
</div>
389394
<div class="row">
390395
<div class="col-md-8 text-left">

src/templates/partials/nav.ejs

+1
Original file line numberDiff line numberDiff line change
@@ -75,6 +75,7 @@
7575
<li class="divider"></li>
7676
<li><a href="https://gitreports.com/issue/MARIE-js/MARIE.js/" target="_blank"><span class="fa fa-bug"></span> Report an Issue</a></li>
7777
<li><a href="https://goo.gl/CWAaES" target="_blank"><span class="fa fa-paperclip"></span> Submit Feedback</a></li>
78+
<li><a href="http://stats.uptimerobot.com/xnjJPTJj0" target="_blank"><span class="fa fa-check-circle"></span> Server Status</a></li>
7879
</ul>
7980
</li>
8081
</ul>

0 commit comments

Comments
 (0)