remove duplicate code in file listing template and javascript

video_metadata/static/file_listing.js

@@ -1,6 +1,6 @@
 
 // TODO: could get path constants from DOM in jinja template
-const FOLDER_CONTENTS_PATH = '/pvdb/file_listing/folder_contents';
+const FOLDER_CONTENTS_PATH = '/pvdb/file_listing/folder_contents_json/';
 const QUERY_PATH = '/pvdb/tmdb/query_movie'
 
 
@@ -31,8 +31,10 @@ function addContents(node, json) {
 			element.removeChild(element.querySelector('ul'));
 		} else {
 			if (a.dataset.is_dir == 'true') {
-				fetchJSON(FOLDER_CONTENTS_PATH + a.dataset.rel_path, parseResponse, e);
+				fetchJSON(FOLDER_CONTENTS_PATH + a.dataset.rel_path, parseResponse, element);
 			} else {
+				// TODO: would be nice to have a modal here to select the metadata
+				// TODO: also need a way to display file paths that are already stored
 				window.location = QUERY_PATH
 					+ '?query=' + a.dataset.base_name
 					+ '&rel_path=' + a.dataset.rel_path;
@@ -41,7 +43,7 @@ function addContents(node, json) {
 	});
 }
 
-function parseResponse(json, event) {
+function parseResponse(json, node) {
 	if (json.errors.length > 0) {
 		for (let err of json.errors)
 			logError(err);
@@ -53,7 +55,8 @@ function parseResponse(json, event) {
 		for (let path of json.paths)
 			addContents(ul, path);
 
-		event.target.parentNode.appendChild(frag);
+		console.log(node);
+		node.appendChild(frag);
 	}
 }
 
@@ -67,24 +70,7 @@ window.onload = function() {
 		return;
 	}
 
-	// TODO: remove the top level links from jinja template, and just load as JSON
+	fetchJSON(FOLDER_CONTENTS_PATH, parseResponse, document.querySelector('#videolist'));
-	// 	to avoid duplicate code.
-	// TODO: should probably look at flask routes as well
-	// TODO: will need to update the addContents function
-	// NOTE: replace top level links with event listeners that fetch json directory listings
-	for (let link of document.querySelectorAll('#videolist > li > a')) {
-		let href = link.getAttribute('href')
-
-		link.addEventListener('click', function(e) {
-			e.preventDefault();
-			let element = e.target.parentNode
-
-			if (element.querySelector('ul'))
-				element.removeChild(element.querySelector('ul'));
-			else
-				fetchJSON(FOLDER_CONTENTS_PATH + href, parseResponse, e);
-		});
-	}
 }
 
 
@@ -102,7 +88,7 @@ function removeAllChildren(node) {
 		node.removeChild(node.lastChild);
 }
 
-function fetchJSON(url, responseFunc, event) {
+function fetchJSON(url, responseFunc, node) {
 	fetch(url)
 	.then(function(response) {
 		if (!response.ok)
@@ -111,7 +97,7 @@ function fetchJSON(url, responseFunc, event) {
 		return response.json();
 	})
 	.then(function(json) {
-		responseFunc(json, event);
+		responseFunc(json, node);
 	})
 	.catch(function(error) {
 		logError('fetch error: ' + error);

video_metadata/templates/file_listing/folder_contents.html

@@ -12,18 +12,6 @@
 		<p id="noscript" class="flash">Javascript needs to be enabled for this page</p>
 		<div id="js_errors" class="flash"></div>
 
-		<ul id="videolist">
+		<ul id="videolist"></ul>
-		{% for path in paths%}
-			<li>
-				{% if path.is_dir %}
-				<a class="folder" href="{{ path.rel_path }}">{{ path.base_name }}</a>
-				{% else %}
-				<a  class="file" href="{{
-					url_for('tmdb.query_movie', query=path.base_name, rel_path=path.rel_path) }}">
-					{{ path.base_name }}</a>
-				{% endif %}
-			</li>
-		{% endfor %}
-		</ul>
 {% endblock %}
 

video_metadata/views/file_listing.py

@@ -25,26 +25,13 @@ class path_entry:
 
 @bp.route('/folder_contents/')
 def getBaseFolderContents():
-    full_path = current_app.config['MOVIE_DIR']
+    return render_template('file_listing/folder_contents.html')
-    paths = []
-
-    # validate input
-    if not os.path.exists(full_path):
-        flash('path in "MOVIE_DIR" is invalid')
-    else:
-        for entry in os.scandir(full_path):
-            paths.append(getPathInfo(entry, MAX_RECURSE_DEPTH))
-
-    return render_template(
-            'file_listing/folder_contents.html',
-            paths=paths,
-            debug_str=util.dumpObject(paths)
-        )
 
 
 # NOTE: return a listing of files and directories in a sub_directory as JSON
 #   @param subpath a path relative to config['MOVIE_DIR']
-@bp.route('/folder_contents/<path:subpath>')
+@bp.route('/folder_contents_json/')
+@bp.route('/folder_contents_json/<path:subpath>')
 def getFolderJSON(subpath = ''):
     video_path = current_app.config['MOVIE_DIR']
     full_path = os.path.join(video_path, subpath)