b38dea0597
Share Gaia assets and adapters, keep private profiles and development documents local, and update both public READMEs.
101 lines
1.9 KiB
JavaScript
Executable file
101 lines
1.9 KiB
JavaScript
Executable file
;(function(define){'use strict';define(function(require,exports,module){
|
|
|
|
/**
|
|
* Dependencies
|
|
*/
|
|
|
|
var component = require('gaia-component');
|
|
|
|
/**
|
|
* Register the element.
|
|
*
|
|
* @return {Element} constructor
|
|
*/
|
|
module.exports = component.register('gaia-modal', {
|
|
|
|
/**
|
|
* Called when the element is first created.
|
|
*
|
|
* Here we create the shadow-root and
|
|
* inject our template into it.
|
|
*
|
|
* @private
|
|
*/
|
|
created: function() {
|
|
this.setupShadowRoot();
|
|
|
|
// Properties
|
|
this.active = this.getAttribute('active');
|
|
},
|
|
|
|
/**
|
|
* Known attribute property
|
|
* descriptors.
|
|
*
|
|
* These setters get called when matching
|
|
* attributes change on the element.
|
|
*
|
|
* @type {Object}
|
|
*/
|
|
attrs: {
|
|
active: {
|
|
get: function() { return this._active || false; },
|
|
set: function(value) {
|
|
value = !!(value || value === '');
|
|
|
|
if (value === this.active) { return; }
|
|
this._active = value;
|
|
|
|
if (value) { this.setAttr('active', ''); }
|
|
else { this.removeAttr('active'); }
|
|
}
|
|
}
|
|
},
|
|
|
|
open: function() {
|
|
this.active = true;
|
|
},
|
|
|
|
close: function() {
|
|
this.active = false;
|
|
},
|
|
|
|
template: `<div class="inner">
|
|
<content></content>
|
|
</div>
|
|
|
|
<style>
|
|
:host {
|
|
position: fixed;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
z-index: 9999;
|
|
transition: all 0.2s;
|
|
transform: translate(0, 100%);
|
|
opacity: 0;
|
|
pointer-events: none;
|
|
}
|
|
|
|
:host[active] {
|
|
transform: translate(0, 0);
|
|
opacity: 1;
|
|
pointer-events: auto;
|
|
}
|
|
|
|
.inner {
|
|
background: var(--background, #fff);
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
</style>`
|
|
});
|
|
|
|
});})(typeof define=='function'&&define.amd?define
|
|
:(function(n,w){'use strict';return typeof module=='object'?function(c){
|
|
c(require,exports,module);}:function(c){var m={exports:{}};c(function(n){
|
|
return w[n];},m.exports,m);w[n]=m.exports;};})('gaia-modal',this));
|