First push of newui

src/interface/migrations/0005_navigation.py

@@ -0,0 +1,35 @@
+# Generated by Django 3.0.4 on 2020-06-10 05:07
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ("interface", "0004_collections"),
+    ]
+
+    operations = [
+        migrations.CreateModel(
+            name="Navigation",
+            fields=[
+                (
+                    "id",
+                    models.AutoField(
+                        auto_created=True,
+                        primary_key=True,
+                        serialize=False,
+                        verbose_name="ID",
+                    ),
+                ),
+                ("title", models.CharField(max_length=255)),
+                ("link", models.CharField(max_length=255, null=True)),
+                ("category", models.CharField(max_length=255, null=True)),
+                ("parent_id", models.IntegerField(null=True)),
+                ("alt", models.CharField(max_length=255, null=True)),
+                ("type", models.IntegerField(null=True)),
+                ("socket", models.CharField(max_length=255)),
+            ],
+            options={"db_table": "navigation",},
+        ),
+    ]

src/interface/models.py

@@ -62,3 +62,40 @@ class Collections(models.Model):
         except Exception as e:
             raise
         return results
+
+
+class Navigation(models.Model):
+    """
+    pyShelfs Navigation Database class
+    :param title: Link Text
+    :param link: Link link :)
+    :param category: Where in the nav tree do I belong
+    :param parent_id: This link is a sub link of link with id of me
+    :param alt: Alternate text of link
+    :param type: Web link, or Socket link which will be expected to act on \
+    the link, and the action defined in socket
+    :param socket: if a Socket link define socket here
+    """
+
+    class Meta:
+        db_table = "navigation"
+
+    def __str__(self):
+        return self.title
+
+    title = models.CharField(max_length=255)
+    link = models.CharField(max_length=255, null=True)
+    category = models.CharField(max_length=255, null=True)
+    parent_id = models.IntegerField(null=True, editable=True)
+    alt = models.CharField(max_length=255, null=True)
+    type = models.IntegerField(null=True)
+    socket = models.CharField(max_length=255, null=False)
+
+    def generic_search(self, query):
+        try:
+            results = Navigation.objects.annotate(
+                search=SearchVector("title", "parent_id", "category"),
+            ).filter(search=query)
+        except Exception as e:
+            raise
+        return results

src/interface/static/css/main.css

@@ -1,19 +1,17 @@
 body {
     margin: 0px;
     padding: 0px;
-    background-color: #DCDCDD;
+    background-color: #FFF;
-    color: #fff;
+    color: #000;
     overflow-x: hidden;
 }
 
 #app {
     display: grid;
     grid-template-areas:
