-
-
Notifications
You must be signed in to change notification settings - Fork 149
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat(dbmonster): make dbmonster aot example work again (#101)
* fix(repeat): reuse views when re-binding and allow null observer for non-collection iterables * feat(dbmonster): make dbmonster aot example work again
- Loading branch information
1 parent
d803211
commit 9e1eb5a
Showing
15 changed files
with
7,145 additions
and
26 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,2 @@ | ||
| dist | ||
| debug.log |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,43 @@ | ||
| const gulp = require('gulp'); | ||
| const browserify = require('browserify'); | ||
| const source = require('vinyl-source-stream'); | ||
| const watchify = require('watchify'); | ||
| const tsify = require('tsify'); | ||
| const gutil = require('gulp-util'); | ||
| const browserSync = require('browser-sync').create(); | ||
|
|
||
| const browserified = browserify({ | ||
| basedir: '.', | ||
| debug: true, | ||
| entries: ['startup.ts'], | ||
| cache: {}, | ||
| packageCache: {} | ||
| }).plugin(tsify); | ||
|
|
||
| const watchedBrowserify = watchify(browserified); | ||
| gulp.task('browser-sync', function() { | ||
| browserSync.init({ | ||
| server: { | ||
| baseDir: '.' | ||
| } | ||
| }); | ||
| }); | ||
|
|
||
| function bundle(input) { | ||
| return input | ||
| .bundle() | ||
| .pipe(source('bundle.js')) | ||
| .pipe(gulp.dest('dist')); | ||
| } | ||
|
|
||
| gulp.task('default', ['browser-sync'], () => { | ||
| return bundle(watchedBrowserify) | ||
| .pipe(browserSync.reload({ stream: true })) | ||
| .on('update', bundle) | ||
| .on('change', browserSync.reload) | ||
| .on('log', gutil.log); | ||
| }); | ||
|
|
||
| gulp.task('build', [], () => { | ||
| return bundle(browserified).on('end', () => browserified.close()); | ||
| }); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,28 @@ | ||
| <!DOCTYPE html> | ||
| <html> | ||
|
|
||
| <head> | ||
| <meta charset="utf-8"> | ||
| <title>Aurelia DBMonster</title> | ||
| <meta name="viewport" content="width=device-width, initial-scale=1"> | ||
|
|
||
| <meta http-equiv="cache-control" content="max-age=0" /> | ||
| <meta http-equiv="cache-control" content="no-cache" /> | ||
| <meta http-equiv="expires" content="0" /> | ||
| <meta http-equiv="expires" content="Tue, 01 Jan 1980 1:00:00 GMT" /> | ||
| <meta http-equiv="pragma" content="no-cache" /> | ||
|
|
||
| <link rel="stylesheet" href="styles/bootstrap.min.css"> | ||
| <link rel="stylesheet" href="styles/styles.css"> | ||
| </head> | ||
|
|
||
| <body> | ||
| <script src="lib/ENV.js"></script> | ||
| <script src="lib/memory-stats.js"></script> | ||
| <script src="lib/monitor.js"></script> | ||
|
|
||
| <app></app> | ||
| <script src="dist/bundle.js"></script> | ||
| </body> | ||
|
|
||
| </html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,211 @@ | ||
| var ENV = ENV || (function() { | ||
|
|
||
| var first = true; | ||
| var counter = 0; | ||
| var data; | ||
| var _base; | ||
| (_base = String.prototype).lpad || (_base.lpad = function(padding, toLength) { | ||
| return padding.repeat((toLength - this.length) / padding.length).concat(this); | ||
| }); | ||
|
|
||
| function formatElapsed(value) { | ||
| str = parseFloat(value).toFixed(2); | ||
| if (value > 60) { | ||
| minutes = Math.floor(value / 60); | ||
| comps = (value % 60).toFixed(2).split('.'); | ||
| seconds = comps[0].lpad('0', 2); | ||
| ms = comps[1]; | ||
| str = minutes + ":" + seconds + "." + ms; | ||
| } | ||
| return str; | ||
| } | ||
|
|
||
| function getElapsedClassName(elapsed) { | ||
| var className = 'Query elapsed'; | ||
| if (elapsed >= 10.0) { | ||
| className += ' warn_long'; | ||
| } | ||
| else if (elapsed >= 1.0) { | ||
| className += ' warn'; | ||
| } | ||
| else { | ||
| className += ' short'; | ||
| } | ||
| return className; | ||
| } | ||
|
|
||
| function countClassName(queries) { | ||
| var countClassName = "label"; | ||
| if (queries >= 20) { | ||
| countClassName += " label-important"; | ||
| } | ||
| else if (queries >= 10) { | ||
| countClassName += " label-warning"; | ||
| } | ||
| else { | ||
| countClassName += " label-success"; | ||
| } | ||
| return countClassName; | ||
| } | ||
|
|
||
| function updateQuery(object) { | ||
| if (!object) { | ||
| object = {}; | ||
| } | ||
| var elapsed = Math.random() * 15; | ||
| object.elapsed = elapsed; | ||
| object.formatElapsed = formatElapsed(elapsed); | ||
| object.elapsedClassName = getElapsedClassName(elapsed); | ||
| object.query = "SELECT blah FROM something"; | ||
| object.waiting = Math.random() < 0.5; | ||
| if (Math.random() < 0.2) { | ||
| object.query = "<IDLE> in transaction"; | ||
| } | ||
| if (Math.random() < 0.1) { | ||
| object.query = "vacuum"; | ||
| } | ||
| return object; | ||
| } | ||
|
|
||
| function cleanQuery(value) { | ||
| if (value) { | ||
| value.formatElapsed = ""; | ||
| value.elapsedClassName = ""; | ||
| value.query = ""; | ||
| delete value.elapsed; | ||
| delete value.waiting; | ||
| } else { | ||
| return { | ||
| query: "***", | ||
| formatElapsed: "", | ||
| elapsedClassName: "" | ||
| }; | ||
| } | ||
| } | ||
|
|
||
| function generateRow(object, keepIdentity, counter) { | ||
| var nbQueries = Math.floor((Math.random() * 10) + 1); | ||
| if (!object) { | ||
| object = {}; | ||
| } | ||
| object.lastMutationId = counter; | ||
| object.nbQueries = nbQueries; | ||
| if (!object.lastSample) { | ||
| object.lastSample = {}; | ||
| } | ||
| if (!object.lastSample.topFiveQueries) { | ||
| object.lastSample.topFiveQueries = []; | ||
| } | ||
| if (keepIdentity) { | ||
| // for Angular optimization | ||
| if (!object.lastSample.queries) { | ||
| object.lastSample.queries = []; | ||
| for (var l = 0; l < 12; l++) { | ||
| object.lastSample.queries[l] = cleanQuery(); | ||
| } | ||
| } | ||
| for (var j in object.lastSample.queries) { | ||
| var value = object.lastSample.queries[j]; | ||
| if (j <= nbQueries) { | ||
| updateQuery(value); | ||
| } else { | ||
| cleanQuery(value); | ||
| } | ||
| } | ||
| } else { | ||
| object.lastSample.queries = []; | ||
| for (var j = 0; j < 12; j++) { | ||
| if (j < nbQueries) { | ||
| var value = updateQuery(cleanQuery()); | ||
| object.lastSample.queries.push(value); | ||
| } else { | ||
| object.lastSample.queries.push(cleanQuery()); | ||
| } | ||
| } | ||
| } | ||
| for (var i = 0; i < 5; i++) { | ||
| var source = object.lastSample.queries[i]; | ||
| object.lastSample.topFiveQueries[i] = source; | ||
| } | ||
| object.lastSample.nbQueries = nbQueries; | ||
| object.lastSample.countClassName = countClassName(nbQueries); | ||
| return object; | ||
| } | ||
|
|
||
| function getData(keepIdentity) { | ||
| var oldData = data; | ||
| if (!keepIdentity) { // reset for each tick when !keepIdentity | ||
| data = []; | ||
| for (var i = 1; i <= ENV.rows; i++) { | ||
| data.push({ dbname: 'cluster' + i, query: "", formatElapsed: "", elapsedClassName: "" }); | ||
| data.push({ dbname: 'cluster' + i + ' slave', query: "", formatElapsed: "", elapsedClassName: "" }); | ||
| } | ||
| } | ||
| if (!data) { // first init when keepIdentity | ||
| data = []; | ||
| for (var i = 1; i <= ENV.rows; i++) { | ||
| data.push({ dbname: 'cluster' + i }); | ||
| data.push({ dbname: 'cluster' + i + ' slave' }); | ||
| } | ||
| oldData = data; | ||
| } | ||
| for (var i in data) { | ||
| var row = data[i]; | ||
| if (!keepIdentity && oldData && oldData[i]) { | ||
| row.lastSample = oldData[i].lastSample; | ||
| } | ||
| if (!row.lastSample || Math.random() < ENV.mutations()) { | ||
| counter = counter + 1; | ||
| if (!keepIdentity) { | ||
| delete row.lastSample; | ||
| } | ||
| generateRow(row, keepIdentity, counter); | ||
| } else { | ||
| data[i] = oldData[i]; | ||
| } | ||
| } | ||
| first = false; | ||
| return { | ||
| toArray: function() { | ||
| return data; | ||
| } | ||
| }; | ||
| } | ||
|
|
||
| var mutationsValue = 0.5; | ||
|
|
||
| function mutations(value) { | ||
| if (value) { | ||
| mutationsValue = value; | ||
| return mutationsValue; | ||
| } else { | ||
| return mutationsValue; | ||
| } | ||
| } | ||
|
|
||
| var body = document.querySelector('body'); | ||
| var theFirstChild = body.firstChild; | ||
|
|
||
| var sliderContainer = document.createElement( 'div' ); | ||
| sliderContainer.style.cssText = "display: flex"; | ||
| var slider = document.createElement('input'); | ||
| var text = document.createElement('label'); | ||
| text.innerHTML = 'mutations : ' + (mutationsValue * 100).toFixed(0) + '%'; | ||
| text.id = "ratioval"; | ||
| slider.setAttribute("type", "range"); | ||
| slider.style.cssText = 'margin-bottom: 10px; margin-top: 5px'; | ||
| slider.addEventListener('change', function(e) { | ||
| ENV.mutations(e.target.value / 100); | ||
| document.querySelector('#ratioval').innerHTML = 'mutations : ' + (ENV.mutations() * 100).toFixed(0) + '%'; | ||
| }); | ||
| sliderContainer.appendChild( text ); | ||
| sliderContainer.appendChild( slider ); | ||
| body.insertBefore( sliderContainer, theFirstChild ); | ||
|
|
||
| return { | ||
| generateData: getData, | ||
| rows: 50, | ||
| timeout: 0, | ||
| mutations: mutations | ||
| }; | ||
| })(); |
Oops, something went wrong.