Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Seems like there are not many issues #28

Open
danzen opened this issue Jul 23, 2018 · 9 comments
Open

Seems like there are not many issues #28

danzen opened this issue Jul 23, 2018 · 9 comments

Comments

@danzen
Copy link
Owner

danzen commented Jul 23, 2018

We tend to deal with issues through our Slack channels at http://zimjs.com/slack. You are welcome to join! If you use ZIM, then you should join. The updates on these issues can be found here http://zimjs.com/updates.html. You can see that there is very active progress at all times - these correspond to the updates in the code here. You are still welcome to submit an issue here if you like.

@danzen
Copy link
Owner Author

danzen commented Jun 3, 2019

This is an example of about 3 months of updates and issue solves - just in case you are here and did not go to the updates page:

ZIM 10.4.0
TEN PAGE
https://zimjs.com/ten.html
Updated TEN page to show links to various updates to ZIM TEN

LIST WITH CHECKBOX
https://zimjs.com/ten/listcheckbox.html
Added checkBox parameter to List to use checkboxes in list - thanks Dale789 for the prompting!
Added checkBoxes property to List to give a read only array of checkBoxes
Added a checkBox property to a list item like list.selected.checkBox to give access to an item checkBox
Added the following three methods to manipulate checkBoxes:
setCheck(index, type) - set the CheckBox at an index to true or false (the type parameter)
setChecks(type) - set all CheckBoxes to true or false (the type parameter) returns object for chaining
getCheck(index) - get the checked value of the CheckBox at an index
Added tap parameter to CheckBox to activate on tap - good for List and Window when dragging
Added toggle(type) to CheckBox and toggled property - same as setChecked and checked but consistent with others

PATH TRAVERSE
https://zimjs.com/ten/traverse.html
Added a traverse() method to Blob and Squiggle to animate an object between points of the path
Added a "traversed" event that is dispatched when a traverse() ends
To traverse backwards past start or forward past end of Blob use two traverse calls
Thanks KV for the experimentation and requests.
IMPROVEMENT Fixed up animate() along path so it properly resets internal pathRatio and tween with stopAnimate() called
this is important when doing multiple animations along path.
Set this to reset only with path or dynamic animation - watch out for color animation
Color seems to work but may have issues with multiple color animations on same object

THREE - RETINA - IMPROVEMENT
ZIM three_2.0.js has launched to work with retina
The namespace is now optional and works like new Three();
See https://codepen.io/zimjs/pen/qGPVqO

PIZZAZZ 3 - RETINA - IMPROVEMENT
Adjusted pizzazz_03 to work with retina
https://zimjs.com/patterns.html
Tidied up setMask() for retina - was not working if mask had same parent as object.
This fixed the ProgressBar() in retina
This is an odd localToLocal issue since retina - we will keep an eye on it.

ANIMATE REPLAY TWEEN - PATCH
Added a clean parameter to animate() that can be set to false to not delete the tween when done
This allows percentComplete to be adjusted and target.pauseAnimate(false) to play tween
Note - percentComplete does not include waited once waited period has passed
So to restart a tween that has a wait use replayTween - see below.
Added target resetTween() and replayTween()
resetTween() will reset the properties of the target to the original values before the last tween
replayTween() will reset the properties and play the last tween
Note - only replays the last tween of a series and probably does not work on sequence animation

GENERAL
Fixed zta() so it does not break in IE11 - as there is no console.table()

PATCHES
Patched animate() in series mode to make sure last animate object call is called - thanks Yalon for the find
Patched animate() series to remove first animation in animate series when a wait is present
this was causing subsequent series animations to not have the correct idSet id for stopping
Made animate() override any paused properties so not unpausing Sprites to cause CreateJS Sprite animation
Tested animation page and NIO dynamic animations
BREAK - adjusted centerReg() and center() to center on the origin of a container that has no bounds set
Made Label() text parameter accept ZIM PICK object
Fixed Pane() close if no stage to update
BREAK fixed width and height, widthOnly and heightOnly to be absolute value (positive) if scale is negative (strange we missed this for so long!)
Fixed Tile() mirrorH and mirrorV and align, valign with scaled objects
Fixed Frame() loadAssets queue version of "assetload" event - there was a typo in the event dispatch - working now...
Added a controls property to transformControls that references the controls
Added data parameter to Loader save() method - set to true to return Base64 string instead of file saving image - thanks Ami Hanya
Adjusted Circle, Rectangle, Triangle, Squiggle and Blob to clone gradients (when using direct linearGradient() and radialGradient() methods)
Fixed Keyboard < > x vertical spacing
Fixed Keyboard cursor placement - was using globalToLocal on CreateJS Text field - which is broken in retina
Fixed Label backing so that pattern gets saved under backing property and properly centered when label is centered
Also removed stage scale setting in Pizzazz 3 that was incorrectly added to retina

Updated ZIM Docs, Code page, Distill, Bubbling Videos, Templates, GitHub, NPM, TypeScript
Updated GitHub ReadMe intro page - please STAR us on GitHub if you can - thanks - we are trying to build awareness.
Whew - thank goodness for Patreon! https://www.patreon.com/zimjs - never any pressure - using ZIM is the biggest reward!

ZIM 10.3.1
Added strokeObj parameter to ZIM Shapes Circle, Rectangle, Triangle, Blob, Squiggle
which defaults to {caps:"butt", joints:"miter", miterLimit:10, ignoreScale:false}
https://zimjs.com/explore/strokes.html
Added radialGradient() and linearGradient() methods to Circle, Rectangle, Triangle, Blob
These just call the colorCommand versions which are still there
Note - must update about 100 Rectangle, Circle and Triangle occurences in ZIM otherwise get a recursive style error in group style
Note - to apply gradients to the border use the borderColorCommand (we do this less often)
IMPROVEMENT Fixed setMask on ZIM shapes to handle masking objects in non 0,0, scaled and rotated containers
Note: getConcatenatedMatrix().decompose() must have scales divided by stage scale in retina setting
Cloned label backing from STYLE so can set same backing on multiple labels - thanks Valeria Valoueva for the prompting
Added still parameter to reg() to set x and y so object does not move when reg is set - thanks Vishwas Gagrani for suggestion
Fixed up missing parameters at end of Blob and Squiggle clone
IMPROVEMENT Removed extra space at end of List when removeAt() is used
IMPROVEMENT Fixed up List accordion setting indent glitch since 10.0.1 - thanks Alicia Martin for the find
We had added a backing rectangle for the list elements and this broke indenting after a second time (put a backing on a backing!)
Added shiftHorizontal and shiftVertical to STYLE of Button - goes through to the label parameters...

Updated CDN, Distill, TypeScript, NPM, Templates, Code Page, Docs

ZIM 10.3.0
RETINA - IMPROVEMENT
https://zimjs.com/retina.html
Added a retina parameter (default true) to scale the stage with devicePixelRatio
Scaling the stage rather than the canvas works very well for scaling vectors up
This is the technique that Adobe Animate uses - see the next section for issues.

ADOBE ANIMATE - IMPROVEMENT
https://zimjs.com/animate.html
ZIM now provides a ZIM SHIM that lets ZIM work within Adobe Animate without ZIM Frame.
This is a standard Animate Publishing template with a few lines of ZIM code added.
ZIM was mostly supported in Animate but now, various issues below have been solved.

Adobe Animate scales the stage - which affects globalToLocal, localToGlobal, localToLocal.
ZIM now overrides these with fixes and dozens of changes have been made as follows:

  1. Basically localToGlobal needs its resulting point to be divided by the stage scaleX and scaleY.
    globalToLocal needs its input point multiplied by the stage scaleX and scaleY
    localToLocal needs to call these - but not the GlobalToLocal if the object is on the stage directly - sigh.

  2. BREAK Mouse even object e.stageX, e.stageY, e.rawX, e.rawY need to be divided by the stage scaleX and scaleY.

  3. stage.getObjectUnderPoint() needs to use the x and y multiplied by stage scale
    unless you are using e.stageX and e.stageY which would normally be divided by stage scale
    so the result is you can pass e.stageX and e.stageY directly in to getObjectUnderPoint without any changes

  4. Adjusted scaleTo() to assume stage is scale of 1 with stage.width and stage.height matching what is set.

  5. Shapes are still positioned as if on an unscaled stage for hitTests.
    So any x and y values need to be multiplied by the stage scale before doing a globalToLocal
    into the shape to counter the globalToLocal expecting a 1 scale stage.

  6. getConcatenatedMatrix() needs to have resulting values divided by stage scale

OTHER ADOBE ISSUES
7. The CreateJS MovieClip does not have the ZIM fixes to globalToLocal, localToGlobal and localToLocal
So create a ZIM Container with bounds of the MovieClip and add the MovieClip to the container.
From then on, use the ZIM Container to drag, transform, hitTest, etc.

  1. Adobe Animate is running an older version of CreateJS that does not automatically recalculate (previously specified) bounds when set to null.
    This causes Tab heights to miscalculate which effects List, etc.
    So adjusted Tabs to test for old CreateJS and not expect bound recalculation.

  2. There seems to be a problem with hitArea (expand()) on cached objects so adjusted use one or the other

SQUIGGLE AND BLOB PATH - IMPROVEMENT
https://zimjs.com/hittestpath.html
More updates to path control to help out with Shape Tween which was launched in 10.2.0:

  1. Added addPoint(), addPoints() and interpolate() methods to squiggle and blob
    To add a point at a percentage, or add a number of points between points
    Or get the data for any number of points - used by hitTestPoint
    interpolate could be used to set dynamic bounds on Blob and Squiggle
    which would lead to setting a drag Boundary - like the general drag() has.
    So look for this in future versions of ZIM.

  2. We could shape tween between shapes with a different number of points
    but for now, use the addPoint() manually so the number of points are equal.
    This will usually result in better shape tweens than trying to guess where to automatically add a point.
    But we may look into how that might be done via an algorithm.

  3. Added hitTestPoint(num) to do a hitTest of any object shape along a Squiggle or Blob path!

  4. Adjusted the editPoints parameter so true adds points only to the edge.
    Followed this amazing interactive tutorial - thanks Gabi
    https://codepen.io/enxaneta/post/how-to-add-a-point-to-an-svg-path
    When we do, it adds the point and adjusts the points next to it - for no overall path adjustment.
    Thanks Sam Van Herck for the promptings.
    If you want the original adding points anywhere - use editPoints:"anywhere"
    At which point, it adds a point with controlType "none".
    Added two properties to adjust accuracy vs. speed of adding points:
    addPointFactor - (default 20) used when placing new points along edge (editPoints is true)
    divides the distance between points by this amount - the smaller the more accurate but also slower
    addMinDistance - (default 15) edge press needs to be within this distance to add a point to the edge

