diff --git a/TODO.md b/TODO.md
index 0a90d9c..4c0ef7b 100644
--- a/TODO.md
+++ b/TODO.md
@@ -14,6 +14,8 @@ NEW FEATURES
- [ ] dividers
- [ ] save server !!
- [ ] * disable * listen
+- [ ] override gui.var initialValues with url.js
+- [x] docked container
BUILD
diff --git a/build/dat-gui.html b/build/dat-gui.html
index 9599958..cea5a45 100755
--- a/build/dat-gui.html
+++ b/build/dat-gui.html
@@ -1,14 +1,13 @@
-
+
-
+
+
+
+
+
+
diff --git a/elements/dat-gui/dat-gui.js b/elements/dat-gui/dat-gui.js
index b625cc2..5843be2 100644
--- a/elements/dat-gui/dat-gui.js
+++ b/elements/dat-gui/dat-gui.js
@@ -12,6 +12,7 @@ Polymer( 'dat-gui', {
ready: function() {
this.vars = {};
+ this.domElement = this; // legacy
},
@@ -124,6 +125,8 @@ Polymer( 'dat-gui', {
}
+ this.asyncFire( 'resize' );
+
},
dockedChanged: function() {
@@ -215,26 +218,44 @@ Gui.getController = function( value ) {
var ready = false;
var readyHandlers = [];
+var readyPromise;
+
+function readyResolve( resolve ) {
+
+ readyHandlers.forEach( function( fnc ) {
+ fnc();
+ } );
+
+ if ( resolve !== undefined ) {
+ resolve();
+ }
+
+}
+
document.addEventListener( 'polymer-ready', function() {
ready = true;
- readyHandlers.forEach( function( fnc ) {
-
- fnc();
-
- } );
+ if ( !readyPromise ) {
+ readyResolve();
+ }
} );
Gui.ready = function( fnc ) {
+ if ( window.Promise && arguments.length === 0 ) {
+ readyPromise = new Promise( readyResolve );
+ return readyPromise;
+ }
+
if ( ready ) {
fnc();
} else {
readyHandlers.push( fnc );
}
+
};
diff --git a/elements/dat-gui/dat-gui.styl b/elements/dat-gui/dat-gui.styl
index 35deb9b..16b0bfc 100644
--- a/elements/dat-gui/dat-gui.styl
+++ b/elements/dat-gui/dat-gui.styl
@@ -39,6 +39,7 @@ dur = 0.4s
#controllers
panel-font()
+
.docked-true &
position absolute
width 100%
@@ -54,6 +55,20 @@ dur = 0.4s
padding padding * 0.75 padding
+#dockedContent:not(:empty)
+ position: fixed
+ top: 0
+ left: 0
+ bottom: 0
+
+ // needs to be dynamic if we do panel resizing again
+ right: panel-width
+
+ .open-false &
+ right: 0
+
+
+
gui-button
panel-font()
background color-panel
@@ -81,4 +96,4 @@ gui-button
.docked-false &
right 0
- left 0
\ No newline at end of file
+ left 0
diff --git a/examples/index.html b/examples/index.html
index 787667f..9576ea9 100644
--- a/examples/index.html
+++ b/examples/index.html
@@ -5,11 +5,11 @@
dat-gui kitchen sink
-
-
+
- -->
+
@@ -76,6 +76,15 @@
// console.log( val );
});
+
+ var testElement = document.createElement( 'div' );
+ testElement.id = 'test';
+ testElement.innerHTML = 'test dock container';
+ testElement.style.left = '50%';
+ testElement.style.top = '50%';
+ testElement.style.position = 'absolute';
+ gui.$.dockedContent.appendChild( testElement );
+
} );
diff --git a/gulpfile.js b/gulpfile.js
index ef1f713..331d1ef 100644
--- a/gulpfile.js
+++ b/gulpfile.js
@@ -77,7 +77,7 @@ gulp.task( 'watch', [ 'lint', 'build', 'test' ], function() {
.pipe( $.esformatter( formattingOptions ) )
.pipe( gulp.dest( './' ) )
.pipe( $.jshint( '.jshintrc' ) )
- .pipe( $.jshint.reporter( 'jshint-stylish' ) )
+ .pipe( $.jshint.reporter( 'default' ) )
.pipe( $.jshint.reporter( 'fail' ) );
} );
@@ -122,7 +122,7 @@ gulp.task( 'lint', [ 'fmt' ], function() {
once: true
} ) )
.pipe( $.jshint( '.jshintrc' ) )
- .pipe( $.jshint.reporter( 'jshint-stylish' ) )
+ .pipe( $.jshint.reporter( 'default' ) )
.pipe( $.if( !browserSync.active, $.jshint.reporter( 'fail' ) ) );
} );
diff --git a/package.json b/package.json
index e0ec08f..1b0e85e 100644
--- a/package.json
+++ b/package.json
@@ -23,7 +23,6 @@
"gulp-watch": "^1.0.3",
"gulp-wrap": "^0.3.0",
"highlight.js": "^8.2.0",
- "jshint-stylish": "^0.4.0",
"karma": "^0.12.23",
"karma-jasmine": "^0.1.5",
"nib": "^1.0.3",