' +
- '
' +
+ '
' +
'
' + template + '
' +
'
' +
'
';
@@ -1331,15 +1331,15 @@ MdPanelService.prototype._wrapTemplate = function(origTemplate) {
/**
* Wraps a content element in a `md-panel-outer-wrapper`, as well as
* a `md-panel-inner-wrapper`, and positions it off-screen. Allows for
- * proper control over positoning and animations.
- * @param {!angular.JQLite} contentElement Element to be wrapped.
- * @return {!angular.JQLite} Wrapper element.
+ * proper control over positioning and animations.
+ * @param {!JQLite} contentElement Element to be wrapped.
+ * @return {!JQLite} Wrapper element.
* @private
*/
MdPanelService.prototype._wrapContentElement = function(contentElement) {
var outerWrapper = angular.element(
'
'
);
@@ -1359,12 +1359,12 @@ MdPanelService.prototype._wrapContentElement = function(contentElement) {
* A reference to a created panel. This reference contains a unique id for the
* panel, along with properties/functions used to control the panel.
* @param {!Object} config
- * @param {!angular.$injector} $injector
+ * @param {!IInjectorService} $injector
* @final @constructor
*/
function MdPanelRef(config, $injector) {
// Injected variables.
- /** @private @const {!angular.$q} */
+ /** @private @const {!IQService} */
this._$q = $injector.get('$q');
/** @private @const {!angular.$mdCompiler} */
@@ -1379,7 +1379,7 @@ function MdPanelRef(config, $injector) {
/** @private @const {!angular.$mdTheming} */
this._$mdTheming = $injector.get('$mdTheming');
- /** @private @const {!angular.Scope} */
+ /** @private @const {!IRootScopeService} */
this._$rootScope = $injector.get('$rootScope');
/** @private @const {!angular.$animate} */
@@ -1388,10 +1388,10 @@ function MdPanelRef(config, $injector) {
/** @private @const {!MdPanelRef} */
this._$mdPanel = $injector.get('$mdPanel');
- /** @private @const {!angular.$log} */
+ /** @private @const {!ILogService} */
this._$log = $injector.get('$log');
- /** @private @const {!angular.$window} */
+ /** @private @const {!IWindowService} */
this._$window = $injector.get('$window');
/** @private @const {!Function} */
@@ -1407,14 +1407,14 @@ function MdPanelRef(config, $injector) {
/** @type {!Object} */
this.config = config;
- /** @type {!angular.JQLite|undefined} */
- this.panelContainer;
+ /** @type {!JQLite|undefined} */
+ this.panelContainer = undefined;
- /** @type {!angular.JQLite|undefined} */
- this.panelEl;
+ /** @type {!JQLite|undefined} */
+ this.panelEl = undefined;
- /** @type {!angular.JQLite|undefined} */
- this.innerWrapper;
+ /** @type {!JQLite|undefined} */
+ this.innerWrapper = undefined;
/**
* Whether the panel is attached. This is synchronous. When attach is called,
@@ -1428,14 +1428,14 @@ function MdPanelRef(config, $injector) {
/** @private {Array
} */
this._removeListeners = [];
- /** @private {!angular.JQLite|undefined} */
- this._topFocusTrap;
+ /** @private {!JQLite|undefined} */
+ this._topFocusTrap = undefined;
- /** @private {!angular.JQLite|undefined} */
- this._bottomFocusTrap;
+ /** @private {!JQLite|undefined} */
+ this._bottomFocusTrap = undefined;
/** @private {!$mdPanel|undefined} */
- this._backdropRef;
+ this._backdropRef = undefined;
/** @private {Function?} */
this._restoreScroll = null;
@@ -1450,7 +1450,7 @@ function MdPanelRef(config, $injector) {
* Cleanup function, provided by `$mdCompiler` and assigned after the element
* has been compiled. When `contentElement` is used, the function is used to
* restore the element to it's proper place in the DOM.
- * @private {!Function}
+ * @private {Function|null}
*/
this._compilerCleanup = null;
@@ -1473,7 +1473,7 @@ MdPanelRef.interceptorTypes = {
/**
* Opens an already created and configured panel. If the panel is already
* visible, does nothing.
- * @returns {!angular.$q.Promise} A promise that is resolved when
+ * @returns {!Q.IPromise} A promise that is resolved when
* the panel is opened and animations finish.
*/
MdPanelRef.prototype.open = function() {
@@ -1503,7 +1503,7 @@ MdPanelRef.prototype.open = function() {
/**
* Closes the panel.
* @param {string} closeReason The event type that triggered the close.
- * @returns {!angular.$q.Promise} A promise that is resolved when
+ * @returns {!Q.IPromise} A promise that is resolved when
* the panel is closed and animations finish.
*/
MdPanelRef.prototype.close = function(closeReason) {
@@ -1528,7 +1528,7 @@ MdPanelRef.prototype.close = function(closeReason) {
/**
* Attaches the panel. The panel will be hidden afterwards.
- * @returns {!angular.$q.Promise} A promise that is resolved when
+ * @returns {!Q.IPromise} A promise that is resolved when
* the panel is attached.
*/
MdPanelRef.prototype.attach = function() {
@@ -1560,7 +1560,7 @@ MdPanelRef.prototype.attach = function() {
/**
* Only detaches the panel. Will NOT hide the panel first.
- * @returns {!angular.$q.Promise} A promise that is resolved when
+ * @returns {!Q.IPromise} A promise that is resolved when
* the panel is detached.
*/
MdPanelRef.prototype.detach = function() {
@@ -1637,7 +1637,7 @@ MdPanelRef.prototype.destroy = function() {
/**
* Shows the panel.
- * @returns {!angular.$q.Promise} A promise that is resolved when
+ * @returns {!Q.IPromise} A promise that is resolved when
* the panel has shown and animations finish.
*/
MdPanelRef.prototype.show = function() {
@@ -1681,7 +1681,7 @@ MdPanelRef.prototype.show = function() {
/**
* Hides the panel.
- * @returns {!angular.$q.Promise} A promise that is resolved when
+ * @returns {!Q.IPromise} A promise that is resolved when
* the panel has hidden and animations finish.
*/
MdPanelRef.prototype.hide = function() {
@@ -1832,7 +1832,7 @@ MdPanelRef.prototype.toggleClass = function(toggleClass, onElement) {
* Compiles the panel, according to the passed in config and appends it to
* the DOM. Helps normalize differences in the compilation process between
* using a string template and a content element.
- * @returns {!angular.$q.Promise} Promise that is resolved when
+ * @returns {!Q.IPromise} Promise that is resolved when
* the element has been compiled and added to the DOM.
* @private
*/
@@ -1880,7 +1880,7 @@ MdPanelRef.prototype._compile = function() {
/**
* Creates a panel and adds it to the dom.
- * @returns {!angular.$q.Promise} A promise that is resolved when the panel is
+ * @returns {!Q.IPromise} A promise that is resolved when the panel is
* created.
* @private
*/
@@ -1936,7 +1936,7 @@ MdPanelRef.prototype._createPanel = function() {
/**
* Adds the styles for the panel, such as positioning and z-index. Also,
* themes the panel element and panel container using `$mdTheming`.
- * @returns {!angular.$q.Promise}
+ * @returns {!Q.IPromise}
* @private
*/
MdPanelRef.prototype._addStyles = function() {
@@ -1949,11 +1949,9 @@ MdPanelRef.prototype._addStyles = function() {
// Theme the element and container.
self._setTheming();
- // Remove offscreen class and add hidden class.
+ // Remove offscreen classes and add hidden class.
self.panelEl.removeClass('_md-panel-offscreen');
-
- // Remove left: -9999px and add hidden class.
- self.innerWrapper.css('left', '');
+ self.innerWrapper.removeClass('_md-panel-offscreen');
self.panelContainer.addClass(MD_PANEL_HIDDEN);
resolve(self);
@@ -2069,7 +2067,7 @@ MdPanelRef.prototype._focusOnOpen = function() {
/**
* Shows the backdrop.
- * @returns {!angular.$q.Promise} A promise that is resolved when the backdrop
+ * @returns {!Q.IPromise} A promise that is resolved when the backdrop
* is created and attached.
* @private
*/
@@ -2290,7 +2288,7 @@ MdPanelRef.prototype.updateAnimation = function(animation) {
/**
* Animate the panel opening.
- * @returns {!angular.$q.Promise} A promise that is resolved when the panel has
+ * @returns {!Q.IPromise} A promise that is resolved when the panel has
* animated open.
* @private
*/
@@ -2321,7 +2319,7 @@ MdPanelRef.prototype._animateOpen = function() {
/**
* Animate the panel closing.
- * @returns {!angular.$q.Promise} A promise that is resolved when the panel has
+ * @returns {!Q.IPromise} A promise that is resolved when the panel has
* animated closed.
* @private
*/
@@ -2357,7 +2355,7 @@ MdPanelRef.prototype._animateClose = function() {
* which will allow the action to continue when it gets resolved, or will
* prevent an action if it is rejected.
* @param {string} type Type of interceptor.
- * @param {!angular.$q.Promise} callback Callback to be registered.
+ * @param {!Q.IPromise} callback Callback to be registered.
* @returns {!MdPanelRef}
*/
MdPanelRef.prototype.registerInterceptor = function(type, callback) {
@@ -2423,7 +2421,7 @@ MdPanelRef.prototype.removeAllInterceptors = function(type) {
* reverse order. Works in a similar way to `$q.all`, except it
* respects the order of the functions.
* @param {string} type Type of interceptors to be invoked.
- * @returns {!angular.$q.Promise}
+ * @returns {!Q.IPromise}
* @private
*/
MdPanelRef.prototype._callInterceptors = function(type) {
@@ -2550,11 +2548,11 @@ MdPanelRef.closeReasons = {
* position: panelPosition
* });
*
- * @param {!angular.$injector} $injector
+ * @param {!IInjectorService} $injector
* @final @constructor
*/
function MdPanelPosition($injector) {
- /** @private @const {!angular.$window} */
+ /** @private @const {!IWindowService} */
this._$window = $injector.get('$window');
/** @private {boolean} */
@@ -2566,8 +2564,8 @@ function MdPanelPosition($injector) {
/** @private {boolean} */
this._absolute = false;
- /** @private {!angular.JQLite} */
- this._relativeToEl;
+ /** @private {!JQLite} */
+ this._relativeToEl = undefined;
/** @private {string} */
this._top = '';
@@ -2591,7 +2589,7 @@ function MdPanelPosition($injector) {
this._positions = [];
/** @private {?{x:string, y:string}} */
- this._actualPosition;
+ this._actualPosition = undefined;
}
@@ -2785,7 +2783,7 @@ MdPanelPosition.prototype.center = function() {
/**
* Sets element for relative positioning.
- * @param {string|!Element|!angular.JQLite} element Query selector, DOM element,
+ * @param {string|!Element|!JQLite} element Query selector, DOM element,
* or angular element to set the panel relative to.
* @returns {!MdPanelPosition}
*/
@@ -2898,8 +2896,8 @@ MdPanelPosition.prototype.getTransform = function() {
/**
* Sets the `transform` value for an element.
- * @param {!angular.JQLite} el
- * @returns {!angular.JQLite}
+ * @param {!JQLite} el
+ * @returns {!JQLite}
* @private
*/
MdPanelPosition.prototype._setTransform = function(el) {
@@ -2910,7 +2908,7 @@ MdPanelPosition.prototype._setTransform = function(el) {
/**
* True if the panel is completely on-screen with this positioning; false
* otherwise.
- * @param {!angular.JQLite} el
+ * @param {!JQLite} el
* @return {boolean}
* @private
*/
@@ -2967,7 +2965,7 @@ MdPanelPosition.prototype._reduceTranslateValues =
/**
* Sets the panel position based on the created panel element and best x/y
* positioning.
- * @param {!angular.JQLite} el
+ * @param {!JQLite} el
* @private
*/
MdPanelPosition.prototype._setPanelPosition = function(el) {
@@ -3003,7 +3001,7 @@ MdPanelPosition.prototype._setPanelPosition = function(el) {
/**
* Constrains a panel's position to the viewport.
- * @param {!angular.JQLite} el
+ * @param {!JQLite} el
* @private
*/
MdPanelPosition.prototype._constrainToViewport = function(el) {
@@ -3075,7 +3073,7 @@ MdPanelPosition.prototype._bidi = function(position) {
/**
* Calculates the panel position based on the created panel element and the
* provided positioning.
- * @param {!angular.JQLite} el
+ * @param {!JQLite} el
* @param {!{x:string, y:string}} position
* @private
*/
@@ -3155,7 +3153,7 @@ MdPanelPosition.prototype._calculatePanelPosition = function(el, position) {
* animation: panelAnimation
* });
*
- * @param {!angular.$injector} $injector
+ * @param {!IInjectorService} $injector
* @final @constructor
*/
function MdPanelAnimation($injector) {
@@ -3163,13 +3161,13 @@ function MdPanelAnimation($injector) {
this._$mdUtil = $injector.get('$mdUtil');
/**
- * @private {{element: !angular.JQLite|undefined, bounds: !DOMRect}|
+ * @private {{element: !JQLite|undefined, bounds: !DOMRect}|
* undefined}
*/
this._openFrom;
/**
- * @private {{element: !angular.JQLite|undefined, bounds: !DOMRect}|
+ * @private {{element: !JQLite|undefined, bounds: !DOMRect}|
* undefined}
*/
this._closeTo;
@@ -3262,7 +3260,7 @@ MdPanelAnimation.prototype.duration = function(duration) {
/**
* Returns the element and bounds for the animation target.
* @param {string|!Element|{top: number, left: number}} location
- * @returns {{element: !angular.JQLite|undefined, bounds: !DOMRect}}
+ * @returns {{element: !JQLite|undefined, bounds: !DOMRect}}
* @private
*/
MdPanelAnimation.prototype._getPanelAnimationTarget = function(location) {
@@ -3301,8 +3299,8 @@ MdPanelAnimation.prototype.withAnimation = function(cssClass) {
/**
* Animate the panel open.
- * @param {!angular.JQLite} panelEl
- * @returns {!angular.$q.Promise} A promise that is resolved when the open
+ * @param {!JQLite} panelEl
+ * @returns {!Q.IPromise} A promise that is resolved when the open
* animation is complete.
*/
MdPanelAnimation.prototype.animateOpen = function(panelEl) {
@@ -3370,8 +3368,8 @@ MdPanelAnimation.prototype.animateOpen = function(panelEl) {
/**
* Animate the panel close.
- * @param {!angular.JQLite} panelEl
- * @returns {!angular.$q.Promise} A promise that resolves when the close
+ * @param {!JQLite} panelEl
+ * @returns {!Q.IPromise} A promise that resolves when the close
* animation is complete.
*/
MdPanelAnimation.prototype.animateClose = function(panelEl) {
@@ -3438,7 +3436,7 @@ MdPanelAnimation.prototype.animateClose = function(panelEl) {
/**
* Set the height and width to match the panel if not provided.
- * @param {!angular.JQLite} panelEl
+ * @param {!JQLite} panelEl
* @private
*/
MdPanelAnimation.prototype._fixBounds = function(panelEl) {
@@ -3462,8 +3460,8 @@ MdPanelAnimation.prototype._fixBounds = function(panelEl) {
/**
* Identify the bounding RECT for the target element.
- * @param {!angular.JQLite} element
- * @returns {{element: !angular.JQLite|undefined, bounds: !DOMRect}}
+ * @param {!JQLite} element
+ * @returns {{element: !JQLite|undefined, bounds: !DOMRect}}
* @private
*/
MdPanelAnimation.prototype._getBoundingClientRect = function(element) {
@@ -3483,8 +3481,8 @@ MdPanelAnimation.prototype._getBoundingClientRect = function(element) {
/**
* Returns the angular element associated with a css selector or element.
- * @param el {string|!angular.JQLite|!Element}
- * @returns {!angular.JQLite}
+ * @param el {string|!JQLite|!Element}
+ * @returns {!JQLite}
*/
function getElement(el) {
var queryResult = angular.isString(el) ?
@@ -3494,7 +3492,7 @@ function getElement(el) {
/**
* Gets the computed values for an element's translateX and translateY in px.
- * @param {!angular.JQLite|!Element} el
+ * @param {!JQLite|!Element} el
* @param {string} property
* @return {{x: number, y: number}}
*/
diff --git a/src/components/panel/panel.spec.js b/src/components/panel/panel.spec.js
index 0ad6bd23586..01819c2ceda 100644
--- a/src/components/panel/panel.spec.js
+++ b/src/components/panel/panel.spec.js
@@ -21,7 +21,7 @@ describe('$mdPanel', function() {
var VIEWPORT_MARGIN = 8;
/**
- * @param {!angular.$injector} $injector
+ * @param {!IInjectorService} $injector
* @ngInject
*/
var injectLocals = function($injector) {
diff --git a/src/core/services/compiler/compiler.js b/src/core/services/compiler/compiler.js
index e5b7bc45a58..0a54f95dc49 100644
--- a/src/core/services/compiler/compiler.js
+++ b/src/core/services/compiler/compiler.js
@@ -31,7 +31,10 @@ angular
* will effect **bindings** in controllers created by AngularJS Material's services like
* `$mdDialog`, `$mdPanel`, `$mdToast`, or `$mdBottomSheet`.
*
- * See [$mdCompilerProvider.respectPreAssignBindingsEnabled](#mdcompilerprovider-respectpreassignbindingsenabled-respected)
+ * See
+ *
+ * $mdCompilerProvider.respectPreAssignBindingsEnabled
+ *
* for the details of how the different versions and settings of AngularJS affect this behavior.
*
* @usage
@@ -271,19 +274,34 @@ function MdCompilerProvider($compileProvider) {
*/
function MdCompilerService($q, $templateRequest, $injector, $compile, $controller) {
- /** @private @const {!angular.$q} */
+ /**
+ * @private @const
+ * @type {!IQService}
+ */
this.$q = $q;
- /** @private @const {!angular.$templateRequest} */
+ /**
+ * @private @const
+ * @type {!ITemplateRequestService}
+ */
this.$templateRequest = $templateRequest;
- /** @private @const {!angular.$injector} */
+ /**
+ * @private @const
+ * @type {!IInjectorService}
+ */
this.$injector = $injector;
- /** @private @const {!angular.$compile} */
+ /**
+ * @private @const
+ * @type{!ICompileService}
+ */
this.$compile = $compile;
- /** @private @const {!angular.$controller} */
+ /**
+ * @private @const
+ * @type {!IControllerService}
+ */
this.$controller = $controller;
}
diff --git a/src/core/services/theming/theming.js b/src/core/services/theming/theming.js
index 57eda1addec..c3694e7dbd6 100644
--- a/src/core/services/theming/theming.js
+++ b/src/core/services/theming/theming.js
@@ -328,7 +328,9 @@ function ThemingProvider($mdColorPalette, $$mdMetaProvider) {
* @ngdoc method
* @name $mdThemingProvider#setNonce
* @param {string} nonceValue The nonce to be added as an attribute to the theme style tags.
- * Setting a value allows the use of CSP policy without using the unsafe-inline directive.
+ * Setting a value allows the use of CSP policy without using the `'unsafe-inline'` directive.
+ * The string must already be base64 encoded. You can use `btoa(string)` to do this encoding.
+ * In your CSP's `style-src`, you would then add an entry for `'nonce-nonceValue'`.
*/
setNonce: function(nonceValue) {
themeConfig.nonce = nonceValue;