Add edit UI

Move to keyed structure instead of list

Author: dgtlmoon

backend/backend.py

@@ -79,20 +79,36 @@ def _jinja2_filter_datetimestamp(timestamp, format="%Y-%m-%d %H:%M:%S"):
 def main_page():
     global messages
 
-    # Show messages but once.
-    # maybe if the change happened more than a few days ago.. add a class
+    # Sort by last_changed and add the uuid which is usually the key..
+    sorted_watches=[]
+    for uuid, watch in datastore.data['watching'].items():
+        watch['uuid']=uuid
+        sorted_watches.append(watch)
+
+    sorted_watches.sort(key=lambda x: x['last_changed'], reverse=True)
 
-    # Sort by last_changed
-    datastore.data['watching'].sort(key=lambda x: x['last_changed'], reverse=True)
-    output = render_template("watch-overview.html", watches=datastore.data['watching'], messages=messages)
+    output = render_template("watch-overview.html", watches=sorted_watches, messages=messages)
+
+    # Show messages but once.
     messages = []
     return output
 
 
+@app.route("/edit", methods=['GET'])
+def edit_page():
+    global messages
+
+    uuid = request.args.get('uuid')
+
+    output = render_template("edit.html", uuid=uuid, watch=datastore.data['watching'][uuid], messages=messages)
+    return output
+
+
 @app.route("/favicon.ico", methods=['GET'])
 def favicon():
     return send_from_directory("/app/static/images", filename="favicon.ico")
 
+
 @app.route("/static/<string:group>/<string:filename>", methods=['GET'])
 def static_content(group, filename):
     try:
@@ -112,38 +128,63 @@ def api_watch_add():
     return redirect(url_for('main_page'))
 
 
+@app.route("/api/delete", methods=['GET'])
+def api_delete():
+    global messages
+    uuid = request.args.get('uuid')
+    datastore.delete(uuid)
+    messages.append({'class': 'ok', 'message': 'Deleted.'})
+
+    return redirect(url_for('main_page'))
+
+
+@app.route("/api/update", methods=['POST'])
+def api_update():
+    global messages
+    import validators
+
+    uuid = request.args.get('uuid')
+
+    url = request.form.get('url').strip()
+    tag = request.form.get('tag').strip()
+
+    validators.url(url) #@todo switch to prop/attr/observer
+    datastore.data['watching'][uuid].update({'url': url,
+                                             'tag': tag})
+
+    #@todo switch to prop/attr/observer
+    datastore.sync_to_json()
+
+    messages.append({'class': 'ok', 'message': 'Updated.'})
+
+    return redirect(url_for('main_page'))
+
 @app.route("/api/checknow", methods=['GET'])
 def api_watch_checknow():
     global messages
 
     uuid = request.args.get('uuid')
 
-    # dict would be better, this is a simple safety catch.
-    for watch in datastore.data['watching']:
-        if watch['uuid'] == uuid:
-            # @todo cancel if already running?
-            running_update_threads[uuid] = fetch_site_status.perform_site_check(uuid=uuid,
-                                                                                datastore=datastore)
-            running_update_threads[uuid].start()
+    running_update_threads[uuid] = fetch_site_status.perform_site_check(uuid=uuid,
+                                                                        datastore=datastore)
+    running_update_threads[uuid].start()
 
     return redirect(url_for('main_page'))
 
 
 @app.route("/api/recheckall", methods=['GET'])
 def api_watch_recheckall():
-
     import fetch_site_status
 
     global running_update_threads
-    i=0
-    for watch in datastore.data['watching']:
-        i=i+1
+    i = 0
+    for uuid, watch in datastore.data['watching']:
+        i = i + 1
 
