Intégrer une musique de SoundCloud en BBcode

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu Intégrer une musique de SoundCloud en BBcode

Message par Mat le Mar 25 Avr 2017 - 21:50

Bonjour ^^,
je voudrais savoir comment je pourrais faire pour intégrer une musique de Soundcloud en BBcode sur mon forum ^^
J'ai trouvé ce topic ^^:
http://forum.forumactif.com/t342479-code-pour-integrer-lecteur-soundcloud
Mais ce n'était pas possible à l'époque
Je voudrais savoir aussi comment faire pour ajouter un bouton intégrer une musique Soundcloud avec un bouton comme le bouton "insérer un code"
Merci d'avance ^^


Dernière édition par FkS_DjMat le Mer 14 Juin 2017 - 12:41, édité 4 fois
avatar

Mat
*****

Messages : 760
Inscrit(e) le : 05/09/2015

https://www.fidjix.com/
Mat a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Intégrer une musique de SoundCloud en BBcode

Message par Chacha le Ven 12 Mai 2017 - 9:47

Bonjour,

Attention, cela fait 6 jours que nous n'avons pas de nouvelles concernant votre demande, si vous ne voulez pas voir votre sujet déplacé à la corbeille, merci de poster dans les 24h qui suivent ce message.

Si votre sujet est résolu, merci d'éditer votre premier message et de cocher l'icône « résolu »
avatar

Chacha
Modéractif
Modéractif

Masculin
Messages : 54613
Inscrit(e) le : 21/08/2010

http://forum.forumactif.com/
Chacha a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Intégrer une musique de SoundCloud en BBcode

Message par Mat le Mar 30 Mai 2017 - 16:27

Et un up Wink
avatar

Mat
*****

Messages : 760
Inscrit(e) le : 05/09/2015

https://www.fidjix.com/
Mat a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Intégrer une musique de SoundCloud en BBcode

Message par Chacha le Lun 5 Juin 2017 - 9:38

Bonjour,

Attention, cela fait 6 jours que nous n'avons pas de nouvelles concernant votre demande, si vous ne voulez pas voir votre sujet déplacé à la corbeille, merci de poster dans les 24h qui suivent ce message.

Si votre sujet est résolu, merci d'éditer votre premier message et de cocher l'icône « résolu »
avatar

Chacha
Modéractif
Modéractif

Masculin
Messages : 54613
Inscrit(e) le : 21/08/2010

http://forum.forumactif.com/
Chacha a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Intégrer une musique de SoundCloud en BBcode

Message par Mat le Lun 5 Juin 2017 - 11:05

Et un up Wink
avatar

Mat
*****

Messages : 760
Inscrit(e) le : 05/09/2015

https://www.fidjix.com/
Mat a été remercié(e) par l'auteur de ce sujet.
  • 0

Résolu Re: Intégrer une musique de SoundCloud en BBcode

Message par Walt le Lun 5 Juin 2017 - 13:26

Bonjour,

La réponse n'a pas changé, vous ne pouvez pas intégrer vous même de nouveau BBcode, l'unique moyen étant un script remplaçant des balises par le code HTML. Mais la difficulté est que le lien du lecteur n'est pas le lien de la page de lecture sur le site Soundcloud.

Par exemple, si vous créez et activez ce JS sur toutes vos pages :

Code:
$(function() {
  var pattern = /\[soundcloud\](.*?)\[\/soundcloud\]/g;
  var replacement = '<iframe width="100%" height="450" scrolling="no" frameborder="no" src="https://w.soundcloud.com/player/?url=https://api.soundcloud.com/tracks/$1&amp;auto_play=false&amp;hide_related=false&amp;show_comments=true&amp;show_user=true&amp;show_reposts=false&amp;visual=true"></iframe>';
 
  $(window).bind("load", function() {
    setTimeout(function() {
      $("div.postbody div" + ($("body#phpbb").length ? ".content div" : $("#ipbwrapper").length ? ".post-entry div:not(.clear)" : $("#pun-foot").length ? ".entry-content div div:not(.clear)" : "")).each(function() {
          pattern.test($(this).html()) && $(this).html($(this).html().replace(pattern, replacement))
      });
    }, 600)
  })
});

Il est possible de poster un lecteur en insérant dans un message ceci :
Code:
[soundcloud]310583525[/soundcloud]

