<commit_before><!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <title>Kefir.js counter demo</title>
        <script src="../bower-packages/jquery/jquery.js"></script>
        <script src="../dist/kefir.min.js"></script>
        <script src="../dist/addons/kefir-jquery.min.js"></script>
        <link rel="stylesheet" type="text/css" href="../docs-src/includes/stylesheet.css">
        <style type="text/css">
          body {
            padding:  0 1em 1em;
            max-width: 700px;
          }
        </style>
    </head>
    <body>

      <p>
        <a href="../">↩ back to Kefir.js documentation</a>
      </p>

      <h1>Kefir.js counter demo</h1>

      <p>
        This is the most basic Kefir.js example.
        Click «+» or «-» buttons to change value in between them.
        This example also uses <a href="../#jquery">jQuery addon</a> for Kefir.js,
        so make sure to include addon JavaScript file if you will use this code.
      </p>

      <h3>Result</h3>

      <button id="plus-btn">+</button>
      <span id="result"></span>
      <button id="minus-btn">-</button>


      <h3>Source code</h3>

      <pre>

&lt;!-- HTML --&gt;

&lt;button id="plus-btn"&gt;+&lt;/button&gt;
&lt;span id="result"&gt;&lt;/span&gt;
&lt;button id="minus-btn"&gt;-&lt;/button&gt;


&lt;!-- JavaScript --&gt;

&lt;script src="...jquery.js"&gt;&lt;/script&gt;
&lt;script src="...dist/kefir.min.js"&gt;&lt;/script&gt;
&lt;script src="...dist/addons/kefir-jquery.min.js"&gt;&lt;/script&gt;

&lt;script type="text/javascript"&gt;

  var plusClicks = $('#plus-btn').asKefirStream('click', function(){  return 1  });
  var minusClicks = $('#minus-btn').asKefirStream('click', function(){  return -1  });

  var result = Kefir.merge(plusClicks, minusClicks).scan(0, function(cur, add) {
    return cur + add;
  });

  result.onValue(function(x) {
    $('#result').text(x);
  });

&lt;/script&gt;

</pre>

      <br>
      <br>

      <script type="text/javascript">

        var plusClicks = $('#plus-btn').asKefirStream('click', function(){  return 1  });
        var minusClicks = $('#minus-btn').asKefirStream('click', function(){  return -1  });

        var result = Kefir.merge(plusClicks, minusClicks).scan(0, function(cur, add) {
          return cur + add;
        });

        result.onValue(function(x) {
          $('#result').text(x);
        });

      </script><commit_msg>update counter demo<commit_after><!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <title>Kefir.js counter demo</title>
        <script src="../bower-packages/jquery/jquery.js"></script>
        <script src="../dist/kefir.min.js"></script>
        <script src="../dist/addons/kefir-jquery.min.js"></script>
        <link rel="stylesheet" type="text/css" href="../docs-src/includes/stylesheet.css">
        <style type="text/css">
          body {
            padding:  0 1em 1em;
            max-width: 700px;
          }
        </style>
    </head>
    <body>

      <p>
        <a href="../">↩ back to Kefir.js documentation</a>
      </p>

      <h1>Kefir.js counter demo</h1>

      <p>
        This is the most basic Kefir.js example.
        Click «+» or «-» buttons to change value in between them.
      </p>
      <p>
        This example also uses <a href="../#jquery">jQuery addon</a> for Kefir.js,
        so make sure to include addon JavaScript file if you will use this code.
      </p>

      <h3>Result</h3>

      <button id="plus-btn">+</button>
      <span id="result"></span>
      <button id="minus-btn">-</button>


      <h3>Source code</h3>

      <pre>

&lt;!-- HTML --&gt;

&lt;button id="plus-btn"&gt;+&lt;/button&gt;
&lt;span id="result"&gt;&lt;/span&gt;
&lt;button id="minus-btn"&gt;-&lt;/button&gt;


&lt;!-- JavaScript --&gt;

&lt;script src="...jquery.js"&gt;&lt;/script&gt;
&lt;script src="...dist/kefir.min.js"&gt;&lt;/script&gt;
&lt;script src="...dist/addons/kefir-jquery.min.js"&gt;&lt;/script&gt;

&lt;script type="text/javascript"&gt;

  var plusClicks = $('#plus-btn').asKefirStream('click');
  var minusClicks = $('#minus-btn').asKefirStream('click');

  var counterChanges = Kefir.merge(
    plusClicks.mapTo(1),
    minusClicks.mapTo(-1)
  )

  function sum(a, b) {
    return a + b;
  }

  var counterValue = counterChanges.scan(0, sum);

  counterValue.onValue(['text', $('#result')]);

&lt;/script&gt;

</pre>

      <br>
      <br>

      <script type="text/javascript">

        var plusClicks = $('#plus-btn').asKefirStream('click');
        var minusClicks = $('#minus-btn').asKefirStream('click');

        var counterChanges = Kefir.merge(
          plusClicks.mapTo(1),
          minusClicks.mapTo(-1)
        )

        function sum(a, b) {
          return a + b;
        }

        var counterValue = counterChanges.scan(0, sum);

        counterValue.onValue(['text', $('#result')]);

      </script>
{'fraction_non_alphanumeric': 0.19816769567815176, 'fraction_numerical': 0.007568213503286198, 'mean_word_length': 2.4778393351800556, 'pattern_counts': {'":': 0, '<': 93, '<?xml version=': 0, '>': 93, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '5066542', 'n_tokens_mistral': 1830, 'n_tokens_neox': 1767, 'n_words': 349}