Add About button

The about button pop ups a window telling the user what version of AToMPM they are running, as well as the website and
documentation location.

Also, the about menu contacts the GitHub release site to determine the newest version and its release date. If no
connection can be made, this information is not presented.

client/constants.js

@@ -5,7 +5,9 @@
 
 /****************************** GLOBAL CONSTANTS ******************************/
 var __WEBPAGE__ = 'https://atompm.github.io/',
-    __VERSION__ = '0.7.0',
+	__RELEASE_LOC__ = "https://api.github.com/repos/AToMPM/atompm/releases/latest",
+	__DOC_WEBPAGE__ = "https://atompm.readthedocs.io",
+    __VERSION__ = '0.8.0',
     __DEFAULT_SAVEAS		 	= '.autosave.model',
 	 __TITLE						= 'AToMPM',
 	 __EXITWARNING				= 'There are unsaved changes. Proceeding will cause'+

client/http_utils.js

@@ -28,13 +28,17 @@ HttpUtils = function(){
 		var onreadystatechange = function(ev) {
 			 if( req.readyState == 4 )
 			 {
-	 			 console.debug(method+' '+url+' >> '+req.status);
-				 if( req.status == 0 )
-	 				 WindowManagement.openDialog(__FATAL_ERROR,'lost connection to back-end');
-				 else if( onresponse )
-					 onresponse(req.status,req.responseText);
-				 else if( ! utils.isHttpSuccessCode(req.status) )
-	 				 WindowManagement.openDialog(_ERROR,req.responseText);
+                 console.debug(method + ' ' + url + ' >> ' + req.status);
+                 //ignore calls made to other addresses
+                 if (url.startsWith("http://") || url.startsWith("https://")) {
+                     onresponse(req.status, req.responseText);
+                 }
+                 else if (req.status == 0)
+                     WindowManagement.openDialog(__FATAL_ERROR, 'lost connection to back-end');
+                 else if (onresponse)
+                     onresponse(req.status, req.responseText);
+                 else if (!utils.isHttpSuccessCode(req.status))
+                     WindowManagement.openDialog(_ERROR, req.responseText);
 			 }
  		 };
 	

client/window_management.js

@@ -58,6 +58,55 @@ WindowManagement = function(){
 		__setCanvasScrolling(false);
 	};
 	
+	this.showAboutDialog = function () {
+
+        let create_about = function (status, text) {
+
+            let version = null;
+            let time_at = null;
+
+            if (utils.isHttpSuccessCode(status)) {
+                let resp = JSON.parse(text);
+                version = resp['tag_name'];
+
+                time_at = resp['published_at'];
+                time_at = time_at.split("T")[0];
+            }
+
+            let title = "About AToMPM";
+            let elements = [];
+
+            let website = "<a href= '" + __WEBPAGE__ + "' target='_blank'>Website and Tutorials</a>";
+            elements.push(GUIUtils.getTextSpan(website));
+
+            let doc_website = "<a href= '" + __DOC_WEBPAGE__ + "' target='_blank'>Documentation</a>";
+            elements.push(GUIUtils.getTextSpan(doc_website));
+
+            let curr_version_str = "Current Version: " + __VERSION__;
+            elements.push(GUIUtils.getTextSpan(curr_version_str));
+
+            elements.push(GUIUtils.getTextSpan("\n"));
+
+            if (version != null) {
+                let new_version_str = "Newest Version: " + version;
+                elements.push(GUIUtils.getTextSpan(new_version_str));
+
+                let time_at_str = "Released on: " + time_at;
+                elements.push(GUIUtils.getTextSpan(time_at_str));
+
+            }
+
+            GUIUtils.setupAndShowDialog(
+                elements,
+                null,
+                __ONE_BUTTON,
+                title,
+                null);
+        };
+
+        HttpUtils.httpReq("GET", "https://api.github.com/repos/AToMPM/atompm/releases/latest", null, create_about);
+	};
+	
 	//Todo: Shred this function into smaller functions, as this should
 	// really just amount to a switch statement
 	//TBI: complete comments about each dialog (copy from user's manual)

doc/overview.rst

@@ -52,7 +52,7 @@ All button toolbar models can be found under the */Toolbars/* user folder. A but
 #. Paste the copied elements on the canvas (copy/paste also works across AToMPM tabs).
 #. Verify whether the constraints of the current model are satisfied.
 #. Show or hide entities of a particular formalism (but do not remove them from the model).
-#. Open the manual.
+#. Display information about AToMPM, such as the current version, website, and documentation.
 
 Most of these actions are intuitive. Others are explained in more detail in the next sections.
     

users/(default)/Toolbars/MainMenu/MainMenu.buttons.model

@@ -2430,7 +2430,7 @@
 							"2": {
 								"textContent": {
 									"type": "string",
-									"value": "userguide"
+									"value": "about"
 								},
 								"style": {
 									"type": "map<string,string>",
@@ -2910,15 +2910,15 @@
 			"13": {
 				"name": {
 					"type": "string",
-					"value": "userguide"
+					"value": "about"
 				},
 				"tooltip": {
 					"type": "string",
-					"value": "open the user's manual"
+					"value": "about AToMPM"
 				},
 				"code": {
 					"type": "code",
-					"value": "window.open('https://msdl.uantwerpen.be/documentation/AToMPM/', '_blank')"
+					"value": "showAboutDialog();"
 				},
 				"$type": "/Formalisms/__Utilities__/Buttons/Buttons/Button"
 			},