Кнопка GitHub STAR на странице репозитория


Можно ли добавить кнопку star на рекламную страницу репозитория так же, как есть кнопка facebook like и Google Plus' +1?

2 9

2 ответа:

Я использую кнопки GitHub, которые вы можете найти здесь

Введите описание изображения здесь

Я полагаю, что это возможно. Следующий фрагмент может сработать. Сейчас в нем отсутствуют поля :owner и :repo, но это тривиально, чтобы добавить. То, что я не уверен, что вы можете обойти, - это материал nocross-origin, который вы получаете, если попробуете его. Это также не очень безопасно, потому что они не вводят свои creds непосредственно в github. Но вы не можете сделать это с фрагментом, потому что он требует обратного вызова взаимодействия

Гораздо более простой альтернативой было бы просто, чтобы звезда была ссылкой на страница github, и они могут снять ее там. Проверьте этот веб-сайт для добавления того же взгляда на кнопки http://ghbtns.com/ или http://www.buildbuttons.com/GitHub/StarButton

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<img id="github-star" src="http://placehold.it/50/000000/ffffff"></img>
<div id="github-overlay">
  <input id="github-username" type="username" name="username" placeholder="Username">
  <input id="github-password" type="password" name="password" placeholder="Password">
  <a id="github-submit" href="#">Star It</a>
</div>
<script>
  $(document).ready(function() {
    $("#github-star").click(function() {
      $("#github-overlay").css("display", "block");
    });
    $("#github-submit").click(function(e) {
      e.preventDefault();
      $.ajax({
        type: "PUT",
        url: "user/starred/:owner/:repo",
        username: $("#github-username").val(),
        password: $("#github-password").val(),
        success: function(data) {
          $("#github-overlay").css("display", "none");
          $("#github-star").attr("src", "http://placehold.it/50/e8117f/ffffff");
        }
      });
      return false;
    });
  });
</script>
<style>
  #github-overlay {
    display: none;
    position: absolute;
    top: 25%;
    bottom: 25%;
    left: 25%;
    right: 25%;
  }
  #github-submit {
    display: block;
  }
  #github-star:hover {
    cursor: pointer;
  }
</style>