53 lines
		
	
	
		
			1.5 KiB
		
	
	
	
		
			Plaintext
		
	
	
			
		
		
	
	
			53 lines
		
	
	
		
			1.5 KiB
		
	
	
	
		
			Plaintext
		
	
	
{% layout 'layout.liquid' %}
 | 
						|
 | 
						|
{% block head %}
 | 
						|
<script src="/static/lib/sigma.min.js"></script>
 | 
						|
<script src="/static/lib/graphology.umd.min.js"></script>
 | 
						|
 | 
						|
<title>Depyth</title>
 | 
						|
{% endblock %}
 | 
						|
 | 
						|
{% block content %}
 | 
						|
<main class="p-4 mx-auto flex-1 max-w-[800px]">
 | 
						|
	<header class="w-fit mx-auto mb-8">
 | 
						|
		<h1 class="text-5xl my-4 text-center">Depyth</h1>
 | 
						|
		<p class="italic text-center">Dumb python packages things</p>
 | 
						|
	</header>
 | 
						|
 | 
						|
	<h2 class="text-4xl my-3">{{packagename}}</h2>
 | 
						|
 | 
						|
	<h3 class="text-3xl my-2">General info</h3>
 | 
						|
 | 
						|
	<p>Installing this package means installing up to <span id="total-packages-installed" class="font-bold">0</span> packages</p>
 | 
						|
	<p>Installing this package means installing up to <span id="total-weight" class="font-bold">0</span><span id="total-weight-unit">kb</span>.</p>
 | 
						|
 | 
						|
	<h3 class="text-3xl my-2">Dependency graph</h3>
 | 
						|
 | 
						|
	<div id="graph" class="w-full h-[600px] bg-white border border-black"></div>
 | 
						|
 | 
						|
 | 
						|
 | 
						|
 | 
						|
	<script>
 | 
						|
		// Create a graphology graph
 | 
						|
		fetch("/api/graph/{{packagename}}").then( res => res.json() ).then( json => {
 | 
						|
			console.log(json);
 | 
						|
 | 
						|
			document.getElementById('total-packages-installed').innerText = '?';
 | 
						|
			document.getElementById('total-weight').innerText = json.weight;
 | 
						|
			document.getElementById('total-weight-unit').innerText = json.weightUnit;
 | 
						|
 | 
						|
 | 
						|
			const graph = new graphology.Graph();
 | 
						|
 | 
						|
			graph.import( json.graph );
 | 
						|
 | 
						|
			// Instantiate sigma.js and render the graph
 | 
						|
			const sigmaInstance = new Sigma(graph, document.getElementById("graph"));
 | 
						|
		})
 | 
						|
 | 
						|
	</script>
 | 
						|
 | 
						|
</main>
 | 
						|
{% endblock %}
 |