~pkunal-parmar/ubuntu-calendar-app/ICalImport

« back to all changes in this revision

Viewing changes to EventDetails.qml

  • Committer: Launchpad Translations on behalf of ubuntu-calendar-dev
  • Date: 2014-06-09 06:30:09 UTC
  • Revision ID: launchpad_translations_on_behalf_of_ubuntu-calendar-dev-20140609063009-vf9c9x0iyl0ossr6
Launchpad automatic translations update.

Show diffs side-by-side

added added

removed removed

Lines of Context:
2
2
import Ubuntu.Components 0.1
3
3
import Ubuntu.Components.Popups 0.1
4
4
import Ubuntu.Components.ListItems 0.1
 
5
import Ubuntu.Components.Themes.Ambiance 0.1
 
6
import QtOrganizer 5.0
5
7
 
6
 
import "dataService.js" as DataService
 
8
import "Defines.js" as Defines
7
9
 
8
10
Page {
9
11
    id: root
10
12
 
11
13
    property var event;
12
 
 
13
 
    anchors.fill: parent
14
 
    anchors.margins: units.gu(2)
 
14
    property string headerColor :"black"
 
15
    property string detailColor :"grey"
 
16
    property var model;
 
17
 
 
18
    anchors{
 
19
        left: parent.left
 
20
        right: parent.right
 
21
        bottom: parent.bottom
 
22
    }
 
23
 
 
24
    flickable: null
 
25
 
 
26
    title: "Event Details"
15
27
 
16
28
    Component.onCompleted: {
17
 
        if( pageStack.header )
18
 
            pageStack.header.visible = false;
19
29
        showEvent(event);
20
30
    }
21
31
 
22
 
    Component.onDestruction: {
23
 
        if( pageStack.header )
24
 
            pageStack.header.visible = true;
 
32
    Connections{
 
33
        target: pageStack
 
34
        onCurrentPageChanged:{
 
35
            if( pageStack.currentPage === root) {
 
36
                showEvent(event);
 
37
            }
 
38
        }
 
39
    }
 
40
 
 
41
    function updateRecurrence( event ) {
 
42
        var index = 0;
 
43
        if(event.recurrence ) {
 
44
            var recurrenceRule = event.recurrence.recurrenceRules;
 
45
            if(recurrenceRule.length > 0){
 
46
                if(recurrenceRule[0].limit === undefined)
 
47
                    limitHeader.value = i18n.tr("Never");
 
48
                else{
 
49
                    // TRANSLATORS: this is a time & Date formatting string,
 
50
                    //see http://qt-project.org/doc/qt-5/qml-qtqml-date.html#details
 
51
                    var dateFormat = i18n.tr("dd-MMM-yyyy")
 
52
                    limitHeader.value = parseInt(recurrenceRule[0].limit) ?
 
53
                                i18n.tr("After %1 Occurrences").arg(recurrenceRule[0].limit):
 
54
                                i18n.tr("After Date %1").arg(recurrenceRule[0].limit.toLocaleString(Qt.locale(),dateFormat));
 
55
                }
 
56
 
 
57
                index =  recurrenceRule[0].frequency ;
 
58
            }
 
59
            else{
 
60
                limitHeader.visible = false
 
61
                index = 0
 
62
            }
 
63
        }
 
64
        recurrentHeader.value = Defines.recurrenceLabel[index];
 
65
    }
 
66
 
 
67
    function updateContacts(event) {
 
68
        var attendees = event.attendees;
 
69
        contactModel.clear();
 
70
        if( attendees !== undefined ) {
 
71
            for( var j = 0 ; j < attendees.length ; ++j ) {
 
72
                contactModel.append( {"name": attendees[j].name,"participationStatus": attendees[j].participationStatus }  );
 
73
            }
 
74
        }
 
75
    }
 
76
 
 
77
    function updateReminder(event) {
 
78
        var index = 0;
 
79
        var reminder = event.detail( Detail.VisualReminder);
 
80
        if( reminder ) {
 
81
            var reminderTime = reminder.secondsBeforeStart;
 
82
            var foundIndex = Defines.reminderValue.indexOf(reminderTime);
 
83
            index = foundIndex != -1 ? foundIndex : 0;
 
84
        }
 
85
        reminderHeader.value = Defines.reminderLabel[index];
 
86
    }
 
87
 
 
88
    function updateLocation(event) {
 
89
        if( event.location ) {
 
90
            locationLabel.text = event.location;
 
91
 
 
92
            // FIXME: need to cache map image to avoid duplicate download every time
 
93
            var imageSrc = "http://maps.googleapis.com/maps/api/staticmap?center="+event.location+
 
94
                    "&markers=color:red|"+event.location+"&zoom=15&size="+mapContainer.width+
 
95
                    "x"+mapContainer.height+"&sensor=false";
 
96
            mapImage.source = imageSrc;
 
97
        }
 
98
        else {
 
99
            // TODO: use different color for empty text
 
100
            locationLabel.text = i18n.tr("Not specified")
 
101
            mapImage.source = "";
 
102
        }
25
103
    }
26
104
 
27
105
    function showEvent(e) {
28
 
 
29
 
        // FIXME: temp location in case there is no vanue is defined
30
 
        var location="-15.800513,-47.91378";
31
 
        //var location ="Terry' Cafe, 158 Great Suffold St, London, SE1 1PE";
32
 
 
33
 
        timeLabel.text = Qt.formatDateTime(e.startTime,"hh:mm") + " - " + Qt.formatDateTime(e.endTime,"hh:mm");
34
 
        dateLabel.text = Qt.formatDateTime(e.startTime,"ddd, d MMMM");
35
 
        titleLabel.text = e.title;
36
 
 
37
 
        locationLabel.text = location;
38
 
        if( e.message ) {
39
 
            descLabel.text = e.message;
40
 
        }
41
 
 
42
 
        var venues = []
43
 
        DataService.getVenues(e, venues)
44
 
        if( venues.length > 0 ) {
45
 
            //FIXME: what to do for multiple venue
46
 
            var place = venues[0];
47
 
            locationLabel.text = place.address;
48
 
            if( place.latitude && place.longitude) {
49
 
                location = place.latitude +"," + place.longitude;
50
 
            }
51
 
        }
52
 
 
53
 
        var attendees = []
54
 
        DataService.getAttendees(e, attendees)
55
 
        contactModel.clear();
56
 
        for( var j = 0 ; j < attendees.length ; ++j ) {
57
 
            contactModel.append( {"name": attendees[j] } );
58
 
        }
59
 
 
60
 
        // FIXME: need to cache map image to avoid duplicate download every time
61
 
        var imageSrc = "http://maps.googleapis.com/maps/api/staticmap?center="+location+
62
 
                "&markers=color:blue|"+location+"&zoom=15&size="+mapContainer.width+
63
 
                "x"+mapContainer.height+"&sensor=false";
64
 
        mapImage.source=imageSrc;
65
 
    }
66
 
 
67
 
    tools: ToolbarActions {
68
 
        Action {
69
 
            text: i18n.tr("Add invite");
70
 
            onTriggered: {
71
 
                print(text + " not implemented");
72
 
            }
73
 
        }
74
 
        Action {
75
 
            text: i18n.tr("Edit");
76
 
            onTriggered: {
77
 
                print(text + " not implemented");
78
 
            }
79
 
        }
80
 
        active: true
81
 
        lock: false
82
 
    }
83
 
 
84
 
    Column{
 
106
        // TRANSLATORS: this is a time formatting string,
 
107
        // see http://qt-project.org/doc/qt-5/qml-qtqml-date.html#details for valid expressions
 
108
        var timeFormat = i18n.tr("hh:mm");
 
109
        // TRANSLATORS: this is a time & Date formatting string,
 
110
        //see http://qt-project.org/doc/qt-5/qml-qtqml-date.html#details
 
111
        var dateFormat = i18n.tr("dd-MMM-yyyy")
 
112
        eventDate.value = e.startDateTime.toLocaleString(Qt.locale(),dateFormat);
 
113
        var startTime = e.startDateTime.toLocaleTimeString(Qt.locale(), timeFormat);
 
114
        var endTime = e.endDateTime.toLocaleTimeString(Qt.locale(), timeFormat);
 
115
 
 
116
        if( e.itemType === Type.EventOccurrence ){
 
117
            var requestId = -1;
 
118
            model.onItemsFetched.connect( function(id,fetchedItems){
 
119
                if(requestId === id && fetchedItems.length > 0) {
 
120
                    internal.parentEvent = fetchedItems[0];
 
121
                    updateRecurrence(internal.parentEvent);
 
122
                    updateContacts(internal.parentEvent);
 
123
                }
 
124
            });
 
125
            requestId = model.fetchItems([e.parentId]);
 
126
        }
 
127
 
 
128
        allDayEventCheckbox.checked = e.allDay;
 
129
 
 
130
        startHeader.visible = !e.allDay;
 
131
        endHeader.visible = !e.allDay;
 
132
 
 
133
        startHeader.value = startTime;
 
134
        endHeader.value = endTime;
 
135
 
 
136
        // This is the event title
 
137
        if( e.displayLabel) {
 
138
            titleLabel.text = e.displayLabel;
 
139
        }
 
140
 
 
141
        if( e.description ) {
 
142
            descLabel.text = e.description;
 
143
        }
 
144
 
 
145
        updateContacts(e);
 
146
 
 
147
        updateRecurrence(e);
 
148
 
 
149
        updateReminder(e);
 
150
 
 
151
        updateLocation(e);
 
152
    }
 
153
 
 
154
    Keys.onEscapePressed: {
 
155
        pageStack.pop();
 
156
    }
 
157
 
 
158
    Keys.onPressed: {
 
159
        if ((event.key === Qt.Key_E) && ( event.modifiers & Qt.ControlModifier)) {
 
160
            pageStack.push(Qt.resolvedUrl("NewEvent.qml"),{"event": root.event});
 
161
        }
 
162
    }
 
163
 
 
164
    tools: ToolbarItems {
 
165
        ToolbarButton {
 
166
            action:Action {
 
167
                text: i18n.tr("Delete");
 
168
                iconSource: "image://theme/delete,edit-delete-symbolic"
 
169
                onTriggered: {
 
170
                    var dialog = PopupUtils.open(Qt.resolvedUrl("DeleteConfirmationDialog.qml"),root,{"event": event});
 
171
                    dialog.deleteEvent.connect( function(eventId){
 
172
                        model.removeItem(eventId);
 
173
                        pageStack.pop();
 
174
                    });
 
175
                }
 
176
            }
 
177
        }
 
178
 
 
179
        ToolbarButton {
 
180
            action:Action {
 
181
                text: i18n.tr("Edit");
 
182
                iconSource: Qt.resolvedUrl("edit.svg");
 
183
                onTriggered: {
 
184
                    if( event.itemType === Type.EventOccurrence ) {
 
185
                        var dialog = PopupUtils.open(Qt.resolvedUrl("EditEventConfirmationDialog.qml"),root,{"event": event});
 
186
                        dialog.editEvent.connect( function(eventId){
 
187
                            if( eventId === event.parentId ) {
 
188
                                pageStack.push(Qt.resolvedUrl("NewEvent.qml"),{"event":internal.parentEvent,"model":model});
 
189
                            } else {
 
190
                                pageStack.push(Qt.resolvedUrl("NewEvent.qml"),{"event":event,"model":model});
 
191
                            }
 
192
                        });
 
193
                    } else {
 
194
                        pageStack.push(Qt.resolvedUrl("NewEvent.qml"),{"event":event,"model":model});
 
195
                    }
 
196
                }
 
197
            }
 
198
        }
 
199
    }
 
200
 
 
201
    QtObject{
 
202
        id: internal
 
203
        property var parentEvent;
 
204
    }
 
205
 
 
206
    Rectangle {
 
207
        id: bg
 
208
        color: "white"
85
209
        anchors.fill: parent
86
 
        spacing: units.gu(1)
87
 
 
88
 
        Item{
89
 
            width: parent.width
90
 
            height: timeLabel.height
 
210
    }
 
211
 
 
212
    Scrollbar {
 
213
        flickableItem: flicable
 
214
        align: Qt.AlignTrailing
 
215
    }
 
216
 
 
217
    Flickable{
 
218
        id: flicable
 
219
        width: parent.width
 
220
        height: parent.height
 
221
        clip: true
 
222
 
 
223
        contentHeight: column.height + units.gu(3) /*top margin + spacing */
 
224
        contentWidth: parent.width
 
225
 
 
226
        interactive: contentHeight > height
 
227
 
 
228
        Column{
 
229
            id: column
 
230
            spacing: units.gu(1)
 
231
            anchors{
 
232
                top:parent.top
 
233
                topMargin: units.gu(2)
 
234
                right: parent.right
 
235
                rightMargin: units.gu(2)
 
236
                left:parent.left
 
237
                leftMargin: units.gu(2)
 
238
            }
 
239
            property int timeLabelMaxLen: Math.max( startHeader.headerWidth, endHeader.headerWidth,eventDate.headerWidth)// Dynamic Width
 
240
            EventDetailsInfo{
 
241
                id: eventDate
 
242
                xMargin:column.timeLabelMaxLen
 
243
                header: i18n.tr("Date")
 
244
            }
 
245
            EventDetailsInfo{
 
246
                id: startHeader
 
247
                xMargin:column.timeLabelMaxLen
 
248
                header: i18n.tr("Start")
 
249
            }
 
250
            EventDetailsInfo{
 
251
                id: endHeader
 
252
                xMargin: column.timeLabelMaxLen
 
253
                header: i18n.tr("End")
 
254
            }
 
255
            Row {
 
256
                width: parent.width
 
257
                spacing: units.gu(1)
 
258
                anchors.margins: units.gu(0.5)
 
259
                visible: allDayEventCheckbox.checked
 
260
 
 
261
                Label {
 
262
                    text: i18n.tr("All Day event:")
 
263
                    anchors.verticalCenter: allDayEventCheckbox.verticalCenter
 
264
                    color: headerColor
 
265
                }
 
266
 
 
267
                CheckBox {
 
268
                    id: allDayEventCheckbox
 
269
                    checked: false
 
270
                    enabled: false
 
271
                }
 
272
            }
 
273
 
 
274
            ThinDivider{}
91
275
            Label{
92
 
                id: timeLabel
93
 
                anchors.left: parent.left
94
 
                anchors.verticalCenter: parent.verticalCenter
 
276
                id: titleLabel
95
277
                fontSize: "large"
 
278
                width: parent.width
 
279
                wrapMode: Text.WordWrap
 
280
                color: headerColor
96
281
            }
97
282
            Label{
98
 
                id: dateLabel
99
 
                anchors.right: parent.right
100
 
                anchors.verticalCenter: parent.verticalCenter
 
283
                id: descLabel
 
284
                wrapMode: Text.WordWrap
101
285
                fontSize: "small"
 
286
                width: parent.width
 
287
                color: detailColor
102
288
            }
103
 
        }
104
 
 
105
 
        Label{
106
 
            id: titleLabel
107
 
            fontSize: "x-large"
108
 
            width: parent.width
109
 
            wrapMode: Text.WordWrap
110
 
        }
111
 
        ThinDivider{}
112
 
 
113
 
        Label{
114
 
            id: descLabel
115
 
            // FIXME: temporaty text, in ui there is no field to enter message
116
 
            text:"Hi both, please turn up on time, it gets really busy by 1pm! Anna x"
117
 
            wrapMode: Text.WordWrap
118
 
            fontSize: "medium"
119
 
            width: parent.width
120
 
        }
121
 
 
122
 
        //map control with location
123
 
        Rectangle{
124
 
            id: mapContainer
125
 
            width:parent.width
126
 
            height: units.gu(25)
127
 
            Image {
128
 
                id: mapImage
129
 
                anchors.fill: parent
130
 
                opacity: 0.5
 
289
            ThinDivider{}
 
290
            EventDetailsInfo{
 
291
                id: mapHeader
 
292
                header: i18n.tr("Location")
131
293
            }
132
294
            Label{
133
 
                id:locationLabel
 
295
                id: locationLabel
 
296
                fontSize: "medium"
 
297
                width: parent.width
134
298
                wrapMode: Text.WordWrap
 
299
                color: detailColor
 
300
            }
 
301
 
 
302
            //map control with location
 
303
            Rectangle{
 
304
                id: mapContainer
 
305
                width:parent.width
 
306
                height: units.gu(10)
 
307
                visible: mapImage.status == Image.Ready
 
308
 
 
309
                Image {
 
310
                    id: mapImage
 
311
                    anchors.fill: parent
 
312
                    opacity: 0.5
 
313
                }
 
314
            }
 
315
            ThinDivider{}
 
316
            Label{
 
317
                text: i18n.tr("Guests");
135
318
                fontSize: "medium"
 
319
                color: headerColor
 
320
                font.bold: true
 
321
            }
 
322
            //Guest Entery Model starts
 
323
            Column{
 
324
                id: contactList
 
325
                spacing: units.gu(1)
136
326
                width: parent.width
137
 
                //color:"#c94212"
138
 
                color:"black"
139
 
 
140
 
                anchors {
141
 
                    left: parent.left
142
 
                    leftMargin: units.gu(1)
143
 
                    bottom: parent.bottom
144
 
                    bottomMargin: units.gu(1)
145
 
                }
146
 
            }
147
 
        }
148
 
 
149
 
        Label{
150
 
            text: i18n.tr("People");
151
 
            fontSize: "small"
152
 
        }
153
 
        ThinDivider{}
154
 
 
155
 
        //contact list view
156
 
        ListView {
157
 
            id:contactList
158
 
            width: parent.width
159
 
            height:  {
160
 
                var height = parent.height;
161
 
                //not considering the list view it self
162
 
                for( var i = 0; i < parent.children.length - 1 ; ++i) {
163
 
                    height -= parent.children[i].height;
164
 
                }
165
 
                height -= parent.children.length * parent.spacing;
166
 
            }
167
 
            clip: true
168
 
            model: ListModel {
169
 
                id: contactModel
170
 
            }
171
 
 
172
 
            Label{
173
 
                fontSize: "medium"
174
 
                visible: contactModel.count <= 0
175
 
                anchors.verticalCenter: parent.verticalCenter
176
 
            }
177
 
 
178
 
            delegate: Standard{
179
 
                text: name
180
 
                icon: Qt.resolvedUrl("dummy.png")
181
 
                progression: true
 
327
                clip: true
 
328
                ListModel {
 
329
                    id: contactModel
 
330
                }
 
331
                Repeater{
 
332
                    model: contactModel
 
333
                    delegate: Row{
 
334
                        spacing: units.gu(1)
 
335
                        CheckBox{
 
336
                            checked: participationStatus
 
337
                            enabled: false
 
338
                        }
 
339
                        Label {
 
340
                            text:name
 
341
                            anchors.verticalCenter:  parent.verticalCenter
 
342
                            color: detailColor
 
343
                        }
 
344
                    }
 
345
                }
 
346
            }
 
347
 
 
348
            //Guest Entries ends
 
349
            ThinDivider{}
 
350
            property int recurranceAreaMaxWidth: Math.max( recurrentHeader.headerWidth, reminderHeader.headerWidth,limitHeader.headerWidth) //Dynamic Height
 
351
            EventDetailsInfo{
 
352
                id: recurrentHeader
 
353
                xMargin: column.recurranceAreaMaxWidth
 
354
                header: i18n.tr("This happens")
 
355
            }
 
356
            EventDetailsInfo{
 
357
                id: reminderHeader
 
358
                xMargin: column.recurranceAreaMaxWidth
 
359
                header: i18n.tr("Remind me")
 
360
            }
 
361
            EventDetailsInfo{
 
362
                id: limitHeader
 
363
                xMargin: column.recurranceAreaMaxWidth
 
364
                header: i18n.tr("Repetition Ends")
182
365
            }
183
366
        }
184
367
    }