Community widgets

Moderators: LCMark, LCfraser

[-hh]
VIP Livecode Opensource Backer
VIP Livecode Opensource Backer
Posts: 1780
Joined: Thu Feb 28, 2013 11:52 pm
Location: Göttingen, DE

Community widgets

Post by [-hh] » Wed Sep 28, 2016 11:28 pm

[#42] Community LCB widget SVGText v1.0.0
(SVGText v1.5.2 is now available as "fat" widget for LC 8 and 9, see
http://forums.livecode.com/viewtopic.ph ... 29#p172129 .)


Because the beta-extensions store doesn't work, I start a community extension collection here. Because there are already great widgets around, especially by Trevor DeVore on github, I start numbering with 42 :-)

SVGText is enclosed in a package "community.livecode.hermann.hhsvgtext.1.0.0.lce" that is enclosed in the zip.
There are detailed dictionary entries for the widget. Instead of a user doc you may play with the demo stack svgText-Demo.livecode, also enclosed in the zip.

This widget is for LC 8.1.1 (because the widget format was changed with 8.1.1).
Edit. For an enhanced version for LC 8 > 8.1.4 and another for LC 9 (which have again a different widget format): See this post.
There is now via that link v1.5.0 available that adds an 'click-through-transparency' option. The widget sends a message and you can use it or not for one or all widgets. For an example how to use it see the demo-stack that is also available with hh-un-installer.

It is a widget for displaying short pieces of TEXT (one line) as a svgPath (like svgIcon for symbols). Of course you can get the path and use it for the SVGIcon widget and now also vice versa. Fill ('background') and stroke ('foreground'/outline) can use color or pattern (images), see the demo stack.

INSTALLATION
  • [1] Download the zip-container from "Sample stacks" (or LivecodeShare) and unzip it.
  • [2] Start LC 8.1.1 or later and use the "plus" from Extension Manager (menu Tools) to load the package ( = .lce file).
  • [3] Restart LiveCode and use the demo stack for playing with all features (stack contains help).
Note. This is version 1.0.0 (of Oct 21, 2016) which is, because of its filesize, only available on "Sample Stacks" (from the toolbar) or LivecodeShare. Enclosed in the widget are three svgFonts and some patterns.
Attachments
svgText100.png
At left an svgIcon filled by a svgText-widget. At right 5 svgText widgets:
upper three use 'Text' as input, lower two an svgIcon path.
Frontmost widget has a script that allows to click through outside its
'transformed' rect, see the demo stack.
Last edited by [-hh] on Wed Oct 10, 2018 9:27 am, edited 17 times in total.
shiftLock happens

[-hh]
VIP Livecode Opensource Backer
VIP Livecode Opensource Backer
Posts: 1780
Joined: Thu Feb 28, 2013 11:52 pm
Location: Göttingen, DE

Re: Community widgets

Post by [-hh] » Sat Oct 01, 2016 11:52 pm

[#43] Community LCB widget ClockAround v1.0.1
(ClockAround_v1.2.2 is now available as "fat" widget for LC 8 and 9, see
http://forums.livecode.com/viewtopic.ph ... 29#p172129 .)

ClockAround is enclosed in an extension package "community.livecode.hermann.clockAround.1.0.1.lce" that is enclosed in the clockAround100.zip.
There are detailed dictionary entries for the widget. Instead of a user doc you may play with the demo stacks clockAround-test1 and clockAround-test2, also enclosed in the clockAround101.zip.

It is a widget for displaying an analogue clock by using Arcs, Balls or Hands (see the demo stack). The offset from UTC/GMT, the "time zone", is adjustable by any amount of seconds in the range -12*3600 to 12*3600. There are several options for the display (ticks, hours-/minutes-/seconds-color and 24 hours or 12 hours display.)
The inner disk of the clock is "FengShui-colored" (colors for a division of the day into 6 non-equal parts), in the attached image we are at "the evening light blue".

This widget is for LC 8.1.1 (because the widget format was changed with 8.1.1).
Edit. For a (slightly changed) version for LC 8 > 8.1.4 and another for LC 9 (which have again a different widget format): See this post


INSTALLATION
  • [1] Download the zip and unzip it.
  • [2] Start LC 8.1.1 or later and use the "plus" from Extension Manager (menu Tools) to load the package ( = .lce file).
  • [3] Restart LiveCode and use the demo stacks for playing with all features.
This is version 1.0.1 (of Oct 21, 2016). It uses a 'LCS-workaround' to get the correct local UTC-offset.
Attachments
clockAround101.zip
Contains the widget package (= .lce) v1.0.1 and a demo stack.
(38.95 KiB) Downloaded 187 times
clockAround3.png
Three "main" display examples: At top
the hands-display, then the balls-display
and at bottom the arcs-display.
Last edited by [-hh] on Wed Oct 10, 2018 9:26 am, edited 17 times in total.
shiftLock happens

[-hh]
VIP Livecode Opensource Backer
VIP Livecode Opensource Backer
Posts: 1780
Joined: Thu Feb 28, 2013 11:52 pm
Location: Göttingen, DE

Re: Community widgets

Post by [-hh] » Sun Oct 02, 2016 10:32 pm

[#44] Community LCB widget BezierClock v1.0.1

BezierClock is enclosed in an extension package "community.livecode.hermann.bezierclock.1.0.1.lce" that is enclosed in the bezierClock101.zip.
There are detailed dictionary entries for the widget. Instead of a user doc you may play with the demo stack bezierClock-test.livecode, also enclosed in the bezierClock101.zip.

This widget is for LC 8.1.1 (because the widget format was changed with 8.1.1).
Edit. For a (slightly changed) version for LC 8 > 8.1.4 and another for LC 9 (which have again a different widget format): See this post

It is a widget for displaying an analogue clock by using bezier curves as "hands" (see the demo stack). The offset from UTC/GMT, the "time zone", is adjustable by any amount of seconds in the range -12*3600 to 12*3600. There are several options for the display (ticks, hours-/minutes-/seconds-color and 24 hours or 12 hours display.)
The inner disk of the clock is "FengShui-colored" (colors for a division of the day into 6 non-equal parts), in the attached image we are at "morning green".
Optionally a date line (like the internet date) can be shown below the analogue bezier display.

Just tested: This widget doesn't work with the HTML5 standalone builder.

INSTALLATION
  • [1] Download the zip and unzip it.
  • [2] Start LC 8.1.1 or later and use the "plus" from Extension Manager (menu Tools) to load the package ( = .lce file).
  • [3] Restart LiveCode and use the demo stacks for playing with all features.
A widget just for fun!

This is version 1.0.1 (of Oct 21, 2016). It uses a 'LCS-workaround' to get the correct local UTC-offset.
Attachments
bezierClock101.zip
Contains the widget package (= .lce) v1.0.1 and a demo stack.
(35.51 KiB) Downloaded 173 times
bezierClockWidget.png
The clock displaying "morning green" (from 05:00 to 10:00)
bezierClockWidget.png (21.55 KiB) Viewed 9663 times
Last edited by [-hh] on Wed Sep 13, 2017 1:19 am, edited 12 times in total.
shiftLock happens

peter-b
Posts: 182
Joined: Thu Nov 20, 2014 2:14 pm
Location: LiveCode Ltd.

Re: Community widgets

Post by peter-b » Mon Oct 03, 2016 10:19 am

Wow, these are really awesome. I'm definitely going to mention them in this week's newsletter!

How are you finding programming in LCB compared to programming in LiveCode script?
LiveCode Open Source Team — @PeterTBBrett — peter.brett@livecode.com

[-hh]
VIP Livecode Opensource Backer
VIP Livecode Opensource Backer
Posts: 1780
Joined: Thu Feb 28, 2013 11:52 pm
Location: Göttingen, DE

Re: Community widgets

Post by [-hh] » Mon Oct 03, 2016 11:47 am

Because you ask.

I started LCB at August 20 (being still fully "fringed"). Read a lot in working widgets (LiveCode's and Trevor's). Got valuable tips from Bernd and read some of his (unpublished) widget's code.

Made my first widget LCD scroller (unpublished), then a second one, a polygon widget that has edit mode (unpublished). This was my first summary:
Horrible. Wordy as Applescript. Typing over typing. Variable names that are half a line long. And a lot of workarounds if one wishes to avoid LCS as much as possible in the widget's code.

Then I wrote the three widgets published here. This is my current summary:
I started to like it, to see the advantages. Every single path can have its own transformation matrix, lists are a wonderful tool. I even started to like the property inspector (does silently a great job). More precisely, I like it so much, that I dare to write:

The Top Three of things that I'm missing in the built-in handlers:
  • Setting the bounds and the rectangle of a widget, e.g.
    set my bounds to the effective bounding box of path mPath
  • Convert a list of numbers into a list of strings (Solved **)
  • Map a function, especially a transform, to a list (Solved **)
    e.g.
    map [3*x + x^2] to mList -- mList is a list of numbers x
    map [sin(x), cos(x)*y] to mList -- mList is a list of points (x,y)
    map tTransform to mList -- mList is a list of points
Now I'm looking forward to the foreign languages interface.

And I hope others will also contribute here (if not at github) with widget samples.

___
** See Community widget #42 and Community widget #47.
Last edited by [-hh] on Fri Nov 04, 2016 2:52 am, edited 3 times in total.
shiftLock happens

MaxV
Posts: 1540
Joined: Tue May 28, 2013 2:20 pm
Location: Italy
Contact:

Re: Community widgets

Post by MaxV » Mon Oct 03, 2016 1:02 pm

Here is the link for Trevore git hub page: https://github.com/trevordevore/livecode-extensions
:D
Livecode Wiki: http://livecode.wikia.com
My blog: http://livecodeitalia.blogspot.it
To post code use this: http://tinyurl.com/ogp6d5w

mwieder
VIP Livecode Opensource Backer
VIP Livecode Opensource Backer
Posts: 2695
Joined: Mon Jan 22, 2007 7:36 am
Location: Berkeley, CA, US
Contact:

Re: Community widgets

Post by mwieder » Mon Oct 03, 2016 5:39 pm

Ha! I love the Bezier Clock!
Completely useless as a clock, it makes my head hurt trying to see what time it is, but I love it anyway.
I can't help myself.
Now I want a Dali clock.

[-hh]
VIP Livecode Opensource Backer
VIP Livecode Opensource Backer
Posts: 1780
Joined: Thu Feb 28, 2013 11:52 pm
Location: Göttingen, DE

Re: Community widgets

Post by [-hh] » Tue Oct 04, 2016 1:03 am

[#45] (currently empty)

LCB snippet (was #45 here):
Convert number to 'number-formatted' string.
has moved to Community snippets #43.
Last edited by [-hh] on Tue Nov 01, 2016 4:13 am, edited 5 times in total.
shiftLock happens

[-hh]
VIP Livecode Opensource Backer
VIP Livecode Opensource Backer
Posts: 1780
Joined: Thu Feb 28, 2013 11:52 pm
Location: Göttingen, DE

Re: Community widgets

Post by [-hh] » Tue Oct 04, 2016 2:23 am

[#46] Community LCB widget DigitClock v1.0.1
(DigitClock_v1.2.1 is now available as "fat" widget for LC 8 and 9, see
http://forums.livecode.com/viewtopic.ph ... 29#p172129 .)

DigitClock is enclosed in an extension package "community.livecode.hermann.digitclock.1.0.1.lce" that is enclosed in the digitClock101.zip. The zip also contains a simple demo stack digitClock-test.livecode that contains three copies of the widget (see also the image below).

This widget is for LC 8.1.1 (because the widget format was changed with 8.1.1).
Edit. For a (slightly changed) version for LC 8 > 8.1.4 and another for LC 9 (which have again a different widget format): See this post

It is a widget for displaying a digital clock using the same format as the internet date from LCS. The offset from UTC/GMT, the "time zone", is adjustable by any amount of seconds in the range -12*3600 to 12*3600. Choosing the local date gives what you are used to have as the internet date.
There are several options for the display (date-/stroke-/fill-color and choosing the textFont). The frame (and optionally the text) of the clock is "FengShui-colored" (colors for a division of the day into 6 non-equal parts), in the attached image we are at "evening light blue". There are detailed dictionary entries for the widget.

Just tested: This widget doesn't work with the HTML5 standalone builder.

INSTALLATION
  • [1] Download the zip and unzip it.
  • [2] Start LC 8.1.1* or later and use the "plus" from Extension Manager (menu Tools) to load the package ( = .lce file).
  • [3] Restart LiveCode and use the demo stack for playing with all features.
This is version 1.0.1 (of Oct 21, 2016). It uses a 'workaround' to get the correct local UTC-offset and the correct platform from LCS.

----
* On Linux (Mint) the widget works but only unrotated, I don't know why. (Reported as bug)
Attachments
digitClock101.zip
The widget package (=*.lce file) and a demo stack.
(27.25 KiB) Downloaded 201 times
digitClock100.png
Three widgets displaying different UTC-offsets
and according to time FengShui-colored frames.
Last edited by [-hh] on Wed Oct 10, 2018 9:28 am, edited 8 times in total.
shiftLock happens

[-hh]
VIP Livecode Opensource Backer
VIP Livecode Opensource Backer
Posts: 1780
Joined: Thu Feb 28, 2013 11:52 pm
Location: Göttingen, DE

Re: Community widgets

Post by [-hh] » Mon Oct 17, 2016 3:16 pm

[#47] Community LCB widget hhPolygon v1.0.0
(Polygon_v1.2.1 is now available as "fat" widget for LC 8 and 9, see
http://forums.livecode.com/viewtopic.ph ... 29#p172129 .)

hhPolygon is enclosed in an extension package "community.livecode.hermann.hhpolygon.1.0.0.lce" that is attached in the partitioned zip below. Use my utility stack "fileSplitAndJoin" for joining the parts of the zip: (Raspi stacks collection (#82)).

This widget is for LC 8.1.1 (because the widget format was changed with 8.1.1).
Edit. For a (slightly changed) version for LC 8 > 8.1.4 and another for LC 9 (which have again a different widget format): See this post

It is a widget that offers a SVG-polygon, starting from a regular polygon with <N> vertices ('points'). You can then choose an editMode and drag the vertices or add or delete vertices .
There are several options for the display (stroke-/fill-color , stroke-/fill-pattern).
The pattern is a (scaled or replicated) image, so you can use the widget as a frame for your images.
There is also an option to start from regular star polygons (you can choose their 'Schläfli symbol'). I added a demo stack, look at the beauty of math there.

INSTALLATION
  • [1a] Download the parts of the zip.
  • [1b] Join them using the utility stack ("fileSplitAndJoin"). Remove then the extension "-joined".
  • [1c] Unzip the joined file. You'll get an .lce file and the demo stack.
  • [2] Start LC 8.1.1 or later and use the "plus" from Extension Manager (menu Tools) to load the package ( = .lce file).
  • [3] Restart LiveCode and use the demo stacks for playing with all features.
This is version 1.0.0 (of Oct 21, 2016). It has several (unvisible) enhancements.
Attachments
hhPolygon100.png
Left-1: A 'connect the dots' 16-gon, color-filled transparent, color-stroked
Left-2: A regular star polygon (Schlaefli symbol 7_3), pattern-filled, color-stroked
Left-3: A transformed 17-gon, pattern-filled (scaled), pattern-stroked (unscaled)
Right-1: Two basic polys, pattern-filled, color-stroked, the right one in editMode
Right-2: A 'default' widget, starting from a regular octagon, in editMode
Right-3: A widget, starting from a regular 24-gon, in editMode
Right-4: A widget, starting from a regular 64-gon, looks already close to a circle
polygonWidget100.zip001.part.zip
Part of a zip, has to be joined before unzipping.
(244.14 KiB) Downloaded 194 times
polygonWidget100.zip002.part.zip
Part of a zip, has to be joined before unzipping.
(97.18 KiB) Downloaded 193 times
Last edited by [-hh] on Wed Oct 10, 2018 9:29 am, edited 3 times in total.
shiftLock happens

[-hh]
VIP Livecode Opensource Backer
VIP Livecode Opensource Backer
Posts: 1780
Joined: Thu Feb 28, 2013 11:52 pm
Location: Göttingen, DE

Re: Community widgets

Post by [-hh] » Tue Oct 25, 2016 1:08 am

Other community contributions:

Calendar widget (by Bernd, based on LC-Elanor's widget)
SVG-colorIcon widget (by pthirkell, based on LC's SVGIcon widget)

Not a widget, but not to forget when using SVG Icons: The SVG Clip Art Stack (by ClipArtGuy).
shiftLock happens

[-hh]
VIP Livecode Opensource Backer
VIP Livecode Opensource Backer
Posts: 1780
Joined: Thu Feb 28, 2013 11:52 pm
Location: Göttingen, DE

Re: Community widgets

Post by [-hh] » Sat Oct 29, 2016 11:48 pm

  • LCB snippet (was #48 here):
    Create a matrix of rectangles of constant size
    has moved to Community snippets #44.
  • LCB snippet (was #49 here):
    Create a list of a range of numbers (as strings or numbers)
    has moved to Community snippets #45.
shiftLock happens

[-hh]
VIP Livecode Opensource Backer
VIP Livecode Opensource Backer
Posts: 1780
Joined: Thu Feb 28, 2013 11:52 pm
Location: Göttingen, DE

Re: Community widgets

Post by [-hh] » Sun Nov 06, 2016 12:06 pm

[#48] Community LCB widget convexHull v0.1.4

This is sort of an 'educational widget', illustrating the convex hull ('rubber band enclosure') of a set of points. The main parts are a 'lite' version of widget #47 ('hhPolygon') and snippet #49 (the convex-hull-algorithm). A LC-Script counterpart of this 'demo' is Raspi stack #84.
  • You start with a regular polygon.
  • You have an edit mode where
    • you can interactively move the points by dragging,
    • you can add a point or remove a point by RightClicking a point.
  • If not in editMode drag the widget with RightMouseDown.
  • Colors and stroke width are adjustable, you can also set the points of the polygon (= the set of points) by script (see dictionary) or by copy and paste in the property inspector/Contents.
  • While editing or dragging the polygon, the convexHull (the 'rubber band' around the points) is updated.
INSTALLATION
  • [1] Download the zip and unzip it.
  • [2] Start LC 8.1.1 or later and use the "plus" from Extension Manager (menu Tools) to load the package ( = .lce file).
  • [3] Restart LiveCode, drag the widget to a (new) stack and have fun.
This widget is for LC 8.1.1 (because the widget format was changed with 8.1.1).
Edit. For a (slightly changed) version for LC 8 > 8.1.4 and another for LC 9 (which have again a different widget format): See this post
 
Attachments
community.livecode.hermann.convexhull.0.1.4.lce.zip
(25.78 KiB) Downloaded 179 times
convexHullWidget.png
convexHullWidget.png (17.74 KiB) Viewed 9019 times
Last edited by [-hh] on Sat Sep 16, 2017 3:14 am, edited 1 time in total.
shiftLock happens

[-hh]
VIP Livecode Opensource Backer
VIP Livecode Opensource Backer
Posts: 1780
Joined: Thu Feb 28, 2013 11:52 pm
Location: Göttingen, DE

Re: Community widgets

Post by [-hh] » Sat Nov 12, 2016 4:07 am

[#49] Community LCB widget hhProgress v1.0.0
Progress_v1.3.0 is now available as "fat" widget for LC 8 and 9, see
http://forums.livecode.com/viewtopic.ph ... 29#p172129 .
 
progress130.png
v130 adds the option to display the percentage as text
progress130.png (7.01 KiB) Viewed 382 times


hhProgress is enclosed in an extension package "community.livecode.hermann.hhprogress.1.0.0.lce" that is attached in the zip below.

This widget is for LC 8.1.1 (because the widget format was changed with 8.1.1).
Edit. For a (slightly changed) version for LC 8 > 8.1.4 and another for LC 9 (which have again a different widget format): See this post

It is a widget that offers a rectangular (horizontal or vertical) or circular/elliptical progress display.
You configure the widget in the property inspector (or by script) using options for the shape, several colors, roundrect radius, stroke width and using background. There is also a demo mode (for previewing). I added a demo stack with usage examples (incl. LCS-scripts).

Once configured to your taste there is only one line you have to give:

Code: Select all

-- pNum is any expression that evaluates to a number in range 0-100
set percentage of widget wName to <pNum>
Usage example for indicating the progress of a loop.

Code: Select all

on mouseUp
  lock screen; lock messages
  put 10000 into N; put N div 500 into n0
  repeat with j=1 to N
    wait 2 millisecs -- an action here
    if j mod n0 = 0 then
      unlock screen
      set percentage of widget "progress_0" to 100*j/N
      lock screen
    end if
  end repeat 
  set percentage of widget "progress_0" to 0
end mouseUp
Of course, showing progress always needs a some time ...

INSTALLATION
  • [1] Download the attached zip and unzip it.
  • [2] Start LC 8.1.1 or later and use the "plus" from Extension Manager (menu Tools) to load the package ( = .lce file).
  • [3] Restart LiveCode and use the 'hhProgress-demo' stack, that is also attached in the zip, for testing all features.
Some hints.
  • Resize the widget with pointer tool and shiftKey down to get a proportional resizing.
  • Resize with pointer tool and optionKey down to get a shape of equal width and height.
  • Drag with pointer tool and optionKey down to 'duplicate' the widget (may be the copy loses some properties).
  • The rectangle progress moves (increasingly) left-right or bottom-up, depending on the chosen width and height.
  • This can be enabled/disabled:
    Drag the widget by mouseDown. RightClick the widget for a menu of basic options.

This is version 1.0.0 (of Nov 12, 2016).
Attachments
hhProgress100.zip
(29.45 KiB) Downloaded 181 times
hhprogessHVE.png
Three different displays of widget hhProgress
hhprogessHVE.png (10.67 KiB) Viewed 8855 times
Last edited by [-hh] on Wed Oct 10, 2018 9:34 am, edited 2 times in total.
shiftLock happens

Zryip TheSlug
VIP Livecode Opensource Backer
VIP Livecode Opensource Backer
Posts: 145
Joined: Tue Jan 26, 2010 10:15 pm
Contact:

Re: Community widgets

Post by Zryip TheSlug » Tue Nov 22, 2016 12:52 pm

[#50] Community LCB orientable text v1.0.0

A simple "orientable label" widget with the following parameters:
- label
- font name
- font size
- font color
- background color
- orientation
- label opacity (a value from 0 to 1)
- background opacity (a value from 0 to 1)

My original intention was to place a rectangle behind the text and to orient text and rectangle with the same angle, but I never found the solution. Either I have the text and a rectangle which is behaving as it want. Either I have the rectangle oriented but no text (presumably behind the rectangle). If someone has an idea on how to group the both element and to apply the translation to the group, he/she is welcome.
Attachments
orientabletext.lcb.zip
(2.15 KiB) Downloaded 149 times
TheSlug
http://www.aslugontheroad.com - Tutorials, demo stacks and plugins for LiveCode
Data Grid Helper - An intuitive interface for building LiveCode's Data Grids
Excel Library- Extends the LiveCode language for controlling MS Excel

Post Reply

Return to “LiveCode Builder”