source: Dev/trunk/src/client/util/checkstyle/checkstyleReport.html @ 532

Last change on this file since 532 was 483, checked in by hendrikvanantwerpen, 11 years ago

Added Dojo 1.9.3 release.
File size: 14.7 KB
Line 
1<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
2<html>
3<head>
4        <style type="text/css">
5                @import "../../dojo/resources/dojo.css";
6                @import "../../dojox/grid/resources/Grid.css";
7                @import "../../dojox/grid/resources/soriaGrid.css";
8
9                html, body, #main{     
10                        width: 100%;    /* make the body expand to fill the visible window */
11                        height: 100%;
12                        overflow: hidden;       /* erase window level scrollbars */
13                        padding: 0 0 0 0;
14                        margin: 0 0 0 0;
15                        font: 10pt Arial,Myriad,Tahoma,Verdana,sans-serif;
16                }
17               
18                #checks label {
19                        padding: 4px;
20                        float: left;
21                }
22                #checks input {
23                        float: right;
24                }
25                #checks div {
26                        height: 15px;
27                        padding: 4px;
28                        margin-top: 5px;
29                }
30        </style>
31
32        <!-- required: the default dijit theme: -->
33        <link id="themeStyles" rel="stylesheet" href="../../dijit/themes/soria/soria.css">
34
35        <!-- required: dojo.js -->
36        <script type="text/javascript" src="../../dojo/dojo.js"
37                data-dojo-config="isDebug: true, parseOnLoad: true"></script>
38
39        <script type="text/javascript">
40                dojo.require("dijit.dijit"); // optimize: load dijit layer
41                dojo.require("dijit.layout.BorderContainer");
42                dojo.require("dijit.form.FilteringSelect");
43                dojo.require("dijit.form.Button");
44                dojo.require("dijit.form.ToggleButton");
45                dojo.require("dijit.layout.TabContainer");
46                dojo.require("dijit.layout.ContentPane");
47                dojo.require("dojox.grid.DataGrid");
48                dojo.require("dojo.data.ItemFileReadStore");
49                dojo.require("dojo.date.locale");
50                dojo.require("dijit.Dialog");
51        </script>
52
53       
54        <script type="text/javascript" src="checkstyleUtil.js"></script>
55        <script type="text/javascript">
56                var singleFileStore;
57                var errorQuery;
58                var saveErrorMsg = "You may need to rename the checkstyle.php.rename.html file to checkstyle.php."
59                                                                + "\nPlease read the readme.txt file in the /util/checkstyle folder.";
60
61                dojo.addOnLoad(function(){
62                        checkstyleStore.fetch({query: {date : '*'}, onComplete: function(items){
63                                var checkstyleReportDate = new Date(checkstyleStore.getValue(items[0], "date"));
64                                var dateStr = dojo.date.locale.format((new Date(checkstyleReportDate)), {formatLength: "medium"});
65                                       
66                                document.title = "Dojo Checkstyle report generated on " + dateStr;
67                                dojo.byId("reportDate").innerHTML = dateStr;   
68                        }});
69                       
70                        dojo.connect(dijit.byId("messagesGrid"), "onRowClick", doEdit);
71                       
72                });
73                var cachedFiles = {};
74                var changedFiles = [];
75                var navKeys = {};
76                dojo.forEach([dojo.keys.UP_ARROW, dojo.keys.DOWN_ARROW,
77                                                dojo.keys.LEFT_ARROW, dojo.keys.RIGHT_ARROW,
78                                                dojo.keys.ENTER], function(code){
79                                                        navKeys[code] = true;
80                                                });
81                function updateLine(evt) {
82                        evt = dojo.fixEvent(evt);
83                        if (navKeys[evt.keyCode]) {
84                                dojo.byId("lineNumber").innerHTML = getCursorPosition(evt.target);
85                        }
86                }
87               
88                function getCursorPosition(textarea) {
89                        if(textarea.selectionStart){
90                                return textarea.selectionStart;
91                        }else if(dojo.doc.selection){ //IE
92                                var range = dojo.doc.selection.createRange();
93                                return range;
94                        }
95                }
96
97                function onFolderClick(evt) {
98                        var folderName = evt.grid.store.getValue(
99                                                                evt.grid.getItem(evt.rowIndex), "file");
100                        if (dojo.trim(folderName) == "All") {
101                                folderName = "";
102                        } else if (folderName.charAt(folderName.length - 1) != "/"){
103                                folderName += "/";
104                        }
105
106                        showAllErrors({file: folderName + "*", folder: 0});
107                        dijit.byId("mainTab").selectChild(dijit.byId("errorsTab"));
108                }
109                var chartInitialized = false;
110
111                dojo.subscribe("mainTab-selectChild", function(tab){
112                        if(chartInitialized || tab.id != "chartTab"){
113                                return;
114                        }
115                        chartInitialized = true;
116                        checkstyleStore.fetch({query: {file: "*"}, onComplete: initializeChart});
117                });
118                function initializeChart(items) {
119                       
120                        dojo.require("dojox.charting.DataChart");
121                        dojo.require("dojox.charting.action2d.Highlight");
122                        dojo.require("dojox.charting.action2d.Tooltip");
123                        dojo.require("dojox.charting.plot2d.Columns");
124                       
125                        var folderCounts = {};
126                                               
127                        dojo.forEach(items, function(item){
128                          var fileName = checkstyleStore.getValue(item, "file");
129                         
130                          var parts = fileName.split("/");
131                          if (parts.length < 2) {
132                                return;
133                          }
134                          var folderName = parts[0] + "/" + parts[1];
135                         
136                          if (!folderCounts[folderName]) {
137                                folderCounts[folderName] = 0;
138                          }
139                          folderCounts[folderName]++;
140                        });
141                       
142                        var folderCountsArr = [];
143
144                        for (var x in folderCounts) {
145                          folderCountsArr.push({"folder": x, count: folderCounts[x]});
146                        }
147                        folderCountsArr.sort(function(a, b){
148                          if(a.count < b.count) {
149                                return 1;
150                          } else if(a.count > b.count){
151                                return -1;
152                          }
153                          return 0;
154                        });
155
156                        if (folderCountsArr.length > 20) {
157                                folderCountsArr = folderCountsArr.slice(0, 20);
158                        }
159                        dojo.forEach(folderCountsArr, function(item, index){
160                                item.id = index + 1;
161                        });
162                        var chartStore = new dojo.data.ItemFileReadStore({
163                                data: {
164                                        identifier: 'id',
165                                        label: 'folder',
166                                        items: folderCountsArr
167                                }
168                        });
169                        var chart = new dojox.charting.DataChart("chart", {
170                                displayRange:12,
171                                yaxis:{
172                                        max: folderCountsArr[0].count + 10,
173                                        min: Math.max(0, folderCountsArr[folderCountsArr.length -1].count - 10),
174                                        majorTickStep: Math.round(folderCountsArr[0].count / 10),
175                                        maxLabelSize:20,
176                                        labelFunc: function(val) {
177                                                return val;
178                                        }
179                                },
180                                xaxis: {
181                                        labelFunc: "seriesLabels",
182                                        maxLabelSize:30
183                                },
184                                scroll:false,
185                                type: dojox.charting.plot2d.Columns
186                        });
187                       
188                       
189                        var dc = dojox.charting;
190                        new dc.action2d.Highlight(chart, "default");
191                        new dc.action2d.Tooltip(chart, "default");
192                       
193                        chart.setStore(chartStore, {folder: "*"}, "count");     
194                }
195               
196                function formatMessage(item) {
197                        return (singleFileStore || checkstyleStore).getValue(item, "msg");
198                }
199               
200                function doEdit(item) {
201                        var grid = dijit.byId("messagesGrid");
202                        var textarea = dojo.byId("editInput");
203                       
204                        var q = {folder: 0};
205                       
206                        if (errorQuery) {
207                                q.file = errorQuery.file;
208                        }
209                       
210                        grid.store.fetch({
211                                query: q,
212                                start: item.rowIndex,
213                                count: 1,
214                                onComplete: function(items) {
215                                        var file = grid.store.getValue(items[0], "file");
216                                        var line = grid.store.getValue(items[0], "line");
217
218                                        if (textarea._file != file) {
219                                                if (textarea._file) {
220                                                        if(cachedFiles[textarea._file] && cachedFiles[textarea._file] != textarea.value) {
221                                                                changedFiles.push(textarea._file);
222                                                        }
223                                                        cachedFiles[textarea._file] = textarea.value;
224                                                }
225                                                textarea._file = file;
226                                                if (cachedFiles[file]) {
227                                                        textarea.value = cachedFiles[file];
228                                                }
229                                                else {
230                                                        loadFile(file, line);
231                                                }
232                                        } else {
233                                                gotoLine(line);
234                                        }
235                                }
236                        });
237                }
238               
239                function loadFile(file, line) {
240                        var textarea = dojo.byId("editInput");
241                        textarea.value = "Loading....";
242                        dojo.xhrGet({
243                                url: "../../" + file,
244                                type: "text",
245                                load: function(text)  {
246                                        textarea.value = text;
247                                        dijit.byId("showFileErrorsBtn").attr("disabled", false);
248                                        gotoLine(line);
249                                }
250                        });
251                }
252               
253                function gotoLine(line) {
254                        var count = line;
255                        var textarea = dojo.byId("editInput");
256                        var str = textarea.value;
257                        var i;
258                        for (i = 0; i < str.length && count > 1; i++) {
259                                if (str.charAt(i) == "\n") {
260                                        count--;
261                                }
262                        }
263                        var nextNL = str.indexOf("\n", i + 1);
264                        selectChars(textarea, i, nextNL < 0 ? str.length - 1 : nextNL);
265                }
266               
267                function selectChars(textarea, start, end) {
268                       
269                        if(textarea.setSelectionRange){
270                                setTimeout(function(){
271                                //      textarea.focus();
272                                        textarea.setSelectionRange(start, start + 1);   
273                                        var ev = document.createEvent("KeyEvents");
274                                        ev.initKeyEvent("keypress", true, true, window, false, false, false, false, 0,
275                                                textarea.value.charCodeAt(start));
276                                        textarea.dispatchEvent(ev);
277                                        textarea.setSelectionRange(start, end);
278                                        textarea.focus();
279                                }, 10);
280                               
281                        }else if(dojo.doc.selection){ //IE
282                               
283                                var range = dojo.doc.selection.createRange();
284                                // delete overflow characters
285                                range.moveStart("character", start);
286                                range.text = '';
287                                // show cursor
288                                range.select();
289                        }
290                }
291               
292                function showCurrentErrors(){
293                        dijit.byId("showAllErrorsBtn").attr("checked", false);
294                        dijit.byId("showFileErrorsBtn").attr("checked", true);
295                       
296                        var textarea = dojo.byId("editInput");
297                        var value = textarea.value;
298                        checkstyleUtil.clear();
299
300                        checkstyleUtil.applyRules(textarea._file, value);
301                        var report = checkstyleUtil.generateReport(true);
302                        var storeData = dojo.eval("(" + report + ")");
303                       
304                        singleFileStore = new dojo.data.ItemFileReadStore({
305                                data: storeData
306                        });
307
308                        var grid = dijit.byId("messagesGrid");
309                        errorQuery = null;
310                        grid.setStore(singleFileStore, {folder: 0}, grid.attr("queryOptions"));
311                }
312
313                function showAllErrors(query){
314                        errorQuery = query;
315               
316                        dijit.byId("showFileErrorsBtn").attr("checked", false);
317                        dijit.byId("showAllErrorsBtn").attr("checked", true);
318                        var grid = dijit.byId("messagesGrid");
319                        singleFileStore = null;
320                        grid.setStore(checkstyleStore, query || grid.attr("query"), grid.attr("queryOptions"));
321                }
322               
323                function makeSimpleFixes() {
324                        var textarea = dojo.byId("editInput");
325               
326                        textarea.value = checkstyleUtil.makeSimpleFixes(textarea.value);
327                       
328                        if(dojo.indexOf(changedFiles, textarea._file) < 0) {
329                                changedFiles.push(textarea._file);
330                        }
331                        showCurrentErrors();
332                }
333               
334                function saveFile(fileName, contents, callback) {
335                        var textarea = dojo.byId("editInput");
336                        fileName = fileName || textarea._file;
337                        contents = contents || textarea.value;
338                       
339                        dojo.xhrPost({
340                                url: "checkstyle.php",
341                                content: {
342                                        action: "save",
343                                        filename: fileName,
344                                        contents: contents
345                                },
346                                handle: function(text, reqObj){
347                                        if (reqObj.xhr.readyState != 4) {
348                                                return;
349                                        }
350                                        if (reqObj.xhr.status == 200) {
351                                                if (!callback) {
352                                                        alert("File " + fileName + " saved");
353                                                } else {
354                                                        callback(true);
355                                                }
356                                                var idx = dojo.indexOf(changedFiles, fileName);
357                                                array.splice(idx, 1);
358                                        }
359                                        else if (callback){
360                                                callback(false);
361                                        } else {
362                                                alert("Failed to save file " + fileName + ". " + saveErrorMsg);
363                                        }
364                                }
365                        });
366                }
367               
368                function showSaveDialog(){
369                        if (changedFiles.length == 0) {
370                                alert("No files have been altered yet.");
371                                return;
372                        }
373                       
374                        var checksNode = dojo.byId("checks");
375                        dojo.empty(checksNode);
376                       
377                        dojo.forEach(changedFiles, function(fileName){
378                                dojo.create("div", {
379                                        innerHTML: "<label for='" + fileName + "'>" + fileName + "</label>"
380                                                + "<input type='checkbox' id='" + fileName + "'></input>"
381                                }, checksNode);
382                        });
383                        dijit.byId("changedFilesDlg").show();
384                }
385               
386                function saveAllChangedFiles(){
387                        var successes = 0;
388                        var inputs = dojo.query("input", "checks").forEach(
389                                function(input) {
390                                        if (!input.checked) {
391                                                return;
392                                        }
393                                        var fileName = dojo.attr(input, "id");
394                                        saveFile(fileName, cachedFiles[fileName], function(success){
395                                                if (!success) {
396                                                        alert("Failed to save " + fileName
397                                                                + saveErrorMsg);
398                                                } else {
399                                                        successes++;
400                                                        if (successes == inputs.length) {
401                                                                alert("All files saved successfully");
402                                                                dijit.byId("changedFilesDlg").hide();
403                                                        }
404                                                }
405                                        });
406                                }
407                        );
408                }
409               
410                var checkstyleStore;
411               
412                dojo.xhrGet({
413                        url: "checkstyleData.js",
414                        sync: true,
415                        handleAs: "json",
416                        load: function(data) {
417                                checkstyleStore = new dojo.data.ItemFileReadStore({
418                                        data: data
419                                });
420                        },
421                        error: function(){
422                                alert("Error: could not load the checkstyle data. You should run the checkstyle tool in util/checkstyle/");
423                        }
424                });
425        </script>
426</head>
427<body class="soria">
428       
429        <div dojoType="dijit.layout.BorderContainer" design="sidebar" id="main">
430                <div id="folders" dojoType="dijit.layout.ContentPane" region="leading"
431                        style="width: 200px;padding: 0;" splitter="true">
432                        <table dojoType="dojox.grid.DataGrid"id="folderGrid"
433                                store="checkstyleStore" style="height: 100%; width: 100%;"
434                                query="{ folder: 1 }" rowsPerPage="20" rowSelector="20px"
435                                onCellClick="onFolderClick(arguments[0])"
436                                >
437                                <thead>
438                                        <tr>
439                                                <th field="file" width="auto">Folders</th>
440                                        </tr>
441                                </thead>
442                        </table>
443                </div>
444                <div id="header" dojoType="dijit.layout.ContentPane" region="top" style="height: 50px;">
445                        <h1>Checkstyle results from <span id="reportDate"></span>
446                                Total errors:<span id="totalErrors"></span>
447                        </h1>
448                </div>
449                <div id="mainTab" dojoType="dijit.layout.TabContainer" region="center" style="padding: 0;">
450                        <div id="errorsTab" dojoType="dijit.layout.BorderContainer" title="Error List" style="height:100%;width:100%;">
451                                <table dojoType="dojox.grid.DataGrid" id="messagesGrid"
452                                        class="checkstyleGrid" store="checkstyleStore"
453                                        query="{ folder: 0 }" rowsPerPage="50" rowSelector="20px"
454                                        region="top"
455                                        style="height:50%;"
456                                        >
457                                        <script type="dojo/connect" data-dojo-event="_onFetchBegin" data-dojo-args="size, req">
458                                                dojo.byId("totalErrors").innerHTML = size;
459                                        </script>
460                                        <thead>
461                                                <tr>
462                                                        <th field="file" width="300px">File</th>
463                                                        <th field="line" width="40px">Line</th>
464                                                        <th field="msg" width="auto" formatter="formatMessage">Message</th>
465                                                </tr>
466                                        </thead>
467                                </table>
468                                <div dojoType="dijit.layout.ContentPane" region="bottom" splitter="true" style="height:45%;">
469                                        <div>
470                                                <div dojoType="dijit.form.ToggleButton"
471                                                         id="showFileErrorsBtn"
472                                                         label="Show File Errors"
473                                                         iconClass="dijitRadioIcon"
474                                                         onclick="showCurrentErrors()"
475                                                         disabled="true"
476                                                         ></div>
477                                                <div dojoType="dijit.form.ToggleButton"
478                                                         id="showAllErrorsBtn"
479                                                         label="Show All Errors"
480                                                         iconClass="dijitRadioIcon"
481                                                         checked="true"
482                                                         onclick="showAllErrors()"></div>
483                                                <div dojoType="dijit.form.Button"
484                                                         id="makeFixesBtn"
485                                                         label="Make Fixes"
486                                                         onclick="makeSimpleFixes()"></div>
487                                                <div dojoType="dijit.form.Button"
488                                                         id="saveFileBtn"
489                                                         label="Save"
490                                                         onclick="saveFile()"></div>
491                                                <div dojoType="dijit.form.Button"
492                                                         id="saveAllFileBtn"
493                                                         label="Save All"
494                                                         onclick="showSaveDialog()"></div>
495                                        </div>
496                                        <div>
497                                                <textarea id="editInput" rows="7" cols="100"></textarea>
498                                        </div>
499                                </div>
500                        </div>
501                        <div id="chartTab" dojoType="dijit.layout.BorderContainer" style="width:100%;height:100%;" title="Worst Modules">
502                                <div dojoType="dijit.layout.ContentPane" region="top">
503                                        This chart displays the folders of depth 2 in descending order of checkstyle violations.
504                                </div>
505                                <div dojoType="dijit.layout.ContentPane" region="center">
506                                        <div id="chart" style="height:400px; width: 1000px;"></div>
507                                </div>
508                        </div>
509                </div>
510        </div>
511        <div dojoType="dijit.Dialog" id="changedFilesDlg" title="Save Changed Files">
512                <div id="checks">
513                       
514                </div>
515                <div dojoType="dijit.form.Button" label="Save" onclick="saveAllChangedFiles()"></div>
516                <div dojoType="dijit.form.Button" label="Cancel" onclick="dijit.byId('changedFilesDlg').hide();"></div>
517        </div>
518</body>
519</html>
Note: See TracBrowser for help on using the repository browser.