-        "app_header"
+        "app_body";
-        "app_body"
+    grid-template-rows: auto;
-        "app_footer";
+    /*! max-height: 100%; */
-    grid-template-rows: 52px auto auto;
-    /* max-height: 100%; */
 }
 
 .clear {
@@ -28,8 +26,7 @@ body {
         "title nav_left_top nav_center_top nav_right_top";
     grid-template-columns: 225px auto auto;
     padding: 4px 0px 4px;
-    grid-auto-columns: auto;
+    background-color: #2d2d2d;
-    background-color: #2b2b2b;
 }
 
 .nav_left_top {
@@ -55,15 +52,15 @@ body {
 
 .app_hdr {
     grid-area: title;
-    margin: 0px 0px 5px 0px;
+    margin: 0px 0px 0px 0px;
     font-family: 'Gruppo', cursive;
-    font-size: 36px;
+    font-size: 20px;
     text-align: start;
-    padding: 0px 0px 0px 5px;
+    padding: 0px 0px 0px 0px;
 }
 
 .shadow {
-    text-shadow: #4c5c68 -5px 3px 5px;
+    text-shadow: #fff -1px 0px 11px;
 }
 
 .app_subhdr {
@@ -87,24 +84,24 @@ body {
     grid-area: app_body;
     grid-template-rows: auto;
     grid-template-areas: "nav_l shelf";
-    grid-template-columns: 15vw 85vw;
+    grid-template-columns: 160px auto;
-    background-color: dimgray;
+    background-color: white;
 }
 
 .nav_l {
     display: grid;
     grid-area: nav_l;
     font-family: 'Gruppo', cursive;
-    font-size: 20px;
+    font-size: 15px;
-    max-height: 500px;
+    /*! max-height: 500px; */
     overflow-y: scroll;
-    padding: 0px 10px;
+    /*! padding: 0px 10px; */
 }
 
 .popover{
     display: none;
     z-index: 100;
-    background-color: #000;
+    background-color: #cecece;
     /*min-width: 200px;*/
     min-height: 30px;
     position: fixed;
@@ -116,31 +113,33 @@ body {
     padding: 0px 10px;
 }
 .nav_l_hdr {
-    text-align: center;
+    /*! text-align: center; */
-    padding: 5px;
+    padding: 1px;
-    background-color: #292f35;
+    background-color: #9e9e9e;
-    border-bottom: 2px solid #000;
+    border-bottom: 2px solid #dadada;
+    color: black;
+    font-weight: bold;
 }
 
 .nav_l_0 {
-    background-color: #2b2b2b;
+    background-color: #dadada;
-    padding: 5px;
+    /*! padding: 5px; */
-    text-align: center;
+    /*! text-align: center; */
-    border-bottom: 1px solid #000;
+    border-bottom: 1px solid #dadada;
 }
 
 .nav_l_1 {
-    padding: 5px;
+    /*! padding: 5px; */
-    text-align: center;
+    /*! text-align: center; */
-    border-bottom: 1px solid #000;
+    border-bottom: 1px solid #dadada;
 }
 .nav_link {}
 #vert-nav {
     list-style: None;
     padding: 0px;
     margin: 10px 0px;
-    border-left: 5px solid #292f35;
+    /*! border-left: 5px solid #292f35; */
-    border-right: 5px solid #292f35;
+    /*! border-right: 5px solid #292f35; */
 }
 
 .vert-nav-item {}
@@ -224,11 +223,11 @@ body {
     background-color: darkgray;
     border-radius: 5px;
     border: 1px solid #999;
-    min-width: 110px;
+    /*! min-width: 110px; */
     margin: 0px 5px 0px 0px;
-    padding-top: 2px;
+    /*! padding-top: 2px; */
-    padding-bottom: 2px;
+    /*! padding-bottom: 2px; */
-    max-height: 20px;
+    /*! max-height: 20px; */
 }
 
 .nav_search {
@@ -308,5 +307,13 @@ a.book_link {
 
 a.nav_link {
     text-decoration: none;
-    color: #fff;
+    color: #000;
+}
+.hidden{
+    display: none;
+}
+.vert-nav{
+    list-style: None;
+    padding: 0px;
+    margin: 0px 0px;
 }

src/interface/static/js/pyshelf_ux.js

@@ -30,9 +30,9 @@ $(document).ready(function(){
                     $(this).removeAttr("disabled");
             }
     });
-    $('#app').css("height", max_height);
+//    $('#app').css("height", max_height);
-    $('.nav_l').css("max-height", max_height);
+//    $('.nav_l').css("max-height", max_height);
-    $('div.shelf').css("max-height", max_height);
+//   $('div.shelf').css("max-height", max_height);
     $('.nav_link').on('mouseover', function (e){
         var popover_str = $(this).attr('alt');
         x = $(this).offset().left
@@ -51,4 +51,7 @@ $(document).ready(function(){
         $('.popover').css('top', y);
         $('.popover').css('display','none');
     });
+    $('#btn_collections').on('click', function (e){
+        $('.hidden.vert-nav.collections').toggle()
+    });
 })

src/interface/templates/index.html

@@ -19,32 +19,50 @@
 <body>
 	<input type="hidden" id="_set" name="_set" value="{{ Set }}" />
     <div id="app">
-        <div class="app_header">
-            <div class="app_hdr">
-                <h1 class="app_hdr shadow">pyShelf {{Version}}</h1>
-            </div>
-            <div class="nav_left_top">
-                <input class="nav_button prev_page" type="button" value="<< Prev Page" onclick="window.location.href = '/prev_page/{{ Set }}'">
-            </div>
-            <div class="nav_center_top">
-                <input class="nav_search" type="text" size="25" value=""><input class="nav_button search_submit" type="submit" value="Search">
-            </div>
-            <div class="nav_right_top">
-                <input class="nav_button next_page" type="button" value="Next Page >>" onclick="window.location.href = '/next_page/{{ Set }}'">
-            </div>
-        </div>
         <div class="app_body">
             <div class="nav_l">
                 <p class="popover"></p>
                 <ul id="vert-nav">
-                    <li class="vert-nav-item nav_l_hdr">Collections</li>
+                    <li class="vert-nav-item nav_l_hdr">
-                    {% for row in LeftNav %}
+                        <h1 class="app_hdr shadow">pyShelf {{Version}}</h1>
-                    <a href="{% url 'show_collection' _collection=row.link _colset=Set%}" class="nav_link" alt="{{row.link}}">
+                    </li>
-                        <li class="nav_l_{{row.class}}">
+                    <li class="vert-nav-item nav_l_hdr">
-                            {{ row.string }}
+                        <input class="nav_search" type="text" size="20" value="">
-                        </li>
+                    </li>
+                    <li class="vert-nav-item nav_l_hdr">
+                        <input class="nav_button prev_page" type="button" value="<<" onclick="window.location.href = '/prev_page/{{ Set }}'">
+                        <input class="nav_button search_submit" type="submit" value="Search">
+                        <input class="nav_button next_page" type="button" value=">>" onclick="window.location.href = '/next_page/{{ Set }}'">
+                    </li>
+                    <li class="vert-nav-item nav_l_hdr" id="btn_collections">Collections</li>
+                    <ul class="hidden vert-nav collections">
+                    {% for row in LeftNavCollections %}
+                        <a href="{% url 'show_collection' _collection=row.link _colset=Set%}" class="nav_link" alt="{{row.link}}">
+                            <li class="nav_l_{{row.class}}">
+                                {{ row.string }}
+                            </li>
                         </a>
                     {% endfor %}
+                    </ul>
+                    <ul class="vert-nav dynnav">
+                        {% if LeftNavMenu0 %}
+                            {% for row in LeftNavMenu0 %}
+                                <a href="{{ row.link }}"><li class="vert-nav-item nav_l_hdr">{{ row.title }}</li></a>
+                            {% endfor %}
+                        {% endif %}
+                    </ul>
+                    <li class="vert-nav-item nav_l_hdr" id="btn_irc">irc</li>
+                    <a href="irc://freenode.net/pyshelf" class="web_footer_link"><li class="vert-nav-item nav_l_hdr" id="btn_discord">discord</li></a>
+                    <li class="vert-nav-item nav_l_hdr" id="btn_github">github</li>
+                    <li class="vert-nav-item nav_l_hdr" id="btn_irc">irc</li>
+                    <li class="vert-nav-item nav_l_hdr" id="btn_python">
+                        <img src="/static/img/py.png" id="python_logo" />
+                    </li>
+                    <a href="https://www.gnu.org/licenses/gpl-3.0.txt" class="web_footer_link">
+                    <li class="vert-nav-item nav_l_hdr" id="btn_gpl">
+                        <img src="/static/img/gplv3-or-later.png" alt="GPLv3 or later" />
+                    </li>
+                    </a>
                 </ul>
             </div>
             <div class="shelf">
@@ -59,18 +77,6 @@
                 </div>
             </div>
         </div>
-        <div class="app_footer">
-            <div class="python_logo">
-                <img src="/static/img/py.png" id="python_logo" />
-            </div>
-            <div class="copyright">
-                <a href="https://www.gnu.org/licenses/gpl-3.0.txt" class="web_footer_link"><img src="/static/img/gplv3-or-later.png" alt="GPLv3 or later" /></a>
-            </div>
-            <div class="footer_contact">
-
-                <p>irc: <a href="irc://freenode.net/pyshelf" class="web_footer_link">#pyshelf</a> on freenode | discord: <a href="https://discord.gg/H9TbNJS" class="web_footer_link">discord.gg/H9TbNJS</a> | web: <a href=http://pyshelf.com class="web_footer_link" alt="pyshelf.com">http://pyshelf.com</a> | source: <a href="https://github.com/th3r00t/pyShelf" class="web_footer_link">github.com/th3r00t/pyShelf</a></p>
-            </div>
-        </div>
     </div>
 </body>
 

src/interface/templates/search.html

@@ -16,48 +16,44 @@
 </head>
 <body>
     <div id="app">
-        <div class="app_header" >
+        <input type="hidden" id="_set" name="_set" value="{{ Set }}" />
-        <div class="app_hdr">
-            <h1 class="app_hdr shadow">pyShelf {{Version}}</h1>
-        </div>
-        <div class="app_slogan">
-                <h3 class="app_slogan shadow">"An elegant tool... for a more civilized age."</h3>
-        </div>
-        <div class="app_subhdr">
-                <a class="discord-button" href="https://discord.gg/H9TbNJS" alt="https://discord.gg/H9TbNJS">
-                        <img src="/static/img/discord_logo_color.png" class="discord-button"/>
-                </a>
-                <!-- Place this tag where you want the button to render. -->
-                <a class="github-button" href="https://github.com/th3r00t/pyShelf/fork" data-color-scheme="no-preference: dark; light: light; dark: dark;" data-icon="octicon-repo-forked" data-size="large" aria-label="Fork th3r00t/pyShelf on GitHub">Fork</a>
-                <!-- Place this tag where you want the button to render. -->
-<a class="github-button" href="https://github.com/th3r00t/pyShelf/issues" data-color-scheme="no-preference: dark; light: light; dark: dark;" data-icon="octicon-issue-opened" data-size="large" aria-label="Issue th3r00t/pyShelf on GitHub">Issue</a>
-                <!--
-                <img src="/static/img/open-source-175x29.png" class="hdr_badge" /><br />
-                <img src="/static/img/gpl-125x28.png" class="hdr_badge" />
-                -->
-        </div>
-            <input type="hidden" id="_set" name="_set" value="{{ Set }}" />
-            <div class="nav_left_top">
-                    <input class="nav_button prev_page" type="button" value="<< Prev Page" onclick="window.location.href = '/search/{{ Query }}/{{ Set|add:"-1" }}'">
-            </div>
-            <div class="nav_center_top">
-                <input class="nav_search" type="text" size="25" value=""><input class="nav_button search_submit" type="submit" value="Search">
-            </div>
-            <div class="nav_right_top">
-                    <input class="nav_button next_page" type="button" value="Next Page >>" onclick="window.location.href = '/search/{{ Query }}/{{ Set|add:"1" }}'">
-            </div>
-        </div>
         <div class="app_body" >
             <div class="nav_l">
+                <p class="popover"></p>
                 <ul id="vert-nav">
-                    <li class="vert-nav-item nav_l_hdr">Collections</li>
+                    <li class="vert-nav-item nav_l_hdr">
-                    {% for row in LeftNav %}
+                        <h1 class="app_hdr shadow">pyShelf {{Version}}</h1>
-                    <a href="{% url 'show_collection' _collection=row.link _colset=Set%}" class="nav_link" alt="{{row.link}}">
+                    </li>
-                        <li class="nav_l_{{row.class}}">
+                    <li class="vert-nav-item nav_l_hdr">
-                            {{ row.string }}
+                        <input class="nav_search" type="text" size="20" value="">
-                        </li>
+                    </li>
+                    <li class="vert-nav-item nav_l_hdr">
+                        <input class="nav_button prev_page" type="button" value="<<" onclick="window.location.href = '/prev_page/{{ Set }}'">
+                        <input class="nav_button search_submit" type="submit" value="Search">
+                        <input class="nav_button next_page" type="button" value=">>" onclick="window.location.href = '/next_page/{{ Set }}'">
+                    </li>
+                    <li class="vert-nav-item nav_l_hdr" id="btn_collections">Collections</li>
+                    <ul class="hidden vert-nav collections">
+                    {% for row in LeftNavCollections %}
+                        <a href="{% url 'show_collection' _collection=row.link _colset=Set%}" class="nav_link" alt="{{row.link}}">
+                            <li class="nav_l_{{row.class}}">
+                                {{ row.string }}
+                            </li>
                         </a>
                     {% endfor %}
+                    </ul>
+                    <li class="vert-nav-item nav_l_hdr" id="btn_irc">irc</li>
+                    <a href="irc://freenode.net/pyshelf" class="web_footer_link"><li class="vert-nav-item nav_l_hdr" id="btn_discord">discord</li></a>
+                    <li class="vert-nav-item nav_l_hdr" id="btn_github">github</li>
+                    <li class="vert-nav-item nav_l_hdr" id="btn_irc">irc</li>
+                    <li class="vert-nav-item nav_l_hdr" id="btn_python">
+                        <img src="/static/img/py.png" id="python_logo" />
+                    </li>
+                    <a href="https://www.gnu.org/licenses/gpl-3.0.txt" class="web_footer_link">
+                    <li class="vert-nav-item nav_l_hdr" id="btn_gpl">
+                        <img src="/static/img/gplv3-or-later.png" alt="GPLv3 or later" />
+                    </li>
+                    </a>
                 </ul>
             </div>
                 <div class="shelf">
@@ -73,17 +69,6 @@
                 </div>
             </div>
         </div>
-        <div class="app_footer" >
-                    <div class="python_logo" >
-                        <img src="/static/img/py.png" id="python_logo" />
-                    </div>
-                    <div class="copyright">
-                            <a href="https://www.gnu.org/licenses/gpl-3.0.txt" class="web_footer_link"><img src="/static/img/gplv3-or-later.png" alt="GPLv3 or later" /></a>
-                    </div>
-                    <div class="footer_contact">
-                            <p>irc: <a href="irc://freenode.net/pyshelf" class="web_footer_link">#pyshelf</a> on freenode | discord: <a href="https://discord.gg/H9TbNJS" class="web_footer_link">discord.gg/H9TbNJS</a> | web: <a href=http://pyshelf.com class="web_footer_link" alt="pyshelf.com">http://pyshelf.com</a> | source: <a href="https://github.com/th3r00t/pyShelf" class="web_footer_link">github.com/th3r00t/pyShelf</a></p>
-                    </div>
-        </div>
     </div>
 </body>
 </html>

src/interface/views.py

@@ -9,7 +9,7 @@ from django.http import JsonResponse
 from django.shortcuts import HttpResponse, render  # render_to_response
 from django.utils.text import slugify
 
-from .models import Books, Collections
+from .models import Books, Collections, Navigation
 
 config = Config(Path("../"))
 
@@ -26,7 +26,8 @@ def index(request):
             "Books": book_set(20, _set),
             "Set": str(_set),
             "Version": config.VERSION,
-            "LeftNav": menu("collections"),
+            "LeftNavCollections": menu("collections"),
+            "LeftNavMenu0": menu("nav_l_0"),
         },
     )
 
@@ -190,7 +191,21 @@ def hr_name(book):
     return "{0}{1}".format(slugify(book.title), os.path.splitext(book.file_name)[1])
 
 
-def menu(which, _set=1):
+def format_list(list_in):
+    formated_list, formated_list_key, x = [], [], 0
+    for i in list_in:
+        if i.id not in formated_list_key:
+            if x % 2 == 0:
+                c = 0
+            else:
+                c = 1
+            if x <= 10:
+                x += 1
+            else:
+                x = 0
+
+
+def menu(which, _set=1, parent=None):
     if which == "collections":
         collection_list = Collections.objects.all()
         collections, collection_key, x = [], [], 0
@@ -217,3 +232,7 @@ def menu(which, _set=1):
                 )
                 collection_key.append(i.collection)
         return collections
+    elif which == "nav_lvl_0":
+        navigation_list = Navigation.objects.all()
+        breakpoint()
+        return navigation_list