remove js, finish index page

requirements.txt

@@ -2,3 +2,4 @@ requests
 flask
 peewee
 gunicorn
+arrow

xmrnodes/app.py

@@ -34,11 +34,12 @@ def index():
 
     nodes = Node.select().where(Node.available==True).order_by(
         Node.datetime_entered.desc()
-    ).paginate(page, itp)
+    )
-    total_pages = Node.select().count() / itp
+    paginated = nodes.paginate(page, itp)
+    total_pages = nodes.count() / itp
     return render_template(
         "index.html",
-        nodes=nodes,
+        nodes=paginated,
         page=page,
         total_pages=total_pages,
         form=form
@@ -119,7 +120,6 @@ def about():
 
 @app.errorhandler(404)
 def not_found(error):
-    flash("nothing there, brah")
     return redirect("/")
 
 if __name__ == "__main__":

xmrnodes/forms.py

@@ -4,4 +4,4 @@ from wtforms.validators import DataRequired
 
 
 class SubmitNode(FlaskForm):
-    node_url = StringField('Node URL:', validators=[DataRequired()])
+    node_url = StringField('', validators=[DataRequired()], render_kw={"placeholder": "Node URL (http://xxx.tld:18081)"})

xmrnodes/static/css/normalize.css

@@ -0,0 +1,349 @@
+/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
+
+/* Document
+   ========================================================================== */
+
+/**
+ * 1. Correct the line height in all browsers.
+ * 2. Prevent adjustments of font size after orientation changes in iOS.
+ */
+
+html {
+  line-height: 1.15; /* 1 */
+  -webkit-text-size-adjust: 100%; /* 2 */
+}
+
+/* Sections
+   ========================================================================== */
+
+/**
+ * Remove the margin in all browsers.
+ */
+
+body {
+  margin: 0;
+}
+
+/**
+ * Render the `main` element consistently in IE.
+ */
+
+main {
+  display: block;
+}
+
+/**
+ * Correct the font size and margin on `h1` elements within `section` and
+ * `article` contexts in Chrome, Firefox, and Safari.
+ */
+
+h1 {
+  font-size: 2em;
+  margin: 0.67em 0;
+}
+
+/* Grouping content
+   ========================================================================== */
+
+/**
+ * 1. Add the correct box sizing in Firefox.
+ * 2. Show the overflow in Edge and IE.
+ */
+
+hr {
+  box-sizing: content-box; /* 1 */
+  height: 0; /* 1 */
+  overflow: visible; /* 2 */
+}
+
+/**
+ * 1. Correct the inheritance and scaling of font size in all browsers.
+ * 2. Correct the odd `em` font sizing in all browsers.
+ */
+
+pre {
+  font-family: monospace, monospace; /* 1 */
+  font-size: 1em; /* 2 */
+}
+
+/* Text-level semantics
+   ========================================================================== */
+
+/**
+ * Remove the gray background on active links in IE 10.
+ */
+
+a {
+  background-color: transparent;
+}
+
+/**
+ * 1. Remove the bottom border in Chrome 57-
+ * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
+ */
+
+abbr[title] {
+  border-bottom: none; /* 1 */
+  text-decoration: underline; /* 2 */
+  text-decoration: underline dotted; /* 2 */
+}
+
+/**
+ * Add the correct font weight in Chrome, Edge, and Safari.
+ */
+
+b,
+strong {
+  font-weight: bolder;
+}
+
+/**
+ * 1. Correct the inheritance and scaling of font size in all browsers.
+ * 2. Correct the odd `em` font sizing in all browsers.
+ */
+
+code,
+kbd,
+samp {
+  font-family: monospace, monospace; /* 1 */
+  font-size: 1em; /* 2 */
+}
+
+/**
+ * Add the correct font size in all browsers.
+ */
+
+small {
+  font-size: 80%;
+}
+
+/**
+ * Prevent `sub` and `sup` elements from affecting the line height in
+ * all browsers.
+ */
+
+sub,
+sup {
+  font-size: 75%;
+  line-height: 0;
+  position: relative;
+  vertical-align: baseline;
+}
+
+sub {
+  bottom: -0.25em;
+}
+
+sup {
+  top: -0.5em;
+}
+
+/* Embedded content
+   ========================================================================== */
+
+/**
+ * Remove the border on images inside links in IE 10.
+ */
+
+img {
+  border-style: none;
+}
+
+/* Forms
+   ========================================================================== */
+
+/**
+ * 1. Change the font styles in all browsers.
+ * 2. Remove the margin in Firefox and Safari.
+ */
+
+button,
+input,
+optgroup,
+select,
+textarea {
+  font-family: inherit; /* 1 */
+  font-size: 100%; /* 1 */
+  line-height: 1.15; /* 1 */
+  margin: 0; /* 2 */
+}
+
+/**
+ * Show the overflow in IE.
+ * 1. Show the overflow in Edge.
+ */
+
+button,
+input { /* 1 */
+  overflow: visible;
+}
+
+/**
+ * Remove the inheritance of text transform in Edge, Firefox, and IE.
+ * 1. Remove the inheritance of text transform in Firefox.
+ */
+
+button,
+select { /* 1 */
+  text-transform: none;
+}
+
+/**
+ * Correct the inability to style clickable types in iOS and Safari.
+ */
+
+button,
+[type="button"],
+[type="reset"],
+[type="submit"] {
+  -webkit-appearance: button;
+}
+
+/**
+ * Remove the inner border and padding in Firefox.
+ */
+
+button::-moz-focus-inner,
+[type="button"]::-moz-focus-inner,
+[type="reset"]::-moz-focus-inner,
+[type="submit"]::-moz-focus-inner {
+  border-style: none;
+  padding: 0;
+}
+
+/**
+ * Restore the focus styles unset by the previous rule.
+ */
+
+button:-moz-focusring,
+[type="button"]:-moz-focusring,
+[type="reset"]:-moz-focusring,
+[type="submit"]:-moz-focusring {
+  outline: 1px dotted ButtonText;
+}
+
+/**
+ * Correct the padding in Firefox.
+ */
+
+fieldset {
+  padding: 0.35em 0.75em 0.625em;
+}
+
+/**
+ * 1. Correct the text wrapping in Edge and IE.
+ * 2. Correct the color inheritance from `fieldset` elements in IE.
+ * 3. Remove the padding so developers are not caught out when they zero out
+ *    `fieldset` elements in all browsers.
+ */
+
+legend {
+  box-sizing: border-box; /* 1 */
+  color: inherit; /* 2 */
+  display: table; /* 1 */
+  max-width: 100%; /* 1 */
+  padding: 0; /* 3 */
+  white-space: normal; /* 1 */
+}
+
+/**
+ * Add the correct vertical alignment in Chrome, Firefox, and Opera.
+ */
+
+progress {
+  vertical-align: baseline;
+}
+
+/**
+ * Remove the default vertical scrollbar in IE 10+.
+ */
+
+textarea {
+  overflow: auto;
+}
+
+/**
+ * 1. Add the correct box sizing in IE 10.
+ * 2. Remove the padding in IE 10.
+ */
+
+[type="checkbox"],
+[type="radio"] {
+  box-sizing: border-box; /* 1 */
+  padding: 0; /* 2 */
+}
+
+/**
+ * Correct the cursor style of increment and decrement buttons in Chrome.
+ */
+
+[type="number"]::-webkit-inner-spin-button,
+[type="number"]::-webkit-outer-spin-button {
+  height: auto;
+}
+
+/**
+ * 1. Correct the odd appearance in Chrome and Safari.
+ * 2. Correct the outline style in Safari.
+ */
+
+[type="search"] {
+  -webkit-appearance: textfield; /* 1 */
+  outline-offset: -2px; /* 2 */
+}
+
+/**
+ * Remove the inner padding in Chrome and Safari on macOS.
+ */
+
+[type="search"]::-webkit-search-decoration {
+  -webkit-appearance: none;
+}
+
+/**
+ * 1. Correct the inability to style clickable types in iOS and Safari.
+ * 2. Change font properties to `inherit` in Safari.
+ */
+
+::-webkit-file-upload-button {
+  -webkit-appearance: button; /* 1 */
+  font: inherit; /* 2 */
+}
+
+/* Interactive
+   ========================================================================== */
+
+/*
+ * Add the correct display in Edge, IE 10+, and Firefox.
+ */
+
+details {
+  display: block;
+}
+
+/*
+ * Add the correct display in all browsers.
+ */
+
+summary {
+  display: list-item;
+}
+
+/* Misc
+   ========================================================================== */
+
+/**
+ * Add the correct display in IE 10+.
+ */
+
+template {
+  display: none;
+}
+
+/**
+ * Add the correct display in IE 10.
+ */
+
+[hidden] {
+  display: none;
+}

xmrnodes/static/css/noty-relax.css

@@ -1,46 +0,0 @@
-.noty_theme__relax.noty_bar {
-  margin: 4px 0;
-  overflow: hidden;
-  border-radius: 2px;
-  position: relative; }
-  .noty_theme__relax.noty_bar .noty_body {
-    padding: 10px; }
-  .noty_theme__relax.noty_bar .noty_buttons {
-    border-top: 1px solid #e7e7e7;
-    padding: 5px 10px; }
-
-.noty_theme__relax.noty_type__alert,
-.noty_theme__relax.noty_type__notification {
-  background-color: #fff;
-  border: 1px solid #dedede;
-  color: #444; }
-
-.noty_theme__relax.noty_type__warning {
-  background-color: #FFEAA8;
-  border: 1px solid #FFC237;
-  color: #826200; }
-  .noty_theme__relax.noty_type__warning .noty_buttons {
-    border-color: #dfaa30; }
-
-.noty_theme__relax.noty_type__error {
-  background-color: #FF8181;
-  border: 1px solid #e25353;
-  color: #FFF; }
-  .noty_theme__relax.noty_type__error .noty_buttons {
-    border-color: darkred; }
-
-.noty_theme__relax.noty_type__info,
-.noty_theme__relax.noty_type__information {
-  background-color: #78C5E7;
-  border: 1px solid #3badd6;
-  color: #FFF; }
-  .noty_theme__relax.noty_type__info .noty_buttons,
-  .noty_theme__relax.noty_type__information .noty_buttons {
-    border-color: #0B90C4; }
-
-.noty_theme__relax.noty_type__success {
-  background-color: #BCF5BC;
-  border: 1px solid #7cdd77;
-  color: darkgreen; }
-  .noty_theme__relax.noty_type__success .noty_buttons {
-    border-color: #50C24E; }

xmrnodes/static/css/noty.css

@@ -1,222 +0,0 @@
-.noty_layout_mixin, #noty_layout__top, #noty_layout__topLeft, #noty_layout__topCenter, #noty_layout__topRight, #noty_layout__bottom, #noty_layout__bottomLeft, #noty_layout__bottomCenter, #noty_layout__bottomRight, #noty_layout__center, #noty_layout__centerLeft, #noty_layout__centerRight {
-  position: fixed;
-  margin: 0;
-  padding: 0;
-  z-index: 9999999;
-  -webkit-transform: translateZ(0) scale(1, 1);
-          transform: translateZ(0) scale(1, 1);
-  -webkit-backface-visibility: hidden;
-          backface-visibility: hidden;
-  -webkit-font-smoothing: subpixel-antialiased;
-  filter: blur(0);
-  -webkit-filter: blur(0);
-  max-width: 90%; }
-
-#noty_layout__top {
-  top: 0;
-  left: 5%;
-  width: 90%; }
-
-#noty_layout__topLeft {
-  top: 20px;
-  left: 20px;
-  width: 325px; }
-
-#noty_layout__topCenter {
-  top: 5%;
-  left: 50%;
-  width: 325px;
-  -webkit-transform: translate(-webkit-calc(-50% - .5px)) translateZ(0) scale(1, 1);
-          transform: translate(calc(-50% - .5px)) translateZ(0) scale(1, 1); }
-
-#noty_layout__topRight {
-  top: 20px;
-  right: 20px;
-  width: 325px; }
-
-#noty_layout__bottom {
-  bottom: 0;
-  left: 5%;
-  width: 90%; }
-
-#noty_layout__bottomLeft {
-  bottom: 20px;
-  left: 20px;
-  width: 325px; }
-
-#noty_layout__bottomCenter {
-  bottom: 5%;
-  left: 50%;
-  width: 325px;
-  -webkit-transform: translate(-webkit-calc(-50% - .5px)) translateZ(0) scale(1, 1);
-          transform: translate(calc(-50% - .5px)) translateZ(0) scale(1, 1); }
-
-#noty_layout__bottomRight {
-  bottom: 20px;
-  right: 20px;
-  width: 325px; }
-
-#noty_layout__center {
-  top: 50%;
-  left: 50%;
-  width: 325px;
-  -webkit-transform: translate(-webkit-calc(-50% - .5px), -webkit-calc(-50% - .5px)) translateZ(0) scale(1, 1);
-          transform: translate(calc(-50% - .5px), calc(-50% - .5px)) translateZ(0) scale(1, 1); }
-
-#noty_layout__centerLeft {
-  top: 50%;
-  left: 20px;
-  width: 325px;
-  -webkit-transform: translate(0, -webkit-calc(-50% - .5px)) translateZ(0) scale(1, 1);
-          transform: translate(0, calc(-50% - .5px)) translateZ(0) scale(1, 1); }
-
-#noty_layout__centerRight {
-  top: 50%;
-  right: 20px;
-  width: 325px;
-  -webkit-transform: translate(0, -webkit-calc(-50% - .5px)) translateZ(0) scale(1, 1);
-          transform: translate(0, calc(-50% - .5px)) translateZ(0) scale(1, 1); }
-
-.noty_progressbar {
-  display: none; }
-
-.noty_has_timeout.noty_has_progressbar .noty_progressbar {
-  display: block;
-  position: absolute;
-  left: 0;
-  bottom: 0;
-  height: 3px;
-  width: 100%;
-  background-color: #646464;
-  opacity: 0.2;
-  filter: alpha(opacity=10); }
-
-.noty_bar {
-  -webkit-backface-visibility: hidden;
-  -webkit-transform: translate(0, 0) translateZ(0) scale(1, 1);
-  -ms-transform: translate(0, 0) scale(1, 1);
-      transform: translate(0, 0) scale(1, 1);
-  -webkit-font-smoothing: subpixel-antialiased;
-  overflow: hidden; }
-
-.noty_effects_open {
-  opacity: 0;
-  -webkit-transform: translate(50%);
-      -ms-transform: translate(50%);
-          transform: translate(50%);
-  -webkit-animation: noty_anim_in 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);
-          animation: noty_anim_in 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);
-  -webkit-animation-fill-mode: forwards;
-          animation-fill-mode: forwards; }
-
-.noty_effects_close {
-  -webkit-animation: noty_anim_out 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);
-          animation: noty_anim_out 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);
-  -webkit-animation-fill-mode: forwards;
-          animation-fill-mode: forwards; }
-
-.noty_fix_effects_height {
-  -webkit-animation: noty_anim_height 75ms ease-out;
-          animation: noty_anim_height 75ms ease-out; }
-
-.noty_close_with_click {
-  cursor: pointer; }
-
-.noty_close_button {
-  position: absolute;
-  top: 2px;
-  right: 2px;
-  font-weight: bold;
-  width: 20px;
-  height: 20px;
-  text-align: center;
-  line-height: 20px;
-  background-color: rgba(0, 0, 0, 0.05);
-  border-radius: 2px;
-  cursor: pointer;
-  -webkit-transition: all .2s ease-out;
-  transition: all .2s ease-out; }
-
-.noty_close_button:hover {
-  background-color: rgba(0, 0, 0, 0.1); }
-
-.noty_modal {
-  position: fixed;
-  width: 100%;
-  height: 100%;
-  background-color: #000;
-  z-index: 10000;
-  opacity: .3;
-  left: 0;
-  top: 0; }
-
-.noty_modal.noty_modal_open {
-  opacity: 0;
-  -webkit-animation: noty_modal_in .3s ease-out;
-          animation: noty_modal_in .3s ease-out; }
-
-.noty_modal.noty_modal_close {
-  -webkit-animation: noty_modal_out .3s ease-out;
-          animation: noty_modal_out .3s ease-out;
-  -webkit-animation-fill-mode: forwards;
-          animation-fill-mode: forwards; }
-
-@-webkit-keyframes noty_modal_in {
-  100% {
-    opacity: .3; } }
-
-@keyframes noty_modal_in {
-  100% {
-    opacity: .3; } }
-
-@-webkit-keyframes noty_modal_out {
-  100% {
-    opacity: 0; } }
-
-@keyframes noty_modal_out {
-  100% {
-    opacity: 0; } }
-
-@keyframes noty_modal_out {
-  100% {
-    opacity: 0; } }
-
-@-webkit-keyframes noty_anim_in {
-  100% {
-    -webkit-transform: translate(0);
-            transform: translate(0);
-    opacity: 1; } }
-
-@keyframes noty_anim_in {
-  100% {
-    -webkit-transform: translate(0);
-            transform: translate(0);
-    opacity: 1; } }
-
-@-webkit-keyframes noty_anim_out {
-  100% {
-    -webkit-transform: translate(50%);
-            transform: translate(50%);
-    opacity: 0; } }
-
-@keyframes noty_anim_out {
-  100% {
-    -webkit-transform: translate(50%);
-            transform: translate(50%);
-    opacity: 0; } }
-
-@-webkit-keyframes noty_anim_height {
-  100% {
-    height: 0; } }
-
-@keyframes noty_anim_height {
-  100% {
-    height: 0; } }
-
-/*# sourceMappingURL=noty.css.map*/
-
-
-/* Custom */
-.noty_body {
-  text-align: center;
-}

