feat(url_resolver): support package: urls (fixes #2991)
This commit is contained in:
parent
771c0170d9
commit
408618b836
|
@ -18,6 +18,11 @@ class UrlResolver {
|
|||
*/
|
||||
String resolve(String baseUrl, String url) {
|
||||
Uri uri = Uri.parse(url);
|
||||
|
||||
if (uri.scheme == 'package') {
|
||||
return '/packages/${uri.path}';
|
||||
}
|
||||
|
||||
if (uri.isAbsolute) return uri.toString();
|
||||
|
||||
Uri baseUri = Uri.parse(baseUrl);
|
||||
|
|
|
@ -1,2 +1,2 @@
|
|||
<style>@import "angular2_material/src/components/button/button.css";</style>
|
||||
<style>@import "package:angular2_material/src/components/button/button.css";</style>
|
||||
<span class="md-button-wrapper"><ng-content></ng-content></span>
|
||||
|
|
|
@ -3,7 +3,7 @@ import {isPresent} from 'angular2/src/facade/lang';
|
|||
|
||||
|
||||
@Component({selector: '[md-button]:not([href])'})
|
||||
@View({templateUrl: 'angular2_material/src/components/button/button.html'})
|
||||
@View({templateUrl: 'package:angular2_material/src/components/button/button.html'})
|
||||
export class MdButton {
|
||||
// TODO(jelbourn): Ink ripples.
|
||||
}
|
||||
|
@ -15,7 +15,7 @@ export class MdButton {
|
|||
host: {'(click)': 'onClick($event)', '[tabIndex]': 'tabIndex'},
|
||||
lifecycle: [LifecycleEvent.onChange]
|
||||
})
|
||||
@View({templateUrl: 'angular2_material/src/components/button/button.html'})
|
||||
@View({templateUrl: 'package:angular2_material/src/components/button/button.html'})
|
||||
export class MdAnchor {
|
||||
tabIndex: number;
|
||||
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
<style>@import "angular2_material/src/components/checkbox/checkbox.css";</style>
|
||||
<style>@import "package:angular2_material/src/components/checkbox/checkbox.css";</style>
|
||||
|
||||
<div (^click)="toggle($event)">
|
||||
<div class="md-checkbox-container">
|
||||
|
|
|
@ -15,7 +15,10 @@ import {NumberWrapper} from 'angular2/src/facade/lang';
|
|||
'[attr.aria-disabled]': 'disabled'
|
||||
}
|
||||
})
|
||||
@View({templateUrl: 'angular2_material/src/components/checkbox/checkbox.html', directives: []})
|
||||
@View({
|
||||
templateUrl: 'package:angular2_material/src/components/checkbox/checkbox.html',
|
||||
directives: []
|
||||
})
|
||||
export class MdCheckbox {
|
||||
/** Whether this checkbox is checked. */
|
||||
checked: boolean;
|
||||
|
|
|
@ -210,7 +210,7 @@ export class MdDialogConfig {
|
|||
host: {'(body:^keydown)': 'documentKeypress($event)'},
|
||||
})
|
||||
@View({
|
||||
templateUrl: 'angular2_material/src/components/dialog/dialog.html',
|
||||
templateUrl: 'package:angular2_material/src/components/dialog/dialog.html',
|
||||
directives: [forwardRef(() => MdDialogContent)]
|
||||
})
|
||||
class MdDialogContainer {
|
||||
|
|
|
@ -16,7 +16,7 @@ import {Math} from 'angular2/src/facade/math';
|
|||
properties: ['cols', 'rowHeight', 'gutterSize'],
|
||||
lifecycle: [LifecycleEvent.onAllChangesDone]
|
||||
})
|
||||
@View({templateUrl: 'angular2_material/src/components/grid_list/grid_list.html'})
|
||||
@View({templateUrl: 'package:angular2_material/src/components/grid_list/grid_list.html'})
|
||||
export class MdGridList {
|
||||
/** List of tiles that are being rendered. */
|
||||
tiles: List<MdGridTile>;
|
||||
|
@ -223,7 +223,7 @@ export class MdGridList {
|
|||
},
|
||||
lifecycle: [LifecycleEvent.onDestroy, LifecycleEvent.onChange]
|
||||
})
|
||||
@View({templateUrl: 'angular2_material/src/components/grid_list/grid_tile.html'})
|
||||
@View({templateUrl: 'package:angular2_material/src/components/grid_list/grid_tile.html'})
|
||||
export class MdGridTile {
|
||||
gridList: MdGridList;
|
||||
_rowspan: number;
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
<style>@import "angular2_material/src/components/grid_list/grid-list.css";</style>
|
||||
<style>@import "package:angular2_material/src/components/grid_list/grid-list.css";</style>
|
||||
|
||||
<figure>
|
||||
<ng-content></ng-content>
|
||||
|
|
|
@ -1,7 +1,9 @@
|
|||
import {Component, View} from 'angular2/angular2';
|
||||
|
||||
@Component({selector: 'md-progress-circular'})
|
||||
@View({templateUrl: 'angular2_material/src/components/progress-circular/progress_circular.html'})
|
||||
@View({
|
||||
templateUrl: 'package:angular2_material/src/components/progress-circular/progress_circular.html'
|
||||
})
|
||||
export class MdProgressCircular {
|
||||
constructor() {}
|
||||
}
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
<style>@import "angular2_material/src/components/progress-linear/progress_linear.css";</style>
|
||||
<style>@import "package:angular2_material/src/components/progress-linear/progress_linear.css";</style>
|
||||
|
||||
<div class="md-progress-linear-container md-ready">
|
||||
<div class="md-progress-linear-dashed"></div>
|
||||
|
|
|
@ -15,7 +15,7 @@ import {Math} from 'angular2/src/facade/math';
|
|||
}
|
||||
})
|
||||
@View({
|
||||
templateUrl: 'angular2_material/src/components/progress-linear/progress_linear.html',
|
||||
templateUrl: 'package:angular2_material/src/components/progress-linear/progress_linear.html',
|
||||
directives: []
|
||||
})
|
||||
export class MdProgressLinear {
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
<style>@import "angular2_material/src/components/radio/radio-button.css";</style>
|
||||
<style>@import "package:angular2_material/src/components/radio/radio-button.css";</style>
|
||||
|
||||
<!-- TODO(jelbourn): render the radio on either side of the content -->
|
||||
|
||||
|
|
|
@ -36,7 +36,7 @@ var _uniqueIdCounter: number = 0;
|
|||
'[attr.aria-activedescendant]': 'activedescendant'
|
||||
}
|
||||
})
|
||||
@View({templateUrl: 'angular2_material/src/components/radio/radio_group.html'})
|
||||
@View({templateUrl: 'package:angular2_material/src/components/radio/radio_group.html'})
|
||||
export class MdRadioGroup {
|
||||
/** The selected value for the radio group. The value comes from the options. */
|
||||
value: any;
|
||||
|
@ -190,7 +190,10 @@ export class MdRadioGroup {
|
|||
'[attr.aria-disabled]': 'disabled'
|
||||
}
|
||||
})
|
||||
@View({templateUrl: 'angular2_material/src/components/radio/radio_button.html', directives: []})
|
||||
@View({
|
||||
templateUrl: 'package:angular2_material/src/components/radio/radio_button.html',
|
||||
directives: []
|
||||
})
|
||||
export class MdRadioButton {
|
||||
/** Whether this radio is checked. */
|
||||
checked: boolean;
|
||||
|
|
|
@ -1,2 +1,2 @@
|
|||
<style>@import "angular2_material/src/components/radio/radio-group.css";</style>
|
||||
<style>@import "package:angular2_material/src/components/radio/radio-group.css";</style>
|
||||
<ng-content></ng-content>
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
<style>@import "angular2_material/src/components/switcher/switch.css";</style>
|
||||
<style>@import "package:angular2_material/src/components/switcher/switch.css";</style>
|
||||
|
||||
<div (^click)="toggle($event)">
|
||||
<div class="md-switch-container">
|
||||
|
|
|
@ -16,7 +16,8 @@ import {NumberWrapper} from 'angular2/src/facade/lang';
|
|||
'[attr.role]': '"checkbox"'
|
||||
}
|
||||
})
|
||||
@View({templateUrl: 'angular2_material/src/components/switcher/switch.html', directives: []})
|
||||
@View(
|
||||
{templateUrl: 'package:angular2_material/src/components/switcher/switch.html', directives: []})
|
||||
export class MdSwitch {
|
||||
/** Whether this switch is checked. */
|
||||
checked: boolean;
|
||||
|
|
|
@ -0,0 +1,23 @@
|
|||
library angular2_examples.material.demo_common;
|
||||
|
||||
import 'package:angular2/src/dom/browser_adapter.dart';
|
||||
import 'package:angular2/src/services/url_resolver.dart';
|
||||
|
||||
void commonDemoSetup() {
|
||||
BrowserDomAdapter.makeCurrent();
|
||||
}
|
||||
|
||||
class DemoUrlResolver extends UrlResolver {
|
||||
|
||||
@override
|
||||
String resolve(String baseUrl, String url) {
|
||||
const MATERIAL_PKG = 'package:angular2_material/';
|
||||
|
||||
// We run a proxy server in front of pub serve that prepends "example" to
|
||||
// paths
|
||||
if (url.startsWith(MATERIAL_PKG)) {
|
||||
return '/examples/packages/angular2_material/' + url.substring(MATERIAL_PKG.length);
|
||||
}
|
||||
return super.resolve(baseUrl, url);
|
||||
}
|
||||
}
|
|
@ -18,67 +18,16 @@ export function commonDemoSetup(): void {
|
|||
|
||||
@Injectable()
|
||||
export class DemoUrlResolver extends UrlResolver {
|
||||
static a;
|
||||
|
||||
isInPubServe: boolean;
|
||||
|
||||
constructor() {
|
||||
super();
|
||||
if (isBlank(DemoUrlResolver.a)) {
|
||||
DemoUrlResolver.a = DOM.createElement('a');
|
||||
}
|
||||
this.isInPubServe = _isInPubServe();
|
||||
}
|
||||
|
||||
resolve(baseUrl: string, url: string): string {
|
||||
if (isBlank(baseUrl)) {
|
||||
DOM.resolveAndSetHref(DemoUrlResolver.a, url, null);
|
||||
return DOM.getHref(DemoUrlResolver.a);
|
||||
}
|
||||
|
||||
if (isBlank(url) || url == '') {
|
||||
return baseUrl;
|
||||
}
|
||||
|
||||
if (url[0] == '/') {
|
||||
return url;
|
||||
}
|
||||
|
||||
var m = RegExpWrapper.firstMatch(_schemeRe, url);
|
||||
|
||||
if (isPresent(m[1])) {
|
||||
return url;
|
||||
}
|
||||
|
||||
if (StringWrapper.startsWith(url, './')) {
|
||||
return `${baseUrl}/${url}`;
|
||||
}
|
||||
|
||||
// Whether the `examples/` dir is being directly served (as the server root).
|
||||
// For cases when this is not true AND we're in pub-serve, `examples/` needs to be
|
||||
// prepended to the URL.
|
||||
var isDirectlyServingExamplesDir = !StringWrapper.contains(baseUrl, 'examples/');
|
||||
|
||||
if (this.isInPubServe && isDirectlyServingExamplesDir) {
|
||||
return `/packages/${url}`;
|
||||
} else if (this.isInPubServe) {
|
||||
return `/examples/packages/${url}`;
|
||||
} else {
|
||||
return `/${url}`;
|
||||
// The standard UrlResolver looks for "package:" templateUrls in
|
||||
// node_modules, however in our repo we host material widgets at the root.
|
||||
if (url.startsWith('package:angular2_material/')) {
|
||||
return '/' + url.substring(8);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
var _schemeRe = /^([^:/?#]+:)?/g;
|
||||
|
||||
// TODO: remove this hack when http://dartbug.com/23128 is fixed
|
||||
function _isInPubServe(): boolean {
|
||||
try {
|
||||
int.parse('123');
|
||||
print('>> Running in Dart');
|
||||
return true;
|
||||
} catch (_) {
|
||||
print('>> Running in JS');
|
||||
return false;
|
||||
return super.resolve(baseUrl, url);
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
<style>@import "angular2_material/src/components/input/input.css";</style>
|
||||
<style>@import "package:angular2_material/src/components/input/input.css";</style>
|
||||
|
||||
<style>
|
||||
body {
|
||||
|
|
Loading…
Reference in New Issue