GENERAL
Added offStage parameter to drag() - set to true to be able to drag the object off stage - thanks Shammi for the idea!
Adjusted Stage and StageGL to accept a canvas tag as well as the traditional canvas tag ID.
Added rgb and rgba support to ColorPicker - thanks Ami Hanya for the promptings
The rgba alpha now adds a start alpha for startBackgroundColor - if rgba is used in a color list the alpha is ignored
Added rectIntersect(a,b,margin) function to code module which returns true if rectangles intersect
Added boundsAroundPoints(points) function to code module to get a rectangle around an array of points
These are used by Blob and Squiggle and hitTestPath
Fixed Blob "circle", "rectangle", "triangle" points parameter values to use radius setting as well.
Fixed "rectangle" to be centerReg() for Blob IMPROVEMENT
Fixed slight spacing issue with hitTestGrid() IMPROVEMENT
Undecided how to treat setting bounds width or height to 0
it means that width and height can't be set as they adjust the scale and we divide by 0
So adjusted Tabs to overwrite the width if width is 0
Added blur event to Window to stop drag if browser window loses focus - thanks Ami Hanya
To turn this on, set the List or Window cancelCurrentDrag parameter to true
Seems that maybe mobile was not handling transform controls properly due to getObjectUnderPoint test IMPROVEMENT
So removed this requirement for mobile - means objects overlayed on transforms may trigger transforms on
This was a rare issue and more of a perfectionist fix...
The getObjectUnderPoint is working in a simple case on mobile but not in the complexities of transform().
Adjusted drag() slidestop event to not trigger if object is just clicked on and has not been moved - thanks Frank Los for the report.

PATCHES - added support for receiving SVG path format in the ZIM Squiggle and Blob points parameter
Adjusted animate() drag for path with Squiggle and Blob according to the technique found here https://codepen.io/eliCrow/pen/MLdddR
See the ZIM version: https://codepen.io/zimjs/pen/GLLvoP
automatically set ease to "linear" when dragging on Blob or Squiggle - it is the only ease setting that works
fixed TextArea, Tag and Loader to scale and place properly with retina - CreateJS DOMElement was scaling the tags when the stage scaled
Tried to fix the outline property of Label - since it is a CreateJS object, the localToGlobal is off - may have to recode for exotic label settings
Fixed Label outline parameter to work with labelWidth and labelHeight set - thanks Ami Hanya for pointing it out
Patched Timer in a few places for game_2.0 with respect to ending time
Updated SVGContainer to set splitTypes default false like the docs say
Made Waiter dispose() remove waiter from stage - thanks Ami Hanya
Fixed up Distill to work with centering with STYLE - zob() in distill needs to be kept up-to-date (was missing something we added for STYLE and ZIMON)
Fixed Pick class to properly work with Distill - needed to record static methods being used
Changed obj.setBounds() to obj._bounds = null; to support pre version 1 CreateJS code (like current Animate export)

Updated CDN, GitHub, Distill, Code page, Templates, TypeScript, NPM, Bubbling vids, Site, Tips, Social Media, Blog, Promo Ads.

ZIM 10.2.0
ZIMON
See https://zimjs.com/zimon/
Similar to JSON, ZIMON stands for ZIM Object Notation
It turns any object to a string using ZIMON.stringify(object)
It turns a ZIMON string back into and object using ZIMON.parse(string)
The object can be on its own or inside an array [] or an object literal {}
These can be nested and filled with any type of object (that is prepared**)
** ZIMONON (default false) must be set to true to properly ZIMON.stringify()
this prevents the slight memory cost if not using ZIMON (95% of the time)

KEY
An optional key object can be used to specify the scope of the class
and to specify which properties to store for objects made from a class.
The scope must be a string accessible from where you stringify - it can contain dots (.)
The key can be passed as the second parameter to ZIMON.stringify().
The key is sent in the ZIMON string and nothing extra is needed when parsing.

PURPOSE
The purpose is similar to JSON - to save to localStorage or databases or share between languages.
Indeed, the final ZIMOM format is JSON.
Like JSON, ZIMON can be used outside of ZIM and outside JavaScript if implemented in another language.
See https://github.com/danzen/zimon/ for generic JS code to port to other languages.

** PREPARED OBJECTS
Any objects NOT supported by JSON must be prepared
so objects other than string, number, array, object literal, boolean or null
need to have the following:
1. A type property that matches the class name as a string
2. An arguments property that holds an array of the arguments passed to make the object
The ZIM Objects are already prepared - so no extra work is required

See ZIMON in use here in an updated version of https://zimjs.com/iso/
ZIMON - adjusted zob() to record arguments of any class when ZIMONON is true

SHAPE TWEEN IMPROVEMENT
See: https://zimjs.com/animation/shapetween.html
ZIM now supports built in animation from one Squiggle to another or one Blob to another
This is built in to animate() as a convenience property called shape:
squiggle.animate({shape:secondSquiggle}, 1000);
There is also a blobShift convenience property that cycles the target points (positive or negative)
blob.animate({shape:secondBlob, blobShift:2}, 1000);
The Blobs or Squiggles need to have the same number of points

BLOB BASIC SHAPES IMPROVEMENT
See: https://zimjs.com/animation/shapetween.html
ZIM Blobs points parameter now accepts shape values of "circle", "rectangle", "triangle"
or a custom ZIM Circle, Rectangle or Triangle object to match.
This makes it easier to shape tween, path animating/dragging/labelling, etc. with basic shapes

GENERAL
Added expand to STYLE functions
Adjusted animate to properly represent the percentComplete property on the target. IMPROVEMENT
This needed to be applied after animation starts to catch rewind percentage, etc.
See https://zimjs.com/explore/squigglepart.html
added a read-only adjusted property to Triangle as to what the adjust parameter was set at
IMPROVEMENT added {passive:false} to zil() events to avoid another Chrome protective console warning (sigh)
added a series type to series functions
noted that header('Content-type: text/javascript'); needs to be added to PHP calling async
again to avoid a new warning in Chrome console (sigh)
Fixed internal id number in SVGContainer to work properly with Distill
Fixed doc on LabelToPath so showPath is true to start
Fixed Toggle("ON") example to Toggle({label:"ON"})
and took away selected property - use text property instead as read-only what text is selected BREAK
IMPROVEMENT Dozens of circle component parts were adjusted to accommodate new percent parameter in Circle
IMPROVEMENT Tidied up hov() mouseovers and cursor settings

Updated CDN, Templates, Distill, Code Page, TypeScript, NPM
Bubbling videos, blog post and social media coming soom

ZIM 10.1.0
ZIM TEN SITE
The ZIM TEN site is finished and has been well received.
A few logos on secondary pages are still the last ZIM logo.
We will get to those soon.
There were a few overlaps on Mobile - if you see anything, let us know at
https://zimjs.com/slack - thanks to Jade for catching the glitches!

GAME MODULE - VERSION 2
https://zimjs.com/iso/
Updated Game Module to 2.0 - and added the Game Module to bottom of Docs.
You still need to import (script tag) the game_2.0.js file to use.
Added Board(), Person(), Orb(), Tree(), Timer() and Scorer() classes.
They let you make tile games in top or isometric view.
A relatively comprehensive example is at https://zimjs.com/iso/
There is not much of a game there but it uses most of the parts.
This is somewhat based on https://zimjs.com/carboon/
which has NOT been updated to the new Game module - but shows potential.
IMPROVEMENT The Docs now include the GAME module at the bottom in purple.
The Board class is quite well featured with over 20 parameters and more than 60 properties and methods.
It is designed to optionally work with path finding such as EasyStar.
The board supports info that can be bigger than the board.
Then a camera can be moved with swiping or arrows.
Pieces can be moved around the board with keys or with pathfinding.
Advanced filters on data, color, icons, items and rows is available
for finding random tiles, keying to certain tiles, removing certain items, etc.
Game Module: PATCHED - LeaderBoard colors to match color being font and backgroundColor being shape. BREAK
Added backdrop to LeaderBoard that closes LeaderBoard if clicked off LeaderBoard
Added multiple domain support when signing up for LeaderBoard - just use commas between domains
CodePen is running pens on different domains so can try: cdpn.io,s.codepen.io for domain.

STYLE FOR CONTROLS IMPROVEMENT
STYLE has been added to Pages(), Layout(), Grid(), Guide(), Tile(), Pen(), Emitter(), Scroller(), and Dynamo()
Here is our test page: https://zimjs.com/test/styles.html
Also added loc functionality for STYLE in general
STYLE = {loc:10} // will put everything at 10 - or target type or group, etc.
STYLE = {loc:{x:10, y:10}} // will put everything at 10, 10

ZIM NPM
Added ZIM and CreateJS to NPM - Node Package Manager
Use with Browserify to make Browser ready
See https://zimjs.com/npm.html

ZIM MVC
Added a template for ZIM Model View Controller
See https://zimjs.com/mvc.html

GENERAL
Added duplicate() chainable method to clone() and copy any custom properties - thanks Ami Hanya for the suggestion
Fixed SVGContainer and Circle to show up properly when viewing the code from the Docs.
Added isometric swiping to Swipe as fourth parameter to work with Game Module Board({isometric:true})
Made hov() automatically set cur() and set cur("default") when hov(-1)
IMPROVEMENT Fixed pages jumping to left when going back to landscape on apple ipad - thanks Frank Los for prompting
Fixed physics when dispose() and go to make a new Physics()
Fixed Physics noDrag() when already dragging - thanks Ami Hanya for the prompting
Added index property to Pages - that gives the index of the current page in pages
fixed contact() to work on new physics when previous physics is disposed
will still need to reset contact() on new physics
BREAK - for Toggle(), removed toggle.selected and changed toggle.text to show selected text or "on", "off" if no Label
IMPROVEMENT Fixed cloning of Tile - was removing first object as we tried to let objects with ZIK clone with ZIK
Solution was to clone objects having a clone but not cloning ZIK objects.
Added loc to Distill custom select functions - caused it to be missing in customize feature for docs

This has been a large undertaking over the last month... well and five years.
Your support on Patreon at https://patreon.com/zimjs is always appreciated.
We were dinged for a $200 bill from Amazon with 5 Million views a day.
So we are thinking of moving the CDN to CloudFlare - we would keep the Amazon as well for legacy.
Also, if you have not left a review on FaceBook https://facebook.com/zimjs/
Or let us know on Slack at https://zimjs.com/slack
and we will post on the About page at https://zimjs.com/about

ZIM 10.0.1
PROTOTYPE CONTROL STYLES
Prototyping adding controls to STYLE - the first test is with Tile.
Added a delayPick style to let Tile choose the value rather than STYLE on the object
For instance, passing [red, green, blue] to a Circle would pick the color randomly
but adding a Circle to a tile gets only one styled circle - so the whole tile would be that random colored circle
Adding delayPick:true to the circle style will let the Control using the object make the selection
This will be handy for Emitter, Pen, etc.

Added a percent parameter to ZIM Circle that makes a Circle have a percent arc.
So new Circle({percent:50}) is a semi-circle with bounds of the semi-circle
The registration point stays the center of the circle
https://zimjs.com/explore/circleArcs.html

Added spin() method to Physics objects
this is a one-time turning force like an impulse is a one-time linear force
To apply a constant turning force, use torque() in a Ticker or keydown event, etc.
https://zimjs.com/explore/spin.html
Fixed Physics to work with scroll and follow using drag() - already was working with controls but not drag.