xmrnodes/static/css/noty.css.map

@@ -1 +0,0 @@
-{"version":3,"sources":[],"names":[],"mappings":"","file":"noty.css","sourceRoot":""}

xmrnodes/static/css/style.css

@@ -0,0 +1,25 @@
+.center {
+  text-align: center;
+  margin: 0 auto;
+}
+
+.section {
+  margin-bottom: 1em;
+}
+
+.btn {
+  margin: .5em;
+}
+
+#footer {
+  padding-top: 4em;
+}
+
+input[type="text"] {
+  width: 50%;
+  text-align: center;
+}
+
+.flashes {
+  padding-top: 1em;
+}

xmrnodes/static/js/app.js

@@ -1,41 +0,0 @@
-$(function() {
-  $('#addnode').on('submit', function(e) {
-    e.preventDefault();
-    var data = $("#addnode :input").serializeArray();
-    addnode(data[0].value);
-  });
-});
-
-function addnode(url) {
-  let payload = {'url': url};
-  $.ajax({
-    type: 'POST',
-    url: '/add',
-    data: payload,
-  }).done(function(data, status) {
-    notify('info', 'Trying to connect to node...');
-    if (data.status == 'success') {
-      notify('success', 'Successful!')
-    } else {
-      notify('error', 'Failed')
-    }
-  }).fail(function(data) {
-    notify('error', 'Failed to add node; unable to fetch info.');
-  });
-  // $.post('/add', payload, function(result) {
-  //   $('#addnode')[0].reset();
-  //   notify('success', 'it worked!');
-  // }).fail(function(data) {
-  //   notify('error', 'Failed to add node; unable to fetch info.');
-  // });
-}
-
-function notify(level, msg) {
-  new Noty({
-    type: level,
-    theme: 'relax',
-    layout: 'topCenter',
-    text: msg,
-    timeout: 5000
-  }).show();
-}

