HakeJS

Unfinished by Dominic Ming

• HakeJS
  • What is HakeJS
  • HakeJS feature
  • About Hake
  • HakeJS Doc
    • Hake
    • Hake.dom
    • Hake.event
    • Hake.observe
    • Hake.parse
    • Hake.data
  • About abolished

What is HakeJS

HakeJS is a modern web library with simple data bind and component.

Just build it for fun, so it may not have such thing like efficiency, stability or anything you heard to describe a mainstream framework.

HakeJS feature

• You can use Hake lang to write template. It look like this;

  (div(a{href="sss"} {{somedata}} www))
  

  And it will turn out like this.

   <div><a href="sss">somedata www</a></div>

• Nearly every function can be use.

  You can directly use part of the function as a tool instead of use whole Hake.

• Shadow DOM(TODO)

  I will write Shadow DOM Mode for who want use it in new browser.

• Virtual DOM(TODO)

  It will come back, only wait for some time.

About Hake

There is some library I write also using Hake as a identify, but it's fine to use them separately.

HakeJS Doc

Hake

Main instance of whole hakejs

First of all, you should have at least one.

var hakejs = new Hake();
//when ES6
const hakejs = new Hake();

Hake.dom

getOne(selector) ⇒ Element

document.querySelector shortcut

Kind: global function

Param	Type
selector	string

getAll(selector) ⇒ NodeList

document.querySelectorAll shortcut

Param	Type
selector	string

getAttr(el, name) ⇒ string

getAttribute shortcut

Param	Type
el	HTMLElement
name	string

getAttrs(el) ⇒ object

return all attribute in element in a object

Param	Type
el	HTMLElement

addClass(el, className) ⇒ * | string

Add class on element.

Param	Type
el	HTMLElement
className	string

removeClass(el, className) ⇒ * | string

Remove class on element.

Param	Type
el	HTMLElement
className	string

toggleClass(el, className) ⇒ *

Toggle class on element.

Param	Type
el	HTMLElement
className	string

Hake.event

eventpool : object

A pool to store event that not native

addEvent(event, callback, target)

Add event to anything (some just fake event)

Param	Type
event	string
callback	function
target	*

trigEvent(event, target)

Run a event on target (fake events don't care target)

Param	Type
event	string
target	*

removeEvent(event, callback, target)

Remove event on anything (fake events don't care target and callback)

Param	Type
event	string
callback	function
target	*

Hake.observe

new OArray(callback, top)

Observable array, not the real one.

Param	Type
callback	function
top	string

object(obj, callback, top) ⇒ object

Observe Object with call back, and only return top level key

Param	Type
obj	object
callback	function
top	string

key(obj, key, callback) ⇒ *

Only observe special key change, not care about its children.

Param	Type
obj	object
key	string
callback	function

btw(val, a, b) ⇒ boolean

Return if a <= val < b .

Param	Type
val	number
a	number
b	number

array(arr, callback, top) ⇒ OArray

Observe array with call back, and only return top level key.

Param	Type
arr	array
callback	function
top	string

Hake.parse

new DataBlock(str)

DataBlock contain origin data, generator and related variable

Param	Type
str	string

parseDOM(str) ⇒ HTMLElement

Use browser native api to parse HTML, Lazy Easy DOM parser.

Param	Type
str	string

readTag(startIndex, str) ⇒ Object | boolean

Read tag name and return it with a char after it

Param	Type
startIndex	number
str	string

parseHake(str) ⇒ HTMLElement

Parse Hake string and return HTMLElement.

Param	Type
str	string

parseData(str) ⇒ Array

Parse data string contain '{{...}}' and slice it into a string

Param	Type
str	string

Hake.data

dataHash(str) ⇒ string

Hash a string to a code.

Param	Type
str	string

hasData(str) ⇒ boolean

If string contain {{}}

Param	Type
str	string

dataSearch(el) ⇒ Array

Search data bind in element, return a array with data info.

Param	Type
el	HTMLElement

dataBind(sArr, data) ⇒ object

Use dataSearch result to bind a data object, return a related map.

Param	Type
sArr	array
data	object

dataObserve(data, el) ⇒ Object

Observing data from a element

Param	Type
data	object
el	HTMLElement

dataDiff(oldData, newData, res)

diff the old data and new data to return difference array

Param	Type
oldData	object
newData	object
res	array

About abolished

• It's a mistake to write that code, "I don't know her."