Added pointsAdjusted property to Squiggle and Blob to change rotated or scaled points to non-rotated and non-scaled
IMPROVEMENT Added normalize parameter to Squiggle and Blob update() method to update to normalized points
must do this after rotating or scaling a point and then expecting manual updates on points
otherwise if just animating rotation or scale of points do not need to set normalize true (just leave parameter out)
Fixed bounds of cloned scaled Bitmap - was cloning width and height rather than bounds.width and bounds.height - thanks Ami Hanya
Made Blob showControls param and method work when interactive false
IMPROVEMENT Fixed adding points to blob when showControls is false - it remakes blob and was using showControls parameter value rather than _controls dynamic value
Added faint background to custom Tabs and List elements so selected index works for whole tab area not just directly on the custom item - thanks Racheli Golan
https://zimjs.com/test/listAlign.html
Made Tabs and List align and valign work properly with objects that are not top left registration point - and handles align of scaled custom objects - thanks Ami Hanya
Fixed transformControls.update() to work after pos() - pos was using CreateJS getTransformedBounds() and that was setting some sort of matrix that mixed up transform
Fixed transformControls.update() to add controls on top of object - was going one back since 9.5 update...
Fixed pressup on controls to remove custom cursors - lost a stage.update() somewhen.
Adjusted Guide to show pixels on start when percent parameter is true
Fixed Sprite loopCount and call to work properly - animate() was reading paused property of Sprite as true and not paying attention to loop count
Adjusted Accessibility html tags in behind to be rgba(0,0,0,.01) in color to remain hidden when in tag scaling mode
Fixed Tile to work with negative scale objects this lets Tiles have rows reversed or be fully reversed as follows:
https://zimjs.com/explore/tileflip.html

PATCHED - added setting scrollX and scrollY to 0 for fit, full, outside modes
This seems to solve the issue on iPad when changing orientation - it was left scrolled! Despite never scrolling - sigh.

Updated TypeScript, Templates, Code Page, CDN, Docs and Updates ;-)

ZIM TEN 10 - adds 29k
ZIM 10 offers a more integrated Physics and a formalized Pick() class for ZIM VEE dynamic parameters.
A new SVGContainer class lets you convert SVG to ZIM Blob, Squiggle, Rectangle and Circle objects - thanks KV for the help!
There is a new site ;-) with TEN sections that highlight types of things that can be made with ZIM.
Specific video entries for each doc element are under way.

PHYSICS - IMPROVEMENT
See: https://zimjs.com/physics/
Integrated Physics into ZIM DisplayObjects and the Docs.
Still need to import Box2D and the ZIM physics module - updated to version 2.
Making a physics object and mapping a ZIM object is no longer needed.
var circle = new Circle().center().addPhysics();
will create a default world and drop a circle in it!
Access the physics object with circle.physics
Or premake the world with new Physics() - to customize gravity, borders, scroll, etc.
The addPhysics() lets you set a bunch of parameters about the body.
Access the physics body with circle.body

DisplayObject Methods:
A set of methods are added to the DisplayObject when physics is in place:
impulse(), force() and torque() methods to push objects around and spin them.
impulse() is a one time push like shooting a pool ball
force() is a force over time like gravity or wind and is applied in a Ticker, etc.
torque() will rotate or spin the object around its center
The control() method will let keyboard keys move the object.
The follow() method will let the stage follow the object when the Physics scroll parameter is set to true
Contact can be tested for with contact() and contactEnd()
each receives a callback function that is provided with the other contacting object and body

Physics Methods:
The physics class has a join() method that can join objects in a variety of physics joints.
The physics class has a drag() method to specify which objects are draggable.
There is a debug() method to see the physics world behind ZIM.
The world can be set up to be bigger than the frame and scroll to follow an object.

PICK
Added a Pick() class to featured code module
This takes the place of zik() when processing ZIM VEE values.
ZIM VEE is so handy that a more generic class was created to share with the world of coding
Pick() accepts parameters for a series, an array for randomly picked, a range object for a range or a function that returns a value
The Pick object has a choose() method that is used internally - but can be used by coders in general.
There is also a chainable num() method that lets you set the number of choices
The Pick object also has a loop() method so you can loop through the options getting the next picked option each time.
If you have an array and want a series you can use JS6 Spread ... or use new Options(series([your array]));
ZIM Pick is a stand-alone class that can be copied and used in other languages for delayed parameters.

SVG CONTAINER
Added SVGContainer class - that turns SVG into ZIM Squiggles or Blob paths
Thank you to KV from our Slack team https://zimjs.com/slack for the help on this!
The tech is still in experimental stage but will translate most SVG - no CSS on SVG...
The paths can then be used to animate along, drag along, make a LabelOnPath, etc.
Also consider svgToBitmap() if you are just wanting to view an SVG file in ZIM

HIERARCHY
Added a zim Hierarchy() class to accommodate nested data.
This is used by the accordion but could be used in making a "Mind Map" or a Tree interface, etc.
The Hierarchy class comes with handy methods to traverse a hierarchy.
This is similar to DOM processing but uses Object literals and as such, can store any Object

LIST ACCORDION
See: https://zimjs.com/ten/accordion.html
Added an accordion parameter to List to handle expanding and collapsing sections to a List.
Uses ZIM Hierarchy for creating and tracking the nesting.

TIP
Added a Tip() class under components just after Toggle.
Tip() is a Label that has show() and hide() added to it
Tip will hide automatically 2000 ms after showing - or whatever you pass in as a time.
Tip also has align, valign and margin, marginH, marginV to easily position based on a target
There is also an outside parameter you can set to position outside a target
Tip is added to the stage - initially it was added to the target but the target might be rotated, etc.
Thanks Ami Hanya for the requestion for Toast ;-)

GENERAL
Added enabled property to List
Added selectedRollBackgroundColor and selectedRollColor to Tabs, List, Pad - sigh BREAK. These default to rollBackgroundColor and rollColor
Added dampKeyup to MotionController and dampKeyup property to control the damping on the Accelerator when keyup is used in MotionController.
See: https://zimjs.com/explore/sidescroller.html
Added expand to Window overlay rather than black with alpha .01
Made loop() work on an HTMLCollection (it already works on a NodeList)
Added q, r, s, t points to ZIM Point - used with SVG - Cubic Beziers and Arc
Added addChar(char) and removeChar() to Keyboard()
Added x and y to rot() to rotate around any point (relative to the container)
Added event object to hotSpot click - also added callOver and callOut parameters
Added "myCanvasAlternative" system to show alternative content if no canvas
or to screen readers and possibly search engine indexing
Added hotSpots property to HotSpots which is an array of HotSpot objects
Fixed sink to work with new Emitter system (particles container independent of emitter position)
Adjusted Tile so it does not clone first item but rather uses item passed in to Tile.
setting slider enable false does not remove cursor to start
setting animate of color:[blue, green, red] does not work

*** patches
Adjusted cloning - to initially only copy matrix if shape or not a ZIM object
but realized that that lost cloning of x, y, scale and skew so backed out of that change.
Added buttonDown property to Tabs and itemDown property to List to get currently pressed item.
Added getItemIndex(item) method to List
Added clamp parameters to Proportion, ProportionDamp and Parallax defaults to true
Set this to false to get values outside min and max range - thanks Ami Hanya for the prompting
Adjusted scrollTop on Frame to default to false - this was for older iPhones - live version 5 - and does nothing otherwise
It was reported that it might mess up mobile when tag mode is scrolled to the bottom - so we have defaulted it to false.
Fixed stopAnimate() so it works with drag:true setting
Fixed Blob controlLength parameter - was not using parameter value - now it is!
Made Squiggle and Blob move parameter only stop overall dragging when set to false - that is what was intended
Passed a CreateJS tick object to any function added to Ticker with add()
this gives delta, time, timeStamp, etc. - thanks Alfred Yim for the prompting!
Ticker.raw() functions receive a DOMHighResTimeStamp
Fixed Tile to properly not clone if clone:false is set - thanks Racheli Golan for the find.
This was introduced initially in 10 for ZIM Shapes accepting ZIM VEE for size and color - we mixed up a conditional and it is now patched.
Adjusted Blob to properly close path so there is no gap on thick borders
Controls were hiding behind transform objects since updates in 9.5
This has been fixed but should be monitored further.
NOTE - as of 2/26/2019
SVGContainer has been updated - thanks KV for all the testing and updates on that.
Here is a mess of an example: https://zimjs.com/explore/svgcontainer2.html
Note - currently it does not do arcs nor does it use styles.
Note - there are a few differences we are still working on so expect another patch.
Diffences have been patched as of 3/1/2019
Also added label property to end of Sprite parameters
This will stop the sprite on the label for texture packer approach
See https://zimjs.com/explore/fruit.html
SVGContainer() and svgToBitmap() now handle remote SVG, SVG tag and SVG string as input

TypeScript, Templates, Distill, Bubbling, Code page, have all been updated.

@danzen
Copy link
Owner Author

danzen commented Jun 3, 2019

The pace of issue solves and updates has been similar to the sample above for 4 or 5 years straight now. ZIM is incredibly active. Come on in the SLACK where we handle all support and sharing https://zimjs.com/slack and please leave us a GitHub star if you are so inclined. We have neglected GitHub socially in the past... and now are needing more stars to get into CDNjs, etc. Thanks!!

@danzen
Copy link
Owner Author

danzen commented Dec 27, 2020

ZIM Cat - added 64K - June 01, 2020

TIME
Time now defaults to seconds rather than milliseconds. BREAK
Added TIME constant that can be set to "milliseconds" or "ms" to go back to time as it was.
This is everywhere that time is used in ZIM most notably in:
animate(), wiggle(), timeout(), interval(),
But also in Emitter(), Sprite(), Tip(), Layer(), KeyBoard(), Marquee(),
Button(), Swiper(), Swipe(), ProgressBar(), Waiter(), Stepper(),
Accessibility(), gesture, added(), hold() and Frame()
The reasoning behind the time change is that ZIM is for the people
not only for hard-core coders and seconds just makes it more familiar.
GreenSock animates in seconds so there is perhaps an industry shift.

SYNTH
https://zimjs.com/cat/synth.html
https://zimjs.com/cat/synthpad.html
Added ZIM Synth() with two main functions play() and tone():

  1. play() is Frank Force code ZzFX to play and create sounds with many parameters
    https://github.com/KilledByAPixel/ZzFX
    https://zimjs.com/cat/sounds.html
    There is a tool here: https://zzfx.3d2k.com to easily make sounds.
    Then just paste the resulting code into a ZIM Synth play() method.
    This is great for game sounds, etc.

  2. tone() is a ZIM tone - continuous or with a duration.
    This uses the native JS Web Audio API to make oscillators with frequency and gain.
    The API is fairly complicated and cumbersome so this makes it easier.
    tone() plays a note "A", "Bb", "C#", "A4", etc. and notes can be added.
    The low notes are "C0" then each number increase goes up an octavet to "G8".
    New constants are provided: SINE, SQUARE, TRIANGLE, SAW, ZAP for wave shapes.
    tone() also plays WaveTables - of 50 different sounds available on the ZIM CDN
    Effects are "wah", "tremolo" (pitch / frequency) and "vibrato" (gain / volume)
    Properties can be controlled with interaction, components, MotionController, animate, wiggle, etc.

