tangent/memex
1
0
Fork 0
mirror of https://github.com/TangentFoxy/memex.git synced 2024-11-22 04:54:23 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Fixed masonry layout.

Browse Source
This commit is contained in:
kor 2018-07-23 05:44:46 +12:00
parent cf00b552e8
commit d2ca4abcb3
4 changed files with 20 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
docs/index.html
View File

@ -2,26 +2,24 @@
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<title>memex</title>
<link rel="stylesheet" href="asset/style.css"> <link rel="stylesheet" href="asset/style.css">
<link rel="stylesheet" href="asset/fontawesome/css/all.css"> <link rel="stylesheet" href="asset/fontawesome/css/all.css">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <!-- <meta name="viewport" content="width=device-width, initial-scale=1.0"> -->
<!-- <script src="asset/lib/imagesloaded.js"></script> --> <script src="logic/lib/imagesloaded.js"></script>
<!-- <script src="logic/lib/masonry.js"></script> --> <script src="logic/lib/masonry.js"></script>
<script src="logic/lib/runic.js"></script> <script src="logic/lib/runic.js"></script>
<script src="logic/lib/indental.js"></script> <script src="logic/lib/indental.js"></script>
<script src="content/data.ndtl"></script> <script src="content/data.ndtl"></script>
<script src="logic/wrap.js"></script> <script src="logic/wrap.js"></script>
<script src="logic/view.js"></script> <script src="logic/view.js"></script>
<script src="logic/main.js"></script> <script src="logic/main.js"></script>
<title>memex</title>
</head> </head>
<body> <body>
<div class="menu" id="menu"></div> <div class="menu" id="menu"></div>
<div class="container"> <div class="container" id="container">
<div class="grid" id="grid"></div> <div class="grid" id="grid"></div>
</div> </div>

0
docs/logic/lib/imagesloaded..js → docs/logic/lib/imagesloaded.js
View File

37
docs/logic/view.js
View File

@ -11,8 +11,7 @@ function View()
this.statsNumTypes = 10; this.statsNumTypes = 10;
this.doDoubleWide = false; this.doDoubleWide = false;
// SETTINGS this.useMasonry = true;
this.useMasonry = false;
this.divNamePre = 'item'; this.divNamePre = 'item';
this.showUpper = true; this.showUpper = true;
@ -36,22 +35,14 @@ function View()
if (this.useMasonry) if (this.useMasonry)
{ {
this.msnry = new Masonry('.grid', { this.msnry = new Masonry('.grid',
{
itemSelector: '.grid-item', itemSelector: '.grid-item',
columnWidth: 350, columnWidth: 350,
gutter: 20, gutter: 20,
fitWidth: true, fitWidth: true,
transitionDuration: 0, transitionDuration: 0,
}); });
///////////////////////////
// Fix squashed image divs
// var imgLoad = imagesLoaded('.grid');
// imgLoad.on( 'always', function (instance) { parent.msnry.layout(); } );
// // Above imgLoad on always msnry.layout() should work but occassionally doesn't in Chrome and NEVER does in Firefox.
// window.onload = function () { parent.msnry.layout(); }
// msnry.layout() called by window onload fixes things but not ideal.
///////////////////////////
} }
} }
@ -74,6 +65,10 @@ function View()
this.msnry.reloadItems(); this.msnry.reloadItems();
this.msnry.layout(); this.msnry.layout();
} }
var imgLoad = imagesLoaded( container );
// When all images finish: redo mansonry layout
imgLoad.on( 'always', function() { parent.msnry.layout(); } );
} }
this.buildEntry = function(db, key) this.buildEntry = function(db, key)
@ -217,10 +212,6 @@ function View()
entry += `</div>`; entry += `</div>`;
} }
// LOWER CONTENT START // LOWER CONTENT START
if (this.showLower) if (this.showLower)
{ {
@ -494,15 +485,15 @@ function View()
splitArr = domain.split('.'), splitArr = domain.split('.'),
arrLen = splitArr.length; arrLen = splitArr.length;
//extracting the root domain here // extracting the root domain here
//if there is a subdomain // if there is a subdomain
if (arrLen > 2) if (arrLen > 2)
{ {
domain = splitArr[arrLen - 2] + '.' + splitArr[arrLen - 1]; domain = splitArr[arrLen - 2] + '.' + splitArr[arrLen - 1];
//check to see if it's using a Country Code Top Level Domain (ccTLD) (i.e. ".me.uk") // check to see if it's using a Country Code Top Level Domain (ccTLD) (i.e. ".me.uk")
if (splitArr[arrLen - 2].length == 2 && splitArr[arrLen - 1].length == 2) if (splitArr[arrLen - 2].length == 2 && splitArr[arrLen - 1].length == 2)
{ {
//this is using a ccTLD // this is using a ccTLD
domain = splitArr[arrLen - 3] + '.' + domain; domain = splitArr[arrLen - 3] + '.' + domain;
} }
} }
@ -513,7 +504,7 @@ function View()
this.extractHostname = function(url) this.extractHostname = function(url)
{ {
var hostname; var hostname;
//find & remove protocol (http, ftp, etc.) and get hostname // find & remove protocol (http, ftp, etc.) and get hostname
if (url.indexOf("://") > -1) { if (url.indexOf("://") > -1) {
hostname = url.split('/')[2]; hostname = url.split('/')[2];
@ -522,9 +513,9 @@ function View()
hostname = url.split('/')[0]; hostname = url.split('/')[0];
} }
//find & remove port number // find & remove port number
hostname = hostname.split(':')[0]; hostname = hostname.split(':')[0];
//find & remove "?" // find & remove "?"
hostname = hostname.split('?')[0]; hostname = hostname.split('?')[0];
return hostname; return hostname;

2
main.js
View File

@ -50,7 +50,7 @@ app.on('ready', () =>
app.win = new BrowserWindow({ app.win = new BrowserWindow({
webPreferences: { webPreferences: {
nodeIntegration: false nodeIntegration: false
}, width: 950, height: 950, backgroundColor:"#000", minWidth: 587, minHeight: 540, frame:true, autoHideMenuBar: true, icon: __dirname + '/icon.ico'}) }, width: 950, height: 950, backgroundColor:"#ddd", minWidth: 587, minHeight: 540, frame:true, autoHideMenuBar: true, icon: __dirname + '/icon.ico'})
app.win.loadURL(`file://${__dirname}/docs/index.html`) app.win.loadURL(`file://${__dirname}/docs/index.html`)
// app.win.toggleDevTools(); // app.win.toggleDevTools();