libj-core
v2.0.1
Published
``` npm i libj-core ```
Downloads
10
Readme
libj-core
Installation
npm i libj-core
NPM
import { <some modules> } 'libj-core';
Browser
<script src="path to libj-core.min.js or libj-core.js"></script>
//Then all exports are under libjcore
global variable
<script>
libjcore.guid or libjcore.browserFileApiSupport or ....
</script>
Test
Showcase
- Run this in a separate command line to start node server
node server.js
- Run one of the following to re-create bundles
npm run dev
npm run dev:watch
- Navigate to http://localhost:3000
Build
npm run build
npm run build:watch
Modules:
GUID (UUID V4)
Helps you create unique ids like C# Guid type.
Browser support: IE9+
Usage
import { guid } from 'libj-core'
var guidWithoutHyphen = guid.create();
//aaaaaaaa-bbbb-cccc-dddd-eeeeeeeeeeee
var guidWithHyphen = guid.create(true);
//aaaaaaaabbbbccccddddeeeeeeeeeeee
var emptyGuid = guid.empty();
//00000000-0000-0000-0000-000000000000
var emptyGuidNoHyphen = guid.emptyNoHyphen();
//00000000000000000000000000000000
var id = guid.newId();
//e_aaaaaaaabbbbccccddddeeeeeeeeeeee
BrowserFileApiSupport
Checks browser support for File api
Browser support: IE9+
Usage
import { browserFileApiSupport } from 'libj-core'
console.log(`file api: ${browserFileApiSupport.supportsFileApi()}`)
console.log(`file input: ${browserFileApiSupport.supportsFileInput()}`);
In-browser database
Browser support: IE9+
Usage
import { db } from 'libj-core'
db.set('key', 'value')
db.get('key') // returns 'value'
.
.
.
Countries and flagsPath
Copy flags folder somewhere on your server
Adds flagsPath
and countries
variables (see usage) to window.libj
namespace.
Browser support: IE9+
Usage
import { countryHelper } from 'libj-core'
countryHelper.setOptions({
flagsPath: '/flags' //or some other directory which contains flags svgs
})
countryHelper.getFlagsPath()
// returns '/flags'
countryHelper.getCountries()
// returns an object with keys like "en", "fa", "ar", "fr", ... and values like array of this:
{
"code":"AD",
"name":"Andorra"
}
Search objects
This is used to search in objects' properties
Browser support: IE9+
Usage
import { searchObjects } from 'libj-core'
var list = [
{ name: 'ali', family: 'farahi' },
{ name: 'monir', family: 'marahi' },
{ name: 'hasan', family: 'farahmanesh' },
]
it('all properties', function () {
var res = searchObjects('arahi', list)
assert.deepEqual(res, [
{ name: 'ali', family: 'farahi' },
{ name: 'monir', family: 'marahi' },
])
})
it('name with no results : arahi', function () {
var res = searchObjects('arahi', list, ['name'])
assert.deepEqual(res, [])
})
it('family: arahi', function () {
var res = searchObjects('arahi', list, ['family'])
assert.deepEqual(res, [
{ name: 'ali', family: 'farahi' },
{ name: 'monir', family: 'marahi' },
])
})
it('family : farah', function () {
var res = searchObjects('farah', list, ['family'])
assert.deepEqual(res, [
{ name: 'ali', family: 'farahi' },
{ name: 'hasan', family: 'farahmanesh' },
])
})
Sort objects
This is used to sort objects
Browser support: IE9+
Usage
import { sortObjects } from 'libj-core'
var list = [
{ id: 1, name: 'reza', parentId: 0 },
{ id: 2, name: 'ali', parentId: 1 },
{ id: 3, name: 'hasan', parentId: 1 },
{ id: 4, name: 'mehdi', parentId: 1 },
{ id: 5, name: 'ahmad', parentId: 1 },
{ id: 6, name: 'saeid', parentId: 1 },
{ id: 7, name: 'masoud', parentId: 1 },
{ id: 10, name: 'mahbod', parentId: 3 },
{ id: 11, name: 'bardiya', parentId: 4 },
{ id: 12, name: 'mahdiyar', parentId: 5 },
{ id: 13, name: 'alireza', parentId: 5 },
{ id: 8, name: 'niyayesh', parentId: 2 },
{ id: 9, name: 'amir hosein', parentId: 2 },
];
var k = sortObjects(list, [
{
column: 'parentId',
ascending: true
},
{
column: 'id',
ascending: false
}
])
assert.deepEqual(
[
{ id: 1, name: 'reza', parentId: 0 },
{ id: 7, name: 'masoud', parentId: 1 },
{ id: 6, name: 'saeid', parentId: 1 },
{ id: 5, name: 'ahmad', parentId: 1 },
{ id: 4, name: 'mehdi', parentId: 1 },
{ id: 3, name: 'hasan', parentId: 1 },
{ id: 2, name: 'ali', parentId: 1 },
{ id: 9, name: 'amir hosein', parentId: 2 },
{ id: 8, name: 'niyayesh', parentId: 2 },
{ id: 10, name: 'mahbod', parentId: 3 },
{ id: 11, name: 'bardiya', parentId: 4 },
{ id: 13, name: 'alireza', parentId: 5 },
{ id: 12, name: 'mahdiyar', parentId: 5 }
], k)
Url parser
Contains logic for parsing and manipulating urls
Browser support: IE9+
Usage
import { urlParser } from 'libj-core'
var o = urlParser.parse('/api/authentication/login?user_name=admin&password=pass 1#anchor')
/*
returns the following object
{
protocol: 'http:' or 'https:' // based on the current url
host: 'localhost:1234' // based on the current url
hostname: 'localhost' // based on the current url
port: '1234' // based on the current url
pathname: '/api/authentication/login'
search: '?user_name=admin&password=pass 1'
query: {
'user_name': 'admin',
'password': 'pass 1'
},
hash: '#anchor'
}
*/
var urlAbsolute = o.toAbsolute()
/*
returns 'http://localhost:1234/api/authentication/login?user_name=admin&password=pass%201#anchor'
*/
var urlRelative = o.toRelative()
/*
returns '/api/authentication/login?user_name=admin&password=pass%201#anchor'
*/
var query = urlParser.parseQueryString('user_name=admin&password=pass 1');
/*
returns
{
"user_name":"admin",
"password":"pass 1"
}
*/
var search = urlParser.stringifyQueryString(query)
/*
returns 'user_name=admin&password=pass%201'
*/
Mime helper
Copy file-icon-set folder somewhere on your server
- Checking mime types and showing related file icons.
- Giving associated file icon image file for a file extension or media type
Browser support: IE9+
Usage
import { mimeHelper } from 'libj-core'
//We must set options one time
var o = {
fileIconPath: '/file-icon-set'
};
mimeHelper.setOptions(o)
it('set options', function() {
assert.deepEqual(o, mimeHelper.options);
})
it('get extension from media type', function() {
var k = mimeHelper.getExtension('image/png');
assert.equal('.png', k)
})
it('get media type from extension', function() {
var k = mimeHelper.getMediaType('png')
assert.equal('image/png', k)
k = mimeHelper.getMediaType('.png')
assert.equal('image/png', k)
})
it('get icon path for extension', function() {
var k = mimeHelper.getIconPathForExtension('.png', 24)
assert.equal(`${o.fileIconPath}/png-icon-24x24.png`, k)
})
it('get icon path for url', function() {
var k = mimeHelper.getIconPathForUrl('/some-folder/some-file.png', 24)
assert.deepEqual(`${o.fileIconPath}/png-icon-24x24.png`, k)
})
Opacity css
Creates a cross-browser style string, for a given opacity value a float number between 0 and 1
Browser support: IE9+
Usage
import { getOpacityCss } from "libj-core";
var el = document.getElementById('divId');
el.style.cssText += getOpacityCss('0.2');
Formdata extensions
Using this module you can put arbitrary objects (with 1 level nesting only) to a FormData object for (mainly) AJAX
Browser support: Edge+
Usage
import { formDataExtensions } from "libj-core";
var fd = new FormData();
formDataExtensions.put(fd, {
arg1: 'value1',
arg2: [
'v1', 'v2'
]
})
formDataExtensions.print(fd)
Query media
This is used to help checking and getting callbacks for media query changes in browser just like css.
Browser support: IE10+
Usage
import { queryMedia } from 'libj-core'
queryMedia.run('(max-width: 800px)', true, isMatch => {
console.log(`max-width ${(isMatch ? 'is' : 'is NOT')} 800px`)
})
queryMedia.runSync('(max-width: 800px)')
// return true or false
Window scrollbar
This is used to remove
window's scrollbar temporarily and restore
it again
Browser support: IE9+
Usage
import { windowScrollbar } from 'libj-core'
windowScrollbar.remove()
/* removes window's scrollbar */
windowScrollbar.restore()
/* restores window's scrollbar to its previous position */
Tiny scrollbar (css)
Add this file: tiny-scrollbar.css Adding this file to your browser, will change the look and feel of the scrollbar.
Browser support: Chrome
Infinite scroll
Do you want to implement infinite scroll effect when user scrolls an element or scrolls the window? This is it!
Browser support: IE9+
Usage
import { InfiniteScroll } from 'libj-core'
function gettingPageData() {
console.log(`loading page ${scroller.getPage()}`)
}
function pageDataReceived() {
console.log(`page ${scroller.getPage() - 1} data received`);
}
function onNextPage(page, callback) {
// show data ...
var hasMore = true; //or false for the last page
callback(hasMore)
}
/* if you pass null or undefined for the first argument, then the whole window will be watched for scroll */
/* if you pass $('#someDiv') that element scroll will be watched */
var scroller = new InfiniteScroll(null, onNextPage, gettingPageData, pageDataReceived);
scroller.start();
Culture manager
Supports these cultures: en (English), fa (Farsi), ar (Arabic), fr (French), de (German), es (Spanish), ru (Russian), tr (Turkish), ps (Pashto), ur (Urdu)
Browser support: IE9+
Usage
import { validCultures, cultureManager } from 'libj-core'
First set cultures (must be a subset of supported cultures above, or an exception will be thrown)
var cultures = ['en', 'fr', 'es']
cultureManager.setCultures(cultures)
Then set active culture of current page (default is en
)
cultureManager.setActiveCulture('fr')
var activeCulture = cultureManager.getActiveCulture()
/*
returns an instance of Culture
{
code: 'fr',
name: 'Francias',
direction: 'ltr',
url: '/fr/<current_path>?<current_query_string>#<current_hash>'
}
*/
Then define a fallback culture (default is en
)
cultureManager.setFallbackCulture('es')
var fallbackCulture = cultureManager.getFallbackCulture()
/*
returns an instance of Culture
{
code: 'es',
name: 'Espanol',
direction: 'ltr',
url: '/es/<current_path>?<current_query_string>#<current_hash>'
}
*/
Other methods
var isSupported = cultureManager.isCultureSupported('af')
/* will throw and exception */
isSupported = cultureManager.isCultureSupported('ru')
/* returns true */
var all = cultureManager.getAllCultures();
/*
returns an array of Culture objects
[
{
code: 'en',
name: 'English',
direction: 'ltr',
url: '/en/<current_path>?<current_query_string>#<current_hash>'
},
{
code: 'fa',
name: 'فارسی',
direction: 'rtl',
url: '/fa/<current_path>?<current_query_string>#<current_hash>'
},
.
.
.
]
*/
Translator
Browser support: IE9+
Usage
import { Translator } from 'libj-core';
var i18nMessage = {
en: {
hello: 'Hello'
},
fa: {
hello: 'سلام'
}
}
var translator = new Translator(i18nMessage);
translator.t('hello', 'fa')
// prints: سلام
Thumber
Browser support: IE11+
Usage
import { thumber } from 'libj-core';
thumber.setOptions('png, jpg, jpeg, bmp', 'w', 'h', 'q');
thumber.relative('/someImagePath', 90, 120, null)
// returns: '/someImagePath?q=90&w=120'
thumber.absolute('/someImagePath', 90, null, 100)
// returns: '/someImagePath?q=90&h=100'
XsrfManager
Browser support: IE9+
Usage
import { xsrfManager } from 'libj-core';
xsrfManager.setContainerSelector('#containerId')
xsrfManager.getContainerSelector()
// returns '#containerId'
xsrfManager.setHeaderName('X-XSRF-TOKEN')
xsrfManager.getHeaderName()
// returns 'X-XSRF-TOKEN'
xsrfManager.getTagHtml()
// returns outer html of the hidden input which has the token
xsrfManager.getToken()
// returns the token itself
ServerSideTagHelper
Browser support: IE9+
Usage
import { serverSideTagHelper } from 'libj-core';
serverSideTagHelper.init();
// reads values from page's html
serverSideTagHelper.getValue('somekey')
serverSideTagHelper.getValues()
// returns an object with all server-side values
serverSideTagHelper.getResults()
// returns an array of
// {
// name, success, errors, messages, returnValue, duration
// }
Iran sans font (css)
Import the iran-sans file on top of your application entry javascript file.
Then these font family names will be available:
IRANSansUltraLight
IRANSansLight
IRANSansMedium
IRANSansBold
IRANSans