310583525 correspond ici à la piste jouée. Pour obtenir l'id d'une piste jouée, c'est un peu compliquée ce qui ne rend pas très pratique ce BBcode :


Voici en tout cas le rendu :



Cordialement,
Walt
avatar

Walt
Modéractif
Modéractif

Masculin
Messages : 3309
Inscrit(e) le : 08/09/2015

Walt a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Intégrer une musique de SoundCloud en BBcode

Message par Mat le Lun 5 Juin 2017 - 14:24

Merci ça marche Wink
Je n'ai plus qu'a réduire la taille de base du lecteur Wink
avatar

Mat
*****

Messages : 760
Inscrit(e) le : 05/09/2015

https://www.fidjix.com/
Mat a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Intégrer une musique de SoundCloud en BBcode

Message par Mat le Lun 5 Juin 2017 - 17:33

Merci pour la réouverture du sujet Wink
Et désolé donc pour le up Wink
Mais ça ne fonctionne pas sur la version mobile Wink
avatar

Mat
*****

Messages : 760
Inscrit(e) le : 05/09/2015

https://www.fidjix.com/
Mat a été remercié(e) par l'auteur de ce sujet.
  • 0

Résolu Re: Intégrer une musique de SoundCloud en BBcode

Message par Walt le Lun 5 Juin 2017 - 17:50

Remplacez le script précédent par :

Code:
$(function() {
  var pattern = /\[soundcloud\](.*?)\[\/soundcloud\]/g;
  var replacement = '<iframe width="100%" height="450" scrolling="no" frameborder="no" src="https://w.soundcloud.com/player/?url=https://api.soundcloud.com/tracks/$1&amp;auto_play=false&amp;hide_related=false&amp;show_comments=true&amp;show_user=true&amp;show_reposts=false&amp;visual=true"></iframe>';
 
  $(window).bind("load", function() {
    setTimeout(function() {
      $("#mpage-body-modern .post-content, div.postbody div" + ($("body#phpbb").length ? ".content div" : $("#ipbwrapper").length ? ".post-entry div:not(.clear)" : $("#pun-foot").length ? ".entry-content div div:not(.clear)" : "")).each(function() {
          pattern.test($(this).html()) && $(this).html($(this).html().replace(pattern, replacement))
      });
    }, 600)
  })
});

Cordialement,
Walt
avatar

Walt
Modéractif
Modéractif

Masculin
Messages : 3309
Inscrit(e) le : 08/09/2015

Walt a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Intégrer une musique de SoundCloud en BBcode

Message par Mat le Lun 5 Juin 2017 - 18:52

Walt a écrit:Remplacez le script précédent par :

Code:
$(function() {
  var pattern = /\[soundcloud\](.*?)\[\/soundcloud\]/g;
  var replacement = '<iframe width="100%" height="450" scrolling="no" frameborder="no" src="https://w.soundcloud.com/player/?url=https://api.soundcloud.com/tracks/$1&auto_play=false&hide_related=false&show_comments=true&show_user=true&show_reposts=false&visual=true"></iframe>';
 
  $(window).bind("load", function() {
    setTimeout(function() {
      $("#mpage-body-modern .post-content, div.postbody div" + ($("body#phpbb").length ? ".content div" : $("#ipbwrapper").length ? ".post-entry div:not(.clear)" : $("#pun-foot").length ? ".entry-content div div:not(.clear)" : "")).each(function() {
          pattern.test($(this).html()) && $(this).html($(this).html().replace(pattern, replacement))
      });
    }, 600)
  })
});

Cordialement,
Walt
Merci Wink
Ca marche Wink
Je laisse le topic ouvert pendant 3 heures pour voir si je n'ai plus de questions Wink
avatar

Mat
*****

Messages : 760
Inscrit(e) le : 05/09/2015

https://www.fidjix.com/
Mat a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Intégrer une musique de SoundCloud en BBcode

Message par Mat le Lun 5 Juin 2017 - 19:27

C'est possible d'ajouter un bouton à l'éditeur de message Wink?
Un bouton dans le genre de celui de Youtube Wink
On clique dessus on insère le lien de la musique de SounCloud Wink
Et puis c'est bon Wink
avatar

Mat
*****

Messages : 760
Inscrit(e) le : 05/09/2015

https://www.fidjix.com/
Mat a été remercié(e) par l'auteur de ce sujet.
  • 0

Résolu Re: Intégrer une musique de SoundCloud en BBcode

