aboutsummaryrefslogtreecommitdiff
path: root/node_modules/montage/CHANGES.md
diff options
context:
space:
mode:
Diffstat (limited to 'node_modules/montage/CHANGES.md')
-rwxr-xr-xnode_modules/montage/CHANGES.md347
1 files changed, 347 insertions, 0 deletions
diff --git a/node_modules/montage/CHANGES.md b/node_modules/montage/CHANGES.md
new file mode 100755
index 00000000..5b544221
--- /dev/null
+++ b/node_modules/montage/CHANGES.md
@@ -0,0 +1,347 @@
1# v0.10.0
2
3- **New property change API**
4
5 In prior Montage releases if you wanted to be notified when the value of a property changed, or an array was
6 modified, you used the addEventListener() API to register a listener object (or function). This API has been
7 replaced with addPropertyChangeListener(), which does everything that addEventListener() did, plus more.
8
9- **Changes to data binding**
10
11 In this release, bindings can only be serialized on the source object in the binding. Practically, this means that
12 the arrow in the binding serialization can only point from right-to-left, not from left-to-right.
13 Also, the double-arrow syntax (<<->, for example) is no longer valid.
14
15- **__debugChangeNotifications__()**
16
17 To help debug and inspect change listeners that you’ve registered on an object, call __debugChangeNotifications__()
18 This is temporary stop gap which will be replaced by better debugging tools soon.
19
20- **KeyComposer and KeyManager**
21
22 Montage now includes a mechanism for easily listening for and responding to keyboard events, including individual
23 keys, or key combinations that you specify. It consists of two Montage objects: KeyComposer and KeyManager. You
24 create a KeyComposer object and specify the keys, or key combinations, that you want to respond to, as well as the
25 listener object that defines the necessary handlers. A default instance of the KeyManager prototype listens for
26 native key events on behalf of all active KeyComposers. It then invokes a callback method on the listener object
27 you specified.
28
29- **TokenField**
30
31 The TokenField component is a text input component that displays tokens as its content.
32
33- **Flow component**
34
35 The Flow component now supports selection handling and a feature called “stride”. The stride of a Flow component
36 defines points at regular intervals where scrolling should stop. For example, suppose you are creating a carousel
37 of album covers and you want the scrolling to stop when it reaches a position where the next album is always
38 positioned at the center. In this case the stride value would be the scroll distance between an element at the
39 center and the next element at the center. If you wanted scrolling to stop at every second or third album you would
40 set a stride to double or triple of that value. That way you could have, for example, a page showing 10 albums, and
41 you would be able to scroll 10 albums at a time, never stopping in the middle.
42
43- **DynamicElement**
44
45 The DynamicElement component takes a string of plain text or HTML and inserts it into the component’s associated DOM
46 element, clearing any existing content.
47
48
49# v0.9.0
50
51- **Draw cycle changes**
52
53 After the willDraw phase all the components needing draw are sorted by their level in the
54 component hierarchy. They are then processed in reverse order. This ensures that all the
55 childComponents needing draw have drawn by the time the parent's draw is called. The didDraw
56 uses the same list but processes the componets in top down order (the reverse of draw)
57
58- **Components**
59
60 Autocomplete Textfield Added
61 An Autocomplete Textfield extends the Textfield component to support suggestions for the user to pick values.
62 The HTML markup for the Autocomplete is the same as the standard HTML5 markup (<input>).
63 Wrapping the <input> HTMLElement as a Montage Autocomplete component adds Data Binding support for all
64 writable attributes of this element and allows the Developer to provide suggestions to the user based
65 on the entered value.
66
67 Popup
68 Support HTMLElement and Montage Component for the anchor property
69 Change willPositionPopup(popup, anchor, anchorPosition) to willPosition(popup, defaultPosition).
70 Change autoDismiss to autoHide
71 Support autoHide only for non-modal popups
72 Support string values (eg: 20px, 30%) for position parameters. If a number is provided, default to 'px'.
73
74- **Template**
75
76 ``instantiateWithDocument(document, callback)`` method is added to use plain html templates without an owner.
77
78 Backwards compatibility for id attribute based references in serilization is removed, you should now use the
79 data-montage-id attribute.
80
81# v0.8.0
82
83- **Data binding shorthand in serializations**
84
85 This release introduces a new shorthand syntax for declaring data bindings in a serialization. The new syntax
86 includes an arrow symbol that indicates the source of the binding and whether its one-way or two-way.The symbol can
87 take one of the following forms:
88
89 `<-` – One-way data binding, bound object on right
90
91 `->` – One-way data binding, bound object on left
92
93 `<<->` – Two-way data binding, bound object on right
94
95 `<->>` – Two-way data binding, bound object on left
96
97 Example:
98
99 ```javascript
100 {
101 "inputText": {
102 "prototype": "textfield",
103 "bindings": {
104 "value": {"<-": "@slider.value"}
105 }
106 }
107 }
108 ```
109
110- **RichTextEditor component**
111
112 RichTextEditor is a lightweight component that provides basic HTML editing capability. It is wrapper around the
113 HTML5 contentEditable attribute, and depends on the browser’s level of support of the execCommand() method. The
114 RichTextEditor lets you set, on a specific text selection range, various formatting attributes including text and
115 font styles, colors, justification, list style and paragraph indent level. It also supports drag-and-drop of images,
116 plain text, or HTML fragments between two HTML documents, or the desktop and the document. Images can also be
117 resized within the editor.
118
119- **Flow component**
120
121 This release introduces the first drop of the Flow component. Flow is UI component that allows the design of
122 scrollable 3D-layouts. Flow is useful for creating a wide range of visual interfaces from 3D carousels to common
123 vertical and horizontal scrollable lists.
124
125- **Extending components**
126
127 There are three options to extend a component’s template:
128
129 1. If the extended component doesn’t wish to introduce changes in the template, the component can set its
130 templateModuleId property to point to the parent module’s template.
131 2. Create a new template that will completely redefine the markup of the component with no relation to the original
132 template.
133 3. Set the extends property of the template that points to the template to be imported and where. This is similar
134 to the “decorator” pattern of the proposed Web Components feature. This approach is useful when the component
135 needs to add additional CSS data, or reuse the original markup. The template object will be accessible through
136 the template label of the serialization.
137
138- **Auto packaging**
139
140 Many applications will initially only use their own modules and those provided by the Montage package.
141 As long as that’s the case, you do not need to make a package.json; just put the data-auto-package attribute on
142 your Montage script tag.
143
144- **Pop-up component updates**
145
146 The Popup component API has been updated to provide better support for popup positioning.
147
148 - `anchor` The HTMLElement or Montage component below which the popup will be anchored on the page. To specify a
149 custom position for a popup, use a delegate (see below). If an anchor is not provided, the position property is
150 used, if provided. If no positioning support is provided, the Popup is displayed at the center of the screen by
151 default.
152 - `position` An object with properties named top, left, bottom and right that specify the position of the popup.
153 This property is used to position the popup if no anchor is specified.
154 - `delegate` An object that defines methods that are invoked by the Popup component. The only delegate method
155 currently supported is willPositionPopup(). This method must return an object with any of the following
156 properties: top, left, bottom or right. Values assigned to these properties must strings in valid
157 CSS units (“10px” or “50%”).
158 - `content` The Montage component that will be displayed in the popup.
159 - `modal` If set to true, the popup is rendered with a mask underneath. A non-modal popup is hidden when the user
160 presses the Esc key, or clicks outside of the popup. The developer is responsible for hiding a modal popup.
161 Default is false. Modal popups never auto-hide themselves.
162 - `autoHide` Optional. The popup will be automatically hidden after the specified number of milliseconds. This
163 property has no effect on modal popups.
164
165
166# v0.7.0
167
168- **Adding `ownerComponent` property to the Component.**
169 When the template is deserialized we populate the ownerComponent property of any component created within it's
170 serialization with the owner of the template.
171- **Adding `setElementWithParentComponent` function on the Component.**
172 This formalizes the API to set a detached element to a component. The caller is responsible for appending the
173 element to the DOM before prepareForDraw is called on the callee.
174- **Serialization changes**
175 - Specifying types and references
176 1. Changed the way we specify an object by merging the module id and the name into only one string using
177 `"<module>[<name>]"` (e.g.: `"montage/ui/button.reel[Button]"`). When the name matches the last part of the module
178 id then it's automatically inferred and there's no need to provide it. The last part of the module id is considered
179 to be the last path component (e.g.: `"event-name"` in `"montage/event/event-name"`) transformed to CamelCase with
180 dashes stripped (e.g.: `"EventName"`). When the last path component ends with `".reel"` then the component is
181 considered without its `".reel"` suffix (e.g: `"RadioButton"` for `"montage/ui/radio-button.reel"`). Under these new
182 rules we reach the following equivalence: `"montage/ui/button.reel[Button]" === "montage/ui/button.reel"`.
183 2. The possibility to point to an object instead of just being able to declare an instance of a specific prototype.
184 We were using the pair `module/name` to declare an instance of that prototype, with this new change only one
185 property is needed -- `prototype` -- using the rules defined in 1). If, instead of a new object, we just want to
186 point to an existing one the new `object` property name should be used.
187
188 In practice this means a change from:
189
190 ```javascript
191 {
192 "label": {
193 "module": "montage/ui/button.reel",
194 "name": "Button",
195 "properties": {...}
196 }
197 }
198 ```
199 to
200 ```javascript
201 {
202 "label": {
203 "prototype": "montage/ui/button.reel",
204 "properties": {...}
205 }
206 }
207 ```
208 - Serialization labels are now used as the value of the identifier property by default.
209
210- **Properties with a leading underscore in their name are now {enumerable: false} by default.**
211 i.e. defining a property as
212 ```javascript
213 _name: {value: null}
214 ```
215 is equivalent to doing
216 ```javascript
217 _name: {value: null, enumerable:false}
218 ```
219- **Components**
220 - Repetition: Adding indexMap property to provide the necessary underpinnings for large data handling.
221 - SelectInput: Adding values and value property to be able to bind directly to the value of the selected option(s)