mirror of https://github.com/sveltejs/svelte
parent
d0c0fbcef4
commit
8ccad1f107
@ -0,0 +1,118 @@
|
||||
import { noop } from './utils.js';
|
||||
|
||||
export function linear ( t ) {
|
||||
return t;
|
||||
}
|
||||
|
||||
export function wrapTransition ( node, fn, params, isIntro ) {
|
||||
var obj = fn( node, params, isIntro );
|
||||
|
||||
var start = window.performance.now() + ( obj.delay || 0 );
|
||||
var duration = obj.duration || 300;
|
||||
var end = start + duration;
|
||||
var ease = obj.easing || linear;
|
||||
|
||||
if ( obj.tick ) {
|
||||
// JS transition
|
||||
if ( isIntro ) obj.tick( 0 );
|
||||
|
||||
return {
|
||||
start: start,
|
||||
end: end,
|
||||
update: function ( now ) {
|
||||
obj.tick( ease( ( now - start ) / duration ) );
|
||||
},
|
||||
done: function () {
|
||||
obj.tick( isIntro ? 1 : 0 );
|
||||
},
|
||||
abort: noop
|
||||
};
|
||||
} else {
|
||||
// CSS transition
|
||||
var started = false;
|
||||
var inlineStyles = {};
|
||||
var computedStyles = getComputedStyle( node );
|
||||
|
||||
return {
|
||||
start: start,
|
||||
end: end,
|
||||
init: function () {
|
||||
for ( var key in obj.styles ) {
|
||||
inlineStyles[ key ] = node.style[ key ];
|
||||
node.style[ key ] = isIntro ? obj.styles[ key ] : computedStyles[ key ];
|
||||
}
|
||||
},
|
||||
update: function ( now ) {
|
||||
if ( !started ) {
|
||||
var keys = Object.keys( obj.styles );
|
||||
div.style.transition = keys.map( function ( key ) {
|
||||
return key + ' ' + d;
|
||||
}).join( ', ' );
|
||||
|
||||
// TODO use a keyframe animation for custom easing functions
|
||||
|
||||
for ( var key in obj.styles ) {
|
||||
node.style[ key ] = isIntro ? computedStyles[ key ] : obj.styles[ key ];
|
||||
}
|
||||
|
||||
started = true;
|
||||
}
|
||||
},
|
||||
done: function () {
|
||||
// TODO what if one of these styles was dynamic?
|
||||
if ( isIntro ) {
|
||||
for ( var key in obj.styles ) {
|
||||
node.style[ key ] = inlineStyles[ key ];
|
||||
}
|
||||
}
|
||||
},
|
||||
abort: function () {
|
||||
node.style.cssText = getComputedStyle( node ).cssText;
|
||||
}
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
export var transitionManager = {
|
||||
running: false,
|
||||
transitions: [],
|
||||
|
||||
add: function ( transition ) {
|
||||
transitionManager.transitions.push( transition );
|
||||
|
||||
if ( !this.running ) {
|
||||
this.running = true;
|
||||
this.next();
|
||||
}
|
||||
},
|
||||
|
||||
remove: function ( transitions ) {
|
||||
var i = transitions.length;
|
||||
while ( i-- ) {
|
||||
var index = this.transitions.indexOf( transitions[i] );
|
||||
if ( ~index ) this.transitions.splice( index, 1 );
|
||||
}
|
||||
},
|
||||
|
||||
next: function () {
|
||||
transitionManager.running = false;
|
||||
|
||||
var now = window.performance.now();
|
||||
var i = transitionManager.transitions.length;
|
||||
|
||||
while ( i-- ) {
|
||||
var transition = transitionManager.transitions[i];
|
||||
if ( now >= transition.end ) {
|
||||
transition.done();
|
||||
transitionManager.transitions.splice( i, 1 );
|
||||
} else {
|
||||
if ( now > transition.start ) transition.update( now );
|
||||
transitionManager.running = true;
|
||||
}
|
||||
}
|
||||
|
||||
if ( transitionManager.running ) {
|
||||
requestAnimationFrame( transitionManager.next );
|
||||
}
|
||||
}
|
||||
};
|
@ -0,0 +1,10 @@
|
||||
export function noop () {}
|
||||
|
||||
export function assign ( target ) {
|
||||
for ( var i = 1; i < arguments.length; i += 1 ) {
|
||||
var source = arguments[i];
|
||||
for ( var k in source ) target[k] = source[k];
|
||||
}
|
||||
|
||||
return target;
|
||||
}
|
@ -0,0 +1,44 @@
|
||||
import deindent from './deindent.js';
|
||||
|
||||
export default function toSource ( thing ) {
|
||||
if ( typeof thing === 'function' ) {
|
||||
return normaliseIndentation( thing.toString() );
|
||||
}
|
||||
|
||||
if ( Array.isArray( thing ) ) {
|
||||
if ( thing.length === 0 ) return '[]';
|
||||
throw new Error( 'TODO' ); // not currently needed
|
||||
}
|
||||
|
||||
if ( thing && typeof thing === 'object' ) {
|
||||
const keys = Object.keys( thing );
|
||||
if ( keys.length === 0 ) return '{}';
|
||||
|
||||
const props = keys.map( key => `${key}: ${toSource( thing[ key ] )}` ).join( ',\n' );
|
||||
return deindent`
|
||||
{
|
||||
${props}
|
||||
}
|
||||
`;
|
||||
}
|
||||
|
||||
return JSON.stringify( thing );
|
||||
}
|
||||
|
||||
function normaliseIndentation ( str ) {
|
||||
const lines = str.split( '\n' ).slice( 1, -1 );
|
||||
let minIndentation = Infinity;
|
||||
|
||||
lines.forEach( line => {
|
||||
if ( !/\S/.test( line ) ) return;
|
||||
const indentation = /^\t*/.exec( line )[0].length;
|
||||
if ( indentation < minIndentation ) minIndentation = indentation;
|
||||
});
|
||||
|
||||
if ( minIndentation !== Infinity && minIndentation !== 1 ) {
|
||||
const pattern = new RegExp( `^\\t{${minIndentation - 1}}`, 'gm' );
|
||||
return str.replace( pattern, '' );
|
||||
}
|
||||
|
||||
return str;
|
||||
}
|
Loading…
Reference in new issue