423 lines
19 KiB
XML
423 lines
19 KiB
XML
<?xml version="1.0" standalone="yes"?>
|
|
<!DOCTYPE var:component>
|
|
<var:component xmlns="http://www.w3.org/1999/xhtml"
|
|
xmlns:var="http://www.skyrix.com/od/binding"
|
|
xmlns:const="http://www.skyrix.com/od/constant"
|
|
xmlns:uix="OGo:uix"
|
|
xmlns:rsrc="OGo:url"
|
|
xmlns:label="OGo:label"
|
|
className="UIxPageFrame"
|
|
title="title"
|
|
const:userDefaultsKeys="SOGoRefreshViewCheck, SOGoCalendarCategoriesColors, SOGoDefaultCalendar"
|
|
const:userSettingsKeys="Calendar, ShowCompletedTasks"
|
|
const:jsFiles="Scheduler.app.js, Scheduler.js, Common.js, Contacts.js">
|
|
<script type="text/javascript">
|
|
var firstDayOfWeek = <var:string value="firstDayOfWeek"/>;
|
|
var dayStartHour = <var:string value="dayStartHour"/>;
|
|
var currentView = '<var:string value="currentView"/>';
|
|
var localeCode = '<var:string value="localeCode" />';
|
|
</script>
|
|
<var:component className="UIxCalendarSelector" />
|
|
<style type="text/css">
|
|
<var:if condition="horizontalDragHandleStyle">
|
|
DIV#verticalDragHandle, DIV#rightPanel
|
|
{ left: <var:string value="horizontalDragHandleStyle" />; }
|
|
DIV#leftPanel
|
|
{ width: <var:string value="horizontalDragHandleStyle" />; }
|
|
</var:if><var:if condition="verticalDragHandleStyle">
|
|
DIV#rightDragHandle, DIV#calendarView
|
|
{ top: <var:string value="verticalDragHandleStyle" />; }
|
|
</var:if><var:if condition="eventsListViewStyle">
|
|
DIV#schedulerTabs
|
|
{ height: <var:string value="eventsListViewStyle" />; }
|
|
</var:if>
|
|
</style>
|
|
|
|
<!--
|
|
<div class="preload" style="visibility: hidden;">
|
|
<img rsrc:src="event-gradient.png"/>
|
|
</div>
|
|
<img rsrc:src="event7.png" id="DnDLeftPanelImage" style="visibility: hidden;"/>
|
|
<div class="menu" id="monthListMenu">
|
|
<ul>
|
|
<var:foreach list="monthMenuItems" item="monthMenuItem"
|
|
><li var:month="monthMenuItem"
|
|
><var:string value="monthMenuItemLabel" /></li>
|
|
</var:foreach
|
|
></ul>
|
|
</div>
|
|
|
|
<div class="menu" id="yearListMenu">
|
|
<ul>
|
|
<var:foreach list="yearMenuItems" item="yearMenuItem"
|
|
><li><var:string value="yearMenuItem" /></li>
|
|
</var:foreach
|
|
></ul>
|
|
</div>
|
|
|
|
<div class="menu" id="eventsListMenu">
|
|
<ul>
|
|
<li><var:string label:value="New Event..."/></li>
|
|
<li><var:string label:value="New Task..."/></li>
|
|
<li>!- separator -</li>
|
|
<li><var:string label:value="Edit Selected Event..."/></li>
|
|
<li><var:string label:value="Delete Selected Event"/></li>
|
|
<li>!- separator -</li>
|
|
<li><var:string label:value="Select All"/></li>
|
|
<li>!- separator -</li>
|
|
<li><var:string label:value="Workweek days only"/></li>
|
|
<li><var:string label:value="Tasks in View"/></li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div class="menu" id="tasksListMenu">
|
|
<ul>
|
|
<li><var:string label:value="Open Task..."/></li>
|
|
<li><var:string label:value="New Task..."/></li>
|
|
<li>!- separator -</li>
|
|
<li><var:string label:value="Mark Completed"/></li>
|
|
<li><var:string label:value="Delete Task"/></li>
|
|
<li>!- separator -</li>
|
|
<li><var:string label:value="View Raw Source"/></li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div class="menu" id="calendarsMenu">
|
|
<ul>
|
|
<li><var:string label:value="Properties"/></li>
|
|
<li>!- separator -</li>
|
|
<li><var:string label:value="New Calendar..."/></li>
|
|
<li id="deleteCalendarMenuItem"><var:string label:value="Delete Calendar"/></li>
|
|
<li>!- separator -</li>
|
|
<li><var:string label:value="Export Calendar..."/></li>
|
|
<li><var:string label:value="Import Events..."/></li>
|
|
<li><var:string label:value="Publish Calendar..."/></li>
|
|
<li>!- separator -</li>
|
|
<li><var:string label:value="Reload Remote Calendars"/></li>
|
|
<li>!- separator -</li>
|
|
<li><var:string label:value="Sharing..." /></li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div id="eventDialog" style="display: none;" class="dialog">
|
|
<div>
|
|
<h1>!- space -</h1>
|
|
<p><span>!- space -</span></p>
|
|
<p><span class="label"><var:string label:value="Calendar:" /></span> <span>!- space -</span></p>
|
|
<p><span class="label"><var:string label:value="Location:" /></span> <span>!- space -</span></p>
|
|
<p><span class="label"><var:string label:value="Created by:" /></span> <span>!- space -</span></p>
|
|
<p class="description">!- space -</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="uploadDialog" style="display: none" class="dialog left">
|
|
<div>
|
|
<h3><var:string label:value="Import Events"/></h3>
|
|
<p class="prompt"><var:string label:value="Select an iCalendar file (.ics)."/></p>
|
|
<form const:href="" name="uploadForm" id="uploadForm" method="post"
|
|
enctype="multipart/form-data"
|
|
onsubmit="return AIM.submit(this, {'onStart' : validateUploadForm,
|
|
'onComplete' : uploadCompleted})">
|
|
<p class="prompt"><input type="file" name="calendarFile" class="textField" id="calendarFile" />
|
|
<a href="#" class="button actionButton" id="uploadSubmit"
|
|
onclick="if($('uploadForm').onsubmit()) $('uploadForm').submit()">
|
|
<span><var:string label:value="Upload" /></span></a>
|
|
<a href="#" class="button" const:id="uploadCancel">
|
|
<span><var:string label:value="Cancel" /></span></a>
|
|
</p></form>
|
|
<hr/>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="uploadResults" style="display: none" class="dialog left">
|
|
<div>
|
|
<h3><var:string label:value="Import Events"/></h3>
|
|
<p><span id="uploadResultsContent">!- empty -</span>
|
|
<a href="#" class="button" const:id="uploadOK">
|
|
<span><var:string label:value="Done" /></span></a></p>
|
|
<hr/>
|
|
</div>
|
|
</div>
|
|
-->
|
|
|
|
<main class="view md-layout-fill" ui-view="calendars" layout="row" ng-controller="navController"><!-- calendars list --></main>
|
|
|
|
<script type = "text/ng-template" id="UIxCalMainFrame">
|
|
<!-- calendars colors -->
|
|
<div sg-folder-stylesheet="true"
|
|
ng-repeat="calendar in calendars.service.$calendars"
|
|
ng-model="calendar"><!-- stylesheet --></div>
|
|
<div sg-folder-stylesheet="true"
|
|
ng-repeat="calendar in calendars.service.$subscriptions"
|
|
ng-model="calendar"><!-- stylesheet --></div>
|
|
<!-- Sidenav -->
|
|
<md-sidenav id="left-sidenav" class="md-sidenav-left md-whiteframe-z1" md-component-id="left" md-is-locked-open="isGtMedium" layout="column">
|
|
<var:component className="UIxSidenavToolbarTemplate" />
|
|
<md-content md-scroll-y="md-scroll-y" class="md-flex">
|
|
<!-- User's calendars -->
|
|
<section>
|
|
<md-subheader class="sg-md-subheader">
|
|
<div layout="row" layout-align="space-between center">
|
|
<span><var:string label:value="Calendars"/></span>
|
|
<md-button class="iconButton"
|
|
label:aria-label="New Calendar..."
|
|
ng-click="calendars.newCalendar()">
|
|
<i class="md-icon-add-circle-outline"><!-- add --></i>
|
|
</md-button>
|
|
</div>
|
|
</md-subheader>
|
|
<md-list>
|
|
<md-list-item ng-repeat="calendar in calendars.service.$calendars">
|
|
<md-checkbox ng-model="calendar.active"
|
|
ng-class="calendar.getClassName('checkbox')"
|
|
ng-true-value="1"
|
|
ng-false-value="0"
|
|
label:aria-label="Enable"><!-- enable --></md-checkbox>
|
|
<p class="sg-item-name">{{calendar.name}}</p>
|
|
|
|
<md-menu class="md-secondary">
|
|
<md-button class="iconButton"
|
|
label:aria-label="Options"
|
|
ng-click="$mdOpenMenu()">
|
|
<i class="md-icon-more-vert" md-menu-origin="md-menu-origin"><!-- options --></i>
|
|
</md-button>
|
|
|
|
<md-menu-content width="2">
|
|
<md-menu-item>
|
|
<md-button type="button" ng-click="calendars.confirmDelete(calendar)">
|
|
<var:string label:value="Delete"/>
|
|
</md-button>
|
|
</md-menu-item>
|
|
<md-menu-item>
|
|
<md-button type="button" ng-click="calendars.exportCalendar()">
|
|
<var:string label:value="Export"/>
|
|
</md-button>
|
|
</md-menu-item>
|
|
<md-menu-divider><!-- divider --></md-menu-divider>
|
|
<md-menu-item>
|
|
<md-button type="button" ng-click="calendars.showLinks(calendar)">
|
|
<var:string label:value="Links to this Calendar"/>
|
|
</md-button>
|
|
</md-menu-item>
|
|
<md-menu-item>
|
|
<md-button type="button" ng-click="calendars.share(calendar)">
|
|
<var:string label:value="Sharing..."/>
|
|
</md-button>
|
|
</md-menu-item>
|
|
<md-menu-divider><!-- divider --></md-menu-divider>
|
|
<md-menu-item>
|
|
<md-button type="button" ng-click="calendars.showProperties(calendar)">
|
|
<var:string label:value="Properties"/>
|
|
</md-button>
|
|
</md-menu-item>
|
|
</md-menu-content>
|
|
|
|
</md-menu>
|
|
|
|
</md-list-item>
|
|
</md-list>
|
|
</section>
|
|
<!-- Subscriptions -->
|
|
<section>
|
|
<md-subheader class="sg-md-subheader">
|
|
<div layout="row" layout-align="space-between center">
|
|
<span><var:string label:value="Subscriptions"/></span>
|
|
<md-button class="iconButton"
|
|
label:aria-label="Subscribe to a Calendar..."
|
|
sg-subscribe="calendar"
|
|
sg-subscribe-on-select="calendars.subscribeToFolder(folderData)">
|
|
<i class="md-icon-add-circle-outline"><!-- add --></i>
|
|
</md-button>
|
|
</div>
|
|
</md-subheader>
|
|
<md-list>
|
|
<md-list-item ng-repeat="calendar in calendars.service.$subscriptions">
|
|
<md-checkbox ng-model="calendar.active"
|
|
ng-class="calendar.getClassName('checkbox')"
|
|
ng-true-value="1"
|
|
ng-false-value="0"
|
|
label:aria-label="Enable"><!-- enable --></md-checkbox>
|
|
<p class="sg-item-name">{{calendar.name}}</p>
|
|
|
|
<md-menu class="md-secondary">
|
|
<md-button class="iconButton"
|
|
label:aria-label="Options"
|
|
ng-click="$mdOpenMenu()">
|
|
<i class="md-icon-more-vert" md-menu-origin="md-menu-origin"><!-- options --></i>
|
|
</md-button>
|
|
|
|
<md-menu-content width="2">
|
|
<md-menu-item>
|
|
<md-button type="button" ng-click="calendars.confirmDelete(calendar)">
|
|
<var:string label:value="Unsubscribe Calendar"/>
|
|
</md-button>
|
|
</md-menu-item>
|
|
<md-menu-divider><!-- divider --></md-menu-divider>
|
|
<md-menu-item>
|
|
<md-button type="button" ng-click="calendars.showLinks(calendar)">
|
|
<var:string label:value="Links to this Calendar"/>
|
|
</md-button>
|
|
</md-menu-item>
|
|
<md-menu-divider><!-- divider --></md-menu-divider>
|
|
<md-menu-item>
|
|
<md-button type="button" ng-click="calendars.showProperties(calendar)">
|
|
<var:string label:value="Properties"/>
|
|
</md-button>
|
|
</md-menu-item>
|
|
</md-menu-content>
|
|
</md-menu>
|
|
|
|
</md-list-item>
|
|
</md-list>
|
|
</section>
|
|
<!-- Web Calendars -->
|
|
<section>
|
|
<md-subheader class="sg-md-subheader">
|
|
<div layout="row" layout-align="space-between center">
|
|
<span><var:string label:value="Web Calendars"/></span>
|
|
<md-button class="iconButton"
|
|
label:aria-label="Subscribe to a web calendar..."
|
|
ng-click="calendars.addWebCalendar()">
|
|
<i class="md-icon-add-circle-outline"><!-- add --></i>
|
|
</md-button>
|
|
</div>
|
|
</md-subheader>
|
|
<md-list>
|
|
<md-list-item ng-repeat="calendar in calendars.service.$webcalendars">
|
|
<md-checkbox ng-model="calendar.active"
|
|
ng-class="calendar.getClassName('checkbox')"
|
|
ng-true-value="1"
|
|
ng-false-value="0"
|
|
label:aria-label="Enable"><!-- enable --></md-checkbox>
|
|
<p class="sg-item-name">{{calendar.name}}</p>
|
|
|
|
<md-menu class="md-secondary">
|
|
<md-button class="iconButton"
|
|
label:aria-label="Options"
|
|
ng-click="$mdOpenMenu()">
|
|
<i class="md-icon-more-vert" md-menu-origin="md-menu-origin"><!-- options --></i>
|
|
</md-button>
|
|
|
|
<md-menu-content width="2">
|
|
<md-menu-item>
|
|
<md-button type="button" ng-click="calendars.confirmDelete(calendar)">
|
|
<var:string label:value="Delete"/>
|
|
</md-button>
|
|
</md-menu-item>
|
|
<md-menu-divider><!-- divider --></md-menu-divider>
|
|
<md-menu-item>
|
|
<md-button type="button" ng-click="calendars.showLinks(calendar)">
|
|
<var:string label:value="Links to this Calendar"/>
|
|
</md-button>
|
|
</md-menu-item>
|
|
<md-menu-divider><!-- divider --></md-menu-divider>
|
|
<md-menu-item>
|
|
<md-button type="button" ng-click="calendars.showProperties(calendar)">
|
|
<var:string label:value="Properties"/>
|
|
</md-button>
|
|
</md-menu-item>
|
|
</md-menu-content>
|
|
</md-menu>
|
|
|
|
</md-list-item>
|
|
</md-list>
|
|
</section>
|
|
</md-content>
|
|
</md-sidenav>
|
|
|
|
<!-- Main section -->
|
|
<section layout="column" class="sg-app-content md-layout-fill"
|
|
ng-controller="CalendarListController as list">
|
|
<md-toolbar layout="column" layout-align="space-between start" class="md-tall toolbar-main">
|
|
<div class="md-toolbar-tools md-toolbar-tools-top sg-padded" layout="row" layout-align="space-between start">
|
|
<var:component className="UIxTopnavToolbarTemplate" />
|
|
<div class="sg-toolbar-group-2">
|
|
<md-button class="iconButton" label:aria-label="Search">
|
|
<i class="md-icon-search"><!--icon--></i>
|
|
</md-button>
|
|
</div>
|
|
</div><!-- .md-toolbar-tools -->
|
|
<div class="md-toolbar-tools md-toolbar-tools-bottom" layout="row" layout-align="space-between center">
|
|
<div class="view-list sg-padded" layout="row" layout-align="space-between center"
|
|
sg-search="list.component.$filter(list.componentType, { value: searchText, search: searchField })">
|
|
<md-input-container class="sg-search-field-container">
|
|
<label style="color: white"><i class="md-icon-search"><!--icon--></i><var:string label:value="Search"/></label>
|
|
<input name="folderSearch" type="search" style="color: white"/>
|
|
</md-input-container>
|
|
<div class="sg-toolbar-group">
|
|
<md-select>
|
|
<md-option value="title_Category_Location"><var:string label:value="Title, category or location"/></md-option>
|
|
<md-option value="entireContent"><var:string label:value="Entire content"/></md-option>
|
|
</md-select>
|
|
</div>
|
|
</div>
|
|
<div class="sg-padded">
|
|
<a class="iconButton md-button md-default-theme"
|
|
label:aria-label="Day"
|
|
href="#/calendar/day"><i class="md-icon-view-day"><!-- day view --></i></a>
|
|
<a class="iconButton md-button md-default-theme"
|
|
label:aria-label="Week"
|
|
href="#/calendar/week"><i class="md-icon-view-week"><!-- week view --></i></a>
|
|
<a class="iconButton md-button md-default-theme"
|
|
label:aria-label="Month"
|
|
href="#/calendar/month"><i class="md-icon-view-module"><!-- month view --></i></a>
|
|
</div>
|
|
</div>
|
|
</md-toolbar>
|
|
<md-content layout="row">
|
|
<div class="view-list" layout="column" flex="true" style="position: relative;">
|
|
<md-content id="componentsList">
|
|
<md-tabs md-dynamic-height="true"
|
|
md-selected="list.selectedList">
|
|
<md-tab label:label="Events"
|
|
md-on-select="list.selectComponentType('events')">
|
|
<md-list>
|
|
<md-list-item
|
|
class="md-clickable md-2-line"
|
|
ng-repeat="event in list.component.$events">
|
|
<i class="md-avatar" ng-class="event.getClassName('bg')" ><!-- calendar color --></i>
|
|
<div class="md-list-item-text"
|
|
ui-sref="calendars.component({calendarId: event.c_folder, componentId: event.c_name})">
|
|
<h3>{{event.c_title}}</h3>
|
|
<p>{{event.c_location}}</p>
|
|
<p class="md-secondary">
|
|
{{event.formatted_startdate}}
|
|
<i class="md-icon-repeat" ng-show="event.c_iscycle"><!-- recurrent --></i>
|
|
<i class="md-icon-alarm" ng-show="event.c_nextalarm"><!-- alarm --></i>
|
|
</p>
|
|
</div>
|
|
</md-list-item>
|
|
</md-list>
|
|
</md-tab>
|
|
<md-tab label:label="Tasks"
|
|
md-on-select="list.selectComponentType('tasks')">
|
|
<md-list>
|
|
<md-list-item
|
|
class="md-clickable"
|
|
ng-repeat="task in list.component.$tasks">
|
|
<i class="md-avatar" ng-class="task.getClassName()" ><!-- calendar color --></i>
|
|
<p>{{task.c_title}}</p>
|
|
<p class="md-secondary">{{task.formatted_enddate}}</p>
|
|
</md-list-item>
|
|
</md-list>
|
|
</md-tab>
|
|
</md-tabs>
|
|
</md-content>
|
|
<md-button class="iconButton md-fab md-fab-bottom-right md-accent hide-sm"
|
|
label:aria-label="New Appointment"
|
|
ng-click="list.newComponent()">
|
|
<i class="md-icon-add"><!--icon--></i>
|
|
</md-button>
|
|
</div>
|
|
<md-content class="view-detail sg-padded" ui-view="calendarView"><!-- calendar view --></md-content>
|
|
</md-content>
|
|
<md-sidenav class="md-sidenav-right" md-component-id="right" layout="column" ui-view="componentEditor"><!-- appointment editor view --><!--<var:component className="UIxAppointmentEditorTemplate" />--></md-sidenav>
|
|
</section>
|
|
</script>
|
|
|
|
<script type="text/ng-template" id="UIxUserRightsEditor">
|
|
<var:component className="UIxCalUserRightsEditor" />
|
|
</script>
|
|
|
|
</var:component>
|