vndb/mithril-vndb
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge remote-tracking branch 'origin/next' into next

Browse source
This commit is contained in:
Leo Horie 2015-07-14 19:11:31 -04:00
commit dcbb82f7d2
9 changed files with 1008 additions and 259 deletions
Download patch file Download diff file Expand all files Collapse all files

8
README.md
View file

@ -6,7 +6,7 @@
A Javascript Framework for Building Brilliant Applications
See the [website](http://lhorie.github.io/mithril) for documentation
See the [website](http://mithril.js.org) for documentation
There's also a [blog](http://lhorie.github.io/mithril-blog) and a [mailing list](https://groups.google.com/forum/#!forum/mithriljs)
@ -74,6 +74,6 @@ m.module(document.getElementById("example"), app);
### Learn more
- [Tutorial](http://lhorie.github.io/mithril/getting-started.html)
- [Differences from Other Frameworks](http://lhorie.github.io/mithril/comparison.html)
- [Benchmarks](http://lhorie.github.io/mithril/benchmarks.html)
- [Tutorial](http://mithril.js.org/getting-started.html)
- [Differences from Other Frameworks](http://mithril.js.org/comparison.html)
- [Benchmarks](http://mithril.js.org/benchmarks.html)

2
docs/components.md
View file

@ -396,7 +396,7 @@ var ContactsWidget = {
//ContactList no longer calls `Contact.save`
var ContactForm = {
controller: function(args) {
ctrl = this
var ctrl = this
ctrl.contact = m.prop(new Contact())
ctrl.save = function(contact) {
Observable.trigger("saveContact", {contact: contact})

2
docs/mithril.render.md
View file

@ -122,4 +122,4 @@ where:
- **Boolean forceRecreation**
If set to true, rendering a new virtual tree will completely overwrite an existing one without attempting to diff against it
If set to true, rendering a new virtual tree will completely overwrite an existing one without attempting to diff against it

4
docs/web-services.md
View file

@ -1,8 +1,8 @@
## Web Services
Mithril provides a high-level utility for working with web services, which allows writing asynchronous code relatively procedurally.
Mithril allows writing asynchronous code in a procedural way through a high-level utility for working with web services.
It provides a number of useful features out of the box:
This utility provides a number of useful features out of the box:
- The ability to get an early reference to a container that will hold the asynchronous response
- The ability to queue operations to be performed after the asynchronous request completes

860
mithril.d.ts vendored
View file

@ -1,166 +1,884 @@
//Mithril type definitions for Typescript
// Mithril type definitions for Typescript
/**
* This is the module containing all the types/declarations/etc. for Mithril
*/
declare module _mithril {
interface MithrilStatic {
/**
* Creates a virtual element for use with m.render, m.mount, etc.
*
* @param selector A simple CSS selector. May include SVG tags. Nested
* selectors are not supported.
* @param attributes Attributes to add. Any DOM attribute may be used
* as an attribute, although innerHTML and the like may be overwritten
* silently.
* @param children Child elements, components, and text to add.
* @return A virtual element.
*
* @see m.render
* @see m.mount
* @see m.component
*/
<T extends MithrilController>(
selector: string,
attributes: MithrilAttributes,
...children: Array<string |
MithrilVirtualElement<T> |
MithrilComponent<T>>
): MithrilVirtualElement<T>;
<T extends MithrilController>(selector: string, attributes: MithrilAttributes, ...children: Array<string|MithrilVirtualElement|MithrilComponent<T>>): MithrilVirtualElement;
<T extends MithrilController>(selector: string, ...children: Array<string|MithrilVirtualElement|MithrilComponent<T>>): MithrilVirtualElement;
/**
* Creates a virtual element for use with m.render, m.mount, etc.
*
* @param selector A simple CSS selector. Nested selectors are not
* supported.
* @param children Child elements, components, and text to add.
* @return A virtual element.
*
* @see m.render
* @see m.mount
* @see m.component
*/
<T extends MithrilController>(
selector: string,
...children: Array<string |
MithrilVirtualElement<T> |
MithrilComponent<T>>
): MithrilVirtualElement<T>;
prop<T>(promise: MithrilPromise<T>) : MithrilPromiseProperty<T>;
prop<T>(value: T): MithrilProperty<T>;
prop(): MithrilProperty<Object>; // might be that this should be Property<any>
/**
* Initializes a component for use with m.render, m.mount, etc.
* Shorthand for m.component.
*
* @param selector A component.
* @param args Arguments to optionally pass to the component.
* @return A component.
*
* @see m.render
* @see m.mount
* @see m.component
*/
<T extends MithrilController>(
component: MithrilComponent<T>,
...args: any[]
): MithrilComponent<T>;
withAttr(property: string, callback: (value: any) => void): (e: MithrilEvent) => any;
/**
* Creates a getter-setter function that wraps a Mithril promise. Useful
* for uniform data access, m.withAttr, etc.
*
* @param promise A thennable to initialize the property with. It may
* optionally be a Mithril promise.
* @return A getter-setter function wrapping the promise.
*
* @see m.withAttr
*/
prop<T>(promise: Thennable<T>) : MithrilPromiseProperty<T>;
module<T extends MithrilController>(rootElement: Node, component: MithrilComponent<T>): T;
module<T extends MithrilController>(rootElement: Node): T;
mount<T extends MithrilController>(rootElement: Node, component: MithrilComponent<T>): T;
mount<T extends MithrilController>(rootElement: Node): T;
/**
* Creates a getter-setter function that wraps a simple value. Useful
* for uniform data access, m.withAttr, etc.
*
* @param value A value to initialize the property with
* @return A getter-setter function wrapping the value.
*
* @see m.withAttr
*/
prop<T>(value: T): MithrilBasicProperty<T>;
component<T extends MithrilController>(component: MithrilComponent<T>, ...args: Array<any>): MithrilComponent<T>
trust(html: string): string;
/**
* Creates a getter-setter function that wraps a simple value. Useful
* for uniform data access, m.withAttr, etc.
*
* @return A getter-setter function wrapping the value.
*
* @see m.withAttr
*/
prop<T>(): MithrilBasicProperty<T>;
render(rootElement: Element|HTMLDocument): void;
render(rootElement: Element|HTMLDocument, children: MithrilVirtualElement, forceRecreation?: boolean): void;
render(rootElement: Element|HTMLDocument, children: MithrilVirtualElement[], forceRecreation?: boolean): void;
/**
* Returns a event handler that can be bound to an element, firing with
* the specified property.
*
* @param property The property to get from the event.
* @param callback The handler to use the value from the event.
* @return A function suitable for listening to an event.
*/
withAttr(
property: string,
callback: (value: any) => void
): (e: Event) => any;
/**
* @deprecated Use m.mount instead
*/
module<T extends MithrilController>(
rootElement: Node,
component: MithrilComponent<T>
): T;
/**
* Mounts a component to a base DOM node.
*
* @param rootElement The base node.
* @param component The component to mount.
* @return An instance of the top-level component's controller
*/
mount<T extends MithrilController>(
rootElement: Node,
component: MithrilComponent<T>
): T;
/**
* Initializes a component for use with m.render, m.mount, etc.
*
* @param selector A component.
* @param args Arguments to optionally pass to the component.
* @return A component.
*
* @see m.render
* @see m.mount
* @see m
*/
component<T extends MithrilController>(
component: MithrilComponent<T>,
...args: any[]
): MithrilComponent<T>;
/**
* Trust this string of HTML.
*
* @param html The HTML to trust
* @return A String object instance with an added internal flag to mark
* it as trusted.
*/
trust(html: string): MithrilTrustedString;
/**
* Render a virtual DOM tree.
*
* @param rootElement The base element/node to render the tree from.
* @param children One or more child nodes to add to the tree.
* @param forceRecreation If true, overwrite the entire tree without
* diffing against it.
*/
render<T extends MithrilController>(
rootElement: Element,
children: MithrilVirtualElement<T>|MithrilVirtualElement<T>[],
forceRecreation?: boolean
): void;
redraw: {
/**
* Force a redraw the active component. It redraws asynchronously by
* default to allow for simultaneous events to run before redrawing,
* such as the event combination keypress + input frequently used for
* input.
*
* @param force If true, redraw synchronously.
*/
(force?: boolean): void;
strategy: MithrilProperty<string>;
strategy: {
/**
* Gets the current redraw strategy, which returns one of the
* following:
*
* "all" - recreates the DOM tree from scratch
* "diff" - recreates the DOM tree from scratch
* "none" - leaves the DOM tree intact
*
* This is useful for event handlers, which may want to cancel
* the next redraw if the event doesn't update the UI.
*
* @return The current strategy
*/
(): string;
/**
* Sets the current redraw strategy. The parameter must be one of
* the following values:
*
* "all" - recreates the DOM tree from scratch
* "diff" - recreates the DOM tree from scratch
* "none" - leaves the DOM tree intact
*
* This is useful for event handlers, which may want to cancel
* the next redraw if the event doesn't update the UI.
*
* @param value The value to set
* @return The new strategy
*/
(value: string): string;
/**
* @private
* Implementation detail - it's a MithrilBasicProperty instance
*/
toJSON(): string;
}
}
route: {
<T extends MithrilController>(rootElement: HTMLDocument, defaultRoute: string, routes: MithrilRoutes<T>): void;
<T extends MithrilController>(rootElement: Element, defaultRoute: string, routes: MithrilRoutes<T>): void;
/**
* Enable routing, mounting a controller based on the route. It
* automatically mounts the components for you, starting with the one
* specified by the default route.
*
* @param rootElement The element to mount the active controller to.
* @param defaultRoute The route to start with.
* @param routes A key-value mapping of pathname to controller.
*/
<T extends MithrilController>(
rootElement: Element,
defaultRoute: string,
routes: MithrilRoutes<T>
): void;
(element: Element, isInitialized: boolean, context: Object, vdom: Object): void;
/**
* This allows m.route to be used as the `config` attribute for a
* virtual element, particularly useful for cases like this:
*
* ```ts
* // Note that the '#' is not required in `href`, thanks to the
* `config` setting.
* m("a[href='/dashboard/alicesmith']", {config: m.route});
* ```
*/
<T extends MithrilController>(
element: Element,
isInitialized: boolean,
context?: MithrilContext,
vdom?: MithrilVirtualElement<T>
): void;
/**
* Programmatically redirect to another route.
*
* @param path The route to go to.
* @param params Parameters to pass as a query string.
* @param shouldReplaceHistory Whether to replace the current history
* instead of adding a new one.
*/
(path: string, params?: any, shouldReplaceHistory?: boolean): void;
/**
* Gets the current route.
*
* @return The current route.
*/
(): string;
/**
* Gets a route parameter.
*
* @param key The key to get.
* @return The value associated with the parameter key.
*/
param(key: string): string;
/**
* The current routing mode. This may be changed before calling
* m.route to change the part of the URL used to perform the routing.
*
* The value can be set to one of the following, defaulting to
* "hash":
*
* "search" - Uses the query string. This allows for named anchors to
* work on the page, but changes cause IE8 and lower to refresh the
* page.
*
* "hash" - Uses the hash. This is the only routing mode that does
* not cause page refreshes on any browser, but it does not support
* named anchors.
*
* "pathname" - Uses the URL pathname. This requires server-side
* setup to support bookmarking and page refreshes. It always causes
* page refreshes on IE8 and lower. Note that this requires that the
* application to be run from the root of the URL.
*/
mode: string;
/**
* Serialize an object into a query string.
*
* @param data The data to serialize.
* @return The serialized string.
*/
buildQueryString(data: Object): String
/**
* Parse a query string into an object.
*
* @param data The data to parse.
* @return The parsed object data.
*/
parseQueryString(data: String): Object
}
request<T>(options: MithrilXHROptions): MithrilPromise<T>;
/**
* Send a request to a server to server. Note that the `url` option is
* required.
*
* @param options The options to use
* @return A promise to the returned data for "GET" requests, or a void
* promise for any other request type.
*
* @see MithrilXHROptions for the available options.
*/
request<T>(options: MithrilXHROptions<T>): MithrilPromise<T>;
deferred: {
onerror(e: Error): void;
/**
* Create a Mithril deferred object. It behaves synchronously if
* possible, an intentional deviation from Promises/A+. Note that
* deferreds are completely separate from the redrawing system, and
* never trigger a redraw on their own.
*
* @return A new Mithril deferred instance.
*
* @see m.deferred.onerror for the error callback called for Error
* subclasses
*/
<T>(): MithrilDeferred<T>;
/**
* A callback for all uncaught native Error subclasses in deferreds.
* This defaults to synchronously rethrowing all errors, a deviation
* from Promises/A+, but the behavior is configurable. To restore
* Promises/A+-compatible behavior. simply set this to a no-op.
*/
onerror(e: Error): void;
}
sync<T>(promises: MithrilPromise<T>[]): MithrilPromise<T[]>;
/**
* Takes a list of promises or thennables and returns a Mithril promise
* that resolves once all in the list are resolved, or rejects if any of
* them reject.
*
* @param promises A list of promises to try to resolve.
* @return A promise that resolves to all the promises if all resolve, or
* rejects with the error contained in the first rejection.
*/
sync<T>(promises: Thennable<T>[]): MithrilPromise<T[]>;
/**
* Use this and endComputation if your views aren't redrawing after
* calls to third-party libraries. For integrating asynchronous code,
* this should be called before any asynchronous work is done. For
* synchronous code, this should be called at the beginning of the
* problematic segment. Note that these calls must be balanced, much like
* braces and parentheses. This is mostly used internally. Prefer
* m.redraw where possible, especially when making repeated calls.
*
* @see endComputation
* @see m.render
*/
startComputation(): void;
/**
* Use startComputation and this if your views aren't redrawing after
* calls to third-party libraries. For integrating asynchronous code,
* this should be called after all asynchronous work completes. For
* synchronous code, this should be called at the end of the problematic
* segment. Note that these calls must be balanced, much like braces and
* parentheses. This is mostly used internally. Prefer m.redraw where
* possible, especially when making repeated calls.
*
* @see startComputation
* @see m.render
*/
endComputation(): void;
// For test suite
deps: {
(mockWindow: Window): Window;
factory: Object;
}
/**
* This overwrites the internal version of window used by Mithril.
* It's mostly useful for testing, and is also used internally by
* Mithril to test itself. By default Mithril uses `window` for the
* dependency.
*
* @param mockWindow The mock to use for the window.
* @return The mock that was passed in.
*/
deps(mockWindow: Window): Window;
}
interface MithrilVirtualElement {
interface MithrilTrustedString extends String {
/** @private Implementation detail. Don't depend on it. */
$trusted: boolean;
}
/**
* The interface for a virtual element. It's best to consider this immutable
* for most use cases.
*
* @see m
*/
interface MithrilVirtualElement<T extends MithrilController> {
/**
* A key to optionally associate with this element.
*/
key?: number;
/**
* The tag name of this element.
*/
tag?: string;
/**
* The attributes of this element.
*/
attrs?: MithrilAttributes;
children?: any[];
/**
* The children of this element.
*/
children?: Array<string|MithrilVirtualElement<T>|MithrilComponent<T>>;
}
// Configuration function for an element
/**
* An event passed by Mithril to unload event handlers.
*/
interface MithrilEvent {
/**
* Prevent the default behavior of scrolling the page and updating the
* URL on next route change.
*/
preventDefault(): void;
}
/**
* A context object for configuration functions.
*
* @see MithrilElementConfig
*/
interface MithrilContext {
/**
* A function to call when the node is unloaded. Useful for cleanup.
*/
onunload?(): any;
/**
* Set true if the backing DOM node needs to be retained between route
* changes if possible. Set false if this node needs to be recreated
* every single time, regardless of how "different" it is.
*/
retain?: boolean;
}
/**
* This represents a callback function for a virtual element's config
* attribute. It's a low-level function useful for extra cleanup after
* removal from the tree, storing instances of third-party classes that
* need to be associated with the DOM, etc.
*
* @see MithrilAttributes
* @see MithrilContext
*/
interface MithrilElementConfig {
(element: Element, isInitialized: boolean, context?: any, vdom?: MithrilVirtualElement): void;
/**
* A callback function for a virtual element's config attribute.
*
* @param element The associated DOM element.
* @param isInitialized Whether this is the first call for the virtual
* element or not.
* @param context The associated context for this element.
* @param vdom The associated virtual element.
*/
<T extends MithrilController>(
element: Element,
isInitialized: boolean,
context: MithrilContext,
vdom: MithrilVirtualElement<T>
): void;
}
// Attributes on a virtual element
/**
* This represents the attributes available for configuring virtual elements,
* beyond the applicable DOM attributes.
*
* @see m
*/
interface MithrilAttributes {
title?: string;
/**
* The class name(s) for this virtual element, as a space-separated list.
*/
className?: string;
/**
* The class name(s) for this virtual element, as a space-separated list.
*/
class?: string;
/**
* A custom, low-level configuration in case this element needs special
* cleanup after removal from the tree.
*
* @see MithrilElementConfig
*/
config?: MithrilElementConfig;
}
// Defines the subset of Event that Mithril needs
interface MithrilEvent {
currentTarget: Element;
}
/**
* The basis of a Mithril controller instance.
*/
interface MithrilController {
onunload?(evt: Event): any;
/**
* An optional handler to call when the associated virtual element is
* destroyed.
*
* @param evt An associated event.
*/
onunload?(evt: MithrilEvent): any;
}
interface MithrilControllerFunction extends MithrilController {
(): any;
/**
* This represents a controller function.
*
* @see MithrilControllerConstructor
*/
interface MithrilControllerFunction<T extends MithrilController> {
(): T;
}
/**
* This represents a controller constructor.
*
* @see MithrilControllerFunction
*/
interface MithrilControllerConstructor<T extends MithrilController> {
new(): T;
}
/**
* This represents a view factory.
*/
interface MithrilView<T extends MithrilController> {
(ctrl: T): string|MithrilVirtualElement;
/**
* Creates a view out of virtual elements.
*/
(ctrl: T): MithrilVirtualElement<T>;
}
/**
* This represents a Mithril component.
*
* @see m
* @see m.component
*/
interface MithrilComponent<T extends MithrilController> {
controller: MithrilControllerFunction|{ new(): T };
view: MithrilView<T>;
/**
* The component's controller.
*
* @see m.component
*/
controller: MithrilControllerFunction<T> |
MithrilControllerConstructor<T>;
/**
* Creates a view out of virtual elements.
*
* @see m.component
*/
view(ctrl: T): MithrilVirtualElement<T>;
}
/**
* This is the base interface for property getter-setters
*
* @see m.prop
*/
interface MithrilProperty<T> {
/**
* Gets the contained value.
*
* @return The contained value.
*/
(): T;
/**
* Sets the contained value.
*
* @param value The new value to set.
* @return The newly set value.
*/
(value: T): T;
}
/**
* This represents a non-promise getter-setter functions.
*
* @see m.prop which returns objects that implement this interface.
*/
interface MithrilBasicProperty<T> extends MithrilProperty<T> {
/**
* Makes this serializable to JSON.
*/
toJSON(): T;
}
interface MithrilPromiseProperty<T> extends MithrilPromise<T> {
(): T;
(value: T): T;
toJSON(): T;
/**
* This represents a promise getter-setter function.
*
* @see m.prop which returns objects that implement this interface.
*/
interface MithrilPromiseProperty<T> extends MithrilPromise<T>,
MithrilProperty<MithrilPromise<T>> {
/**
* Gets the contained promise.
*
* @return The contained value.
*/
(): MithrilPromise<T>;
/**
* Sets the contained promise.
*
* @param value The new value to set.
* @return The newly set value.
*/
(value: MithrilPromise<T>): MithrilPromise<T>;
/**
* Sets the contained wrapped value.
*
* @param value The new value to set.
* @return The newly set value.
*/
(value: T): MithrilPromise<T>;
}
/**
* This represents a key-value mapping linking routes to components.
*/
interface MithrilRoutes<T extends MithrilController> {
/**
* The key represents the route. The value represents the corresponding
* component.
*/
[key: string]: MithrilComponent<T>;
}
/**
* This represents a Mithril deferred object.
*/
interface MithrilDeferred<T> {
/**
* Resolve this deferred's promise with a value.
*
* @param value The value to resolve the promise with.
*/
resolve(value?: T): void;
reject(value?: any): void;
/**
* Reject this deferred with an error.
*
* @param value The reason for rejecting the promise.
*/
reject(reason?: any): void;
/**
* The backing promise.
*
* @see MithrilPromise
*/
promise: MithrilPromise<T>;
}
/**
* This represents a thennable success callback.
*/
interface MithrilSuccessCallback<T, U> {
(value: T): U;
(value: T): MithrilPromise<U>;
(value: T): U | Thennable<U>;
}
interface MithrilErrorCallback<U> {
(value: Error): U;
(value: string): U;
/**
* This represents a thennable error callback.
*/
interface MithrilErrorCallback<T> {
(value: Error): T | Thennable<T>;
}
interface MithrilPromise<T> {
(): T;
(value: T): T;
then<U>(success: (value: T) => U): MithrilPromise<U>;
then<U>(success: (value: T) => MithrilPromise<U>): MithrilPromise<U>;
then<U,V>(success: (value: T) => U, error: (value: Error) => V): MithrilPromise<U>|MithrilPromise<V>;
then<U,V>(success: (value: T) => MithrilPromise<U>, error: (value: Error) => V): MithrilPromise<U>|MithrilPromise<V>;
/**
* This represents a thennable.
*/
interface Thennable<T> {
then<U>(success: (value: T) => U): Thennable<U>;
then<U,V>(success: (value: T) => U, error: (value: Error) => V): Thennable<U>|Thennable<V>;
catch?: <U>(error: (value: Error) => U) => Thennable<U>;
}
interface MithrilXHROptions {
/**
* This represents a Mithril promise object.
*/
interface MithrilPromise<T> extends Thennable<T>, MithrilProperty<MithrilPromise<T>> {
/**
* Chain this promise with a simple success callback, propogating
* rejections.
*
* @param success The callback to call when the promise is resolved.
* @return The chained promise.
*/
then<U>(success: MithrilSuccessCallback<T,U>): MithrilPromise<U>;
/**
* Chain this promise with a success callback and error callback, without
* propogating rejections.
*
* @param success The callback to call when the promise is resolved.
* @param error The callback to call when the promise is rejected.
* @return The chained promise.
*/
then<U, V>(
success: MithrilSuccessCallback<T, U>,
error: MithrilErrorCallback<V>
): MithrilPromise<U> | MithrilPromise<V>;
/**
* Chain this promise with a single error callback, without propogating
* rejections.
*
* @param error The callback to call when the promise is rejected.
* @return The chained promise.
*/
catch<U>(error: MithrilErrorCallback<U>): MithrilPromise<T> |
MithrilPromise<U>;
}
/**
* This represents the available options for configuring m.request.
*
* @see m.request
*/
interface MithrilXHROptions<T> {
/**
* This represents the HTTP method used, one of the following:
*
* - "GET" (default)
* - "POST"
* - "PUT"
* - "DELETE"
* - "HEAD"
* - "OPTIONS"
*/
method?: string;
/**
* The URL to send the request to.
*/
url: string;
/**
* The username for HTTP authentication.
*/
user?: string;
/**
* The password for HTTP authentication.
*/
password?: string;
/**
* The data to be sent. It's automatically serialized in the right format
* depending on the method (with exception of HTML5 FormData), and put in
* the appropriate section of the request.
*/
data?: any;
/**
* Whether to run it in the background, i.e. true if it doesn't affect
* template rendering.
*/
background?: boolean;
unwrapSuccess?(data: any): any;
unwrapError?(data: any): any;
/**
* Set an initial value while the request is working, to populate the
* promise getter-setter.
*/
initialValue?: T;
/**
* An optional preprocessor function to unwrap a successful response, in
* case the response contains metadata wrapping the data.
*
* @param data The data to unwrap.
* @return The unwrapped result.
*/
unwrapSuccess?(data: any): T;
/**
* An optional preprocessor function to unwrap an unsuccessful response,
* in case the response contains metadata wrapping the data.
*
* @param data The data to unwrap.
* @return The unwrapped result.
*/
unwrapError?(data: any): T;
/**
* An optional function to serialize the data. This defaults to
* `JSON.stringify`.
*
* @param dataToSerialize The data to serialize.
* @return The serialized form as a string.
*/
serialize?(dataToSerialize: any): string;
/**
* An optional function to deserialize the data. This defaults to
* `JSON.parse`.
*
* @param dataToSerialize The data to parse.
* @return The parsed form.
*/
deserialize?(dataToDeserialize: string): any;
extract?(xhr: XMLHttpRequest, options: MithrilXHROptions): string;
type?(data: Object): void;
config?(xhr: XMLHttpRequest, options: MithrilXHROptions): XMLHttpRequest;
/**
* An optional function to extract the data from a raw XMLHttpRequest,
* useful if the relevant data is in a response header or the status
* field.
*
* @param xhr The associated XMLHttpRequest.
* @param options The options passed to this request.
* @return string The serialized format.
*/
extract?(xhr: XMLHttpRequest, options: MithrilXHROptions<T>): string;
/**
* The parsed data, or its children if it's an array, will be passed to
* this class constructor if it's given, to parse it into classes.
*
* @param data The data to parse.
* @return The new instance for the list.
*/
type?: new (data: Object) => any;
/**
* An optional function to run between `open` and `send`, useful for
* adding request headers or using XHR2 features such as the `upload`
* property. It is even possible to override the XHR altogether with a
* similar object, such as an XDomainRequest instance.
*
* @param xhr The associated XMLHttpRequest.
* @param options The options passed to this request.
* @return The new XMLHttpRequest, or nothing if the same one is kept.
*/
config?(xhr: XMLHttpRequest, options: MithrilXHROptions<T>): any;
/**
* For JSONP requests, this must be the string "jsonp". Otherwise, it's
* ignored.
*/
dataType?: string;
/**
* For JSONP requests, this is the query string key for the JSONP
* request. This is useful for APIs that don't use common conventions,
* such as `www.example.com/?jsonpCallback=doSomething`. It defaults to
* `callback` for JSONP requests, and is ignored for any other kind of
* request.
*/
callbackKey?: string;
}
}

277
mithril.js
View file

@ -1,9 +1,20 @@
var m = (function app(window, undefined) {
var OBJECT = "[object Object]", ARRAY = "[object Array]", STRING = "[object String]", FUNCTION = "function";
function isFunction(object) {
return typeof object === "function";
}
function isObject(object) {
return type.call(object) === "[object Object]";
}
function isString(object) {
return type.call(object) === "[object String]";
}
var isArray = Array.isArray || function (object) {
return type.call(object) === "[object Array]";
};
var type = {}.toString;
var parser = /(?:(^|#|\.)([^#\.\[\]]+))|(\[.+?\])/g, attrParser = /\[(.+?)(?:=("|'|)(.*?)\2)?\]/;
var voidElements = /^(AREA|BASE|BR|COL|COMMAND|EMBED|HR|IMG|INPUT|KEYGEN|LINK|META|PARAM|SOURCE|TRACK|WBR)$/;
var noop = function() {};
var noop = function () {};
// caching commonly used variables
var $document, $location, $requestAnimationFrame, $cancelAnimationFrame;
@ -32,16 +43,18 @@ var m = (function app(window, undefined) {
* @param {...mNode=[]} Zero or more Mithril child nodes. Can be an array, or splat (optional)
*
*/
function m() {
var args = [].slice.call(arguments);
if (type.call(args[0]) === OBJECT) return parameterize(args[0], args.slice(1));
var hasAttrs = args[1] != null && type.call(args[1]) === OBJECT && !("tag" in args[1] || "view" in args[1]) && !("subtree" in args[1]);
var attrs = hasAttrs ? args[1] : {};
function m(tag, pairs) {
for (var args = [], i = 1; i < arguments.length; i++) {
args[i - 1] = arguments[i];
}
if (isObject(tag)) return parameterize(tag, args);
var hasAttrs = pairs != null && isObject(pairs) && !("tag" in pairs || "view" in pairs || "subtree" in pairs);
var attrs = hasAttrs ? pairs : {};
var classAttrName = "class" in attrs ? "class" : "className";
var cell = {tag: "div", attrs: {}};
var match, classes = [];
if (type.call(args[0]) != STRING) throw new Error("selector in m(selector, attrs, children) should be a string");
while (match = parser.exec(args[0])) {
if (!isString(tag)) throw new Error("selector in m(selector, attrs, children) should be a string");
while (match = parser.exec(tag)) {
if (match[1] === "" && match[2]) cell.tag = match[2];
else if (match[1] === "#") cell.attrs.id = match[2];
else if (match[1] === ".") classes.push(match[2]);
@ -51,8 +64,8 @@ var m = (function app(window, undefined) {
}
}
var children = hasAttrs ? args.slice(2) : args.slice(1);
if (children.length === 1 && type.call(children[0]) === ARRAY) {
var children = hasAttrs ? args.slice(1) : args;
if (children.length === 1 && isArray(children[0])) {
cell.children = children[0];
}
else {
@ -68,10 +81,36 @@ var m = (function app(window, undefined) {
else cell.attrs[attrName] = attrs[attrName];
}
}
if (classes.length > 0) cell.attrs[classAttrName] = classes.join(" ");
if (classes.length) cell.attrs[classAttrName] = classes.join(" ");
return cell;
}
function forEach(list, f) {
for (var i = 0; i < list.length && !f(list[i], i++);) {}
}
function forKeys(list, f) {
forEach(list, function (attrs, i) {
return (attrs = attrs && attrs.attrs) && attrs.key != null && f(attrs, i);
});
}
// This function was causing deopts in Chrome.
function dataToString(data) {
//data.toString() might throw or return null if data is the return value of Console.log in Firefox (behavior depends on version)
try {
if (data == null || data.toString() == null) data = "";
} catch (e) {
data = "";
}
return data;
}
// This function was causing deopts in Chrome.
function injectTextNode(parentElement, first, index, data) {
try {
parentElement.insertBefore(first, parentElement.childNodes[index] || null);
first.nodeValue = data;
}
catch (e) {} //IE erroneously throws error when appending an empty text node after a null
}
function build(parentElement, parentTag, parentCache, parentIndex, data, cached, shouldReattach, index, editable, namespace, configs) {
//`build` is a recursive function that manages creation/diffing/removal of DOM elements based on comparison between `data` and `cached`
//the diff algorithm can be summarized as this:
@ -98,15 +137,13 @@ var m = (function app(window, undefined) {
//there's logic that relies on the assumption that null and undefined data are equivalent to empty strings
//- this prevents lifecycle surprises from procedural helpers that mix implicit and explicit return statements (e.g. function foo() {if (cond) return m("div")}
//- it simplifies diffing code
//data.toString() might throw or return null if data is the return value of Console.log in Firefox (behavior depends on version)
try { if (data == null || data.toString() == null) data = ""; } catch (e) { data = ""; }
data = dataToString(data);
if (data.subtree === "retain") return cached;
var cachedType = type.call(cached), dataType = type.call(data);
if (cached == null || cachedType !== dataType) {
if (cached == null || type.call(cached) !== type.call(data)) {
if (cached != null) {
if (parentCache && parentCache.nodes) {
var offset = index - parentIndex;
var end = offset + (dataType === ARRAY ? data : cached.nodes).length;
var end = offset + (isArray(data) ? data : cached.nodes).length;
clear(parentCache.nodes.slice(offset, end), parentCache.slice(offset, end));
}
else if (cached.nodes) clear(cached.nodes, cached);
@ -116,13 +153,12 @@ var m = (function app(window, undefined) {
cached.nodes = [];
}
if (dataType === ARRAY) {
if (isArray(data)) {
//recursively flatten array
for (var i = 0, len = data.length; i < len; i++) {
if (type.call(data[i]) === ARRAY) {
for (var i = 0; i < data.length; i++) {
if (isArray(data[i])) {
data = data.concat.apply([], data);
i--; //check current index again and flatten until there are no more nested arrays at that index
len = data.length;
}
}
@ -135,55 +171,51 @@ var m = (function app(window, undefined) {
//4) for each key, handle its corresponding action as marked in previous steps
var DELETION = 1, INSERTION = 2 , MOVE = 3;
var existing = {}, shouldMaintainIdentities = false;
for (var i = 0; i < cached.length; i++) {
if (cached[i] && cached[i].attrs && cached[i].attrs.key != null) {
shouldMaintainIdentities = true;
existing[cached[i].attrs.key] = {action: DELETION, index: i};
}
}
forKeys(cached, function (attrs, i) {
shouldMaintainIdentities = true;
existing[cached[i].attrs.key] = {action: DELETION, index: i};
});
var guid = 0;
for (var i = 0, len = data.length; i < len; i++) {
if (data[i] && data[i].attrs && data[i].attrs.key != null) {
for (var j = 0, len = data.length; j < len; j++) {
if (data[j] && data[j].attrs && data[j].attrs.key == null) data[j].attrs.key = "__mithril__" + guid++;
forKeys(data, function () {
forEach(data, function (attrs) {
if ((attrs = attrs && attrs.attrs) && attrs.key == null) {
attrs.key = "__mithril__" + guid++;
}
break;
}
}
});
return 1;
});
if (shouldMaintainIdentities) {
var keysDiffer = false;
if (data.length != cached.length) keysDiffer = true;
else for (var i = 0, cachedCell, dataCell; cachedCell = cached[i], dataCell = data[i]; i++) {
if (cachedCell.attrs && dataCell.attrs && cachedCell.attrs.key != dataCell.attrs.key) {
keysDiffer = true;
break;
}
var keysDiffer = data.length != cached.length;
if (!keysDiffer) {
forKeys(data, function (attrs, i) {
var cachedCell = cached[i];
return keysDiffer = cachedCell && cachedCell.attrs && cachedCell.attrs.key != attrs.key;
});
}
if (keysDiffer) {
for (var i = 0, len = data.length; i < len; i++) {
if (data[i] && data[i].attrs) {
if (data[i].attrs.key != null) {
var key = data[i].attrs.key;
if (!existing[key]) existing[key] = {action: INSERTION, index: i};
else existing[key] = {
action: MOVE,
index: i,
from: existing[key].index,
element: cached.nodes[existing[key].index] || $document.createElement("div")
};
}
forKeys(data, function (attrs, i) {
var key = attrs.key;
if (existing[key]) {
existing[key] = {
action: MOVE,
index: i,
from: existing[key].index,
element: cached.nodes[existing[key].index] || $document.createElement("div")
};
} else {
existing[key] = {action: INSERTION, index: i};
}
}
});
var actions = [];
for (var prop in existing) actions.push(existing[prop]);
var changes = actions.sort(sortChanges);
var newCached = new Array(cached.length);
newCached.nodes = cached.nodes.slice();
for (var i = 0, change; change = changes[i]; i++) {
forEach(changes, function (change) {
if (change.action === DELETION) {
clear(cached[change.index].nodes, cached[change.index]);
newCached.splice(change.index, 1);
@ -203,43 +235,46 @@ var m = (function app(window, undefined) {
newCached[change.index] = cached[change.from];
newCached.nodes[change.index] = change.element;
}
}
});
cached = newCached;
}
}
//end key algorithm
for (var i = 0, cacheCount = 0, len = data.length; i < len; i++) {
var cacheCount = 0;
forEach(data, function (entry) {
//diff each item in the array
var item = build(parentElement, parentTag, cached, index, data[i], cached[cacheCount], shouldReattach, index + subArrayCount || subArrayCount, editable, namespace, configs);
if (item === undefined) continue;
if (!item.nodes.intact) intact = false;
if (item.$trusted) {
//fix offset of next element if item was a trusted string w/ more than one html element
//the first clause in the regexp matches elements
//the second clause (after the pipe) matches text nodes
subArrayCount += (item.match(/<[^\/]|\>\s*[^<]/g) || [0]).length;
var item = build(parentElement, parentTag, cached, index, entry, cached[cacheCount], shouldReattach, index + subArrayCount || subArrayCount, editable, namespace, configs);
if (item !== undefined) {
if (!item.nodes.intact) intact = false;
if (item.$trusted) {
//fix offset of next element if item was a trusted string w/ more than one html element
//the first clause in the regexp matches elements
//the second clause (after the pipe) matches text nodes
subArrayCount += (item.match(/<[^\/]|\>\s*[^<]/g) || [0]).length;
}
else subArrayCount += isArray(item) ? item.length : 1;
cached[cacheCount++] = item;
}
else subArrayCount += type.call(item) === ARRAY ? item.length : 1;
cached[cacheCount++] = item;
}
});
if (!intact) {
//diff the array itself
//update the list of DOM nodes by collecting the nodes from each item
for (var i = 0, len = data.length; i < len; i++) {
forEach(data, function (_, i) {
if (cached[i] != null) nodes.push.apply(nodes, cached[i].nodes);
}
});
//remove items from the end of the array if the new array is shorter than the old one
//if errors ever happen here, the issue is most likely a bug in the construction of the `cached` data structure somewhere earlier in the program
for (var i = 0, node; node = cached.nodes[i]; i++) {
forEach(cached.nodes, function (node, i) {
if (node.parentNode != null && nodes.indexOf(node) < 0) clear([node], [cached[i]]);
}
});
if (data.length < cached.length) cached.length = data.length;
cached.nodes = nodes;
}
}
else if (data != null && dataType === OBJECT) {
else if (data != null && isObject(data)) {
var views = [], controllers = [];
while (data.view) {
var view = data.view.$original || data.view;
@ -265,14 +300,14 @@ var m = (function app(window, undefined) {
//if an element is different enough from the one in cache, recreate it
if (data.tag != cached.tag || dataAttrKeys.sort().join() != Object.keys(cached.attrs).sort().join() || data.attrs.id != cached.attrs.id || data.attrs.key != cached.attrs.key || (m.redraw.strategy() == "all" && (!cached.configContext || cached.configContext.retain !== true)) || (m.redraw.strategy() == "diff" && cached.configContext && cached.configContext.retain === false)) {
if (cached.nodes.length) clear(cached.nodes);
if (cached.configContext && typeof cached.configContext.onunload === FUNCTION) cached.configContext.onunload();
if (cached.configContext && isFunction(cached.configContext.onunload)) cached.configContext.onunload();
if (cached.controllers) {
for (var i = 0, controller; controller = cached.controllers[i]; i++) {
if (typeof controller.onunload === FUNCTION) controller.onunload({preventDefault: noop});
if (isFunction(controller.onunload)) controller.onunload({preventDefault: noop});
}
}
}
if (type.call(data.tag) != STRING) return;
if (!isString(data.tag)) return;
var node, isNew = cached.nodes.length === 0;
if (data.attrs.xmlns) namespace = data.attrs.xmlns;
@ -321,7 +356,7 @@ var m = (function app(window, undefined) {
if (shouldReattach === true && node != null) parentElement.insertBefore(node, parentElement.childNodes[index] || null);
}
//schedule configs to be called. They are called after `build` finishes running
if (typeof data.attrs["config"] === FUNCTION) {
if (isFunction(data.attrs["config"])) {
var context = cached.configContext = cached.configContext || {};
// bind
@ -333,7 +368,7 @@ var m = (function app(window, undefined) {
configs.push(callback(data, [node, !isNew, context, cached]));
}
}
else if (typeof data != FUNCTION) {
else if (!isFunction(data)) {
//handle text nodes
var nodes;
if (cached.nodes.length === 0) {
@ -364,11 +399,7 @@ var m = (function app(window, undefined) {
clear(cached.nodes, cached);
nodes = [$document.createTextNode(data)];
}
try {
parentElement.insertBefore(nodes[0], parentElement.childNodes[index] || null);
nodes[0].nodeValue = data;
}
catch (e) {} //IE erroneously throws error when appending an empty text node after a null
injectTextNode(parentElement, nodes[0], index, data)
}
}
}
@ -391,11 +422,11 @@ var m = (function app(window, undefined) {
//`config` isn't a real attributes, so ignore it
if (attrName === "config" || attrName == "key") continue;
//hook event handlers to the auto-redrawing system
else if (typeof dataAttr === FUNCTION && attrName.indexOf("on") === 0) {
else if (isFunction(dataAttr) && attrName.indexOf("on") === 0) {
node[attrName] = autoredraw(dataAttr, node);
}
//handle `style: {...}`
else if (attrName === "style" && dataAttr != null && type.call(dataAttr) === OBJECT) {
else if (attrName === "style" && dataAttr != null && isObject(dataAttr)) {
for (var rule in dataAttr) {
if (cachedAttr == null || cachedAttr[rule] !== dataAttr[rule]) node.style[rule] = dataAttr[rule];
}
@ -442,17 +473,17 @@ var m = (function app(window, undefined) {
if (nodes.length != 0) nodes.length = 0;
}
function unload(cached) {
if (cached.configContext && typeof cached.configContext.onunload === FUNCTION) {
if (cached.configContext && isFunction(cached.configContext.onunload)) {
cached.configContext.onunload();
cached.configContext.onunload = null;
}
if (cached.controllers) {
for (var i = 0, controller; controller = cached.controllers[i]; i++) {
if (typeof controller.onunload === FUNCTION) controller.onunload({preventDefault: noop});
if (isFunction(controller.onunload)) controller.onunload({preventDefault: noop});
}
}
if (cached.children) {
if (type.call(cached.children) === ARRAY) {
if (isArray(cached.children)) {
for (var i = 0, child; child = cached.children[i]; i++) unload(child);
}
else if (cached.children.tag) unload(cached.children);
@ -544,7 +575,7 @@ var m = (function app(window, undefined) {
m.prop = function (store) {
//note: using non-strict equality check here because we're checking if store is null OR undefined
if (((store != null && type.call(store) === OBJECT) || typeof store === FUNCTION) && typeof store.then === FUNCTION) {
if ((store != null && isObject(store) || isFunction(store)) && isFunction(store.then)) {
return propify(store);
}
@ -559,7 +590,7 @@ var m = (function app(window, undefined) {
};
if (component.controller) controller.prototype = component.controller.prototype
var view = function(ctrl) {
if (arguments.length > 1) args = args.concat([].slice.call(arguments, 1));
for (var i = 1; i < arguments.length; i++) args.push(arguments[i]);
return component.view.apply(component, args ? [ctrl].concat(args) : [ctrl]);
};
view.$original = component.view;
@ -568,7 +599,8 @@ var m = (function app(window, undefined) {
return output;
}
m.component = function(component) {
return parameterize(component, [].slice.call(arguments, 1));
for (var args = [], i = 1; i < arguments.length; i++) args[i - 1] = arguments[i];
return parameterize(component, args);
};
m.mount = m.module = function(root, component) {
if (!root) throw new Error("Please ensure the DOM element exists before rendering a template into it.");
@ -589,7 +621,7 @@ var m = (function app(window, undefined) {
}
else unloaders = [];
if (controllers[index] && typeof controllers[index].onunload === FUNCTION) {
if (controllers[index] && isFunction(controllers[index].onunload)) {
controllers[index].onunload(event);
}
@ -598,7 +630,7 @@ var m = (function app(window, undefined) {
m.startComputation();
roots[index] = root;
if (arguments.length > 2) component = subcomponent(component, [].slice.call(arguments, 2));
var currentComponent = topComponent = component = component || {controller: function() {}};
var currentComponent = topComponent = component = component || {controller: noop};
var constructor = component.controller || noop;
var controller = new constructor;
//controllers may call m.mount recursively (via m.route redirects, for example)
@ -619,7 +651,7 @@ var m = (function app(window, undefined) {
try {
//lastRedrawId is a positive number if a second redraw is requested before the next animation frame
//lastRedrawID is null if it's the first redraw and not an event handler
if (lastRedrawId && force !== true) {
if (lastRedrawId && !force) {
//when setTimeout: only reschedule redraw if time between now and previous redraw is bigger than a frame, otherwise keep currently scheduled timeout
//when rAF: always reschedule redraw
if ($requestAnimationFrame === window.requestAnimationFrame || new Date - lastRedrawCallTime > FRAME_BUDGET) {
@ -683,18 +715,17 @@ var m = (function app(window, undefined) {
//routing
var modes = {pathname: "", hash: "#", search: "?"};
var redirect = noop, routeParams, currentRoute, isDefaultRoute = false;
m.route = function() {
m.route = function(root, arg1, arg2, vdom) {
//m.route()
if (arguments.length === 0) return currentRoute;
//m.route(el, defaultRoute, routes)
else if (arguments.length === 3 && type.call(arguments[1]) === STRING) {
var root = arguments[0], defaultRoute = arguments[1], router = arguments[2];
else if (arguments.length === 3 && isString(arg1)) {
redirect = function(source) {
var path = currentRoute = normalizeRoute(source);
if (!routeByValue(root, router, path)) {
if (!routeByValue(root, arg2, path)) {
if (isDefaultRoute) throw new Error("Ensure the default route matches one of the routes defined in m.route");
isDefaultRoute = true;
m.route(defaultRoute, true);
m.route(arg1, true);
isDefaultRoute = false;
}
};
@ -710,32 +741,30 @@ var m = (function app(window, undefined) {
window[listener]();
}
//config: m.route
else if (arguments[0].addEventListener || arguments[0].attachEvent) {
var element = arguments[0];
var vdom = arguments[3];
element.href = (m.route.mode !== 'pathname' ? $location.pathname : '') + modes[m.route.mode] + vdom.attrs.href;
if (element.addEventListener) {
element.removeEventListener("click", routeUnobtrusive);
element.addEventListener("click", routeUnobtrusive);
else if (root.addEventListener || root.attachEvent) {
root.href = (m.route.mode !== 'pathname' ? $location.pathname : '') + modes[m.route.mode] + vdom.attrs.href;
if (root.addEventListener) {
root.removeEventListener("click", routeUnobtrusive);
root.addEventListener("click", routeUnobtrusive);
}
else {
element.detachEvent("onclick", routeUnobtrusive);
element.attachEvent("onclick", routeUnobtrusive);
root.detachEvent("onclick", routeUnobtrusive);
root.attachEvent("onclick", routeUnobtrusive);
}
}
//m.route(route, params, shouldReplaceHistoryEntry)
else if (type.call(arguments[0]) === STRING) {
else if (isString(root)) {
var oldRoute = currentRoute;
currentRoute = arguments[0];
var args = arguments[1] || {};
currentRoute = root;
arg1 || {};
var queryIndex = currentRoute.indexOf("?");
var params = queryIndex > -1 ? parseQueryString(currentRoute.slice(queryIndex + 1)) : {};
for (var i in args) params[i] = args[i];
for (var i in arg1) params[i] = arg1[i];
var querystring = buildQueryString(params);
var currentPath = queryIndex > -1 ? currentRoute.slice(0, queryIndex) : currentRoute;
if (querystring) currentRoute = currentPath + (currentPath.indexOf("?") === -1 ? "?" : "&") + querystring;
var shouldReplaceHistoryEntry = (arguments.length === 3 ? arguments[2] : arguments[1]) === true || oldRoute === arguments[0];
var shouldReplaceHistoryEntry = (arguments.length === 3 ? arg2 : arg1) === true || oldRoute === root;
if (window.history.pushState) {
computePreRedrawHook = setScroll;
@ -817,8 +846,8 @@ var m = (function app(window, undefined) {
var value = object[prop];
var valueType = type.call(value);
var pair = (value === null) ? encodeURIComponent(key) :
valueType === OBJECT ? buildQueryString(value, key) :
valueType === ARRAY ? value.reduce(function(memo, item) {
isObject(value) ? buildQueryString(value, key) :
isArray(value) ? value.reduce(function(memo, item) {
if (!duplicates[key]) duplicates[key] = {};
if (!duplicates[key][item]) {
duplicates[key][item] = true;
@ -840,7 +869,7 @@ var m = (function app(window, undefined) {
var key = decodeURIComponent(pair[0]);
var value = pair.length == 2 ? decodeURIComponent(pair[1]) : null;
if (params[key] != null) {
if (type.call(params[key]) !== ARRAY) params[key] = [params[key]];
if (!isArray(params[key])) params[key] = [params[key]];
params[key].push(value);
}
else params[key] = value;
@ -922,7 +951,7 @@ var m = (function app(window, undefined) {
}
function thennable(then, successCallback, failureCallback, notThennableCallback) {
if (((promiseValue != null && type.call(promiseValue) === OBJECT) || typeof promiseValue === FUNCTION) && typeof then === FUNCTION) {
if (((promiseValue != null && isObject(promiseValue)) || isFunction(promiseValue)) && isFunction(then)) {
try {
// count protects against abuse calls from spec checker
var count = 0;
@ -966,10 +995,10 @@ var m = (function app(window, undefined) {
fire();
}, function() {
try {
if (state === RESOLVING && typeof successCallback === FUNCTION) {
if (state === RESOLVING && isFunction(successCallback)) {
promiseValue = successCallback(promiseValue);
}
else if (state === REJECTING && typeof failureCallback === FUNCTION) {
else if (state === REJECTING && isFunction(failureCallback)) {
promiseValue = failureCallback(promiseValue);
state = RESOLVING;
}
@ -1086,13 +1115,13 @@ var m = (function app(window, undefined) {
if (options.deserialize === JSON.parse) {
xhr.setRequestHeader("Accept", "application/json, text/*");
}
if (typeof options.config === FUNCTION) {
if (isFunction(options.config)) {
var maybeXhr = options.config(xhr, options);
if (maybeXhr != null) xhr = maybeXhr;
}
var data = options.method === "GET" || !options.data ? "" : options.data;
if (data && (type.call(data) != STRING && data.constructor != window.FormData)) {
if (data && (!isString(data) && data.constructor != window.FormData)) {
throw "Request data should be either be a string or FormData. Check the `serialize` option in `m.request`";
}
xhr.send(data);
@ -1138,8 +1167,10 @@ var m = (function app(window, undefined) {
var unwrap = (e.type === "load" ? xhrOptions.unwrapSuccess : xhrOptions.unwrapError) || identity;
var response = unwrap(deserialize(extract(e.target, xhrOptions)), e.target);
if (e.type === "load") {
if (type.call(response) === ARRAY && xhrOptions.type) {
for (var i = 0; i < response.length; i++) response[i] = new xhrOptions.type(response[i]);
if (isArray(response) && xhrOptions.type) {
forEach(response, function (res, i) {
response[i] = new xhrOptions.type(res);
});
}
else if (xhrOptions.type) response = new xhrOptions.type(response);
}

2
mithril.min.js vendored
View file

File diff suppressed because one or more lines are too long

2
mithril.min.js.map
View file

File diff suppressed because one or more lines are too long

110
modulator-test.html
View file

@ -7,10 +7,10 @@ var mod = ( function initModulator(){
var Map = shim;
var WeakMap = shim;
}
// Garbage collection flag
mod.cleanup = true;
// Registry of instantiation contexts
var contexts = new WeakMap();
// All automated counts
@ -20,36 +20,36 @@ var mod = ( function initModulator(){
var snapRedraw = m.redraw;
var redraw;
var forced;
for( var key in m.redraw ){
queueRedraw[ key ] = snapRedraw[ key ] = m.redraw[ key ];
}
return function pause(){
m.redraw = queueRedraw;
setTimeout( function unpause(){
m.redraw = snapRedraw;
if( redraw ) m.redraw( forced );
redraw = forced = false;
} );
}
function queueRedraw( force ){
redraw = true;
if( force ) forced = true;
}
}() );
var unique = {};
// Clear counts at the begninning of every redraw
m.module( document.createElement( 'x' ), {
view : counts.clear.bind( counts )
} );
// Shorthand for a component which will always return the same instance
mod.unique = function( component ){
return mod( component, unique, unique );
@ -58,80 +58,80 @@ var mod = ( function initModulator(){
mod.global = function( x ){
return mod( x, unique );
};
// Extend controllers with extra utility functions
mod.extend = true;
return mod;
function mod( component, context, key ){
// Stand in for m.module, eg mod( document.body, component, context );
if( component instanceof HTMLElement ){
// Stand in for m.route
if( !component.controller && !component.view ){
var routes = {};
for( var route in context ){
routes[ route ].controller = mod.unique( {
controller : context[ route ].controller || noop
} ).bind();
}
return m.route( component, routes );
}
return m.module( component, mod.apply( undefined, [].slice.call( arguments, 1 ) ) )();
}
var components = register( contexts, context || unique, WeakMap );
var keys = register( components, component, WeakMap );
return function identify( key ){
var count = key === undefined && register( counts, keys, m.prop.bind( undefined, 0 ) );
// eg. ctrl.mod( profile ).mapWith( users(), 'username' );
apply.mapWith = function( collection ){
var path = [].slice.call( arguments, 1 );
return Object.keys( collection ).map( function getItemIdentifier( index ){
var key;
if( path.length ){
key = path.reduce( function getKeyValue( source, segment ){
var node = source[ segment ];
if( node instanceof Function ) node = node.call( source );
return node;
}, collection[ index ] );
}
else {
key = index;
}
return identify( key )( collection[ index ] );
} );
};
return apply;
function apply(){
var args = [].slice.call( arguments );
var view;
if( count ){
key = count( count() + 1 );
}
var ctrl = register( keys, key, function newController(){
pauseRedraw();
var controller = component.controller || noop;
var instance = new ( controller.bind.apply( controller, [ controller ].concat( args ) ) )();
if( mod.cleanup ){
garbageCollect( instance );
}
if( mod.extend ){
// Shorthand for instantiatin sub-modules
instance.mod = function( component, key ){
@ -145,14 +145,14 @@ var mod = ( function initModulator(){
instance.refresh = function(){
args = [].slice.call( arguments );
ctrl = register( keys, key, newController, true );
return m.redraw;
};
}
return instance;
} );
// Return the controller instance if the component is view-less.
if( component.view ){
if( args.length ){
@ -161,31 +161,31 @@ var mod = ( function initModulator(){
else {
view = component.view( ctrl );
}
if( view instanceof Object ){
view.ctrl = ctrl;
}
return view;
}
return ctrl;
}
}( key );
// Performance: when controllers succesfully unload, destroy their associated maps
function garbageCollect( ctrl ){
onunload = ctrl.onunload;
if( onunload === teardown ){
return;
}
ctrl.onunload = teardown;
function teardown( e ){
var go = true;
if( onunload ){
onunload( {
preventDefault : function(){
@ -193,39 +193,39 @@ var mod = ( function initModulator(){
}
} );
}
if( go ){
contexts.delete( context );
}
}
}
}
// Convenience map method: retrieve key from map. If it's not registered, set it first with Constructor.
function register( map, key, Constructor, force ){
return !force && map.has( key ) ? map.get( key ) : map.set( key, new Constructor() ).get( key );
}
function shim(){
var keys = [];
var values = [];
var map = {
get : function( key ){
var index = keys.indexOf( key );
return values[ index ];
},
has : function( key ){
var index = keys.indexOf( key );
return index > -1;
},
set : function( key, value ){
var index = map.has( key ) ? keys.indexOf( key ) : keys.length;
keys[ index ] = key;
values[ index ] = value;
return map;
},
clear : function(){
@ -234,21 +234,21 @@ var mod = ( function initModulator(){
},
delete : function( key ){
var index = keys.indexOf( key );
if( index > -1 ){
keys.splice( index, 1 );
values.splice( index, 1 );
return true;
}
return false;
}
};
return map;
}
function noop(){}
}() );
</script>
@ -271,4 +271,4 @@ b.view = function(ctrl, count) {
return m("li", count)
}
m.module(document.body, a)</script>
m.module(document.body, a)</script>