$(document).ready(function() {
|
function deleteNote() {
|
$(".delete-note").off('click').on('click', function(event) {
|
event.stopPropagation();
|
$(this).parents('.note-item').remove();
|
})
|
}
|
|
function favNote() {
|
$(".fav-note").off('click').on('click', function(event) {
|
event.stopPropagation();
|
$(this).parents('.note-item').toggleClass('note-fav');
|
})
|
}
|
|
function addLabelGroups() {
|
$('.tags-selector .label-group-item').off('click').on('click', function(event) {
|
event.preventDefault();
|
/* Act on the event */
|
var getclass = this.className;
|
var getSplitclass = getclass.split(' ')[0];
|
if ($(this).hasClass('label-personal')) {
|
$(this).parents('.note-item').removeClass('note-social');
|
$(this).parents('.note-item').removeClass('note-work');
|
$(this).parents('.note-item').removeClass('note-important');
|
$(this).parents('.note-item').toggleClass(getSplitclass);
|
} else if ($(this).hasClass('label-work')) {
|
$(this).parents('.note-item').removeClass('note-personal');
|
$(this).parents('.note-item').removeClass('note-social');
|
$(this).parents('.note-item').removeClass('note-important');
|
$(this).parents('.note-item').toggleClass(getSplitclass);
|
} else if ($(this).hasClass('label-social')) {
|
$(this).parents('.note-item').removeClass('note-personal');
|
$(this).parents('.note-item').removeClass('note-work');
|
$(this).parents('.note-item').removeClass('note-important');
|
$(this).parents('.note-item').toggleClass(getSplitclass);
|
} else if ($(this).hasClass('label-important')) {
|
$(this).parents('.note-item').removeClass('note-personal');
|
$(this).parents('.note-item').removeClass('note-social');
|
$(this).parents('.note-item').removeClass('note-work');
|
$(this).parents('.note-item').toggleClass(getSplitclass);
|
}
|
});
|
}
|
|
$('.hamburger').on('click', function(event) {
|
$('.app-note-container').find('.tab-title').toggleClass('note-menu-show')
|
$('.app-note-container').find('.app-note-overlay').toggleClass('app-note-overlay-show')
|
})
|
$('.app-note-overlay').on('click', function(e){
|
$(this).parents('.app-note-container').children('.tab-title').removeClass('note-menu-show')
|
$(this).removeClass('app-note-overlay-show')
|
})
|
$('.tab-title .nav-pills a.nav-link').on('click', function(event) {
|
$(this).parents('.app-note-container').find('.tab-title').removeClass('note-menu-show')
|
$(this).parents('.app-note-container').find('.app-note-overlay').removeClass('app-note-overlay-show')
|
})
|
|
var $btns = $('.list-actions').click(function() {
|
if (this.id == 'all-notes') {
|
var $el = $('.' + this.id).fadeIn();
|
$('#ct > div').not($el).hide();
|
} if (this.id == 'important') {
|
var $el = $('.' + this.id).fadeIn();
|
$('#ct > div').not($el).hide();
|
} else {
|
var $el = $('.' + this.id).fadeIn();
|
$('#ct > div').not($el).hide();
|
}
|
$btns.removeClass('active');
|
$(this).addClass('active');
|
})
|
|
$('#btn-add-notes').on('click', function(event) {
|
$('#notesMailModal').modal('show');
|
$('#btn-n-save').hide();
|
$('#btn-n-add').show();
|
})
|
|
// Button add
|
$("#btn-n-add").on('click', function(event) {
|
event.preventDefault();
|
/* Act on the event */
|
var today = new Date();
|
var dd = String(today.getDate()).padStart(2, '0');
|
var mm = String(today.getMonth() + 1).padStart(2, '0'); //January is 0!
|
var yyyy = today.getFullYear();
|
var today = mm + '/' + dd + '/' + yyyy;
|
|
var $_noteTitle = document.getElementById('n-title').value;
|
var $_noteDescription = document.getElementById('n-description').value;
|
|
$html = '<div class="note-item all-notes">' +
|
'<div class="note-inner-content">' +
|
'<div class="note-content">' +
|
'<p class="note-title" data-noteTitle="'+$_noteTitle+'">'+$_noteTitle+'</p>' +
|
'<p class="meta-time">'+today+'</p>' +
|
'<div class="note-description-content">' +
|
'<p class="note-description" data-noteDescription="'+$_noteDescription+'">'+$_noteDescription+'</p>' +
|
'</div>' +
|
'</div>' +
|
'<div class="note-action">' +
|
'<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-star fav-note"><polygon points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"></polygon></svg> ' +
|
'<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-trash-2 delete-note"><polyline points="3 6 5 6 21 6"></polyline><path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path><line x1="10" y1="11" x2="10" y2="17"></line><line x1="14" y1="11" x2="14" y2="17"></line></svg>' +
|
'</div>' +
|
'<div class="note-footer">' +
|
'<div class="tags-selector btn-group">' +
|
'<a class="nav-link dropdown-toggle d-icon label-group" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="true">' +
|
'<span>' +
|
'<div class="tags">' +
|
'<div class="g-dot-personal"></div>' +
|
'<div class="g-dot-work"></div>' +
|
'<div class="g-dot-social"></div>' +
|
'<div class="g-dot-important"></div>' +
|
'<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-more-vertical"><circle cx="12" cy="12" r="1"></circle><circle cx="12" cy="5" r="1"></circle><circle cx="12" cy="19" r="1"></circle></svg>' +
|
'</div>' +
|
'</span>' +
|
'</a>' +
|
'<div class="dropdown-menu dropdown-menu-right d-icon-menu">' +
|
'<a class="note-personal label-group-item label-personal dropdown-item position-relative g-dot-personal" href="javascript:void(0);"> Personal</a>' +
|
'<a class="note-work label-group-item label-work dropdown-item position-relative g-dot-work" href="javascript:void(0);"> Work</a>' +
|
'<a class="note-social label-group-item label-social dropdown-item position-relative g-dot-social" href="javascript:void(0);"> Social</a>' +
|
'<a class="note-important label-group-item label-important dropdown-item position-relative g-dot-important" href="javascript:void(0);"> Important</a>' +
|
'</div>' +
|
'</div>' +
|
'</div>' +
|
'</div>' +
|
'</div> ';
|
|
$("#ct").prepend($html);
|
$('#notesMailModal').modal('hide');
|
|
deleteNote();
|
favNote();
|
addLabelGroups();
|
});
|
|
$('#notesMailModal').on('hidden.bs.modal', function (event) {
|
event.preventDefault();
|
document.getElementById('n-title').value = '';
|
document.getElementById('n-description').value = '';
|
})
|
|
deleteNote();
|
favNote();
|
addLabelGroups();
|
})
|
|
// Validation Process
|
|
var $_getValidationField = document.getElementsByClassName('validation-text');
|
|
getNoteTitleInput = document.getElementById('n-title');
|
|
getNoteTitleInput.addEventListener('input', function() {
|
|
getNoteTitleInputValue = this.value;
|
|
if (getNoteTitleInputValue == "") {
|
$_getValidationField[0].innerHTML = 'Title Required';
|
$_getValidationField[0].style.display = 'block';
|
} else {
|
$_getValidationField[0].style.display = 'none';
|
}
|
})
|
|
getNoteDescriptionInput = document.getElementById('n-description');
|
|
getNoteDescriptionInput.addEventListener('input', function() {
|
|
getNoteDescriptionInputValue = this.value;
|
|
if (getNoteDescriptionInputValue == "") {
|
$_getValidationField[1].innerHTML = 'Description Required';
|
$_getValidationField[1].style.display = 'block';
|
} else {
|
$_getValidationField[1].style.display = 'none';
|
}
|
|
})
|
