mirror_html/nullboard
1
0
Fork 0
mirror of https://github.com/apankrat/nullboard.git synced 2025-08-05 04:37:46 +02:00
Code Issues Projects Releases Wiki Activity

+ update notification, assorted minor tweaks

Browse Source
This commit is contained in:
Alex Pankratov
2021-04-10 14:12:32 +02:00
parent c870b7e315
commit a1b319d6f6
5 changed files with 94 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
README.md
View File

@@ -46,7 +46,7 @@ Longer notes can be collapsed to show just the first line, for even more compact
![Collapsed notes](images/nullboard-collapsed-notes.gif) ![Collapsed notes](images/nullboard-collapsed-notes.gif)
The font is [Barlow](https://tribby.com/fonts/barlow/) - it's both narrow *and* still very legible. Absolutely fantastic design! The default font is [Barlow](https://tribby.com/fonts/barlow/) - it's both narrow *and* still very legible. Absolutely fantastic design!
![Barlow speciment](images/barlow-specimen.png) ![Barlow speciment](images/barlow-specimen.png)
@@ -66,9 +66,13 @@ Lists can be moved around as well, though not as flashy as notes:
![List swapping](images/nullboard-list-swap.gif) ![List swapping](images/nullboard-list-swap.gif)
The color theme can be inversed and the font size can be increased: The font can be changed; its size and line height can be adjusted:
![Theme and zoom](images/nullboard-theme-and-zoom.gif) ![Theme and zoom](images/nullboard-ui-preferences.gif)
The color theme can be inverted:
![Dark theme](images/nullboard-dark-theme.gif)
Also: Also:

0
extras/MavenPro-regular.woff → extras/MavenPro-Regular.woff
View File

BIN
images/nullboard-dark-theme.gif Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 31 KiB

BIN
images/nullboard-ui-preferences.gif Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 4.8 MiB

98
nullboard.html
View File

@@ -668,8 +668,8 @@
left: 9px; left: 9px;
line-height: calc(19 / 11); line-height: calc(19 / 11);
padding: 6px 12px; padding: 6px 12px;
opacity: 0.6;
z-index: 3; z-index: 3;
opacity: 0.6;
background: #f8f9fb; background: #f8f9fb;
} }
@@ -682,6 +682,13 @@
opacity: 1.0; opacity: 1.0;
} }
.logo .alert {
display: none;
font-style: normal;
margin-left: 5px;
color: #d20;
}
.logo .bulk { .logo .bulk {
overflow: hidden; overflow: hidden;
height: 0; height: 0;
@@ -695,21 +702,38 @@
opacity: 1; opacity: 1;
} }
.logo a { .logo a.site,
.logo .bulk a {
color: #000; color: #000;
display: block;
} }
.logo a:hover { .logo .bulk a:hover {
color: #1489db; color: #1489db;
} }
.logo .bulk a {
display: block;
}
.logo .bulk a:before { .logo .bulk a:before {
display: inline-block; display: inline-block;
content: '-'; content: '-';
width: 11px; width: 11px;
} }
/***/
.logo.updated {
opacity: 1;
}
.logo.updated .alert {
display: inline-block;
}
.logo.updated .bulk .view-changes {
color: #d20;
}
/***/ /***/
.config { .config {
position: absolute; position: absolute;
@@ -827,6 +851,7 @@
} }
/***/ /***/
.config .bulk .section .title { .config .bulk .section .title {
text-align: center; text-align: center;
width: 0; width: 0;
@@ -878,6 +903,7 @@
/***/ /***/
.config .bulk .ui-prefs .f-prefs table { .config .bulk .ui-prefs .f-prefs table {
width: 10px; /* mobile safari */
padding: 0; padding: 0;
margin: 0; margin: 0;
border-collapse: collapse; border-collapse: collapse;
@@ -1277,11 +1303,13 @@
</head> </head>
<body> <body>
<div class=logo> <div class="logo">
<a href=https://nullboard.io>Nullboard</a> <a class=site href=https://nullboard.io>Nullboard</a>
<i class=alert></i>
<div class=bulk> <div class=bulk>
<a href=# class=view-about>About</a> <a href=# class=view-about>About</a>
<a href=# class=view-license>License</a> <a href=# class=view-license>License</a>
<a href=https://nullboard.io/changes target=_blank class=view-changes>Changes</a>
<a href=https://nullboard.io/github target=_blank>Github</a> <a href=https://nullboard.io/github target=_blank>Github</a>
<a href=https://nullboard.io/twitter target=_blank>Twitter</a> <a href=https://nullboard.io/twitter target=_blank>Twitter</a>
</div> </div>
@@ -1417,12 +1445,16 @@
function AppConfig() function AppConfig()
{ {
this.format = NB.confVersion; this.format = NB.confVersion;
this.verLast = null; // last used codeVersion
this.verSeen = null; // latest codeVersion they saw the changelog for
this.maxUndo = 50; // board revisions to keep this.maxUndo = 50; // board revisions to keep
this.fontName = null; // font-family this.fontName = null; // font-family
this.fontSize = null; // font-size this.fontSize = null; // font-size
this.lineHeight = null; // line-height this.lineHeight = null; // line-height
this.listWidth = null; // list-width this.listWidth = null; // list-width
this.theme = null; // default or 'dark' this.theme = null; // default or 'dark'
this.board = null; // active board this.board = null; // active board
} }
@@ -1459,6 +1491,18 @@
return this.conf; return this.conf;
} }
setVerLast(ver)
{
this.conf.verLast = ver || NB.codeVersion;
return this.setJson('config', this.conf);
}
setVerSeen(ver)
{
this.conf.verSeen = ver || NB.codeVersion;
return this.setJson('config', this.conf);
}
setActiveBoard(board_id) setActiveBoard(board_id)
{ {
var meta = board_id ? this.boardIndex.get(board_id) : true; var meta = board_id ? this.boardIndex.get(board_id) : true;
@@ -1745,8 +1789,10 @@
} }
else else
{ {
this.conf.verLast = 20210327;
this.conf.verSeen = 20200220; // 20200429;
this.conf.theme = this.getItem('theme'); this.conf.theme = this.getItem('theme');
this.conf.board = this.getItem('last_board');
if (this.getItem('fsize') == 'z1') if (this.getItem('fsize') == 'z1')
{ {
@@ -1759,6 +1805,8 @@
this.conf = null; this.conf = null;
return false; return false;
} }
this.conf.board = this.getItem('last_board');
} }
this.boardIndex = new Map(); this.boardIndex = new Map();
@@ -2902,6 +2950,23 @@
if (! empty) $index.show(); if (! empty) $index.show();
} }
function setWhatsNew()
{
var conf = NB.storage.getConfig();
if (conf.verSeen < NB.codeVersion)
{
$('.logo').addClass('updated');
$('.logo .alert').html("(updated)");
}
var $link = $('.logo .view-changes');
var link = $link.attr('href') + '/?have=' + NB.codeVersion;
if (conf.verSeen) link += '&seen=' + conf.verSeen;
if (conf.verLast) link += '&last=' + conf.verLast;
$link.attr('href', link);
}
/* /*
* generic utils * generic utils
*/ */
@@ -3300,8 +3365,8 @@
function onFontLoaded(f, ok) function onFontLoaded(f, ok)
{ {
var f_name = f.family.substr(3,f.family.length-4); var m = f.family.match(/["']?f-([^"']*)/);
var f_name = m ? m[1] : ''; /* ios safari will set 'family' to 'weight' on failure ! */
if (! ok) if (! ok)
{ {
console.log( `! Failed to load ${f.family} ${f.weight}` ); console.log( `! Failed to load ${f.family} ${f.weight}` );
@@ -3878,6 +3943,13 @@
return false; return false;
}); });
$('.view-changes').click(function(){
if (! $('.logo').hasClass('updated'))
return;
NB.storage.setVerSeen();
$('.logo').removeClass('updated');
});
$(window).resize(adjustLayout); $(window).resize(adjustLayout);
$('body').on('dragstart', function(){ return false; }); $('body').on('dragstart', function(){ return false; });
@@ -3887,7 +3959,7 @@
*/ */
var NB = var NB =
{ {
codeVersion: 20210407, codeVersion: 20210410,
blobVersion: 20190412, // board blob format in Storage blobVersion: 20190412, // board blob format in Storage
board: null, board: null,
}; };
@@ -3926,12 +3998,16 @@
$('html').addClass('theme-' + conf.theme); $('html').addClass('theme-' + conf.theme);
if (conf.board) if (conf.board)
openBoard(conf.board) openBoard(conf.board);
adjustLayout(); adjustLayout();
updateBoardIndex(); updateBoardIndex();
setWhatsNew();
NB.storage.setVerLast();
// //
if (! NB.board && ! $('.config .load-board').length) if (! NB.board && ! $('.config .load-board').length)
NB.board = createDemoBoard(); NB.board = createDemoBoard();