From 258b6163df21117929bac27b2eac033b74ec5821 Mon Sep 17 00:00:00 2001
From: Skylar Ittner <admin@netsyms.com>
Date: Sat, 24 Nov 2018 15:50:32 -0700
Subject: [PATCH] Use masonry layout for notes

---
 .gitmodules       | 5 ++++-
 pages.php         | 1 +
 pages/home.php    | 8 +++++---
 static/Shuffle    | 1 +
 static/js/home.js | 7 ++++++-
 5 files changed, 17 insertions(+), 5 deletions(-)
 create mode 160000 static/Shuffle

diff --git a/.gitmodules b/.gitmodules
index 72740a4..eb730f7 100644
--- a/.gitmodules
+++ b/.gitmodules
@@ -3,4 +3,7 @@
 	url = https://source.netsyms.com/Netsyms/Material-Color
 [submodule "static/easy-markdown-editor"]
 	path = static/easy-markdown-editor
-	url = https://source.netsyms.com/Netsyms/easy-markdown-editor.git
\ No newline at end of file
+	url = https://source.netsyms.com/Netsyms/easy-markdown-editor.git
+[submodule "static/Shuffle"]
+	path = static/Shuffle
+	url = https://source.netsyms.com/Mirrors/Vestride_Shuffle.git
diff --git a/pages.php b/pages.php
index f7eedf6..d68a467 100644
--- a/pages.php
+++ b/pages.php
@@ -11,6 +11,7 @@ define("PAGES", [
         "navbar" => true,
         "icon" => "far fa-sticky-note",
         "scripts" => [
+            "static/Shuffle/dist/shuffle.min.js",
             "static/js/home.js"
         ]
     ],
diff --git a/pages/home.php b/pages/home.php
index 29cf0e3..67fbda4 100644
--- a/pages/home.php
+++ b/pages/home.php
@@ -3,7 +3,7 @@
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 
-$noteids = $database->select('notes', 'noteid', ['ownerid' => $_SESSION['uid']]);
+$noteids = $database->select('notes', 'noteid', ['ownerid' => $_SESSION['uid'], 'ORDER' => ['favorite' => "DESC"]]);
 
 $notes = [];
 
@@ -93,12 +93,12 @@ foreach ($colors as $c) {
     <a href="app.php?page=editnote" class="btn btn-success"><i class="fas fa-plus"></i> <?php $Strings->get("New note"); ?></a>
 </div>
 
-<div class="row">
+<div class="row" id="grid">
 
     <?php
     foreach ($notes as $note) {
         ?>
-        <div class="col-12 col-sm-6 col-md-6 col-lg-4">
+        <div class="grid__brick col-12 col-sm-6 col-md-6 col-lg-4">
             <div class="card notecard mb-3" data-color="<?php echo $note->getColor(); ?>" id="notecard_<?php echo $note->getID(); ?>" data-note="<?php echo $note->getID(); ?>">
                 <div class="card-body">
                     <div class="float-right">
@@ -131,4 +131,6 @@ foreach ($colors as $c) {
     }
     ?>
 
+    <div class="col-1 sizer-element"></div>
+
 </div>
\ No newline at end of file
diff --git a/static/Shuffle b/static/Shuffle
new file mode 160000
index 0000000..a4d99b9
--- /dev/null
+++ b/static/Shuffle
@@ -0,0 +1 @@
+Subproject commit a4d99b9af924a6f5ed4bbc030161d8273d460c3f
diff --git a/static/js/home.js b/static/js/home.js
index 1042ad8..b04691a 100644
--- a/static/js/home.js
+++ b/static/js/home.js
@@ -36,4 +36,9 @@ $(".color-btn").click(function () {
     $("#colormodal").modal();
 });
 
-$('[data-toggle="tooltip"]').tooltip();
\ No newline at end of file
+$('[data-toggle="tooltip"]').tooltip();
+
+window.shuffleInstance = new window.Shuffle(document.getElementById('grid'), {
+    itemSelector: '.grid__brick',
+    sizer: '.sizer-element',
+});