You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
135 lines
4.6 KiB
135 lines
4.6 KiB
{% extends "base.html" %} |
|
{% block script %} |
|
<script> |
|
var new_tag; |
|
|
|
function isURL(str) { |
|
try { |
|
new URL(str) |
|
return true; |
|
} catch(e) { |
|
return false; |
|
} |
|
} |
|
|
|
function run() { |
|
journalmarks_loadkey().catch(function() { |
|
deleteKey(); |
|
window.location.href = '{{ url_for('journalmarks.login') }}'; |
|
}); |
|
|
|
document.getElementById('create').addEventListener('click', function() { |
|
var url = document.getElementById('url').value; |
|
if(isURL(url)) { |
|
journalmarks_encrypturl(url).then(function (encurl) { |
|
return post_object('{{ url_for('journalmarks.create') }}', {content: encurl}); |
|
}).then(function(tag) { |
|
new_tag = tag; |
|
console.log('ok', tag); |
|
document.getElementById('welcome').style.display = 'none'; |
|
document.getElementById('new-journalmark').style.display = 'block'; |
|
document.getElementById('new-journalmark-link').innerText = window.location.protocol + '//' + window.location.hostname + '/' + tag; |
|
document.getElementById('new-journalmark-link').href = '/' + tag; |
|
}); |
|
} else if(url.match(/^[a-z0-9]{4}$/)) { |
|
window.location.href = '/' + url; |
|
} else { |
|
document.getElementById('url').value = ''; |
|
} |
|
}); |
|
|
|
document.getElementById('add-description').addEventListener('click', function() { |
|
var url = document.getElementById('url').value; |
|
var description = document.getElementById('description').value; |
|
if(isURL(url) && (description.length > 0)) { |
|
journalmarks_encrypturl(url, description).then(function (encurl) { |
|
console.log({tag: new_tag, content: encurl}); |
|
return post_object('{{ url_for('journalmarks.update') }}', {tag: new_tag, content: encurl}); |
|
}).then(function() { |
|
document.getElementById('add-description-form').style.display = 'none'; |
|
document.getElementById('description-added').style.display = 'block'; |
|
console.log('ok'); |
|
}).catch(function(error) { |
|
console.log('could not modify journalmark', error); |
|
}); |
|
} |
|
}); |
|
|
|
document.getElementById('url').addEventListener('keyup', function(e) { |
|
if(e.keyCode == 13) |
|
document.getElementById('create').click(); |
|
}); |
|
} |
|
|
|
if (document.readyState!='loading') run(); |
|
else if (document.addEventListener) document.addEventListener('DOMContentLoaded', run); |
|
else document.attachEvent('onreadystatechange', function(){ |
|
if (document.readyState=='complete') run(); |
|
}); |
|
</script> |
|
<style> |
|
#new-journalmark { |
|
display: none; |
|
} |
|
#new-journalmark, #new-journalmark p { |
|
margin-top: 2em; |
|
text-align: center; |
|
} |
|
|
|
#new-journalmark-link { |
|
display: block; |
|
margin-top: 0.5em; |
|
margin-bottom: 0.5em; |
|
font-size: 2em; |
|
text-shadow: 1px 1px 1px lightgrey; |
|
} |
|
#description-added { |
|
display: none; |
|
} |
|
</style> |
|
{% endblock %} |
|
{% block body %} |
|
<div id="welcome"> |
|
<h1>Welcome!</h1> |
|
<p>You can now create a new Journalmark by simply pasting a URL into the text field. To access an existing Journalmark, enter its tag code. There's also a listing of all your Journalmarks on the <a href="{{ url_for('journalmarks.overview') }}">overview page</a>. Finally, you can also <a href="{{ url_for('journalmarks.logout') }}">logout</a> again. |
|
</p> |
|
|
|
<div id="action-form" class="pure-form pure-g"> |
|
<div class="pure-u-3-4"> |
|
<input id="url" type="text" class="pure-input-1" placeholder="URL or Journalmark tag"> |
|
</div> |
|
<div class="pure-u-1-4"> |
|
<button id="create" class="pure-button pure-button-primary pure-input-1">Go</button> |
|
</div> |
|
</div> |
|
</div> |
|
|
|
<div id="new-journalmark"> |
|
<h1>Journalmark created!</h1> |
|
Yay! You can access your new Journalmark at:<br> |
|
|
|
<a id="new-journalmark-link" href=""></a><br> |
|
|
|
<div id="add-description-form" class="pure-form pure-g"> |
|
<div class="pure-u-1"> |
|
<legend> |
|
Should you want to add a descriptive text to be displayed on the overview page, you can do so now: |
|
</legend> |
|
</div> |
|
<div class="pure-u-3-4"> |
|
<input id="description" type="text" class="pure-input-1" placeholder="Description"> |
|
</div> |
|
<div class="pure-u-1-4"> |
|
<button id="add-description" class="pure-button pure-button-primary pure-input-1">Add</button> |
|
</div> |
|
</div> |
|
|
|
<p id="description-added"> |
|
Description added. |
|
</p> |
|
|
|
<p> |
|
<a href="{{ url_for('journalmarks.index') }}">Continue to welcome page</a> |
|
</p> |
|
</div> |
|
{% endblock %}
|
|
|