Project

General

Profile

Revision b12671be

Added by shye0000 about 9 years ago

enhanced code editor admin interface

View differences:

Enhanced_Node _Editor_adminInterface/GraphsNodeWin.js
1
/***************************************
2
* Copyright 2010-2014 CNES - CENTRE NATIONAL d'ETUDES SPATIALES
3
* 
4
* This file is part of SITools2.
5
* 
6
* SITools2 is free software: you can redistribute it and/or modify
7
* it under the terms of the GNU General Public License as published by
8
* the Free Software Foundation, either version 3 of the License, or
9
* (at your option) any later version.
10
* 
11
* SITools2 is distributed in the hope that it will be useful,
12
* but WITHOUT ANY WARRANTY; without even the implied warranty of
13
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
14
* GNU General Public License for more details.
15
* 
16
* You should have received a copy of the GNU General Public License
17
* along with SITools2.  If not, see <http://www.gnu.org/licenses/>.
18
***************************************/
19
/*global Ext, sitools, ID, i18n, document, showResponse, alertFailure, LOCALE, ImageChooser, 
20
 showHelp*/
21
Ext.namespace('sitools.component.projects');
22

  
23
Ext.define('sitools.admin.graphs.GraphsNodeWin', {
24
    extend : 'Ext.Window',
25
    width : 350,
26
    modal : true,
27
    closable : false,
28

  
29
    initComponent : function () {
30
        projectId = this.projectId;
31
        this.title = i18n.get('label.nodeDescription');
32
        /* paramétres du formulaire */
33
        this.itemsForm = [{
34
            fieldLabel : i18n.get('label.name'),
35
            name : 'name',
36
            anchor : '100%',
37
            allowBlank : false
38
        }, {
39
            fieldLabel : i18n.get('label.description'),
40
            name : 'description',
41
            anchor : '100%'
42
        }, {
43
            xtype : 'sitoolsSelectImage',
44
            name : 'image',
45
            fieldLabel : i18n.get('label.image'),
46
            anchor : '100%',
47
            growMax : 400
48
        },{
49
            xtype: 'button',
50
            id: 'linktodataset',
51
            text: '<span style="">Link to a dataset</span>',
52
            anchor: '65%',
53
            margin: '0 5% 0 0',
54
            handler: function() {
55
                up = Ext.create("sitools.admin.graphs.GraphsDatasetWin", {
56
                    graphTree : true,
57
                    url : loadUrl.get('APP_URL') + '/projects/' + projectId + '?media=json',
58
                    mode : 'link',
59
                    form : form
60
                });
61
                up.show(this);
62

  
63
            }
64
        }, {
65
            xtype: 'button',
66
            id: 'unlinkbutton',
67
            text: '<span style="">Unlink</span>',
68
            disabled:true,
69
            anchor: '35%',
70
            margin: '0 0 0 5%',
71
            handler: function() {
72
                Ext.getCmp('unlinkbutton').setDisabled(true);
73
                form.findField('nbRecord').setValue('');
74
                form.findField('datasetURL').setValue('');
75
                Ext.getCmp('datatablecheckbox').setValue(false);
76
                Ext.getCmp('queryformcheckbox').setValue(false);
77
                Ext.getCmp('datatablecheckbox').setDisabled(true);
78
                Ext.getCmp('queryformcheckbox').setDisabled(true);
79
            }
80
        },{
81
            name : 'nbRecord',
82
            fieldLabel : 'Number of records',
83
            readOnly: true,
84
            cls: 'x-item-disabled',
85
            anchor : '100%'
86
        },{
87
            name : 'datasetURL',
88
            fieldLabel : 'Dataset URL',
89
            readOnly: true,
90
            cls: 'x-item-disabled',
91
            anchor : '100%'
92
        }, {
93
            xtype: 'checkboxfield',
94
            boxLabel: 'Data table',
95
            name: 'datatable',
96
            width: '40%',
97
            margin: '0 10% 0 10%',
98
            disabled: true,
99
            id: 'datatablecheckbox'
100
        }, {
101
            xtype: 'checkboxfield',
102
            boxLabel: 'Query form',
103
            name: 'queryform',
104
            width: '40%',
105
            margin: '0 10% 0 10%',
106
            disabled:true,
107
            id: 'queryformcheckbox'
108
        } ];
109
        this.bbar = {
110
            xtype : 'toolbar',
111
            defaults : {
112
                scope : this
113
            },
114
            items : [ '->', {
115
                text : i18n.get('label.ok'),
116
                handler : this._onOK
117
            }, {
118
                text : i18n.get('label.cancel'),
119
                handler : this._onCancel
120
            } ]
121
        };
122

  
123
        this.formPanel = Ext.create('Ext.form.Panel', {
124
            labelWidth : 100,
125
            border : false,
126
            bodyBorder : false,
127
            padding : '5 5 5 5',
128
            defaultType : 'textfield',
129
            items : this.itemsForm
130

  
131
        });
132

  
133
        this.items = [ this.formPanel ];
134
        this.callParent(arguments);
135
    },
136

  
137
    afterRender : function () {
138
        this.callParent(arguments);
139

  
140
        if (this.mode == 'edit') {
141
            var node = this.node;
142
            form = this.formPanel.getForm();
143
            var rec = {};
144
            if (node.get('text').search("clickDatasetIcone") != -1){
145
                rec.name = node.get('text').split('<br/>')[0];
146
                //alert(node.get('text'));
147
                rec.datasetURL = node.get('text').split('clickDatasetIcone(\'')[1].split('\', \'')[0];
148
                rec.nbRecord = node.get('nbRecord');
149
                if (node.get('text').search("Display data") != -1){
150
                    Ext.getCmp('datatablecheckbox').setValue(true);
151
                }
152
                if (node.get('text').search("Query form") != -1){
153
                    Ext.getCmp('queryformcheckbox').setValue(true);
154
                }
155
            } else {
156
                rec.name = node.get('text');
157
            }
158
            rec.image = node.get('image').url;
159
            rec.description = node.get('description');
160
            form.setValues(rec);
161
        } else {
162
            form = this.formPanel.getForm();
163
        }
164
        if (!Ext.isEmpty(form.findField('datasetURL').getValue())){
165
            Ext.getCmp('linktodataset').setText('<span style="">Link to another dataset</span>');
166
            Ext.getCmp('unlinkbutton').setDisabled(false);
167
            Ext.getCmp('datatablecheckbox').setDisabled(false);
168
            Ext.getCmp('queryformcheckbox').setDisabled(false);
169

  
170
        }
171
    },
172

  
173
    _onOK : function () {
174
        var form = this.formPanel.getForm();
175
        //alert(form.findField('datatable').checked);
176
        if (!form.isValid()) {
177
            return;
178
        }
179

  
180
        var values = form.getValues();
181

  
182
        if (!Ext.isEmpty(values.datasetURL) && !form.findField('datatable').checked && !form.findField('queryform').checked) {
183
            Ext.Msg.alert("Form error", "Please choose a method to show data.");
184
            return false;
185
        }
186
        var image = {};
187
        console.log(values);
188
        if (!Ext.isEmpty(values.image)) {
189
            image.url = values.image;
190
            image.type = "Image";
191
            image.mediaType = "Image";
192
        }
193
        if (this.mode == 'edit') {
194
            if (!Ext.isEmpty(values.datasetURL)) {
195
                var namee = values.name;
196
                if (form.findField('datatable').checked || form.findField('queryform').checked) {
197
                    namee += '<br/>';
198
                }
199
                if (form.findField('datatable').checked) {
200
                    namee += '<a href="#" class="overDatasetService" onClick="sitools.user.utils.DatasetUtils.clickDatasetIcone(\''+values.datasetURL
201
                    +'\', \'data\');return false;"><img class="datasetochart_icon" src="/sitools/common/res/images/icons/32x32/tree_datasets_32.png" data-qtip="Display data"></a>';
202
                }
203
                if (form.findField('queryform').checked) {
204
                    namee += '<a href="#" class="overDatasetService" onClick="sitools.user.utils.DatasetUtils.clickDatasetIcone(\''+values.datasetURL
205
                    +'\', \'forms\');return false;"><img class="datasetochart_icon" src="/sitools/common/res/images/icons/32x32/openSearch_32.png" data-qtip="Query form"></a>';
206
                }
207
                this.node.set('text', namee);
208
            } else {
209
                this.node.set('text', values.name);
210
            }
211
            if (!Ext.isEmpty(values.nbRecord)) {
212
                this.node.set('nbRecord', values.nbRecord);
213
            } else this.node.set('nbRecord', '0');
214
            this.node.set('description', values.description);
215
            this.node.set('image', image);
216
            console.log(this.node);
217
            var saveButton = this.graphTree.graphsCrud.down('button#saveGraphBtnId');
218
            saveButton.addCls('not-save-textfield');
219
        } else {
220
            var newNode = Ext.create('sitools.admin.graphs.GraphNodeModel', {
221
                image : image,
222
                description : values.description,
223
                type : "node",
224
                children : []
225
            });
226
            //console.log(newNode);
227
            if (!Ext.isEmpty(values.nbRecord)) {
228
                newNode.set('nbRecord', values.nbRecord);
229
            } else newNode.set('nbRecord', '0');
230
            if (!Ext.isEmpty(values.datasetURL)) {
231
                var namee = values.name;
232
                if (form.findField('datatable').checked || form.findField('queryform').checked) {
233
                    namee += '<br/>';
234
                }
235
                if (form.findField('datatable').checked) {
236
                    namee += '<a href="#" class="overDatasetService" onClick="sitools.user.utils.DatasetUtils.clickDatasetIcone(\''+values.datasetURL
237
                    +'\', \'data\');return false;"><img class="datasetochart_icon" src="/sitools/common/res/images/icons/32x32/tree_datasets_32.png" data-qtip="Display data"></a>';
238
                }
239
                if (form.findField('queryform').checked) {
240
                    namee += '<a href="#" class="overDatasetService" onClick="sitools.user.utils.DatasetUtils.clickDatasetIcone(\''+values.datasetURL
241
                    +'\', \'forms\');return false;"><img class="datasetochart_icon" src="/sitools/common/res/images/icons/32x32/openSearch_32.png" data-qtip="Query form"></a>';
242
                }
243
                newNode.set('text', namee);
244
            } else {
245
                newNode.set('text', values.name);
246
            }
247

  
248
            if (!this.node.isExpanded()) {
249
                this.node.expand();
250
            }
251
            this.node.appendChild(newNode);
252
        }
253

  
254
        //var saveButton = this.graphTree.graphsCrud.down('button#saveGraphBtnId');
255
        //saveButton.addCls('not-save-textfield');
256
        //console.log(saveButton);
257
        this.close();
258
    },
259

  
260
    _onCancel : function () {
261
        this.destroy();
262
    },
263

  
264
    _onUpload : function () {
265
        Ext.msg.alert("Information", "TODO");
266
    }
267

  
268
});

Also available in: Unified diff