DIAL AND SLIDER - IMPROVEMENT
https://zimjs.com/cat/synth.html
Added to and adjusted parameters for Dial from after tickColor to before limit:
tickColor, tickStep, semiTicks, tickScale, semiTickScale, innerCircle, innerScale, innerColor, inner2Color,
accentSize, accentRadius, accentColor, accentBackgroundColor, accentDifference, sound, linear, gap, limit
Dial gets a new indicatorType of "aztec"
Slider gets the same except for the inner parameters
Added four more button types to Slider:
"pill" - a narrow rectangle with rounded corners
"aztec" - a quadrilateral with fat side and skinny side (default for sound)
"circle" - a circle - can be oval with different width or height
"grip" - adds three grip lines to button
Added semiTicks to Dial and Slider - set to 1 to alternate between big and small ticks
set to 4 to show 4 ticks between big ticks, etc.
Changed useTicks to work independent of steps
Added tickStep that defaults to steps but can be set independently
will be 1 by default if no step
Added linear value to Dial that lets dial go up and down based on vertical movement only
Added accent parameter to both that adds colored bar and background bar that can be offset
The accent can be made really small, put under or outside the component, etc.
The slider accepts gradient - the dial does not as it is a Shape
(custom shapes can be put under Dial for gradient effect)
Added sound parameter to Dial that rotates the dial 180 and switches to linear mode
Added sound parameter to Slider - sets accent, button to "aztec", colors, etc.
Remember, to get an actual number, use a Label set to the currentValue in a change event

STYLE - IMPROVEMENT
Added Style() class - see STYLE in docs and scroll down
This has a set of static methods to help organize and manipulate sets of styles
These are very small and like STYLE, they affect only new objects
objects already created will not be changed:
Style.clear()
Style.clearTypes()
Style.clearGroups()
Style.remembered
Style.remember()
Style.clearRemembered()
Style.recall()
Style.add()
Style.addType()
Style.addGroup()
Style.remove()
Style.removeType()
Style.removeGroup()
Added zim.styleTransforms() function and documented how to add STYLE to custom classes
https://zimjs.com/explore/customclasses.html
See the Docs on STYLE for the four steps to activate styles on custom classes extending ZIM Classes

ZIM BASE
https://zimjs.com/base.html
Created ZIM BASE in PHP to handle MySQLi - cutting code by at least half
This works with ZIM Bind(), async() and Ajax() to provide easy data on the server side.
There is a Skool section on Data under Lesson 09
and videos on Base and Bind as part of the Learn JavaScript with Creative Coding

WIRE
Added front-end binding with ZIM wire() - leaving ZIM Bind() to work with external binding.
ZIM wire() and wired() are methods that offer an alternative to events.
These are simple methods that work similar to Bind - with chosen objects, properties, filters and calls.
For instance:
new Slider().wire(circle, "scale"); // would change the scale of the circle as slider is used.
This would be like the ZIM:
new Slider().change(function(){
circle.scale = slider.currentValue;
stage.update();
});
or the CreateJS:
var slider = new Slider();
slider.on("change", function(){
circle.scale = slider.currentValue;
stage.update();
});
or the traditional JS:
var slider = new Slider();
slider.addEventListener("change", function(){
circle.scale = slider.currentValue
stage.update();
});
Wire is 25% the code of the traditional JS event.
Wire methods can also be added to any objects with addWires() global function

WIRE WORKINGS
The wire() method calls an optional filter function before setting the value and an optional call function after setting the value.
The filter function receives the value and must return the value - but the value can be changed in the filter function if desired.
The wired() method is the same but is set on the receiving object - as that may be made afterwards.
Each has a rebound parameter that can be set to also reverse the properties
so if the circle changes scale, it would change the slider value.
An optional input parameter exists if the value is not the component's default selectedIndex or currentValue.
A DEFAULTWIRE constant is provided to set preference at any time to selectedIndex or currentValue.
Non-components can be used too - for instance circle.wire(circle2, "x", true); // true is rebound
When circle changes, circle2 would match its x. When circle2 changes, circle would match its x.
Stage update is handled internally.
The wire() or wired() function (not method) can be used to wire non-ZIM objects - like an object literal {}.
For instance, point = {x:10, y:20}; wire(point, circle, ["x", "y"]);
Anytime the point changes, the circle would change to match x and y.
wire() and wired() can be turned off with noWire() and noWired();
This all works with a single function added to the ZIM Ticker that checks for each change in order added.
A single stage update is provided at the end by the Ticker - tied in with animate, wiggle, drag, etc. for optimization.

PAGE
https://zimjs.com/cat/page.html
Added new Page() class - that is really just a Container with a Rectangle backing
And a few conveniences for color and pattern.
But it stops people from wondering how to make a page in ZIM so that's okay.

PAGES
https://zimjs.com/cat/page.html
Added Emitter transitions and the ability to add a custom Emitter to transition parameter of ZIM Pages()

LINE
https://zimjs.com/cat/line.html
Added a new Line() class that has features of other ZIM shapes like Rectangle, Circle, etc.

POLY
https://zimjs.com/cat/poly.html
Added a new Poly() class that has features of other ZIM shapes like Rectangle, Circle, etc.

ASSETS
https://zimjs.com/cat/sounds.html - see the cat asset
ZIM asset() can now be called without preloading assets
ZIM will temporarily use an empty container as a placeholder
and then automatically load the asset in the background.
If you do not supply dimensions then ZIM will re-call any positioning once the asset has loaded
An auto-loaded image will be of type "Image" - as it is actually a Container holding the Bitmap
This container has its mouseChildren turned off - and the Bitmap can be accessed with a bitmap property
In general, loading assets with the frame asset parameter or in loadAssets() is encouraged
But test this out - it may be that you do not need an asset to be preloaded and it saves a step.

ZIM Asset Object now handles multiple paths that override the main path parameter
var assets = [{id:"file", src:"test.png", path:"alternate/"}, "other.png"];
var path = "assets/";
will load test.png from relative "alternate/" path
and load other.png from "assets/" path
Absolute urls always ignore the provided path parameter
So the above is accomplished by parsing the full path to the current file
and adding the alternate path to create an absolute URL that then ignores the path

SOUND
https://zimjs.com/docs.html?item=Sound
There is now a Sound entry in the Docs
Sound is handled automatically in ZIM by a CreateJS Sound object (for all sounds)
But we have added information about Sound to the ZIM docs for convenience.
The play method now has traditional parameters or a configuration object (ZIM DUO)
asset("sound.mp3").play(volume, loop, loopCount, pan, offset, delay, interrupt)
Setting loopCount:2 will loop twice - no need to set loop:true (this also has been changed for animate as well)
Sound now features interrupt (available through CreateJS)
This allows you to specify what happens when multiple occurrences of the same sound are played.
Previously they would just play on top of one another and that is still the default (up to 100 copies - or 2 in IE)
Now, a maxNum property can be added to the ZIM Asset Object for a sound
var assets = [{id:"sound", src:"sound.mp3", maxNum:1}]; // not available just using "sound.mp3" as the asset
This means that only one occurrence of a sound with the same source will play at the same time
When the sound is played an interrupt parameter can be provided with four possible values
The default is "none" which will not interrupt the previous playing sound
Set interrupt to "any" and it will stop playing any the same sound and start it over again
This is a pretty good setting for playing a sound with a button - it starts over.
Or just leave it as "none" (default) to ignore further button presses
and keep playing the sound without interruption - until it is done
then if the user presses the button the sound would play again.

MOVEMENT
Added movement() and noMovement() chainable methods to capture mouse movement on object
CreateJS provides a stagemousemove... sigh... but no mousemove events sigh.
General mousemove events are a little performance expensive but we need them sometimes
and it is a few steps to set up with a mouseover and mouseout
Here are those steps wrapped up in a nice easy method.
Object dispatches a "movement" event when stagemousemove or obj.pressmove happens on the specified object
call noMovement() to turn off.

SCRAMBLER
https://zimjs.com/cat/scrambler.html
Added a new control to ZIM that accepts a Tile and scrambles it
also letting the user drag tiles to try and unscramble for instance.
This works as a horizontal row, vertical row or a grid
and is very handly for e-learning app unscramble questions
and can be used to unscramble a picture

TILE
Added unique parameter BREAK to after spacingH and spacingV before width and height
Initially, Tile was used to tile the same object - but it has proven handy for layout components, etc.
This parameter will simplify the layout process by automating count and clone settings
unique - (default false) - set to true if tiling unique items like components with events set or objects with custom properties
1. this will turn off ZIM VEE for the obj parameter which will accept an array of unique objects
2. the count parameter will be set to the length of the array
3. and the clone parameter will be set to false
Made Tile default to 3x3 circles if nothing specified
Added tileCol and tileRow properties to each tile object (already added tileIndex property) - this was patched in 10.9.0
Added itemUnderPoint(x, y, ignoreSpacing) to Tile to efficiently get the tile item at the mouse for instance
Added read only current, current2D, current2DCols properties - like items, items2D and items2Dcols
that give the current order of the Tile if it has been scrambled for instance
This could be relatively processor intensive so try to use it on click or pressup as opposed to pressmove or Ticker
Removed getItems2D() method in Docs - that was not an actual method as we went to items2D and items2DCols properties

ZIM SHAPES
Added a ZIM CustomShape class that handles common properties - saves 25% code per shape.
Added support for dashed array [10,30] 10 fill, 30 space... or [10,30,100,30,10,30] etc.
Added dashedOffset property (note dashed with ed) that can be set and animated for a Marquee effect.
These were already built into a raw CreateJS shape (and a canvas shape) but now brought them to the custom ZIM Shapes.
Added a cloneAll() method to shapes in cases where content is added to the shapes - usually a Container is advised.

ANIMATE
Added easeAmount and easeFrequency to animate() - these call CreateJS dynamic eases
easeAmount - |ZIM VEE| - (default null) set to change the tween effect
Ease amounts are as follows:
quad (default 2) - exponent - this is the default ZIM tween
cubic (default 3) - exponent
quart (default 4) - exponent
quint (default 5) - exponent
back (default 1.7) - strength
elastic (default 1) - amplitude - also see tweenFrequency
linear, bounce, circ, sin - no affect
Note: used mostly with back and elastic (backIn, backOut, backInOut, etc.)
as setting the tween to quadInOut and then tweenAmount to 5
would be the same as a quintInOut.
easeFrequency - |ZIM VEE| - (default .3 elasticIn and elasticOut or .3*1.5 elasticInOut)
set to change the elastic ease frequency
so tween:"elasticOut", easeFrequency:.2 is a faster elastic
the time may also need to be increased or decreased as desired
also see easeAmount where easeAmount:3 would be a larger elastic
Added a timeUnit parameter to animate to manually override the TIME constant if desired
IMPROVEMENTS
Adjusted animate() so setting loopCount to a number will automatically set loop to true (no need to also set loop true)
Fixed actually setting orient:true for paths to work properly
This already worked properly as default which is true - but now works if set it to true
Also fixed so can flip false and orient true - that was always rotating to the path in the past
Also, default to flip true for orient true and this avoids a little flash
as object was dragged and thrown in opposite direction - so all is looking good.
Fixed bug in replayTween and resetTween when tween had ended and with startAngle on path.
Adjusted ZIM animate() series to work with replayTween() - does not work with a series that includes multiple targets
Added the CreateJS CSS plugin to the ZIM CreateJS 1.3.2 version - so can now animate CSS without installing plugin (17k)

SELECTOR
https://zimjs.com/cat/synthpad.html
Added multi parameter BREAK to handle multitouch - for instance musical touch pad
Made selector receive backgroundColor and borderColor ZIM VEE values to set custom selector colors
Fixed clone to work

