Palette stack of Custom Controls

[PaulDaMacMan]

Possibly.

Although, frankly, I would far rather keep my 'Gift' stacks as independent entities than 'fold them into the cake mix'.

I would rather have, what basically amounts to clip-art, be easily accessible and drag-n-droppable as controls that are ready to be scripted.

[jacque]

You can set any stack to be a custom image library. Drop it into the correct folder (sorry, not at my computer so I can't check the name) inside the My LiveCode folder and it will be listed in the Libraries menu. It isn't drag-drop but it does provide an easy way to import commonly used images.

Edit: Here are more precise instructions. Go to wherever your "My LiveCode" folder is and look for /Resources/Icon Libraries. If there is no folder "Icon Libraries" then create one, and drop the stacks in there.

Restart LC and look in the Development menu for Image Library. When it opens, use the popdown menu to choose your custom library stack. From there you can use the normal interface to transfer any of the images to the current topstack.

[Klaus]

Wow, that is cool, thanks for the hint, Jacques!

[PaulDaMacMan]

You can set any stack to be a custom image library. Drop it into the correct folder (sorry, not at my computer so I can't check the name) inside the My LiveCode folder and it will be listed in the Libraries menu. It isn't drag-drop but it does provide an easy way to import commonly used images.

Edit: Here are more precise instructions. Go to wherever your "My LiveCode" folder is and look for /Resources/Icon Libraries. If there is no folder "Icon Libraries" then create one, and drop the stacks in there.

Restart LC and look in the Development menu for Image Library. When it opens, use the popdown menu to choose your custom library stack. From there you can use the normal interface to transfer any of the images to the current topstack.

Not sure, but I think you have to at least rename the stack to begin with rev+name (exp. revMyImagesStack.rev) and / or change its internal Stack name property. Perhaps image libraries are different (since the revimageLibrary stack script loads them), I'll check later.

[jacque]

I've got one in there that doesn't start with "rev" but they all do start with "Lib" so maybe that's the key.

[stam]

I've already done that, well like everything else it's a work in progress, it reads IconSVG library's arrays, has drag to place, and a simple export to SVG file.
SVG_Icons_Browser.rev.zip

Hi Paul,
thank so much for sharing this stack, it saved me a good few days (if not longer) of head-scratching, trying to figure out how to drag cross-stack. I've expanded on your code and made it self-contained and encapsulated as much as possible, so no other interface elements (hidden or not) are needed, and adds some features:

• It does not need the hidden image dragImage
• It does not need a button who's script is inserted into the front scripts
• It places the draggable control when double-clicked
• It sequentially numbers the placed controls on the target topLevel stack, e.g. control1, control2, control3 etc.
• It includes the functional script of the placed control where such is needed - this is a multiline comment at the end of the script which replaces the script of the draggable control when placed in the target stack, since different scripts are needed.
• For customisation of properties on placement (e.g. if trying to place a field, the lockText needs to be true and then reversed when placed), this is abstracted to a handler to avoid code duplication for drag/drop and double-click.

Hopefully one script to rule them all

To make a control draggable (or double-click to place), I just put this script into the control to be dragged/placed (usually a group control) and the script it should have when placed on a stack is in the multiline comment at the end.

It does need to be on a palette or other non-topLevel stack if aiming to double-click to place (or it will place in same stack).
This is formatted to take advantage of Bernd's code-folding solution, hence the #< and #</ tags:

Code: Select all

#< --------------- DRAG & DROP ----------------- >
# drag&drop modified from code by PaulDaMacMan -- https://forums.livecode.com/viewtopic.php?f=9&t=34295&start=15#p223232

local sDestStack, sDestLocation, sDragImage, sControlToDrag, sScript

command init
    put the long id of me into sControlToDrag
    put line item 1 of getScriptStartAndEnd() to item 2 of getScriptStartAndEnd() of the script of me into sScript
end init

on mouseDown
    local tXOffset, tYOffset, tImage
    lock screen
    init
    put the clickH - the left of me into tXOffset 
    put the clickV - the top of me into tYOffset
    set the dragImageOffset to tXOffset,tYOffset 
    
    export snapshot from sControlToDrag without effects to tImage as PNG
    create invisible image "dragImage"
    put the long id of image "dragImage" into sDragImage
    set the text of image "dragImage" to tImage
    set the dragImage to the id of image "dragImage"
    
    set the dragData["private"] to sControlToDrag
    set the dragAction to "copy"
end mouseDown

on dragStart   
    insert script of me into front
end dragStart

on dragEnd
    local tControlToBeCopied, myNewControlID
    lock screen
    remove script of me from front
    
    if sDestStack is not empty then
        put the dragData["private"] into tControlToBeCopied
        set the defaultStack to sDestStack
        copy tControlToBeCopied to stack sDestStack
        put it into myNewControlID
        -- Adjust any properties of the new control
        set the loc of myNewControlID to the mouseLoc
        set the script of myNewControlID to sScript
        set the visible of myNewControlID to true
        set the name of myNewControlID to nextSequentialName()
        // specific for this object
        setControlProps myNewControlID
    end if
    
    if there is a sDragImage then delete sDragImage
end dragEnd

on dragMove x,y
    if the mouseStack is not empty  then
        if the mouseStack is not empty and the mode of  stack the mouseStack is 1 then
            set the dragAction to "copy"
            put the mouseStack into sDestStack
            put the mouseLoc into sDestLocation
        end if
    else
        put empty into sDestStack
        set the dragAction to "none"
    end if
    pass dragMove
end dragMove

on mouseUp
    if there is a sDragImage then delete sDragImage
end mouseUp
#</

#< ---------  PLACE ON DOUBLECLICK -------- >
on mouseDoubleUp
    if the topstack is not empty and "/rev" is not in the long name of the topstack then placeControl
end mouseDoubleUp

command placeControl
    local tControl, tName
    init
    if there is an sDragImage then delete sDragImage
    copy sControlToDrag to the current card of the topstack
    put it into tControl
    set the loc of tControl to the loc of the current card of the topstack
    set the visible of tControl to true
    set the name of tControl to nextSequentialName()
    set the script of tControl to sScript
    // specific for this object
    setControlProps tControl
end placeControl
#</

#< ------------------- UTILITIES -------------------- >
function nextSequentialName
    local tCard, tIDList, tField, F
    put the long id of the current card of the topStack into tCard
    repeat with x = 1 to the number of controls of tCard
        put the short name of control x of tCard into tField
        if the short name of sControlToDrag is in tField then
            if matchText(tField, "(\d)", F) then 
                put F into item (max(tIDList) + 1) of tIDList
            end if
        end if
    end repeat
    return the short name of sControlToDrag & (max(tIDList) + 1)
end nextSequentialName

function getScriptStartAndEnd
    local tStart, tEnd, tLength, tScript
    put the script of me into tScript
    put the number of lines of tScript into tLength
    repeat with  x = tLength down to 1
        if line x of tScript ="DO NOT MODIFY THIS LINE */" then put x-1 into tEnd
        if line x of tScript contains "/*  SCRIPT FOR CONTROL - DO NOT MODIFY THIS LINE" then
            put x+1 into tStart
            exit repeat
        end if
    end repeat
    return tStart & comma & tEnd
end getScriptStartAndEnd

command setControlProps pControl -- for properties that need to be set AFTER placing, eg:
    set the tooltip of field "field" of pControl to empty
    set the traversalOn of field "field" of pControl to true
    set the lockText of field "field" of pControl to false 
end setControlProps
#</


/*  SCRIPT FOR CONTROL - DO NOT MODIFY THIS LINE

### the placed control’s script in this space
### do not modify the actual comment markers

DO NOT MODIFY THIS LINE */

Works a treat! Thank you for the hugely useful code!
Stam

[PaulDaMacMan]

Cool, I borrowed some of that cross-stack-drag-drop code from some demo stack that I'd found on LiveCode shares site. I have reused it in a few different palettes now, I love me some drag & drop.
I actually have a newer version of this stack with a few more improvements, so I will have to compare scripts.
I very much like the idea of having this in a palette form, like an infinitely customizable 'User Tools'.
Thanks for posting!