xmrnodes/templates/base.html

@@ -23,9 +23,10 @@
      <meta name="msapplication-TileColor" content="#da532c">
      <meta name="keywords" content="wownero, monero, xmr, bitmonero, cryptocurrency">
 
-     <!-- <link href="/static/css/wow.css" rel="stylesheet"> -->
+     <link href="/static/css/normalize.css" rel="stylesheet">
-     <link href="/static/css/noty-relax.css" rel="stylesheet">
+     <link href="/static/css/pure.css" rel="stylesheet">
-     <link href="/static/css/noty.css" rel="stylesheet">
+     <link href="/static/css/pure-grids.css" rel="stylesheet">
+     <link href="/static/css/style.css" rel="stylesheet">
      <title>XMR Nodes</title>
  </head>
 
@@ -33,7 +34,7 @@
 
 {% with messages = get_flashed_messages() %}
   {% if messages %}
-    <ul class=flashes>
+    <ul class="flashes pure-u-1 center">
     {% for message in messages %}
       <li>{{ message }}</li>
     {% endfor %}
@@ -45,16 +46,11 @@
  {% block content %} {% endblock %}
 
  <!-- Footer -->
- <footer class="bg-dark footer">
+ <div id="footer" class="center">
-     <div class="container">
+   <a href="https://twitter.com/lza_menace" target="_blank">Holler at me</a>
-         <p class="m-0 text-center text-white">XMR Nodes 2020</p>
+   -
+   <a href="https://github.com/lalanza808/monero-node-lists" target="_blank">Source Code</a>
  </div>