Message par Walt le Mar 6 Juin 2017 - 9:02

FkS_DjMat a écrit:On clique dessus on insère le lien de la musique de SounCloud Wink

Oui c'est possible mais il faudra indiquer le lien de la musique sur l'API de SoundCloud, si vous indiquez le lien d'une musique directement (ex : https://soundcloud.com/a-boogie-wit-da-hoodie/drowning-feat-kodak-black-1 ) ça ne fonctionnera pas. On est d'accords ?
avatar

Walt
Modéractif
Modéractif

Masculin
Messages : 3309
Inscrit(e) le : 08/09/2015

Walt a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Intégrer une musique de SoundCloud en BBcode

Message par Mat le Mar 6 Juin 2017 - 16:41

Walt a écrit:
FkS_DjMat a écrit:On clique dessus on insère le lien de la musique de SounCloud Wink

Oui c'est possible mais il faudra indiquer le lien de la musique sur l'API de SoundCloud, si vous indiquez le lien d'une musique directement (ex : https://soundcloud.com/a-boogie-wit-da-hoodie/drowning-feat-kodak-black-1 ) ça ne fonctionnera pas. On est d'accords ?
Oui, merci je regarde ça tout à l'heure Wink
avatar

Mat
*****

Messages : 760
Inscrit(e) le : 05/09/2015

https://www.fidjix.com/
Mat a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Intégrer une musique de SoundCloud en BBcode

Message par Mat le Mer 7 Juin 2017 - 21:21

Et un up
avatar

Mat
*****

Messages : 760
Inscrit(e) le : 05/09/2015

https://www.fidjix.com/
Mat a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Intégrer une musique de SoundCloud en BBcode

Message par Chacha le Mar 13 Juin 2017 - 9:52

Bonjour,

Attention, cela fait 6 jours que nous n'avons pas de nouvelles concernant votre demande, si vous ne voulez pas voir votre sujet déplacé à la corbeille, merci de poster dans les 24h qui suivent ce message.

Si votre sujet est résolu, merci d'éditer votre premier message et de cocher l'icône « résolu »
avatar

Chacha
Modéractif
Modéractif

Masculin
Messages : 54613
Inscrit(e) le : 21/08/2010

http://forum.forumactif.com/
Chacha a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Intégrer une musique de SoundCloud en BBcode

Message par Mat le Mar 13 Juin 2017 - 12:56

Walt a écrit:
FkS_DjMat a écrit:On clique dessus on insère le lien de la musique de SounCloud Wink

Oui c'est possible mais il faudra indiquer le lien de la musique sur l'API de SoundCloud, si vous indiquez le lien d'une musique directement (ex : https://soundcloud.com/a-boogie-wit-da-hoodie/drowning-feat-kodak-black-1 ) ça ne fonctionnera pas. On est d'accords ?
Et un up Wink
avatar

Mat
*****

Messages : 760
Inscrit(e) le : 05/09/2015

https://www.fidjix.com/
Mat a été remercié(e) par l'auteur de ce sujet.
  • 0

Résolu Re: Intégrer une musique de SoundCloud en BBcode

Message par Walt le Mer 14 Juin 2017 - 11:23

Bonjour,

Ca a été un peu plus long que prévu puisqu'au final je trouvais qu'il était peu pratique de devoir utiliser l'URL de la piste audio dans son format API, donc j'ai prévu les deux cas.

Il est donc possible d'insérer une URL sous la forme API (ex : https://api.soundcloud.com/tracks/310583525 ) ou sous la forme courante (ex : https://soundcloud.com/a-boogie-wit-da-hoodie/drowning-feat-kodak-black-1 ).
Dans le premier cas, le script insère l'ID de la piste contenue dans l'URL, dans le second cas il va chercher l'ID via l'API de Soundcloud.
Dans les deux cas, le BBcode précédemment créé est inséré dans l'éditeur. Si l'URL est vide ou si l'URL n'est pas une adresse Soundcloud, le script affiche une alerte.

Et voici le script :

