Utils
It is avaialable as a property of Framework7 class (Framework7.utils
) and same property on initialized app instance (app.utils
):
app.utils.parseUrlQuery(url)- parse url query get parameters
- url - string - url with GET parameters. Required.
Method returns object with query parameters
var query = app.utils.parseUrlQuery('http://google.com/?id=5&foo=bar');
console.log(query); // { id: 5, foo: 'bar' }
serializeObject
app.utils.serializeObject(object)- Create a serialized representation of a plain object suitable for use in a URL query string
- object - object - Object to serialize
returns a new unique array
var params = { foo: 'bar', id: 5 };
console.log(app.utils.serializeObject(params)); // 'foo=bar&id=5'
requestAnimationFrame
- callback - function - function to call when it’s time to update your animation for the next repaint
returns animation request id, that uniquely identifies the entry in the callback list
var animId;
function anim() {
var left = parseInt($$('#anim').css('left'), 10) + 1;
$$('#anim').css({left: left + 'px'})
animId = app.utils.requestAnimationFrame(anim);
}
animId = app.utils.requestAnimationFrame(anim);
app.utils.cancelAnimationFrame(requestID)- Cancels an animation frame request
- requestID - number - The ID value returned by the call to app.utils.requestAnimationFrame() that requested the callback
app.utils.cancelAnimationFrame(animId);
removeDiacritics
app.utils.removeDiacritics(text)- Replace diacritics in specified text string with standard latin characters
- text - string - Text string
nextFrame
app.utils.nextFrame(callback)- Executes code on next available animation frame.
- callback - string - function to call when it’s time to update your animation for the next repaint.
// do something on next frame
});
app.utils.nextTick(callback, delay)- executes code after required delay. Basically alias for setTimeout
- callback - string - function to call after specified delay
- delay - number - delay in ms. Optional, by deault is
0
app.utils.nextTick(function() {
// do something on next tick
});
now
app.utils.now()- returns current timestamp in ms
var now = app.utils.now();
setTimeout(function () {
console.log(timeDiff + 'ms past');
}, 2000);
extend
app.utils.extend(target, …from)- extends target
object with properties and methods from from
objects
- target - object - target object to extend
- from - object - objects to copy properties and methods from
returns target object with extended properties and methods
This method becomes very handy if you need to extend one object with properties of others or when you need a deep copy of an object.
var a = {
apple: 0,
cherry: 97
};
// Pass as empty object as target to copy a into b
var b = app.utils.extend({}, a);
console.log(b); // { apple: 0, cherry: 97 }
console.log(a === b); // false
var a = {
apple: 0,
cherry: 97
};
var b = {
banana: 10,
pineapple: 20,
// Create new object c from the merge of a and b
var c = app.utils.extend({}, a, b);
console.log(c); // { apple: 0, cherry: 97, banana: 10, pineapple: 20 }
var a = {
apple: 0,
cherry: 97
};
var b = {
apple: 10,
pineapple: 20,
}
// Extend a with b
app.utils.extend(a, b);
console.log(a); // { apple: 10, cherry: 97, pineapple: 20 }
app.utils.uniqueNumber()- returns unique number, increased by 1 with every call
app.utils.uniqueNumber(); // -> 2
app.utils.uniqueNumber(); // -> 3
app.utils.uniqueNumber(); // -> 4
id
- mask - string - ID string mask, by default is
xxxxxxxxxx
- map - string - characters that will be used for generation, by default is
0123456789abcdef
returns randomly generated string
app.utils.id() // -> ffe28ab56e
app.utils.id('xxxx-xxxx-xxxx-xxxx') // -> 1ea3-f127-dc67-627d
app.utils.id('xxxx-xxxx', 'abcd') // -> aabc-ccda