-        running_update_threads[watch['uuid']] = fetch_site_status.perform_site_check(uuid=watch['uuid'],
+        running_update_threads[watch['uuid']] = fetch_site_status.perform_site_check(uuid=uuid,
                                                                                      datastore=datastore)
         running_update_threads[watch['uuid']].start()
 
-
     return "{} rechecked of {} watches.".format(i, len(datastore.data['watching']))
 
 
@@ -152,9 +193,9 @@ def launch_checks():
     import fetch_site_status
     global running_update_threads
 
-    for watch in datastore.data['watching']:
+    for uuid,watch in datastore.data['watching'].items():
         if watch['last_checked'] <= time.time() - 3 * 60 * 60:
-            running_update_threads[watch['uuid']] = fetch_site_status.perform_site_check(uuid=watch['uuid'],
+            running_update_threads[watch['uuid']] = fetch_site_status.perform_site_check(uuid=uuid,
                                                                                          datastore=datastore)
             running_update_threads[watch['uuid']].start()
 

backend/fetch_site_status.py

@@ -87,6 +87,9 @@ def run(self):
             self.datastore.update_watch(self.uuid, 'last_error', str(e))
             print(str(e))
 
+        except requests.exceptions.MissingSchema:
+            print ("Skipping {} due to missing schema/bad url".format(self.uuid))
+
         # Usually from html2text level
         except UnicodeDecodeError as e:
             self.datastore.update_watch(self.uuid, 'last_error', str(e))

backend/static/css/styles.css

@@ -120,3 +120,40 @@ body:after, body:before {
   max-width: 400px;
   display: block;
 }
+
+.edit-form {
+   background: #fff;
+   padding: 2em;
+   border-radius: 5px;
+}
+.button-secondary {
+    color: white;
+    border-radius: 4px;
+    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
+}
+
+.button-success {
+    background: rgb(28, 184, 65);
+    /* this is a green */
+}
+
+.button-error {
+    background: rgb(202, 60, 60);
+    /* this is a maroon */
+}
+
+.button-warning {
+    background: rgb(223, 117, 20);
+    /* this is an orange */
+}
+
+.button-secondary {
+    background: rgb(66, 184, 221);
+    /* this is a light blue */
+}
+
+
+.button-cancel {
+    background: rgb(200, 200, 200);
+    /* this is a green */
+}

backend/store.py

@@ -1,5 +1,5 @@
 import json
-import uuid
+import uuid as uuid_builder
 import validators
 
 
@@ -9,6 +9,10 @@
 class ChangeDetectionStore:
 
     def __init__(self):
+        self.data = {
+            'watching': {}
+        }
+
 
         # Base definition for all watchers
         self.generic_definition = {
@@ -17,60 +21,44 @@ def __init__(self):
             'last_checked': 0,
             'last_changed': 0,
             'title': None,
-            'uuid': str(uuid.uuid4()),
+            'uuid': str(uuid_builder.uuid4()),
             'headers' : {}, # Extra headers to send
             'history' : {} # Dict of timestamp and output stripped filename
         }
 
         try:
             with open('/datastore/url-watches.json') as json_file:
-                self.data = json.load(json_file)
+
+                self.data.update(json.load(json_file))
+
                 # Reinitialise each `watching` with our generic_definition in the case that we add a new var in the future.
+                # @todo pretty sure theres a python we todo this with an abstracted(?) object!
                 i = 0
-                while i < len(self.data['watching']):
+                for uuid, watch in self.data['watching'].items():
                     _blank = self.generic_definition.copy()
-                    _blank.update(self.data['watching'][i])
-                    self.data['watching'][i] = _blank
-
-                    print("Watching:", self.data['watching'][i]['url'])
-                    i += 1
+                    _blank.update(watch)
+                    self.data['watching'].update({uuid: _blank})
+                    print("Watching:", uuid, _blank['url'])
 
         # First time ran, doesnt exist.
         except (FileNotFoundError, json.decoder.JSONDecodeError):
-            print("Resetting JSON store")
+            print("Creating JSON store")
 
-            self.data = {}
-            self.data['watching'] = []
-            self._init_blank_data()
-            self.sync_to_json()
+            self.add_watch(url='https://changedetection.io', tag='general')
+            self.add_watch(url='http://www.quotationspage.com/random.php', tag='test')
 
-    def _init_blank_data(self):
+    def update_watch(self, uuid, val, var):
 
-        # Test site
-        _blank = self.generic_definition.copy()
-        _blank.update({
-            'url': 'https://changedetection.io',
-            'tag': 'general',
-            'uuid': str(uuid.uuid4())
-        })
-        self.data['watching'].append(_blank)
+        self.data['watching'][uuid].update({val: var})
+        self.sync_to_json()
 
-        # Test site
-        _blank = self.generic_definition.copy()
-        _blank.update({
-            'url': 'http://www.quotationspage.com/random.php',
-            'tag': 'test',
-            'uuid': str(uuid.uuid4())
-        })
-        self.data['watching'].append(_blank)
 
-    def update_watch(self, uuid, val, var):
+
+    def delete(self, uuid):
         # Probably their should be dict...
-        for watch in self.data['watching']:
-            if watch['uuid'] == uuid:
-                watch[val] = var
-                # print("Updated..", val)
-                self.sync_to_json()
+        del(self.data['watching'][uuid])
+        self.sync_to_json()
+
 
     def url_exists(self, url):
 
@@ -83,13 +71,11 @@ def url_exists(self, url):
 
     def get_val(self, uuid, val):
         # Probably their should be dict...
-        for watch in self.data['watching']:
-            if watch['uuid'] == uuid:
-                return watch.get(val)
-
-        return None
+        return self.data['watching'][uuid].get(val)
 
     def add_watch(self, url, tag):
+
+        # @todo deal with exception
         validators.url(url)
 
         # @todo use a common generic version of this
@@ -98,12 +84,12 @@ def add_watch(self, url, tag):
         _blank.update({
             'url': url,
             'tag': tag,
-            'uuid': str(uuid.uuid4())
+            'uuid': str(uuid_builder.uuid4())
         })
-        self.data['watching'].append(_blank)
+
+        self.data['watching'].update({_blank['uuid']: _blank})
 
         self.sync_to_json()
-        # @todo throw custom exception
 
     def sync_to_json(self):
         with open('/datastore/url-watches.json', 'w') as json_file:

backend/templates/base.html

@@ -15,9 +15,14 @@
         <a class="pure-menu-heading" href=""><strong>Change</strong>Detection.io</a>
 
         <ul class="pure-menu-list">
-            <li class="pure-menu-item pure-menu-selected"><a class="github-link " href="https://github.com/dgtlmoon/changedetection.io"
-                                                             data-hotkey="g d" aria-label="Homepage "
-                                                             data-ga-click="Header, go to dashboard, icon:logo">
+
+            <li class="pure-menu-item">
+                <a href="/import"  class="pure-menu-link">IMPORT</a>
+            </li>
+            <li class="pure-menu-item">
+                <a href="/settings"  class="pure-menu-link">SETTINGS</a>
+            </li>
+            <li class="pure-menu-item"><a class="github-link" href="https://github.com/dgtlmoon/changedetection.io">
                 <svg class="octicon octicon-mark-github v-align-middle" height="32" viewBox="0 0 16 16" version="1.1"
                      width="32" aria-hidden="true">
                     <path fill-rule="evenodd"

backend/templates/edit.html

@@ -0,0 +1,40 @@
+{% extends 'base.html' %}
+
+{% block content %}
+<div class="edit-form">
+
+
+    <form class="pure-form pure-form-aligned" action="/api/update?uuid={{uuid}}" method="POST">
+        <fieldset>
+            <div class="pure-control-group">
+                <label for="url">URL</label>
+                <input type="url" id="url" required="" placeholder="https://..." name="url" value="{{ watch.url}}"
+                       size="50"/>
+                <span class="pure-form-message-inline">This is a required field.</span>
+            </div>
+            <div class="pure-control-group">
+                <label for="tag">Tag</label>
+                <input type="text" placeholder="tag" size="10" id="tag" name="tag" value="{{ watch.tag}}"/>
+            </div>
+
+            <div class="pure-controls">
+                <button type="submit" class="pure-button pure-button-primary">Submit</button>
+            </div>
+
+            <div class="pure-controls">
+
+
+                <a href="/" class="pure-button button-small button-cancel">Cancel</a>
+                <a href="/api/delete?uuid={{uuid}}"
+                   class="pure-button button-small button-error ">Delete</a>
+
+            </div>
+
+
+        </fieldset>
+    </form>
+
+
+</div>
+
+{% endblock %}

backend/templates/watch-overview.html

@@ -45,7 +45,7 @@
                 </td>
                 <td>{{watch.last_changed|format_timestamp_timeago}}</td>
                 <td><a href="/api/checknow?uuid={{ watch.uuid}}" class="pure-button button-small pure-button-primary">Recheck</a>
-                    <button type="submit" class="pure-button  button-small pure-button-primary">Delete</button>
+                    <a href="/edit?uuid={{ watch.uuid}}" class="pure-button button-small pure-button-primary">Edit</a>
                 </td>
             </tr>
             {% endfor %}