Scratch-blocks: Block/script clipboard, shared

Created on 28 Jun 2016  路  9Comments  路  Source: LLK/scratch-blocks

One feature that would be really handy is the ability to copy and paste Scratch blocks. At the moment (Scratch 2.0), you can already do this in some ways:

  • Select "duplicate" from a block's context menu
  • Drag a block or script onto a sprite in the sprites pane
  • Use the "stamp" button in the toolbar to copy the block or script
  • Use the backpack to bring blocks or scripts from one sprite to another, even across projects and devices

The last item there is similar to what I'm suggesting - copying actual block data to the system clipboard.

It's better than using the backpack, because:

  • Systems are starting to implement _shared_ clipboards, meaning the clipboard is shared across multiple devices

    • And even if you're on a device that doesn't have shared clipboards, the clipboard is generally shared among all the applications on your device, meaning you could have two browser windows open, each working on Scratch projects

  • Because of shared clipboards, you don't need to be logged into the same account as the account you copied the block from, unlike the backpack
  • It's quick - you don't need to reload the entire page to see the most recent items in the backpack (though this _should_ be fixed, for what reason should you need to reload the page to see items in your backpack?)
  • Depending on how scripts are copied - I'm thinking the JSON representation of the script you'd find in an sb3 project - you could probably upload a script onto the internet, so that people can copy from your document to their project

I'm thinking it shouldn't be very difficult to implement this. Here's a quick code mockup:

// When a script, block, etc. is created:
// 'copy' is probably localized to 'Copy to clipboard'
block.contextMenu.addItem('copy', function() {
  // This function doesn't exist with this name, of course. I'm not entirely certain what
  // the exact code to copy is but it's possible and has been done on many sites
  // and web applications before.
  // Also, I don't know what the name of the function to convert a script to JSON is,
  // so I'm using "serialize" :)
  // I'm also assuming there's a "duplicate" method on blocks that behaves however
  // we want duplicating scripts to be have, (copy child blocks, blocks below, etc.)
  // Could probably name this method better but it's for the demo :)
  copyToBrowserClipboard(block.duplicate().serialize())
})

The trouble is pasting. There are a couple of ways we could do this:

  • Make a hidden input box that's always selected when you're using the workspace. Input only works via paste. Kind of a dirty hack, and you can't use a context menu -> paste method if you do it that way.
  • Show a prompt asking for the user to paste a block. I like this more.

The nice thing about using a prompt is that it can be a custom dialog - for example, before a block is _actually_ pasted into the workspace, you might be able to see a picture of the block in the dialog. It can be triggered via context menu, or by listening for a Command/Control-V press.

Mockup code for prompt:

function pastePrompt() {
  const prompt = makePastePrompt()
  prompt.addEventListener('done', function() {
    workspace.addScript(prompt.value) // see below section, "things to consider"
  })
}

workspace.contextMenu.addItem('paste', pastePrompt)
workspace.addEventListener('key', function(key) {
  // isCombo is a fake function here that will check if a key press is the right character,
  // has the right modifiers (command/control), etc. for mockup
  if (isCombo(key, 'Command+V')) {
    pastePrompt()
  }
})

Things to consider:

  • Where should blocks be pasted to? Where the mouse clicked?
  • If you copy a reporter, where will it go? Can you use the paste prompt on an input?

    • What if you try to paste a stack block into an input?

  • Can you paste a script between two blocks, if it fits?
  • Would it just be better to make the block be automatically grabbed when you accept the paste, or would that be confusing or surprising?

I guess this is getting kind of long.. that's all I have for this suggestion! What should be changed? (Probably the title of this issue.. maybe it would better fit as a "design" issue.)

edit: this could probably work with sprites, as well, but I'm not sure how to save costumes or sounds - maybe as data URIs? But those have length limits..

feature request

Most helpful comment

I love this idea! Desmos does something similiar when copy & pasting:
image
Perhaps something could be learned from how it's done there?

All 9 comments

+1 -- I've spent a lot of time switching between projects to collect stuff into my backpack. This way I could just open the other projects in a new tab, copy the blocks I need, and paste them into my WIP project without navigating away from it

It's on our radar! In fact we already seem to support copy and paste within one page, it's just not well-exposed (hit control/command-C after clicking on a block, and then control-V).

Maybe there would be a placeholder block that you drag somewhere and a dialog pops up. Then, when you submit it, it'll replace that placeholder block with the copied scripts.

Also, are you able to adapt this for Scratch 2.0 mods?

Maybe have it stored in the scratchblocks format?

It would be slightly more complicated to implement, but it would make it very simple to copy things to/from the forums and wikis.

Trouble is, if the ST decides to make some huge thing like custom reporters _that have an entire new grammar_, they kind of have to _wait_ for @tjvr to update scratchblocks before they can publish the new feature, or else the whole "you can use 'copy' to copy Scratch blocks into the forums!" feature doesn't work.

So I don't think that would be particularly convenient. Maybe it would be better if there was an update to the scratchblocks generator that took sb3/JSON input instead of a project URL?

Might it be possible to accept multiple different inputs when pasting, so scratchblocks would be available, but not required as the sole interchange format?

I love this idea! Desmos does something similiar when copy & pasting:
image
Perhaps something could be learned from how it's done there?

@PullJosh Ironically, that's got nothing to do with clipboard-jacking - that's just the LaTex code it uses for rendering! :ghost:

Quoting @thisandagain from here:

Because in Scratch blocks execute on click, we don't have a "selection state" which makes implementing something like copy/paste require some design effort. Leaving this open as a feature request, but it's likely not something we'll get to in the short term.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

tmickel picture tmickel  路  3Comments

jwzimmer picture jwzimmer  路  5Comments

towerofnix picture towerofnix  路  6Comments

Alzter picture Alzter  路  3Comments

towerofnix picture towerofnix  路  5Comments