TEXT EDITOR - dedicated to Ami Hanya - long time ZIM user and enthusiast
https://zimjs.com/cat/texteditor.html
Added a ZIM TextEditor() class that edits ZIM Label objects
with modular features - just plain text edit, color, size, bold italic, align and font
has a show(label) method to work on a specific label.

LABEL
Added bold, italic and variant parameters and properties to Label BREAK .
Added font, align and valign properties to Label
Removed fontOptions. BREAK - this conflicted with parameter settings unless a lot of code was written.

BUTTON
Added toggleBackgroundColor, rollToggleBackgroundColor, toggleColor, rollToggleColor
to after toggle in Button BREAK adding these more easily allows a button to act like a fancy checkbox
before adding these we had to use custom backings and icons for toggle color changes
See the new TextEditor for an example with B, I and align icons using toggleBackgroundColor

BIND
Added toUnique() to Bind which sends unique=true to server
Adjusted toLock() to ignore from data that is not adjusted
Fixed up the docs as to when to use toLock()
This is when multiple people are appending to or editing part of a shared JSON object
If people are completely overwriting the object then just use to().
Added stop() functionality to the from filter (already on the fromTo and to filters)
Added setDefault parameter to Bind - to set as zimDefaultBind
Added default property to Bind to get or set bind as zimDefaultBind
the zimDefaultBind is what DisplayObject bind() method will use unless bindObj is specified
Adjusted removeAllBindings() to return the bind object for chaining
Adjusted filter process to allow data object to be replaced not just updated
the returned data was not going all the way due to passing via reference issue
Added unique parameter to ZIM Ajax()

VERSION
Added a VERSION constant and getLatestVersions() function - thanks Ami Hanya and others for the request.
getLatestVersions() calls ZIM async() to get the latest versions of all files relating to ZIM
the callback receives a versions object with zim, createjs, physics, etc. properties
So, in the callback function - if (VERSION == versions.zim) will tell if ZIM is the latest.

GENERAL *** IMPROVEMENT
*** Can now use key arrows and shift key arrows to move object with place() - yay!
Just remember to remove the place() once placed!
*** Loop now loops through a string giving each letter.
*** Made ZIM expand accept 1, 2 or 4 parameters and accept DUO - for STYLE mostly...
*** Added pause(state, time) method and paused property to MotionController - deprecated enabled.
*** Added wrap and maxLength parameters to TextArea
*** Added ability to add Rectangle or stage as boundary to drag()
this will keep object inside rectangle without calculating based on registration point
*** Added "pressdown" event to all DisplayObjects - same as mousedown but matches pressup
this was a few lines of code to wrap the mousedown function
*** Added hitTestCircleRect() for calculation based (fast) detection of rectangle to circle hits!
*** Added close and closeColor parameters to Panel as well as a get set panelHeight property BREAK
*** Added currentValue to list - reads label text or finds first label containing provided value
*** Bitmap now has top and left parameters to shift where the image will be drawn BREAK
*** Added setLinearVelocity and setAngularVelocity to objects with Physics to override forces

GENERAL FIXES
Adjusted drag() to optionally use any DisplayObject as boundary
and if so, keep object within bounds - even for dragging containers with objects (one level deep)
Fixed centering on container with 0 scale bug - temporarily set scale to .000001 then back again for x or y
Adjusted List tabs not to inherit borderWidth and borderColor - setting outside border was also setting tab borders
can add Tabs or Button style if want to change inside
Adjusted series() to turn array into a real array as opposed to function arguments.
Adjusted Swiper to dispatch slidestop even if min max are not chosen
This could stop early as .5 is used as a change threshold - great for x, y, rotation
So set a min max for swiping to set properties like alpha and scale
Added noMouse() to Emitter particles container - this improves performance
Use myEmitter.particles.mouse() if you need interactivity
Adjusted Keyboard to put cursor selection in right place since centering on empty container fix
Added a recursive parameter to noDrag() to stop drags on children

PHYSICS - 2.1 added ability to physics.drag(object)
for any number of objects at different times - either single or array.
Added physics.noDrag(object) or objects in array.
physics.noDrag() will stop dragging all objects.
IN ZIM - changed restitution to bounciness.
The parameter order in addPhysics() is the same as it was
restitution is still there as a ZIM DUO parameter name - or use bounciness.
We liked bouncy better, but that suggested a Boolean so bounciness was used.
Made follow work with borders assigned or changed after physics is made.
Adjusted drag so follow does not move when dragging - this was conflicting.
For moving things and following at the same time consider control() or using forces.
Adjusted the hitArea of arrows on Stepper to use expand() and reduce their size a little
Adjusted keypressing in Stepper for numbers - works better now... with backspace and delete

GAME - 2.3 added
Game is adjusted for the new font settings of bold, italic and variant
These are added to Scorer() and Timer() so BREAK to later parameters
Also adjusted internal parameter order to Meter - thanks Racheli Golan for the report
Adjusted the Docs to the new Game parameters - otherwise, nothing changed.

ZIM Kids
https://zimjs.com/kids.html
ZIM Kids now has four new intro workshops
These are called Basic Bug, Bug on Path, Bug with Sugar and Bouncing Bug!
The other four tuturials as well as the Spells and Magic pages are updated to ZIM Cat
Note: ZIM Skook and the Learn JavaScript with Creative Coding are at 10.9.0
A note will be placed regarding ZIM Cat - TIME.
Patched the command S in Mac to test the page - thanks Jonathan from Slack!

PATCHED
Added shadowBlur and shadowColor to Scrambler for when an item is picked up - BREAK of later params
Fixed a glitch in the Scrambler so it scrambles to a non-correct order
Added num parameter to Scrambler to visibly scramble a number of times within the time provided - BREAK of later params
This is good for scrambling a small number of things - eg. set num to 3 to scramble 4 things in 2 seconds
Fixed ZIM Tips which extends a Label and we had added bold, italic and variant to Label but not to the Tips - thanks Racheli Golan for the... tip
Also added bold, italic and variant parameters to the end of the tips
Fixed up a typo in ZIM Base which was outputting a 3 in front of an async call - thanks Andi Erni!
Fixed animate() to handle relative values when loopPick set to true
Adjusted getLatestVersions() to return a JSON parsed object as expected and intended
Fixed minified version for getLatestVersions() - minify is changing async() return function name
** yay! Remembered that async() has a third parameter to use the function as a string to overcome minify problem
Fixed up dispose of Tag, TextArea and Loader - it called a "removed" event which was trying to delete the html tag but it was already gone - thanks Racheli Golan for the find.
Fixed glitch in Scramble - so fast tripple clicks do not mess it up - applied mouseEnabled false before animating and mouseEnabled true when done
Fixed bug in running Sprite from JSON - was referencing frame in Sprite and should have been zimDefaultFrame - or zdf. Thanks Racheli Golan for the find.
Took off container dispose for Blob and Squiggle as that affects how they are recreated with a points change - went back to 10.9.0 and patched that there too
Fixed animate() for shape tweens - the index for events needs to be updated anytime parameters change - thanks Mike Gossland for the report.
Fixed Blob and Squiggle issue with bringing back controls - the mousedown -> pressdown on Shape was left in a test mode - tricky bug.
Still needing to adjust pressdown so that target and currentTarget report properly...
Updated Scrambler to have a swap parameter before the style parameter.
Swap will not automatically shift the tiles as a tile is dragged but wait until the drop (thanks Ami Hanya for the idea)
Added swapLock parameter to Scrambler to lock tiles in place that are placed - thanks Netanela for the request!
Added a testItem(item, index) to test a specific item in the Scrambler
Also added a complete property to the Scrambler - but usually the "complete" event would be used
then the dragged tile goes where dropped and the dropped on tile goes to where the drag came from
Fixed asset() without preload to addTo() as placed not after when loaded - this keeps the levels - thanks Ami for the report
Added label property to TextEditor() to get or set the label the editor is applied to - thanks Ami
And made the show() method also set the editor to whatever label is provided
Adjusted animate drag on path to properly flip if object is rotated to start
We had fixed up flip when dragging on path to be more stable and missed adjusting pre-rotated objects
This is not perfect as it handles only pre-rotation of 90 and -90 or 270.
Put unusual start angles in a container and animate the container if there are any issues.
Added timeUnit to docs for animate() parameter and added timeCheck parameter to animate
Set the min time for warning on wiggle() to 40 as we often wiggle greater than a 10 second time
Fixed Button toggled text, color and rollColor when these have been changed after creation
Fixed Button clone() which was missing various new toggle colors
Turned ColorPicker indicator to mouseEnabled false so button shows cursor still when rolled over

PATCHES SINCE NPM
Adjusted Bitmap so it does not specify sourceRect if being passed a video
CreateJS had a warning about the sourceRect needing to be same dimension as the video
Which is too bad as it would be nice to cut video into pieces too... would need to confirm that is not possible
Adjusted ZIM asset object {id:, src:, type:} to include a type
so a JSON file can be loaded without a .json extension for example - thanks Frank Los for the prompting!
Adjusted ColorPicker selectedColor to convert to lowerCase as the colors are set in lowerCase BREAK
Fixed rollBorderColor to default to borderColor
Fixed Emitter so emitterPaused is true if set to startPaused false
Fixed the recursive parameter on noDrag() so it can receive a false - thanks Cajoek for working through this with us
Adjusted windowWidth(), windowHeight() and frame.swapRotation on mobile
to not set swapRotation when in an iFrame - it was reading a wide iframe as wrong when shown in vertical view on mobile
see what we mean... horizontal aspect ratio iframe on vertical device or visa versa - this was giving a false reading
leading to a very confusing bug with ZIM in iframe on mobile when changing orientation
Fixed Synth to play the right note to start - was trying to apply an octive shift test when we did not need to
Worked on Synth to reduce crackle on Firefox - thanks Frank Force for the advice
Adjusted stop() parameter to be release in seconds - not stop time
Added setInput() and dispose() methods to SoundWave - to set a different sound and dispose - thanks Amy Hanya for the suggestion
Added ramp(volume, duration) to Synth tone() this will set the volume smoothly without pop or crackle (as best as possible)
The volume should be used only for animation.
Adjusted stop() method of Synth tone() to use ramp fix - thanks Frank Force for the aid - it is better but still not perfect
Swapped in a new Synth play() with updates from ZzFX - sustainVolume and decay parameters were added
The patch now matches updates to the tool https://killedbyapixel.github.io/ZzFX/ and keep backwards compatibility
Fixed Window resize and maximize
maximize was missing stage update since we removed the constant update in window scrollbar
resize was broken by that.noDrag() on end of window drag as we made noDrag() recursive
so need to pass in false to noDrag to stop it setting noDrag on resize handle too!
went through and checked rest of noDrag in ZIM - seems okay
Fixed clone registration issue - typo was setting regY as regX
Added callType parameter to animate endTween() method with three values "all", "none", "main"
These will call the callback function (or not) when endTween() is used.
"all" will call the callback functions in a series where "main" will not
Thanks Disco Drama for the suggestion and testing
The current default is "none" for backwards compatibility but in version 01, this will be changed to "all"
Added a madeWith() method to Frame to create an ZIM icon with Made with ZIM beneath (customizable) - thanks Iestyn for the request!
Added a noCORSonImage property to the ZIM asset object for loading assets
this will avoid CORS errors by loading an HTML image into a bitmap and then applying an expand to add a CreateJS hitArea
See https://zimjs.com/explore/imagewithnocors.html (thanks Disco Drama for the find!)
it means that the full image will be interactive and not just the opaque parts of a png
it also does not count in the progress property (bytes loaded) of the progress event - but it does trigger assetload and complete events
Updated ZIM Window to remove drag bounds check if enabled is set to false
this will avoid a positioning issue when animating the location of a Window or List.
See https://zimjs.com/test/listmove.html as a sample of using this - thanks Disco for the report
Fixed animateTo() in List to use seconds by default
Fixed spacing issue on custom non-equal width objects in a horizontal List (or Tabs) - thanks Disco for the find
Fixed content property of selected items in List for custom items - this was documented but missing in practice - thanks Disco for the find
Added noScale to List at end of parameters before style.
This will make the list not scale custom objects and ignore the listNum parameter - thanks Disco for the testing
IMPROVEMENT updated Sprite so that pauseOnBlur activates the sprite again when the user goes to another tab and then tabs back. Thanks Chris S for the report

THREE
Updated the ThreeJS helper file to version 2.1 with an adjustment to position() and resizing.
If you were centering the ThreeJS then there is no change - the fix is for not centered. Thanks Iestyn for the find.

DOCS
Added a new introduction at the top of the zim_docs.js file
that explains a little bit about the ZIM philosophy with respect to ES6
and other code environments - we do not mean to be dismissive - rather just trying to guide.

UPDATED
CDN, Code Page, templates, home page, slack, GitHub, templates, Distill, TypeScript, NPM (as 11.0.0), Blog, Bubbling Videos, Patreon
Intro page https://zimjs.com/intro
ZIM Kids https://zimjs.com/kids
Animation page https://zimjs.com/animation
ZIM Bits at https://zimjs.com/bits

@danzen
Copy link
Owner Author

danzen commented Dec 27, 2020

ZIM Cat 01 - added 31K - August 28, 2020

DOCS
Added THREE, SOCKET and PIZZAZZ at the bottom of the ZIM DOCS after GAME.
The ZIM modules are now in the docs
The code remains external and available in the CDN or in links at the top of the docs.
The files still need to be called with a script tag after calling the CreateJS and ZIM scripts.
Added an Images section after Frame and above Sounds to help people see how to load images.
This describes loading image assets but the code for doing this is in Frame still.

GENERATOR
https://zimjs.com/cat/generator.html
Used for dynamic drawing such as generative art or visualizations.
Generator provides a set of RELATIVE drawing commands
that primarily match the traditional absolute drawing commands for shapes on the canvas.
Rather than add all these commands to the Shape class they have been added to the Generator class.
This optimizes the Shape class which is used for all components and ZIM shapes.

The arrangement is similar to Processing (or P5js for a JS version).
There is one Shape that gets drawn into and code can be put in three different callback functions:

setup - happens once at the start (similar to Processing)
draw - happens at the framerate (similar to Processing)
stamp - loops all at once (different that Processing?)

SETUP
The optional setup runs once before the draw or stamp functions run.
This function will not be used as much as in Processing because ZIM has a Frame().
Also, things can be set up before the Generator code is called.
And the Generator class has parameters for color, strokeColor and strokeWidth.
Generator defaults to start at the center of the stage - so in the setup,
translate(-stageW/2, -stageH/2) could be used to start at the top left.

DRAW
The optional draw function runs at the framerate and receives count and total parameters.
This will have the affect of animating the drawing as it "processes" the code
By default, this will pause and unpause when the screen or the spacebar is pressed.

STAMP
The optional stamp function runs inside a loop and produces the final drawing at once.
The function receives count and total parameters.
You can switch between the stamp and draw function with the same code inside.
The end product will be the same.

RELATIVE
The draw and stamp work the same way, running the code inside for each count.
The magic happens because the commands are relative.
Even g.rectangle().rotate(5) is beautiful.
Each new rectangle after the first will be rotated 5 degrees
In absolute space, the corner points would have to be calculated with sine and cosine - ew.
Generator does the matrix calculations to avoid this.
Each new command starts where the last command left off.
But each command also has an x and y value to translate if desired.
This x and y value is relative to the current rotation and scale.
Often, the x and y is left at 0, 0.
We considered removing them as parameters because translate() can be called
but we left them in to be the same as Processing.

COUNT, PAUSE AND STEP
The count parameter of draw or stamp suplies the current count.
This provides ways to modify commands.
for instance circle(0,0,count10); will draw circles that get bigger.
This can also be used to set the rate of change - often by using smaller factors such as count
.01, etc.
Count can also be used to pause or do something different at certain places in the drawing
Pause also has an optional number of seconds to pause or a ZIM interval() and pause(false) can be used.
Generator has a count property which can be set to go forward or back to a certain count.
Step calls a step - usually used when pause is true - an interval could then be used for steps

PUSH AND POP
There is also push() and pop() as in Processing.
These remember the position, rotation, scale and skew when push() is used
and then return the generator to these settings when pop() is used.
Multiple pushes can be set and then popped back.
These can be used to make fractals with recursive branching.

The drawing uses matrix transforms on Shape which takes the shape out of traditional positioning.
A drawing property is available on the Generator that points to a Container that holds the drawing.
This container can be moved, dragged, etc. so use this to manipulate the drawing in a traditional manner.
The generator has a shape property which can be used to access the raw shape for absolute drawing for instance.

The drawing container is automatically added to the default stage as the Generator is created

CONNECTORS
https://zimjs.com/cat/connectors.html
Added a new component called Connectors that has nodes that can be dragged and connected with lines.
There are three main uses:

  1. Connecting dots like in coloring books - use linear:true (thanks Karel rosseel for the idea)
  2. Making hieararchy type drawings - use snaps
  3. Connecting objects like boxes together - pass in objects to the points

The num parameter limits the number of lines that can be drawn from a node.
The dropType can be set to require nodes to be dropped on or off other nodes (or the default, any).
There are min and max distances the connections can be made.
These and the other parameters provide a variety of game and puzzle options.

The Line can be set to have start and end heads.
The lineType in the Line can be set to "straight", "corner" or "curve"
Line also accepts points for any arrangement of a connector
but in this version, these have not been used in Connectors.

Currently, there are no pre-made lines - the user would have to make these.
In future versions, we will look at making nodes and lines based on a ZIM Hierarchy object.
This would also allow use to handle undo, redo and save.

LINE
Added lineType, lineOrientation, curveH, curveV, points as follows:
lineType - (default "straight") - by default the line is a straight line between points
set to "corner" to draw only horizontal and vertical lines at 90 degree angles between lines (see lineOrientation)
set to "curve" to draw horizontal and vertical lines with curves between lines (see lineOrientation)
lineOrientation - (default "horizontal") - for lineType other than straight draw two horizontal lines and one vertical line between points
set to "vertical" to draw two vertical lines and one horizontal line between points
curveH - (default 100) - for "curve" lineType this is the horizontal distance of the curve
curveV - (default 100) - for "curve" lineType this is the vertical distance of the curve
points - (default null) an Array of points for the line which will ignore length and lineType parameters
points in the array can have the following formats (a mix is okay too):
[x,y] points for straight lines. This format should also be used for first point
[cpX, cpY, x, y] for quadratic curve to with a single control point followed by the destination point
[cp1X, cp1Y, cp2X, cp2Y, x, y] for Bezier curve to with start and end control points followed by the destination point
// see the ZIM Shape docs (or https://www.createjs.com/docs/easeljs/classes/Graphics) for details on the curves
Fixed cloning of line ends - were not adjusting their start angles
also ZIM VEE heads were not cloning the decisions but rather moving them to the clone

COLORS
Added toColor(targetColor, ratio) method to Strings - just like lighten() and darken()
So blue.toColor(pink, .2) is a blue color a little ways towards pink

SERIES
Added range to series:
var s = series({min:1, max:5}).step(.1).bounce()
would return 1, 1.1, 1.2, etc. to 5 and back again, etc. every time it is called
Added every() method to series:
var s = series(red, green, blue).every(3)
would return red, red, red, green, green, green, blue, blue, blue, red, red, red, etc.
Remember, these are used with ZIM VEE
Which can be used in the new Generator (and Emitter, Tile, STYLE, etc.)

LOADER FOR TEXT AND JSON
Added type parameter to Loader BREAK after the label parameter before all the colors, etc.
This defaults to "image" and can be set to "text" or "JSON" for loading these types of data
The event object of the loaded event function will receive a text or json properties for the results.
Also handles multiple files - thanks Ami Hanya for the prompting

MADE WITH ZIM
There is a frame.madeWith() method with some color and wording options
Thanks Iestyn for the prompting.
There is still the makeCircles(), makeIcon() and makeCat() methods as well

FLIPPER
https://zimjs.com/cat/flipper.html
Takes a ZIM Tile and scrambles its items allowing the items to be dragged to unscramble.
Works on horizontal, vertical or grid versions of Tile (as in one column, one row or multiples)
Dispatches a "complete" event when done.
Can pass in an optional keys array that must match key properties
or an existing property of type keyType.
This allows, for instance, matching duplicate letters or colors.

CORS
https://zimjs.com/cat/picture.html
JavaScript on the Canvas gives CORS (Cross Origin Resource Sharing) errors
when interacting with an image or sound from remote sites (without arranging for CORS)

Now, adding https://cors.zimjs.com/ in front of a full URL
will avoid CORS errors on assets from remote sites.
eg: https://cors.zimjs.com/https://somesite.com/somepath/someimage.jpg

This should be used only when there is a CORS issue
and not just to work with your own assets locally on your computer.
For that, please adjust your browsers according to
https://zimjs.com/tips.html#IMAGES
Thank you Disco Drama for the work on this.

SOCKET - IMPROVEMENT
https://zimjs.com/socket
Socket lets you connect with multiuser sockets for chats, avatars, etc.
There is a ZIM socket file and a ZIM server file as well as socket.io.
ZIM Socket has been updated to https and hosted reliably.
Thank you Disco Drama for the work on this.

DISTILL - IMPROVEMENT
https://zimjs.com/distill
Distill lets you minify only the ZIM code used in the app.
This can reduce code from 600K to often around 100k.
This service has been updated to https and hosted reliably.
Thank you Disco Drama for the work on this.

WONDER - IMPROVEMENT
https://zimjs.com/wonder
Wonder lets you record microstats like button clicks, time spent in areas, etc.
This service has been updated to https and hosted reliably.
Thank you Disco Drama for the work on this.

GENERAL
Made loadAsssets() dispatch a complete event even if no assets passed to it - helps in dynamic systems (thanks Ami Hanya)
Added toEnd parameter to stopAnimate(). If set to true, will make targets go to end values of their tweens (this will ignore specific ids)
Adjusted endTween() callType parameter to default to "all" rather than "none"
this will now call the call function (and all series call functions prior) when endTween() is run
Thanks to Disco Drama for suggesting the endTween and callType parameters.
Adjusted Page to have backing size the size of the screen by default with container dimensions the zimDefaultFrame width and height
Adding Layout to Page will now keep the same background color or pattern by default as the frame is scaled.
Pages object now automatically swipes horizontally from page to page without wrapping (thanks Andi Erni for the request)
specify swipe lists if some other swiping is desired or specify a swipe property of [] on one of the pages to turn off swiping
Switched rotate parameter of MotionController to orient to match animate property of the same name.
Added rotate property to end of parameters for backwards compatibility but this is now depricated.
Fixed MotionController to keep start rotation when orient is set to true.
Adjusted MotionController so flip does not work when target starts at an angle other than 0.
To rotate a target and use flip, use a Container as the target and put a rotated object inside the container.

