Skip to content
This repository has been archived by the owner on Sep 4, 2023. It is now read-only.

Commit

Permalink
Handle mark all read
Browse files Browse the repository at this point in the history
  • Loading branch information
@jfoucher
jfoucher committed Feb 26, 2019
1 parent 3d9476b commit 8deaa28
Show file tree
Hide file tree
Showing 3 changed files with 54 additions and 55 deletions.
35 changes: 27 additions & 8 deletions assets/js/app.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -39,6 +39,22 @@ require('../scss/app.scss');
})
})
});

$('.mark-read').on('click', (ev) => {
const btn = $(ev.currentTarget);
$(".mailbox-messages input[type='checkbox']:checked").each((i, item) => {
const $item = $(item);
const curTr = $item.parents('tr');
if (!curTr.hasClass('read')) {
$.ajax({
url: $item.parents('tr').data('markread'),
method: 'put'
}).then((res) => {
$item.parents('tr').addClass('read');
})
}
})
});
let to = null;
$('body').on('click', '.mailbox-messages table tbody > tr', (ev) => {
const tr = $(ev.currentTarget);
Expand All @@ -49,14 +65,17 @@ require('../scss/app.scss');
if (to) {
clearTimeout(to);
}
to = setTimeout(() => {
$.ajax({
url: tr.data('markread'),
method: 'put'
}).then((res) => {
tr.addClass('read');
});
}, 2000);
if (!tr.hasClass('read')) {
to = setTimeout(() => {
$.ajax({
url: tr.data('markread'),
method: 'put'
}).then((res) => {
tr.addClass('read');
});
}, 2000);
}


$("body").addClass('sidebar-collapse').trigger('collapsed.pushMenu');
$('.email-display').addClass('col-md-8').css('display', 'flex').find('.box-title').html(tr.data('title'));
Expand Down
54 changes: 7 additions & 47 deletions templates/home/index.html.twig
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,11 +6,11 @@
{% block page_subtitle %}{{ 'index_page_subtitle'|trans() }}{% endblock %}
{% block page_content %}

<div class="row" style="display:flex;">
<div class="row" style="display:flex; height: 100%">

<!-- /.col -->
<div class="col-md-12 email-list">
<div class="box box-primary">
<div class="col-md-12 email-list" style="height: 100%">
<div class="box box-primary" style="height: 100%">
<div class="box-header with-border">
<h3 class="box-title">{{ 'inbox'|trans() }}</h3>

Expand All @@ -26,27 +26,7 @@
</div>
<!-- /.box-header -->
<div class="box-body no-padding">
<div class="mailbox-controls">
<!-- Check all button -->
<button type="button" class="btn btn-default btn-sm checkbox-toggle"><i class="fa fa-square-o"></i>
</button>
<div class="btn-group">
<button type="button" class="btn btn-default btn-sm trash"><i class="fa fa-trash-o"></i></button>
<button type="button" class="btn btn-default btn-sm"><i class="fa fa-reply"></i></button>
<button type="button" class="btn btn-default btn-sm"><i class="fa fa-share"></i></button>
</div>
<!-- /.btn-group -->
<button type="button" class="btn btn-default btn-sm"><i class="fa fa-refresh"></i></button>
<div class="pull-right">
1-50/200
<div class="btn-group">
<button type="button" class="btn btn-default btn-sm"><i class="fa fa-chevron-left"></i></button>
<button type="button" class="btn btn-default btn-sm"><i class="fa fa-chevron-right"></i></button>
</div>
<!-- /.btn-group -->
</div>
<!-- /.pull-right -->
</div>
{% include 'partials/mailbox-controls.html.twig' %}
<div class="table-responsive mailbox-messages">
<table class="table table-hover">
<thead>
Expand Down Expand Up @@ -94,29 +74,9 @@
<!-- /.mail-box-messages -->
</div>
<!-- /.box-body -->
<div class="box-footer no-padding">
<div class="mailbox-controls">
<!-- Check all button -->
<button type="button" class="btn btn-default btn-sm checkbox-toggle"><i class="fa fa-square-o"></i>
</button>
<div class="btn-group">
<button type="button" class="trash btn btn-default btn-sm"><i class="fa fa-trash-o"></i></button>
<button type="button" class="btn btn-default btn-sm"><i class="fa fa-reply"></i></button>
<button type="button" class="btn btn-default btn-sm"><i class="fa fa-share"></i></button>
</div>
<!-- /.btn-group -->
<button type="button" class="btn btn-default btn-sm"><i class="fa fa-refresh"></i></button>
<div class="pull-right">
1-50/200
<div class="btn-group">
<button type="button" class="btn btn-default btn-sm"><i class="fa fa-chevron-left"></i></button>
<button type="button" class="btn btn-default btn-sm"><i class="fa fa-chevron-right"></i></button>
</div>
<!-- /.btn-group -->
</div>
<!-- /.pull-right -->
</div>
</div>
{#<div class="box-footer no-padding">#}
{#{% include 'partials/mailbox-controls.html.twig' %}#}
{#</div>#}
</div>
<!-- /. box -->
</div>
Expand Down
20 changes: 20 additions & 0 deletions templates/partials/mailbox-controls.html.twig
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
<div class="mailbox-controls">
<!-- Check all button -->
<button type="button" class="btn btn-default btn-sm checkbox-toggle"><i class="fa fa-square-o"></i>
</button>
<div class="btn-group">
<button type="button" class="btn btn-default btn-sm trash"><i class="fa fa-trash-o"></i> {{ 'Delete'|trans() }}</button>
<button type="button" class="btn btn-default btn-sm mark-read"><i class="fa fa-envelope-open-o"></i> {{ 'Mark read'|trans() }}</button>
</div>
<!-- /.btn-group -->
<button type="button" class="btn btn-default btn-sm"><i class="fa fa-refresh"></i></button>
{#<div class="pull-right">#}
{#1-50/200#}
{#<div class="btn-group">#}
{#<button type="button" class="btn btn-default btn-sm"><i class="fa fa-chevron-left"></i></button>#}
{#<button type="button" class="btn btn-default btn-sm"><i class="fa fa-chevron-right"></i></button>#}
{#</div>#}
{#<!-- /.btn-group -->#}
{#</div>#}
<!-- /.pull-right -->
</div>

0 comments on commit 8deaa28

Please sign in to comment.