Code:
$(document).ready(function() {
  $(function() {
    $("#text_editor_textarea").length && window.localStorage && "Microsoft Internet Explorer" != navigator.appName && ($('.sceditor-button-youtube').before('<a class="sceditor-button" unselectable="on" title="Soundcloud" id="soundcloud_button"><div unselectable="on" style="background-image:url(http://i.imgur.com/589Zbbu.png)">Soundcloud</div></a>'), $("#soundcloud_button").click(function(a) {
      a.stopPropagation();
     
      if( $("#soundcloudp").css('display') != 'block' ) {
        $('#soundcloudp').remove();
        $('<div class="soundcloud-bloc sceditor-dropdown" id="soundcloudp" style="display:none"><div><div unselectable="on"><label for="soundcloudurl" unselectable="on">URL</label> <input id="soundcloudurl" class="url" placeholder="https://" value="" type="text"></div><div unselectable="on"><input value="Insérer" id="soundcloudButton" class="button" type="button"></div></div></div>').appendTo("body").css({top:$('#soundcloud_button').offset().top,left:$('#soundcloud_button').offset().left,marginTop: $('#soundcloud_button').outerHeight(),position:'absolute'});
        $("#soundcloudp").toggle();
      } else {
        $('#soundcloudp').remove();
      }
     
      $('#soundcloudurl').val('');
     
      $('#soundcloudButton').click(function(a) {
        a.stopPropagation();
        if( $('#soundcloudurl').val() != "" &&  $('#soundcloudurl').val().search('soundcloud.com') != '-1') {
          if( $('#soundcloudurl').val().search('api.soundcloud.com/tracks/') == '-1') {
            $.ajax({
              url: "https://soundcloud.com/oembed",
              type: 'GET',
              data: {
                format: 'js',
                url: $('#soundcloudurl').val(),
                iframe: 'true',
              },
              dataType: "jsonp",
            }).done(function(data){
              var htmlResult = data.html;
              $('#text_editor_textarea').sceditor('instance').insertText( '[soundcloud]' + htmlResult.replace('<iframe width="100%" height="400" scrolling="no" frameborder="no" src="https://w.soundcloud.com/player/?visual=true&url=', '').replace('http%3A%2F%2Fapi.soundcloud.com%2Ftracks%2F', '').replace('https%3A%2F%2Fapi.soundcloud.com%2Ftracks%2F', '').replace(/&show_artwork=true&callback=jQuery[0-9]+/, '').replace(/_[0-9]+/, '').replace(/&_=[0-9]+/, '').replace('"></iframe>', '')+ '[/soundcloud]' );
              $("#soundcloudp").toggle();
            });
          } else {
            $('#text_editor_textarea').sceditor('instance').insertText( '[soundcloud]' + $('#soundcloudurl').val().replace('https://api.soundcloud.com/tracks/','') + '[/soundcloud]' );
            $("#soundcloudp").toggle();
          }
         } else {
          alert('Vous devez insérer une URL Soundcloud valide.');
        }
      });
    }))
  });
});

Et voici le rendu (les couleurs sont altérées par la compression mais là n'est pas l'important) :



Cordialement,
Walt
avatar

Walt
Modéractif
Modéractif

Masculin
Messages : 3309
Inscrit(e) le : 08/09/2015

Walt a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Intégrer une musique de SoundCloud en BBcode

Message par Mat le Mer 14 Juin 2017 - 11:38

Un très grand merci Walt  Smile
C'est exactement ce que je cherchais Wink
Ca fonctionne parfaitement en plus Wink
Merci d'avoir prit le temps de créer ce code Wink

EDIT : Par contre, je sais que je suis embêtant :p, mais c'est possible de l'ajouter aussi à l'éditeur "nouveau topic' Wink?
Merci d'avance Wink
Et désolé de vous embêter Wink
avatar

Mat
*****

Messages : 760
Inscrit(e) le : 05/09/2015

https://www.fidjix.com/
Mat a été remercié(e) par l'auteur de ce sujet.
  • 0

Résolu Re: Intégrer une musique de SoundCloud en BBcode

Message par Walt le Mer 14 Juin 2017 - 12:09

Il y est déjà, si vous avez coché paramétré correctement l'apparition du script :



Cordialement,
Walt
avatar

Walt
Modéractif
Modéractif

Masculin
Messages : 3309
Inscrit(e) le : 08/09/2015

Walt a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Intégrer une musique de SoundCloud en BBcode

Message par Mat le Mer 14 Juin 2017 - 12:41

Walt a écrit:Il y est déjà, si vous avez coché paramétré correctement l'apparition du script :



Cordialement,
Walt
Oups Wink
Un grand merci alors Wink
avatar

Mat
*****

Messages : 760
Inscrit(e) le : 05/09/2015

https://www.fidjix.com/
Mat a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut


Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum