mirror of
https://github.com/apankrat/nullboard.git
synced 2025-07-29 01:10:27 +02:00
+ support for clickable links
This commit is contained in:
135
nullboard.html
135
nullboard.html
@@ -372,6 +372,34 @@
|
||||
white-space: pre-wrap;
|
||||
}
|
||||
|
||||
/***/
|
||||
.board .list .note .text a {
|
||||
color: inherit;
|
||||
cursor: default;
|
||||
transition: none;
|
||||
}
|
||||
|
||||
@keyframes whoomp {
|
||||
0% { color: inherit; }
|
||||
30% { color: #888; }
|
||||
100% { color: inherit; }
|
||||
}
|
||||
|
||||
.board .list .note .text a:hover {
|
||||
animation-name: whoomp;
|
||||
animation-duration: 700ms;
|
||||
}
|
||||
|
||||
.reveal .board .list .note .text a {
|
||||
color: #1489db;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.reveal .board .list .note .text a:hover {
|
||||
animation-name: none;
|
||||
}
|
||||
|
||||
/***/
|
||||
.board .list .note .edit {
|
||||
display: none;
|
||||
border: none;
|
||||
@@ -505,6 +533,10 @@
|
||||
0px 1px 3px #00000030;
|
||||
}
|
||||
|
||||
.dragster a {
|
||||
color: #000;
|
||||
}
|
||||
|
||||
.dragster.collapsed {
|
||||
overflow: hidden;
|
||||
line-height: 22px;
|
||||
@@ -811,6 +843,21 @@
|
||||
text-shadow: 0 0 4px #0008;
|
||||
}
|
||||
|
||||
.dark.reveal .board .list .note .text a {
|
||||
color: #fc0;
|
||||
}
|
||||
|
||||
@keyframes whoomp-dark {
|
||||
0% { color: inherit; }
|
||||
30% { color: #fff; }
|
||||
100% { color: inherit; }
|
||||
}
|
||||
|
||||
.dark .board .list .note .text a:hover {
|
||||
animation-name: whoomp-dark;
|
||||
}
|
||||
|
||||
|
||||
.dark .board .list .note.raw {
|
||||
background: transparent;
|
||||
box-shadow: none;
|
||||
@@ -857,6 +904,11 @@
|
||||
background: #2e3032;
|
||||
}
|
||||
|
||||
.dark .dragster a {
|
||||
color: #d6d6d6;
|
||||
}
|
||||
|
||||
|
||||
/***/
|
||||
.dark textarea,
|
||||
.dark input {
|
||||
@@ -1152,7 +1204,7 @@
|
||||
<script type="text/javascript">
|
||||
|
||||
//
|
||||
var nb_codeVersion = 20200219;
|
||||
var nb_codeVersion = 20200220;
|
||||
var nb_dataVersion = 20190412;
|
||||
|
||||
//
|
||||
@@ -1236,6 +1288,26 @@
|
||||
$item.html(htmlEncode(html));
|
||||
}
|
||||
|
||||
//
|
||||
function setNoteText($note, text)
|
||||
{
|
||||
$note.attr('_text', text);
|
||||
|
||||
text = htmlEncode(text);
|
||||
hmmm = /(https?:\/\/[^\s]+)/mg;
|
||||
|
||||
text = text.replace(hmmm, function(url){
|
||||
return '<a href="' + url + '" target=_blank>' + url + '</a>';
|
||||
});
|
||||
|
||||
$note.html(text);
|
||||
}
|
||||
|
||||
function getNoteText($note)
|
||||
{
|
||||
return $note.attr('_text');
|
||||
}
|
||||
|
||||
//
|
||||
function updatePageTitle()
|
||||
{
|
||||
@@ -1298,7 +1370,7 @@
|
||||
|
||||
list.notes.forEach(function(n){
|
||||
var $n = $ndiv.clone();
|
||||
setHtml( $n.find('.text'), n.text );
|
||||
setNoteText( $n.find('.text'), n.text );
|
||||
if (n.raw) $n.addClass('raw');
|
||||
if (n.min) $n.addClass('collapsed');
|
||||
$l_notes.append($n);
|
||||
@@ -1333,7 +1405,7 @@
|
||||
|
||||
$list.find('.note').each(function(){
|
||||
var $note = $(this)
|
||||
var n = l.addNote( getHtml($note.find('.text')) );
|
||||
var n = l.addNote( getNoteText($note.find('.text')) );
|
||||
n.raw = $note.hasClass('raw');
|
||||
n.min = $note.hasClass('collapsed');
|
||||
});
|
||||
@@ -1538,16 +1610,18 @@
|
||||
'over \u2261 to reveal the options.","raw":false,"min":false},{"text":"\u2022 X deletes the note.\\n\u2022' +
|
||||
' R changes how a note looks.\\n\u2022 _ collapses the note.","raw":false,"min":false},{"text":"This is a ' +
|
||||
'raw note.","raw":true,"min":false},{"text":"This is a collapsed note. Only its first line is visible. Useful f' +
|
||||
'or keeping lists compact.","raw":false,"min":true}]},{"title":"More things to try","notes":[{"text":"\u2022 ' +
|
||||
'Drag notes around to rearrange.\\n\u2022 Works between the lists too.","raw":false,"min":false},{"text":"\u2022' +
|
||||
' Click on a list name to edit.\\n\u2022 Enter to save, Esc to cancel.","raw":false,"min":false},{"text":"\u2022' +
|
||||
' Try adding a new list.\\n\u2022 Try deleting one. This _can_ be undone.","raw":false,"min":false},{"tex' +
|
||||
't":"\u2022 Same for the board name.","raw":false,"min":false},{"text":"Boards","raw":true,"min":false},{"tex' +
|
||||
't":"\u2022 Check out \u2261 at the top right.","raw":false,"min":false},{"text":"\u2022 Try adding a n' +
|
||||
'ew board.\\n\u2022 Try switching between the boards.","raw":false,"min":false},{"text":"\u2022 Try deletin' +
|
||||
'g a board. Unlike deleting a\\n list this _cannot_ be undone.","raw":false,"min":false},{"text":"\u2022 ' +
|
||||
' Export the board (save to a file, as json)\\n\u2022 Import the board (load from a save)","raw":false,"' +
|
||||
'min":false}]}]}';
|
||||
'or keeping lists compact.","raw":false,"min":true}, {"text":"Links","raw":true,"min":false}, {"text":"Links pu' +
|
||||
'lse on hover and can be opened via the right-click menu - https://nullboard.io","raw":false,"min":false}, {"tex' +
|
||||
't":"Pressing CapsLock highlights all links and makes them left-clickable.","raw":false,"min":false}]},{"title"' +
|
||||
':"More things to try","notes":[{"text":"\u2022 Drag notes around to rearrange.\\n\u2022 Works between the ' +
|
||||
'lists too.","raw":false,"min":false},{"text":"\u2022 Click on a list name to edit.\\n\u2022 Enter to save,' +
|
||||
' Esc to cancel.","raw":false,"min":false},{"text":"\u2022 Try adding a new list.\\n\u2022 Try deleting one' +
|
||||
'. This _can_ be undone.","raw":false,"min":false},{"text":"\u2022 Same for the board name.","raw":false,"m' +
|
||||
'in":false},{"text":"Boards","raw":true,"min":false},{"text":"\u2022 Check out \u2261 at the top right.",' +
|
||||
'"raw":false,"min":false},{"text":"\u2022 Try adding a new board.\\n\u2022 Try switching between the boards' +
|
||||
'.","raw":false,"min":false},{"text":"\u2022 Try deleting a board. Unlike deleting a\\n list this _canno' +
|
||||
't_ be undone.","raw":false,"min":false},{"text":"\u2022 Export the board (save to a file, as json)\\n' +
|
||||
'\u2022 Import the board (load from a save)","raw":false,"min":false}]}]}';
|
||||
|
||||
var demo = parseBoard(blob);
|
||||
|
||||
@@ -1576,7 +1650,7 @@
|
||||
$note[0]._collapsed = $note.hasClass('collapsed');
|
||||
$note.removeClass('collapsed');
|
||||
|
||||
$edit.val( getHtml($text) );
|
||||
$edit.val( getNoteText($text) );
|
||||
$edit.width( $text.width() );
|
||||
$edit.height( $text.height() );
|
||||
$note.addClass('editing');
|
||||
@@ -1597,7 +1671,7 @@
|
||||
//
|
||||
var $text = $item.find('.text');
|
||||
var text_now = $edit.val().trimRight();
|
||||
var text_was = getHtml( $text );
|
||||
var text_was = getNoteText( $text );
|
||||
|
||||
//
|
||||
var brand_new = $item.hasClass('brand-new');
|
||||
@@ -1614,7 +1688,7 @@
|
||||
else
|
||||
if (text_now != text_was || brand_new)
|
||||
{
|
||||
setHtml( $text, text_now );
|
||||
setNoteText( $text, text_now );
|
||||
|
||||
saveBoard();
|
||||
updatePageTitle();
|
||||
@@ -2267,10 +2341,29 @@
|
||||
var drag = new Drag();
|
||||
|
||||
//
|
||||
function setRevealState(ev)
|
||||
{
|
||||
var raw = ev.originalEvent;
|
||||
var caps = raw.getModifierState && raw.getModifierState( 'CapsLock' );
|
||||
|
||||
if (caps) $('body').addClass('reveal');
|
||||
else $('body').removeClass('reveal');
|
||||
}
|
||||
|
||||
$(window).live('blur', function(){
|
||||
$('body').removeClass('reveal');
|
||||
});
|
||||
|
||||
$(document).live('keydown', function(ev){
|
||||
setRevealState(ev);
|
||||
});
|
||||
|
||||
$(document).live('keyup', function(ev){
|
||||
|
||||
var raw = ev.originalEvent;
|
||||
|
||||
setRevealState(ev);
|
||||
|
||||
if (ev.target.nodeName == 'TEXTAREA' ||
|
||||
ev.target.nodeName == 'INPUT')
|
||||
return;
|
||||
@@ -2303,6 +2396,15 @@
|
||||
return false;
|
||||
});
|
||||
|
||||
$('.board .note .text a').live('click', function(ev){
|
||||
|
||||
if (! $('body').hasClass('reveal'))
|
||||
return true;
|
||||
|
||||
ev.stopPropagation();
|
||||
return true;
|
||||
});
|
||||
|
||||
//
|
||||
function handleTab(ev)
|
||||
{
|
||||
@@ -2489,6 +2591,7 @@
|
||||
});
|
||||
|
||||
$(document).on('mousemove', function(ev){
|
||||
setRevealState(ev);
|
||||
drag.onMouseMove(ev);
|
||||
});
|
||||
|
||||
|
Reference in New Issue
Block a user