- </footer>
-
- <!-- Scripts -->
- <script src="/static/js/jquery.min.js"></script>
- <script src="/static/js/noty.js"></script>
- <script src="/static/js/app.js"></script>
 
  </body>
  </html>

xmrnodes/templates/index.html

@@ -2,14 +2,36 @@
 
 {% block content %}
 
-<div class="container" style="text-align:center;">
+<div id="index" class="container">
 
-  <div class="title">
+  <div id="addnode" class="pure-g center section">
-    <h3>Add Node</h3>
+    <div class="title pure-u-1">
+      <h2>Add A Node</h2>
+    </div>
+    <form method="POST" action="{{ url_for('add') }}" class="pure-form pure-u-1">
+        {{ form.csrf_token }}
+        {% for f in form %}
+          {% if f.name != 'csrf_token' %}
+            <div class="form-group">
+              {{ f.label }}
+              {{ f }}
+            </div>
+          {% endif %}
+        {% endfor %}
+        <ul>
+        {% for field, errors in form.errors.items() %}
+            <li>{{ form[field].label }}: {{ ', '.join(errors) }}</li>
+        {% endfor %}
+        </ul>
+        <button type="submit" class="pure-button pure-button-primary">Submit</button>
+    </form>
   </div>
 
+  <div id="nodes" class="pure-u-1 center section">
+    <h2>Find a Node</h2>
     {% if nodes %}
