Alex Wolfe
commit
6ef6448449
|
|
@ -17,6 +17,4 @@ for page, slug in data
|
|||
|
||||
// SET CURRENT PAGE FLAG WHEN YOU PASS IT
|
||||
if current.path[4] == slug
|
||||
currentPage = true
|
||||
|
||||
|
||||
currentPage = true
|
||||
|
|
@ -2,19 +2,25 @@
|
|||
script(src="/resources/js/vendor/prettify.js")
|
||||
script(src="/resources/js/vendor/lang-basic.js")
|
||||
script(src="/resources/js/vendor/lang-dart.js")
|
||||
script(src="/resources/js/vendor/jquery.js")
|
||||
script(src="/resources/js/vendor/lodash.js")
|
||||
|
||||
|
||||
<!-- Angular Material Dependencies -->
|
||||
script(src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.js")
|
||||
script(src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-touch.js")
|
||||
script(src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-animate.js")
|
||||
script(src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-aria.js")
|
||||
script(src="https://ajax.googleapis.com/ajax/libs/angular_material/0.8.3/angular-material.min.js")
|
||||
|
||||
|
||||
|
||||
<!-- Angular.io Site JS -->
|
||||
script(src="/resources/js/site.js")
|
||||
script(src="/resources/js/controllers/app-controller.js")
|
||||
script(src="/resources/js/directives/bio.js")
|
||||
script(src="/resources/js/directives/code-tabs.js")
|
||||
script(src="/resources/js/directives/code-pane.js")
|
||||
script(src="/resources/js/directives/code-example.js")
|
||||
|
||||
|
||||
<!-- GA -->
|
||||
script.
|
||||
|
|
|
|||
|
|
@ -19,7 +19,7 @@
|
|||
<!-- BIO CARDS -->
|
||||
for person, name in bios
|
||||
.c3
|
||||
md-card(class="bio-card" data-website="#{person.website}" data-twitter="#{person.twitter}" data-pic="#{person.picture}" data-bio="#{person.bio}" data-name="#{person.name}" ng-click="showBio($event)")
|
||||
md-card(biocard class="bio-card" website="#{person.website}" twitter="#{person.twitter}" pic="#{person.picture}" bio="#{person.bio}" name="#{person.name}")
|
||||
header
|
||||
image(src="#{person.picture}" alt="#person.name")
|
||||
|
||||
|
|
|
|||
|
|
@ -3,26 +3,42 @@
|
|||
h2 Code Examples
|
||||
p Below are some examples of how you can add/customize code examples in a page.
|
||||
|
||||
strong.l-space-top-3.l-space-bottom-1 ATTRIBUTES:
|
||||
ul
|
||||
li <strong>name</strong> Name displayed in Tab (required for tabs)
|
||||
li <strong>language</strong> javascript, html, etc.
|
||||
li <strong>escape</strong> html (escapes html, woot!)
|
||||
li <strong>format</strong> linenums (or linenums:4 specify starting line)
|
||||
|
||||
.showcase-content
|
||||
|
||||
.l-sub-section
|
||||
h3 Inline Code Examples
|
||||
|
||||
p.
|
||||
Inline code example <code ng-non-bindable>{{username}}</code>
|
||||
|
||||
code-example(format="linenums" language="html" escape="html").
|
||||
Inline code example <code ng-non-bindable>{{username}}</code>
|
||||
|
||||
p.
|
||||
Notice the <strong>ng-non-bindable</strong> attribute. This is only
|
||||
needed when using code examples inline <strong>code-tabs and code-example directives
|
||||
automatically do this</strong>.
|
||||
|
||||
.l-sub-section
|
||||
h3 Adding a code example
|
||||
|
||||
pre.prettyprint.linenums
|
||||
code.
|
||||
pre.prettyprint.linenums
|
||||
code.
|
||||
//SOME CODE
|
||||
var name = "Alex Wolfe";
|
||||
alert(name);
|
||||
code-example(format="linenums" language="html").
|
||||
code-example(format="linenums" language="javascript").
|
||||
//SOME CODE
|
||||
|
||||
.l-sub-section
|
||||
h3 Specify starting line number
|
||||
|
||||
pre(class="prettyprint linenums:4")
|
||||
code.
|
||||
pre.prettyprint.linenums:4
|
||||
var title = "This starts on line four";
|
||||
|
||||
code-example(language="javascript" format="linenums:4").
|
||||
code-example(language="html" format="linenums:4").
|
||||
var title = "This starts on line four";
|
||||
|
||||
.l-sub-section
|
||||
h3 Specify a language
|
||||
|
|
@ -34,11 +50,9 @@
|
|||
chosen based on language hints. Add a class that matches
|
||||
your desired language (example below uses <strong>.lang-html</strong>)
|
||||
|
||||
pre(class="prettyprint lang-html")
|
||||
code.
|
||||
pre.prettyprint.lang-html
|
||||
h1 Title
|
||||
p This is some copy...
|
||||
code-example(language="html" format="linenums").
|
||||
h1 Title
|
||||
p This is some copy...
|
||||
|
||||
.l-sub-section
|
||||
h3 Code Highlighting
|
||||
|
|
@ -48,16 +62,39 @@
|
|||
<strong>Black</strong>. You can see examples below and
|
||||
the class names needed for each type.
|
||||
|
||||
pre.prettyprint.linenums
|
||||
code.
|
||||
// Pink Background Version
|
||||
// class="pnk"
|
||||
var elephants = "The <span class="pnk">pink</span> elephants were marching...";
|
||||
code-example(format="linenums").
|
||||
// Pink Background Version
|
||||
// class="pnk"
|
||||
var elephants = "The <span class='pnk'>pink</span> elephants were marching...";
|
||||
|
||||
// Black Background Version
|
||||
// class="blk"
|
||||
var night = "The night was pitch <span class="blk">black</span>.";
|
||||
// Black Background Version
|
||||
// class="blk"
|
||||
var night = "The night was pitch <span class='blk'>black</span>.";
|
||||
|
||||
// Outlined Version
|
||||
// class="otl"
|
||||
var match = "The <span class="otl">bird</span> ate <span class="otl">bird</span> seed near the <span class="otl">bird</span> bath ";
|
||||
// Outlined Version
|
||||
// class="otl"
|
||||
var match = "The <span class='otl'>bird</span> ate <span class='otl'>bird</span> seed near the <span class='otl'>bird</span> bath ";
|
||||
|
||||
.l-sub-section
|
||||
h3 Code Tabs
|
||||
p.
|
||||
Code Tabs are a great way to show different languages and versions
|
||||
of a particular piece of code. When using these tabs make sure the
|
||||
<stron>content is always related</strong>.
|
||||
|
||||
code-tabs
|
||||
code-pane(language="javascript" format="linenums" name="ES5").
|
||||
// ES5
|
||||
var hello = 'blah';
|
||||
|
||||
code-pane(language="javascript" format="linenums" name="TypeScript").
|
||||
// TypeScript
|
||||
var hello = 'blah';
|
||||
|
||||
p To create code tabs simply use the directives below
|
||||
code-example(format="linenums").
|
||||
code-tabs
|
||||
code-pane(format="linenums" name="Tab 1").
|
||||
// TAB 1 CONTENT
|
||||
code-pane(format="linenums" name="Tab 2").
|
||||
// TAB 2 CONTENT
|
||||
|
|
@ -10,20 +10,17 @@
|
|||
h2 Main Section Title
|
||||
p Main section content...
|
||||
|
||||
pre.prettyprint.linenums.lang-html
|
||||
code.
|
||||
.l-main-section
|
||||
h2 Section Title
|
||||
p section content...
|
||||
|
||||
code-example(language="html" format="linenums").
|
||||
.l-main-section
|
||||
h2 Section Title
|
||||
p section content...
|
||||
.l-sub-section
|
||||
h3 Sub Section Title
|
||||
p.
|
||||
sub section content... This content is related to the main section
|
||||
content and <strong>falls within</strong> the main section.
|
||||
|
||||
pre.prettyprint.linenums.lang-html
|
||||
code.
|
||||
.l-sub-section
|
||||
h3 Sub Section Title
|
||||
p sub section content...
|
||||
code-example(language="html" format="linenums").
|
||||
.l-sub-section
|
||||
h3 Sub Section Title
|
||||
p sub section content...
|
||||
|
|
@ -9,8 +9,17 @@ html(lang="en" ng-app="angularIOApp")
|
|||
!= partial("../_includes/_hero")
|
||||
!= partial("../_includes/_banner")
|
||||
|
||||
article.l-content-small.grid-fluid.docs-content
|
||||
!= yield
|
||||
|
||||
if current.path[3] == 'api'
|
||||
article(class="l-content-small grid-fluid docs-content" ng-non-bindable)
|
||||
!= yield
|
||||
|
||||
else
|
||||
article(class="l-content-small grid-fluid docs-content")
|
||||
!= yield
|
||||
|
||||
if current.path[3] == 'guide' && current.path[4]
|
||||
!= partial("../_includes/_next-item")
|
||||
|
||||
!= partial("../_includes/_footer")
|
||||
!= partial("../_includes/_scripts-include")
|
||||
|
|
@ -1,17 +0,0 @@
|
|||
doctype
|
||||
html(lang="en" ng-app="angularIOApp")
|
||||
head
|
||||
!= partial("../../../../_includes/_head-include")
|
||||
|
||||
body(class="l-offset-nav l-offset-side-nav" ng-controller="AppCtrl")
|
||||
!= partial("../../../../_includes/_main-nav")
|
||||
!= partial("../../../_includes/sidenav/_primary")
|
||||
!= partial("../../../../_includes/_hero")
|
||||
!= partial("../../../../_includes/_banner")
|
||||
|
||||
article.l-content-small.grid-fluid.docs-content(ng-non-bindable)
|
||||
!= yield
|
||||
!= partial("../../../../_includes/_next-item")
|
||||
|
||||
!= partial("../../../../_includes/_footer")
|
||||
!= partial("../../../../_includes/_scripts-include")
|
||||
|
|
@ -16,48 +16,44 @@
|
|||
a <code>web/index.html</code> file, and
|
||||
a <code>pubspec.yaml</code> file:
|
||||
|
||||
.code-box
|
||||
pre.prettyprint.lang-dart(data-name="dart")
|
||||
code.
|
||||
// web/main.dart
|
||||
library displaying_data;
|
||||
code-tabs
|
||||
code-pane(language="dart" name="main.dart" format="linenums").
|
||||
// web/main.dart
|
||||
library displaying_data;
|
||||
|
||||
import 'package:angular2/angular2.dart';
|
||||
import 'package:angular2/src/reflection/reflection.dart' show reflector;
|
||||
import 'package:angular2/src/reflection/reflection_capabilities.dart' show ReflectionCapabilities;
|
||||
import 'package:angular2/angular2.dart';
|
||||
import 'package:angular2/src/reflection/reflection.dart' show reflector;
|
||||
import 'package:angular2/src/reflection/reflection_capabilities.dart' show ReflectionCapabilities;
|
||||
|
||||
part 'show_properties.dart';
|
||||
part 'show_properties.dart';
|
||||
|
||||
main() {
|
||||
reflector.reflectionCapabilities = new ReflectionCapabilities();
|
||||
bootstrap(DisplayComponent);
|
||||
}
|
||||
pre.prettyprint.lang-html(data-name="html")
|
||||
code.
|
||||
<!-- web/index.html -->
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<link rel="stylesheet" href="style.css">
|
||||
</head>
|
||||
<body>
|
||||
main() {
|
||||
reflector.reflectionCapabilities = new ReflectionCapabilities();
|
||||
bootstrap(DisplayComponent);
|
||||
}
|
||||
code-pane(language="html" name="index.html" format="linenums").
|
||||
<!-- web/index.html -->
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<link rel="stylesheet" href="style.css">
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<display></display>
|
||||
|
||||
<script type="application/dart" src="main.dart"></script>
|
||||
<script src="packages/browser/dart.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
pre.prettyprint.lang-yaml(data-name="yaml")
|
||||
code.
|
||||
# pubspec.yaml
|
||||
name: displaying_data
|
||||
description: Dart version of Angular 2 example, Displaying Data
|
||||
version: 0.0.1
|
||||
dependencies:
|
||||
angular2: 2.0.0-alpha.22
|
||||
browser: any
|
||||
<display></display>
|
||||
|
||||
<script type="application/dart" src="main.dart"></script>
|
||||
<script src="packages/browser/dart.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
code-pane(language="yaml" name="pubspec.yaml" format="linenums").
|
||||
# pubspec.yaml
|
||||
name: displaying_data
|
||||
description: Dart version of Angular 2 example, Displaying Data
|
||||
version: 0.0.1
|
||||
dependencies:
|
||||
angular2: 2.0.0-alpha.22
|
||||
browser: any
|
||||
p.
|
||||
All of this code should look familiar from the previous page,
|
||||
except for the <code>library</code> and <code>part</code> statements
|
||||
|
|
@ -78,30 +74,28 @@
|
|||
named <code>show_properties.dart</code>,
|
||||
and add the following:
|
||||
|
||||
pre.prettyprint.lang-dart
|
||||
code.
|
||||
// web/show_properties.dart
|
||||
part of displaying_data;
|
||||
code-example(language="dart" format="linenums").
|
||||
// web/show_properties.dart
|
||||
part of displaying_data;
|
||||
|
||||
@Component(
|
||||
selector: 'display'
|
||||
)
|
||||
@View(
|
||||
template: '''
|
||||
<p>My name: {{ myName }}</p>
|
||||
'''
|
||||
)
|
||||
class DisplayComponent {
|
||||
String myName = 'Alice';
|
||||
}
|
||||
@Component(
|
||||
selector: 'display'
|
||||
)
|
||||
@View(
|
||||
template: '''
|
||||
<p>My name: {{ myName }}</p>
|
||||
'''
|
||||
)
|
||||
class DisplayComponent {
|
||||
String myName = 'Alice';
|
||||
}
|
||||
|
||||
p.
|
||||
You've just defined a component that encompasses a view and controller for the app. The view
|
||||
defines a template:
|
||||
|
||||
pre.prettyprint.lang-html
|
||||
code.
|
||||
<p>My name: {{ myName }}</p>
|
||||
code-example(language="html").
|
||||
<p>My name: {{ myName }}</p>
|
||||
|
||||
p.
|
||||
Angular will automatically pull the value of <code>myName</code> and
|
||||
|
|
@ -134,17 +128,15 @@
|
|||
Add a second line to the template,
|
||||
so you can see Angular dynamically update content:
|
||||
|
||||
pre.prettyprint.lang-html
|
||||
code.
|
||||
<p>Current time: {{ time }}</p>
|
||||
code-example(language="html").
|
||||
<p>Current time: {{ time }}</p>
|
||||
|
||||
p.
|
||||
Then give the <code>DisplayComponent</code> a starting value for time and
|
||||
a call to update time
|
||||
via <code>setInterval</code>:
|
||||
|
||||
pre.prettyprint.lang-dart
|
||||
code.
|
||||
code-example(language="dart" format="linenums").
|
||||
class DisplayComponent {
|
||||
String myName = 'Alice';
|
||||
String time;
|
||||
|
|
@ -166,44 +158,41 @@
|
|||
h2#Create-an-array Display an iterable using *for
|
||||
p Moving up from a single value, create a property that's a list of values.
|
||||
|
||||
pre.prettyprint.lang-dart
|
||||
code.
|
||||
class DisplayComponent {
|
||||
String myName = 'Alice';
|
||||
List<String> friendNames = ['Aarav', 'Martín', 'Shannon', 'Ariana', 'Kai'];
|
||||
}
|
||||
code-example(language="dart" format="linenums").
|
||||
class DisplayComponent {
|
||||
String myName = 'Alice';
|
||||
List<String> friendNames = ['Aarav', 'Martín', 'Shannon', 'Ariana', 'Kai'];
|
||||
}
|
||||
|
||||
p.
|
||||
You can then use this list in your template with the <code>for</code> directive to create copies of DOM elements
|
||||
with one for each item in the list.
|
||||
|
||||
pre.prettyprint.lang-dart
|
||||
code.
|
||||
@View(
|
||||
template: '''
|
||||
<p>My name: {{ myName }}</p>
|
||||
<p>Friends:</p>
|
||||
<ul>
|
||||
<li *for="#name of friendNames">
|
||||
{{ name }}
|
||||
</li>
|
||||
</ul>
|
||||
'''
|
||||
)
|
||||
code-example(language="dart" format="linenums").
|
||||
@View(
|
||||
template: '''
|
||||
<p>My name: {{ myName }}</p>
|
||||
<p>Friends:</p>
|
||||
<ul>
|
||||
<li *for="#name of friendNames">
|
||||
{{ name }}
|
||||
</li>
|
||||
</ul>
|
||||
'''
|
||||
)
|
||||
p.
|
||||
To make this work, you'll also need to add the Angular <code>For</code> directive used by
|
||||
the template to <code>show_properties.dart</code>, so that Angular knows to include it.
|
||||
Add <code>For</code> using the optional <code>directives</code> parameter,
|
||||
which contains a list of directives:
|
||||
|
||||
pre.prettyprint.lang-dart
|
||||
code.
|
||||
@View(
|
||||
template: '''
|
||||
// ...HTML...
|
||||
''',
|
||||
directives: const[For]
|
||||
)
|
||||
code-example(language="dart" format="linenums").
|
||||
@View(
|
||||
template: '''
|
||||
// ...HTML...
|
||||
''',
|
||||
directives: const[For]
|
||||
)
|
||||
|
||||
p Reload and you've got your list of friends!
|
||||
p.
|
||||
|
|
@ -213,11 +202,10 @@
|
|||
|
||||
p Let's look at the few lines that do the work again:
|
||||
|
||||
pre.prettyprint.lang-html
|
||||
code.
|
||||
<li *for="#name of friendNames">
|
||||
{{ name }}
|
||||
</li>
|
||||
code-example(language="html" format="linenums").
|
||||
<li *for="#name of friendNames">
|
||||
{{ name }}
|
||||
</li>
|
||||
|
||||
p The way to read this is:
|
||||
ul
|
||||
|
|
@ -241,14 +229,13 @@
|
|||
Make a <code>FriendsService</code> class to implement a model containing a list of friends. We'll put this in a new
|
||||
<code>friends_service.dart</code> under <code>web/</code>. Here's what the class looks like:
|
||||
|
||||
pre.prettyprint.lang-dart
|
||||
code.
|
||||
// web/friends_service.dart
|
||||
part of displaying_data;
|
||||
code-example(language="dart" format="linenums").
|
||||
// web/friends_service.dart
|
||||
part of displaying_data;
|
||||
|
||||
class FriendsService {
|
||||
List<String> friendNames = ['Aarav', 'Martín', 'Shannon', 'Ariana', 'Kai'];
|
||||
}
|
||||
class FriendsService {
|
||||
List<String> friendNames = ['Aarav', 'Martín', 'Shannon', 'Ariana', 'Kai'];
|
||||
}
|
||||
|
||||
.callout.is-helpful
|
||||
header Note
|
||||
|
|
@ -260,29 +247,27 @@
|
|||
First add a FriendsService parameter to the constructor.
|
||||
Then set <code>friendNames</code> to the names provided by the service.
|
||||
|
||||
pre.prettyprint.lang-dart
|
||||
code.
|
||||
// In web/show_properties.dart
|
||||
class DisplayComponent {
|
||||
String myName = 'Alice';
|
||||
List<String> friendNames;
|
||||
code-example(language="dart" format="linenums").
|
||||
// In web/show_properties.dart
|
||||
class DisplayComponent {
|
||||
String myName = 'Alice';
|
||||
List<String> friendNames;
|
||||
|
||||
DisplayComponent(FriendsService friendsService) {
|
||||
friendNames = friendsService.names;
|
||||
}
|
||||
DisplayComponent(FriendsService friendsService) {
|
||||
friendNames = friendsService.names;
|
||||
}
|
||||
}
|
||||
|
||||
p.
|
||||
Next, make FriendsService available to dependency injection
|
||||
by adding an <code>injectables</code> parameter to DisplayComponent's
|
||||
<code>@Component</code> annotation:
|
||||
|
||||
pre.prettyprint.lang-dart
|
||||
code.
|
||||
@Component(
|
||||
selector: 'display',
|
||||
injectables: const[FriendsService]
|
||||
)
|
||||
code-example(language="dart" format="linenums").
|
||||
@Component(
|
||||
selector: 'display',
|
||||
injectables: const[FriendsService]
|
||||
)
|
||||
|
||||
.l-main-section
|
||||
h2#Conditionally-displaying-data-with-If Conditionally display data using *if
|
||||
|
|
@ -292,17 +277,15 @@
|
|||
|
||||
p See it in action by adding a paragraph at the end of your template:
|
||||
|
||||
pre.prettyprint.lang-html
|
||||
code.
|
||||
<p *if="names.length > 3">You have many friends!</p>
|
||||
code-example(language="html").
|
||||
<p *if="names.length > 3">You have many friends!</p>
|
||||
|
||||
p.
|
||||
Also add <code>If</code> to the list of directives,
|
||||
so Angular knows to include it:
|
||||
|
||||
pre.prettyprint.lang-dart
|
||||
code.
|
||||
directives: const[For, If]
|
||||
code-example(language="dart").
|
||||
directives: const[For, If]
|
||||
p.
|
||||
The list current has 5 items, so if you run the app you'll see the message
|
||||
congratulating you on your many friends.
|
||||
|
|
@ -313,131 +296,124 @@
|
|||
|
||||
p Here's the final code.
|
||||
|
||||
.code-box
|
||||
pre.prettyprint.lang-dart(data-name="show_properties.dart")
|
||||
code.
|
||||
// web/show_properties.dart
|
||||
part of displaying_data;
|
||||
code-tabs
|
||||
code-pane(language="dart" name="show_properties.dart" format="linenums").
|
||||
// web/show_properties.dart
|
||||
part of displaying_data;
|
||||
|
||||
@Component(
|
||||
selector: 'display',
|
||||
injectables: const[FriendsService]
|
||||
)
|
||||
@View(
|
||||
template: '''
|
||||
<p>My name: {{ myName }}</p>
|
||||
<p>Friends:</p>
|
||||
<ul>
|
||||
<li *for="#name of friendNames">
|
||||
{{ name }}
|
||||
</li>
|
||||
</ul>
|
||||
''',
|
||||
directives: const[For]
|
||||
)
|
||||
class DisplayComponent {
|
||||
String myName = 'Alice';
|
||||
List<String> friendNames;
|
||||
@Component(
|
||||
selector: 'display',
|
||||
injectables: const[FriendsService]
|
||||
)
|
||||
@View(
|
||||
template: '''
|
||||
<p>My name: {{ myName }}</p>
|
||||
<p>Friends:</p>
|
||||
<ul>
|
||||
<li *for="#name of friendNames">
|
||||
{{ name }}
|
||||
</li>
|
||||
</ul>
|
||||
''',
|
||||
directives: const[For]
|
||||
)
|
||||
class DisplayComponent {
|
||||
String myName = 'Alice';
|
||||
List<String> friendNames;
|
||||
|
||||
DisplayComponent(FriendsService friendsService) {
|
||||
friendNames = friendsService.names;
|
||||
}
|
||||
DisplayComponent(FriendsService friendsService) {
|
||||
friendNames = friendsService.names;
|
||||
}
|
||||
pre.prettyprint.lang-dart(data-name="friends_service.dart")
|
||||
code.
|
||||
// web/friends_service.dart
|
||||
part of displaying_data;
|
||||
}
|
||||
code-pane(language="dart" name="friends_service.dart" format="linenums").
|
||||
// web/friends_service.dart
|
||||
part of displaying_data;
|
||||
|
||||
class FriendsService {
|
||||
List<String> names = ['Aarav', 'Martín', 'Shannon', 'Ariana', 'Kai'];
|
||||
}
|
||||
pre.prettyprint.lang-dart(data-name="main.dart")
|
||||
code.
|
||||
// web/main.dart
|
||||
library displaying_data;
|
||||
class FriendsService {
|
||||
List<String> names = ['Aarav', 'Martín', 'Shannon', 'Ariana', 'Kai'];
|
||||
}
|
||||
code-pane(language="dart" name="main.dart" format="linenums").
|
||||
// web/main.dart
|
||||
library displaying_data;
|
||||
|
||||
import 'dart:async';
|
||||
import 'dart:async';
|
||||
|
||||
import 'package:angular2/angular2.dart';
|
||||
import 'package:angular2/src/reflection/reflection.dart' show reflector;
|
||||
import 'package:angular2/src/reflection/reflection_capabilities.dart' show ReflectionCapabilities;
|
||||
import 'package:angular2/angular2.dart';
|
||||
import 'package:angular2/src/reflection/reflection.dart' show reflector;
|
||||
import 'package:angular2/src/reflection/reflection_capabilities.dart' show ReflectionCapabilities;
|
||||
|
||||
part 'show_properties.dart';
|
||||
part 'friends_service.dart';
|
||||
part 'show_properties.dart';
|
||||
part 'friends_service.dart';
|
||||
|
||||
main() {
|
||||
reflector.reflectionCapabilities = new ReflectionCapabilities();
|
||||
bootstrap(DisplayComponent);
|
||||
}
|
||||
pre.prettyprint.lang-html(data-name="html")
|
||||
code.
|
||||
<!-- web/index.html -->
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<link rel="stylesheet" href="style.css">
|
||||
</head>
|
||||
<body>
|
||||
main() {
|
||||
reflector.reflectionCapabilities = new ReflectionCapabilities();
|
||||
bootstrap(DisplayComponent);
|
||||
}
|
||||
code-pane(language="html" name="index.html" format="linenums").
|
||||
<!-- web/index.html -->
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<link rel="stylesheet" href="style.css">
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<display></display>
|
||||
<display></display>
|
||||
|
||||
<script type="application/dart" src="main.dart"></script>
|
||||
<script src="packages/browser/dart.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
pre.prettyprint.lang-yaml(data-name="yaml")
|
||||
code.
|
||||
# pubspec.yaml
|
||||
name: displaying_data
|
||||
description: Dart version of Angular 2 example, Displaying Data
|
||||
version: 0.0.1
|
||||
dependencies:
|
||||
angular2: 2.0.0-alpha.22
|
||||
browser: any
|
||||
<script type="application/dart" src="main.dart"></script>
|
||||
<script src="packages/browser/dart.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
code-pane(language="yaml" name="pubspec.yaml" format="linenums").
|
||||
# pubspec.yaml
|
||||
name: displaying_data
|
||||
description: Dart version of Angular 2 example, Displaying Data
|
||||
version: 0.0.1
|
||||
dependencies:
|
||||
angular2: 2.0.0-alpha.22
|
||||
browser: any
|
||||
.l-main-section
|
||||
h2#section-explanations Explanations
|
||||
|
||||
.l-sub-section
|
||||
h3 Using multiple Dart files in an Angular app
|
||||
|
||||
p.
|
||||
Dart offers a few ways to implement an app in multiple files.
|
||||
In this guide, all the code for each example is in a single library;
|
||||
each Dart file under <code>web</code> is part of that library.
|
||||
p.
|
||||
Dart offers a few ways to implement an app in multiple files.
|
||||
In this guide, all the code for each example is in a single library;
|
||||
each Dart file under <code>web</code> is part of that library.
|
||||
|
||||
p.
|
||||
To let the code in <code>main.dart</code>
|
||||
use the code in <code>show_properties.dart</code>,
|
||||
declare a library in <code>main.dart</code>.
|
||||
Then make <code>show_properties.dart</code> part of that library.
|
||||
p.
|
||||
To let the code in <code>main.dart</code>
|
||||
use the code in <code>show_properties.dart</code>,
|
||||
declare a library in <code>main.dart</code>.
|
||||
Then make <code>show_properties.dart</code> part of that library.
|
||||
|
||||
.code-box
|
||||
pre.prettyprint.lang-dart(data-name="main library file")
|
||||
code.
|
||||
// web/main.dart
|
||||
library displaying_data;
|
||||
// imports...
|
||||
part 'show_properties.dart';
|
||||
// Code goes here...
|
||||
pre.prettyprint.lang-dart(data-name="additional library file")
|
||||
code.
|
||||
// web/show_properties.dart
|
||||
part of displaying_data;
|
||||
// Code goes here...
|
||||
code-tabs
|
||||
code-pane(language="dart" name="main.dart" format="linenums").
|
||||
// web/main.dart
|
||||
library displaying_data;
|
||||
// imports...
|
||||
part 'show_properties.dart';
|
||||
// Code goes here...
|
||||
code-pane(language="dart" name="show_properties.dar" format="linenums").
|
||||
// web/show_properties.dart
|
||||
part of displaying_data;
|
||||
// Code goes here...
|
||||
|
||||
p.
|
||||
Another way to split Dart code is to
|
||||
define multiple libraries in a single package.
|
||||
The additional libraries go under a <code>lib</code> directory
|
||||
parallel to <code>web</code>.
|
||||
<!-- PENDING: show or point to an example -->
|
||||
p.
|
||||
Another way to split Dart code is to
|
||||
define multiple libraries in a single package.
|
||||
The additional libraries go under a <code>lib</code> directory
|
||||
parallel to <code>web</code>.
|
||||
<!-- PENDING: show or point to an example -->
|
||||
|
||||
p.
|
||||
Yet another approach, often used when some of the code is highly reusable,
|
||||
is to split the code into libraries in two or more packages.
|
||||
p.
|
||||
Yet another approach, often used when some of the code is highly reusable,
|
||||
is to split the code into libraries in two or more packages.
|
||||
|
||||
p.
|
||||
For more information on implementing Dart libraries, see
|
||||
<a href="https://www.dartlang.org/docs/dart-up-and-running/ch02.html#libraries-and-visibility">Libraries and visibility</a>
|
||||
in the
|
||||
<a href="https://www.dartlang.org/docs/dart-up-and-running/ch02.html">Dart language tour</a>.
|
||||
p.
|
||||
For more information on implementing Dart libraries, see
|
||||
<a href="https://www.dartlang.org/docs/dart-up-and-running/ch02.html#libraries-and-visibility">Libraries and visibility</a>
|
||||
in the
|
||||
<a href="https://www.dartlang.org/docs/dart-up-and-running/ch02.html">Dart language tour</a>.
|
||||
|
|
|
|||
|
|
@ -10,41 +10,39 @@
|
|||
you can create a parent
|
||||
component that uses a <code><child></code> component like so:
|
||||
|
||||
pre.prettyprint.linenums.lang-dart
|
||||
code.
|
||||
part of making_components;
|
||||
code-example(language="dart" format="linenums").
|
||||
part of making_components;
|
||||
|
||||
@Component(
|
||||
selector: 'parent'
|
||||
)
|
||||
@View(
|
||||
template: '''
|
||||
<h1>{{ message }}</h1>
|
||||
<span class="pnk"><child></child></span>
|
||||
''',
|
||||
directives: const[<span class="pnk">ChildComponent</span>]
|
||||
)
|
||||
class ParentComponent {
|
||||
String message = "I'm the parent";
|
||||
}
|
||||
@Component(
|
||||
selector: 'parent'
|
||||
)
|
||||
@View(
|
||||
template: '''
|
||||
<h1>{{ message }}</h1>
|
||||
<span class="pnk"><child></child></span>
|
||||
''',
|
||||
directives: const[<span class="pnk">ChildComponent</span>]
|
||||
)
|
||||
class ParentComponent {
|
||||
String message = "I'm the parent";
|
||||
}
|
||||
|
||||
p You then just need to write the <code>ChildComponent</code> class to make it work:
|
||||
|
||||
pre.prettyprint.linenums.lang-dart
|
||||
code.
|
||||
part of making_components;
|
||||
code-example(language="dart" format="linenums").
|
||||
part of making_components;
|
||||
|
||||
@Component(
|
||||
selector: 'child'
|
||||
)
|
||||
@View(
|
||||
template: '''
|
||||
<p> {{ message }} </p>
|
||||
'''
|
||||
)
|
||||
class ChildComponent {
|
||||
String message = "I'm the child";
|
||||
}
|
||||
@Component(
|
||||
selector: 'child'
|
||||
)
|
||||
@View(
|
||||
template: '''
|
||||
<p> {{ message }} </p>
|
||||
'''
|
||||
)
|
||||
class ChildComponent {
|
||||
String message = "I'm the child";
|
||||
}
|
||||
|
||||
//p.
|
||||
[TODO: Motivate communication between components with iterator example that passes index to the child]
|
||||
|
|
|
|||
|
|
@ -24,15 +24,14 @@
|
|||
To use Angular2 in your app, include angular2 as a dependency in
|
||||
your app's <b>pubspec.yaml</b> file. For example:
|
||||
|
||||
pre.prettyprint.lang-yaml
|
||||
code.
|
||||
# pubspec.yaml
|
||||
name: getting_started
|
||||
description: Dart version of Angular 2 example, Getting Started
|
||||
version: 0.0.1
|
||||
dependencies:
|
||||
angular2: 2.0.0-alpha.22
|
||||
browser: any
|
||||
code-example(language="yaml").
|
||||
# pubspec.yaml
|
||||
name: getting_started
|
||||
description: Dart version of Angular 2 example, Getting Started
|
||||
version: 0.0.1
|
||||
dependencies:
|
||||
angular2: 2.0.0-alpha.22
|
||||
browser: any
|
||||
p.
|
||||
Run <b>pub get</b> to download the packages your app depends on.
|
||||
(<a href="https://www.dartlang.org/tools/">Dart-savvy editors and IDEs</a>
|
||||
|
|
@ -51,26 +50,25 @@
|
|||
and creating a top-level <code>main()</code> function that calls
|
||||
Angular's <code>bootstrap()</code> function.
|
||||
|
||||
pre.prettyprint.lang-dart
|
||||
code.
|
||||
// web/main.dart
|
||||
import 'package:angular2/angular2.dart';
|
||||
import 'package:angular2/src/reflection/reflection.dart' show reflector;
|
||||
import 'package:angular2/src/reflection/reflection_capabilities.dart' show ReflectionCapabilities;
|
||||
code-example(language="javascript").
|
||||
// web/main.dart
|
||||
import 'package:angular2/angular2.dart';
|
||||
import 'package:angular2/src/reflection/reflection.dart' show reflector;
|
||||
import 'package:angular2/src/reflection/reflection_capabilities.dart' show ReflectionCapabilities;
|
||||
|
||||
@Component(
|
||||
selector: 'my-app'
|
||||
)
|
||||
@View(
|
||||
template: '<h1>My first Angular 2 App</h1>'
|
||||
)
|
||||
class AppComponent {
|
||||
}
|
||||
@Component(
|
||||
selector: 'my-app'
|
||||
)
|
||||
@View(
|
||||
template: '<h1>My first Angular 2 App</h1>'
|
||||
)
|
||||
class AppComponent {
|
||||
}
|
||||
|
||||
main() {
|
||||
reflector.reflectionCapabilities = new ReflectionCapabilities();
|
||||
bootstrap(AppComponent);
|
||||
}
|
||||
main() {
|
||||
reflector.reflectionCapabilities = new ReflectionCapabilities();
|
||||
bootstrap(AppComponent);
|
||||
}
|
||||
|
||||
.l-main-section
|
||||
h2#section-create-an-entry-point Create an HTML file
|
||||
|
|
@ -79,20 +77,19 @@
|
|||
Edit <code>index.html</code> to add a <code><my-app></code> element
|
||||
and call <code>main.dart</code>.
|
||||
|
||||
pre.prettyprint.lang-html
|
||||
code.
|
||||
<!-- web/index.html -->
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<link rel="stylesheet" href="style.css">
|
||||
</head>
|
||||
<body>
|
||||
<my-app></my-app>
|
||||
<script type="application/dart" src="main.dart"></script>
|
||||
<script src="packages/browser/dart.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
code-example(language="html").
|
||||
<!-- web/index.html -->
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<link rel="stylesheet" href="style.css">
|
||||
</head>
|
||||
<body>
|
||||
<my-app></my-app>
|
||||
<script type="application/dart" src="main.dart"></script>
|
||||
<script src="packages/browser/dart.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
.l-main-section
|
||||
h2#section-run-it Run the app!
|
||||
|
|
|
|||
|
|
@ -5,9 +5,8 @@
|
|||
p.
|
||||
You can specify the event handler—a method in the component controller—like this:
|
||||
|
||||
pre.prettyprint.lang-html
|
||||
code.
|
||||
<input (keyup)="myControllerMethod()">
|
||||
code-example(language="html").
|
||||
<input (keyup)="myControllerMethod()">
|
||||
p.
|
||||
As in previous examples, you can make element references available to
|
||||
other parts of the template as a local
|
||||
|
|
@ -17,10 +16,9 @@
|
|||
<!-- PENDING: make sure we use recommended word separation scheme.
|
||||
my-name doesn't work, but my_name does. Would myName work? -->
|
||||
|
||||
pre.prettyprint.lang-html
|
||||
code.
|
||||
<input #myname (keyup)>
|
||||
<p>{{myname.value}}</p>
|
||||
code-example(language="html").
|
||||
<input #myname (keyup)>
|
||||
<p>{{myname.value}}</p>
|
||||
|
||||
p.text-body(ng-non-bindable).
|
||||
In that example, <code>#myname</code> creates a local variable in the template that
|
||||
|
|
@ -46,16 +44,15 @@
|
|||
Then add a method that adds new items
|
||||
to the list.
|
||||
|
||||
pre.prettyprint.lang-dart
|
||||
code.
|
||||
class TodoList {
|
||||
List<String> todos =
|
||||
['Eat breakfast', 'Walk dog', 'Breathe', 'Learn Angular'];
|
||||
code-example(language="dart" format="linenums").
|
||||
class TodoList {
|
||||
List<String> todos =
|
||||
['Eat breakfast', 'Walk dog', 'Breathe', 'Learn Angular'];
|
||||
|
||||
addTodo(String todo) {
|
||||
todos.add(todo);
|
||||
}
|
||||
addTodo(String todo) {
|
||||
todos.add(todo);
|
||||
}
|
||||
}
|
||||
|
||||
.callout.is-helpful
|
||||
header Production Best Practice
|
||||
|
|
@ -73,13 +70,12 @@
|
|||
Using the <code>*for</code> iterator, create an <code><li></code> for each item in the todos list and set
|
||||
its text to the value.
|
||||
|
||||
pre.prettyprint.lang-html
|
||||
code.
|
||||
<ul>
|
||||
<li *for="#todo of todos">
|
||||
{{ todo }}
|
||||
</li>
|
||||
</ul>
|
||||
code-example(language="html" format="linenums").
|
||||
<ul>
|
||||
<li *for="#todo of todos">
|
||||
{{ todo }}
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
.l-main-section
|
||||
h2#section-add-todos-to-the-list Add todos to the list via button click
|
||||
|
|
@ -87,18 +83,16 @@
|
|||
Now, add a text input and a button for users to add items to the list. As you saw above, you can create a local
|
||||
variable reference in your template with <code>#varname</code>. Call it <code>#todotext</code> here.
|
||||
|
||||
pre.prettyprint.lang-html
|
||||
code.
|
||||
<input #todotext>
|
||||
code-example(language="html").
|
||||
<input #todotext>
|
||||
p.
|
||||
Specify the target of the click event binding as your controller's
|
||||
<code>addTodo()</code> method and pass
|
||||
it the value. Since you created a reference called <code>todotext</code>,
|
||||
you can get the value with <code>todotext.value.</code>
|
||||
|
||||
pre.prettyprint.lang-html
|
||||
code.
|
||||
<button (click)="addTodo(todotext.value)">Add Todo</button>
|
||||
code-example(language="html").
|
||||
<button (click)="addTodo(todotext.value)">Add Todo</button>
|
||||
|
||||
p.
|
||||
To make pressing Enter do something useful,
|
||||
|
|
@ -107,13 +101,59 @@
|
|||
<a href="https://api.dartlang.org/apidocs/channels/stable/dartdoc-viewer/dart:html">dart:html</a>,
|
||||
so be sure to import that library.
|
||||
|
||||
.code-box
|
||||
pre.prettyprint.lang-dart(data-name="todo_list.dart")
|
||||
code.
|
||||
// In the template:
|
||||
<input #todotext (keyup)="doneTyping(\$event)">
|
||||
code-tabs
|
||||
code-pane(language="dart" name="todo_list.dart" format="linenums").
|
||||
// In the template:
|
||||
<input #todotext (keyup)="doneTyping(\$event)">
|
||||
|
||||
// In the component controller class:
|
||||
doneTyping(KeyboardEvent event) {
|
||||
if (event.keyCode == KeyCode.ENTER) {
|
||||
InputElement e = event.target;
|
||||
addTodo(e.value);
|
||||
e.value = null;
|
||||
}
|
||||
}
|
||||
code-pane(language="dart" name="main.dart" format="linenums").
|
||||
library user_input;
|
||||
|
||||
import 'dart:html';
|
||||
...
|
||||
|
||||
.l-main-section
|
||||
h2#section-final-code Final code
|
||||
|
||||
code-tabs
|
||||
code-pane(language="dart" name="todo_list.dart" format="linenums").
|
||||
// web/todo_list.dart
|
||||
part of user_input;
|
||||
|
||||
@Component(
|
||||
selector: 'todo-list'
|
||||
)
|
||||
@View(
|
||||
// Without r before ''' (a raw string), $event breaks Angular.
|
||||
// An alternative to a raw string is to use \$event instead.
|
||||
template: r'''
|
||||
<ul>
|
||||
<li *for="#todo of todos">
|
||||
{{ todo }}
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<input #todotext (keyup)="doneTyping($event)">
|
||||
<button (click)="addTodo(todotext.value)">Add Todo</button>
|
||||
''',
|
||||
directives: const[For]
|
||||
)
|
||||
class TodoList {
|
||||
List<String> todos =
|
||||
['Eat breakfast', 'Walk dog', 'Breathe', 'Learn Angular'];
|
||||
|
||||
addTodo(String todo) {
|
||||
todos.add(todo);
|
||||
}
|
||||
|
||||
// In the component controller class:
|
||||
doneTyping(KeyboardEvent event) {
|
||||
if (event.keyCode == KeyCode.ENTER) {
|
||||
InputElement e = event.target;
|
||||
|
|
@ -121,96 +161,43 @@
|
|||
e.value = null;
|
||||
}
|
||||
}
|
||||
pre.prettyprint.lang-dart(data-name="main.dart")
|
||||
code.
|
||||
library user_input;
|
||||
}
|
||||
code-pane(language="dart" name="main.dart" format="linenums").
|
||||
// web/main.dart
|
||||
library user_input;
|
||||
|
||||
import 'dart:html';
|
||||
...
|
||||
import 'dart:html';
|
||||
|
||||
import 'package:angular2/angular2.dart';
|
||||
import 'package:angular2/src/reflection/reflection.dart' show reflector;
|
||||
import 'package:angular2/src/reflection/reflection_capabilities.dart' show ReflectionCapabilities;
|
||||
|
||||
.l-main-section
|
||||
h2#section-final-code Final code
|
||||
part 'todo_list.dart';
|
||||
|
||||
.code-box
|
||||
pre.prettyprint.lang-dart(data-name="todo_list.dart")
|
||||
code.
|
||||
// web/todo_list.dart
|
||||
part of user_input;
|
||||
main() {
|
||||
reflector.reflectionCapabilities = new ReflectionCapabilities();
|
||||
bootstrap(TodoList);
|
||||
}
|
||||
code-pane(language="html" name="index.html" format="linenums").
|
||||
<!-- web/index.html -->
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<link rel="stylesheet" href="style.css">
|
||||
</head>
|
||||
<body>
|
||||
|
||||
@Component(
|
||||
selector: 'todo-list'
|
||||
)
|
||||
@View(
|
||||
// Without r before ''' (a raw string), $event breaks Angular.
|
||||
// An alternative to a raw string is to use \$event instead.
|
||||
template: r'''
|
||||
<ul>
|
||||
<li *for="#todo of todos">
|
||||
{{ todo }}
|
||||
</li>
|
||||
</ul>
|
||||
<todo-list></todo-list>
|
||||
|
||||
<input #todotext (keyup)="doneTyping($event)">
|
||||
<button (click)="addTodo(todotext.value)">Add Todo</button>
|
||||
''',
|
||||
directives: const[For]
|
||||
)
|
||||
class TodoList {
|
||||
List<String> todos =
|
||||
['Eat breakfast', 'Walk dog', 'Breathe', 'Learn Angular'];
|
||||
|
||||
addTodo(String todo) {
|
||||
todos.add(todo);
|
||||
}
|
||||
|
||||
doneTyping(KeyboardEvent event) {
|
||||
if (event.keyCode == KeyCode.ENTER) {
|
||||
InputElement e = event.target;
|
||||
addTodo(e.value);
|
||||
e.value = null;
|
||||
}
|
||||
}
|
||||
}
|
||||
pre.prettyprint.lang-dart(data-name="main.dart")
|
||||
code.
|
||||
// web/main.dart
|
||||
library user_input;
|
||||
|
||||
import 'dart:html';
|
||||
|
||||
import 'package:angular2/angular2.dart';
|
||||
import 'package:angular2/src/reflection/reflection.dart' show reflector;
|
||||
import 'package:angular2/src/reflection/reflection_capabilities.dart' show ReflectionCapabilities;
|
||||
|
||||
part 'todo_list.dart';
|
||||
|
||||
main() {
|
||||
reflector.reflectionCapabilities = new ReflectionCapabilities();
|
||||
bootstrap(TodoList);
|
||||
}
|
||||
pre.prettyprint.lang-html(data-name="html")
|
||||
code.
|
||||
<!-- web/index.html -->
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<link rel="stylesheet" href="style.css">
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<todo-list></todo-list>
|
||||
|
||||
<script type="application/dart" src="main.dart"></script>
|
||||
<script src="packages/browser/dart.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
pre.prettyprint.lang-yaml(data-name="yaml")
|
||||
code.
|
||||
# pubspec.yaml
|
||||
name: user_input
|
||||
description: Dart version of Angular 2 example, Responding to User Input
|
||||
version: 0.0.1
|
||||
dependencies:
|
||||
angular2: 2.0.0-alpha.22
|
||||
browser: any
|
||||
<script type="application/dart" src="main.dart"></script>
|
||||
<script src="packages/browser/dart.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
code-pane(language="yaml" name="pubspec.yaml" format="linenums").
|
||||
# pubspec.yaml
|
||||
name: user_input
|
||||
description: Dart version of Angular 2 example, Responding to User Input
|
||||
version: 0.0.1
|
||||
dependencies:
|
||||
angular2: 2.0.0-alpha.22
|
||||
browser: any
|
||||
|
|
|
|||
|
|
@ -1,17 +0,0 @@
|
|||
doctype
|
||||
html(lang="en" ng-app="angularIOApp")
|
||||
head
|
||||
!= partial("../../../../_includes/_head-include")
|
||||
|
||||
body(class="l-offset-nav l-offset-side-nav" ng-controller="AppCtrl")
|
||||
!= partial("../../../../_includes/_main-nav")
|
||||
!= partial("../../../_includes/sidenav/_primary")
|
||||
!= partial("../../../../_includes/_hero")
|
||||
!= partial("../../../../_includes/_banner")
|
||||
|
||||
article.l-content-small.grid-fluid.docs-content(ng-non-bindable)
|
||||
!= yield
|
||||
!= partial("../../../../_includes/_next-item")
|
||||
|
||||
!= partial("../../../../_includes/_footer")
|
||||
!= partial("../../../../_includes/_scripts-include")
|
||||
|
|
@ -22,9 +22,10 @@
|
|||
h2#section-create-an-entry-point Create an entry point
|
||||
|
||||
p Open your favorite editor and create a show-properties.html file with the content:
|
||||
pre.prettyprint.linenums.lang-html
|
||||
code.
|
||||
<display></display>
|
||||
|
||||
code-example(language="html" escape="html").
|
||||
<display></display>
|
||||
|
||||
p
|
||||
| The <code><display></code> component here acts as the site where you'll insert your application.
|
||||
| We'll assume a structure like this for the rest of the examples here and just focus on the parts that
|
||||
|
|
@ -38,51 +39,51 @@
|
|||
|
||||
p To see this working, create another file, <code>show-properties.ts</code>, and add the following:
|
||||
|
||||
.code-box
|
||||
pre.prettyprint.linenums.lang-typescript(data-name="typescript")
|
||||
code.
|
||||
// TypeScript
|
||||
import {Component, View, bootstrap, For} from 'angular2/angular2';
|
||||
code-tabs
|
||||
code-pane(language="javascript" name="TypeScript" format="linenums" escape="html").
|
||||
// TypeScript
|
||||
import {Component, View, bootstrap, For} from 'angular2/angular2';
|
||||
|
||||
@Component({
|
||||
selector: 'display'
|
||||
})
|
||||
@View({
|
||||
template: `
|
||||
<p>My name: {{ myName }}</p>
|
||||
`,
|
||||
directives: [For]
|
||||
})
|
||||
class DisplayComponent {
|
||||
myName: string;
|
||||
names: Array<string>;
|
||||
|
||||
constructor() {
|
||||
this.myName = "Alice";
|
||||
}
|
||||
}
|
||||
code-pane(language="javascript" name="ES5" format="linenums" escape="html").
|
||||
// ES5
|
||||
function DisplayComponent() {
|
||||
this.myName = "Alice";
|
||||
}
|
||||
DisplayComponent.annotations = [
|
||||
new angular.ComponentAnnotation({
|
||||
selector: "display"
|
||||
}),
|
||||
new angular.ViewAnnotation({
|
||||
template:
|
||||
'<p>My name: {{ myName }}</p>',
|
||||
directives: [angular.For, angular.If]
|
||||
})
|
||||
];
|
||||
|
||||
@Component({
|
||||
selector: 'display'
|
||||
})
|
||||
@View({
|
||||
template: `
|
||||
<p>My name: {{ myName }}</p>
|
||||
`,
|
||||
directives: [For]
|
||||
})
|
||||
class DisplayComponent {
|
||||
myName: string;
|
||||
names: Array<string>;
|
||||
|
||||
constructor() {
|
||||
this.myName = "Alice";
|
||||
}
|
||||
}
|
||||
pre.prettyprint.linenums.lang-javascript(data-name="es5")
|
||||
code.
|
||||
// ES5
|
||||
function DisplayComponent() {
|
||||
this.myName = "Alice";
|
||||
}
|
||||
DisplayComponent.annotations = [
|
||||
new angular.ComponentAnnotation({
|
||||
selector: "display"
|
||||
}),
|
||||
new angular.ViewAnnotation({
|
||||
template:
|
||||
'<p>My name: {{ myName }}</p>',
|
||||
directives: [angular.For, angular.If]
|
||||
})
|
||||
];
|
||||
p.
|
||||
You've just defined a component that encompasses a view and controller for the app. The view
|
||||
defines a template:
|
||||
pre.prettyprint.lang-html
|
||||
code.
|
||||
<p>My name: {{ myName }}</p>
|
||||
|
||||
code-example(language="html" escape="html").
|
||||
<p>My name: {{ myName }}</p>
|
||||
|
||||
p.
|
||||
Angular will automatically pull the value of <code>myName</code> and insert it into the browser and
|
||||
|
|
@ -100,16 +101,16 @@
|
|||
just one property, myName.
|
||||
|
||||
.callout.is-helpful
|
||||
header Note
|
||||
p.
|
||||
While you've used <code>template:</code> to specify an inline view, for larger templates you'd
|
||||
want to move them to a separate file and load them with <code>templateUrl:</code> instead.
|
||||
header Note
|
||||
p.
|
||||
While you've used <code>template:</code> to specify an inline view, for larger templates you'd
|
||||
want to move them to a separate file and load them with <code>templateUrl:</code> instead.
|
||||
|
||||
p So you can see Angular dynamically update content, add a line after
|
||||
|
||||
pre.prettyprint.lang-html
|
||||
code.
|
||||
<p>My name: {{ myName }}</p>
|
||||
code-example(language="html" escape="html").
|
||||
<p>My name: {{ myName }}</p>
|
||||
|
||||
p to this:
|
||||
pre.prettyprint.lang-html
|
||||
code.
|
||||
|
|
@ -122,79 +123,77 @@
|
|||
code.
|
||||
setInterval(function () { this.time = (new Date()).toString(); }.bind(this), 1000);
|
||||
p Reload the page in your browser and you'll now see the seconds updating automatically.
|
||||
|
||||
.l-main-section
|
||||
h2#Create-an-array Create an array property and use For on the view
|
||||
p Moving up from a single property, create an array to display as a list.
|
||||
.code-box
|
||||
pre.prettyprint.lang-typescript(data-name="typescript")
|
||||
code.
|
||||
//Typescript
|
||||
constructor() {
|
||||
this.myName = "Alice";
|
||||
this.names = ["Aarav", "Martín", "Shannon", "Ariana", "Kai"];
|
||||
}
|
||||
pre.prettyprint.lang-javascript(data-name="es5")
|
||||
code.
|
||||
//ES5
|
||||
function DisplayComponent() {
|
||||
this.myName = "Alice";
|
||||
this.names = ["Aarav", "Martín", "Shannon", "Ariana", "Kai"];
|
||||
}
|
||||
|
||||
code-tabs
|
||||
code-pane(language="javascript" name="TypeScript" format="linenums" escape="html").
|
||||
//Typescript
|
||||
constructor() {
|
||||
this.myName = "Alice";
|
||||
this.names = ["Aarav", "Martín", "Shannon", "Ariana", "Kai"];
|
||||
}
|
||||
code-pane(language="javascript" name="Javascript (ES5)" format="linenums" escape="html").
|
||||
//ES5
|
||||
function DisplayComponent() {
|
||||
this.myName = "Alice";
|
||||
this.names = ["Aarav", "Martín", "Shannon", "Ariana", "Kai"];
|
||||
}
|
||||
p.
|
||||
You can then use this array in your template with the <code>for</code> directive to create copies of DOM elements
|
||||
with one for each item in the array.
|
||||
.code-box
|
||||
pre.prettyprint.lang-javascript(data-name="es5")
|
||||
code.
|
||||
//ES5
|
||||
template:
|
||||
'<p>My name: {{ myName }}</p>' +
|
||||
'<p>Friends:</p>' +
|
||||
'<ul>' +
|
||||
'<li *for="#name of names">' +
|
||||
'{{ name }}' +
|
||||
'</li>' +
|
||||
'</ul>',
|
||||
|
||||
pre.prettyprint.lang-typescript(data-name="typescript")
|
||||
code.
|
||||
//Typescript
|
||||
template: `
|
||||
<p>My name: {{ myName }}</p>
|
||||
<p>Friends:</p>
|
||||
<ul>
|
||||
<li *for="#name of names">
|
||||
{{ name }}
|
||||
</li>
|
||||
</ul>
|
||||
`,
|
||||
code-tabs
|
||||
code-pane(language="javascript" name="TypeScript" format="linenums").
|
||||
//Typescript
|
||||
template: `
|
||||
<p>My name: {{ myName }}</p>
|
||||
<p>Friends:</p>
|
||||
<ul>
|
||||
<li *for="#name of names">
|
||||
{{ name }}
|
||||
</li>
|
||||
</ul>
|
||||
`,
|
||||
code-pane(language="javascript" name="ES5" format="linenums").
|
||||
//ES5
|
||||
template:
|
||||
'<p>My name: {{ myName }}</p>' +
|
||||
'<p>Friends:</p>' +
|
||||
'<ul>' +
|
||||
'<li *for="#name of names">' +
|
||||
'{{ name }}' +
|
||||
'</li>' +
|
||||
'</ul>',
|
||||
|
||||
p.
|
||||
To make this work, you'll also need to add the <code>For</code> directive used by the template so
|
||||
that Angular knows to include it:
|
||||
|
||||
.code-box
|
||||
pre.prettyprint.lang-typescript(data-name="typescript")
|
||||
code.
|
||||
//Typescript
|
||||
import {Component, View, bootstrap, For} from
|
||||
...
|
||||
directives: [For]
|
||||
pre.prettyprint.lang-javascript(data-name="es5")
|
||||
code.
|
||||
//ES5
|
||||
directives: [angular.For]
|
||||
code-tabs
|
||||
code-pane(language="javascript" name="TypeScript" format="linenums").
|
||||
//Typescript
|
||||
import {Component, View, bootstrap, For} from
|
||||
...
|
||||
directives: [For]
|
||||
|
||||
code-pane(language="javascript" name="ES5" format="linenums").
|
||||
//ES5
|
||||
directives: [angular.For]
|
||||
|
||||
p Reload and you've got your list of friends!
|
||||
p.
|
||||
Again, Angular will mirror changes you make to this list over in the DOM. Add a new item and it appears in your
|
||||
list. Delete one and Angular deletes the <li>. Reorder items and Angular makes the corresponding reorder of
|
||||
the DOM list.
|
||||
p Let's look at the few lines that do the work again:
|
||||
pre.prettyprint.lang-html
|
||||
code.
|
||||
//HTML
|
||||
<li *for="#name of names">
|
||||
{{ name }}
|
||||
</li>
|
||||
code-example(language="html" format="linenums").
|
||||
//HTML
|
||||
<li *for="#name of names">
|
||||
{{ name }}
|
||||
</li>
|
||||
p The way to read this is:
|
||||
ul
|
||||
li.
|
||||
|
|
@ -211,83 +210,80 @@
|
|||
proper form. We should separate the concerns by having another class serve the role of model and inject it into
|
||||
the controller.
|
||||
p Make a <code>FriendsService</code> class to provide the model with the list of friends.
|
||||
pre.prettyprint.lang-javascript
|
||||
code.
|
||||
class FriendsService {
|
||||
names: Array<string>;
|
||||
constructor() {
|
||||
this.names = ["Alice", "Aarav", "Martín", "Shannon", "Ariana", "Kai"];
|
||||
}
|
||||
}
|
||||
|
||||
code-example(language="javascript" format="linenums").
|
||||
class FriendsService {
|
||||
names: Array<string>;
|
||||
constructor() {
|
||||
this.names = ["Alice", "Aarav", "Martín", "Shannon", "Ariana", "Kai"];
|
||||
}
|
||||
}
|
||||
p.
|
||||
Replace the current list of friends in DisplayComponent by passing in the FriendsService and setting the list of
|
||||
names in DisplayComponent to the names provided by the service you passed in.
|
||||
pre.prettyprint.lang-javascript
|
||||
code.
|
||||
class DisplayComponent {
|
||||
names: Array<string>;
|
||||
constructor(friendsService: FriendsService) {
|
||||
this.names = friendsService.names;
|
||||
}
|
||||
}
|
||||
|
||||
code-example(language="javascript" format="linenums").
|
||||
class DisplayComponent {
|
||||
names: Array<string>;
|
||||
constructor(friendsService: FriendsService) {
|
||||
this.names = friendsService.names;
|
||||
}
|
||||
}
|
||||
|
||||
p And then make FriendsService available to dependency injection
|
||||
pre.prettyprint.lang-javascript
|
||||
code.
|
||||
@Component({
|
||||
...
|
||||
injectables: [FriendsService]
|
||||
})
|
||||
...
|
||||
class DisplayComponent {...
|
||||
code-example(language="javascript" format="linenums").
|
||||
@Component({
|
||||
...
|
||||
injectables: [FriendsService]
|
||||
})
|
||||
...
|
||||
class DisplayComponent {...
|
||||
.callout.is-helpful
|
||||
header ES5 Note
|
||||
p.
|
||||
The dependency injection syntax here is using the low-level API and is...well...not very nice. We're
|
||||
working on sugaring the syntax to match the way it works in Angular 1. Expect this to change soon.
|
||||
|
||||
.code-box
|
||||
pre.prettyprint.lang-typescript(data-name="typescript")
|
||||
code.
|
||||
//TypeScript
|
||||
class FriendsService {
|
||||
names: Array<string>;
|
||||
constructor() {
|
||||
this.names = ["Alice", "Aarav", "Martín", "Shannon", "Ariana", "Kai"];
|
||||
}
|
||||
}
|
||||
...
|
||||
class DisplayComponent {
|
||||
names: Array<string>;
|
||||
code-tabs
|
||||
code-pane(language="javascript" name="TypeScript" format="linenums").
|
||||
//TypeScript
|
||||
class FriendsService {
|
||||
names: Array<string>;
|
||||
constructor() {
|
||||
this.names = ["Alice", "Aarav", "Martín", "Shannon", "Ariana", "Kai"];
|
||||
}
|
||||
}
|
||||
...
|
||||
class DisplayComponent {
|
||||
names: Array<string>;
|
||||
|
||||
constructor(friendsService: FriendsService) {
|
||||
this.names = friendsService.names;
|
||||
}
|
||||
constructor(friendsService: FriendsService) {
|
||||
this.names = friendsService.names;
|
||||
}
|
||||
}
|
||||
|
||||
pre.prettyprint.lang-javascript(data-name="es5")
|
||||
code.
|
||||
//ES5
|
||||
function FriendsService() {
|
||||
this.names = ["Alice", "Aarav", "Martín", "Shannon", "Ariana", "Kai"];
|
||||
}
|
||||
function DisplayComponent(friends) {
|
||||
this.myName = "Alice";
|
||||
this.names = friends.names;
|
||||
}
|
||||
DisplayComponent.annotations = [
|
||||
new angular.ComponentAnnotation({
|
||||
selector: "display",
|
||||
injectables: [FriendsService]
|
||||
}),
|
||||
new angular.ViewAnnotation({
|
||||
template: '{{ myName }} <ul> <li *for="#name of names">{{ name }}</li> </ul>',
|
||||
directives: [angular.For, angular.If]
|
||||
})
|
||||
];
|
||||
DisplayComponent.parameters = [[FriendsService]];
|
||||
document.addEventListener("DOMContentLoaded", function() {
|
||||
angular.bootstrap(DisplayComponent);
|
||||
});
|
||||
code-pane(language="javascript" name="ES5" format="linenums").
|
||||
//ES5
|
||||
function FriendsService() {
|
||||
this.names = ["Alice", "Aarav", "Martín", "Shannon", "Ariana", "Kai"];
|
||||
}
|
||||
function DisplayComponent(friends) {
|
||||
this.myName = "Alice";
|
||||
this.names = friends.names;
|
||||
}
|
||||
DisplayComponent.annotations = [
|
||||
new angular.ComponentAnnotation({
|
||||
selector: "display",
|
||||
injectables: [FriendsService]
|
||||
}),
|
||||
new angular.ViewAnnotation({
|
||||
template: '{{ myName }} <ul> <li *for="#name of names">{{ name }}</li> </ul>',
|
||||
directives: [angular.For, angular.If]
|
||||
})
|
||||
];
|
||||
DisplayComponent.parameters = [[FriendsService]];
|
||||
document.addEventListener("DOMContentLoaded", function() {
|
||||
angular.bootstrap(DisplayComponent);
|
||||
});
|
||||
.l-main-section
|
||||
h2#Conditionally-displaying-data-with-If Conditionally displaying data with If
|
||||
p.
|
||||
|
|
@ -299,70 +295,67 @@
|
|||
<p *if="names.length > 3">You have many friends!</p>
|
||||
p You'll also need to add the <code>If</code> directive so Angular knows to include it.
|
||||
|
||||
.code-box
|
||||
pre.prettyprint.lang-typescript(data-name="typescript")
|
||||
code.
|
||||
//Typescript
|
||||
import {Component, View, bootstrap, For, If} from
|
||||
...
|
||||
directives: [For, If]
|
||||
pre.prettyprint.lang-javascript(data-name="es5")
|
||||
code.
|
||||
//ES5
|
||||
directives: [angular.For, angular.If]
|
||||
code-tabs
|
||||
code-pane(language="javascript" name="TypeScript" format="linenums").
|
||||
//Typescript
|
||||
import {Component, View, bootstrap, For, If} from
|
||||
...
|
||||
directives: [For, If]
|
||||
code-pane(language="javascript" name="ES5" format="linenums").
|
||||
//ES5
|
||||
directives: [angular.For, angular.If]
|
||||
p.
|
||||
As there are currently 5 items it the list, you'll see the message congratulating you on your many friends.
|
||||
Remove two items from the list, reload your browser, and see that the message no longer displays.
|
||||
.code-box
|
||||
pre.prettyprint.lang-typescript(data-name="typescript")
|
||||
code.
|
||||
//TypeScript
|
||||
import {Component, View, bootstrap, For, If} from 'angular2/angular2';
|
||||
@Component({
|
||||
selector: 'display'
|
||||
})
|
||||
@View({
|
||||
template: `
|
||||
<p>My name: {{ myName }}</p>
|
||||
<p>Friends:</p>
|
||||
<ul>
|
||||
<li *for="#name of names">
|
||||
{{ name }}
|
||||
</li>
|
||||
</ul>
|
||||
<p *if="names.length > 3">You have many friends!</p>
|
||||
`,
|
||||
directives: [For, If]
|
||||
})
|
||||
class DisplayComponent {
|
||||
myName: string;
|
||||
todos: Array<string>
|
||||
constructor() {
|
||||
this.myName = "Alice";
|
||||
this.names = ["Aarav", "Martín", "Shannon", "Ariana", "Kai"];
|
||||
}
|
||||
}
|
||||
pre.prettyprint.lang-javascript(data-name="es5")
|
||||
code.
|
||||
//ES5
|
||||
function DisplayComponent() {
|
||||
this.myName = "Alice";
|
||||
this.names = ["Aarav", "Martín", "Shannon", "Ariana", "Kai"];
|
||||
}
|
||||
DisplayComponent.annotations = [
|
||||
new angular.ComponentAnnotation({
|
||||
selector: "display"
|
||||
}),
|
||||
new angular.ViewAnnotation({
|
||||
template:
|
||||
'<p>My name: {{ myName }}</p>' +
|
||||
'<p>Friends:</p>' +
|
||||
'<ul>' +
|
||||
'<li *for="#name of names">' +
|
||||
'{{ name }}' +
|
||||
'</li>' +
|
||||
'</ul>' +
|
||||
'<p *if="names.length > 3">You have many friends!</p>',
|
||||
directives: [angular.For, angular.If]
|
||||
})
|
||||
];
|
||||
|
||||
code-tabs
|
||||
code-pane(language="javascript" name="TypeScript" format="linenums").
|
||||
//TypeScript
|
||||
import {Component, View, bootstrap, For, If} from 'angular2/angular2';
|
||||
@Component({
|
||||
selector: 'display'
|
||||
})
|
||||
@View({
|
||||
template: `
|
||||
<p>My name: {{ myName }}</p>
|
||||
<p>Friends:</p>
|
||||
<ul>
|
||||
<li *for="#name of names">
|
||||
{{ name }}
|
||||
</li>
|
||||
</ul>
|
||||
<p *if="names.length > 3">You have many friends!</p>
|
||||
`,
|
||||
directives: [For, If]
|
||||
})
|
||||
class DisplayComponent {
|
||||
myName: string;
|
||||
todos: Array<string>
|
||||
constructor() {
|
||||
this.myName = "Alice";
|
||||
this.names = ["Aarav", "Martín", "Shannon", "Ariana", "Kai"];
|
||||
}
|
||||
}
|
||||
code-pane(language="javascript" name="ES5" format="linenums").
|
||||
//ES5
|
||||
function DisplayComponent() {
|
||||
this.myName = "Alice";
|
||||
this.names = ["Aarav", "Martín", "Shannon", "Ariana", "Kai"];
|
||||
}
|
||||
DisplayComponent.annotations = [
|
||||
new angular.ComponentAnnotation({
|
||||
selector: "display"
|
||||
}),
|
||||
new angular.ViewAnnotation({
|
||||
template:
|
||||
'<p>My name: {{ myName }}</p>' +
|
||||
'<p>Friends:</p>' +
|
||||
'<ul>' +
|
||||
'<li *for="#name of names">' +
|
||||
'{{ name }}' +
|
||||
'</li>' +
|
||||
'</ul>' +
|
||||
'<p *if="names.length > 3">You have many friends!</p>',
|
||||
directives: [angular.For, angular.If]
|
||||
})
|
||||
];
|
||||
|
|
|
|||
|
|
@ -10,80 +10,76 @@
|
|||
Given a bootstrapping template with a <code><parent></code> tag in the body, you can create a parent
|
||||
component that uses a <code><child></code> component like so:
|
||||
|
||||
.code-box
|
||||
pre.prettyprint.linenums.lang-typescript(data-name="typescript")
|
||||
code.
|
||||
//TypeScript
|
||||
@Component({
|
||||
selector: 'parent'
|
||||
})
|
||||
@View({
|
||||
template: `
|
||||
<h1>{{ message }}</h1>
|
||||
<child></child>
|
||||
`,
|
||||
directives: [ChildComponent]
|
||||
})
|
||||
class ParentComponent {
|
||||
message: string;
|
||||
code-tabs
|
||||
code-pane(language="javascript" name="TypeScript" format="linenums").
|
||||
//TypeScript
|
||||
@Component({
|
||||
selector: 'parent'
|
||||
})
|
||||
@View({
|
||||
template: `
|
||||
<h1>{{ message }}</h1>
|
||||
<child></child>
|
||||
`,
|
||||
directives: [ChildComponent]
|
||||
})
|
||||
class ParentComponent {
|
||||
message: string;
|
||||
|
||||
constructor() {
|
||||
this.message = "I'm the parent";
|
||||
}
|
||||
}
|
||||
pre.prettyprint.linenums.lang-javascript(data-name="es5")
|
||||
code.
|
||||
//ES5
|
||||
function ParentComponent() {
|
||||
constructor() {
|
||||
this.message = "I'm the parent";
|
||||
}
|
||||
ParentComponent.annotations = [
|
||||
new angular.ComponentAnnotation({
|
||||
selector: "parent"
|
||||
}),
|
||||
new angular.ViewAnnotation({
|
||||
template:
|
||||
'<h1>{{ message }}</h1>' +
|
||||
'<child></child>',
|
||||
directives: [ChildComponent]
|
||||
})
|
||||
];
|
||||
}
|
||||
code-pane(language="javascript" name="ES5" format="linenums").
|
||||
//ES5
|
||||
function ParentComponent() {
|
||||
this.message = "I'm the parent";
|
||||
}
|
||||
ParentComponent.annotations = [
|
||||
new angular.ComponentAnnotation({
|
||||
selector: "parent"
|
||||
}),
|
||||
new angular.ViewAnnotation({
|
||||
template:
|
||||
'<h1>{{ message }}</h1>' +
|
||||
'<child></child>',
|
||||
directives: [ChildComponent]
|
||||
})
|
||||
];
|
||||
|
||||
|
||||
p You then just need to write the <code>ChildComponent</code> class to make it work:
|
||||
|
||||
.code-box
|
||||
pre.prettyprint.linenums.lang-typescript(data-name="typescript")
|
||||
code.
|
||||
//TypeScript
|
||||
@Component({
|
||||
selector: 'child'
|
||||
})
|
||||
@View({
|
||||
template: `
|
||||
<p> {{ message }} </p>
|
||||
`
|
||||
})
|
||||
class ChildComponent {
|
||||
message: string;
|
||||
constructor() {
|
||||
this.message = "I'm the child";
|
||||
}
|
||||
}
|
||||
pre.prettyprint.linenums.lang-javascript(data-name="es5")
|
||||
code.
|
||||
//ES5
|
||||
function ChildComponent() {
|
||||
code-tabs
|
||||
code-pane(language="javascript" name="TypeScript" format="linenums").
|
||||
//TypeScript
|
||||
@Component({
|
||||
selector: 'child'
|
||||
})
|
||||
@View({
|
||||
template: `
|
||||
<p> {{ message }} </p>
|
||||
`
|
||||
})
|
||||
class ChildComponent {
|
||||
message: string;
|
||||
constructor() {
|
||||
this.message = "I'm the child";
|
||||
}
|
||||
ChildComponent.annotations = [
|
||||
new angular.ComponentAnnotation({
|
||||
selector: "child"
|
||||
}),
|
||||
new angular.ViewAnnotation({
|
||||
template: '<p> {{ message }} </p>'
|
||||
})
|
||||
];
|
||||
}
|
||||
code-pane(language="javascript" name="ES5" format="linenums").
|
||||
//ES5
|
||||
function ChildComponent() {
|
||||
this.message = "I'm the child";
|
||||
}
|
||||
ChildComponent.annotations = [
|
||||
new angular.ComponentAnnotation({
|
||||
selector: "child"
|
||||
}),
|
||||
new angular.ViewAnnotation({
|
||||
template: '<p> {{ message }} </p>'
|
||||
})
|
||||
];
|
||||
|
||||
|
||||
p.
|
||||
|
|
|
|||
|
|
@ -39,36 +39,34 @@
|
|||
p.
|
||||
The TypeScript setup includes System.js, a third-party open-source library that adds ES6 module loading functionality to browsers. This step isn't needed for the ES5 version.
|
||||
|
||||
.code-box
|
||||
pre.prettyprint.lang-html(data-name="typescript")
|
||||
code.
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<link rel="stylesheet" href="style.css">
|
||||
<script src="https://jspm.io/system@0.16.js"></script>
|
||||
<script src="https://code.angularjs.org/2.0.0-alpha.22/angular2.dev.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<my-app></my-app>
|
||||
<script>
|
||||
System.import('main');
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
code-tabs
|
||||
code-pane(language="html" name="TypeScript" format="linenums").
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<link rel="stylesheet" href="style.css">
|
||||
<script src="https://jspm.io/system@0.16.js"></script>
|
||||
<script src="https://code.angularjs.org/2.0.0-alpha.22/angular2.dev.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<my-app></my-app>
|
||||
<script>
|
||||
System.import('main');
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
pre.prettyprint.lang-html(data-name="es5")
|
||||
code.
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<script src="https://code.angularjs.org/2.0.0-alpha.22/angular2.sfx.dev.js"></script>
|
||||
<script src="main.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<my-app></my-app>
|
||||
</body>
|
||||
</html>
|
||||
code-pane(language="html" name="ES5" format="linenums").
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<script src="https://code.angularjs.org/2.0.0-alpha.22/angular2.sfx.dev.js"></script>
|
||||
<script src="main.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<my-app></my-app>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
.callout.is-helpful
|
||||
header Don't use code.angularjs.org in a live app
|
||||
|
|
@ -84,24 +82,21 @@
|
|||
<code><my-app></code> element in <code>index.html</code>, and call Angular's <code>bootstrap()</code> to kick
|
||||
it all off like this:
|
||||
|
||||
.code-box
|
||||
pre.prettyprint.lang-typescript(data-name="typescript")
|
||||
code.
|
||||
import {Component, View, bootstrap} from 'angular2/angular2';
|
||||
code-tabs
|
||||
code-pane(language="javascript" name="TypeScript" format="linenums").
|
||||
import {Component, View, bootstrap} from 'angular2/angular2';
|
||||
|
||||
@Component({
|
||||
selector: 'my-app'
|
||||
})
|
||||
@View({
|
||||
template: '<h1>My first Angular 2 App</h1>'
|
||||
})
|
||||
class AppComponent {
|
||||
}
|
||||
@Component({
|
||||
selector: 'my-app'
|
||||
})
|
||||
@View({
|
||||
template: '<h1>My first Angular 2 App</h1>'
|
||||
})
|
||||
class AppComponent {
|
||||
}
|
||||
|
||||
bootstrap(AppComponent);
|
||||
|
||||
pre.prettyprint.lang-javascript(data-name="es5")
|
||||
code.
|
||||
bootstrap(AppComponent);
|
||||
code-pane(language="javascript" name="ES5" format="linenums").
|
||||
function AppComponent() {}
|
||||
|
||||
AppComponent.annotations = [
|
||||
|
|
@ -179,16 +174,14 @@
|
|||
p.
|
||||
In ES5 the script file creates an angular property on the window of the browser. This property contains every piece of Angular core, whether you need it or not.
|
||||
|
||||
.code-box
|
||||
pre.prettyprint.lang-typescript(data-name="typescript")
|
||||
code.
|
||||
import {Component, View, bootstrap} from 'angular2/angular2';
|
||||
...
|
||||
// bootstrap is available for use because it was imported from angular core
|
||||
bootstrap(AppComponent);
|
||||
pre.prettyprint.lang-typescript(data-name="es5")
|
||||
code.
|
||||
// window.angular is available because the script file attaches the angular property to the window
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
angular.bootstrap(AppComponent);
|
||||
});
|
||||
code-tabs
|
||||
code-pane(language="javascript" name="TypeScript" format="linenums" ).
|
||||
import {Component, View, bootstrap} from 'angular2/angular2';
|
||||
...
|
||||
// bootstrap is available for use because it was imported from angular core
|
||||
bootstrap(AppComponent);
|
||||
code-pane(language="javascript" name="ES5" format="linenums").
|
||||
// window.angular is available because the script file attaches the angular property to the window
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
angular.bootstrap(AppComponent);
|
||||
});
|
||||
|
|
|
|||
|
|
@ -6,19 +6,17 @@
|
|||
p.
|
||||
For a particular control like an input you can have it call methods on your controller on keyup event like so:
|
||||
|
||||
pre.prettyprint.lang-html
|
||||
code.
|
||||
<input (keyup)="myControllerMethod()">
|
||||
code-example(language="html").
|
||||
<input (keyup)="myControllerMethod()">
|
||||
|
||||
h3#local-variables Local variables
|
||||
p.
|
||||
As in previous examples, you can make element references available to other parts of the template as a local
|
||||
variable using the <code>#var</code> syntax. With this and events, we can do the old "update text as you type" example:
|
||||
|
||||
pre.prettyprint.lang-html
|
||||
code.
|
||||
<input #myname (keyup)>
|
||||
<p>{{myname.value}}</p>
|
||||
code-example(language="html").
|
||||
<input #myname (keyup)>
|
||||
<p>{{myname.value}}</p>
|
||||
|
||||
p.text-body(ng-non-bindable).
|
||||
The <code>#myname</code> creates a local variable in the template that we'll refer to below in the
|
||||
|
|
@ -37,28 +35,26 @@
|
|||
list. Inside the controller, add an array with an initial list of items. Then add a method that pushes new items
|
||||
on the array when called.
|
||||
|
||||
.code-box
|
||||
pre.prettyprint.linenums.lang-typescript(data-name="typescript")
|
||||
code.
|
||||
//TypeScript
|
||||
class TodoList {
|
||||
todos: Array<string>;
|
||||
constructor() {
|
||||
this.todos = ["Eat Breakfast", "Walk Dog", "Breathe"];
|
||||
}
|
||||
addTodo(todo: string) {
|
||||
this.todos.push(todo);
|
||||
}
|
||||
}
|
||||
pre.prettyprint.linenums.lang-javascript(data-name="es5")
|
||||
code.
|
||||
//ES5
|
||||
function TodoList() {
|
||||
code-tabs
|
||||
code-pane(language="javascript" name="TypeScript" format="linenums").
|
||||
//TypeScript
|
||||
class TodoList {
|
||||
todos: Array<string>;
|
||||
constructor() {
|
||||
this.todos = ["Eat Breakfast", "Walk Dog", "Breathe"];
|
||||
this.addTodo = function(todo) {
|
||||
this.todos.push(todo);
|
||||
};
|
||||
}
|
||||
addTodo(todo: string) {
|
||||
this.todos.push(todo);
|
||||
}
|
||||
}
|
||||
code-pane(language="javascript" name="ES5" format="linenums").
|
||||
//ES5
|
||||
function TodoList() {
|
||||
this.todos = ["Eat Breakfast", "Walk Dog", "Breathe"];
|
||||
this.addTodo = function(todo) {
|
||||
this.todos.push(todo);
|
||||
};
|
||||
}
|
||||
|
||||
.callout.is-helpful
|
||||
header Production Best Practice
|
||||
|
|
@ -72,13 +68,12 @@
|
|||
Using the <code>*for</code> iterator, create an <code><li></code> for each item in the todos array and set
|
||||
its text to the value.
|
||||
|
||||
pre.prettyprint.linenums.lang-html
|
||||
code.
|
||||
<ul>
|
||||
<li *for="#todo of todos">
|
||||
{{ todo }}
|
||||
</li>
|
||||
</ul>
|
||||
code-example(language="html" format="linenums").
|
||||
<ul>
|
||||
<li *for="#todo of todos">
|
||||
{{ todo }}
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
.l-main-section
|
||||
h2#section-add-todos-to-the-list Add todos to the list via button click
|
||||
|
|
@ -86,109 +81,104 @@
|
|||
Now, add a text input and a button for users to add items to the list. As you saw above, you can create a local
|
||||
variable reference in your template with <code>#varname</code>. Call it <code>#todotext</code> here.
|
||||
|
||||
pre.prettyprint.lang-html
|
||||
code.
|
||||
<input #todotext>
|
||||
code-example(language="html" format="linenums").
|
||||
<input #todotext>
|
||||
p.
|
||||
Lastly, specify the target of the click event binding as your controller's <code>addTodo()</code> method and pass
|
||||
it the value. Since you created a reference called <code>todotext</code>, you can get the value with
|
||||
<code>todotext.value.</code>
|
||||
|
||||
pre.prettyprint.lang-html
|
||||
code.
|
||||
<button (click)="addTodo(todotext.value)">Add Todo</button>
|
||||
code-example(language="html" format="linenums").
|
||||
<button (click)="addTodo(todotext.value)">Add Todo</button>
|
||||
|
||||
p And then create the <code>doneTyping()</code> method on TodoList and handle adding the todo text.
|
||||
|
||||
pre.prettyprint.lang-javascript
|
||||
code.
|
||||
doneTyping($event) {
|
||||
if($event.which === 13) {
|
||||
this.addTodo($event.target.value);
|
||||
$event.target.value = null;
|
||||
}
|
||||
code-example(language="javascript" format="linenums").
|
||||
doneTyping($event) {
|
||||
if($event.which === 13) {
|
||||
this.addTodo($event.target.value);
|
||||
$event.target.value = null;
|
||||
}
|
||||
}
|
||||
.l-main-section
|
||||
h2#section-final-code Final Code
|
||||
|
||||
.code-box
|
||||
pre.prettyprint.lang-typescript(data-name="typescript")
|
||||
code.
|
||||
//TypeScript
|
||||
import {Component, View, bootstrap, For, If} from 'angular2/angular2';
|
||||
code-tabs
|
||||
code-pane(language="javascript" name="TypeScript" format="linenums").
|
||||
//TypeScript
|
||||
import {Component, View, bootstrap, For, If} from 'angular2/angular2';
|
||||
|
||||
@Component({
|
||||
selector: 'todo-list'
|
||||
})
|
||||
@View({
|
||||
template: `
|
||||
<ul>
|
||||
<li *for="#todo of todos">
|
||||
{{ todo }}
|
||||
</li>
|
||||
</ul>
|
||||
@Component({
|
||||
selector: 'todo-list'
|
||||
})
|
||||
@View({
|
||||
template: `
|
||||
<ul>
|
||||
<li *for="#todo of todos">
|
||||
{{ todo }}
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<input #todotext (keyup)="doneTyping($event)">
|
||||
<button (click)="addTodo(todotext.value)">Add Todo</button>
|
||||
`,
|
||||
directives: [For, If]
|
||||
})
|
||||
class TodoList {
|
||||
todos: Array<string>;
|
||||
<input #todotext (keyup)="doneTyping($event)">
|
||||
<button (click)="addTodo(todotext.value)">Add Todo</button>
|
||||
`,
|
||||
directives: [For, If]
|
||||
})
|
||||
class TodoList {
|
||||
todos: Array<string>;
|
||||
|
||||
constructor() {
|
||||
this.todos = ["Eat Breakfast", "Walk Dog", "Breathe"];
|
||||
}
|
||||
|
||||
addTodo(todo: string) {
|
||||
this.todos.push(todo);
|
||||
}
|
||||
|
||||
doneTyping($event) {
|
||||
if($event.which === 13) {
|
||||
this.addTodo($event.target.value);
|
||||
$event.target.value = null;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
bootstrap(TodoList);
|
||||
pre.prettyprint.lang-javascript(data-name="es5")
|
||||
code.
|
||||
//ES5
|
||||
function TodoList() {
|
||||
constructor() {
|
||||
this.todos = ["Eat Breakfast", "Walk Dog", "Breathe"];
|
||||
|
||||
this.addTodo = function(todo) {
|
||||
this.todos.push(todo);
|
||||
};
|
||||
|
||||
this.doneTyping = function($event) {
|
||||
if($event.which === 13) {
|
||||
this.addTodo($event.target.value);
|
||||
$event.target.value = null;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
TodoList.annotations = [
|
||||
new angular.ComponentAnnotation({
|
||||
selector: "todo-list"
|
||||
}),
|
||||
new angular.ViewAnnotation({
|
||||
template:
|
||||
'<ul>' +
|
||||
'<li *for="#todo of todos">' +
|
||||
'{{ todo }}' +
|
||||
'</li>' +
|
||||
'</ul>' +
|
||||
'<input #textbox (keyup)="doneTyping($event)">' +
|
||||
'<button (click)="addTodo(textbox.value)">Add Todo</button>',
|
||||
directives: [angular.For, angular.If]
|
||||
})
|
||||
];
|
||||
addTodo(todo: string) {
|
||||
this.todos.push(todo);
|
||||
}
|
||||
|
||||
document.addEventListener("DOMContentLoaded", function() {
|
||||
angular.bootstrap(TodoList);
|
||||
});
|
||||
doneTyping($event) {
|
||||
if($event.which === 13) {
|
||||
this.addTodo($event.target.value);
|
||||
$event.target.value = null;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
bootstrap(TodoList);
|
||||
code-pane(language="javascript" name="ES5" format="linenums").
|
||||
//ES5
|
||||
function TodoList() {
|
||||
this.todos = ["Eat Breakfast", "Walk Dog", "Breathe"];
|
||||
|
||||
this.addTodo = function(todo) {
|
||||
this.todos.push(todo);
|
||||
};
|
||||
|
||||
this.doneTyping = function($event) {
|
||||
if($event.which === 13) {
|
||||
this.addTodo($event.target.value);
|
||||
$event.target.value = null;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
TodoList.annotations = [
|
||||
new angular.ComponentAnnotation({
|
||||
selector: "todo-list"
|
||||
}),
|
||||
new angular.ViewAnnotation({
|
||||
template:
|
||||
'<ul>' +
|
||||
'<li *for="#todo of todos">' +
|
||||
'{{ todo }}' +
|
||||
'</li>' +
|
||||
'</ul>' +
|
||||
'<input #textbox (keyup)="doneTyping($event)">' +
|
||||
'<button (click)="addTodo(textbox.value)">Add Todo</button>',
|
||||
directives: [angular.For, angular.If]
|
||||
})
|
||||
];
|
||||
|
||||
document.addEventListener("DOMContentLoaded", function() {
|
||||
angular.bootstrap(TodoList);
|
||||
});
|
||||
|
||||
|
|
|
|||
|
|
@ -25,14 +25,14 @@
|
|||
TypeScript type definitions are typically published in a repo called <a href="http://definitelytyped.org/">DefinitelyTyped</a>.
|
||||
To fetch one of the type definitions to the local directory, we use the <a href="https://www.npmjs.com/package/tsd">tsd package manager</a>.
|
||||
|
||||
pre.prettyprint
|
||||
code-example.
|
||||
$ npm install -g tsd
|
||||
$ tsd query angular2 --action install
|
||||
|
||||
p.
|
||||
Next, create two empty files, <code>index.html</code> and <code>app.ts</code>, both at the root of the project:
|
||||
|
||||
pre.prettyprint
|
||||
code-example.
|
||||
$ touch app.ts index.html
|
||||
|
||||
// STEP 2 - Start the TypeScript compiler ##########################
|
||||
|
|
@ -45,7 +45,7 @@
|
|||
compiler in <code>--watch</code> mode, but it is also possible to do the translation in the browser as files
|
||||
are loaded, or configure your editor or IDE to do it.
|
||||
|
||||
pre.prettyprint
|
||||
code-example.
|
||||
$ npm install -g typescript@^1.5.0-beta
|
||||
$ tsc --watch -m commonjs -t es5 --emitDecoratorMetadata app.ts
|
||||
|
||||
|
|
@ -54,12 +54,12 @@
|
|||
h2#section-transpile 3. Import Angular
|
||||
|
||||
p Inside of <code>app.ts</code>, import the type definitions from Angular:
|
||||
pre.prettyprint
|
||||
code /// <reference path="typings/angular2/angular2.d.ts" />
|
||||
code-example.
|
||||
<reference path="typings/angular2/angular2.d.ts" >
|
||||
|
||||
p Now your editor should be able to complete the available imports:
|
||||
pre.prettyprint
|
||||
code import {Component, View, bootstrap} from 'angular2/angular2';
|
||||
code-example.
|
||||
import {Component, View, bootstrap} from 'angular2/angular2';
|
||||
|
||||
p.
|
||||
The above import statement uses ES6 module syntax to import three symbols from the Angular module.
|
||||
|
|
@ -80,23 +80,22 @@
|
|||
which is an ES6 class, and the <strong>decorators</strong> which tell Angular
|
||||
how to place the component into the page.
|
||||
|
||||
pre.prettyprint.linenums
|
||||
code.
|
||||
// Annotation section
|
||||
@Component({
|
||||
selector: 'my-app'
|
||||
})
|
||||
@View({
|
||||
template: '<h1>Hello {{ name }}</h1>'
|
||||
})
|
||||
// Component controller
|
||||
class MyAppComponent {
|
||||
name: string;
|
||||
code-example(language="javascript" format="linenums").
|
||||
// Annotation section
|
||||
@Component({
|
||||
selector: 'my-app'
|
||||
})
|
||||
@View({
|
||||
template: '<h1>Hello {{ name }}</h1>'
|
||||
})
|
||||
// Component controller
|
||||
class MyAppComponent {
|
||||
name: string;
|
||||
|
||||
constructor() {
|
||||
this.name = 'Alice';
|
||||
}
|
||||
constructor() {
|
||||
this.name = 'Alice';
|
||||
}
|
||||
}
|
||||
|
||||
.l-sub-section
|
||||
h3 @Component and @View annotations
|
||||
|
|
@ -108,14 +107,13 @@
|
|||
p.
|
||||
The <code>@View</code> annotation defines the HTML that represents the component. The component you wrote uses an inline template, but you can also have an external template. To use an external template, specify a <code>templateUrl</code> property and give it the path to the HTML file.
|
||||
|
||||
pre.prettyprint.linenums
|
||||
code.
|
||||
@Component({
|
||||
selector: 'my-app' // Defines the <my-app></my-app> tag
|
||||
})
|
||||
@View({
|
||||
template: '<h1>Hello {{ name }}</h1>' // Defines the inline template for the component
|
||||
})
|
||||
code-example(language="javascript" format="linenums").
|
||||
@Component({
|
||||
selector: 'my-app' // Defines the <my-app></my-app> tag
|
||||
})
|
||||
@View({
|
||||
template: '<h1>Hello {{ name }}</h1>' // Defines the inline template for the component
|
||||
})
|
||||
|
||||
p.
|
||||
The annotations above specify an HTML tag of <code><my-app></code>
|
||||
|
|
@ -128,14 +126,13 @@
|
|||
The component controller is the backing of the component's template. This component
|
||||
controller uses TypeScript <code>class</code> syntax.
|
||||
|
||||
pre.prettyprint.linenums
|
||||
code.
|
||||
class MyAppComponent {
|
||||
name: string;
|
||||
constructor() {
|
||||
this.name = 'Alice';
|
||||
}
|
||||
code-example(language="javascript" format="linenums").
|
||||
class MyAppComponent {
|
||||
name: string;
|
||||
constructor() {
|
||||
this.name = 'Alice';
|
||||
}
|
||||
}
|
||||
|
||||
p.
|
||||
Templates read from their component controllers. Templates have access to any properties
|
||||
|
|
@ -158,8 +155,8 @@
|
|||
At the bottom of <code>app.ts</code>, call the <code>bootstrap()</code> function
|
||||
to load your new component into its page:
|
||||
|
||||
pre.prettyprint.linenums
|
||||
code bootstrap(MyAppComponent);
|
||||
code-example(language="javaScript").
|
||||
bootstrap(MyAppComponent);
|
||||
|
||||
|
||||
p.
|
||||
|
|
@ -178,22 +175,21 @@
|
|||
include the traceur-runtime and the Angular bundle.
|
||||
Instantiate the <code>my-app</code> component in the <code>body</code>.
|
||||
|
||||
pre.prettyprint.linenums
|
||||
code.
|
||||
<!-- index.html -->
|
||||
<html>
|
||||
<head>
|
||||
<title>Angular 2 Quickstart</title>
|
||||
<script src="https://github.jspm.io/jmcriffey/bower-traceur-runtime@0.0.87/traceur-runtime.js"></script>
|
||||
<script src="https://code.angularjs.org/2.0.0-alpha.22/angular2.dev.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
code-example(language="html" format="linenums").
|
||||
<!-- index.html -->
|
||||
<html>
|
||||
<head>
|
||||
<title>Angular 2 Quickstart</title>
|
||||
<script src="https://github.jspm.io/jmcriffey/bower-traceur-runtime@0.0.87/traceur-runtime.js"></script>
|
||||
<script src="https://code.angularjs.org/2.0.0-alpha.22/angular2.dev.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<!-- The app component created in app.ts -->
|
||||
<my-app></my-app>
|
||||
<!-- The app component created in app.ts -->
|
||||
<my-app></my-app>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
// STEP 7 - Declare the HTML ##########################
|
||||
.l-main-section
|
||||
|
|
@ -215,22 +211,20 @@
|
|||
Add the System.js dependency in the <code><head></code> tag, so that
|
||||
it looks like:
|
||||
|
||||
pre.prettyprint.linenums
|
||||
code.
|
||||
<head>
|
||||
<title>Angular 2 Quickstart</title>
|
||||
<script src="https://github.jspm.io/jmcriffey/bower-traceur-runtime@0.0.87/traceur-runtime.js"></script>
|
||||
<script src="https://jspm.io/system@0.16.js"></script>
|
||||
<script src="https://code.angularjs.org/2.0.0-alpha.22/angular2.dev.js"></script>
|
||||
</head>
|
||||
code-example(language="html" format="linenums").
|
||||
<head>
|
||||
<title>Angular 2 Quickstart</title>
|
||||
<script src="https://github.jspm.io/jmcriffey/bower-traceur-runtime@0.0.87/traceur-runtime.js"></script>
|
||||
<script src="https://jspm.io/system@0.16.js"></script>
|
||||
<script src="https://code.angularjs.org/2.0.0-alpha.22/angular2.dev.js"></script>
|
||||
</head>
|
||||
|
||||
p.
|
||||
Add the following module-loading code:
|
||||
|
||||
pre.prettyprint.linenums
|
||||
code.
|
||||
<my-app></my-app>
|
||||
<script>System.import('app');</script>
|
||||
code-example(language="html" format="linenums").
|
||||
<my-app></my-app>
|
||||
<script>System.import('app');</script>
|
||||
|
||||
|
||||
// STEP 8 - Run a local server ##########################
|
||||
|
|
@ -247,11 +241,11 @@
|
|||
<code><b>sudo</b> npm ...</code>)
|
||||
For example:
|
||||
|
||||
pre.prettyprint.code.
|
||||
# From the directory that contains index.html:
|
||||
npm install -g http-server # Or sudo npm install -g http-server
|
||||
http-server # Creates a server at localhost:8080
|
||||
# In a browser, visit localhost:8080/index.html
|
||||
code-example.
|
||||
# From the directory that contains index.html:
|
||||
npm install -g http-server # Or sudo npm install -g http-server
|
||||
http-server # Creates a server at localhost:8080
|
||||
# In a browser, visit localhost:8080/index.html
|
||||
|
||||
|
||||
// WHAT'S NEXT... ##########################
|
||||
|
|
|
|||
|
|
@ -118,6 +118,11 @@
|
|||
padding: ($unit * 3) ($unit * 1);
|
||||
}
|
||||
|
||||
code {
|
||||
background: $fog;
|
||||
color: $steel;
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
margin: 0;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -2,7 +2,6 @@
|
|||
border-radius: 4px;
|
||||
background: $steel;
|
||||
box-shadow: 0px 2px 5px rgba($coal, .3);
|
||||
display: none;
|
||||
margin-bottom: $unit * 2;
|
||||
|
||||
header {
|
||||
|
|
@ -24,7 +23,9 @@
|
|||
font-weight: 500;
|
||||
text-transform: none;
|
||||
|
||||
&.is-selected {
|
||||
&.is-selected,
|
||||
&.selected
|
||||
{
|
||||
background: $blueberry;
|
||||
color: $snow;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -50,6 +50,7 @@
|
|||
code {
|
||||
background: none;
|
||||
font-size: 15px;
|
||||
padding: 0px;
|
||||
}
|
||||
|
||||
ol {
|
||||
|
|
|
|||
|
|
@ -0,0 +1,48 @@
|
|||
/*
|
||||
* Apllication Controller
|
||||
*
|
||||
*/
|
||||
|
||||
angularIO.controller('AppCtrl', ['$scope', '$mdDialog', '$timeout', function($scope, $mdDialog, $timeout) {
|
||||
$scope.showDocsNav = false;
|
||||
$scope.showMainNav = false;
|
||||
$scope.showMenu = false;
|
||||
|
||||
// TOGGLE MAIN NAV (TOP) ON MOBILE
|
||||
$scope.toggleDocsMenu = function() {
|
||||
$scope.showDocsNav = !$scope.showDocsNav;
|
||||
};
|
||||
|
||||
// TOGGLE DOCS NAV
|
||||
$scope.toggleMainMenu = function() {
|
||||
$scope.showMainNav = !$scope.showMainNav;
|
||||
};
|
||||
|
||||
// TOGGLE DOCS VERSION & LANGUAGE
|
||||
$scope.toggleVersionMenu = function() {
|
||||
$scope.showMenu = !$scope.showMenu;
|
||||
};
|
||||
|
||||
|
||||
/*
|
||||
* Prettify Code
|
||||
*
|
||||
* Finish Rendereding code directives then prettify code
|
||||
*/
|
||||
|
||||
// GRAB ALL TAGS NOT USING DIRECTIVES
|
||||
var preTags = angular.element(document.body).find('pre');
|
||||
|
||||
// LOOP THROUGH AND ADD PRETTIFY CLASS
|
||||
_.each(preTags, function(element) {
|
||||
var preTag = angular.element(element);
|
||||
|
||||
// IF NOT FORMATTED, ADD PRETTY PRINT
|
||||
if(!preTag.hasClass('prettyprint')) {
|
||||
preTag.addClass('prettyprint linenums');
|
||||
}
|
||||
});
|
||||
|
||||
// TRIGGER PRETTYPRINT AFTER DIGEST LOOP COMPLETE
|
||||
$timeout(prettyPrint, 1);
|
||||
}]);
|
||||
|
|
@ -0,0 +1,46 @@
|
|||
angularIO.directive('biocard', function($rootScope, $timeout, $mdDialog) {
|
||||
return {
|
||||
restrict: 'A',
|
||||
scope: {},
|
||||
link: function (scope, element, attrs) {
|
||||
// SET SCOPE VALUES
|
||||
scope.name = attrs.name;
|
||||
scope.pic = attrs.pic;
|
||||
scope.bio = attrs.bio;
|
||||
scope.twitter = attrs.twitter;
|
||||
scope.website = attrs.website;
|
||||
|
||||
// CLOSE MODAL METHOD
|
||||
scope.closeDialog = function() {
|
||||
$mdDialog.hide();
|
||||
};
|
||||
|
||||
// OPEN BIO WHEN CLICKING ON CARD
|
||||
element.on('click', function($event) {
|
||||
$mdDialog.show({
|
||||
parent: angular.element(document.body),
|
||||
targetEvent: $event,
|
||||
scope: scope, // use parent scope in template
|
||||
preserveScope: true,
|
||||
template:
|
||||
'<md-dialog class="modal" aria-label="List dialog">' +
|
||||
' <md-content>' +
|
||||
' <img class="left" src="{{pic}}" />' +
|
||||
' <h3 class="text-headline">{{name}}</h3>' +
|
||||
' <div class="modal-social">' +
|
||||
' <a ng-show="twitter" class="button button-subtle button-small" href="https://twitter.com/{{twitter}}" md-button>Twitter</a>' +
|
||||
' <a ng-show="website" class="button button-subtle button-small" href="{{website}}" md-button>Website</a>' +
|
||||
' </div>' +
|
||||
' <p class="text-body">{{bio}}</p>' +
|
||||
' </md-content>' +
|
||||
' <div class="md-actions">' +
|
||||
' <md-button ng-click="closeDialog()">' +
|
||||
' Close Bio' +
|
||||
' </md-button>' +
|
||||
' </div>' +
|
||||
'</md-dialog>'
|
||||
});
|
||||
});
|
||||
}
|
||||
};
|
||||
});
|
||||
|
|
@ -0,0 +1,25 @@
|
|||
/*
|
||||
* Code Example Directive
|
||||
*
|
||||
* Formats codes examples and prevents
|
||||
* Angular code from being processed.
|
||||
*/
|
||||
|
||||
angularIO.directive('codeExample', function() {
|
||||
return {
|
||||
restrict: 'E',
|
||||
|
||||
compile: function(tElement, attrs) {
|
||||
var html = (attrs.escape === "html") ? _.escape(tElement.html()) : tElement.html();
|
||||
var template = '<pre class="prettyprint ' + attrs.format + ' lang-' + attrs.language + '">' +
|
||||
'<code ng-non-bindable>' + html + '</code>' +
|
||||
'</pre>';
|
||||
|
||||
// UPDATE ELEMENT WITH NEW TEMPLATE
|
||||
tElement.html(template);
|
||||
|
||||
// RETURN ELEMENT
|
||||
return function(scope, element, attrs) {};
|
||||
}
|
||||
};
|
||||
});
|
||||
|
|
@ -0,0 +1,36 @@
|
|||
/*
|
||||
* Code Pane Directive
|
||||
*
|
||||
* @requires codeTab Directive
|
||||
*
|
||||
* Invidiual panes displayed in the the
|
||||
* codeTab elements
|
||||
*/
|
||||
|
||||
angularIO.directive('codePane', function() {
|
||||
return {
|
||||
require: '^codeTabs',
|
||||
restrict: 'E',
|
||||
scope: true,
|
||||
|
||||
compile: function(tElement, tAttrs) {
|
||||
var html = (tAttrs.escape === "html") ? _.escape(tElement.html()) : tElement.html();
|
||||
var template = '<pre class="prettyprint ' + tAttrs.format + ' lang-' + tAttrs.language + '" ng-show="selected" >' +
|
||||
'<code class="animated fadeIn" ng-non-bindable>' + html + '</code>' +
|
||||
'</pre>';
|
||||
|
||||
|
||||
// UPDATE ELEMENT WITH NEW TEMPLATE
|
||||
tElement.html(template);
|
||||
|
||||
|
||||
// RETURN LINK METHOD
|
||||
return function(scope, element, attrs, controller) {
|
||||
scope.name = attrs.name;
|
||||
|
||||
//ADD PANE TO CONTROLLER
|
||||
controller.addPane(scope);
|
||||
};
|
||||
}
|
||||
};
|
||||
});
|
||||
|
|
@ -0,0 +1,61 @@
|
|||
/*
|
||||
* Code Tabs Directive
|
||||
*
|
||||
* Creates a tabs code examples that
|
||||
* displayed in the same container
|
||||
*/
|
||||
|
||||
angularIO.directive('codeTabs', function($timeout) {
|
||||
return {
|
||||
restrict: 'E',
|
||||
scope: {},
|
||||
transclude: true,
|
||||
replace: true,
|
||||
|
||||
controller: function ($scope) {
|
||||
$scope.panes = [];
|
||||
|
||||
|
||||
/*
|
||||
* Add Code Pane List of Panes
|
||||
*
|
||||
*/
|
||||
|
||||
this.addPane = function(pane) {
|
||||
if ($scope.panes.length === 0) {
|
||||
$scope.showPane(pane);
|
||||
}
|
||||
|
||||
$scope.panes.push(pane);
|
||||
};
|
||||
|
||||
|
||||
/*
|
||||
* Show selected Code Examples
|
||||
*
|
||||
*/
|
||||
|
||||
$scope.showPane = function(pane) {
|
||||
// RESET ALL EXAMPLES
|
||||
angular.forEach($scope.panes, function(pane) {
|
||||
pane.selected = false;
|
||||
});
|
||||
|
||||
// SELECT CURRENT EXAMPLE
|
||||
pane.selected = true;
|
||||
};
|
||||
},
|
||||
|
||||
template:
|
||||
'<div class="code-box">' +
|
||||
' <header class="code-box-header">' +
|
||||
' <nav class="code-box-nav">' +
|
||||
' <button ng-repeat="pane in panes" ng-click="showPane(pane)" class="button" ng-class="{selected:pane.selected}">' +
|
||||
' {{pane.name}}' +
|
||||
' </button>' +
|
||||
' </nav>' +
|
||||
' </header>' +
|
||||
' <div class="code-box-examples" ng-transclude></div>' +
|
||||
'</div>'
|
||||
};
|
||||
});
|
||||
|
|
@ -3,8 +3,10 @@
|
|||
*
|
||||
*/
|
||||
|
||||
var angularIO = angular.module('angularIOApp', ['ngMaterial', 'ngTouch'])
|
||||
var angularIO = angular.module('angularIOApp', ['ngMaterial'])
|
||||
.config(function($mdThemingProvider) {
|
||||
|
||||
// THEMEING FOR ANGULAR MATERIAL
|
||||
$mdThemingProvider.theme('default')
|
||||
.primaryPalette('blue', {
|
||||
'default': '700', // by default use shade 400 from the pink palette for primary intentions
|
||||
|
|
@ -17,180 +19,4 @@ var angularIO = angular.module('angularIOApp', ['ngMaterial', 'ngTouch'])
|
|||
.accentPalette('purple', {
|
||||
'default': '200' // use shade 200 for default, and keep all other shades the same
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
/*
|
||||
* Apllication Controller
|
||||
*
|
||||
*/
|
||||
|
||||
angularIO.controller('AppCtrl', ['$scope', '$mdDialog', function($scope, $mdDialog){
|
||||
|
||||
$scope.showDocsNav = false;
|
||||
$scope.showMainNav = false;
|
||||
$scope.showMenu = false;
|
||||
|
||||
// TOGGLE MAIN NAV (TOP) ON MOBILE
|
||||
$scope.toggleDocsMenu = function(event) {
|
||||
event.preventDefault();
|
||||
$scope.showDocsNav = !$scope.showDocsNav;
|
||||
};
|
||||
|
||||
// TOGGLE DOCS NAV
|
||||
$scope.toggleMainMenu = function(event) {
|
||||
event.preventDefault();
|
||||
$scope.showMainNav = !$scope.showMainNav;
|
||||
};
|
||||
|
||||
// TOGGLE DOCS VERSION & LANGUAGE
|
||||
$scope.toggleVersionMenu = function(event) {
|
||||
event.preventDefault();
|
||||
$scope.showMenu = !$scope.showMenu;
|
||||
};
|
||||
|
||||
|
||||
/*
|
||||
* Code Switcher
|
||||
*
|
||||
*/
|
||||
|
||||
$scope.language = 'es5';
|
||||
var $codeBoxes = $('.code-box');
|
||||
|
||||
var getTabName = function(name) {
|
||||
var prettyName = name;
|
||||
|
||||
switch(name) {
|
||||
case 'es5': prettyName = 'ES5'; break;
|
||||
case 'typescript': prettyName = 'TypeScript'; break;
|
||||
default: prettyName = name;
|
||||
}
|
||||
|
||||
return prettyName;
|
||||
};
|
||||
|
||||
if($codeBoxes.length) {
|
||||
//UPDATE ALL CODE BOXES
|
||||
$codeBoxes.each(function(index, codeBox) {
|
||||
//REGISTER ELEMENTS
|
||||
var $codeBox = $(codeBox);
|
||||
var $examples = $codeBox.find('.prettyprint');
|
||||
var $firstItem = $($examples[0]);
|
||||
var $header = $("<header class='code-box-header'></header>");
|
||||
var $nav = $("<nav class='code-box-nav'></nav>");
|
||||
var selectedName = '';
|
||||
|
||||
//HIDE/SHOW CONTENT
|
||||
$examples.addClass('is-hidden');
|
||||
$firstItem.removeClass('is-hidden');
|
||||
|
||||
//UPDATE NAV FOR EACH CODE BOX
|
||||
$examples.each(function(index, example) {
|
||||
var $example = $(example);
|
||||
var name = $example.data('name');
|
||||
var tabName = getTabName(name);
|
||||
var selected = (index === 0) ? 'is-selected' : '';
|
||||
var $button = $("<button class='button " + selected + "' data-name='" + name + "'>" + tabName + "</button>");
|
||||
|
||||
// ADD EVENTS FOR CODE SNIPPETS
|
||||
$button.on('click', function(e) {
|
||||
e.preventDefault();
|
||||
var $currentButton = $(e.currentTarget);
|
||||
var $buttons = $nav.find('.button');
|
||||
var selectedName = $currentButton.data('name');
|
||||
$buttons.removeClass('is-selected');
|
||||
$currentButton.addClass('is-selected');
|
||||
|
||||
//UPDAT VIEW ON SELECTTION
|
||||
$examples.addClass('is-hidden');
|
||||
var $currentExample = $codeBox.find(".prettyprint[data-name='" + selectedName + "']");
|
||||
$currentExample.removeClass('is-hidden').addClass('animated fadeIn');
|
||||
});
|
||||
|
||||
$nav.append($button);
|
||||
});
|
||||
|
||||
//ADD HEADER TO DOM
|
||||
$header.append($nav);
|
||||
$codeBox.prepend($header);
|
||||
});
|
||||
|
||||
//FADEIN EXAMPLES
|
||||
$codeBoxes.addClass('is-visible');
|
||||
}
|
||||
|
||||
// TOGGLE CODE LANGUAGE
|
||||
$scope.toggleCodeExample = function(event, name) {
|
||||
event.preventDefault();
|
||||
$scope.language = language;
|
||||
};
|
||||
|
||||
/*
|
||||
* Code Formatting
|
||||
*
|
||||
*/
|
||||
|
||||
var $codeBlocks = $('pre');
|
||||
|
||||
if($codeBlocks.length) {
|
||||
$codeBlocks.each(function(index, codeEl) {
|
||||
var $codeEl = $(codeEl);
|
||||
|
||||
if(!$codeEl.hasClass('prettyprint')) {
|
||||
$codeEl.addClass('prettyprint linenums');
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// BIO MODAL
|
||||
$scope.showBio = function($event) {
|
||||
var parentEl = angular.element(document.body);
|
||||
var person = angular.element($event.currentTarget);
|
||||
var name = person.attr('data-name');
|
||||
var bio = person.attr('data-bio');
|
||||
var pic = person.attr('data-pic');
|
||||
var twitter = person.attr('data-twitter');
|
||||
var website = person.attr('data-website');
|
||||
var $twitter = twitter !== 'undefined' ? '<a class="button button-subtle button-small" href="https://twitter.com/' + person.attr('data-twitter') + '" md-button>Twitter</a>' : '';
|
||||
var $website = website !== 'undefined' ? '<a class="button button-subtle button-small" href="' + person.attr('data-website') + '" md-button>Website</a>' : '';
|
||||
|
||||
$mdDialog.show({
|
||||
parent: parentEl,
|
||||
targetEvent: $event,
|
||||
template:
|
||||
'<md-dialog class="modal" aria-label="List dialog">' +
|
||||
' <md-content>' +
|
||||
' <img class="left" src="' + pic + '" />' +
|
||||
' <h3 class="text-headline">' + name + '</h3>' +
|
||||
' <div class="modal-social">' + $twitter + $website + '</div>' +
|
||||
' <p class="text-body">' + bio + '</p>' +
|
||||
' </md-content>' +
|
||||
' <div class="md-actions">' +
|
||||
' <md-button ng-click="closeDialog()">' +
|
||||
' Close Bio' +
|
||||
' </md-button>' +
|
||||
' </div>' +
|
||||
'</md-dialog>',
|
||||
locals: {
|
||||
items: $scope.items
|
||||
},
|
||||
controller: DialogController
|
||||
});
|
||||
|
||||
function DialogController(scope, $mdDialog, items) {
|
||||
scope.items = items;
|
||||
scope.closeDialog = function() {
|
||||
$mdDialog.hide();
|
||||
};
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
// INITIALIZE PRETTY PRINT
|
||||
prettyPrint();
|
||||
}]);
|
||||
|
||||
|
||||
|
||||
|
||||
});
|
||||
|
|
@ -0,0 +1,142 @@
|
|||
/**
|
||||
* @license
|
||||
* lodash 3.8.0 (Custom Build) lodash.com/license | Underscore.js 1.8.3 underscorejs.org/LICENSE
|
||||
* Build: `lodash compat -o ./lodash.js`
|
||||
*/
|
||||
;(function(){function n(n,t){if(n!==t){var r=n===n,e=t===t;if(n>t||!r||n===w&&e)return 1;if(n<t||!e||t===w&&r)return-1}return 0}function t(n,t,r){for(var e=n.length,u=r?e:-1;r?u--:++u<e;)if(t(n[u],u,n))return u;return-1}function r(n,t,r){if(t!==t)return p(n,r);r-=1;for(var e=n.length;++r<e;)if(n[r]===t)return r;return-1}function e(n){return typeof n=="function"||false}function u(n){return typeof n=="string"?n:null==n?"":n+""}function o(n){return n.charCodeAt(0)}function i(n,t){for(var r=-1,e=n.length;++r<e&&-1<t.indexOf(n.charAt(r)););
|
||||
return r}function a(n,t){for(var r=n.length;r--&&-1<t.indexOf(n.charAt(r)););return r}function f(t,r){return n(t.a,r.a)||t.b-r.b}function c(n){return Ln[n]}function l(n){return Pn[n]}function s(n){return"\\"+Mn[n]}function p(n,t,r){var e=n.length;for(t+=r?0:-1;r?t--:++t<e;){var u=n[t];if(u!==u)return t}return-1}function h(n){return!!n&&typeof n=="object"}function _(n){return 160>=n&&9<=n&&13>=n||32==n||160==n||5760==n||6158==n||8192<=n&&(8202>=n||8232==n||8233==n||8239==n||8287==n||12288==n||65279==n);
|
||||
|
||||
}function v(n,t){for(var r=-1,e=n.length,u=-1,o=[];++r<e;)n[r]===t&&(n[r]=P,o[++u]=r);return o}function g(n){for(var t=-1,r=n.length;++t<r&&_(n.charCodeAt(t)););return t}function y(n){for(var t=n.length;t--&&_(n.charCodeAt(t)););return t}function d(n){return zn[n]}function m(_){function Ln(n){if(h(n)&&!(Lo(n)||n instanceof Bn)){if(n instanceof zn)return n;if(He.call(n,"__chain__")&&He.call(n,"__wrapped__"))return zr(n)}return new zn(n)}function Pn(){}function zn(n,t,r){this.__wrapped__=n,this.__actions__=r||[],
|
||||
this.__chain__=!!t}function Bn(n){this.__wrapped__=n,this.__actions__=null,this.__dir__=1,this.__filtered__=false,this.__iteratees__=null,this.__takeCount__=Cu,this.__views__=null}function Mn(){this.__data__={}}function Dn(n){var t=n?n.length:0;for(this.data={hash:bu(null),set:new hu};t--;)this.push(n[t])}function qn(n,t){var r=n.data;return(typeof t=="string"||he(t)?r.set.has(t):r.hash[t])?0:-1}function Kn(n,t){var r=-1,e=n.length;for(t||(t=Ne(e));++r<e;)t[r]=n[r];return t}function Vn(n,t){for(var r=-1,e=n.length;++r<e&&false!==t(n[r],r,n););
|
||||
return n}function Yn(n,t){for(var r=-1,e=n.length;++r<e;)if(!t(n[r],r,n))return false;return true}function Xn(n,t){for(var r=-1,e=n.length,u=-1,o=[];++r<e;){var i=n[r];t(i,r,n)&&(o[++u]=i)}return o}function Hn(n,t){for(var r=-1,e=n.length,u=Ne(e);++r<e;)u[r]=t(n[r],r,n);return u}function Qn(n,t,r,e){var u=-1,o=n.length;for(e&&o&&(r=n[++u]);++u<o;)r=t(r,n[u],u,n);return r}function nt(n,t){for(var r=-1,e=n.length;++r<e;)if(t(n[r],r,n))return true;return false}function tt(n,t){return n===w?t:n}function rt(n,t,r,e){
|
||||
return n!==w&&He.call(e,r)?n:t}function et(n,t,r){var e=Jo(t);lu.apply(e,Qu(t));for(var u=-1,o=e.length;++u<o;){var i=e[u],a=n[i],f=r(a,t[i],i,n,t);(f===f?f===a:a!==a)&&(a!==w||i in n)||(n[i]=f)}return n}function ut(n,t){for(var r=-1,e=null==n,u=!e&&Er(n),o=u&&n.length,i=t.length,a=Ne(i);++r<i;){var f=t[r];a[r]=u?kr(f,o)?n[f]:w:e?w:n[f]}return a}function ot(n,t,r){r||(r={});for(var e=-1,u=t.length;++e<u;){var o=t[e];r[o]=n[o]}return r}function it(n,t,r){var e=typeof n;return"function"==e?t===w?n:Bt(n,t,r):null==n?Ce:"object"==e?xt(n):t===w?Fe(n):At(n,t);
|
||||
|
||||
}function at(n,t,r,e,u,o,i){var a;if(r&&(a=u?r(n,e,u):r(n)),a!==w)return a;if(!he(n))return n;if(e=Lo(n)){if(a=xr(n),!t)return Kn(n,a)}else{var f=nu.call(n),c=f==K;if(f!=Y&&f!=z&&(!c||u))return Nn[f]?jr(n,f,t):u?n:{};if(Gn(n))return u?n:{};if(a=Ar(c?{}:n),!t)return Mu(a,n)}for(o||(o=[]),i||(i=[]),u=o.length;u--;)if(o[u]==n)return i[u];return o.push(n),i.push(a),(e?Vn:vt)(n,function(e,u){a[u]=at(e,t,r,u,n,o,i)}),a}function ft(n,t,r){if(typeof n!="function")throw new Ke(L);return _u(function(){n.apply(w,r);
|
||||
|
||||
},t)}function ct(n,t){var e=n?n.length:0,u=[];if(!e)return u;var o=-1,i=br(),a=i==r,f=a&&200<=t.length?Gu(t):null,c=t.length;f&&(i=qn,a=false,t=f);n:for(;++o<e;)if(f=n[o],a&&f===f){for(var l=c;l--;)if(t[l]===f)continue n;u.push(f)}else 0>i(t,f,0)&&u.push(f);return u}function lt(n,t){var r=true;return qu(n,function(n,e,u){return r=!!t(n,e,u)}),r}function st(n,t){var r=[];return qu(n,function(n,e,u){t(n,e,u)&&r.push(n)}),r}function pt(n,t,r,e){var u;return r(n,function(n,r,o){return t(n,r,o)?(u=e?r:n,false):void 0;
|
||||
|
||||
}),u}function ht(n,t,r){for(var e=-1,u=n.length,o=-1,i=[];++e<u;){var a=n[e];if(h(a)&&Er(a)&&(r||Lo(a)||le(a))){t&&(a=ht(a,t,r));for(var f=-1,c=a.length;++f<c;)i[++o]=a[f]}else r||(i[++o]=a)}return i}function _t(n,t){Vu(n,t,be)}function vt(n,t){return Vu(n,t,Jo)}function gt(n,t){return Yu(n,t,Jo)}function yt(n,t){for(var r=-1,e=t.length,u=-1,o=[];++r<e;){var i=t[r];zo(n[i])&&(o[++u]=i)}return o}function dt(n,t,r){if(null!=n){n=Lr(n),r!==w&&r in n&&(t=[r]),r=-1;for(var e=t.length;null!=n&&++r<e;)n=Lr(n)[t[r]];
|
||||
|
||||
return r&&r==e?n:w}}function mt(n,t,r,e,u,o){if(n===t)return true;var i=typeof n,a=typeof t;if("function"!=i&&"object"!=i&&"function"!=a&&"object"!=a||null==n||null==t)n=n!==n&&t!==t;else n:{var i=mt,a=Lo(n),f=Lo(t),c=B,l=B;a||(c=nu.call(n),c==z?c=Y:c!=Y&&(a=de(n))),f||(l=nu.call(t),l==z?l=Y:l!=Y&&de(t));var s=c==Y&&!Gn(n),f=l==Y&&!Gn(t),l=c==l;if(!l||a||s){if(!e&&(c=s&&He.call(n,"__wrapped__"),f=f&&He.call(t,"__wrapped__"),c||f)){n=i(c?n.value():n,f?t.value():t,r,e,u,o);break n}if(l){for(u||(u=[]),
|
||||
o||(o=[]),c=u.length;c--;)if(u[c]==n){n=o[c]==t;break n}u.push(n),o.push(t),n=(a?gr:dr)(n,t,i,r,e,u,o),u.pop(),o.pop()}else n=false}else n=yr(n,t,c)}return n}function wt(n,t,r,e,u){for(var o=-1,i=t.length,a=!u;++o<i;)if(a&&e[o]?r[o]!==n[t[o]]:!(t[o]in n))return false;for(o=-1;++o<i;){var f=t[o],c=n[f],l=r[o];if(a&&e[o]?f=c!==w||f in n:(f=u?u(c,l,f):w,f===w&&(f=mt(l,c,u,true))),!f)return false}return true}function bt(n,t){var r=-1,e=Er(n)?Ne(n.length):[];return qu(n,function(n,u,o){e[++r]=t(n,u,o)}),e}function xt(n){
|
||||
var t=Jo(n),r=t.length;if(!r)return Se(true);if(1==r){var e=t[0],u=n[e];if(Tr(u))return function(n){return null==n?false:(n=Lr(n),n[e]===u&&(u!==w||e in n))}}for(var o=Ne(r),i=Ne(r);r--;)u=n[t[r]],o[r]=u,i[r]=Tr(u);return function(n){return null!=n&&wt(Lr(n),t,o,i)}}function At(n,t){var r=Lo(n),e=Rr(n)&&Tr(t),u=n+"";return n=Pr(n),function(o){if(null==o)return false;var i=u;if(o=Lr(o),!(!r&&e||i in o)){if(o=1==n.length?o:dt(o,St(n,0,-1)),null==o)return false;i=Kr(n),o=Lr(o)}return o[i]===t?t!==w||i in o:mt(t,o[i],null,true);
|
||||
|
||||
}}function jt(n,t,r,e,u){if(!he(n))return n;var o=Er(t)&&(Lo(t)||de(t));if(!o){var i=Jo(t);lu.apply(i,Qu(t))}return Vn(i||t,function(a,f){if(i&&(f=a,a=t[f]),h(a)){e||(e=[]),u||(u=[]);n:{for(var c=f,l=e,s=u,p=l.length,_=t[c];p--;)if(l[p]==_){n[c]=s[p];break n}var p=n[c],v=r?r(p,_,c,n,t):w,g=v===w;g&&(v=_,Er(_)&&(Lo(_)||de(_))?v=Lo(p)?p:Er(p)?Kn(p):[]:Bo(_)||le(_)?v=le(p)?me(p):Bo(p)?p:{}:g=false),l.push(_),s.push(v),g?n[c]=jt(v,_,r,l,s):(v===v?v!==p:p===p)&&(n[c]=v)}}else c=n[f],l=r?r(c,a,f,n,t):w,(s=l===w)&&(l=a),
|
||||
!o&&l===w||!s&&(l===l?l===c:c!==c)||(n[f]=l)}),n}function Ot(n){return function(t){return null==t?w:Lr(t)[n]}}function Et(n){var t=n+"";return n=Pr(n),function(r){return dt(r,n,t)}}function kt(n,t){for(var r=n?t.length:0;r--;){var e=parseFloat(t[r]);if(e!=u&&kr(e)){var u=e;vu.call(n,e,1)}}}function It(n,t){return n+au(Ru()*(t-n+1))}function Rt(n,t,r,e,u){return u(n,function(n,u,o){r=e?(e=false,n):t(r,n,u,o)}),r}function St(n,t,r){var e=-1,u=n.length;for(t=null==t?0:+t||0,0>t&&(t=-t>u?0:u+t),r=r===w||r>u?u:+r||0,
|
||||
0>r&&(r+=u),u=t>r?0:r-t>>>0,t>>>=0,r=Ne(u);++e<u;)r[e]=n[e+t];return r}function Ct(n,t){var r;return qu(n,function(n,e,u){return r=t(n,e,u),!r}),!!r}function Tt(n,t){var r=n.length;for(n.sort(t);r--;)n[r]=n[r].c;return n}function Ut(t,r,e){var u=wr(),o=-1;return r=Hn(r,function(n){return u(n)}),t=bt(t,function(n){return{a:Hn(r,function(t){return t(n)}),b:++o,c:n}}),Tt(t,function(t,r){var u;n:{u=-1;for(var o=t.a,i=r.a,a=o.length,f=e.length;++u<a;){var c=n(o[u],i[u]);if(c){u=u<f?c*(e[u]?1:-1):c;break n;
|
||||
|
||||
}}u=t.b-r.b}return u})}function Wt(n,t){var r=0;return qu(n,function(n,e,u){r+=+t(n,e,u)||0}),r}function Ft(n,t){var e=-1,u=br(),o=n.length,i=u==r,a=i&&200<=o,f=a?Gu():null,c=[];f?(u=qn,i=false):(a=false,f=t?[]:c);n:for(;++e<o;){var l=n[e],s=t?t(l,e,n):l;if(i&&l===l){for(var p=f.length;p--;)if(f[p]===s)continue n;t&&f.push(s),c.push(l)}else 0>u(f,s,0)&&((t||a)&&f.push(s),c.push(l))}return c}function Nt(n,t){for(var r=-1,e=t.length,u=Ne(e);++r<e;)u[r]=n[t[r]];return u}function $t(n,t,r,e){for(var u=n.length,o=e?u:-1;(e?o--:++o<u)&&t(n[o],o,n););
|
||||
return r?St(n,e?0:o,e?o+1:u):St(n,e?o+1:0,e?u:o)}function Lt(n,t){var r=n;r instanceof Bn&&(r=r.value());for(var e=-1,u=t.length;++e<u;){var r=[r],o=t[e];lu.apply(r,o.args),r=o.func.apply(o.thisArg,r)}return r}function Pt(n,t,r){var e=0,u=n?n.length:e;if(typeof t=="number"&&t===t&&u<=Wu){for(;e<u;){var o=e+u>>>1,i=n[o];(r?i<=t:i<t)?e=o+1:u=o}return u}return zt(n,t,Ce,r)}function zt(n,t,r,e){t=r(t);for(var u=0,o=n?n.length:0,i=t!==t,a=t===w;u<o;){var f=au((u+o)/2),c=r(n[f]),l=c===c;(i?l||e:a?l&&(e||c!==w):e?c<=t:c<t)?u=f+1:o=f;
|
||||
|
||||
}return Ou(o,Uu)}function Bt(n,t,r){if(typeof n!="function")return Ce;if(t===w)return n;switch(r){case 1:return function(r){return n.call(t,r)};case 3:return function(r,e,u){return n.call(t,r,e,u)};case 4:return function(r,e,u,o){return n.call(t,r,e,u,o)};case 5:return function(r,e,u,o,i){return n.call(t,r,e,u,o,i)}}return function(){return n.apply(t,arguments)}}function Mt(n){return uu.call(n,0)}function Dt(n,t,r){for(var e=r.length,u=-1,o=ju(n.length-e,0),i=-1,a=t.length,f=Ne(o+a);++i<a;)f[i]=t[i];
|
||||
|
||||
for(;++u<e;)f[r[u]]=n[u];for(;o--;)f[i++]=n[u++];return f}function qt(n,t,r){for(var e=-1,u=r.length,o=-1,i=ju(n.length-u,0),a=-1,f=t.length,c=Ne(i+f);++o<i;)c[o]=n[o];for(i=o;++a<f;)c[i+a]=t[a];for(;++e<u;)c[i+r[e]]=n[o++];return c}function Kt(n,t){return function(r,e,u){var o=t?t():{};if(e=wr(e,u,3),Lo(r)){u=-1;for(var i=r.length;++u<i;){var a=r[u];n(o,a,e(a,u,r),r)}}else qu(r,function(t,r,u){n(o,t,e(t,r,u),u)});return o}}function Vt(n){return ce(function(t,r){var e=-1,u=null==t?0:r.length,o=2<u&&r[u-2],i=2<u&&r[2],a=1<u&&r[u-1];
|
||||
|
||||
for(typeof o=="function"?(o=Bt(o,a,5),u-=2):(o=typeof a=="function"?a:null,u-=o?1:0),i&&Ir(r[0],r[1],i)&&(o=3>u?null:o,u=1);++e<u;)(i=r[e])&&n(t,i,o);return t})}function Yt(n,t){return function(r,e){var u=r?Hu(r):0;if(!Cr(u))return n(r,e);for(var o=t?u:-1,i=Lr(r);(t?o--:++o<u)&&false!==e(i[o],o,i););return r}}function Zt(n){return function(t,r,e){var u=Lr(t);e=e(t);for(var o=e.length,i=n?o:-1;n?i--:++i<o;){var a=e[i];if(false===r(u[a],a,u))break}return t}}function Gt(n,t){function r(){return(this&&this!==Zn&&this instanceof r?e:n).apply(t,arguments);
|
||||
|
||||
}var e=Xt(n);return r}function Jt(n){return function(t){var r=-1;t=Ie(Ae(t));for(var e=t.length,u="";++r<e;)u=n(u,t[r],r);return u}}function Xt(n){return function(){var t=Du(n.prototype),r=n.apply(t,arguments);return he(r)?r:t}}function Ht(n){function t(r,e,u){return u&&Ir(r,e,u)&&(e=null),r=vr(r,n,null,null,null,null,null,e),r.placeholder=t.placeholder,r}return t}function Qt(n,t){return function(r,e,u){u&&Ir(r,e,u)&&(e=null);var i=wr(),a=null==e;if(i===it&&a||(a=false,e=i(e,u,3)),a){if(e=Lo(r),e||!ye(r))return n(e?r:$r(r));
|
||||
|
||||
e=o}return mr(r,e,t)}}function nr(n,r){return function(e,u,o){return u=wr(u,o,3),Lo(e)?(u=t(e,u,r),-1<u?e[u]:w):pt(e,u,n)}}function tr(n){return function(r,e,u){return r&&r.length?(e=wr(e,u,3),t(r,e,n)):-1}}function rr(n){return function(t,r,e){return r=wr(r,e,3),pt(t,r,n,true)}}function er(n){return function(){var t=arguments.length;if(!t)return function(){return arguments[0]};for(var r,e=n?t:-1,u=0,o=Ne(t);n?e--:++e<t;){var i=o[u++]=arguments[e];if(typeof i!="function")throw new Ke(L);var a=r?"":Xu(i);
|
||||
|
||||
r="wrapper"==a?new zn([]):r}for(e=r?-1:t;++e<t;)i=o[e],a=Xu(i),r=(u="wrapper"==a?Ju(i):null)&&Sr(u[0])&&u[1]==(R|O|k|S)&&!u[4].length&&1==u[9]?r[Xu(u[0])].apply(r,u[3]):1==i.length&&Sr(i)?r[a]():r.thru(i);return function(){var n=arguments;if(r&&1==n.length&&Lo(n[0]))return r.plant(n[0]).value();for(var e=0,n=o[e].apply(this,n);++e<t;)n=o[e].call(this,n);return n}}}function ur(n,t){return function(r,e,u){return typeof e=="function"&&u===w&&Lo(r)?n(r,e):t(r,Bt(e,u,3))}}function or(n){return function(t,r,e){
|
||||
return(typeof r!="function"||e!==w)&&(r=Bt(r,e,3)),n(t,r,be)}}function ir(n){return function(t,r,e){return(typeof r!="function"||e!==w)&&(r=Bt(r,e,3)),n(t,r)}}function ar(n){return function(t,r,e){var u={};return r=wr(r,e,3),vt(t,function(t,e,o){o=r(t,e,o),e=n?o:e,t=n?t:o,u[e]=t}),u}}function fr(n){return function(t,r,e){return t=u(t),(n?t:"")+pr(t,r,e)+(n?"":t)}}function cr(n){var t=ce(function(r,e){var u=v(e,t.placeholder);return vr(r,n,null,e,u)});return t}function lr(n,t){return function(r,e,u,o){
|
||||
var i=3>arguments.length;return typeof e=="function"&&o===w&&Lo(r)?n(r,e,u,i):Rt(r,wr(e,o,4),u,i,t)}}function sr(n,t,r,e,u,o,i,a,f,c){function l(){for(var b=arguments.length,j=b,O=Ne(b);j--;)O[j]=arguments[j];if(e&&(O=Dt(O,e,u)),o&&(O=qt(O,o,i)),_||y){var j=l.placeholder,E=v(O,j),b=b-E.length;if(b<c){var R=a?Kn(a):null,b=ju(c-b,0),S=_?E:null,E=_?null:E,C=_?O:null,O=_?null:O;return t|=_?k:I,t&=~(_?I:k),g||(t&=~(x|A)),O=[n,t,r,C,S,O,E,R,f,b],R=sr.apply(w,O),Sr(n)&&no(R,O),R.placeholder=j,R}}if(j=p?r:this,
|
||||
h&&(n=j[m]),a)for(R=O.length,b=Ou(a.length,R),S=Kn(O);b--;)E=a[b],O[b]=kr(E,R)?S[E]:w;return s&&f<O.length&&(O.length=f),(this&&this!==Zn&&this instanceof l?d||Xt(n):n).apply(j,O)}var s=t&R,p=t&x,h=t&A,_=t&O,g=t&j,y=t&E,d=!h&&Xt(n),m=n;return l}function pr(n,t,r){return n=n.length,t=+t,n<t&&xu(t)?(t-=n,r=null==r?" ":r+"",Ee(r,ou(t/r.length)).slice(0,t)):""}function hr(n,t,r,e){function u(){for(var t=-1,a=arguments.length,f=-1,c=e.length,l=Ne(a+c);++f<c;)l[f]=e[f];for(;a--;)l[f++]=arguments[++t];return(this&&this!==Zn&&this instanceof u?i:n).apply(o?r:this,l);
|
||||
|
||||
}var o=t&x,i=Xt(n);return u}function _r(n){return function(t,r,e,u){var o=wr(e);return o===it&&null==e?Pt(t,r,n):zt(t,r,o(e,u,1),n)}}function vr(n,t,r,e,u,o,i,a){var f=t&A;if(!f&&typeof n!="function")throw new Ke(L);var c=e?e.length:0;if(c||(t&=~(k|I),e=u=null),c-=u?u.length:0,t&I){var l=e,s=u;e=u=null}var p=f?null:Ju(n);return r=[n,t,r,e,u,l,s,o,i,a],p&&(e=r[1],t=p[1],a=e|t,u=t==R&&e==O||t==R&&e==S&&r[7].length<=p[8]||t==(R|S)&&e==O,(a<R||u)&&(t&x&&(r[2]=p[2],a|=e&x?0:j),(e=p[3])&&(u=r[3],r[3]=u?Dt(u,e,p[4]):Kn(e),
|
||||
r[4]=u?v(r[3],P):Kn(p[4])),(e=p[5])&&(u=r[5],r[5]=u?qt(u,e,p[6]):Kn(e),r[6]=u?v(r[5],P):Kn(p[6])),(e=p[7])&&(r[7]=Kn(e)),t&R&&(r[8]=null==r[8]?p[8]:Ou(r[8],p[8])),null==r[9]&&(r[9]=p[9]),r[0]=p[0],r[1]=a),t=r[1],a=r[9]),r[9]=null==a?f?0:n.length:ju(a-c,0)||0,(p?Zu:no)(t==x?Gt(r[0],r[2]):t!=k&&t!=(x|k)||r[4].length?sr.apply(w,r):hr.apply(w,r),r)}function gr(n,t,r,e,u,o,i){var a=-1,f=n.length,c=t.length,l=true;if(f!=c&&(!u||c<=f))return false;for(;l&&++a<f;){var s=n[a],p=t[a],l=w;if(e&&(l=u?e(p,s,a):e(s,p,a)),
|
||||
l===w)if(u)for(var h=c;h--&&(p=t[h],!(l=s&&s===p||r(s,p,e,u,o,i))););else l=s&&s===p||r(s,p,e,u,o,i)}return!!l}function yr(n,t,r){switch(r){case M:case D:return+n==+t;case q:return n.name==t.name&&n.message==t.message;case V:return n!=+n?t!=+t:n==+t;case Z:case G:return n==t+""}return false}function dr(n,t,r,e,u,o,i){var a=Jo(n),f=a.length,c=Jo(t).length;if(f!=c&&!u)return false;for(var c=u,l=-1;++l<f;){var s=a[l],p=u?s in t:He.call(t,s);if(p){var h=n[s],_=t[s],p=w;e&&(p=u?e(_,h,s):e(h,_,s)),p===w&&(p=h&&h===_||r(h,_,e,u,o,i));
|
||||
|
||||
}if(!p)return false;c||(c="constructor"==s)}return c||(r=n.constructor,e=t.constructor,!(r!=e&&"constructor"in n&&"constructor"in t)||typeof r=="function"&&r instanceof r&&typeof e=="function"&&e instanceof e)?true:false}function mr(n,t,r){var e=r?Cu:Su,u=e,o=u;return qu(n,function(n,i,a){i=t(n,i,a),((r?i<u:i>u)||i===e&&i===o)&&(u=i,o=n)}),o}function wr(n,t,r){var e=Ln.callback||Re,e=e===Re?it:e;return r?e(n,t,r):e}function br(n,t,e){var u=Ln.indexOf||qr,u=u===qr?r:u;return n?u(n,t,e):u}function xr(n){var t=n.length,r=new n.constructor(t);
|
||||
|
||||
return t&&"string"==typeof n[0]&&He.call(n,"index")&&(r.index=n.index,r.input=n.input),r}function Ar(n){return n=n.constructor,typeof n=="function"&&n instanceof n||(n=Me),new n}function jr(n,t,r){var e=n.constructor;switch(t){case J:return Mt(n);case M:case D:return new e(+n);case X:case H:case Q:case nn:case tn:case rn:case en:case un:case on:return e instanceof e&&(e=Pu[t]),t=n.buffer,new e(r?Mt(t):t,n.byteOffset,n.length);case V:case G:return new e(n);case Z:var u=new e(n.source,On.exec(n));u.lastIndex=n.lastIndex;
|
||||
|
||||
}return u}function Or(n,t,r){return null==n||Rr(t,n)||(t=Pr(t),n=1==t.length?n:dt(n,St(t,0,-1)),t=Kr(t)),t=null==n?n:n[t],null==t?w:t.apply(n,r)}function Er(n){return null!=n&&Cr(Hu(n))}function kr(n,t){return n=+n,t=null==t?Nu:t,-1<n&&0==n%1&&n<t}function Ir(n,t,r){if(!he(r))return false;var e=typeof t;return("number"==e?Er(r)&&kr(t,r.length):"string"==e&&t in r)?(t=r[t],n===n?n===t:t!==t):false}function Rr(n,t){var r=typeof n;return"string"==r&&dn.test(n)||"number"==r?true:Lo(n)?false:!yn.test(n)||null!=t&&n in Lr(t);
|
||||
|
||||
}function Sr(n){var t=Xu(n);return!!t&&n===Ln[t]&&t in Bn.prototype}function Cr(n){return typeof n=="number"&&-1<n&&0==n%1&&n<=Nu}function Tr(n){return n===n&&!he(n)}function Ur(n,t){n=Lr(n);for(var r=-1,e=t.length,u={};++r<e;){var o=t[r];o in n&&(u[o]=n[o])}return u}function Wr(n,t){var r={};return _t(n,function(n,e,u){t(n,e,u)&&(r[e]=n)}),r}function Fr(n){var t,r=Ln.support;if(!h(n)||nu.call(n)!=Y||Gn(n)||!(He.call(n,"constructor")||(t=n.constructor,typeof t!="function"||t instanceof t))||!r.argsTag&&le(n))return false;
|
||||
|
||||
var e;return r.ownLast?(_t(n,function(n,t,r){return e=He.call(r,t),false}),false!==e):(_t(n,function(n,t){e=t}),e===w||He.call(n,e))}function Nr(n){for(var t=be(n),r=t.length,e=r&&n.length,u=Ln.support,u=e&&Cr(e)&&(Lo(n)||u.nonEnumStrings&&ye(n)||u.nonEnumArgs&&le(n)),o=-1,i=[];++o<r;){var a=t[o];(u&&kr(a,e)||He.call(n,a))&&i.push(a)}return i}function $r(n){return null==n?[]:Er(n)?Ln.support.unindexedChars&&ye(n)?n.split(""):he(n)?n:Me(n):xe(n)}function Lr(n){if(Ln.support.unindexedChars&&ye(n)){for(var t=-1,r=n.length,e=Me(n);++t<r;)e[t]=n.charAt(t);
|
||||
|
||||
return e}return he(n)?n:Me(n)}function Pr(n){if(Lo(n))return n;var t=[];return u(n).replace(mn,function(n,r,e,u){t.push(e?u.replace(An,"$1"):r||n)}),t}function zr(n){return n instanceof Bn?n.clone():new zn(n.__wrapped__,n.__chain__,Kn(n.__actions__))}function Br(n,t,r){return n&&n.length?((r?Ir(n,t,r):null==t)&&(t=1),St(n,0>t?0:t)):[]}function Mr(n,t,r){var e=n?n.length:0;return e?((r?Ir(n,t,r):null==t)&&(t=1),t=e-(+t||0),St(n,0,0>t?0:t)):[]}function Dr(n){return n?n[0]:w}function qr(n,t,e){var u=n?n.length:0;
|
||||
|
||||
if(!u)return-1;if(typeof e=="number")e=0>e?ju(u+e,0):e;else if(e)return e=Pt(n,t),n=n[e],(t===t?t===n:n!==n)?e:-1;return r(n,t,e||0)}function Kr(n){var t=n?n.length:0;return t?n[t-1]:w}function Vr(n){return Br(n,1)}function Yr(n,t,e,u){if(!n||!n.length)return[];null!=t&&typeof t!="boolean"&&(u=e,e=Ir(n,t,u)?null:t,t=false);var o=wr();if((o!==it||null!=e)&&(e=o(e,u,3)),t&&br()==r){t=e;var i;e=-1,u=n.length;for(var o=-1,a=[];++e<u;){var f=n[e],c=t?t(f,e,n):f;e&&i===c||(i=c,a[++o]=f)}n=a}else n=Ft(n,e);
|
||||
|
||||
return n}function Zr(n){if(!n||!n.length)return[];var t=-1,r=0;n=Xn(n,function(n){return Er(n)?(r=ju(n.length,r),true):void 0});for(var e=Ne(r);++t<r;)e[t]=Hn(n,Ot(t));return e}function Gr(n,t,r){return n&&n.length?(n=Zr(n),null==t?n:(t=Bt(t,r,4),Hn(n,function(n){return Qn(n,t,w,true)}))):[]}function Jr(n,t){var r=-1,e=n?n.length:0,u={};for(!e||t||Lo(n[0])||(t=[]);++r<e;){var o=n[r];t?u[o]=t[r]:o&&(u[o[0]]=o[1])}return u}function Xr(n){return n=Ln(n),n.__chain__=true,n}function Hr(n,t,r){return t.call(r,n);
|
||||
|
||||
}function Qr(n,t,r){var e=Lo(n)?Yn:lt;return r&&Ir(n,t,r)&&(t=null),(typeof t!="function"||r!==w)&&(t=wr(t,r,3)),e(n,t)}function ne(n,t,r){var e=Lo(n)?Xn:st;return t=wr(t,r,3),e(n,t)}function te(n,t,r,e){var u=n?Hu(n):0;return Cr(u)||(n=xe(n),u=n.length),u?(r=typeof r!="number"||e&&Ir(t,r,e)?0:0>r?ju(u+r,0):r||0,typeof n=="string"||!Lo(n)&&ye(n)?r<u&&-1<n.indexOf(t,r):-1<br(n,t,r)):false}function re(n,t,r){var e=Lo(n)?Hn:bt;return t=wr(t,r,3),e(n,t)}function ee(n,t,r){return(r?Ir(n,t,r):null==t)?(n=$r(n),
|
||||
t=n.length,0<t?n[It(0,t-1)]:w):(n=ue(n),n.length=Ou(0>t?0:+t||0,n.length),n)}function ue(n){n=$r(n);for(var t=-1,r=n.length,e=Ne(r);++t<r;){var u=It(0,t);t!=u&&(e[t]=e[u]),e[u]=n[t]}return e}function oe(n,t,r){var e=Lo(n)?nt:Ct;return r&&Ir(n,t,r)&&(t=null),(typeof t!="function"||r!==w)&&(t=wr(t,r,3)),e(n,t)}function ie(n,t){var r;if(typeof t!="function"){if(typeof n!="function")throw new Ke(L);var e=n;n=t,t=e}return function(){return 0<--n&&(r=t.apply(this,arguments)),1>=n&&(t=null),r}}function ae(n,t,r){
|
||||
function e(){var r=t-(Oo()-c);0>=r||r>t?(a&&iu(a),r=p,a=s=p=w,r&&(h=Oo(),f=n.apply(l,i),s||a||(i=l=null))):s=_u(e,r)}function u(){s&&iu(s),a=s=p=w,(v||_!==t)&&(h=Oo(),f=n.apply(l,i),s||a||(i=l=null))}function o(){if(i=arguments,c=Oo(),l=this,p=v&&(s||!g),false===_)var r=g&&!s;else{a||g||(h=c);var o=_-(c-h),y=0>=o||o>_;y?(a&&(a=iu(a)),h=c,f=n.apply(l,i)):a||(a=_u(u,o))}return y&&s?s=iu(s):s||t===_||(s=_u(e,t)),r&&(y=true,f=n.apply(l,i)),!y||s||a||(i=l=null),f}var i,a,f,c,l,s,p,h=0,_=false,v=true;if(typeof n!="function")throw new Ke(L);
|
||||
|
||||
if(t=0>t?0:+t||0,true===r)var g=true,v=false;else he(r)&&(g=r.leading,_="maxWait"in r&&ju(+r.maxWait||0,t),v="trailing"in r?r.trailing:v);return o.cancel=function(){s&&iu(s),a&&iu(a),a=s=p=w},o}function fe(n,t){function r(){var e=arguments,u=r.cache,o=t?t.apply(this,e):e[0];return u.has(o)?u.get(o):(e=n.apply(this,e),u.set(o,e),e)}if(typeof n!="function"||t&&typeof t!="function")throw new Ke(L);return r.cache=new fe.Cache,r}function ce(n,t){if(typeof n!="function")throw new Ke(L);return t=ju(t===w?n.length-1:+t||0,0),
|
||||
function(){for(var r=arguments,e=-1,u=ju(r.length-t,0),o=Ne(u);++e<u;)o[e]=r[t+e];switch(t){case 0:return n.call(this,o);case 1:return n.call(this,r[0],o);case 2:return n.call(this,r[0],r[1],o)}for(u=Ne(t+1),e=-1;++e<t;)u[e]=r[e];return u[t]=o,n.apply(this,u)}}function le(n){return h(n)&&Er(n)&&nu.call(n)==z}function se(n){return!!n&&1===n.nodeType&&h(n)&&(Ln.support.nodeTag?-1<nu.call(n).indexOf("Element"):Gn(n))}function pe(n){return h(n)&&typeof n.message=="string"&&nu.call(n)==q}function he(n){
|
||||
var t=typeof n;return"function"==t||!!n&&"object"==t}function _e(n){return null==n?false:nu.call(n)==K?ru.test(Xe.call(n)):h(n)&&(Gn(n)?ru:kn).test(n)}function ve(n){return typeof n=="number"||h(n)&&nu.call(n)==V}function ge(n){return he(n)&&nu.call(n)==Z}function ye(n){return typeof n=="string"||h(n)&&nu.call(n)==G}function de(n){return h(n)&&Cr(n.length)&&!!Fn[nu.call(n)]}function me(n){return ot(n,be(n))}function we(n){return yt(n,be(n))}function be(n){if(null==n)return[];he(n)||(n=Me(n));for(var t=n.length,r=Ln.support,t=t&&Cr(t)&&(Lo(n)||r.nonEnumStrings&&ye(n)||r.nonEnumArgs&&le(n))&&t||0,e=n.constructor,u=-1,e=zo(e)&&e.prototype||Ze,o=e===n,i=Ne(t),a=0<t,f=r.enumErrorProps&&(n===Ye||n instanceof Le),c=r.enumPrototypes&&zo(n);++u<t;)i[u]=u+"";
|
||||
|
||||
for(var l in n)c&&"prototype"==l||f&&("message"==l||"name"==l)||a&&kr(l,t)||"constructor"==l&&(o||!He.call(n,l))||i.push(l);if(r.nonEnumShadows&&n!==Ze)for(t=n===Ge?G:n===Ye?q:nu.call(n),r=zu[t]||zu[Y],t==Y&&(e=Ze),t=Wn.length;t--;)l=Wn[t],u=r[l],o&&u||(u?!He.call(n,l):n[l]===e[l])||i.push(l);return i}function xe(n){return Nt(n,Jo(n))}function Ae(n){return(n=u(n))&&n.replace(In,c).replace(xn,"")}function je(n){return(n=u(n))&&bn.test(n)?n.replace(wn,"\\$&"):n}function Oe(n,t,r){return r&&Ir(n,t,r)&&(t=0),
|
||||
Iu(n,t)}function Ee(n,t){var r="";if(n=u(n),t=+t,1>t||!n||!xu(t))return r;do t%2&&(r+=n),t=au(t/2),n+=n;while(t);return r}function ke(n,t,r){var e=n;return(n=u(n))?(r?Ir(e,t,r):null==t)?n.slice(g(n),y(n)+1):(t+="",n.slice(i(n,t),a(n,t)+1)):n}function Ie(n,t,r){return r&&Ir(n,t,r)&&(t=null),n=u(n),n.match(t||Cn)||[]}function Re(n,t,r){return r&&Ir(n,t,r)&&(t=null),h(n)?Te(n):it(n,t)}function Se(n){return function(){return n}}function Ce(n){return n}function Te(n){return xt(at(n,true))}function Ue(n,t,r){
|
||||
if(null==r){var e=he(t),u=e&&Jo(t);((u=u&&u.length&&yt(t,u))?u.length:e)||(u=false,r=t,t=n,n=this)}u||(u=yt(t,Jo(t)));var o=true,e=-1,i=zo(n),a=u.length;false===r?o=false:he(r)&&"chain"in r&&(o=r.chain);for(;++e<a;){r=u[e];var f=t[r];n[r]=f,i&&(n.prototype[r]=function(t){return function(){var r=this.__chain__;if(o||r){var e=n(this.__wrapped__);return(e.__actions__=Kn(this.__actions__)).push({func:t,args:arguments,thisArg:n}),e.__chain__=r,e}return r=[this.value()],lu.apply(r,arguments),t.apply(n,r)}}(f))}return n;
|
||||
|
||||
}function We(){}function Fe(n){return Rr(n)?Ot(n):Et(n)}_=_?Jn.defaults(Zn.Object(),_,Jn.pick(Zn,Un)):Zn;var Ne=_.Array,$e=_.Date,Le=_.Error,Pe=_.Function,ze=_.Math,Be=_.Number,Me=_.Object,De=_.RegExp,qe=_.String,Ke=_.TypeError,Ve=Ne.prototype,Ye=Le.prototype,Ze=Me.prototype,Ge=qe.prototype,Je=(Je=_.window)&&Je.document,Xe=Pe.prototype.toString,He=Ze.hasOwnProperty,Qe=0,nu=Ze.toString,tu=_._,ru=De("^"+je(nu).replace(/toString|(function).*?(?=\\\()| for .+?(?=\\\])/g,"$1.*?")+"$"),eu=_e(eu=_.ArrayBuffer)&&eu,uu=_e(uu=eu&&new eu(0).slice)&&uu,ou=ze.ceil,iu=_.clearTimeout,au=ze.floor,fu=_e(fu=Me.getOwnPropertySymbols)&&fu,cu=_e(cu=Me.getPrototypeOf)&&cu,lu=Ve.push,su=_e(su=Me.preventExtensions)&&su,pu=Ze.propertyIsEnumerable,hu=_e(hu=_.Set)&&hu,_u=_.setTimeout,vu=Ve.splice,gu=_e(gu=_.Uint8Array)&&gu,yu=_e(yu=_.WeakMap)&&yu,du=function(){
|
||||
try{var n=_e(n=_.Float64Array)&&n,t=new n(new eu(10),0,1)&&n}catch(r){}return t}(),mu=function(){var n=su&&_e(n=Me.assign)&&n;try{if(n){var t=su({1:0});t[0]=1}}catch(r){try{n(t,"xo")}catch(e){}return!t[1]&&n}return false}(),wu=_e(wu=Ne.isArray)&&wu,bu=_e(bu=Me.create)&&bu,xu=_.isFinite,Au=_e(Au=Me.keys)&&Au,ju=ze.max,Ou=ze.min,Eu=_e(Eu=$e.now)&&Eu,ku=_e(ku=Be.isFinite)&&ku,Iu=_.parseInt,Ru=ze.random,Su=Be.NEGATIVE_INFINITY,Cu=Be.POSITIVE_INFINITY,Tu=ze.pow(2,32)-1,Uu=Tu-1,Wu=Tu>>>1,Fu=du?du.BYTES_PER_ELEMENT:0,Nu=ze.pow(2,53)-1,$u=yu&&new yu,Lu={},Pu={};
|
||||
|
||||
Pu[X]=_.Float32Array,Pu[H]=_.Float64Array,Pu[Q]=_.Int8Array,Pu[nn]=_.Int16Array,Pu[tn]=_.Int32Array,Pu[rn]=_.Uint8Array,Pu[en]=_.Uint8ClampedArray,Pu[un]=_.Uint16Array,Pu[on]=_.Uint32Array;var zu={};zu[B]=zu[D]=zu[V]={constructor:true,toLocaleString:true,toString:true,valueOf:true},zu[M]=zu[G]={constructor:true,toString:true,valueOf:true},zu[q]=zu[K]=zu[Z]={constructor:true,toString:true},zu[Y]={constructor:true},Vn(Wn,function(n){for(var t in zu)if(He.call(zu,t)){var r=zu[t];r[n]=He.call(r,n)}});var Bu=Ln.support={};
|
||||
|
||||
!function(n){function t(){this.x=n}var r=arguments,e={0:n,length:n},u=[];t.prototype={valueOf:n,y:n};for(var o in new t)u.push(o);Bu.argsTag=nu.call(r)==z,Bu.enumErrorProps=pu.call(Ye,"message")||pu.call(Ye,"name"),Bu.enumPrototypes=pu.call(t,"prototype"),Bu.funcDecomp=/\bthis\b/.test(function(){return this}),Bu.funcNames=typeof Pe.name=="string",Bu.nodeTag=nu.call(Je)!=Y,Bu.nonEnumStrings=!pu.call("x",0),Bu.nonEnumShadows=!/valueOf/.test(u),Bu.ownLast="x"!=u[0],Bu.spliceObjects=(vu.call(e,0,1),!e[0]),
|
||||
Bu.unindexedChars="xx"!="x"[0]+Me("x")[0];try{Bu.dom=11===Je.createDocumentFragment().nodeType}catch(i){Bu.dom=false}try{Bu.nonEnumArgs=!pu.call(r,1)}catch(a){Bu.nonEnumArgs=true}}(1,0),Ln.templateSettings={escape:_n,evaluate:vn,interpolate:gn,variable:"",imports:{_:Ln}};var Mu=mu||function(n,t){return null==t?n:ot(t,Qu(t),ot(t,Jo(t),n))},Du=function(){function n(){}return function(t){if(he(t)){n.prototype=t;var r=new n;n.prototype=null}return r||_.Object()}}(),qu=Yt(vt),Ku=Yt(gt,true),Vu=Zt(),Yu=Zt(true),Zu=$u?function(n,t){
|
||||
return $u.set(n,t),n}:Ce;uu||(Mt=eu&&gu?function(n){var t=n.byteLength,r=du?au(t/Fu):0,e=r*Fu,u=new eu(t);if(r){var o=new du(u,0,r);o.set(new du(n,0,r))}return t!=e&&(o=new gu(u,e),o.set(new gu(n,e))),u}:Se(null));var Gu=bu&&hu?function(n){return new Dn(n)}:Se(null),Ju=$u?function(n){return $u.get(n)}:We,Xu=function(){return Bu.funcNames?"constant"==Se.name?Ot("name"):function(n){for(var t=n.name,r=Lu[t],e=r?r.length:0;e--;){var u=r[e],o=u.func;if(null==o||o==n)return u.name}return t}:Se("")}(),Hu=Ot("length"),Qu=fu?function(n){
|
||||
return fu(Lr(n))}:Se([]),no=function(){var n=0,t=0;return function(r,e){var u=Oo(),o=W-(u-t);if(t=u,0<o){if(++n>=U)return r}else n=0;return Zu(r,e)}}(),to=ce(function(n,t){return Er(n)?ct(n,ht(t,false,true)):[]}),ro=tr(),eo=tr(true),uo=ce(function(t,r){r=ht(r);var e=ut(t,r);return kt(t,r.sort(n)),e}),oo=_r(),io=_r(true),ao=ce(function(n){return Ft(ht(n,false,true))}),fo=ce(function(n,t){return Er(n)?ct(n,t):[]}),co=ce(Zr),lo=ce(function(n){var t=n.length,r=n[t-2],e=n[t-1];return 2<t&&typeof r=="function"?t-=2:(r=1<t&&typeof e=="function"?(--t,
|
||||
e):w,e=w),n.length=t,Gr(n,r,e)}),so=ce(function(n,t){return Er(n)&&(n=$r(n)),ut(n,ht(t))}),po=Kt(function(n,t,r){He.call(n,r)?++n[r]:n[r]=1}),ho=nr(qu),_o=nr(Ku,true),vo=ur(Vn,qu),go=ur(function(n,t){for(var r=n.length;r--&&false!==t(n[r],r,n););return n},Ku),yo=Kt(function(n,t,r){He.call(n,r)?n[r].push(t):n[r]=[t]}),mo=Kt(function(n,t,r){n[r]=t}),wo=ce(function(n,t,r){var e=-1,u=typeof t=="function",o=Rr(t),i=Er(n)?Ne(n.length):[];return qu(n,function(n){var a=u?t:o&&null!=n&&n[t];i[++e]=a?a.apply(n,r):Or(n,t,r);
|
||||
|
||||
}),i}),bo=Kt(function(n,t,r){n[r?0:1].push(t)},function(){return[[],[]]}),xo=lr(Qn,qu),Ao=lr(function(n,t,r,e){var u=n.length;for(e&&u&&(r=n[--u]);u--;)r=t(r,n[u],u,n);return r},Ku),jo=ce(function(n,t){if(null==n)return[];var r=t[2];return r&&Ir(t[0],t[1],r)&&(t.length=1),Ut(n,ht(t),[])}),Oo=Eu||function(){return(new $e).getTime()},Eo=ce(function(n,t,r){var e=x;if(r.length)var u=v(r,Eo.placeholder),e=e|k;return vr(n,e,t,r,u)}),ko=ce(function(n,t){t=t.length?ht(t):we(n);for(var r=-1,e=t.length;++r<e;){
|
||||
var u=t[r];n[u]=vr(n[u],x,n)}return n}),Io=ce(function(n,t,r){var e=x|A;if(r.length)var u=v(r,Io.placeholder),e=e|k;return vr(t,e,n,r,u)}),Ro=Ht(O),So=Ht(E),Co=ce(function(n,t){return ft(n,1,t)}),To=ce(function(n,t,r){return ft(n,t,r)}),Uo=er(),Wo=er(true),Fo=cr(k),No=cr(I),$o=ce(function(n,t){return vr(n,S,null,null,null,ht(t))});Bu.argsTag||(le=function(n){return h(n)&&Er(n)&&He.call(n,"callee")&&!pu.call(n,"callee")});var Lo=wu||function(n){return h(n)&&Cr(n.length)&&nu.call(n)==B};Bu.dom||(se=function(n){
|
||||
return!!n&&1===n.nodeType&&h(n)&&!Bo(n)});var Po=ku||function(n){return typeof n=="number"&&xu(n)},zo=e(/x/)||gu&&!e(gu)?function(n){return nu.call(n)==K}:e,Bo=cu?function(n){if(!n||nu.call(n)!=Y||!Ln.support.argsTag&&le(n))return false;var t=n.valueOf,r=_e(t)&&(r=cu(t))&&cu(r);return r?n==r||cu(n)==r:Fr(n)}:Fr,Mo=Vt(function(n,t,r){return r?et(n,t,r):Mu(n,t)}),Do=ce(function(n){var t=n[0];return null==t?t:(n.push(tt),Mo.apply(w,n))}),qo=rr(vt),Ko=rr(gt),Vo=or(Vu),Yo=or(Yu),Zo=ir(vt),Go=ir(gt),Jo=Au?function(n){
|
||||
var t=null!=n&&n.constructor;return typeof t=="function"&&t.prototype===n||(typeof n=="function"?Ln.support.enumPrototypes:Er(n))?Nr(n):he(n)?Au(n):[]}:Nr,Xo=ar(true),Ho=ar(),Qo=Vt(jt),ni=ce(function(n,t){if(null==n)return{};if("function"!=typeof t[0])return t=Hn(ht(t),qe),Ur(n,ct(be(n),t));var r=Bt(t[0],t[1],3);return Wr(n,function(n,t,e){return!r(n,t,e)})}),ti=ce(function(n,t){return null==n?{}:"function"==typeof t[0]?Wr(n,Bt(t[0],t[1],3)):Ur(n,ht(t))}),ri=Jt(function(n,t,r){return t=t.toLowerCase(),
|
||||
n+(r?t.charAt(0).toUpperCase()+t.slice(1):t)}),ei=Jt(function(n,t,r){return n+(r?"-":"")+t.toLowerCase()}),ui=fr(),oi=fr(true);8!=Iu(Tn+"08")&&(Oe=function(n,t,r){return(r?Ir(n,t,r):null==t)?t=0:t&&(t=+t),n=ke(n),Iu(n,t||(En.test(n)?16:10))});var ii=Jt(function(n,t,r){return n+(r?"_":"")+t.toLowerCase()}),ai=Jt(function(n,t,r){return n+(r?" ":"")+(t.charAt(0).toUpperCase()+t.slice(1))}),fi=ce(function(n,t){try{return n.apply(w,t)}catch(r){return pe(r)?r:new Le(r)}}),ci=ce(function(n,t){return function(r){
|
||||
return Or(r,n,t)}}),li=ce(function(n,t){return function(r){return Or(n,r,t)}}),si=Qt(function(n){for(var t=-1,r=n.length,e=Su;++t<r;){var u=n[t];u>e&&(e=u)}return e}),pi=Qt(function(n){for(var t=-1,r=n.length,e=Cu;++t<r;){var u=n[t];u<e&&(e=u)}return e},true);return Ln.prototype=Pn.prototype,zn.prototype=Du(Pn.prototype),zn.prototype.constructor=zn,Bn.prototype=Du(Pn.prototype),Bn.prototype.constructor=Bn,Mn.prototype["delete"]=function(n){return this.has(n)&&delete this.__data__[n]},Mn.prototype.get=function(n){
|
||||
return"__proto__"==n?w:this.__data__[n]},Mn.prototype.has=function(n){return"__proto__"!=n&&He.call(this.__data__,n)},Mn.prototype.set=function(n,t){return"__proto__"!=n&&(this.__data__[n]=t),this},Dn.prototype.push=function(n){var t=this.data;typeof n=="string"||he(n)?t.set.add(n):t.hash[n]=true},fe.Cache=Mn,Ln.after=function(n,t){if(typeof t!="function"){if(typeof n!="function")throw new Ke(L);var r=n;n=t,t=r}return n=xu(n=+n)?n:0,function(){return 1>--n?t.apply(this,arguments):void 0}},Ln.ary=function(n,t,r){
|
||||
return r&&Ir(n,t,r)&&(t=null),t=n&&null==t?n.length:ju(+t||0,0),vr(n,R,null,null,null,null,t)},Ln.assign=Mo,Ln.at=so,Ln.before=ie,Ln.bind=Eo,Ln.bindAll=ko,Ln.bindKey=Io,Ln.callback=Re,Ln.chain=Xr,Ln.chunk=function(n,t,r){t=(r?Ir(n,t,r):null==t)?1:ju(+t||1,1),r=0;for(var e=n?n.length:0,u=-1,o=Ne(ou(e/t));r<e;)o[++u]=St(n,r,r+=t);return o},Ln.compact=function(n){for(var t=-1,r=n?n.length:0,e=-1,u=[];++t<r;){var o=n[t];o&&(u[++e]=o)}return u},Ln.constant=Se,Ln.countBy=po,Ln.create=function(n,t,r){var e=Du(n);
|
||||
|
||||
return r&&Ir(n,t,r)&&(t=null),t?Mu(e,t):e},Ln.curry=Ro,Ln.curryRight=So,Ln.debounce=ae,Ln.defaults=Do,Ln.defer=Co,Ln.delay=To,Ln.difference=to,Ln.drop=Br,Ln.dropRight=Mr,Ln.dropRightWhile=function(n,t,r){return n&&n.length?$t(n,wr(t,r,3),true,true):[]},Ln.dropWhile=function(n,t,r){return n&&n.length?$t(n,wr(t,r,3),true):[]},Ln.fill=function(n,t,r,e){var u=n?n.length:0;if(!u)return[];for(r&&typeof r!="number"&&Ir(n,t,r)&&(r=0,e=u),u=n.length,r=null==r?0:+r||0,0>r&&(r=-r>u?0:u+r),e=e===w||e>u?u:+e||0,0>e&&(e+=u),
|
||||
u=r>e?0:e>>>0,r>>>=0;r<u;)n[r++]=t;return n},Ln.filter=ne,Ln.flatten=function(n,t,r){var e=n?n.length:0;return r&&Ir(n,t,r)&&(t=false),e?ht(n,t):[]},Ln.flattenDeep=function(n){return n&&n.length?ht(n,true):[]},Ln.flow=Uo,Ln.flowRight=Wo,Ln.forEach=vo,Ln.forEachRight=go,Ln.forIn=Vo,Ln.forInRight=Yo,Ln.forOwn=Zo,Ln.forOwnRight=Go,Ln.functions=we,Ln.groupBy=yo,Ln.indexBy=mo,Ln.initial=function(n){return Mr(n,1)},Ln.intersection=function(){for(var n=[],t=-1,e=arguments.length,u=[],o=br(),i=o==r,a=[];++t<e;){
|
||||
var f=arguments[t];Er(f)&&(n.push(f),u.push(i&&120<=f.length?Gu(t&&f):null))}if(e=n.length,2>e)return a;var i=n[0],c=-1,l=i?i.length:0,s=u[0];n:for(;++c<l;)if(f=i[c],0>(s?qn(s,f):o(a,f,0))){for(t=e;--t;){var p=u[t];if(0>(p?qn(p,f):o(n[t],f,0)))continue n}s&&s.push(f),a.push(f)}return a},Ln.invert=function(n,t,r){r&&Ir(n,t,r)&&(t=null),r=-1;for(var e=Jo(n),u=e.length,o={};++r<u;){var i=e[r],a=n[i];t?He.call(o,a)?o[a].push(i):o[a]=[i]:o[a]=i}return o},Ln.invoke=wo,Ln.keys=Jo,Ln.keysIn=be,Ln.map=re,
|
||||
Ln.mapKeys=Xo,Ln.mapValues=Ho,Ln.matches=Te,Ln.matchesProperty=function(n,t){return At(n,at(t,true))},Ln.memoize=fe,Ln.merge=Qo,Ln.method=ci,Ln.methodOf=li,Ln.mixin=Ue,Ln.negate=function(n){if(typeof n!="function")throw new Ke(L);return function(){return!n.apply(this,arguments)}},Ln.omit=ni,Ln.once=function(n){return ie(2,n)},Ln.pairs=function(n){for(var t=-1,r=Jo(n),e=r.length,u=Ne(e);++t<e;){var o=r[t];u[t]=[o,n[o]]}return u},Ln.partial=Fo,Ln.partialRight=No,Ln.partition=bo,Ln.pick=ti,Ln.pluck=function(n,t){
|
||||
return re(n,Fe(t))},Ln.property=Fe,Ln.propertyOf=function(n){return function(t){return dt(n,Pr(t),t+"")}},Ln.pull=function(){var n=arguments,t=n[0];if(!t||!t.length)return t;for(var r=0,e=br(),u=n.length;++r<u;)for(var o=0,i=n[r];-1<(o=e(t,i,o));)vu.call(t,o,1);return t},Ln.pullAt=uo,Ln.range=function(n,t,r){r&&Ir(n,t,r)&&(t=r=null),n=+n||0,r=null==r?1:+r||0,null==t?(t=n,n=0):t=+t||0;var e=-1;t=ju(ou((t-n)/(r||1)),0);for(var u=Ne(t);++e<t;)u[e]=n,n+=r;return u},Ln.rearg=$o,Ln.reject=function(n,t,r){
|
||||
var e=Lo(n)?Xn:st;return t=wr(t,r,3),e(n,function(n,r,e){return!t(n,r,e)})},Ln.remove=function(n,t,r){var e=[];if(!n||!n.length)return e;var u=-1,o=[],i=n.length;for(t=wr(t,r,3);++u<i;)r=n[u],t(r,u,n)&&(e.push(r),o.push(u));return kt(n,o),e},Ln.rest=Vr,Ln.restParam=ce,Ln.set=function(n,t,r){if(null==n)return n;var e=t+"";t=null!=n[e]||Rr(t,n)?[e]:Pr(t);for(var e=-1,u=t.length,o=u-1,i=n;null!=i&&++e<u;){var a=t[e];he(i)&&(e==o?i[a]=r:null==i[a]&&(i[a]=kr(t[e+1])?[]:{})),i=i[a]}return n},Ln.shuffle=ue,
|
||||
Ln.slice=function(n,t,r){var e=n?n.length:0;return e?(r&&typeof r!="number"&&Ir(n,t,r)&&(t=0,r=e),St(n,t,r)):[]},Ln.sortBy=function(n,t,r){if(null==n)return[];r&&Ir(n,t,r)&&(t=null);var e=-1;return t=wr(t,r,3),n=bt(n,function(n,r,u){return{a:t(n,r,u),b:++e,c:n}}),Tt(n,f)},Ln.sortByAll=jo,Ln.sortByOrder=function(n,t,r,e){return null==n?[]:(e&&Ir(t,r,e)&&(r=null),Lo(t)||(t=null==t?[]:[t]),Lo(r)||(r=null==r?[]:[r]),Ut(n,t,r))},Ln.spread=function(n){if(typeof n!="function")throw new Ke(L);return function(t){
|
||||
return n.apply(this,t)}},Ln.take=function(n,t,r){return n&&n.length?((r?Ir(n,t,r):null==t)&&(t=1),St(n,0,0>t?0:t)):[]},Ln.takeRight=function(n,t,r){var e=n?n.length:0;return e?((r?Ir(n,t,r):null==t)&&(t=1),t=e-(+t||0),St(n,0>t?0:t)):[]},Ln.takeRightWhile=function(n,t,r){return n&&n.length?$t(n,wr(t,r,3),false,true):[]},Ln.takeWhile=function(n,t,r){return n&&n.length?$t(n,wr(t,r,3)):[]},Ln.tap=function(n,t,r){return t.call(r,n),n},Ln.throttle=function(n,t,r){var e=true,u=true;if(typeof n!="function")throw new Ke(L);
|
||||
|
||||
return false===r?e=false:he(r)&&(e="leading"in r?!!r.leading:e,u="trailing"in r?!!r.trailing:u),$n.leading=e,$n.maxWait=+t,$n.trailing=u,ae(n,t,$n)},Ln.thru=Hr,Ln.times=function(n,t,r){if(n=au(n),1>n||!xu(n))return[];var e=-1,u=Ne(Ou(n,Tu));for(t=Bt(t,r,1);++e<n;)e<Tu?u[e]=t(e):t(e);return u},Ln.toArray=function(n){var t=n?Hu(n):0;return Cr(t)?t?Ln.support.unindexedChars&&ye(n)?n.split(""):Kn(n):[]:xe(n)},Ln.toPlainObject=me,Ln.transform=function(n,t,r,e){var u=Lo(n)||de(n);return t=wr(t,e,4),null==r&&(u||he(n)?(e=n.constructor,
|
||||
r=u?Lo(n)?new e:[]:Du(zo(e)&&e.prototype)):r={}),(u?Vn:vt)(n,function(n,e,u){return t(r,n,e,u)}),r},Ln.union=ao,Ln.uniq=Yr,Ln.unzip=Zr,Ln.unzipWith=Gr,Ln.values=xe,Ln.valuesIn=function(n){return Nt(n,be(n))},Ln.where=function(n,t){return ne(n,xt(t))},Ln.without=fo,Ln.wrap=function(n,t){return t=null==t?Ce:t,vr(t,k,null,[n],[])},Ln.xor=function(){for(var n=-1,t=arguments.length;++n<t;){var r=arguments[n];if(Er(r))var e=e?ct(e,r).concat(ct(r,e)):r}return e?Ft(e):[]},Ln.zip=co,Ln.zipObject=Jr,Ln.zipWith=lo,
|
||||
Ln.backflow=Wo,Ln.collect=re,Ln.compose=Wo,Ln.each=vo,Ln.eachRight=go,Ln.extend=Mo,Ln.iteratee=Re,Ln.methods=we,Ln.object=Jr,Ln.select=ne,Ln.tail=Vr,Ln.unique=Yr,Ue(Ln,Ln),Ln.add=function(n,t){return(+n||0)+(+t||0)},Ln.attempt=fi,Ln.camelCase=ri,Ln.capitalize=function(n){return(n=u(n))&&n.charAt(0).toUpperCase()+n.slice(1)},Ln.clone=function(n,t,r,e){return t&&typeof t!="boolean"&&Ir(n,t,r)?t=false:typeof t=="function"&&(e=r,r=t,t=false),r=typeof r=="function"&&Bt(r,e,1),at(n,t,r)},Ln.cloneDeep=function(n,t,r){
|
||||
return t=typeof t=="function"&&Bt(t,r,1),at(n,true,t)},Ln.deburr=Ae,Ln.endsWith=function(n,t,r){n=u(n),t+="";var e=n.length;return r=r===w?e:Ou(0>r?0:+r||0,e),r-=t.length,0<=r&&n.indexOf(t,r)==r},Ln.escape=function(n){return(n=u(n))&&hn.test(n)?n.replace(sn,l):n},Ln.escapeRegExp=je,Ln.every=Qr,Ln.find=ho,Ln.findIndex=ro,Ln.findKey=qo,Ln.findLast=_o,Ln.findLastIndex=eo,Ln.findLastKey=Ko,Ln.findWhere=function(n,t){return ho(n,xt(t))},Ln.first=Dr,Ln.get=function(n,t,r){return n=null==n?w:dt(n,Pr(t),t+""),
|
||||
n===w?r:n},Ln.has=function(n,t){if(null==n)return false;var r=He.call(n,t);return r||Rr(t)||(t=Pr(t),n=1==t.length?n:dt(n,St(t,0,-1)),t=Kr(t),r=null!=n&&He.call(n,t)),r||Ln.support.nonEnumStrings&&ye(n)&&kr(t,n.length)},Ln.identity=Ce,Ln.includes=te,Ln.indexOf=qr,Ln.inRange=function(n,t,r){return t=+t||0,"undefined"===typeof r?(r=t,t=0):r=+r||0,n>=Ou(t,r)&&n<ju(t,r)},Ln.isArguments=le,Ln.isArray=Lo,Ln.isBoolean=function(n){return true===n||false===n||h(n)&&nu.call(n)==M},Ln.isDate=function(n){return h(n)&&nu.call(n)==D;
|
||||
|
||||
},Ln.isElement=se,Ln.isEmpty=function(n){return null==n?true:Er(n)&&(Lo(n)||ye(n)||le(n)||h(n)&&zo(n.splice))?!n.length:!Jo(n).length},Ln.isEqual=function(n,t,r,e){return r=typeof r=="function"&&Bt(r,e,3),!r&&Tr(n)&&Tr(t)?n===t:(e=r?r(n,t):w,e===w?mt(n,t,r):!!e)},Ln.isError=pe,Ln.isFinite=Po,Ln.isFunction=zo,Ln.isMatch=function(n,t,r,e){var u=Jo(t),o=u.length;if(!o)return true;if(null==n)return false;if(r=typeof r=="function"&&Bt(r,e,3),n=Lr(n),!r&&1==o){var i=u[0];if(e=t[i],Tr(e))return e===n[i]&&(e!==w||i in n);
|
||||
|
||||
}for(var i=Ne(o),a=Ne(o);o--;)e=i[o]=t[u[o]],a[o]=Tr(e);return wt(n,u,i,a,r)},Ln.isNaN=function(n){return ve(n)&&n!=+n},Ln.isNative=_e,Ln.isNull=function(n){return null===n},Ln.isNumber=ve,Ln.isObject=he,Ln.isPlainObject=Bo,Ln.isRegExp=ge,Ln.isString=ye,Ln.isTypedArray=de,Ln.isUndefined=function(n){return n===w},Ln.kebabCase=ei,Ln.last=Kr,Ln.lastIndexOf=function(n,t,r){var e=n?n.length:0;if(!e)return-1;var u=e;if(typeof r=="number")u=(0>r?ju(e+r,0):Ou(r||0,e-1))+1;else if(r)return u=Pt(n,t,true)-1,
|
||||
n=n[u],(t===t?t===n:n!==n)?u:-1;if(t!==t)return p(n,u,true);for(;u--;)if(n[u]===t)return u;return-1},Ln.max=si,Ln.min=pi,Ln.noConflict=function(){return _._=tu,this},Ln.noop=We,Ln.now=Oo,Ln.pad=function(n,t,r){n=u(n),t=+t;var e=n.length;return e<t&&xu(t)?(e=(t-e)/2,t=au(e),e=ou(e),r=pr("",e,r),r.slice(0,t)+n+r):n},Ln.padLeft=ui,Ln.padRight=oi,Ln.parseInt=Oe,Ln.random=function(n,t,r){r&&Ir(n,t,r)&&(t=r=null);var e=null==n,u=null==t;return null==r&&(u&&typeof n=="boolean"?(r=n,n=1):typeof t=="boolean"&&(r=t,
|
||||
u=true)),e&&u&&(t=1,u=false),n=+n||0,u?(t=n,n=0):t=+t||0,r||n%1||t%1?(r=Ru(),Ou(n+r*(t-n+parseFloat("1e-"+((r+"").length-1))),t)):It(n,t)},Ln.reduce=xo,Ln.reduceRight=Ao,Ln.repeat=Ee,Ln.result=function(n,t,r){var e=null==n?w:Lr(n)[t];return e===w&&(null==n||Rr(t,n)||(t=Pr(t),n=1==t.length?n:dt(n,St(t,0,-1)),e=null==n?w:Lr(n)[Kr(t)]),e=e===w?r:e),zo(e)?e.call(n):e},Ln.runInContext=m,Ln.size=function(n){var t=n?Hu(n):0;return Cr(t)?t:Jo(n).length},Ln.snakeCase=ii,Ln.some=oe,Ln.sortedIndex=oo,Ln.sortedLastIndex=io,
|
||||
Ln.startCase=ai,Ln.startsWith=function(n,t,r){return n=u(n),r=null==r?0:Ou(0>r?0:+r||0,n.length),n.lastIndexOf(t,r)==r},Ln.sum=function(n,t,r){r&&Ir(n,t,r)&&(t=null);var e=wr(),u=null==t;if(e===it&&u||(u=false,t=e(t,r,3)),u){for(n=Lo(n)?n:$r(n),t=n.length,r=0;t--;)r+=+n[t]||0;n=r}else n=Wt(n,t);return n},Ln.template=function(n,t,r){var e=Ln.templateSettings;r&&Ir(n,t,r)&&(t=r=null),n=u(n),t=et(Mu({},r||t),e,rt),r=et(Mu({},t.imports),e.imports,rt);var o,i,a=Jo(r),f=Nt(r,a),c=0;r=t.interpolate||Rn;var l="__p+='";
|
||||
|
||||
r=De((t.escape||Rn).source+"|"+r.source+"|"+(r===gn?jn:Rn).source+"|"+(t.evaluate||Rn).source+"|$","g");var p="sourceURL"in t?"//# sourceURL="+t.sourceURL+"\n":"";if(n.replace(r,function(t,r,e,u,a,f){return e||(e=u),l+=n.slice(c,f).replace(Sn,s),r&&(o=true,l+="'+__e("+r+")+'"),a&&(i=true,l+="';"+a+";\n__p+='"),e&&(l+="'+((__t=("+e+"))==null?'':__t)+'"),c=f+t.length,t}),l+="';",(t=t.variable)||(l="with(obj){"+l+"}"),l=(i?l.replace(an,""):l).replace(fn,"$1").replace(cn,"$1;"),l="function("+(t||"obj")+"){"+(t?"":"obj||(obj={});")+"var __t,__p=''"+(o?",__e=_.escape":"")+(i?",__j=Array.prototype.join;function print(){__p+=__j.call(arguments,'')}":";")+l+"return __p}",
|
||||
t=fi(function(){return Pe(a,p+"return "+l).apply(w,f)}),t.source=l,pe(t))throw t;return t},Ln.trim=ke,Ln.trimLeft=function(n,t,r){var e=n;return(n=u(n))?n.slice((r?Ir(e,t,r):null==t)?g(n):i(n,t+"")):n},Ln.trimRight=function(n,t,r){var e=n;return(n=u(n))?(r?Ir(e,t,r):null==t)?n.slice(0,y(n)+1):n.slice(0,a(n,t+"")+1):n},Ln.trunc=function(n,t,r){r&&Ir(n,t,r)&&(t=null);var e=C;if(r=T,null!=t)if(he(t)){var o="separator"in t?t.separator:o,e="length"in t?+t.length||0:e;r="omission"in t?u(t.omission):r}else e=+t||0;
|
||||
|
||||
if(n=u(n),e>=n.length)return n;if(e-=r.length,1>e)return r;if(t=n.slice(0,e),null==o)return t+r;if(ge(o)){if(n.slice(e).search(o)){var i,a=n.slice(0,e);for(o.global||(o=De(o.source,(On.exec(o)||"")+"g")),o.lastIndex=0;n=o.exec(a);)i=n.index;t=t.slice(0,null==i?e:i)}}else n.indexOf(o,e)!=e&&(o=t.lastIndexOf(o),-1<o&&(t=t.slice(0,o)));return t+r},Ln.unescape=function(n){return(n=u(n))&&pn.test(n)?n.replace(ln,d):n},Ln.uniqueId=function(n){var t=++Qe;return u(n)+t},Ln.words=Ie,Ln.all=Qr,Ln.any=oe,Ln.contains=te,
|
||||
Ln.detect=ho,Ln.foldl=xo,Ln.foldr=Ao,Ln.head=Dr,Ln.include=te,Ln.inject=xo,Ue(Ln,function(){var n={};return vt(Ln,function(t,r){Ln.prototype[r]||(n[r]=t)}),n}(),false),Ln.sample=ee,Ln.prototype.sample=function(n){return this.__chain__||null!=n?this.thru(function(t){return ee(t,n)}):ee(this.value())},Ln.VERSION=b,Vn("bind bindKey curry curryRight partial partialRight".split(" "),function(n){Ln[n].placeholder=Ln}),Vn(["dropWhile","filter","map","takeWhile"],function(n,t){var r=t!=$,e=t==F;Bn.prototype[n]=function(n,u){
|
||||
var o=this.__filtered__,i=o&&e?new Bn(this):this.clone();return(i.__iteratees__||(i.__iteratees__=[])).push({done:false,count:0,index:0,iteratee:wr(n,u,1),limit:-1,type:t}),i.__filtered__=o||r,i}}),Vn(["drop","take"],function(n,t){var r=n+"While";Bn.prototype[n]=function(r){var e=this.__filtered__,u=e&&!t?this.dropWhile():this.clone();return r=null==r?1:ju(au(r)||0,0),e?t?u.__takeCount__=Ou(u.__takeCount__,r):Kr(u.__iteratees__).limit=r:(u.__views__||(u.__views__=[])).push({size:r,type:n+(0>u.__dir__?"Right":"")
|
||||
}),u},Bn.prototype[n+"Right"]=function(t){return this.reverse()[n](t).reverse()},Bn.prototype[n+"RightWhile"]=function(n,t){return this.reverse()[r](n,t).reverse()}}),Vn(["first","last"],function(n,t){var r="take"+(t?"Right":"");Bn.prototype[n]=function(){return this[r](1).value()[0]}}),Vn(["initial","rest"],function(n,t){var r="drop"+(t?"":"Right");Bn.prototype[n]=function(){return this[r](1)}}),Vn(["pluck","where"],function(n,t){var r=t?"filter":"map",e=t?xt:Fe;Bn.prototype[n]=function(n){return this[r](e(n));
|
||||
|
||||
}}),Bn.prototype.compact=function(){return this.filter(Ce)},Bn.prototype.reject=function(n,t){return n=wr(n,t,1),this.filter(function(t){return!n(t)})},Bn.prototype.slice=function(n,t){n=null==n?0:+n||0;var r=this;return 0>n?r=this.takeRight(-n):n&&(r=this.drop(n)),t!==w&&(t=+t||0,r=0>t?r.dropRight(-t):r.take(t-n)),r},Bn.prototype.toArray=function(){return this.drop(0)},vt(Bn.prototype,function(n,t){var r=Ln[t];if(r){var e=/^(?:filter|map|reject)|While$/.test(t),u=/^(?:first|last)$/.test(t);Ln.prototype[t]=function(){
|
||||
function t(n){return n=[n],lu.apply(n,o),r.apply(Ln,n)}var o=arguments,i=this.__chain__,a=this.__wrapped__,f=!!this.__actions__.length,c=a instanceof Bn,l=o[0],s=c||Lo(a);return s&&e&&typeof l=="function"&&1!=l.length&&(c=s=false),c=c&&!f,u&&!i?c?n.call(a):r.call(Ln,this.value()):s?(a=n.apply(c?a:new Bn(this),o),u||!f&&!a.__actions__||(a.__actions__||(a.__actions__=[])).push({func:Hr,args:[t],thisArg:Ln}),new zn(a,i)):this.thru(t)}}}),Vn("concat join pop push replace shift sort splice split unshift".split(" "),function(n){
|
||||
var t=(/^(?:replace|split)$/.test(n)?Ge:Ve)[n],r=/^(?:push|sort|unshift)$/.test(n)?"tap":"thru",e=/^(?:join|pop|replace|shift)$/.test(n),u=Bu.spliceObjects||!/^(?:pop|shift|splice)$/.test(n)?t:function(){var n=t.apply(this,arguments);return 0===this.length&&delete this[0],n};Ln.prototype[n]=function(){var n=arguments;return e&&!this.__chain__?u.apply(this.value(),n):this[r](function(t){return u.apply(t,n)})}}),vt(Bn.prototype,function(n,t){var r=Ln[t];if(r){var e=r.name;(Lu[e]||(Lu[e]=[])).push({
|
||||
name:t,func:r})}}),Lu[sr(null,A).name]=[{name:"wrapper",func:null}],Bn.prototype.clone=function(){var n=this.__actions__,t=this.__iteratees__,r=this.__views__,e=new Bn(this.__wrapped__);return e.__actions__=n?Kn(n):null,e.__dir__=this.__dir__,e.__filtered__=this.__filtered__,e.__iteratees__=t?Kn(t):null,e.__takeCount__=this.__takeCount__,e.__views__=r?Kn(r):null,e},Bn.prototype.reverse=function(){if(this.__filtered__){var n=new Bn(this);n.__dir__=-1,n.__filtered__=true}else n=this.clone(),n.__dir__*=-1;
|
||||
|
||||
return n},Bn.prototype.value=function(){var n=this.__wrapped__.value();if(!Lo(n))return Lt(n,this.__actions__);var t,r=this.__dir__,e=0>r;t=n.length;for(var u=this.__views__,o=0,i=-1,a=u?u.length:0;++i<a;){var f=u[i],c=f.size;switch(f.type){case"drop":o+=c;break;case"dropRight":t-=c;break;case"take":t=Ou(t,o+c);break;case"takeRight":o=ju(o,t-c)}}t={start:o,end:t},u=t.start,o=t.end,t=o-u,u=e?o:u-1,o=Ou(t,this.__takeCount__),a=(i=this.__iteratees__)?i.length:0,f=0,c=[];n:for(;t--&&f<o;){for(var u=u+r,l=-1,s=n[u];++l<a;){
|
||||
var p=i[l],h=p.iteratee,_=p.type;if(_==F){if(p.done&&(e?u>p.index:u<p.index)&&(p.count=0,p.done=false),p.index=u,!(p.done||(_=p.limit,p.done=-1<_?p.count++>=_:!h(s))))continue n}else if(p=h(s),_==$)s=p;else if(!p){if(_==N)continue n;break n}}c[f++]=s}return c},Ln.prototype.chain=function(){return Xr(this)},Ln.prototype.commit=function(){return new zn(this.value(),this.__chain__)},Ln.prototype.plant=function(n){for(var t,r=this;r instanceof Pn;){var e=zr(r);t?u.__wrapped__=e:t=e;var u=e,r=r.__wrapped__;
|
||||
|
||||
}return u.__wrapped__=n,t},Ln.prototype.reverse=function(){var n=this.__wrapped__;return n instanceof Bn?(this.__actions__.length&&(n=new Bn(this)),new zn(n.reverse(),this.__chain__)):this.thru(function(n){return n.reverse()})},Ln.prototype.toString=function(){return this.value()+""},Ln.prototype.run=Ln.prototype.toJSON=Ln.prototype.valueOf=Ln.prototype.value=function(){return Lt(this.__wrapped__,this.__actions__)},Ln.prototype.collect=Ln.prototype.map,Ln.prototype.head=Ln.prototype.first,Ln.prototype.select=Ln.prototype.filter,
|
||||
Ln.prototype.tail=Ln.prototype.rest,Ln}var w,b="3.8.0",x=1,A=2,j=4,O=8,E=16,k=32,I=64,R=128,S=256,C=30,T="...",U=150,W=16,F=0,N=1,$=2,L="Expected a function",P="__lodash_placeholder__",z="[object Arguments]",B="[object Array]",M="[object Boolean]",D="[object Date]",q="[object Error]",K="[object Function]",V="[object Number]",Y="[object Object]",Z="[object RegExp]",G="[object String]",J="[object ArrayBuffer]",X="[object Float32Array]",H="[object Float64Array]",Q="[object Int8Array]",nn="[object Int16Array]",tn="[object Int32Array]",rn="[object Uint8Array]",en="[object Uint8ClampedArray]",un="[object Uint16Array]",on="[object Uint32Array]",an=/\b__p\+='';/g,fn=/\b(__p\+=)''\+/g,cn=/(__e\(.*?\)|\b__t\))\+'';/g,ln=/&(?:amp|lt|gt|quot|#39|#96);/g,sn=/[&<>"'`]/g,pn=RegExp(ln.source),hn=RegExp(sn.source),_n=/<%-([\s\S]+?)%>/g,vn=/<%([\s\S]+?)%>/g,gn=/<%=([\s\S]+?)%>/g,yn=/\.|\[(?:[^[\]]*|(["'])(?:(?!\1)[^\n\\]|\\.)*?\1)\]/,dn=/^\w*$/,mn=/[^.[\]]+|\[(?:(-?\d+(?:\.\d+)?)|(["'])((?:(?!\2)[^\n\\]|\\.)*?)\2)\]/g,wn=/[.*+?^${}()|[\]\/\\]/g,bn=RegExp(wn.source),xn=/[\u0300-\u036f\ufe20-\ufe23]/g,An=/\\(\\)?/g,jn=/\$\{([^\\}]*(?:\\.[^\\}]*)*)\}/g,On=/\w*$/,En=/^0[xX]/,kn=/^\[object .+?Constructor\]$/,In=/[\xc0-\xd6\xd8-\xde\xdf-\xf6\xf8-\xff]/g,Rn=/($^)/,Sn=/['\n\r\u2028\u2029\\]/g,Cn=RegExp("[A-Z\\xc0-\\xd6\\xd8-\\xde]+(?=[A-Z\\xc0-\\xd6\\xd8-\\xde][a-z\\xdf-\\xf6\\xf8-\\xff]+)|[A-Z\\xc0-\\xd6\\xd8-\\xde]?[a-z\\xdf-\\xf6\\xf8-\\xff]+|[A-Z\\xc0-\\xd6\\xd8-\\xde]+|[0-9]+","g"),Tn=" \t\x0b\f\xa0\ufeff\n\r\u2028\u2029\u1680\u180e\u2000\u2001\u2002\u2003\u2004\u2005\u2006\u2007\u2008\u2009\u200a\u202f\u205f\u3000",Un="Array ArrayBuffer Date Error Float32Array Float64Array Function Int8Array Int16Array Int32Array Math Number Object RegExp Set String _ clearTimeout document isFinite parseInt setTimeout TypeError Uint8Array Uint8ClampedArray Uint16Array Uint32Array WeakMap window".split(" "),Wn="constructor hasOwnProperty isPrototypeOf propertyIsEnumerable toLocaleString toString valueOf".split(" "),Fn={};
|
||||
|
||||
Fn[X]=Fn[H]=Fn[Q]=Fn[nn]=Fn[tn]=Fn[rn]=Fn[en]=Fn[un]=Fn[on]=true,Fn[z]=Fn[B]=Fn[J]=Fn[M]=Fn[D]=Fn[q]=Fn[K]=Fn["[object Map]"]=Fn[V]=Fn[Y]=Fn[Z]=Fn["[object Set]"]=Fn[G]=Fn["[object WeakMap]"]=false;var Nn={};Nn[z]=Nn[B]=Nn[J]=Nn[M]=Nn[D]=Nn[X]=Nn[H]=Nn[Q]=Nn[nn]=Nn[tn]=Nn[V]=Nn[Y]=Nn[Z]=Nn[G]=Nn[rn]=Nn[en]=Nn[un]=Nn[on]=true,Nn[q]=Nn[K]=Nn["[object Map]"]=Nn["[object Set]"]=Nn["[object WeakMap]"]=false;var $n={leading:false,maxWait:0,trailing:false},Ln={"\xc0":"A","\xc1":"A","\xc2":"A","\xc3":"A","\xc4":"A","\xc5":"A",
|
||||
"\xe0":"a","\xe1":"a","\xe2":"a","\xe3":"a","\xe4":"a","\xe5":"a","\xc7":"C","\xe7":"c","\xd0":"D","\xf0":"d","\xc8":"E","\xc9":"E","\xca":"E","\xcb":"E","\xe8":"e","\xe9":"e","\xea":"e","\xeb":"e","\xcc":"I","\xcd":"I","\xce":"I","\xcf":"I","\xec":"i","\xed":"i","\xee":"i","\xef":"i","\xd1":"N","\xf1":"n","\xd2":"O","\xd3":"O","\xd4":"O","\xd5":"O","\xd6":"O","\xd8":"O","\xf2":"o","\xf3":"o","\xf4":"o","\xf5":"o","\xf6":"o","\xf8":"o","\xd9":"U","\xda":"U","\xdb":"U","\xdc":"U","\xf9":"u","\xfa":"u",
|
||||
"\xfb":"u","\xfc":"u","\xdd":"Y","\xfd":"y","\xff":"y","\xc6":"Ae","\xe6":"ae","\xde":"Th","\xfe":"th","\xdf":"ss"},Pn={"&":"&","<":"<",">":">",'"':""","'":"'","`":"`"},zn={"&":"&","<":"<",">":">",""":'"',"'":"'","`":"`"},Bn={"function":true,object:true},Mn={"\\":"\\","'":"'","\n":"n","\r":"r","\u2028":"u2028","\u2029":"u2029"},Dn=Bn[typeof exports]&&exports&&!exports.nodeType&&exports,qn=Bn[typeof module]&&module&&!module.nodeType&&module,Kn=Bn[typeof self]&&self&&self.Object&&self,Vn=Bn[typeof window]&&window&&window.Object&&window,Yn=qn&&qn.exports===Dn&&Dn,Zn=Dn&&qn&&typeof global=="object"&&global&&global.Object&&global||Vn!==(this&&this.window)&&Vn||Kn||this,Gn=function(){
|
||||
try{Object({toString:0}+"")}catch(n){return function(){return false}}return function(n){return typeof n.toString!="function"&&typeof(n+"")=="string"}}(),Jn=m();typeof define=="function"&&typeof define.amd=="object"&&define.amd?(Zn._=Jn, define(function(){return Jn})):Dn&&qn?Yn?(qn.exports=Jn)._=Jn:Dn._=Jn:Zn._=Jn}).call(this);
|
||||
Loading…
Reference in New Issue