SITE
Updated Wonder, Distill, AssetList, Socket, LeaderBoard and Frame pages with latest ZIM icon.

PATCHED
Adjusted the VERSION to cat/01/zim - thanks Stefan for the catch!
Adjusted stopAnimate(id, toEnd) to handle ids with toEnd - there was a bug
and adjusted endTween() to work across multiple animations and added suggestions to Docs. Thanks Disco for the report.
Removed a duplicate property deep in animate code and changed a var poo to po
and updated diffX and diffY in Squiggle and Blob to be vars - thanks Stefan for the finds.
Stefan Meyer from Uruguay ran ESLint on ZIM so we went in and updated a bunch of issues like missing vars, duplicate definitions, semicolons, etc.
Updated cloneAll() method to have style, group, inherit parameters
Fixed subsequent allowToggle settings in transform()
Adjusted show and hide of HotSpot() to use but rather than older backing variable
Fixed noise wave in Synth() to run with oscillator.context
Fixed series({min, max}) to properly loop on max number
Adjusted series({min, max, step}) to create an array and then just use array code - that means step has been added as well.
Fixed array creation to handle step properly.
Adjusted zimify() to not zimify() and object that already has had zimify() called on it - thanks David Dorin for the report!
Went back and did 10.9.0 (popular ZIM SHIM version) and cat 00 as well as this 01 and beyond.
Added maxConnections parameter to Frame and loadAssets() thanks Disco for the suggestion
This flows through to the CreateJS PreloadJS to the loadQueue setMaxConnections() method
Adjusted Organizer remove(index) to actually remove the item at the index rather than at the selectedIndex - thanks Disco for the report
and fixed a Window scrollX and scrollY setting issue due to an added timeout earlier.
The setting of the scroll values was setting to right position but then the 50ms timeout
set the content position back to where the scrollbars were at.
Adjusted Window to also drag after 300ms when dragBoundary is set - after enabled or disabled
This related to conflicting with damping on scrollbars or something like that...
Fixed removeAt() for List to properly adjust the selectedIndex
Adjusted transformControls dispose() to turn off events on handles, etc. - thanks Ami Hanya for find
Fixed KeyBoard to work again with blank Labels - thanks Ami Hanya.
Added scrollEnabled property to Window (and therefore List) - thanks Ami Hanya for request.
Adjusted Dial to work with mouseMoveOutside when set to true in Frame
Made Radial and RadialMenu style and inherit parameters pass through for its center circle and labels
Adjusted RadialMenu to not start with selection when adding rings
Renamed internal level property to ringLevel now that DisplayObjects have level property
Added scrambled event for Scrambler which dispatches when scrambling has stopped
LabelOnPath was needing stage update on toggle
Called toggle(true) on path to set clicking off path to hide controls.
Added frame parameter to Sprite so can load assets from Frame other than zimDefaultFrame
Fixed pause(false) on MotionController to work properly - was a lastSpeed scope issue
Adjusted noDrag() to properly close drag when slide is true so next drag() will work properly
This was affecting the toggle of enable for Window and List - important if animating a list for instance.
Adjusted the addAt() and the removeAt() of List to not go to the top each time.
We do not know why this was put in there - it may have been to prevent some bug.
We tested and it seems to work fine just leaving the list where it is.
Apologies for the List work... it is quite complicated as it uses Tabs in Window and has all sorts of thing going on.
Added frame parameter to Pen just before the style parameter to let Pen be used on other frames
Parallax addLayer() removeLayer() step() immediate() pause() - returns object for chaining
Added frame parameter to Generator just before the style parameter to let Generator be used on other frames
Fixed scaling stutter in non-Retina full mode after 10.7.1 fix - did not patch other versions as non-Retina is unusual
Fixed toggle on Button - error intruduced in ZIM Cat - the original value was set when setting text property
this was good until toggle set the text property and changed the original value to the toggled value - etc.
Also set the default rollToggleBackgroundColor and rollWaitBackingColor to the rollBackgroundColor by default
Patched interactive property for Squiggle and Blob was overwriting showControls method fixe to set _controls
Added wait parameter at end of wiggle() - will probably move this up to after main parameters in CAT 3... handy!
Patched Sprite when loading with JSON file to find frame parameter to get asset properly
thanks Ami Hanya for the catch (since the last patch with the frame parameter) and thanks Ami for the next one too
Made Window and therefore List update the stage when closed with the close button.
Took out extra ticker parameter at end of wiggle - typo
Fixed TransformManager to work with persist when adding objects to start and after with add() - needed to call persist() after later add().
Fixed dispose on Window() and List() when interactive false - thanks Stefan Meyer for these three fixes.
Adjusted Frame loadAssets() to move asset property outside init() so loadAssets() works in Animate with ZIM SHIM
Thanks Shana B. The init() does not get called as the stage is already made with Animate.
IMPROVEMENT Fixed svgToBitmap on Safari - thanks Heneman for the report. It was a bad mime-type that came from Internet code
type: "image/svg+xml;charset=utf-8" should have just been type: "image/svg+xml"
IMPROVEMENT Fixed SVGContainer and the Blob/Squiggle SVG input for points to include working with an arc
We used https://github.com/colinmeinke/svg-arc-to-cubic-bezier
We also found that 12.45.56 is actually parsed as 12.45, .56 so that was a glitch we fixed too
Here is the test file: https://zimjs.com/test/svghair.html - thanks to Heneman for the request
IMPROVEMENT Disposed shapes in dynamic mask for better performance - see https://codepen.io/zimjs/pen/xxORooW
Adjusted Sprite run() to set running false before calling the call so a run() command inside the call works properly
Made GPU true in Frame set retina to false - antialiasing looks really bad with retina true - also resizing frame with retina and gpu was not right.
Added tremolo to Synth play() to match tool at https://killedbyapixel.github.io/ZzFX/ - thanks Nikola for the find (and Frank Force for the tremolo)
Added getLatestTime(propertyName) method to ZIM Socket to get the latest server time that a property was updated
Adjusted ZIM animate series code to fix typo bug - thanks Ami for the find.
Added font, bold, italic, and variant local variables to Label so clone will clone these if changed with properties before cloning - thanks Marva
Patched Bitmap.fromData() to properly grab the image width and height then make the Bitmap and callback. Thanks Stefan for the report.
Made the TextEditor dispatch an "update" event for every change made to the text - thanks Marva for the request.
IMPROVEMENT updated Sprite so that pauseOnBlur activates the sprite again when the user goes to another tab and then tabs back. Thanks Chris S for the report

GAME 2.4
Updated ZIM game module to game_2.4 to convert time to seconds by default in various places
Also changed board.update() to not rescale the objects - thanks Jasmin for the report!
Added moveTo() for absolute animation in Board
Added movingstart event for when move() or moveTo() is called - for instance from keys.
Added nextCol and nextRow properties to moving items to find out where they are moving to.

OBJECT
Added object() global function or zim.object() if zns is true (ZIM namespace pre-load variable)
This lets you get any named DisplayObject
Added nam() short chainable method to set the name property - thanks Disco for the idea
Or use the name property (also parent.getChildByName() still works for Container children with names set)

DRAGGABLE
Added a draggable property to DisplayObjects that calls a basic drag() or noDrag()
This allows drag state to be recorded - for instance using ZIMON.
Thanks Stefan Meyer for the suggestion - and I think we had an earliers request for this too...
removed the readOnly draggable property from PEN - BREAK

DOC VIDEOS
Added videos to Docs for:
TEN: Bind, bind, Flare, Wrapper, Beads, LabelLetters, Radial, RadialMenu, DPad, Marquee, hitTestPath, ZIMON, Physics, addPhysics,
CAT: Generator, Connectors, Flipper, Socket, Synth, wire, wired, TextEditor, Poly, Page, Line, Scrambler

UPDATED
CDN, Code Page, home page Cat Mini Site, Bubbling Videos, slack, GitHub, Distill, Templates, TypeScript, NPM (as 11.1.2)
Still to come: Blog, Patreon

@danzen
Copy link
Owner Author

danzen commented Dec 27, 2020

ZIM Cat 02 - added 12K - November 18, 2020

BOOK
https://zimjs.com/cat/book.html
https://zimjs.com/darklo
Creates a book with pages that flip like a real book.
The pages are passed in as an array and can include interactivity.
The user can flip pages by dragging the pages or using the arrows.
The pages can be turned with code using nextPage() and prevPage() methods
and specific pages can be turned to with the gotoPage() method.
Book is different than ZIM Pages which have transitions and do not "flip".

LABELLETTERS - Accepts Tags IMPROVEMENT
https://zimjs.com/cat/htmltext.html
Made LabelLetters accept html-like tags as follows:
<b>bold</b> - or <strong>bold</strong>
<i>italic</i> - or <em>italic</em>
<u>underline</i> - can use this with <a> to make a classic underlined link
<a href=url target=_blank>link</a>
<font color=zimColor
backgroundColor='htmlColor'
rollBackgroundColor=#hexColor
size=20
family=verdana
group=groupStyle>font</font>
note: DO NOT use QUOTES except for single quote with colors if want HTML blue for instance rather than ZIM blue
note: setting groupStyle will make letter from scratch as opposed to building on the submitted label styles
Thanks Ami Hanya for the prompting!
BREAK - added to and adjusted the LabelLetters parameters:
label, align, valign, letterSpacing, letterSpacings, lineSpacing, lineSpacings, lineHeight, lineAlign, lineValign, cache, style, group, inherit
spacing is now letterSpacing and we have added lineSpacing and lineSpacings
The letterSpacing and lineSpacing are the default spacings.
The letterSpacings and lineSpacings are arrays that can specify certain spacings to override the default spacings.
align and valign are for the letters registration points - good for controlling animation
lineAlign and lineValign are alignments of the lines horizontally and of the letters in the lines vertically.

CHOP
https://zimjs.com/cat/scrambler.html
https://zimjs.com/explore/chop.html
The chop() functin breaks a DisplayObject into a Tile of Bitmaps - great for the Scrambler

TOALPHA
Change a color to have an alpha
Short cut to convertColor() but as method of a string
blue.toAlpha(.5)
Similar to the toColor(), lighten() and darken() methods
blue.toColor(red, .2)
blue.lighten(.3)
blue.darken(.3)

GENERATOR UPDATES
https://codepen.io/zimjs/pen/XWjrmoQ
Added a noise() function to the Generator that does ZIM Noise simplex methods automatically choosing 1D-4D.
This returns a number from 0 to 1 (matching Processing/P5js) as opposed to -1 to 1.
Added a seed parameter to Generator to set the Noise seed if desired.
Added resetup(), redraw() and restamp() methods to Generator
To call the setup, and start the draw and stamp functions again
This is very cool with stamp as we can animate through stamped pictures to basically animate the Generator
-- beyond just doing the draw animation - see https://codepen.io/zimjs/pen/XWjrmoQ
Added clear and reset methods to Generator
The clear() method will clear the image but keep the transforms
The reset() method will reset the transforms, set to startX and startY and reset color, strokeColor and strokeWidth
These can also be called through resetup(), redraw() and restamp()

