24.4.18 v1.4.0

README.md

@@ -19,18 +19,20 @@ Lead programmer up till April 2018: [Nikhil VJ](https://answerquest.github.io) f
 
 ## Run on your system
 #### About the password
-Yeah.. I put that in to share a demo of the app online and keep off spam-bots. And also for basic kid-proofing. You need to type in a password at the top right corner for anything that involves edit / import / export of database. Reading is free.
+You need to type in a password at the top right corner for anything that involves edit / import / export of database. Reading is free.  
+This feature was put in to share a demo version of the app online and keep off spam-bots. And also for basic stranger-proofing, in case someone stumbles across the tool over LAN or something. 
 
-How to configure your own password: Run [utilities/encrypt.py](https://github.com/WRI-Cities/static-GTFS-manager/blob/master/utilities/encrypt.py) like so:  
+How to configure your own password:  
+1. Run [utilities/encrypt.py](https://github.com/WRI-Cities/static-GTFS-manager/blob/master/utilities/encrypt.py) like so:  
 `python3 encrypt.py "your-password"`  
-It will generate a file for you named `rsa_key.bin`, which you have to put in the `js` folder of this repo (replace the one already there.. that's for my password.) After that, it'll be your password that works.
+2. It will generate a file for you named `rsa_key.bin`, which you have to put in the `pw` folder of this repo (replace the one already there) After that, it'll be your password that works.
 
-If you don't want to bother with all that jazz, find the `decrypt` function in `GTFSserverfunction.py` and change it to:
+If you don't want to bother with all that jazz, here's a hack: find the `decrypt` function in `GTFSserverfunction.py` and change it to:
 ```
 def decrypt(password):
 	return true
 ```
-Then type in any junk text to make things happen.
+Then type in any junk text to make things happen. The check for *some* password being typed, though, is there on JS side in every page and every function, so that may be harder to script out.
 
 #### On Ubuntu / Linux OS
 1. Open Terminal (linux command prompt) and clone this repo to your side:  
@@ -55,7 +57,36 @@ Then type in any junk text to make things happen.
 
 
 #### On Windows OS
-To do! But Anaconda package is a good place to start, and similar steps to be followed. *Coming soon: a binary .exe to make the program stand-alone.*
+Currently trying to build a standalone executable. To run the python3 program in windows, follow these steps:
+
+1. Install MiniConda as per your OS and 32/64 bit: https://conda.io/miniconda.html . Choose the default options.. nothing special needed.
+2. Open start menu > Anaconda.. > Anaconda Prompt
+3. A command prompt (black dos box) will open. This is like the regular windows command prompt, but has the added functionality of having python commands working.
+4. You'll be at some C:\xy path. Navigate to the folder where you have cloned/unzipped this repo. (oh, in case you haven't already.. you do need to download this program's repo! See the "Clone.." button around the top of the page.
+5. Try running this command: `python web_wrapper.py` . You'll probably get an error saying a particular module is not found. We have to download and install some dependencies first.
+6. Run these commands. You might be shown some things and asked to confirm. Press y and Enter when its asks.
+```
+conda install tornado
+conda install pandas
+pip install xmltodict
+pip install tinydb
+pip install pycryptodome
+```
+7. Some explanation : `conda` and `pip` are both standard package managers in miniconda and python. They download these packages/modules from official sources. The packages that aren't in conda's official listing need to be downloaded by pip. I had tried using pip for all but some chain-dependencies made conda necesary for the first two.
+8. Once you are done, run `python web_wrapper.exe`. You should see lines like:
+```
+static GTFS Manager
+Fork it on Github: https://github.com/WRI-Cities/static-GTFS-manager/
+Starting up the program, please wait...
+
+Loaded dependences, starting static GTFS Manager program.
+Open http://localhost:5000 in your Browser if you don't see it opening automatically within 5 seconds.
+```
+9. You might get a prompt from Windows Firewall. You can click Cancel or OK, it won't make any difference at your end. But if you want this program to be accessed by other machines on your LAN or WiFi network, then choose the appropriate options and proceed.
+10. A new tab should open in your web browser automatically, but in case it doesn't, please browse to the URL given in the command prompt output.
+11. The program now runs like a website in your browser. Note that this program is best seen from Chrome browser.
+12. To exit, you can simply close your browser tabs and close the command prompt box. Pressing Ctrl+C doesn't work immediately.. you need to perform some action in the browser like navigating to a different page.
+
 
 ## GTFS feed Export
 The end output of this program is a gtfs.zip file having your transit agency's static GTFS data. See the **Commit and Export GTFS** section on the main page for the same.

fares.html

@@ -80,23 +80,42 @@
 <div class="container">
 <h3>Fares</h3>
 
-<div id="accordion">
+<div id="instructions">
 <h3>Instructions</h3>
 <div>
-The zone_id's defined in <a href="stop.html">Stops Management</a> are arranged here in a 2-D matrix. <br>You can change the fares by clicking on them. <br>The fare's values can be set in the Fare Attributes tab.
-<br>Reference: <a href="https://developers.google.com/transit/gtfs/reference/#fare_rulestxt" target="_blank">GTFS fare rules specs</a>
-<br>Use the Undo button to undo changes. To revert to the last saved version, simply reload this page.
+<b>Fare Rules - Pivoted View</b>
+<br><ul>
+<li>The zone_id's defined in <a href="stop.html">Stops Management</a> are arranged here in a 2-D matrix.</li>
+<li>You can change the fares by clicking on them.</li>
+<li>The fare's values can be changed in the Fare Attributes tab.</li>
+<li>More info: <a href="https://developers.google.com/transit/gtfs/reference/#fare_rulestxt" target="_blank">GTFS fare rules specs</a></li>
+</ul>
+<br>
+<b>Fare Rules - Simple View</b>
+<ul>
+<li>This is a linear (and original table) view of the same data seen in Pivoted View tab.</li>
+<li>Here you can add more fare rules or delete existing ones.</li>
+<li>More info: <a href="https://developers.google.com/transit/gtfs/reference/#fare_rulestxt" target="_blank">GTFS fare rules specs</a></li>
+</ul>
 
-<br>Note: The fares model used here is targeted at the station pairs model in <a href="https://code.google.com/archive/p/googletransitdatafeed/wikis/FareExamples.wiki">Example 6 on this explainer wiki</a>. More models may be incorporated in future.
+<br>
+<b>Fare Attributes</b>
+<ul>
+<li>The fare_id's used in Fare Rules tabs are defined here.</li>
+<li>Each fare_id represents a ticket cost and other details.</li>
+<li>More info: <a href="https://developers.google.com/transit/gtfs/reference/#fare_attributestxt" target="_blank">GTFS fare attributes specs</a></li>
+</ul>
+
+<br>Note: The fares structure used here is targeted at the station pairs model in <a href="https://code.google.com/archive/p/googletransitdatafeed/wikis/FareExamples.wiki">Example 6 on this explainer wiki</a>. More models may be incorporated in future.
 </div>
 </div><!-- Accordion over -->
 <br>
 
 <!-- Tabs Menu -->
 <div id="tabs">
 <ul>
-<li><a href="#tab1">Fare Rules - Pivoted</a></li>
-<li><a href="#tab3">Fare Rules - Simple</a></li>
+<li><a href="#tab1">Fare Rules - Pivoted View</a></li>
+<li><a href="#tab3">Fare Rules - Simple View</a></li>
 <li><a href="#tab2">Fare Attributes</a></li>
 </ul>
 
@@ -106,7 +125,7 @@ <h3>Instructions</h3>
 
 <h4>Fare Rules - Pivoted</h4>
 <div id="fare-rules-table">Loading Fare Rules from backend, please wait..</div><br>
-<p align="center">Changes: <button class="btn btn-outline-warning btn-sm" id="rules-undo">Undo</button> | <button class="btn btn-outline-info btn-sm" id="rules-redo" >Redo</button> | <button id="saveFareRulesPivotedButton" class="btn btn-outline-success btn-lg">Save Fare Rules</button></p>
+<p align="center">Changes: <button class="btn btn-outline-warning btn-sm" id="rules-undo">Undo</button> | <button class="btn btn-outline-info btn-sm" id="rules-redo" >Redo</button> | <button id="saveFareRulesPivotedButton" class="btn btn-outline-success btn-lg">Save Fare Rules to DB</button></p>
 <p align="center"><span id="saveFareRulesStatus"></span></p>
 
 
@@ -167,10 +186,12 @@ <h4>Add/Edit a Fare Attribute</h4>
 
 <p>Pick or create a fare_id: <input autocapitalize="characters" id='targetFareid' placeholder='fare id' size="5"></p>
 <p>Set a price: <input id='price' type="number" style="width:50px;"> INR => <button id="addEditFare" class="btn btn-outline-primary btn-sm">Add or Edit Fare</button></p>
+<!--
 <p>Or, <button id="deleteFare" class="btn btn-outline-danger btn-sm">Delete Fare</button></p>
+-->
 <small id="fareAttrStatus"></small>
 <hr>
-<p><button id="saveFareAttributesButton" class="btn btn-outline-success btn-lg">Save Fare Attributes</button> <span id="saveFareAttributesStatus"></span>
+<p><button id="saveFareAttributesButton" class="btn btn-outline-success btn-lg">Save Fare Attributes to DB</button> <span id="saveFareAttributesStatus"></span>
 
 </div>
 </div> <!-- end of columns row -->
@@ -179,6 +200,7 @@ <h4>Add/Edit a Fare Attribute</h4>
 </div> <!-- end tabs -->
 
 <div style="clear:both"></div>
+<!--
 <div id="logaccordion">
 <h3>Changes Log</h3>
 <div>

index.html

@@ -25,7 +25,22 @@
 
 <div class="container-fluid">
 <h2>Welcome</h2>
-<p>This is a manager for GTFS static transport schedule data. Please make sure you are well versed with the <a href="https://developers.google.com/transit/gtfs/reference/">static GTFS standard</a> before using this tool.</p>
+
+<div id="instructions" class="container">
+<h4>Instructions</h4>
+<div>
+<ul>
+<li>This is the home/main page of the tool. It gives you and overview of your data, and here you can import/export your GTFS feeds.</li>
+<li>There are 4 sections on this page:</li>
+<li><b>Current GTFS data</b> : current stats of data in database.</li>
+<li><b>Import GTFS</b> : Import a GTFS feed to load it into the database and edit it with this tool. You can also load in other formats or start a Blank Slate (blank GTFS feed).</li>
+<li><b>Browse past commits</b> : See past exports and backups of the database. To revert to an older version of the data, download a past feed and re-import it using the Import GTFS section.</li>
+<li><b>Commit and Export GTFS</b> : Feeling ready with the data? Or just want to keep a backup? Type in a name for easy identification, and press the big green button!</li>
+<li>Please make sure you are well versed with the <a href="https://developers.google.com/transit/gtfs/reference/">static GTFS standard</a> before using this tool.</li>
+</ul>
+
+</div>
+</div><!-- Accordion over -->
 
 <br><hr>
 
@@ -100,9 +115,8 @@ <h3>Browse past commits</h3>
 
 <h3>Commit and Export GTFS</h3>
 <p>If you feel like your data is ready, choose a commit name and press the button to create a freshly minted GTFS feed!</p>
-<p><input id="commitName" placeholder="choose a name, eg: first-try">  
-<small>Note: no spaces, /\@#*?. etc. Keep lowercase. Can use alphabets, digits, hyphen (-), underscore (_).</small></p>
-<p><button class="btn btn-bg btn-primary" id="exportGTFS">Generate and Export GTFS</button></p>
+<p><input id="commitName" placeholder="choose a name, eg: first-try" data-toggle="popover" data-trigger="hover" data-placement="top" data-html="true" title="Pick a name" data-content="So that it's easy for you to identify later, type in a word or so to give your export a name.<br><small>Note: No special characters. Keep lowercase. Can use alphabets, digits, hyphen (-), underscore (_). Spaces will be converted to _"></p>
+<p><button class="btn btn-bg btn-success" id="exportGTFS">Generate and Export GTFS</button></p>
 <div class="card mb-3 card-body bg-light" id="exportGTFSlog">Log</div>
 
 </div>

js/commonfuncs.js

@@ -1,21 +1,30 @@
 // ############################
 // CONSTANTS
-const version = 'v1.3.0';
+const version = 'v1.4.0';
 const APIpath = 'API/';
 // const APIpath = 'https://lit-mesa-97724.herokuapp.com/API/';
 const CURRENCY = 'INR';
 const route_type_options = {0:"0-Tram, Streetcar, Light rail", 1:"1-Subway, Metro", 2:"2-Rail", 3:"3-Bus",4:"4-Ferry" };
+//const route_type_lookup = {0:"Tram, Streetcar, Light rail", 1:"Subway, Metro", 2:"Rail", 3:"Bus",4:"Ferry" };
+const route_type_lookup = route_type_options;
 
 // this json holds the different pages. If you want to add/remove/rename a page, do so here.
 const menu = { 'index.html':'Main', 'stops.html':'Stops', 'routes.html':'Routes', 'schedules.html':'Schedules', 'fares.html':'Fares', 'misc.html':'Misc','xml2GTFS.html':'XML Import'};
 
-navBarContentStart = '<nav class="navbar navbar-expand-sm bg-dark navbar-dark fixed-top justify-content-between"> \
+// this flag tells whether it is mandatory for all UIDs to be in capitals or not.
+const CAPSLOCK = true;
+
+// default config parameters for KMRL KML import.
+const KMRLDEFAULTS = { "stations":"stations.csv", "timepoint":1, "wheelchair_accessible":1, "route_type":1, "route_color":"00B7F3", "route_text_color":"000000", "secondland":"ml", "currency_type":CURRENCY, "payment_method":0, "transfers":"", "agency_id":"KMRL", "agency_name":"Kochi Metro", "agency_name_translation":"കൊച്ചി മെട്രോ", "agency_url":"http://www.kochimetro.org/", "agency_timezone":"Asia/Kolkata", "end_date":"20990101"
+	};
+
+var navBarContentStart = '<nav class="navbar navbar-expand-sm bg-dark navbar-dark fixed-top justify-content-between"> \
  <!-- Brand --> \
 <div class="navbar-brand"><a class="navbar-brand" href="index.html">GTFS Manager</a> <a class="navbar-brand" href="https://github.com/WRI-Cities/static-GTFS-manager" target="_blank"><span class="badge">' + version + '</span></a></div> \
 <!-- Links --> \
 <ul class="navbar-nav">';
 
-navBarContentEnd = '</ul> \
+var navBarContentEnd = '</ul> \
 	<input id="password" class="form-control mr-sm-2" type="text" placeholder="pw for edits" aria-label="Search" style="width:200px;"> \
 </nav>';
 
@@ -38,6 +47,27 @@ $(document).ready(function() {
 	navBarContent+=navBarContentEnd;
 	$( "#navBar" ).html(navBarContent);
 
+	// initiate bootstrap / jquery components like tabs, accordions
+	// tabs
+	$( "#tabs" ).tabs({
+		active:0
+	});
+	// popover
+	$('[data-toggle="popover"]').popover(); 
+
+	$('[data-toggle="tooltip"]').tooltip(); 
+
+	// initiate accordion
+	$( "#accordion" ).accordion({
+		collapsible: true, active: false
+	});
+	$( "#instructions" ).accordion({
+		collapsible: true, active: false
+	});
+	$( "#logaccordion" ).accordion({
+		collapsible: true, active: false
+	});
+
 });
 // ############################
 // FUNCTIONS
@@ -86,4 +116,8 @@ function addVar(row, id) {
 
 function shakeIt(targetId) {
 	$('#'+targetId).effect( "shake", {times:3}, 500 );
+}
+
+function pad(n, width=3, z=0) {
+	return (String(z).repeat(width) + String(n)).slice(String(n).length);
 }

js/commonstyle.css

@@ -61,13 +61,20 @@ a.currentpage {
 .ui-widget.ui-widget-content {
 	border:none;
 }
+/*
 .ui-tabs-panel a {
 	color: #007bff;
 }
+
 .ui-tabs-panel a:hover {
 	text-decoration: underline;
 	color: #0056b3;
 }
+*/
+
+.ui-widget-content a {
+	color: #007bff;
+}
 
 /* Changes log */
 #trackChanges {
@@ -110,7 +117,9 @@ background: #000000a1;
 .mapButton {
 	font-size: 3em;
 }
-
+.leaflet-top a {
+	color: black;
+}
 
 /* Tabulator */ 
 .tabulator {