Refactor web app architecture

10 files changed, 604 insertions, 0 deletions

diff --git a/web/app/view/device/Device.js b/web/app/view/device/Device.js
new file mode 100644
index 000000000..4dfa13c44
--- /dev/null
+++ b/web/app/view/device/Device.js
@@ -0,0 +1,64 @@
+/*
+ * Copyright 2015 Anton Tananaev (anton.tananaev@gmail.com)
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+Ext.define('Traccar.view.device.Device', {
+        extend: 'Ext.grid.Panel',
+    xtype: 'device-view',
+    
+    requires: [
+        'Traccar.view.device.DeviceController'
+    ],
+    
+    controller: 'device',
+
+    title: strings.device_title,
+    selType: 'rowmodel',
+    
+    tbar: [{
+        text:'Add',
+        handler: 'onAddClick',
+        reference: 'deviceAddButton'
+    }, {
+        text:'Edit',
+        disabled: true,
+        handler: 'onEditClick',
+        reference: 'deviceEditButton'
+    }, {
+        text:'Remove',
+        disabled: true,
+        handler: 'onRemoveClick',
+        reference: 'deviceRemoveButton'
+    }, {
+        xtype: 'tbfill'
+    }, {
+        text:'Settings'
+    }, {
+        text:'Logout',
+        handler: 'onLogoutClick'
+    }],
+
+    store: 'Devices',
+    
+    listeners: {
+        selectionchange: 'onSelectionChange'
+    },
+    
+    columns: [
+        { text: strings.device_name, dataIndex: 'name', flex: 1 },
+        { text: strings.device_identifier, dataIndex: 'uniqueId', flex: 1 }
+    ]
+
+});
diff --git a/web/app/view/device/DeviceController.js b/web/app/view/device/DeviceController.js
new file mode 100644
index 000000000..460ba3f9a
--- /dev/null
+++ b/web/app/view/device/DeviceController.js
@@ -0,0 +1,90 @@
+/*
+ * Copyright 2015 Anton Tananaev (anton.tananaev@gmail.com)
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+Ext.define('Traccar.view.device.DeviceController', {
+    extend: 'Ext.app.ViewController',
+    alias: 'controller.device',
+    
+    requires: [
+        'Traccar.view.device.DeviceDialog'
+    ],
+    
+    onLogoutClick: function() {
+        Traccar.LoginManager.logout();
+    },
+    
+    onAddClick: function() {
+        var device = Ext.create('Traccar.model.Device');
+        var dialog = Ext.create('Traccar.view.device.DeviceDialog');
+        dialog.down('form').loadRecord(device);
+        dialog.show();
+    },
+    
+    onEditClick: function() {
+        var device = this.getView().getSelectionModel().getSelection()[0];
+        var dialog = Ext.create('Traccar.view.device.DeviceDialog');
+        dialog.down('form').loadRecord(device);
+        dialog.show();
+    },
+    
+    onRemoveClick: function() {
+        var device = this.getView().getSelectionModel().getSelection()[0];
+        Ext.Msg.show({
+            title: strings.device_dialog,
+            message: strings.device_remove,
+            buttons: Ext.Msg.YESNO,
+            buttonText: {
+                yes: strings.dialog_delete,
+                no: strings.dialog_cancel
+            },
+            fn: function(btn) {
+                if (btn === 'yes') {
+                    var store = Ext.getStore('Devices');
+                    store.remove(device);
+                    store.sync();
+                }
+            }
+        });
+    },
+    
+    onSelectionChange: function(selected) {
+        var disabled = selected.length > 0;
+        this.lookupReference('deviceEditButton').setDisabled(disabled);
+        this.lookupReference('deviceRemoveButton').setDisabled(disabled);
+    },
+    
+    onSaveClick: function(button) {
+        var dialog = button.up('window').down('form');
+        dialog.updateRecord();
+        var store = Ext.getStore('Devices');
+        var device = dialog.getRecord();
+        if (device.phantom) {
+            store.add(device);
+        }
+        store.sync({
+            failure: function(batch) {
+                store.rejectChanges(); // TODO
+                Traccar.ErrorManager.check(true, batch.exceptions[0].getResponse());
+            }
+        });
+        button.up('window').close();
+    },
+    
+    onCancelClick: function(button) {
+        button.up('window').close();
+    }
+
+});
diff --git a/web/app/view/device/DeviceDialog.js b/web/app/view/device/DeviceDialog.js
new file mode 100644
index 000000000..5e41d1ff4
--- /dev/null
+++ b/web/app/view/device/DeviceDialog.js
@@ -0,0 +1,51 @@
+/*
+ * Copyright 2015 Anton Tananaev (anton.tananaev@gmail.com)
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+Ext.define('Traccar.view.device.DeviceDialog', {
+    extend: 'Ext.window.Window',
+    xtype: 'device-dialog',
+    
+    controller: 'device',
+    
+    bodyPadding: styles.panel_padding,
+    title: strings.device_dialog,
+    resizable: false,
+    modal: true,
+    
+    items: {
+        xtype: 'form',
+        items: [{
+            xtype: 'textfield',
+            name: 'name',
+            fieldLabel: strings.device_name,
+            allowBlank: false
+        }, {
+            xtype: 'textfield',
+            name: 'uniqueId',
+            fieldLabel: strings.device_identifier,
+            allowBlank: false
+        }]
+    },
+
+    buttons: [{
+        text: strings.dialog_save,
+        handler: 'onSaveClick'
+    }, {
+        text: strings.dialog_cancel,
+        handler: 'onCancelClick'
+    }]
+
+});
diff --git a/web/app/view/login/Login.js b/web/app/view/login/Login.js
new file mode 100644
index 000000000..3e23c4838
--- /dev/null
+++ b/web/app/view/login/Login.js
@@ -0,0 +1,66 @@
+/*
+ * Copyright 2015 Anton Tananaev (anton.tananaev@gmail.com)
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+Ext.define('Traccar.view.login.Login', {
+    extend: 'Ext.window.Window',
+    
+    requires: [
+        'Traccar.view.login.LoginController'
+    ],
+    
+    controller: 'login',
+
+    bodyPadding: styles.panel_padding,
+    title: strings.login_title,
+    closable: false,
+    resizable: false,
+    modal: true,
+    
+    items: {
+        xtype: 'form',
+        reference: 'form',
+
+        items: [{
+            xtype: 'textfield',
+            name: 'email',
+            fieldLabel: strings.login_email,
+            allowBlank: false,
+            enableKeyEvents: true,
+            listeners: {
+                specialKey: 'onSpecialKey'
+            }
+        }, {
+            xtype: 'textfield',
+            name: 'password',
+            fieldLabel: strings.login_password,
+            inputType: 'password',
+            allowBlank: false,
+            enableKeyEvents: true,
+            listeners: {
+                specialKey: 'onSpecialKey'
+            }
+        }]
+    },
+
+    buttons: [{
+        text: strings.login_register,
+        handler: 'onRegisterClick'
+    }, {
+        text: strings.login_login,
+        handler: 'onLoginClick'
+    }]
+
+});
diff --git a/web/app/view/login/LoginController.js b/web/app/view/login/LoginController.js
new file mode 100644
index 000000000..a88fffc09
--- /dev/null
+++ b/web/app/view/login/LoginController.js
@@ -0,0 +1,61 @@
+/*
+ * Copyright 2015 Anton Tananaev (anton.tananaev@gmail.com)
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+Ext.define('Traccar.view.login.LoginController', {
+    extend: 'Ext.app.ViewController',
+    alias: 'controller.login',
+    
+    requires: [
+        'Traccar.view.login.Register'
+    ],
+
+    onSpecialKey: function(field, e) {
+        if (e.getKey() === e.ENTER) {
+            this.doLogin();
+        }
+    },
+    
+    onLoginClick: function() {
+        this.doLogin();
+    },
+    
+    doLogin: function() {
+        var form = this.lookupReference('form');
+        if (form.isValid()) {
+            Ext.getBody().mask(strings.shared_loading);
+            
+            Traccar.LoginManager.login({
+                data: form.getValues(),
+                scope: this,
+                callback: 'onLoginReturn'
+            });
+        }
+    },
+    
+    onLoginReturn: function(success) {
+        Ext.getBody().unmask();
+        if (success) {
+            this.fireViewEvent('login');
+        } else {
+            Traccar.ErrorManager.error(strings.login_failed);
+        }
+    },
+    
+    onRegisterClick: function() {
+        Ext.create('Traccar.view.login.Register').show();
+    }
+
+});
diff --git a/web/app/view/login/Register.js b/web/app/view/login/Register.js
new file mode 100644
index 000000000..b6b570efe
--- /dev/null
+++ b/web/app/view/login/Register.js
@@ -0,0 +1,64 @@
+/*
+ * Copyright 2015 Anton Tananaev (anton.tananaev@gmail.com)
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+Ext.define('Traccar.view.login.Register', {
+    extend: 'Ext.window.Window',
+    
+    requires: [
+        'Traccar.view.login.RegisterController'
+    ],
+    
+    controller: 'register',
+
+    bodyPadding: styles.panel_padding,
+    title: strings.login_register,
+    resizable: false,
+    modal: true,
+    
+    items: {
+        xtype: 'form',
+        reference: 'form',
+        jsonSubmit: true,
+
+        items: [{
+            xtype: 'textfield',
+            name: 'name',
+            fieldLabel: strings.login_name,
+            allowBlank: false
+        }, {
+            xtype: 'textfield',
+            name: 'email',
+            fieldLabel: strings.login_email,
+            vtype: 'email',
+            allowBlank: false
+        }, {
+            xtype: 'textfield',
+            name: 'password',
+            fieldLabel: strings.login_password,
+            inputType: 'password',
+            allowBlank: false
+        }]
+    },
+
+    buttons: [{
+        text: strings.dialog_save,
+        handler: 'onCreateClick'
+    }, {
+        text: strings.dialog_cancel,
+        handler: 'closeView'
+    }]
+
+});
diff --git a/web/app/view/login/RegisterController.js b/web/app/view/login/RegisterController.js
new file mode 100644
index 000000000..e690b56e8
--- /dev/null
+++ b/web/app/view/login/RegisterController.js
@@ -0,0 +1,40 @@
+/*
+ * Copyright 2015 Anton Tananaev (anton.tananaev@gmail.com)
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+Ext.define('Traccar.view.login.RegisterController', {
+    extend: 'Ext.app.ViewController',
+    alias: 'controller.register',
+
+    onCreateClick: function() {
+        var form = this.lookupReference('form');
+        if (form.isValid()) {
+            Ext.Ajax.request({
+                scope: this,
+                url: '/api/register',
+                jsonData: form.getValues(),
+                callback: this.onCreateReturn
+            });
+        }
+    },
+    
+    onCreateReturn: function(options, success, response) {
+        if (Traccar.ErrorManager.check(success, response)) {
+            this.closeView();
+            Ext.toast(strings.login_created);
+        }
+    }
+
+});
diff --git a/web/app/view/main/Main.js b/web/app/view/main/Main.js
new file mode 100644
index 000000000..d6a350785
--- /dev/null
+++ b/web/app/view/main/Main.js
@@ -0,0 +1,48 @@
+/*
+ * Copyright 2015 Anton Tananaev (anton.tananaev@gmail.com)
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+Ext.define('Traccar.view.main.Main', {
+    extend: 'Ext.container.Viewport',
+
+    requires: [
+        'Traccar.view.device.Device',
+        'Traccar.view.report.Report',
+        'Traccar.view.map.Map'
+    ],
+
+    layout: 'border',
+
+    defaults: {
+        collapsible: true,
+        split: true
+    },
+
+    items: [{
+        region:'west',
+        xtype: 'device-view',
+        width: styles.device_width
+    }, {
+        region: 'south',
+        xtype: 'report-view',
+        header: false,
+        height: styles.report_height
+    }, {
+        region: 'center',
+        xtype: 'map-view',
+        collapsible: false
+    }]
+
+});
diff --git a/web/app/view/map/Map.js b/web/app/view/map/Map.js
new file mode 100644
index 000000000..b63d87c9f
--- /dev/null
+++ b/web/app/view/map/Map.js
@@ -0,0 +1,88 @@
+/*
+ * Copyright 2015 Anton Tananaev (anton.tananaev@gmail.com)
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+Ext.define('Traccar.view.map.Map', {
+    extend: 'Ext.form.Panel',
+    xtype: 'map-view',
+
+    title: strings.map_title,
+    layout: 'fit',
+    
+    /*update: function() {
+        Ext.Ajax.request({
+            scope: this,
+            url: '/api/async',
+            success: function(response) {
+                var data = Ext.decode(response.responseText).data;
+                
+                var i;
+                for (i = 0; i < data.length; i++) {
+                    var iconFeature = new ol.Feature({
+                        geometry: new ol.geom.Point([30, 30])
+                    });
+                    this.vectorSource.addFeature(iconFeature);   
+                }
+                
+                this.update();
+            },
+            failure: function() {
+                // error
+            }
+        });
+    },*/
+
+    listeners: {
+        afterrender: function() {
+
+            /*var bindKey = 'AseEs0DLJhLlTNoxbNXu7DGsnnH4UoWuGue7-irwKkE3fffaClwc9q_Mr6AyHY8F';
+
+            var layer = new ol.layer.Tile({ source: new ol.source.BingMaps({
+                key: bindKey,
+                imagerySet: 'Road'
+            })});
+
+            var layer = new ol.layer.Tile({ source: new ol.source.BingMaps({
+                key: bindKey,
+                imagerySet: 'Aerial'
+            })});*/
+
+            var layer = new ol.layer.Tile({ source: new ol.source.OSM({
+            })});
+            
+            this.vectorSource = new ol.source.Vector({});
+            var vectorLayer = new ol.layer.Vector({ source: this.vectorSource });
+
+            var view = new ol.View({
+                center: ol.proj.transform(styles.map_center, 'EPSG:4326', 'EPSG:3857'),
+                zoom: styles.map_zoom,
+                maxZoom: styles.map_max_zoom
+            });
+
+            this.map = new ol.Map({
+                target: this.body.dom.id,
+                layers: [ layer, vectorLayer ],
+                view: view
+            });
+            
+            //this.update();
+        },
+
+        resize: function() {
+            this.map.updateSize();
+        }
+    }
+
+});
diff --git a/web/app/view/report/Report.js b/web/app/view/report/Report.js
new file mode 100644
index 000000000..29fa6248a
--- /dev/null
+++ b/web/app/view/report/Report.js
@@ -0,0 +1,32 @@
+/*
+ * Copyright 2015 Anton Tananaev (anton.tananaev@gmail.com)
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+Ext.define('Traccar.view.report.Report', {
+    extend: 'Ext.grid.Panel',
+    xtype: 'report-view',
+
+    title: strings.report_title,
+
+    tbar: [{
+        text:'Do Something'
+    }],
+
+    columns: [
+        { text: "Column1", dataIndex: 'c1', flex: 1 },
+        { text: "Column2", dataIndex: 'c2', flex: 1 }
+    ]
+
+});