# stik-helpers

> A set of functional tools to help write better code on Stik.js

Latest version **0.4.1** (published 2014-06-25) · MIT license · 0 weekly downloads

## Install

```sh
npm install stik-helpers
pnpm add stik-helpers
yarn add stik-helpers
bun add stik-helpers
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.4.1 |
| Published | 2014-06-25 |
| First published | 2014-06-25 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 1 |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 0 |
| Author | Lukas Alexandre |
| Maintainers | lukelex |
| Keywords | stik, functional |

## Links

- npm: https://www.npmjs.com/package/stik-helpers
- Repository: git@github.com:stikjs/stik-helpers
- Homepage: https://github.com/stikjs/stik-helpers
- Issues: https://github.com/stikjs/stik-helpers/issues
- npm.io page: https://npm.io/package/stik-helpers

## Dependencies (1)

- [stik-core](https://npm.io/package/stik-core.md) ^1.0.3

## Recent versions

- 0.4.1 (latest) — 2014-06-25
- 0.4.0 — 2014-06-25

## README

#Helpers
Helpers can be used as a shortcut to create small functional pieces of code.

All defined helpers reside under the **$h** module that can be injected into controllers, behaviors and boundaries.

##Defining
```javascript
// this helper does not have dependencies
stik.helper("hasClass", function(){
  return function(elm, selector){
    var className = " " + selector + " ";
    return (" " + elm.className + " ").replace(/[\n\t]/g, " ").indexOf(className) > -1;
  };
});
// the helper defined below depends on the
// previously defined hasClass helper
stik.helper("toggleClass", function(hasClass){
  return function(elm, selector){
    if (hasClass(elm, selector)) {
      var regex = new RegExp("\\b\\s?" + selector + "\\b", "g");
      elm.className = elm.className.replace(regex, '');
    } else if (!hasClass(elm, selector)) {
      elm.className += " " + selector;
    }
  };
});
```

##Using it
```javascript
stik.controller("AppCtrl", "List", function($template, $h){
  $h.toggleClass($template, "stik-is-awesome");
});

stik.behavior("shine-on-focus", function($template, $h){
  $template.addEventListener("focus", function(){
    $h.toggleClass($template, "shining");
  });
  $template.addEventListener('blur', function(){
    $h.toggleClass($template, "shining");
  });
});

stik.boundary({
  as: "myAwesomeExternalLibraryBoundary",
  from: "controller",
  resolvable: true,
  to: function($h, $template){
    var http = new SomeHttpLibrary();
    if ($h.hasClass($template, 'not-loaded')) {
      http.get('/load-app.html').wheDone(function(res){
        $h.toggleClass($template, 'loading-done');
      });
    }
  }
});
```


##$window
Allows you to mock the window global obj
```javascript
stik.behavior("someWindowDependentBehavior", function($window){
  $window.AudioListener();
  // in this way you can later on
  // mock the window object on your tests
});

// or

stik.helper("clearTimeout", function($window){
  return $window.clearTimeout;
});
```

##debounce
Debouncing ensures that a method gets executed only once, during the specified interval, even if several calls were triggered.

```javascript
stik.behavior("shineOnMouseMove", function($h, $template){
  function shine(){
    ...
  }
  shine.bind({}, $template);

  // the `shineThis` function will only be called
  // once within 500ms even if the browser triggers
  // 100+ mouse events
  $template.addEventListener("mousemove", $h.debounce(shine, 500));
});
```

##isArray
Returns true or false for wether the obj is an instance of Array

```javascript
stik.controller("AppCtrl", "List", function($h){
  $h.isArray([1,2,3]); // true
  $h.isArray({"a": 1}); // false
});
```

##deepExtend
Gives you the ability to deep copy all properties and values from one object to another.

```javascript
stik.controller("AppCtrl", "Post", function($h, httpGet){
  currentPost = {};

  anotherPost = httpGet("/posts/1029783.json");

  $h.deepExtend currentPost, anotherPost
  // currentPost will have all new properties
  // and values from anotherPost
});
```

##zip
Merges two arrays into a third

```javascript
stik.controller("AppCtrl", "List", function($h){
  var firstArray = [1,2,3];
  var secondArray = [4,5,6];

  $h.zip(firstArray, secondArray); // [1,2,3,4,5,6]
});
```

---
_Source: https://npm.io/package/stik-helpers · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._