Piwik ULR Builder

Für Gameplane

by Kevin Pliester

HTML

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<div class="container">

  <div class="page-header">
    <h1>Piwik URL-Builder <small>v0.1</small></h1>
  </div>

  <div class="form-group">
    <input type="text" id="url" placeholder="http.//www.kickstarter.de" class="form-control" />
    <small>Die URL bzw. Adresse zum Kickstarterprojekt oder Spiel.</small>
  </div>

  <div class="form-group">
    <input type="text" id="campaign" placeholder="diablo-3" class="form-control" />
    <small>Kampagnen-Name: Am besten das Spiel.</small>
  </div>

  <div class="form-group">
    <input type="text" id="keyword" placeholder="frontpage" class="form-control" />
    <small><code>frontpage</code> oder <code>post</code> oder sonstiges Keyword.</small>
  </div>

  <hr />

  <div class="form-group">
    <input type="text" id="result" class="form-control" readonly onclick="select()" />
    <small>Das Script liest die URL und erkennt vorhandene Parameter. Einfach kopieren & einfügen.</small>
  </div>

</div>

CSS

.container {
  margin: 5% auto;
  max-width: 600px;
}

small {
  color: #666;
}

JavaScript

$(document).ready(function() {
  $("input").on('change keyup', function() {

    var url = $('#url').val();
    var campaign = $('#campaign').val();
    var keyword = $('#keyword').val();

    if (url.indexOf("?") >= 0) {
      var new_url = url + '&gp_campaign=' + campaign + '&gp_keyword=' + keyword;
    } else {
      var new_url = url + '?gp_campaign=' + campaign + '&gp_keyword=' + keyword;
    }

    $('#result').val(new_url);

  });
});