<!--
 Copyright 2019 Novartis Institutes for BioMedical Research Inc. Licensed
 under the Apache License, Version 2.0 (the "License"); you may not use
 this file except in compliance with the License. You may obtain a copy
 of the License at http://www.apache.org/licenses/LICENSE-2.0. Unless
 required by applicable law or agreed to in writing, software distributed
 under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES
 OR CONDITIONS OF ANY KIND, either express or implied. See the License for
 the specific language governing permissions and limitations under the License.
-->

<html>
<head>
	<title>Cellxgene Gateway</title>
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
	<link rel="stylesheet" href="{{ url_for('static', filename='css/homepagestyle.css') }}">
	<link rel="icon" type="image/png" href="{{ url_for('static', filename='nibr.ico') }}">
	{% for script in extra_scripts %}
	<script src="{{ script }}"></script>
	{% endfor %}
	<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
	<style>
		li {
			font-size: 20px;
		}
	</style>
</head>
<body>
	<header class="navbar navbar-expand navbar-dark flex-column flex-md-row bd-navbar">
	  <h3>Cellxgene Gateway - HOME</h3>
	</header>
	<br>

	<h1 style="padding-left:35px">
		Links:	
	</h1>
	<div class="list-group" style="width:50%;padding-left:65px">
	  <a href="/filecrawl.html" class="list-group-item list-group-item-action">
		  <u>File Crawler: Allows you to view all uploaded data.</u></a>
		  
	</div>
	<div class="list-group" style="width:50%;padding-left:65px">
		<a href="/cache_status" class="list-group-item list-group-item-action">
			<u>Cache Status: view status of launched cellxgene servers.</u></a>
	</div>
	
	{% if enable_upload %}
	<br>
	<h1 style="padding-left:35px">
		How To Upload Data via HTTP:
	</h1>
	<ol style="padding-left:85px;">
		<li>
			Create a folder for your Username: 
		</li>
		<br>
		<form action="{{ url_for('make_user') }}" method="post">
		    Username <input type="text" name="directory">
		    <input type="submit" value="Create">
		</form>
		<li>
			Create a subdirectory under the selected Folder: 
		</li>		
		<br>
		<form action="{{ url_for('make_subdir') }}" method="post">
			<select name="usernames" id="usernames">
				{% for user in users %}
					<option value="{{ user }}">{{ user }}</option>
				{% endfor %}
			</select>
			<br>
			Subdirectory Name <input type="text" name="directory">
		    <input type="submit" value="Create">
		</form>
		<li>Choose a folder to copy your data to, then upload your data file (must be in .h5ad format).</li>
		<br>
		<form action="{{ url_for('upload_file') }}" method="post" enctype="multipart/form-data">
		Type in the name of the directory and subdirectory you wish to upload to, i.e. "USER/cells". <input type="text" name="path">
		<br>
		File: <input type="file" name="file"><br>
		<input style="position:relative; top:10px;" type="submit" value="Upload">
		</form>
		<br>
		<li>Take a look at your data using the file crawler link above</li>
	</ol>
	{% endif %}

	<br>

	<h1 style="padding-left:35px">
		How To Upload Data via SSH and SCP:
	</h1>
	<ol style="padding-left:85px;">
		<li>
			Confirm that your ssh key has been properly added. Running the following command should connect you to the server:
		</li>
		<pre>ssh ec2-user@{{ ip }}</pre>	
		<li>
			Prepare your data on your own machine. They should be in a common folder called 'USER' and should look <br>similar to the following structure:  
		</li>
		<pre>- USER
    - hpc.h5ad
    - pbmc3k.h5ad</pre>	
		<li>Copy your data to the server (replace USER with your username):</li>
		<pre>ssh ec2-user@{{ ip }} 'mkdir -p {{ cellxgene_data }}/USER/'
ssh ec2-user@{{ ip }} 'mkdir -p {{ cellxgene_data }}/USER/DATA/'
scp -r pbmc3k.h5ad ec2-user@{{ ip }}:{{ cellxgene_data }}/USER/DATA/</pre>	
		<li>Take a look at your data using the file crawler link above</li>
	</ol>	

</body>
</html>
