Please accept YouTube cookies to play this video. By accepting you will be accessing content from YouTube, a service provided by an external third party.

YouTube privacy policy

If you accept this notice, your choice will be saved and the page will refresh.

Accept YouTube Content

It can easily be customized by adjusting a few parameters like size, position, amount of draggable elements. The draggables can be skinned with custom images as well (see video).

All draggable positions are updated into an array which can be used to reorder anything with Kontakt. Read more below under API

Content

• important notes

• DOCS :: SETUP GUIDE

• DOCS :: adjustable vars

• DOCS :: API / output data & usage

• TUTORIAL :: Full Script

• TUTORIAL :: on init explained (only relevant parts)

• TUTORIAL :: on ui_control explained

Important Notes

These docs explain the code on the basis of the Kontakt Script versions supplied with the download.

If you are working with sublime it is recommended to use the sublime version, also supplied with the download.
The sublime version works for both, Kontakt 5 & 6. Simply set the preferred Kontakt version at the top of the script, before compiling it.

For the draggables both the words “element” and “cursor” are used across these docs.

Setup Guide

1. copy the whole code from inside the on init into your on init. At best somewhere below your code.
   But don’t copy the “on init” “end on” again
2. copy the whole code from below the on init somewhere below your on init.
3. Put the copyright notice at the very top of your code (or into an extra open script tab or into an about section of your instrument).

See this demo:

{#####################################################################################
"YummyBeat's - KSP Drag & Drop" script, licensed under the MIT License
....
.... 
Please copy the whole copyright notice here!
#####################################################################################}

on init
  {### YOUR CODE ###}

  {YUMMYBEAT'S KSP DRAG & DROP SCRIPT}
end on

{### YOUR CODE ### }

{YUMMYBEAT'S KSP DRAG & DROP SCRIPT}
on ui_control (?dd_area)
  {.....}
end on

Adjustable Vars (Kontakt6 & Kontakt5)

{ SET GLOBAL UI }		 
  declare $UI_WIDTH 	:= 1000 {set UI width: min width = 632; max width = 1000 }
  declare $UI_HEIGHT 	:= 540 {set UI height: max height = 540 }
  declare @WALLPAPER			
  @WALLPAPER 	:= "wp" {set background wallpaper (image name w/o file extension) }

{ SET DRAG & DROP AREA }
  declare const $NUM_CURSOR 	:= 8 {set the amount of total cursors; max = 16 }
  declare const $DD_AREA_WIDTH 	:= 480 {set the drop down area width }
  declare const $DD_AREA_HEIGHT 	:= 64 {set the drop down area height (this should equal the cursor image height) }
  declare const $DD_AREA_ALIGN 	:= 1 {align the drag & drop area: 1 = center; 0 = left }
  declare const $DD_AREA_POS_X 	:= 0 {left indent; set to 0 when align = center }
  declare const $DD_AREA_POS_Y 	:= 241 {position the drag & drop area vertically }
  declare $RELEASE_TIME		:= 200 {Kontakt 5 only: wait time until mouse release code is executed }

{ SET CURSOR IMAGES }
  declare !cursor_img[$NUM_CURSOR]
  !cursor_img[0] := "cursor_0"	{set individual image for cursor 1: enter image file name w/o file extension }
  !cursor_img[1] := "cursor_1"	{set individual image for cursor 2: enter image file name w/o file extension }
  !cursor_img[2] := "cursor_2"	{set individual image for cursor 3: enter image file name w/o file extension }
  !cursor_img[3] := "cursor_3"	{ ... }
  !cursor_img[4] := "cursor_4"
  !cursor_img[5] := "cursor_5"
  !cursor_img[6] := "cursor_6"
  !cursor_img[7] := "cursor_7"
  {
  !cursor_img[8] := 	""
  !cursor_img[9] := 	""
  !cursor_img[10] := 	""
  !cursor_img[11] := 	""
  !cursor_img[12] := 	""
  !cursor_img[13] := 	""
  !cursor_img[14] := 	""
  !cursor_img[15] := 	""
  }
  {uncomment if using more than 8 cursors}

API :: Output Data and Usage

message($pos) //outputs 2

message($this_cursor) //outputs 6

// THIS IS REFERRING TO THE CURSOR POSITIONS FROM THE IMAGE ABOVE 

//position 0
  message(%cursor_index[0]) //outputs 3
//position 1
  message(%cursor_index[1]) //outputs 5
//position 2
  message(%cursor_index[2]) //outputs 6
//position 3
  message(%cursor_index[3]) //outputs 7
//position 4
  message(%cursor_index[4]) //outputs 0
//position 5
  message(%cursor_index[5]) //outputs 1
//position 6
  message(%cursor_index[6]) //outputs 2
//position 7
  message(%cursor_index[7]) //outputs 4

Example

All the values above will be updated whenever we move an element to a new position.

We can now use all the values to reorder anything we want.

premium content