From 1156b0998758ee803c7e8ae0cc2beb5181c232a3 Mon Sep 17 00:00:00 2001 From: James Taylor Date: Fri, 21 Jun 2019 21:41:41 -0700 Subject: Refactor search page --- youtube/templates/base.html | 4 +- youtube/templates/common_elements.html | 152 +++++++++++++++++++++++++++++++++ youtube/templates/search.html | 54 ++++++++++++ 3 files changed, 209 insertions(+), 1 deletion(-) create mode 100644 youtube/templates/common_elements.html create mode 100644 youtube/templates/search.html (limited to 'youtube/templates') diff --git a/youtube/templates/base.html b/youtube/templates/base.html index e98f972..eafd369 100644 --- a/youtube/templates/base.html +++ b/youtube/templates/base.html @@ -2,13 +2,14 @@ - {% block page_title %}{% endblock %} + {% block page_title %}{{ title }}{% endblock %} @@ -105,6 +106,7 @@
{% block main %} +{{ main }} {% endblock %}
diff --git a/youtube/templates/common_elements.html b/youtube/templates/common_elements.html new file mode 100644 index 0000000..9f2aa3f --- /dev/null +++ b/youtube/templates/common_elements.html @@ -0,0 +1,152 @@ +{% macro text_runs(runs) %} + {%- if runs[0] is mapping -%} + {%- for text_run in runs -%} + {%- if text_run.get("bold", false) -%} + {{ text_run["text"] }} + {%- elif text_run.get('italics', false) -%} + {{ text_run["text"] }} + {%- else -%} + {{ text_run["text"] }} + {%- endif -%} + {%- endfor -%} + {%- else -%} + {{ runs }} + {%- endif -%} +{% endmacro %} + +{% macro small_item(info) %} +
+
+ {% if info['type'] == 'video' %} + + + {{ info['duration'] }} + + {{ info['title'] }} + +
{{ info['author'] }}
+ {{ info['views'] }} + + {% elif info['type'] == 'playlist' %} + + +
+ {{ info['size'] }} +
+ + {{ info['title'] }} + +
{{ info['author'] }}
+ {% else %} + Error: unsupported item type + {% endif %} +
+ {% if info['type'] == 'video' %} + + {% endif %} +
+{% endmacro %} + +{% macro get_stats(info) %} + {% if 'author_url' is in(info) %} +
By {{ info['author'] }}
+ {% else %} +
{{ info['author'] }}
+ {% endif %} + {% if 'views' is in(info) %} + {{ info['views'] }} + {% endif %} + {% if 'published' is in(info) %} + + {% endif %} +{% endmacro %} + + + +{% macro medium_item(info) %} +
+
+ {% if info['type'] == 'video' %} + + + {{ info['duration'] }} + + + {{ info['title'] }} + +
+ {{ get_stats(info) }} +
+ + {{ text_runs(info['description']) }} + {{ info['badges']|join(' | ') }} + {% elif info['type'] == 'playlist' %} + + +
+ {{ info['size'] }} +
+ + + {{ info['title'] }} + +
+ {{ get_stats(info) }} +
+ {% elif info['type'] == 'channel' %} + + + + + {{ info['title'] }} + + {{ info['subscriber_count'] }} + {{ info['size'] }} + + {{ text_runs(info['description']) }} + {% else %} + Error: unsupported item type + {% endif %} +
+ {% if info['type'] == 'video' %} + + {% endif %} +
+{% endmacro %} + + +{% macro item(info) %} + {% if info['item_size'] == 'small' %} + {{ small_item(info) }} + {% elif info['item_size'] == 'medium' %} + {{ medium_item(info) }} + {% else %} + Error: Unknown item size + {% endif %} +{% endmacro %} + + + +{% macro page_buttons(estimated_pages, url, parameters_dictionary) %} + {% set current_page = parameters_dictionary.get('page', 1)|int %} + {% set parameters_dictionary = parameters_dictionary.to_dict() %} + {% if current_page is le(5) %} + {% set page_start = 1 %} + {% set page_end = [9, estimated_pages]|min %} + {% else %} + {% set page_start = current_page - 4 %} + {% set page_end = [current_page + 4, estimated_pages]|min %} + {% endif %} + + {% for page in range(page_start, page_end+1) %} + {% if page == current_page %} +
{{ page }}
+ {% else %} + {# IMPORTANT: Jinja SUCKS #} + {# https://stackoverflow.com/questions/36886650/how-to-add-a-new-entry-into-a-dictionary-object-while-using-jinja2 #} + {% set _ = parameters_dictionary.__setitem__('page', page) %} + {{ page }} + {% endif %} + {% endfor %} + +{% endmacro %} diff --git a/youtube/templates/search.html b/youtube/templates/search.html new file mode 100644 index 0000000..1086cfd --- /dev/null +++ b/youtube/templates/search.html @@ -0,0 +1,54 @@ +{% set search_box_value = query %} +{% extends "base.html" %} +{% block page_title %}{{ query + ' - Search' }}{% endblock %} +{% import "common_elements.html" as common_elements %} +{% block style %} + main{ + display:grid; + grid-template-columns: minmax(0px, 1fr) 800px minmax(0px,2fr); + max-width:100vw; + } + + + #number-of-results{ + font-weight:bold; + } + #result-info{ + grid-row: 1; + grid-column:2; + align-self:center; + } + .page-button-row{ + grid-column: 2; + justify-self: center; + } + + + .item-list{ + grid-row: 2; + grid-column: 2; + } + .badge{ + background-color:#cccccc; + } +{% endblock style %} + +{% block main %} +
+
Approximately {{ '{:,}'.format(estimated_results) }} results ({{ '{:,}'.format(estimated_pages) }} pages)
+{% if corrections['type'] == 'showing_results_for' %} +
Showing results for {{ corrections['corrected_query']|safe }}
+
Search instead for {{ corrections['original_query'] }}
+{% elif corrections['type'] == 'did_you_mean' %} +
Did you mean {{ corrections['corrected_query']|safe }}
+{% endif %} +
+
+ {% for info in results %} + {{ common_elements.item(info) }} + {% endfor %} +
+ +{% endblock main %} -- cgit v1.2.3