GENERAL
Added ZIM multi-asset format for Frame asset loading (both in Frame and loadAssets()) - thanks Netanela
This makes it easier to handle multiple paths - for example:
[{assets:["one.png", "two.png"], path:"images/"}, {assets:["big.mp3", "oof.mp3"], path:"sounds/"}]
Further properties are loadTimeout, maxNum, and noCORSonImage
Updated Frame and loadAssets() maxConnections to 10 - thanks Disco for the discovery (and thanks CreateJS)
Adjusted ZIM Page to not apply styles to inside Rectangle as styles already applied to Page parameters
and take on backing of stage.height and stage.width by default rather than screen height an screen width
Adjusted hitTests to only show up once each in Distill
Removed all references to pressdown - failed attempt to match pressmove - but e.target is wrong so did not work.
Added expand, expandVertical, expandBar, expandBarVertical parameters to end of Slider
Adjusted Sprite to work with asset without path provided - also need to put proper path (ie. assets/sheet.png) in json file
Fixed lighten(), darken(), toColor() to work with "red", etc. - methods were on a String object so it needed to be converted with String(color) - weird
Adjusted TextArea readOnly, spellCheck and placeholder to accept styles and be set to true or false properly - thanks Cajoek for the mention
IMPROVEMENT Reorganized Frame assets to be global so multiple frames hold same assets object and do not overwrite one another
Made Stepper default to "list" intead of "number" if array is passed in to list parameter.
Added percent and percentClose properties to Circle - thanks Netanela for the suggestion - very cool to see percent animate.

PATCHES
Added cache as a STYLE function - thanks Disco Drama for the inspiration
STYLE = {cache:true} // will cache all DisplayObjects - or cache individual types, etc.
Fixed Dial press to jump to value when dial rotated
Remembered to update the version... this is new to ZIM Cat... takes some getting used to.
Fixed ZIM Multi-asset Object - bug in multiple loads now fixed - thanks Netanela
Also adjusted Multi-asset Object so if filename is the same as a previous filename
this file gets the path added to its id.
Adjusted alp() to set any object with a tag property so the opacity of the tag is set
This means a textArea.alp(.5) will actually set the alpha of the HMTL tag as well
This does not work with textArea.alpha = .5 - only with the .alp() - Thanks Cajoek for prompting.
Updated ZIM Sprite to work with multiple spritesheets for one Sprite - Thanks Netanela for the suggestion.
Added factor and offset to ZIM List.slider static method
Added container scaling adjust in resize() for Tag() and Loader() to match TextArea - thanks Stefan for the find.
Fixed LabelLetters dispose() method - thanks Cajoek for the find!
Added new line \n and \r support to LabelLetters - was there for <br>
Adjusted TextEditor to display none the HTML textarea when colorPicker is activated
Added "color" event to TextEditor that dispatches when colorPicker is opened
Added closeColorPicker() method to TextEditor to close colorPicker - and add HTML textarea back
Changed color property of TextEditor to swatch to reference the Rectangle - was not even hooked up and color is the wrong name
Note that the color parameter is the color of the text which is completely independent from the swatch and the ColorPicker
(these handle the label - not the TextArea)
Fixed dynamic animation with percentComplete in ZIM Cat - adjusted to handle time in seconds - thanks Maziear Mou for the report.
Made transform() not try and transform scaleX or scaleY of object with no scaleX or scaleY - like a line which has not scale Y. Maziear Mou for the report.
Adjusted various DISTILL check conditionals to not start as true - not needed - made consistent and added animateCheck too.
IMPROVEMENT fixed object.rate for animate series - now applies rate to all tweens.
Added test to name in clone so does not make a name of undefined and keep reference to object!
Changed the check on the TextEditor to a Shape - thanks James for reporting that Apple iOS can't support a checkmark that everywhere else supports
Also added a frame parameter to TextEditor for locating TextEditor on different frame - helps with ColorPicker and TextArea - thanks James Barrett for the find
Adjusted Distill to work again with ZIM Shapes - the CustomShape was in the wrong order - thanks Chris S for the report
Patched borderWidth of ZIM shapes so when set to 0 it can be set back to a thickness - glitch in CustomShape code - thanks Maziear Mou for the find
IMPROVEMENT Added multiple and accept parameters to Loader (thanks Ami Hanya for the suggestion)
multiple - (default true) set to false to let user only upload one file rather than multiple files (with shift or ctrl)
accept - (default null) set to extension / MIME-type to limit types of files the upload dialog will suggest
here are some examples:
"image/*"
"image/jpeg, image/png"
".png, .jpeg, .jpg, .gif"
"image/jpeg, .jpeg, .jpg"
".txt, .json, application/json"
Adjusted Button toggle parameter to accept a Boolean true (as well as a String) to toggle the various colors, etc. without changing the Label text - thanks Cajoek for idea
Adjusted Tag, TextArea and Loader to do a parentNode test when disposing to make sure HTML tag is there - thanks Frank Los for the report
Added changeFrame(frame) method to ZIM Book if the book needs to change frames - thanks James for the suggestion
IMPROVEMENT updated Sprite so that pauseOnBlur activates the sprite again when the user goes to another tab and then tabs back. Thanks Chris S for the report
See the section on LAYOUT for new layout "Region" feature
IMPROVEMENT animate now adds a tweenState object to its target.
This has properties for all the object ids and a property called all.
These keep track of what is animating for the object.
The setBlurDectect() now uses this to pause and start individual animations rather than all or none.
Previously, the latest paused state was recorded and reused - this could lead to paused ids animating on return to focus.
Adjusted animate to stop sprite if sprite was stopped and pauseAnimate(false) is set
For Sprites with other animate() calls this would cause the sprite to run quickly through its frames.
Fixed animate() with from and relative amount such as "100"
Changed draggable parameter of pen to move. this is the parameter to say whether the lines can be moved afterwards
BREAK although, not really - the draggable parameter was not working since it was conflicting with the draggable property added to all DisplayObjects.
Changed distill() to filter out duplicates - we were keeping track of how many times certain features were used - but recording the feature once now is fine.
Fixed bug in loading noCORSonImage with multiple images - thanks Ami Hanya and Disco Drama for the find

MEMORY (Patched in ZIM Cat 02) IMPROVEMENT
Thanks Disco Drama for memory prompting leading the examination of all ZIM objects and functions.
Here is a list of the updates so far - the adjustments to dispose() are still under way:
Added disposeAllChildren() method to container (and Stage/StageGL) to remove and dispose all container children but leave the container (thanks Disco Drama for request)
Added zim.KEYFOCUS check in gD (globalDispose) to remove focus reference
Fixed the following for dispose()
COMPONENTS
List - removed a bunch or references to tabs
Tabs - button, label references
Layer - removed stagemouseup event
Stepper - removed references to Label, Rectangle, Triangles
Selector - added dispose to container
TextEditor - removed references to all parts so they dispose - color, font, size, etc. components
TextArea - removed DOM events on TextArea tag so dispose clears from memory
KeyBoard - changed .name properties to .na properties to not conflict with .name/nam() global properties
Organizer - extended Tabs but had its own that.buttons which overrode the Tabs buttons so it could not be disposed (3 hour bug)
Connectors - removed keydown event so can dispose properly
Checked all components. 12/08/20
METHODS
animate() - Animated objects were being held in memory even if disposed. This has been adjusted.
tap() - Objects with tap() were being held in memory even when disposed. This has been adjusted.
wire() and wired() - DisplayObject dispose() methods now check for wire or wired and removes the connection - freeing the object from memory.
// also checked drag(), gesture(), transform(), with no problems
TODO - more methods, shapes and controls

LAYOUT
https://zimjs.com/explore/layouts.html
If the object in a region is given a type="Region" then it will have its bounds set to the region size.
This allows for another Layout to be nested within a region and scale to the inner region.
For example:
var content = new Container(500,500);
content.type = "Region"; // this now will have its bounds set to the region size
If the object is a Container (usual choice) then it must be given a starting width and height
which will be reset to the region size and resized to continue to match the region size.
Thanks Zeke Chan for the prompting

ZIM DEV SITE
https://dev.zimjs.com (link also on front page at top right)
Created a site for developers with a toned down "expression"
and focused on how to put ZIM into other frameworks and other libraries into ZIM
Includes 24 examples of ZIM Components, Conveniences and Controls plus the code.
Provided review from developers (thanks, Iestyn, Ami and Diso)
Summarized the versions of ZIM - ONE, DUO, TRI, 4TH, VEE, SIX, HEP, OCT, NIO, TEN, CAT
Provided articles from Medium - https://zimjs.com/medium
Also started writing articles at DEV.to - https://dev.to/zimlearn

ZIM LAB
https://zimjs.com/lab.html
Replaced ZIM ZOO (https://zimjs.com/zoo.html) with ZIM Lab
for a more generic online editor
Includes 8 samples: BLOB, EMIT, ART, BALLS, SYNTH, RADIAL, SPRITE, and WIG

ZIM ZOOM
Held a ZIM ZOOM previewing ZIM Book
Thanks for those that came out and shared stories and updates!
Keep in touch at https://zimjs.com/slack for the next meet.

UPDATED
Home page Cat Mini Site, CDN, Code Page, Slack, GitHub, Distill, NPM (11.2.0), TypeScript, Templates
Still to come:Bubbling Videos, Blog, Patreon

@danzen
Copy link
Owner Author

danzen commented Mar 30, 2021

These are formatted at https://zimjs.com/updates.html - so please visit the site for the latest updates solving thousands of issues over the last six years. Issues are usually solved within a day.

@douglasg14b
Copy link

douglasg14b commented Apr 1, 2023

I guess this explains why I can't find many resources, discussion, or information about ZIM. It's all lost to slack, and not available for search engine indexing. 🤔


It's pretty highly NOT recommended to deal with issues in information black holes such as Slack. This means that users can't actually find information about your engine via Googling. And that information is perpetually lost in a private portion of the internet. This does not do you or the community any favors, and significantly restricts troubleshooting & research.

There are lots of ways to have issue boards that result in critical information not being lost on a regular basis. GitHub issues, GitHub discussions, Discourse (forum specifically made for this task), a classic forum ...etc

For devs, access to self-help information & troubleshooting on platforms they already use is paramount, eliminating that makes onboarding harder, and can quickly drive potential users away. It hurts engagement, lowers search engine priority, and overall makes ZIM more obscure.

I don't say this just to be critical, but to help, bringing your information to devs in the platform they use instead of having devs hunt to find it from you in a private space is an important concept for engagement & recognition. You have an awesome project here, seriously impressive and worthy of greater recognition, and the lack of available information online (Aside from your docs) really doesn't do you or ZIM any favors, if anything it's actively doing you & users a disfavor.

@danzen
Copy link
Owner Author

danzen commented Dec 22, 2023

We are looking into it, @douglasg14b - thanks for the advice.

@danzen
Copy link
Owner Author

danzen commented Jan 28, 2024

@douglasg14b - we have just launched a new forum at https://forum.zimjs.com on our servers powered by Discourse. Cheers.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants