NotePostApp/www/js/home.js

/*
 * This Source Code Form is subject to the terms of the Mozilla Public
 * 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/.
 */


$(".view-main").on("ptr:refresh", ".ptr-content", function () {
    loadCards(function () {
        app.ptr.done();
    });
});

function loadCards(callback) {
    // Do it twice as a workaround for the stupid sync issue
    NOTES.sync(function () {
        NOTES.sync(function (notes) {
            for (i in window.shuffleInstance.items) {
                window.shuffleInstance.remove(window.shuffleInstance.items[i]);
            }
            $(".notecard-col").remove();
            for (n in notes) {
                var note = notes[n];
                $("#notecards-bin").append('<div class="col-100 tablet-50 desktop-33 notecard-col" id="notecard-col-' + note.noteid + '" data-favorite="' + (note.favorite ? "1" : "0") + '">'
                        + '<div class="card notecard" id="notecard-' + note.noteid + '" data-id="' + note.noteid + '" data-favorite="' + (note.favorite ? "1" : "0") + '" data-bg="' + note.color + '" data-fg="' + note.textcolor + '" style="background-color: #' + note.color + '; color: #' + note.textcolor + ';">'
                        + '<div class="editbtn">'
                        + '<i class="material-icons">edit</i>'
                        + '</div>'
                        + '<div class="menubtn">'
                        + '<i class="material-icons">more_vert</i>'
                        + '</div>'
                        + '<div class="card-content card-content-padding"><div class="btnswrapthing"></div>' + note.html + '</div>'
                        + '</div>'
                        + '</div>');
            }
            var noteElements = document.getElementsByClassName("notecard-col");
            window.shuffleInstance.add(noteElements);
            window.shuffleInstance.sort({
                reverse: true,
                by: function (el) {
                    return el.getAttribute("data-favorite");
                }
            });
            if (typeof callback == 'function') {
                callback();
            }
        }, function () {
            restartApplication();
        });
    }, function () {
        restartApplication();
    });
}

function editNote(id) {
    var note = NOTES.get(id);
    router.navigate("/editnote", {
        context: {
            noteid: id,
            content: note.content,
            notetitle: note.title,
        }
    });
    console.log("Editing " + id);
}

function favoriteNote(id) {

}

function makeList(id) {

}

function deleteNote(id) {
    app.dialog.confirm('Are you sure?', 'Delete Note', function () {
        NOTES.del(id, function () {
            window.shuffleInstance.remove(document.getElementById("notecard-" + id));
            loadCards();
        });
    });
}

function colorNote(id) {
    $("#colorpicker").data("noteid", id);
    var colorpicker = app.popup.create({
        el: $("#colorpicker")
    });
    colorpicker.open();
}

$("#app").on("click", ".edit-note-btn", function () {
    editNote($(this).data("note"));
    app.popover.close();
});

$("#app").on("click", ".color-note-btn", function () {
    colorNote($(this).data("note"));
    app.popover.close();
});

$("#app").on("click", ".favorite-note-btn", function () {
    favoriteNote($(this).data("note"));
    app.popover.close();
});

$("#app").on("click", ".listify-note-btn", function () {
    makeList($(this).data("note"));
    app.popover.close();
});

$("#app").on("click", ".delete-note-btn", function () {
    deleteNote($(this).data("note"));
    app.popover.close();
});

$("#app").on("click", "#colorpicker .colorpicker-color", function () {
    var color = $(this).data("color");
    var noteid = $("#colorpicker").data("noteid");
    var note = NOTES.get(noteid);
    app.popup.close();
    note.color = color;
    // Set them to null, they'll be fixed in fix()
    note.modified = null;
    note.textcolor = null;
    note2 = NOTES.fix(note);
    NOTES.set(note2);
    $("#notecard-" + noteid).data("bg", note2.color);
    $("#notecard-" + noteid).data("fg", note2.textcolor);
    $("#notecard-" + noteid).attr("data-bg", note2.color);
    $("#notecard-" + noteid).attr("data-fg", note2.textcolor); // For CSS starbg
    $("#notecard-" + noteid).css("background-color", "#" + note2.color);
    $("#notecard-" + noteid).css("color", "#" + note2.textcolor);
});

function openNoteActionMenu(notecard) {
    var noteid = notecard.data("id");
    if (window.innerWidth < 768) {
        var actionsheet = app.actions.create({
            buttons: [
                {
                    text: "Edit",
                    bold: true,
                    icon: '<i class="fas fa-edit fa-fw"></i>',
                    onClick: function () {
                        editNote(noteid);
                    }
                },
                {
                    text: "Color",
                    icon: '<i class="fas fa-palette fa-fw"></i>',
                    onClick: function () {
                        colorNote(noteid);
                    }
                },

//                {
//                    text: "Favorite",
//                    icon: '<i class="fas fa-star fa-fw"></i>',
//                    onClick: function () {
//                        favoriteNote(noteid);
//                    }
//                },
//                {
//                    text: "Make a List",
//                    icon: '<i class="fas fa-tasks fa-fw"></i>',
//                    onClick: function () {
//                        makeList(noteid);
//                    }
//                },
                {
                    text: "Delete",
                    icon: '<i class="fas fa-trash fa-fw"></i>',
                    onClick: function () {
                        deleteNote(noteid);
                    }
                }
            ]
        });

        actionsheet.open();
        return false;
    } else {
        var contextPopover = app.popover.create({
            targetEl: notecard.children(".menubtn"),
            content: '<div class="popover">' +
                    '<div class="popover-inner">' +
                    '<div class="list">' +
                    '<ul>' +
                    '<li><a class="list-button item-link edit-note-btn" data-note="' + noteid + '"><i class="fas fa-edit fa-fw"></i> Edit</a></li>' +
                    '<li><a class="list-button item-link color-note-btn" data-note="' + noteid + '"><i class="fas fa-palette fa-fw"></i> Color</a></li>' +
                    //'<li><a class="list-button item-link favorite-note-btn" data-note="' + noteid + '"><i class="fas fa-star fa-fw"></i> Favorite</a></li>' +
                    //'<li><a class="list-button item-link listify-note-btn" data-note="' + noteid + '"><i class="fas fa-tasks fa-fw"></i> Make a List</a></li>' +
                    '<li><a class="list-button item-link delete-note-btn" data-note="' + noteid + '"><i class="fas fa-trash fa-fw"></i> Delete</a></li>' +
                    '</ul>' +
                    '</div>' +
                    '</div>' +
                    '</div>'
        });
        contextPopover.open();
    }
    return false;
}

$(".view-main").on("click", ".notecard .menubtn", function () {
    return openNoteActionMenu($(this).parent());
});

$(".view-main").on("click", ".notecard .editbtn", function () {
    editNote($(this).parent().data("id"));
});

$(".view-main").on("contextmenu", ".notecard", function () {
    return openNoteActionMenu($(this));
});