{% extends 'base.html.twig' %}{% block title %} OceanExpert - A Directory of Marine and Freshwater Professionals{% endblock %}{% block stylesheets %} <link rel="stylesheet" type="text/css" href="{{ asset('css/font-awesome.min.css') }}" xmlns="http://www.w3.org/1999/html" /> <link rel="stylesheet" type="text/css" href="{{ asset('css/ionicons.min.css') }}" /> <link rel="stylesheet" type="text/css" href="{{ asset('css/square/blue.css') }}" /> <link rel="stylesheet" type="text/css" href="{{ asset('css/bootstrap.min.css') }}" /> <link rel="stylesheet" type="text/css" href="{{ asset('css/select2.min.css') }}" /> <link rel="stylesheet" type="text/css" href="{{ asset('css/select2-bootstrap.css') }}" /> <link rel="stylesheet" type="text/css" href="{{ asset('css/AdminLTE.min.css') }}" /> <link rel="stylesheet" type="text/css" href="{{ asset('css/tipped.css') }}" /> <link rel="stylesheet" type="text/css" href="{{ asset('css/navbar-login.css') }}" /> <link rel="stylesheet" type="text/css" href="{{ asset('css/bootstrap3-wysihtml5.min.css') }}" /> <link rel="stylesheet" type="text/css" href="{{ asset('css/jquery-ui.min.css') }}" /> <link rel="stylesheet" type="text/css" href="{{ asset('css/checkbox.css') }}" /> <link rel="stylesheet" type="text/css" href="{{ asset('css/profile.css') }}" /> <link rel="stylesheet" type="text/css" href="{{ asset('css/style.css') }}" /> <link rel="stylesheet" type="text/css" href="{{ asset('css/bootstrap-datepicker.min.css') }}" /> <link rel="stylesheet" type="text/css" href="{{ asset('css/nestable.modified.css') }}" /> <link rel="stylesheet" type="text/css" href="{{ asset('css/select.dataTables.min.css') }}" /> <link rel="stylesheet" type="text/css" href="{{ asset('css/dataTables.bootstrap.min.css') }}" /> <link rel="stylesheet" type="text/css" href="{{ asset('css/events.css') }}" /> <link rel="stylesheet" type="text/css" href="{{ asset('css/bootstrap-dialog.min.css') }}"/> <link rel="stylesheet" type="text/css" href="{{ asset('css/dropzone.css') }}" /> <link rel="stylesheet" type="text/css" href="{{ asset('css/tipped.css') }}" /> <style media="screen"> </style>{% endblock %}{% block body %} {% include 'navbarlogin.html.twig' %} <!-- JSON-LD will be used for SEO and OIH --> <script type="application/ld+json"> {{ data.OIHData | raw }} </script> <div class="container-fluid"> <section class="content"> <div class="row"> <div class="col-md-3"> <!-- Profile Image --> <div class="box box-primary"> <div class="box-body box-profile"> <div class="text-center"> <i class="fa fa-calendar fa-4x" aria-hidden="true"></i> <h2 class="event-title"> {% if data.event.details.title is defined %} {{ data.event.details.title }} {% endif %} {% if data.event.details.shorttitle is defined %} <br /> <small>{{ data.event.details.shorttitle }}</small> {% endif %} </h2> {% if data.event.type.eventtypeName is defined %} <h4><span class="label label-primary">{{ data.event.type.eventtypeName }}</span></h4> {% endif %} {% if data.event.details.startOn is defined and data.event.details.endOn is defined %} <h3 class="profile-username"> {% if data.event.details.startOn|date("m") != data.event.details.endOn|date("m") %} {% if data.event.details.startOn|date("Y") != data.event.details.endOn|date("Y") %} {{ data.event.details.startOn|date("d F Y") ~ ' - ' ~ data.event.details.endOn|date("d F Y") }} {% else %} {{ data.event.details.startOn|date("d F") ~ ' - ' ~ data.event.details.endOn|date("d F Y") }} {% endif %} {% elseif data.event.details.startOn == data.event.details.endOn %} {{ data.event.details.startOn | date("d F Y") }} {% else %} {{ data.event.details.startOn | date("d") ~ ' - ' ~ data.event.details.endOn | date("d F Y") }} {% endif %} </h3> {% endif %} {% if data.user is defined and data.user.canEditEvent == 1 %} <p class="lead text-center print"> {% if app.user is defined and is_granted('ROLE_GLOBAL_EDITOR') %} {% if data.event.details.status == 0 %} <button class="btn btn-success eventAction" data-status="1"> <i class="fa fa-check fa-fw" aria-hidden="true"></i> Activate </button> {% elseif data.event.details.status == 1 %} <button class="btn btn-danger eventAction" data-status="0"> <i class="fa fa-ban fa-fw" aria-hidden="true"></i> Deactivate </button> {% elseif data.event.details.status == 2 %} <button class="btn btn-warning eventAction" data-status="2"> <i class="fa fa-times fa-fw" aria-hidden="true"></i> Delete </button> {% elseif data.event.details.status == 3 %} <button class="btn btn-success eventAction" data-status="0"> <i class="fa fa-check fa-fw" aria-hidden="true"></i> Undelete </button> {% endif %} {% endif %} <a href="{{ path('edit_event',{'idEvent': data.event.details.idEvent}) }}" class="btn btn-primary"> <i class="fa fa-pencil fa-fw" aria-hidden="true"></i> Edit Event </a> </p> {% endif %} {% if data.error is defined and data.error|length > 0 %} <p class="btn-danger text-center "> <i class="fa fa-warning" aria-hidden="true"></i> {{ data.error }} </p> {% endif %} </div> </div> <!-- /.box-body --> </div> <!-- /.box --> <!-- About Me Box --> <div class="box box-primary"> <div class="box-body"> <strong><i class="fa fa-map-marker fa-fw"></i> Location</strong> <p class="text-muted"> <address> {% if data.event.details.idCountry == "0" and data.event.details.useInstAddr == "0" %} no location/online event {% elseif data.event.details.address is defined and data.event.details.address | trim | length > 0 %} {{ data.event.details.address | raw }}<br /> {% endif %} </address> <hr /> <strong> <i class="fa fa-users fa-fw"></i> Organiser(s) & Staff </strong> <div class="left-text"> {% if data.event.people.organisers is defined and data.event.people.organisers | length > 0 %} <div class="staff-type">Organiser</div> <ul class="staff-list"> {% for organiser in data.event.people.organisers %} <li> <a href="{{ path('view_profile', {'user': organiser.id}) }}"> {{ organiser.title ~ ' ' ~ organiser.fname ~ ' ' ~ organiser.sname | upper }} </a> </li> {% endfor %} </ul> {% endif %} {% if data.event.people.staff is defined and data.event.people.staff | length > 0 %} <div class="staff-type">Staff</div> <ul class="staff-list"> {% for staff in data.event.people.staff %} <li><a href="{{ path('view_profile', {'user': staff.id}) }}">{{ staff.title ~ ' ' ~ staff.fname ~ ' ' ~ staff.sname | upper }}</a></li> {% endfor %} </ul> {% endif %} </div> <hr> <strong><i class="fa fa-hand-o-up fa-fw" aria-hidden="true"></i> Participation</strong> {% if data.event.details.isOpen == 0 %} {% elseif data.event.details.isOpen == 1 %} <p class="left-text">Open attendance.</p> {% elseif data.event.details.isOpen == 2 %} <p class="left-text">By invitation only.</p> {% elseif data.event.details.isOpen == 3 %} <p class="left-text">Attendance by application.</p> {% endif %} </div> <!-- /.box-body --> </div> <!-- /.box --> </div> <!-- /.col --> <div class="col-md-9"> <div class="nav-tabs-custom"> <ul class="nav nav-tabs"> <li class="active"> <a href="#overview" data-toggle="tab" aria-expanded="false"> Overview </a> </li> {% if data.event.agenda is defined and data.event.agenda is not null %} <li class=""> <a href="#agenda" data-toggle="tab" aria-expanded="true"> Agenda </a> </li> {% endif %} {% if data.event.report | length + data.event.eventPresentations | length + data.event.agendaDocuments | length + data.event.backgroundDocs | length + data.event.otherDocs | length >0 %} <li class=""> <a href="#documents" data-toggle="tab" aria-expanded="false"> Documents </a> </li> {% endif %} {% if data.event.people.participants | length > 0 %} <li class=""> <a href="#participants" data-toggle="tab" aria-expanded="false"> Participants </a> </li> {% endif %} </ul> <div class="tab-content"> <div class="tab-pane active" id="overview"> <div class="box-header with-border"> <span class="event-heading"> {% if data.event.details.title is defined %} {{ data.event.details.title }} {% endif %} </span> {% if data.event.details.regOnline == 1 %} {# see : #561 % if "now"|date('Y-m-d') < data.event.details.startOn|date('Y-m-d') % #} {% if "now"|date('Y-m-d') < data.event.details.endOn|date('Y-m-d') %} <div class="register-event"> <a href="{{ path('register_event',{idEvent:data.event.details.idEvent }) }}" > Register to participate in this event </a> {% if not is_granted('ROLE_USER') %} (you must <a href="/login"> log in </a>, with an activated account, first!) {% endif %} </div> {% endif %} {% endif %} </div> {% if data.event.eventImage != null %} <div class="box-header with-border"> <img src="{{ asset(data.event.eventImage.path ~ data.event.eventImage.filename) }}" class="img-responsive" alt="Image"> </div> {% endif %} {% if data.event.details.summary is defined and data.event.details.summary != "" %} <div class="box-header with-border"> <strong>Summary</strong> <p class="justify"> {{ data.event.details.summary | raw}} </p> </div> {% endif %} {% if data.event.details.notes is defined and data.event.details.notes|trim != "" %} <div class="box-header with-border"> <strong>Notes</strong> <p class="justify"> {{ data.event.details.notes| raw }} </p> </div> {% endif %} {% if data.event.details.website is defined and data.event.details.website != "" %} <div class="box-header with-border"> <strong>Website: </strong><span class="event-website"> {% if data.event.details.website starts with 'http' %} <a href="{{ data.event.details.website }}" target="_blank"> {{ data.event.details.website }} </a> {% else %} <a href="http://{{ data.event.details.website }}" target="_blank"> http://{{ data.event.details.website }} </a> {% endif %} </span> </div> {% endif %} {% if data.event.people.participants | length > 0 or data.event.report | length + data.event.eventPresentations | length + data.event.agendaDocuments | length + data.event.backgroundDocs | length + data.event.otherDocs | length >0 %} <div class="box-header with-border"> <div class="row"> {% if data.event.people.participants | length > 0 %} <div class="col-sm-4 col-xs-12"> <div class="media"> <div class="media-left"> <img alt="user icon" src="{{ asset('assets/uploads/user.png') }}" class="icons"> </div> <div class="media-body"> {% if data.event.people.numberOfParticipants > 0 %} <div class="participants"><a href="javascript:void(0)" data-id="participants" class="navigate">{{ data.event.people.numberOfParticipants }} Participants</a></div> {% endif %} {% if (data.event.people.numberOfProvisional + data.event.people.numberOfUnapproved) > 0 %} <div class="participants"><a href="javascript:void(0)" data-id="participants" class="navigate">{{ data.event.people.numberOfProvisional + data.event.people.numberOfUnapproved }} Provisional</a></div> {% endif %} <div class="pull-right"><a href="javascript:void(0)" data-id="participants" class="navigate">More...</a></div> </div> </div> </div> {% endif %} {% if data.event.people.participants | length > 0 %} <div class="col-sm-4 col-xs-12"> <div class="media"> <div class="media-left"> <img alt="report icon" src="{{ asset('assets/uploads/report.png') }}" class="icons" /> </div> <div class="media-body"> <a href="javascript:void(0)" data-id="participants" class="navigate"> View detailed participants list </a><br /> <a href="{{ path('view_printable_participants',{idEvent: data.event.details.idEvent}) }}"> View a printable participants list </a><br /> <div class="pull-right"> <a href="javascript:void(0)" data-id="participants" class="navigate"> More... </a> </div> </div> </div> </div> {% endif %} {% if data.event.report | length + data.event.eventPresentations | length + data.event.agendaDocuments | length + data.event.backgroundDocs | length + data.event.otherDocs | length >0 %} <div class="col-sm-4 col-xs-12"> <div class="media"> <div class="media-left"> <img alt="document icon" src="{{ asset('assets/uploads/documents.png') }}" class="icons" /> </div> <div class="media-body"> {% if data.event.report is not null and data.event.report | length > 0 %} <a href="javascript:void(0)" data-id="documents" class="navigate"> Final R eport</a><br /> {% endif %} {% if data.event.eventPresentations is not null and data.event.eventPresentations | length >0 %} Presentations: <a href="javascript:void(0)" data-id="documents" class="navigate"> {{ data.event.eventPresentations | length }} </a><br /> {% endif %} {% if data.event.agendaDocuments is not null and data.event.agendaDocuments | length >0 %} Agenda Documents: <a href="javascript:void(0)" data-id="documents" class="navigate"> {{ data.event.agendaDocuments | length }} </a><br /> {% endif %} {% if data.event.backgroundDocs is not null and data.event.backgroundDocs | length >0 %} Background Documents: <a href="javascript:void(0)" data-id="documents" class="navigate"> {{ data.event.backgroundDocs | length }} </a><br /> {% endif %} {% if data.event.otherDocs is not null and data.event.otherDocs | length >0 %} Other Documents: <a href="javascript:void(0)" data-id="documents" class="navigate"> {{ data.event.otherDocs | length }} </a><br /> {% endif %} <div class="pull-right"> <a href="javascript:void(0)" data-id="documents" class="navigate"> More... </a> </div> </div> </div> </div> {% endif %} </div> {% if data.user is defined and data.user.canSendEmail == 1 and data.event.people.participants | length > 0 %} <div class="mail-btn"> <button href="#compose-mail" data-toggle="modal" {% if data.event.details.status == 1 %} class="btn btn-primary" {% else %} class="btn btn-red" {% endif %} id="compose" style=""> <i class="fa fa-envelope-o fa-fw"></i> Send an email to all confirmed participants of this event. </button> </div> {% endif %} <br/> {% if is_granted('ROLE_USER') %} <a href="{{ path('download_event_participants_info',{idEvent: data.event.details.idEvent}) }}" target="_blank"> <button class="btn btn-primary" id="export" style="display: block;"> <i class="fa fa-download fa-fw"></i> Export participants info as CSV </button> </a> {% endif %} </div> {% endif %} </div> <!-- /.tab-pane --> <div class="tab-pane" id="agenda"> <div class="printable-links"> <a href="{{ path('view_agenda_printable',{idEvent: data.event.details.idEvent}) }}"> [View a simple printable version of this agenda] </a><br /> <a href="{{ path('view_annonated_agenda_printable',{idEvent: data.event.details.idEvent}) }}"> [View an annotated printable version of this agenda] </a> </div> <div class="btn-group" role="group" id="nestable-menu"> <button type="button" class="btn btn-default" data-action="expand-all"> Expand All </button> <button type="button" class="btn btn-default" data-action="collapse-all"> Collapse All </button> </div> <div class="dd dd-nodrag" id="nestable"> <ul class="dd-list dd-nodrag"></ul> </div> </div> <!-- /.tab-pane --> <div class="tab-pane" id="documents"> {% if data.event.report|length >0 %} <div class="box-header with-border"> <span class="event-heading"> Report </span> <div class="box-body"> <div class="box-body"> <table class="table table-striped table-bordered dataTable dt-responsive wrap" style="width: 100%;"> <thead> <tr> <th class="all">Code</th> <th>Name</th> <th>Updated on</th> <th class="all text-right">Action</th> </tr> </thead> <tbody> {% for document in data.event.report %} <tr> <td>{{ document.docCode }}</td> <td> <a href="/document/{{ document.idDoc }}" class="view-document" data-docid="{{ document.idDoc }}"> {{ document.title }} </a> </td> <td>{{ document.updatedAt|date("d/m/Y") }}</td> <td> <div class="btn-group pull-right"> <i class="fa fa-download fa-2x download-document" aria-hidden="true" data-idDoc="{{ document.idDoc }}" > </i> </div> </td> </tr> {% endfor %} </tbody> </table> </div> </div> </div> {% endif %} {% if data.event.eventPresentations|length >0 %} <div class="box-header with-border"> <span class="event-heading">Presentation</span> <div class="box-body"> <div class="box-body"> <table class="table table-striped table-bordered dataTable dt-responsive wrap col5" style="width: 100%;"> {% for i in ['thead', 'tfoot'] %} <{{ i }}> <tr> {#<th class="all">Select</th>#} <th>Agenda</th> <th class="all">Code</th> <th>Name</th> <th>Updated on</th> <th class="all text-right">Action</th> </tr> </{{ i }}> {% endfor %} <tbody> {% for document in data.event.eventPresentations %} <tr> <td>{{ document.idAgendaitem }}</td> <td>{{ document.docCode }}</td> <td> <a href="/document/{{ document.idDoc }}" class="view-document" data-docid="{{ document.idDoc }}"> {{ document.title }} </a> </td> <td>{{ document.updatedAt|date("d/m/Y") }}</td> <td> <div class="btn-group pull-right"> <i class="fa fa-download fa-2x download-document" aria-hidden="true" data-idDoc="{{ document.idDoc }}" > </i> </div> </td> </tr> {% endfor %} </tbody> </table> </div> </div> </div> {% endif %} {% if data.event.agendaDocuments|length >0 %} <div class="box-header with-border"> <span class="event-heading">Agenda Documents</span> <div class="box-body"> <table class="table table-striped table-bordered dataTable dt-responsive wrap col5" style="width: 100%;" > {% for i in ['thead', 'tfoot'] %} <{{ i }}> <tr> {#<th class="all">Select</th>#} <th>Agenda</th> <th class="all">Code</th> <th>Name</th> <th>Updated on</th> <th class="all text-right">Action</th> </tr> </{{ i }}> {% endfor %} <tbody> {% for document in data.event.agendaDocuments %} <tr> <td>{{ document.idAgendaitem }}</td> <td>{{ document.docCode }}</td> <td> <a href="/document/{{ document.idDoc }}" class="view-document" data-docid="{{ document.idDoc }}"> {{ document.title }} </a> </td> <td>{{ document.updatedAt|date("d/m/y") }}</td> <td> <div class="btn-group pull-right"> <i class="fa fa-download fa-2x download-document" aria-hidden="true" data-idDoc="{{ document.idDoc }}" > </i> </div> </td> </tr> {% endfor %} </tbody> </table> </div> </div> {% endif %} {% if data.event.backgroundDocs|length >0 %} <div class="box-header with-border"> <span class="event-heading">Background Documents</span> <div class="box-body"> <div class="box-body"> <table class="table table-striped table-bordered dataTable dt-responsive wrap col5" style="width: 100%;"> {% for i in ['thead', 'tfoot'] %} <{{ i }}> <tr> {#<th class="all">Select</th>#} <th>Agenda</th> <th class="all">Code</th> <th>Name</th> <th>Updated on</th> <th class="all text-right">Action</th> </tr> </{{ i }}> {% endfor %} <tbody> {% for document in data.event.backgroundDocs %} <tr> <td>{{ document.idAgendaitem }}</td> <td>{{ document.docCode }}</td> <td><a href="/document/{{ document.idDoc }}" class="view-document" data-docid="{{ document.idDoc }}"> {{ document.title }} </a> </td> <td>{{ document.updatedAt|date("d/m/Y") }}</td> <td> <div class="btn-group pull-right"> <i class="fa fa-download fa-2x download-document" aria-hidden="true" data-idDoc="{{ document.idDoc }}" > </i> </div> </td> </tr> {% endfor %} </tbody> </table> </div> </div> </div> {% endif %} {% if data.event.otherDocs|length >0 %} <div class="box-header with-border"> <span class="event-heading">Other Documents</span> <div class="box-body"> <div class="box-body"> <table class="table table-striped table-bordered dataTable dt-responsive wrap col4" style="width: 100%;"> {% for i in ['thead', 'tfoot'] %} <{{ i }}> <tr> {#<th class="all">Select</th>#} <th class="all">Code</th> <th>Name</th> <th>Updated on</th> <th class="all text-right">Action</th> </tr> </{{ i }}> {% endfor %} <tbody> {% for document in data.event.otherDocs %} <tr> <td>{{ document.docCode }}</td> <td> <a href="/document/{{ document.idDoc }}" class="view-document" data-docid="{{ document.idDoc }}"> {{ document.title }} </a> </td> <td>{{ document.updatedAt|date("d/m/Y") }}</td> <td> <div class="btn-group pull-right"> <i class="fa fa-download fa-2x download-document" aria-hidden="true" data-idDoc="{{ document.idDoc }}" > </i> </div> </td> </tr> {% endfor %} </tbody> </table> </div> </div> </div> {% endif %} </div> <!-- /.tab-pane --> <div class="tab-pane" id="participants"> <p> {% set totalParticipants = data.event.people.numberOfParticipants %} {% set totalParticipants = totalParticipants + data.event.people.numberOfProvisional %} {% set totalParticipants =totalParticipants + data.event.people.numberOfUnapproved %} There {% if totalParticipants != 1 %} are {% else %} is {% endif %} {{ totalParticipants }} participant{% if totalParticipants != 1 %}s{% endif%} associated with <a href="{{ path('view_event',{ 'event': data.event.details.idEvent} )}}"> {{ data.event.details.title }} </a> {% if data.event.people.numberOfProvisional > 0 %}, {{ data.event.people.numberOfProvisional }} of whom {% if data.event.people.numberOfProvisional != 1 %} are {% else %} is {% endif %} provisional {% endif %}. </p> {% if is_granted('ROLE_USER') %} <p> <a href="{{ path('view_printable_participants',{idEvent: data.event.details.idEvent}) }}"> <button class="btn btn-primary" id="viewPrintableParticipants" style="display: block;"> <i class="fa fa-eye fa-fw"></i> View a printable participants list </button> </a> </p> <p> <a href="{{ path('download_event_participants_info',{idEvent: data.event.details.idEvent}) }}" target="_blank"> <button class="btn btn-primary" id="export" style="display: block;"> <i class="fa fa-download fa-fw"></i> Export participants info as CSV </button> </a> </p> {% endif %} {% if data.event.people.participantsByRole | length > 0 %} {% for role, participants in data.event.people.participantsByRole %} {% if participants | length > 0 %} <div class="box-header with-border"> <span class="event-heading">{{ role }}</span> <div class="box-body"> <table class="table table-striped table-bordered dataTable dt-responsive wrap {% if app.user %} col3 {% else %} col2 {% endif %}" style="width: 100%;" > {% for i in ['thead'] %} <{{ i }}> <tr> <th class="all" style="width:100%;"> Name </th> <th> Country </th> {% if app.user %} <th> Comments </th> {% endif %} </tr> </{{ i }}> {% endfor %} <tbody> {% for participant in participants %} {% set textClass = "" %} {% if participant.status == 0 %} {% set textClass = "text-green" %} {% set title = "Confirmed & Approved" %} {% elseif participant.status == 1 %} {% set textClass = "text-yellow" %} {% set title = "Need Confirmation" %} {% elseif participant.status == 2 %} {% set textClass = "text-grey" %} {% set title = "Need Approval" %} {% elseif participant.status == 3 %} {% set textClass = "text-red" %} {% set title = "Declined" %} {% elseif participant.status == 4 %} {% set textClass = "text-darkred" %} {% set title = "Rejected" %} {% endif %} <tr> <td> <i class="fa fa-user fa-2x fa-fw {{ textClass }} tipso" aria-hidden="true" title="{{ title }}"> </i> <a href="{{ path('view_profile', {'user': participant.idInd}) }}" target="_blank"> {{ participant.sname | upper ~ ' ' ~ participant.fname }} </a> </td> <td> {{ participant.country }} </td> {% if app.user %} <td> {{ participant.accommodation }} </td> {% endif %} </tr> {% endfor %} </tbody> </table> </div> </div> {% endif %} {% endfor %} {% endif %} <div class="stats"> {% if data.event.people.numberOfParticipants > 0 %} <i class="fa fa-user fa-2x fa-fw text-green" aria-hidden="true"></i> = Person has confirmed their participation and been approved to participate.<br /> {% endif %} {% if data.event.people.numberOfProvisional > 0 %} <i class="fa fa-user fa-2x fa-fw text-yellow" aria-hidden="true"></i> = Person has not yet confirmed their participation.<br /> {% endif %} {% if data.event.people.numberOfUnapproved > 0 %} <i class="fa fa-user fa-2x fa-fw text-grey" aria-hidden="true"></i> = Person has applied to participate but has not yet been approved.<br /> {% endif %} {% if data.event.people.numberOfDeclined > 0 %} <i class="fa fa-user fa-2x fa-fw text-red" aria-hidden="true"></i> = Person has declined to participate or had their request to participate declined.<br /> {% endif %} {% if data.event.people.numberOfRejected > 0 %} <i class="fa fa-user fa-2x fa-fw text-darkred" aria-hidden="true"></i> = Person had their request to participate declined.<br /> {% endif %} Participant Stats:<br /> Total Invited: {{ data.event.people.participants|length }}<br /> {% if data.event.people.numberOfParticipants is defined %} Confirmed: {{ data.event.people.numberOfParticipants }}<br /> {% endif %} {% if data.event.people.numberOfProvisional is defined %} Not confirmed: {{ data.event.people.numberOfProvisional }}<br /> {% endif %} {% if data.event.people.numberOfUnapproved is defined %} Unapproved: {{ data.event.people.numberOfUnapproved }}<br /> {% endif %} {% if data.event.people.numberOfDeclined is defined %} Not-participating: {{ data.event.people.numberOfDeclined }}<br /> {% endif %} {% if data.event.people.numberOfRejected is defined %} Rejected: {{ data.event.people.numberOfRejected }}<br /> {% endif %} </div> </div> <!-- /.tab-pane --> </div> <!-- /.tab-content --> </div> <!-- /.nav-tabs-custom --> <div id='edited-by' class="pull-right italics text-right"> Group(s): {% if data.event.eventGroups|length > 0 %} {% for group in data.event.eventGroups %} {% if loop.last %} <a href="{{ path('view_group',{groupId: group.idGroup}) }}"> {{ group.groupname }}.<br /> </a> {% else %} <a href="{{ path('view_group',{groupId: group.idGroup}) }}"> {{ group.groupname }}, </a> {% endif %} {% endfor %} {% else %} no groups<br /> {% endif %} Label(s): {% if data.event.eventLabels|length > 0 %} {% for label in data.event.eventLabels %} {{ label.groupname ~ " " ~ label.labelType }} {% if loop.last %} <br /> {% else %} , {% endif %} {% endfor %} {% else %} no labels<br /> {% endif %} {% if data.event.eventEdits.createdBy is defined %} Created {% if data.event.eventEdits.createdAt is defined %} at {{ data.event.eventEdits.createdAt | date('H:i') ~' on '~ data.event.eventEdits.createdAt | date('d M Y') }} {% endif %} by <a href="{{ path('view_profile',{user: data.event.eventEdits.createdId}) }}"> {{ data.event.eventEdits.createdBy }} </a> <br /> {% endif %} {% if data.event.eventEdits.lastEditBy is defined %} Last Updated {% if data.event.eventEdits.lastEditAt is defined %} at {{ data.event.eventEdits.lastEditAt | date('H:i') ~' on '~ data.event.eventEdits.lastEditAt | date('d M Y') }} {% endif %} by <a href="{{ path('view_profile',{user: data.event.eventEdits.lastEditId}) }}"> {{ data.event.eventEdits.lastEditBy }} </a> <br /> {% endif %} </div> </div> <!-- /.col --> </div> <!-- /.row --> </section> </div> {% if app.user %} <div aria-hidden="true" aria-labelledby="compose-mail" role="dialog" tabindex="-1" id="compose-mail" class="modal fade" style="display: none;"> <div class="modal-dialog modal-email modal-lg"> <div class="modal-content"> <div class="modal-header"> <button aria-hidden="true" data-dismiss="modal" class="close" type="button"> × </button> <h4 class="modal-title">Compose Mail</h4> </div> {% if data.event.details.status == 1 %} <div class="modal-body"> <div role="form" class="form-horizontal"> <div class="form-group"> <label class="col-lg-2 control-label">Sender</label> <div class="col-lg-10"> {% if file_exists(web_path~asset('uploads/profile/profile_'~app.user.id~'.png')) %} <img src="{{ asset('uploads/profile/profile_'~app.user.id~'.png') }}" alt="user profile image" class="profile-img-sm img-circle"/> {% endif %} <label class="control-label"> {{ data.user.fname~' '~data.user.sname }} <{{ app.user.email }}><br /> <div class="checkbox"> <label class="no-padding" for="selfEmail"> <input type="checkbox" value="" id="selfEmail" /> <span class="cr"> <i class="cr-icon glyphicon glyphicon-ok"></i> </span> Send a copy of this message to me too </label> </div> </label> </div> </div> <div class="form-group"> <label class="col-lg-2 control-label">Recipients</label> <div class="col-lg-10"> <label class=""> All people involved in the event: {{ data.event.details.title }} </label> <br />({{ data.event.people.total }} recipient) </div> </div> <div class="form-group"> <label class="col-lg-2 control-label" for="subject">Subject</label> <div class="col-lg-10"> <input type="text" placeholder="" id="subject" name="subject" class="form-control" /> </div> </div> <div class="form-group"> <label class="col-lg-2 control-label" for="message">Message</label> <div class="col-lg-10"> <textarea rows="10" cols="30" class="form-control textarea" id="message" name="message"> </textarea> </div> </div> <div class="form-group"> <label class="col-lg-2 control-label" for="info"></label> <div class="col-lg-10"> <div style="margin-top:5px"> <div class="infoHidden"> <a class="showInfo" href="javascript:void(0)"> [Info on inserting names] </a> </div> <div class="infoShown"> <a class="hideInfo" href="javascript:void(0)" style="float:right"> [Hide] </a> If you include these special words in your message, they will be replaced: <br /><br /> <div class="table-responsive"> <table class="table table-condensed"> <tbody> <tr> <td>_FULLNAME_</td> <td>Recipient name (first name & surname)</td> </tr> <tr> <td>_FNAME_</td> <td>Recipient first name</td> </tr> <tr> <td>_SNAME_</td> <td>Recipient surname</td> </tr> <tr> <td>_TITLE_</td> <td>Recipient title</td> </tr> </tbody> </table> </div> </div> </div> </div> </div> <div class="form-group"> <div class="col-lg-offset-2 col-lg-10"> <div class="fileUpload"> <form action="{{ path('upload_email_attachments') }}" class="dropzone" id="myAwesomeDropzone"> </form> </div> </div> </div> <div class="form-group"> <div class="col-lg-offset-2 col-lg-10"> <div class="btn-toolbar pull-right "> <button class="btn btn-send btn-danger" id="closeModal" data-dismiss="modal"> <i class="fa fa-times-circle"></i> Close </button> <button class="btn btn-send btn-primary" id="sendmail"> Send <i class="fa fa-envelope-o"></i> </button> </div> </div> </div> </div> </div> {% else %} <h3 class="col-lg-offset-2"> <i class="fa error fa-warning"> Event is not activated yet.</i> </h3> <p class="col-lg-offset-2"> This event is not yet activated. <br> You can only send emails to participants once the event is activated.<br><br> </p> {% endif %} </div><!-- /.modal-content --> </div><!-- /.modal-dialog --> </div><!-- /.modal --> {% endif %} <div class="modal fade" id="modal-edit" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> <div class="modal-dialog modal-lg"> <div class="modal-content"> <div class="modal-header"> <h3 class="modal-title"> Document Details </h3> </div> <div class="modal-body"> </div> <div class="modal-footer"> <button type="button" class="btn btn-danger" data-dismiss="modal"> Close </button> </div> </div> </div> </div> {% include 'footer.html.twig' %} <script src="{{ asset('js/bootstrap-datepicker.js') }}" type="text/javascript"></script> <script src="{{ asset('js/tipped.js') }}" type="text/javascript"></script> <script src="{{ asset('js/jquery.nestable.js') }}"></script> <script src="{{ asset('js/handlebars.min.js') }}" type="text/javascript"></script> <script src="{{ asset('js/jquery.dataTables.min.js') }}"></script> <script src="{{ asset('js/dataTables.bootstrap.min.js') }}"></script> <script src="{{ asset('js/dataTables.responsive.min.js') }}"></script> <script src="{{ asset('js/moment.min.js') }}" type="text/javascript"></script> <script src="{{ asset('js/datetime-moment.js') }}" type="text/javascript"></script> <script src="{{ asset('js/bootstrap-dialog.js') }}" type="text/javascript"></script> <script src="{{ asset('js/tipso.min.js') }}" type="text/javascript"></script> <script src="{{ asset('js/bootstrap-tooltip.js') }}" type="text/javascript"></script> <script src="{{ asset('js/bootstrap-confirmation.js') }}" type="text/javascript"></script> <script src="{{ asset('js/tinymce.min.js') }}" type="text/javascript"></script> <script type="text/javascript"> var removeEmailAttachments = '{{ path('remove_email_attachments') }}'; var getDocumentById = "{{ path('get_document_by_id') }}"; var eventStatusChange = "{{ path('event_status_change') }}"; var documentDownloadBlock = "{{ path('document_download_block') }}"; </script> <script src="{{ asset('js/dropzone.js') }}" type="text/javascript"></script> <script src="{{ asset('js/event-view.js') }}" type="text/javascript"></script> <script type="text/javascript"> {% if data.event.agenda != "" %} var obj ='{{ data.event.agenda|raw|escape('js') }}'; //console.log(obj); //console.log(obj.status); //we still need a json.parse here, we do not get a json object but json string!!! const checkObj = JSON.parse(obj); //set the top nav menu style $(".event").addClass('navactive'); Tipped.create('.tipso', {maxWidth: 250}); function buildItem(items) { var html =""; $.each(items, function (index, item) { html += "<li class='dd-item' data-id='" + item.id + "' id='" + item.id + "'>"; html += "<div class='dd-handle'><span class='group-name dd-nodrag'>" + item.idAgendaitem + ' - ' + item.title ; if(item.notes.length>0){ html += "<br /><strong>" +item.notes + "</strong>"; } if(item.requiredActions.length>0){ html += " <u>" + item.requiredActions + "</u>"; } if(item.documents.length>0){ $.each(item.documents,function (key, documentfile) { html += "<br />" + "<i class='fa fa-file' aria-hidden='true'></i> " + "<a " + " href='javascript:void(0)' " + " class='view-document' " + " data-docid='" + documentfile.idDoc + "'>" + documentfile.docCode + " " + documentfile.doctitle + "</a>"; }) } html += "</span>" + "</div>"; if (item.children) { html += "<ol class='dd-list'>"; html += buildItem(item.children); html += "</ol>"; } html += "</li>"; }); return html; } //check if we got an error message (with status = 0) if (checkObj["status"] != 0) { $.each(JSON.parse(obj), function (index, item) { $('#nestable ul').append(buildItem(item)); Tipped.create('.tipso', {maxWidth: 250}); }); } $("#nestable").nestable(); $('.dd').nestable('collapseAll'); $(".dd-nodrag").on("mousedown", function(event) { // mousedown prevent nestable click event.preventDefault(); return false; }); {% endif %} //console.log(obj); //console.log(JSON.parse(obj).status); var participants = $(".col3").DataTable({ "oLanguage": { "sInfo": "Showing _START_ to _END_ of _TOTAL_ Participants", "sInfoEmpty": "Showing 0 to 0 of 0 Participant" }, "responsive": { details: { type: "column" } }, "colReorder": true, "bPaginate": true, "bLengthChange": true, "bFilter": true, "bInfo": true, "bAutoWidth": true, "hash":true, "columns": [ { "width": "40%" }, { "width": "20%" }, { "width": "30%" } ], "aaSorting": [], //aLengthMenu: [[10, 25, 50, -1], [10, 25, 50, "All"]], aLengthMenu: [[50, 75, 100, -1], [50, 75, 100, "All"]], }); var participants2col = $(".col2").DataTable({ "oLanguage": { "sInfo": "Showing _START_ to _END_ of _TOTAL_ Participants", "sInfoEmpty": "Showing 0 to 0 of 0 Participant" }, "responsive": { details: { type: "column" } }, "colReorder": true, "bPaginate": true, "bLengthChange": true, "bFilter": true, "bInfo": true, "bAutoWidth": true, "hash":true, "columns": [ { "width": "40%" }, { "width": "20%" } ], "aaSorting": [], //aLengthMenu: [[10, 25, 50, -1], [10, 25, 50, "All"]], aLengthMenu: [[50, 75, 100, -1], [50, 75, 100, "All"]], }); $.fn.dataTable.moment( 'DD/MM/YY' ); var col4 = $(".col4").DataTable({ "oLanguage": { "sInfo": "Showing _START_ to _END_ of _TOTAL_ Documents", "sInfoEmpty": "Showing 0 to 0 of 0 Document" }, "responsive": { details: { type: "column" } }, "colReorder": true, "bPaginate": true, "bLengthChange": true, "bFilter": true, "bInfo": true, "bAutoWidth": true, "hash":true, "columns": [ {"width": "20%" }, { "width": "40%" }, { "width": "20%" }, { "width": "10%" } ], order: [[ 1, "desc" ]], //aLengthMenu: [[10, 25, 50, -1], [10, 25, 50, "All"]], aLengthMenu: [[50, 75, 100, -1], [50, 75, 100, "All"]], }); var col5 = $(".col5").DataTable({ "oLanguage": { "sInfo": "Showing _START_ to _END_ of _TOTAL_ Documents", "sInfoEmpty": "Showing 0 to 0 of 0 Document" }, "responsive": { details: { type: "column" } }, "colReorder": true, "bPaginate": true, "bLengthChange": true, "bFilter": true, "bInfo": true, "bAutoWidth": true, "hash":true, "columns": [ {"width": "15%" }, { "width": "15%" }, { "width": "40%" }, { "width": "15%" }, { "width": "15%" } ], order: [[ 0, "asc" ]], //aLengthMenu: [[10, 25, 50, -1], [10, 25, 50, "All"]], aLengthMenu: [[50, 75, 100, -1], [50, 75, 100, "All"]], }); tinymce.init( { selector: 'textarea', plugins: [ "advlist autolink lists link image charmap print preview anchor", "searchreplace visualblocks code fullscreen", "insertdatetime media table contextmenu paste imagetools powerpaste" ], toolbar: "insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image", powerpaste_allow_local_images: true, powerpaste_word_import: 'prompt', powerpaste_html_import: 'prompt', branding: false, relative_urls: false, convert_urls: false, forced_root_block : false } ); $(document).on( 'focusin', function(e) { if ($(e.target).closest(".mce-window").length) { e.stopImmediatePropagation(); } } ); // Javascript to enable link to tab if (window.location.hash != "") { $('a[href="' + window.location.hash + '"]').click() $(window).scrollTop(0); } $('.nav-tabs a').on( 'shown.bs.tab', function (e) { window.location.hash = e.target.hash; $(window).scrollTop(0); } ); $("body").on( "click", ".navigate", function (event) { var id = $(this).data("id"); $(".nav-tabs a[href='#" + id + "']").tab("show"); } ); Dropzone.options.myAwesomeDropzone = { init: function() { this.on('success', function(file, response) { $("#message").after($('<input type="hidden" name="file[]" class="file" value="' + response + '">')); }); this.on('queuecomplete', function() { // Invoked when all files finished uploading // Now just submit the form. It will send the filenames along since // they are added as hidden input fields. } ); this.on('removedfile', function (file, response) { $('.file:input[value="'+file.fid+'"]').remove(); } ); }, maxFilesize: 10, maxFiles: 15, accept: function(file, done) { var thumbnail = $('.dropzone').find(".dz-preview:last"); thumbnail.removeClass('dz-file-preview').addClass('dz-image-preview'); switch (file.type) { case 'application/pdf': thumbnail.find('img').attr('src','{{ asset("img/pdf-icon.png") }}'); break; case 'application/vnd.openxmlformats-officedocument.wordprocessingml.document': thumbnail.find('img').attr('src','{{ asset("img/word-icon.png") }}'); break; case 'application/vnd.ms-excel': thumbnail.find('img').attr('src','{{ asset("img/excel-icon.png") }}'); break; case 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet': thumbnail.find('img').attr('src','{{ asset("img/excel-icon.png") }}'); break; case 'application/vnd.ms-powerpoint': thumbnail.find('img').attr('src','{{ asset("img/PowerPoint-icon.png") }}'); break; case 'application/application/zip, application/octet-stream': thumbnail.find('img').attr('src','{{ asset("img/zip-icon.jpg") }}'); break; case 'text/csv': thumbnail.find('img').attr('src','{{ asset("img/csv-icon.jpg") }}'); break; case 'text/plain': thumbnail.find('img').attr('src','{{ asset("img/txt-icon.png") }}'); break; case 'application/zip': thumbnail.find('img').attr('src','{{ asset("img/zip-icon.jpg") }}'); break; } done(); }, }; $("#sendmail").click( function () { $this = $(this); var subject = $("#subject").val(); var message = tinyMCE.get('message').getContent(); selfEmail = $("#selfEmail").is(":checked"); var file = $('input:hidden.file').serialize(); if ($.trim(subject) === "") { $("#subject").parents('.form-group').addClass('has-error'); errorsubject = true; } else { $("#subject").parents('.form-group').removeClass('has-error'); errorsubject = false; } if ($.trim(message) === "") { $("#message").parents('.form-group').addClass('has-error'); $("#message").siblings(".mce-tinymce").css('border-color','red'); errormessage = true; } else { $("#message").parents('.form-group').removeClass('has-error'); $("#message").siblings(".mce-tinymce").css('border-color','rgb(210, 214, 222)'); errormessage = false; } {% if app.user.id is defined %} if (!errormessage && !errorsubject) { $this.prop("disabled",true); $this.html("<i class='fa fa-spin fa-cog'></i> Sending</button>"); $.ajax({ url: "{{ path('email_queue') }}", data:{ userid: "{{ app.user.id }}", eventid: "{{ data.event.details.idEvent }}", email: "{{ app.user.email }}", selfmail: selfEmail, subject: subject, message: message, file: file, searchstring: window.location.href }, type: "POST", success:function (response) { $this.html("Send <i class='fa fa-envelope-o'></i>"); $(".dz-default.dz-message").css("opacity",1); $("#selfEmail").prop("checked",false); $("#subject").val(""); tinymce.get("message").setContent(''); $('div.dz-success').remove(); $("#message").siblings(".file").remove(); $this.prop("disabled",false); $("#compose-mail").modal("hide"); if (response.status === 0) { BootstrapDialog.alert({ title: 'Email Received Successfully.', message: 'Your email is successfully received. It will now be queued and sent out to the recipients shortly.', type: BootstrapDialog.TYPE_SUCCESS, closable: false, draggable: false, buttonLabel: 'OK', }); } else { let message = 'There was an error sending your email. Please try again later.<br />'; message += response.error + '<br />'; message += response.returnMessage; BootstrapDialog.alert({ title: 'Email Not Sent.', message: message, type: BootstrapDialog.TYPE_DANGER, closable: false, draggable: false, buttonLabel: 'OK', }); } } }); } {% endif %} } ); $("body").on( "click", ".view-document", function () { var $this = $(this); var $modal = $("#modal-edit") var idDoc = $this.data("docid"); //var doctype = $this.data("doctype"); $modal.find(".modal-header").html("<h3 class='modal-title'>Document Details</h3>"); $modal.children("modal-dialog").addClass("modal-lg"); $modal.find(".modal-footer").html("<button type='button' class='btn btn-danger' data-dismiss='modal'>Close</button>"); $modal.find(".modal-body").html(""); $modal.modal("show"); $.ajax({ url: getDocumentById, type: "GET", data: {idDoc: idDoc}, }) .done(function(data) { $modal.find(".modal-body").html(data); }); } ); $("body").on( "click", ".eventAction", function () { $this = $(this); $this.html("<i class='fa fa-cog fa-spin fa-fw' aria-hidden='true'></i> Please wait..."); var eventStatus = $this.data("status"); $.ajax({ url: eventStatusChange, type: "POST", data: {idEvent: {{ data.event.details.idEvent}}, eventStatus: eventStatus}, }).done(function (response) { console.log(response); if(response.status == 1){ switch (response.eStatus){ case "0": $this.replaceWith("<button " + "class='btn btn-success eventAction' " + "data-status='1'>" + "<i class='fa fa-check fa-fw' aria-hidden='true'></i> " + "Activate" + "</button>"); break; case "1": $this.replaceWith("<button " + "class='btn btn-danger eventAction' " + "data-status='0'>" + "<i class='fa fa-ban fa-fw' aria-hidden='true'></i> " + "Deactivate" + "</button>"); break; case "2": $this.replaceWith("<button " + "class='btn btn-warning eventAction' " + "data-status=3'>" + "<i class='fa fa-times fa-fw' aria-hidden='true'></i> " + "Delete" + "</button>"); break; case "3": $this.replaceWith("<button " + "class='btn btn-success eventAction' " + "data-status='0'>" + "<i class='fa fa-check fa-fw aria-hidden=true'></i> " + "Undelete" + "</button>"); break; } } }); } ); $('#nestable-menu').on( 'click', function(e) { var target = $(e.target), action = target.data('action'); if (action === 'expand-all') { $('.dd').nestable('expandAll'); } if (action === 'collapse-all') { $('.dd').nestable('collapseAll'); } } ); $(document).ready( function() { $('[class=showInfo]').on('click', function(){ $(document).find('[class=infoHidden]').hide(); $(document).find('[class=infoShown]').show(); return false; }); $('[class=hideInfo]').on('click', function(){ $(document).find('[class=infoHidden]').show(); $(document).find('[class=infoShown]').hide(); return false; }); } ); </script>{% endblock %}