-  <table>
+    <table class="pure-table pure-table-horizontal pure-table-striped center">
+      <thead>
         <tr>
           <th>URL</th>
           <th>Tor</th>
@@ -18,6 +40,8 @@
           <th>Is Monero</th>
           <th>Last Checked</th>
         </tr>
+      </thead>
+      <tbody>
         {% for node in nodes %}
         <tr>
           <td>{{ node.url }}</td>
@@ -28,36 +52,18 @@
           <td>{{ node.datetime_checked }}</td>
         </tr>
       {% endfor %}
+      </tbody>
     </table>
-  {% endif %}
-
-
-  <form method="POST" action="{{ url_for('add') }}">
-      {{ form.csrf_token }}
-      {% for f in form %}
-        {% if f.name != 'csrf_token' %}
-          <div class="form-group">
-            {{ f.label }}
-            {{ f }}
-          </div>
-        {% endif %}
-      {% endfor %}
-      <ul>
-      {% for field, errors in form.errors.items() %}
-          <li>{{ form[field].label }}: {{ ', '.join(errors) }}</li>
-      {% endfor %}
-    </ul>
-      <input type="submit" value="Send" class="btn btn-link btn-outline btn-xl">
-  </form>
-
-
     {% if page > 1 %}
-    <a href="/?page={{ page - 1 }}">Back</a>
+      <a href="/?page={{ page - 1 }}" class="pure-button btn">Back</a>
     {% endif %}
-
     {% if page < total_pages and total_pages > 0 %}
-    <a href="/?page={{ page + 1 }}">Next</a>
+      <a href="/?page={{ page + 1 }}" class="pure-button btn">Next</a>
     {% endif %}
+    {% else %}
+    <p>No nodes in the database yet...</p>
+    {% endif %}
+  </div>
 
 </div>