1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
|
(function (FMS, Backbone, _, $) {
_.extend( FMS, {
DetailsView: FMS.FMSView.extend({
template: 'details',
id: 'details-page',
prev: 'photo',
next: 'submit-start',
bottomMargin: -20,
events: {
'pagehide': 'destroy',
'pagebeforeshow': 'beforeDisplay',
'pageshow': 'afterDisplay',
'vclick .ui-btn-left': 'onClickButtonPrev',
'vclick .ui-btn-right': 'onClickButtonNext',
'blur textarea': 'updateCurrentReport',
'change select': 'updateSelect',
'blur input': 'updateCurrentReport'
},
afterRender: function() {
this.$('#form_category').attr('data-role', 'none');
if ( this.model.get('category') ) {
this.$('#form_category').val( this.model.get('category') );
}
this.setSelectClass();
},
beforeDisplay: function() {
this.fixPageHeight();
var header = this.$("div[data-role='header']:visible"),
detail = this.$('#form_detail'),
top = detail.position().top,
viewHeight = $(window).height(),
contentHeight = viewHeight - header.outerHeight() + 15;
detail.height( contentHeight - top );
},
onClickButtonPrev: function(e) {
e.preventDefault();
this.updateCurrentReport();
this.navigate( this.prev, true );
},
onClickButtonNext: function(e) {
e.preventDefault();
// dismiss on screen keyboard
$('.ui-btn-right').focus();
this.clearValidationErrors();
var valid = 1;
if ( !$('#form_title').val() ) {
valid = 0;
this.validationError( 'form_title', FMS.validationStrings.title );
}
if ( !$('#form_detail').val() ) {
valid = 0;
this.validationError( 'form_detail', FMS.validationStrings.detail );
}
var cat = $('#form_category').val();
if ( cat == '-- Pick a category --' ) {
valid = 0;
this.validationError( 'form_category', FMS.validationStrings.category );
}
if ( valid ) {
this.clearValidationErrors();
this.updateCurrentReport();
if ( FMS.isOffline ) {
this.navigate( 'save_offline' );
} else {
var that = this;
$.ajax( {
url: CONFIG.FMS_URL + '/report/new/category_extras',
type: 'POST',
data: {
category: this.model.get('category'),
latitude: this.model.get('lat'),
longitude: this.model.get('lon')
},
dataType: 'json',
timeout: 30000,
success: function( data, status ) {
if ( data && data.category_extra && data.category_extra.length > 0 ) {
that.model.set('category_extras', data.category_extra);
that.navigate('details_extra');
} else {
that.navigate( that.next );
}
},
error: function() {
that.displayAlert(FMS.strings.category_extra_check_error);
}
} );
}
}
},
validationError: function(id, error) {
var el_id = '#' + id;
var el = $(el_id);
el.addClass('error');
if ( el.val() === '' ) {
el.attr('orig-placeholder', el.attr('placeholder'));
el.attr('placeholder', error);
}
},
clearValidationErrors: function() {
$('.error').removeClass('error');
$('.error').each(function(el) { if ( el.attr('orig-placeholder') ) { el.attr('placeholder', el.attr('orig-placeholder') ); } } );
},
setSelectClass: function() {
var cat = this.$('#form_category');
if ( cat.val() !== "" && cat.val() !== '-- Pick a category --' ) {
cat.removeClass('noselection');
} else {
cat.addClass('noselection');
}
},
updateSelect: function() {
this.updateCurrentReport();
this.setSelectClass();
},
updateCurrentReport: function() {
var category = $('#form_category').val();
if ( category === '-- Pick a category --' ) {
category = '';
}
if ( category && $('#form_title').val() && $('#form_detail').val() ) {
$('#next').addClass('page_complete_btn');
} else {
$('#next').removeClass('page_complete_btn');
}
this.model.set('category', category);
this.model.set('title', $('#form_title').val());
this.model.set('details', $('#form_detail').val());
FMS.saveCurrentDraft();
}
})
});
})(FMS, Backbone, _, $);
|
