Create
cancel
Showing results for 
Search instead for 
Did you mean: 
Sign up Log in

Next challenges

Recent achievements

  • Global
  • Personal

Recognition

  • Give kudos
  • Received
  • Given

Leaderboard

  • Global

Trophy case

Kudos (beta program)

Kudos logo

You've been invited into the Kudos (beta program) private group. Chat with others in the program, or give feedback to Atlassian.

View group

It's not the same without you

Join the community to find out what other Atlassian users are discussing, debating and creating.

Atlassian Community Hero Image Collage

Use power-up to copy to clipboard on click

I've created a button to take the url of a card and add the relative path to our own url to stop it showing a description when posted to Flock.

Right now it shows the spliced url in a popup which we have to manually copy, the functionality we want is to click the button and have it copy the text.

var GRAY_ICON = 'https://cdn.hyperdev.com/us-east-1%3A3d31b21c-01a0-4da2-8827-4bc6e88b7618%2Ficon-gray.svg';

var onBtnClick = function (t, opts) {
  return t.card("url").then(function (card) {
    var str = JSON.stringify(card, null, 2);
    var parsedURL = JSON.parse(str);
    const url = new URL(parsedURL.url);
    var shortUrl = "Our custom URL" + url.pathname
    updateClipboard(shortUrl); //DOESN'T WORK
    return t.popup({
      title: "Flock Link",
      items: [{
        text: "Our custom URL" + url.pathname //WORKS AND SHOWS IN POPUP
      }]
    });
  }).catch(error => console.log(error));
};

function updateClipboard(newClip) {
  navigator.clipboard.writeText(newClip).then(function () {
    console.log('Success: ' + newClip);
  }, function () {
    console.log('Failed to copy');
  });
} +

window.TrelloPowerUp.initialize({
  'card-buttons': function (t, opts) {
    return [{
      icon: GRAY_ICON,
      text: 'Flock Link',
      callback: onBtnClick,
      condition: 'edit',
      backgroundColor: '#263340',
      color: '#ffffff'
    }, () => {
      console.log('reached');
      var btn = document.querySelector('.button-link[title="Flock Link"]')
      btn.style.backgroundColor = '#263340';
      btn.style.color = '#ffffff';
    }];
  }
});

So, I have tried to remove the t.popup and instead use either navigator.clipboard or document.execCommand as per the docs but I just can't get it to work.

The second issue is trying to change the colour of the button - this should be super simple but I must be overthinking it as I cannot get any subsequent function or other properties to affect the button in anyway.

0 answers

Suggest an answer

Log in or Sign up to answer
TAGS
Community showcase
Posted in Trello

Introducing: A Whole New Trello

After a decade of growing the most ubiquitous visual framework for productivity and project management, we are evolving Trello’s boards, lists, and cards model to bring context to content and help te...

582 views 23 21
Join discussion

Community Events

Connect with like-minded Atlassian users at free events near you!

Find an event

Connect with like-minded Atlassian users at free events near you!

Unfortunately there are no Community Events near you at the moment.

Host an event

You're one step closer to meeting fellow Atlassian users at your local event. Learn more about Community Events

Events near you