diff --git a/tests/app/application-settings.md b/tests/app/application-settings.md
index 2715d6065..ce43cd27d 100644
--- a/tests/app/application-settings.md
+++ b/tests/app/application-settings.md
@@ -7,32 +7,32 @@ previous_url: /ApiReference/application-settings/HOW-TO
---
# Application Settings
Using application settings methods requires to load "application settings" module.
-
+{%snippet application-settings-require%}
## Working with string, number and boolean values
### Set and get boolean value and provide default value in case it is not set
-
+{%snippet application-settings-boolean%}
### Set and get string value
-
+{%snippet application-settings-string%}
### Set and get numeric value.
We use `toFixed()` here in order to avoid floating point errors - ex: `54.321` becoming `54.320999999537`.
Beware the result of `toFixed()` is a string not a number therefore you cannot use `===` or `!==` when comparing with a number.
-
+{%snippet application-settings-number%}
### Reading values that are not set before while providing default value
-
+{%snippet application-settings-notset%}
### Reading values that are not set before not providing default value
-
+{%snippet application-settings-nodefault%}
## Other functions
### Checking for existence of value for key
-
+{%snippet application-settings-haskey%}
### Removing value for key
-
+{%snippet application-settings-removekey%}
### Removing all values
-
+{%snippet application-settings-clear%}
diff --git a/tests/app/application.md b/tests/app/application.md
index 5d5c5f6ad..52d311cb3 100644
--- a/tests/app/application.md
+++ b/tests/app/application.md
@@ -9,26 +9,26 @@ previous_url: /ApiReference/application/HOW-TO
The Application module provides abstraction over the platform-specific Application implementations.
It is the main BCL module and is required for other BCL modules to work properly.
The default bootstrap.js implementation for each platform loads and initializes this module.
-
+{%snippet application-require%}
The pre-required `app` module is used throughout the following code snippets.
### Checking the target platform
Use the following code in case you need to check somewhere in your code the platform you are running against:
-
+{%snippet application-app-check%}
### Using the Android-specific implementation
Accessing the Android-specific object instance (will be undefined if running on iOS)
-
+{%snippet application-app-android%}
### Using the Android Application context
-
+{%snippet application-app-android-context%}
### Tracking the current Activity
-
+{%snippet application-app-android-current%}
### Registering a Broadcast Receiver (Android)
-
+{%snippet application-app-android-broadcast%}
### Adding a Notification Observer (iOS)
-
+{%snippet application-ios-observer%}
diff --git a/tests/app/camera.md b/tests/app/camera.md
index f2fc5ed96..36b7ee6b4 100644
--- a/tests/app/camera.md
+++ b/tests/app/camera.md
@@ -7,10 +7,10 @@ previous_url: /ApiReference/camera/HOW-TO
---
# Camera module
Using a camera requires the camera module.
-
+{%snippet camera-require%}
### Taking a picture.
-
+{%snippet camera-take-picture%}
### Check for availability
-
\ No newline at end of file
+{%snippet camera-is-availabile%}
diff --git a/tests/app/color.md b/tests/app/color.md
index c0a8392d2..beb0c0955 100644
--- a/tests/app/color.md
+++ b/tests/app/color.md
@@ -7,16 +7,16 @@ previous_url: /ApiReference/color/HOW-TO
---
# Color
Using Colors requires the "color" module.
-
+{%snippet color-require%}
### Creating a Color from a hex value.
-
+{%snippet color-hex%}
### Creating a Color from a short hex value.
-
+{%snippet color-hex-short%}
### Creating a Color from four ARGB values
-
+{%snippet color-rgb%}
### Creating a Color from a single ARGB value
-
+{%snippet color-rgb-single%}
diff --git a/tests/app/connectivity.md b/tests/app/connectivity.md
index ddc259cbf..daefe46b3 100644
--- a/tests/app/connectivity.md
+++ b/tests/app/connectivity.md
@@ -7,10 +7,10 @@ previous_url: /ApiReference/connectivity/HOW-TO
---
# Connectivity
Obtaining connectivity information requires the "connectivity" module.
-
+{%snippet connectivity-require%}
### Getting connection type
-
+{%snippet connectivity-type%}
### Monitoring connection type.
-
+{%snippet connectivity-monitoring%}
diff --git a/tests/app/console.md b/tests/app/console.md
index 642312d5c..57b604ff7 100644
--- a/tests/app/console.md
+++ b/tests/app/console.md
@@ -9,27 +9,27 @@ previous_url: /ApiReference/console/HOW-TO
### Logging
Logging to the console does not require the "console" module since the console variable is global. It can be used anywhere within your code.
You can log your message in several different categories.
-
+{%snippet console-log%}
### Time
Begins counting a time span for a given name (key).
-
+{%snippet console-time%}
Ends a previously started time span through the time method.
-
+{%snippet console-timeend%}
### Assert
Asserts a boolean condition and prints a message in case the assert fails.
-
+{%snippet console-assert%}
### Dir
Prints the state of the specified object to the console.
-
+{%snippet console-dir%}
### Dump
Prints the state of the specified object to the console.
-
+{%snippet console-dump%}
### Trace
Prints the current stack trace in the console.
-
+{%snippet console-trace%}
diff --git a/tests/app/data/observable-array-tests.ts b/tests/app/data/observable-array-tests.ts
index e4156c05d..8b9df3d33 100644
--- a/tests/app/data/observable-array-tests.ts
+++ b/tests/app/data/observable-array-tests.ts
@@ -98,7 +98,7 @@ export var test_ObservableArray_joinShouldReturnStringWithAllItemsSeparatedWithC
// >> observable-array-join
var array = new observableArrayModule.ObservableArray([1, 2, 3]);
var result = array.join();
- // >> observable-array-join
+ // << observable-array-join
TKUnit.assert(result === "1,2,3", "ObservableArray join() should return string with all items separated with comma!");
};
diff --git a/tests/app/data/observable-array.md b/tests/app/data/observable-array.md
index a12aee7a9..1c0377bb8 100644
--- a/tests/app/data/observable-array.md
+++ b/tests/app/data/observable-array.md
@@ -6,109 +6,109 @@ description: "Examples for using observable-array"
previous_url: /ApiReference/data/observable-array/HOW-TO
---
# Observable Array module
-
+{%snippet observable-array-require%}
### Create ObservableArray from array.
-
+{%snippet observable-array-create%}
### Create ObservableArray from arguments.
-
+{%snippet observable-array-arguments%}
### Create ObservableArray with specific length.
-
+{%snippet observable-array-length%}
### Set ObservableArray length to new value.
-
+{%snippet observable-array-newvalue%}
### Get item at specified index using getItem(index) method.
-
+{%snippet observable-array-getitem%}
### Set item at specified index using setItem(index, item) method.
-
+{%snippet observable-array-setitem%}
### Set item at specified index using setItem(index, item) method and observe change event data.
-
+{%snippet observable-array-eventdata%}
### Use concat() method to combine ObservableArray with array.
-
+{%snippet observable-array-combine%}
### Use join() method to convert ObservableArray to comma separated string.
-
+{%snippet observable-array-join%}
### Use join(separator) method to convert ObservableArray to string separated with specified separator.
-
+{%snippet observable-array-join-separator%}
### Use pop() method to remove the last element.
-
+{%snippet observable-array-join-pop%}
### Handle "change" event to know more info about the change after calling pop() method.
-
+{%snippet observable-array-join-change%}
### Use push() method to add single element to the array.
-
+{%snippet observable-array-push%}
### Handle "change" event to know more info about the change after calling push() method with single element.
-
+{%snippet observable-array-change-push%}
### Use push() method to add multiple elements to the array.
-
+{%snippet observable-array-push-multiple%}
### Handle "change" event to know more info about the change after calling push() method with multiple elements.
-
+{%snippet observable-array-push-multiple-info%}
### Use push() method to add multiple elements from source array to the ObservableArray.
-
+{%snippet observable-array-push-source%}
### Handle "change" event to know more info about the change after calling push() method with multiple elements from source array.
-
+{%snippet observable-array-push-source-info%}
### Use reverse() method to reverse the elements order of the ObservableArray.
-
+{%snippet observable-array-reverse%}
### Use shift() method to remove the first element of the array.
-
+{%snippet observable-array-shift%}
### Handle "change" event to know more info about the change after calling shift() method.
-
+{%snippet observable-array-shift-change%}
### Use slice() method to return array with all ObservableArray elements.
-
+{%snippet observable-array-slice%}
### Use slice(star, end) method to return section of the array.
-
+{%snippet observable-array-slice-args%}
### Use sort() method to sort the array.
-
+{%snippet observable-array-sort%}
### Use sort(compareFunction) method to sort the array with your own comparing logic.
-
+{%snippet observable-array-sort-comparer%}
### Use splice(start, deleteCount) method to delete elements in the array.
-
+{%snippet observable-array-splice%}
### Handle "change" event to know more info about the change after calling splice(start, deleteCount) method.
-
+{%snippet observable-array-splice-change%}
### Use splice(start, deleteCount, ...arguments) method to remove and insert elements in the array.
-
+{%snippet observable-array-splice-args%}
### Handle "change" event to know more info about the change after calling splice(start, deleteCount, ...arguments) method.
-
+{%snippet observable-array-splice-args-change%}
### Use unshift(item1, item2... itemN) method to insert elements from the start of the array.
-
+{%snippet observable-array-unshift%}
### Handle "change" event to know more info about the change after calling unshift(item1, item2... itemN) method.
-
+{%snippet observable-array-unshift-change%}
### Use indexOf(item) method to get the index of the desired item in the array.
-
+{%snippet observable-array-indexof%}
### Use indexOf(item, fromIndex) method to get the index of the desired item in the array starting from specified index.
-
+{%snippet observable-array-indexof-args%}
### Use lastIndexOf(item) method to get the last index of the desired item in the array.
-
+{%snippet observable-array-lastindexof%}
### Use lastIndexOf(item, fromIndex) method to get the last index of the desired item in the array starting from specified index.
-
+{%snippet observable-array-lastindexof-args%}
diff --git a/tests/app/data/observable.md b/tests/app/data/observable.md
index 2fa765b3f..9b4a7bfcf 100644
--- a/tests/app/data/observable.md
+++ b/tests/app/data/observable.md
@@ -7,10 +7,10 @@ previous_url: /ApiReference/data/observable/HOW-TO
---
# Observable
Using Observable objects requires the "data/observable" module.
-
+{%snippet observable-require%}
### Creating an Observable
-
+{%snippet observable-creating%}
### Responding to property changes
-
+{%snippet observable-property-change%}
diff --git a/tests/app/data/virtual-array.md b/tests/app/data/virtual-array.md
index 359313f3f..a47909149 100644
--- a/tests/app/data/virtual-array.md
+++ b/tests/app/data/virtual-array.md
@@ -6,7 +6,7 @@ description: "Examples for using virtual-array"
previous_url: /ApiReference/data/virtual-array/HOW-TO
---
# Virtual Array module
-
+{%snippet virtual-array-require%}
### Handle "itemsLoading" event to load items on demand using load() method.
Use "length" property set via VirtualArray constructor to specify total number of items,
@@ -14,11 +14,11 @@ Use "length" property set via VirtualArray constructor to specify total number o
"itemsLoading" event to handle items request and "load()" method to copy items into the array.
All already loaded items are cached in -memory and when "getItem()" method is called
the array will raise "itemsLoading" event for still not loaded items.
-
+{%snippet virtual-array-itemsloading%}
### Handle "change" event when you load items using load() method.
-
+{%snippet virtual-array-change%}
### Handle "change" event when you increase "length" property.
-
+{%snippet virtual-array-lenght%}
diff --git a/tests/app/fetch.md b/tests/app/fetch.md
index bbad31c1f..04d9449ef 100644
--- a/tests/app/fetch.md
+++ b/tests/app/fetch.md
@@ -6,22 +6,22 @@ description: "Examples for using fetch"
previous_url: /ApiReference/fetch/HOW-TO
---
### Get Response from URL
-
+{%snippet fetch-response%}
### Get string from URL
-
+{%snippet fetch-string%}
### Get JSON from URL
-
+{%snippet fetch-json%}
### Get FormData from URL
-
+{%snippet fetch-formdata%}
### Get Response status
-
+{%snippet fetch-status-response%}
### Get response headers
-
+{%snippet fetch-headers-response%}
### Post JSON
-
+{%snippet fetch-post-json%}
diff --git a/tests/app/file-system.md b/tests/app/file-system.md
index 12be983b5..f17c1fe9b 100644
--- a/tests/app/file-system.md
+++ b/tests/app/file-system.md
@@ -7,87 +7,87 @@ previous_url: /ApiReference/file-system/HOW-TO
---
# File System
Using the file system requires the FileSystem module.
-
+{%snippet file-system-require%}
The pre-required `fs` module is used throughout the following code snippets.
## Path
### Normalize a Path
-
+{%snippet file-system-normalize%}
### Path Join
Concatenate a path to a file by providing multiple path arguments.
-
+{%snippet file-system-multiple-args%}
### Get the Path Separator
-
+{%snippet file-system-separator%}
### Get or Create a File With Path
The following example writes some text to a file created for path.
It will create a new file or overwrite an existing file.
-
+{%snippet file-system-create%}
### Get or Create a Folder With Path
-
+{%snippet file-system-create-folder%}
## Create
### Writing a string to a File
The following example writes some text to a file.
It will create a new file or overwrite an existing file.
-
+{%snippet file-system-write-string%}
### Get or Create a File
-
+{%snippet file-system-create-file%}
### Get or Create a Folder
-
+{%snippet file-system-get-folder%}
## Read
### Reading from a File
The following example writes some text to a file and then reads it back.
-
+{%snippet file-system-example-text%}
### Reading/writing binary data from/to a File
-
+{%snippet file-system-read-binary%}
### Getting the Known Folders
Each app has several well known folders. This is how to access them:
-
+{%snippet file-system-known-folders%}
### Getting Folder Contents
Getting all files and folders within a folder:
-
+{%snippet file-system-folders-content%}
### Enumerating Folder Contents
Getting all folder entities in array may be slow with large number of files.
Enumerating the folder entities would iterate the files one by one without blocking the UI.
-
+{%snippet file-system-enum-content%}
### Getting Parent Folder
-
+{%snippet file-system-parent%}
### Getting File Name and Extension
-
+{%snippet file-system-extension%}
### Checking if a File Exists
-
+{%snippet file-system-fileexists%}
### Checking if a Folder Exists
-
+{%snippet file-system-folderexists%}
## Update
### Renaming a File
-
+{%snippet file-system-renaming%}
### Renaming a Folder
-
+{%snippet file-system-renaming-folder%}
## Delete
### Removing a File
To 'delete', 'remove' or 'unlink' a file use the file's remove method:
-
+{%snippet file-system-remove-file%}
### Removing a Folder
-
+{%snippet file-system-remove-folder%}
### Clearing the Contents of a Folder
The clear method removes all files within a folder.
-
+{%snippet file-system-clear-folder%}
diff --git a/tests/app/fps-meter.md b/tests/app/fps-meter.md
index 4c2692e0a..c0f28f8a3 100644
--- a/tests/app/fps-meter.md
+++ b/tests/app/fps-meter.md
@@ -7,7 +7,7 @@ previous_url: /ApiReference/fps-meter/HOW-TO
---
# Frames-per-second meter
Logging frames-per-second statistics for your app requires the "fps-meter" module.
-
+{%snippet fps-meter-require%}
### Start and stop logging
-
+{%snippet fps-meter-logging%}
diff --git a/tests/app/http.md b/tests/app/http.md
index 22245a2a5..a7669bfde 100644
--- a/tests/app/http.md
+++ b/tests/app/http.md
@@ -7,31 +7,31 @@ previous_url: /ApiReference/http/HOW-TO
---
# Http module
Using http methods requires to load "http" module.
-
+{%snippet http-require%}
### Get string from URL
-
+{%snippet http-get-string%}
### Get JSON from URL
-
+{%snippet http-get-json%}
### Get Image from URL
-
+{%snippet http-get-image%}
### Get File from URL. By default the file will be saved in Documents folder.
-
+{%snippet http-get-urlfile%}
### Get content as File from URL. You can specify where the file should be saved.
-
+{%snippet http-get-urlfile-content%}
### Get response status code
-
+{%snippet http-get-response%}
### Get response headers
-
+{%snippet http-get-response-headers%}
### Get response content
-
+{%snippet http-get-response-content%}
### Post JSON
-
+{%snippet http-post-json%}
diff --git a/tests/app/image-source.md b/tests/app/image-source.md
index c77250bce..0cdbbbffd 100644
--- a/tests/app/image-source.md
+++ b/tests/app/image-source.md
@@ -7,21 +7,21 @@ previous_url: /ApiReference/image-source/HOW-TO
---
# Image source
Using the image source requires the image-source module.
-
+{%snippet imagesource-require%}
The pre-required `imageSource` module is used throughout the following code snippets.
We also use fs module defined as follows:
-
+{%snippet imagesource-require-alt%}
## Loading and saving images
### Load image using resource name
This is similar to loading Bitmap from `R.drawable.logo` on Android or calling `[UIImage imageNamed@"logo"]` on iOS
-
+{%snippet imagesource-resname%}
### Load image from URL
-
+{%snippet imagesource-load-url%}
### Save image source to PNG or JPG file
-
+{%snippet imagesource-save-to%}
### Load image from a local file
-
+{%snippet imagesource-load-local%}
diff --git a/tests/app/location.md b/tests/app/location.md
index 0704ad0c2..42af0294b 100644
--- a/tests/app/location.md
+++ b/tests/app/location.md
@@ -7,23 +7,23 @@ previous_url: /ApiReference/location/HOW-TO
---
# Location
Using the location requires the Location module.
-
+{%snippet location-require%}
## Other functions
### Test are location services available for this device
-
+{%snippet location-funcs%}
### Get distance between two locations
-
+{%snippet location-distance%}
## Getting location
### Receive continuous location updates
-
+{%snippet location-updates%}
### Get last known location
-
+{%snippet location-last-known%}
### Get location once
if there is `options.timeout` you will receive error on timeout. If `options.timeout` is 0 then the result is the same as the result from `LocationManager.lastKnownLocation`
and there will be no wait. You can use `options.maximumAge` to specify you don't want to receive locations older than specified time in ms.
-
+{%snippet location-timeour%}
diff --git a/tests/app/platform.md b/tests/app/platform.md
index 745bc336e..987c6ce31 100644
--- a/tests/app/platform.md
+++ b/tests/app/platform.md
@@ -8,7 +8,7 @@ previous_url: /ApiReference/platform/HOW-TO
# Platform
Information about the current device and screen are defined in the platform module
### Declaring platform module to be available for further usage.
-
+{%snippet platform-require%}
### Getting information about the current device:
-
+{%snippet platform-current%}
diff --git a/tests/app/text/formatted-string.md b/tests/app/text/formatted-string.md
index 6251125d5..3803db21e 100644
--- a/tests/app/text/formatted-string.md
+++ b/tests/app/text/formatted-string.md
@@ -7,7 +7,7 @@ previous_url: /ApiReference/text/formatted-string/HOW-TO
---
# Formatted String
Using a formatted string requires loading formatted-string and span module.
-
+{%snippet formatted-string-require%}
### How to set formatted text content for a label
-
+{%snippet formatted-string-set%}
diff --git a/tests/app/timer.md b/tests/app/timer.md
index 6c74ece55..ad34b3348 100644
--- a/tests/app/timer.md
+++ b/tests/app/timer.md
@@ -7,19 +7,19 @@ previous_url: /ApiReference/timer/HOW-TO
---
# Timer module
### How to require timer module
-
+{%snippet timer-require%}
### Evaluates an expression after 0 milliseconds.
-
+{%snippet timer-set-zero%}
### Evaluates an expression after a specified number of milliseconds.
-
+{%snippet timer-set-fivehundred%}
### Cancels the evaluation with the clearTimeout method.
-
+{%snippet timer-set-twothousands%}
### Evaluates an expression each time a specified number of milliseconds has elapsed.
-
+{%snippet timer-set-expression%}
### Cancel the interval previously started using the setInterval method.
-
+{%snippet timer-set-interval%}
diff --git a/tests/app/trace.md b/tests/app/trace.md
index b74a10b83..c16e44445 100644
--- a/tests/app/trace.md
+++ b/tests/app/trace.md
@@ -7,13 +7,13 @@ previous_url: /ApiReference/trace/HOW-TO
---
# Trace
Tracing information about your app requires the "trace" module.
-
+{%snippet trace-require%}
### Tracing all categories of events.
-
+{%snippet trace-all-categories%}
### Tracing specific categories of events.
-
+{%snippet trace-specific-categories%}
### Write your own trace message.
-
+{%snippet trace-message%}
diff --git a/tests/app/ui/action-bar/action-bar.md b/tests/app/ui/action-bar/action-bar.md
index c3bbb7819..4846f0eb1 100644
--- a/tests/app/ui/action-bar/action-bar.md
+++ b/tests/app/ui/action-bar/action-bar.md
@@ -7,7 +7,7 @@ previous_url: /ApiReference/ui/action-bar/HOW-TO
---
# ActionBar
Using a ActionBar requires the action-bar module.
-
+{%snippet actionbar-common-require%}
## Setting Title and Icon
diff --git a/tests/app/ui/activity-indicator/activity-indicator.md b/tests/app/ui/activity-indicator/activity-indicator.md
index eacaa5701..11660a321 100644
--- a/tests/app/ui/activity-indicator/activity-indicator.md
+++ b/tests/app/ui/activity-indicator/activity-indicator.md
@@ -7,7 +7,7 @@ previous_url: /ApiReference/ui/activity-indicator/HOW-TO
---
# ActivityIndicator
Using the activity indicator requires the ActivityIndicator module.
-
+{%snippet activity-indicator-require%}
### Binding the activity indicator busy property to a view-model property.
``` XML
@@ -16,7 +16,7 @@ Using the activity indicator requires the ActivityIndicator module.
```
### Creating an activity indicator
-
+{%snippet activity-indicator-create%}
### Showing activity indicator while image is loading
-
+{%snippet activity-indicator-loading%}
diff --git a/tests/app/ui/animation/animation.md b/tests/app/ui/animation/animation.md
index ffecca280..36866d21a 100644
--- a/tests/app/ui/animation/animation.md
+++ b/tests/app/ui/animation/animation.md
@@ -7,19 +7,19 @@ previous_url: /ApiReference/ui/animation/HOW-TO
---
# Animation
Animating view properties requires the "ui/animation" module.
-
+{%snippet animation-require%}
# Animating properties
-
+{%snippet animation-properties%}
# Cancelling animation
-
+{%snippet animation-cancel%}
# Chaining animations
-
+{%snippet animation-chaining%}
# Reusing animations
-
+{%snippet animation-reusing%}
# Animating multiple views simultaneously
-
+{%snippet animation-multiple-views%}
diff --git a/tests/app/ui/border/border.md b/tests/app/ui/border/border.md
index eba1de6bb..b8a3b0722 100644
--- a/tests/app/ui/border/border.md
+++ b/tests/app/ui/border/border.md
@@ -7,7 +7,7 @@ previous_url: /ApiReference/ui/border/HOW-TO
---
# Border
Using borders requires the Border module.
-
+{%snippet border-require%}
### Declaring a Border.
``` XML
diff --git a/tests/app/ui/button/button.md b/tests/app/ui/button/button.md
index ccc8223e6..b76c5d758 100644
--- a/tests/app/ui/button/button.md
+++ b/tests/app/ui/button/button.md
@@ -8,10 +8,10 @@ previous_url: /ApiReference/ui/button/HOW-TO
# Button
### Declaring button module
Button module is required to use any button feature.
-
+{%snippet button-require%}
Other frequently used modules when working with buttons include:
-
+{%snippet button-require-others%}
### Attaching event handler for the button tap event.
``` XML
@@ -20,13 +20,13 @@ Other frequently used modules when working with buttons include:
```
### Creating a button
-
+{%snippet button-create%}
### Setting the text of a button
-
+{%snippet button-settext%}
### Responding to the tap event
-
+{%snippet button-tap%}
### Binding text property directly to model
-
+{%snippet button-bind%}
diff --git a/tests/app/ui/date-picker/date-picker.md b/tests/app/ui/date-picker/date-picker.md
index 8ce1c66a4..06816ef2a 100644
--- a/tests/app/ui/date-picker/date-picker.md
+++ b/tests/app/ui/date-picker/date-picker.md
@@ -7,7 +7,7 @@ previous_url: /ApiReference/ui/date-picker/HOW-TO
---
# DatePicker
Using a DatePicker requires the "ui/date-picker" module.
-
+{%snippet date-picker-require%}
## Configuring a DatePicker
-
+{%snippet date-picker-configure%}
diff --git a/tests/app/ui/dialogs/dialogs.md b/tests/app/ui/dialogs/dialogs.md
index 53a779f8a..3b26e7321 100644
--- a/tests/app/ui/dialogs/dialogs.md
+++ b/tests/app/ui/dialogs/dialogs.md
@@ -7,19 +7,19 @@ previous_url: /ApiReference/ui/dialogs/HOW-TO
---
# Dialogs
Displaying dialogs requires the "ui/dialogs" module.
-
+{%snippet dialog-require%}
### Action
-
+{%snippet dialog-action%}
### Confirm
-
+{%snippet dialog-confirm%}
### Alert
-
+{%snippet dialog-alert%}
### Login
-
+{%snippet dialog-login%}
### Prompt
-
+{%snippet dialog-prompt%}
diff --git a/tests/app/ui/frame/frame.md b/tests/app/ui/frame/frame.md
index 215d28f00..b11a0f091 100644
--- a/tests/app/ui/frame/frame.md
+++ b/tests/app/ui/frame/frame.md
@@ -7,16 +7,16 @@ previous_url: /ApiReference/ui/frame/HOW-TO
---
# Frame
To perform navigation, you will need a reference to the topmost frame of the application.
-
+{%snippet frame-require%}
### Navigating to a Module
-
+{%snippet frame-navigating%}
### Navigating with a Factory Function
-
+{%snippet frame-factory-func%}
### Navigating with NavigationEntry
-
+{%snippet frame-naventry%}
### Navigating Back
-
+{%snippet frame-back%}
diff --git a/tests/app/ui/gestures/gestures.md b/tests/app/ui/gestures/gestures.md
index e4c89d850..f6dcbc929 100644
--- a/tests/app/ui/gestures/gestures.md
+++ b/tests/app/ui/gestures/gestures.md
@@ -7,58 +7,58 @@ previous_url: /ApiReference/ui/gestures/HOW-TO
---
# Gestures
Detecting user gestures requires the "ui/gestures" module.
-
+{%snippet gestures-require%}
### Double Tap
-
+{%snippet gestures-double-tap%}
### Double Tap
-
+{%snippet gestures-double-tap-alt%}
### Long Press
-
+{%snippet gestures-long-press%}
### Long Press
-
+{%snippet gestures-long-press-alt%}
### Pan
-
+{%snippet gestures-pan%}
### Pan
-
+{%snippet gestures-pan-alt%}
### Pinch
-
+{%snippet gestures-pan-pinch%}
### Pinch
-
+{%snippet gestures-pan-pinch-alt%}
### Rotation
-
+{%snippet gestures-rotation%}
### Rotation
-
+{%snippet gestures-rotation-alt%}
### Swipe
-
+{%snippet gestures-swipe%}
### Swipe
-
+{%snippet gestures-swipe-alt%}
### Tap
-
+{%snippet gestures-tap%}
### Tap
-
+{%snippet gestures-tap-alt%}
### Stop observing
-
+{%snippet gestures-stop-observe%}
### Multiple gestures
-
+{%snippet gestures-multiple%}
### Multiple gestures as comma separated string
-
+{%snippet gestures-string%}
### Events combined with gestures as comma separated string
-
+{%snippet gestures-events-string%}
diff --git a/tests/app/ui/html-view/htm-view.md b/tests/app/ui/html-view/htm-view.md
index 667bd349c..6542f9814 100644
--- a/tests/app/ui/html-view/htm-view.md
+++ b/tests/app/ui/html-view/htm-view.md
@@ -7,7 +7,7 @@ previous_url: /ApiReference/ui/html-view/HOW-TO
---
# HtmlView
Using a HtmlView requires the html-view module.
-
+{%snippet htmlview-require%}
### Declaring a HtmlView.
``` XML
@@ -16,7 +16,7 @@ Using a HtmlView requires the html-view module.
```
### Creating a HtmlView
-
+{%snippet htmlview-create%}
### Using HtmlView
-
+{%snippet htmlview-using%}
diff --git a/tests/app/ui/image-cache/image-cache.md b/tests/app/ui/image-cache/image-cache.md
index 94bcfea60..403b1f607 100644
--- a/tests/app/ui/image-cache/image-cache.md
+++ b/tests/app/ui/image-cache/image-cache.md
@@ -7,7 +7,7 @@ previous_url: /ApiReference/ui/image-cache/HOW-TO
---
# ImageCache
Using the ImageCache requires the "ui/image-cache" module.
-
+{%snippet image-cache-require%}
### Requesting Images
-
+{%snippet image-cache-request-images%}
diff --git a/tests/app/ui/image/image.md b/tests/app/ui/image/image.md
index c5bad66dd..e485edda5 100644
--- a/tests/app/ui/image/image.md
+++ b/tests/app/ui/image/image.md
@@ -7,7 +7,7 @@ previous_url: /ApiReference/ui/image/HOW-TO
---
# Image
Using an image requires the Image module to be loaded.
-
+{%snippet img-require%}
Binding the image source property to a view-model property.
``` XML
@@ -25,16 +25,16 @@ Binding the image source property to a view-model property.
```
### Creating an image and setting its source
-
+{%snippet img-create%}
### Creating an image and setting its src
-
+{%snippet img-create-src%}
### Creating an image and setting its src to a file within the application
-
+{%snippet img-create-local%}
### Creating an image and setting its src to Data URI
-
+{%snippet img-create-datauri%}
### Setting image stretching
-
+{%snippet img-set-stretch%}
diff --git a/tests/app/ui/label/label.md b/tests/app/ui/label/label.md
index 20affdd0f..740ca3c04 100644
--- a/tests/app/ui/label/label.md
+++ b/tests/app/ui/label/label.md
@@ -7,7 +7,7 @@ previous_url: /ApiReference/ui/label/HOW-TO
---
# Label
Using a label requires the Label module.
-
+{%snippet label-require%}
### Binding the Label text property to a view-model property.
``` XML
@@ -16,19 +16,19 @@ Using a label requires the Label module.
```
### Setting the label text content
-
+{%snippet label-settext%}
### Turning on text wrapping for a label
-
+{%snippet label-textwrap%}
### Styling a label via css class
-
+{%snippet label-cssclass%}
### Styling a label via css type
-
+{%snippet label-cssclass-type%}
### Styling a label via css control identifier
-
+{%snippet label-css-identifier%}
### Binding text property of a label to an observable model
-
+{%snippet label-observable%}
diff --git a/tests/app/ui/layouts/absolute-layout.md b/tests/app/ui/layouts/absolute-layout.md
index dbde2d0d3..5079e216a 100644
--- a/tests/app/ui/layouts/absolute-layout.md
+++ b/tests/app/ui/layouts/absolute-layout.md
@@ -7,7 +7,7 @@ previous_url: /ApiReference/ui/layouts/absolute-layout/HOW-TO
---
# AbsoluteLayout
Using an AbsoluteLayout requires the AbsoluteLayout module.
-
+{%snippet absolute-layout-require%}
### Declaring an AbsoluteLayout
``` XML
@@ -19,4 +19,4 @@ Using an AbsoluteLayout requires the AbsoluteLayout module.
```
## Creating and populating a AbsoluteLayout with children
-
+{%snippet absolute-layout-populating%}
diff --git a/tests/app/ui/layouts/dock-layout-tests.ts b/tests/app/ui/layouts/dock-layout-tests.ts
index a209b51d0..771030caa 100644
--- a/tests/app/ui/layouts/dock-layout-tests.ts
+++ b/tests/app/ui/layouts/dock-layout-tests.ts
@@ -6,9 +6,9 @@ import testModule = require("../../ui-test");
import layoutHelper = require("./layout-helper");
import commonTests = require("./common-layout-tests");
-// >>
+// >> dock-layout-require
import dockModule = require("ui/layouts/dock-layout");
-// <<
+// << dock-layout-require
// >> dock-layout-others
import enums = require("ui/enums");
diff --git a/tests/app/ui/layouts/dock-layout.md b/tests/app/ui/layouts/dock-layout.md
index b87a253d4..3acca07be 100644
--- a/tests/app/ui/layouts/dock-layout.md
+++ b/tests/app/ui/layouts/dock-layout.md
@@ -7,7 +7,7 @@ previous_url: /ApiReference/ui/layouts/dock-layout/HOW-TO
---
# DockLayout
Using a DockLayout requires the DockLayout module.
-
+{%snippet dock-layout-require%}
### Declaring a DockLayout
``` XML
@@ -23,16 +23,16 @@ Using a DockLayout requires the DockLayout module.
```
Other frequently used modules when working with a DockLayout include:
-
+{%snippet dock-layout-others%}
## Create DockLayout
-
+{%snippet dock-layout-create%}
## Add child view to layout
-
+{%snippet dock-layout-addchild%}
## Remove child view from layout
-
+{%snippet dock-layout-removechild%}
## Setting the dock roperty
-
+{%snippet dock-layout-setdocl%}
diff --git a/tests/app/ui/layouts/grid-layout.md b/tests/app/ui/layouts/grid-layout.md
index 512175bcb..3e6f3a07a 100644
--- a/tests/app/ui/layouts/grid-layout.md
+++ b/tests/app/ui/layouts/grid-layout.md
@@ -7,7 +7,7 @@ previous_url: /ApiReference/ui/layouts/grid-layout/HOW-TO
---
# GridLayout
Using a GridLayout requires the GridLayout module.
-
+{%snippet grid-layout-require%}
### Declaring a GridLayout
``` XML
@@ -21,19 +21,19 @@ Using a GridLayout requires the GridLayout module.
```
## Add views to grid layout
-
+{%snippet grid-layout-addviews%}
## Set column property on views - btn1 in first column, btn2 is second and btn3 in third
-
+{%snippet grid-layout-setcolumn%}
## Set row property on btn4.
-
+{%snippet grid-layout-setrow%}
## Set columnSpan property on btn4 to stretch into all columns
-
+{%snippet grid-layout-columnspan%}
## Create ItemSpec for columns and rows 3 columns - 80px, *, auto size and 2 rows - 100px and auto size
-
+{%snippet grid-layout-itemspec%}
## Add columns and rows to GridLayout
-
+{%snippet grid-layout-add-rowscols%}
diff --git a/tests/app/ui/layouts/stack-layout.md b/tests/app/ui/layouts/stack-layout.md
index fba922956..70ae8d596 100644
--- a/tests/app/ui/layouts/stack-layout.md
+++ b/tests/app/ui/layouts/stack-layout.md
@@ -7,7 +7,7 @@ previous_url: /ApiReference/ui/layouts/stack-layout/HOW-TO
---
# StackLayout
Using a StackLayout requires the StackLayout module.
-
+{%snippet stack-layout-require%}
### Declaring a StackLayout.
``` XML
@@ -19,14 +19,14 @@ Using a StackLayout requires the StackLayout module.
```
## Create StackLayout
-
+{%snippet stack-layout-new%}
## Add child view to layout
-
+{%snippet stack-layout-addchild%}
## Remove child view from layout
-
+{%snippet stack-layout-remove%}
## Change layout orientation to Horizontal
-
+{%snippet stack-layout-horizontal%}
diff --git a/tests/app/ui/layouts/wrap-layout.md b/tests/app/ui/layouts/wrap-layout.md
index a50955039..aeaac4a66 100644
--- a/tests/app/ui/layouts/wrap-layout.md
+++ b/tests/app/ui/layouts/wrap-layout.md
@@ -7,7 +7,7 @@ previous_url: /ApiReference/ui/layouts/wrap-layout/HOW-TO
---
# WrapLayout
Using a WrapLayout requires the WrapLayout module.
-
+{%snippet wrap-layout-require%}
### Declaring a WrapLayout.
``` XML
@@ -22,10 +22,10 @@ Using a WrapLayout requires the WrapLayout module.
```
Other frequently used modules when working with a WrapLayout include:
-
+{%snippet wrap-layout-others%}
## Creating a WrapLayout
-
+{%snippet wrap-layout-new%}
## Setting the orientation of a wrap-layout.
-
+{%snippet wrap-layout-orientation%}
diff --git a/tests/app/ui/list-picker/list-picker.md b/tests/app/ui/list-picker/list-picker.md
index cad678617..b95b04f9b 100644
--- a/tests/app/ui/list-picker/list-picker.md
+++ b/tests/app/ui/list-picker/list-picker.md
@@ -7,10 +7,10 @@ previous_url: /ApiReference/ui/list-picker/HOW-TO
---
# ListPicker
Using a ListPicker requires the "ui/list-picker" module.
-
+{%snippet article-require-listpicker-module%}
## Creating a ListPicker
-
+{%snippet article-create-listpicker%}
## Binding listPicker.items
-
+{%snippet article-binding-listpickeritems%}
## Selecting an item programmatically
-
+{%snippet article-selecting-item%}
diff --git a/tests/app/ui/list-view/list-view-tests.ts b/tests/app/ui/list-view/list-view-tests.ts
index a01b86fe5..caf84bef3 100644
--- a/tests/app/ui/list-view/list-view-tests.ts
+++ b/tests/app/ui/list-view/list-view-tests.ts
@@ -13,10 +13,10 @@ import { Page } from "ui/page";
import listViewModule = require("ui/list-view");
// << article-require-listview-module
-// >> article-require-modules
+// >> article-require-modules-listview
import observableArray = require("data/observable-array");
import labelModule = require("ui/label");
-// << article-require-modules
+// << article-require-modules-listview
// >> article-item-tap
function listViewItemTap(args) {
diff --git a/tests/app/ui/list-view/list-view.md b/tests/app/ui/list-view/list-view.md
index 0e3819e30..939a2289e 100644
--- a/tests/app/ui/list-view/list-view.md
+++ b/tests/app/ui/list-view/list-view.md
@@ -7,9 +7,9 @@ previous_url: /ApiReference/ui/list-view/HOW-TO
---
# ListView
Using a ListView requires the ListView module.
-
+{%snippet article-require-listview-module%}
Other modules which will be used in the code samples in this article:
-
+{%snippet article-require-modules-listview%}
### Binding the ListView items property to collection in the view-model.
``` XML
@@ -22,14 +22,14 @@ Other modules which will be used in the code samples in this article:
{%raw%}{%endraw%}
```
-
+{%snippet article-item-tap%}
### Attaching event handler for the ListView loadMoreItems event.
``` XML
{%raw%}{%endraw%}
```
-
+{%snippet article-load-items%}
### Define the ListView itemTemplate property.
``` XML
@@ -41,26 +41,26 @@ Other modules which will be used in the code samples in this article:
```
### Creating a ListView
-
+{%snippet article-create-listview%}
### Using ListView with Array
The itemLoading event is used to create the UI for each item that is shown in the ListView.
-
+{%snippet article-listview-array%}
> Note, that changing the array after the list view is shown will not update the UI.
You can force-update the UI using the refresh() method.
-
+{%snippet article-change-refresh-listview%}
### Using ListView with ObservableArray
-
+{%snippet article-listview-observablearray%}
> When using ObservableArray the list view will be automatically updated when items are added or removed form the array.
-
+{%snippet article-push-in-observablearray%}
## Responding to other events
### ItemTap event
The event will be raise when an item inside the ListView is tapped.
-
+{%snippet article-itemtap-event%}
### LoadMoreItems event
The event will be raised when the ListView is scrolled so that the last item is visible.
This even is intended to be used to add additional data in the ListView.
-
+{%snippet article-loadmoreitems-event%}
diff --git a/tests/app/ui/page/page.md b/tests/app/ui/page/page.md
index c92a97739..383d8c755 100644
--- a/tests/app/ui/page/page.md
+++ b/tests/app/ui/page/page.md
@@ -7,17 +7,17 @@ previous_url: /ApiReference/ui/page/HOW-TO
---
# Page
Using a page requires the Page module.
-
+{%snippet article-require-page/module%}
### Attaching event handler for the Page loaded event to set bindingContext.
``` XML
{%raw%}{%endraw%}
```
-
+{%snippet article-set-bindingcontext%}
### Creating and navigating to the created page.
-
+{%snippet artivle-create-navigate-to-page%}
### Navigating backward is as simple as calling a single method.
-
+{%snippet article-navigating-backward%}
### Pass data to the new page.
-
+{%snippet article-pass-data%}
diff --git a/tests/app/ui/placeholder/placeholder.md b/tests/app/ui/placeholder/placeholder.md
index 2915ba0a0..3439e6e7c 100644
--- a/tests/app/ui/placeholder/placeholder.md
+++ b/tests/app/ui/placeholder/placeholder.md
@@ -7,11 +7,11 @@ previous_url: /ApiReference/ui/placeholder/HOW-TO
---
# Placeholder
Using the placeholder requires the Placeholder module.
-
+{%snippet article-require-placeholder-module%}
Creating native view for the Placeholder using creatingView event.
``` XML
{%raw%}{%endraw%}
```
-
+{%snippet article-creating-view%}
diff --git a/tests/app/ui/progress/progress.md b/tests/app/ui/progress/progress.md
index 52ccdd206..ae4054d5b 100644
--- a/tests/app/ui/progress/progress.md
+++ b/tests/app/ui/progress/progress.md
@@ -7,7 +7,7 @@ previous_url: /ApiReference/ui/progress/HOW-TO
---
# Progress
Using the progress view requires the Progress module.
-
+{%snippet article-require-progress-module%}
Binding the Progress value property to a view-model property.
``` XML
@@ -22,6 +22,6 @@ function pageLoaded(args) {
exports.pageLoaded = pageLoaded;
```
### Creating a progress view
-
+{%snippet article-create-progress-view%}
### Setting up the progress view
-
+{%snippet article-set-value%}
diff --git a/tests/app/ui/repeater/repeater-tests.ts b/tests/app/ui/repeater/repeater-tests.ts
index ab970d905..da0b8d8ac 100644
--- a/tests/app/ui/repeater/repeater-tests.ts
+++ b/tests/app/ui/repeater/repeater-tests.ts
@@ -14,10 +14,10 @@ import { Label } from "ui/label";
import repeaterModule = require("ui/repeater");
// << article-require-repeater-module
-// >> article-require-modules
+// >> article-require-modules-repeater
import observableArray = require("data/observable-array");
import labelModule = require("ui/label");
-// << article-require-modules
+// << article-require-modules-repeater
var ASYNC = 0.2;
var FEW_ITEMS = [0, 1, 2];
diff --git a/tests/app/ui/repeater/repeater.md b/tests/app/ui/repeater/repeater.md
index d4b9af8d4..7458f740f 100644
--- a/tests/app/ui/repeater/repeater.md
+++ b/tests/app/ui/repeater/repeater.md
@@ -7,9 +7,9 @@ previous_url: /ApiReference/ui/repeater/HOW-TO
---
# Repeater
Using a Repeater requires the repeater module.
-
+{%snippet article-require-repeater-module%}
Other modules which will be used in the code samples in this article:
-
+{%snippet article-require-modules-repeater%}
### Binding the Repeater items property to collection in the view-model.
``` XML
@@ -52,13 +52,13 @@ Other modules which will be used in the code samples in this article:
```
### Using Repeater with Array
-
+{%snippet article-repeater-with-array%}
> Note, that changing the array after the repeater is shown will not update the UI.
You can force-update the UI using the refresh() method.
-
+{%snippet artcle-array-push-element%}
### Using Repeater with different layout.
-
+{%snippet article-repeater-layout%}
### Using Repeater with ObservableArray
-
+{%snippet article-repeater-observablearray%}
> When using ObservableArray the repeater will be automatically updated when items are added or removed form the array.
-
+{%snippet article-push-to-observablearray%}
diff --git a/tests/app/ui/scroll-view/scroll-view.md b/tests/app/ui/scroll-view/scroll-view.md
index 52fd03b2b..5d0fa6631 100644
--- a/tests/app/ui/scroll-view/scroll-view.md
+++ b/tests/app/ui/scroll-view/scroll-view.md
@@ -7,7 +7,7 @@ previous_url: /ApiReference/ui/scroll-view/HOW-TO
---
# ScrollView
Using a ScrollView requires the ScrollView module.
-
+{%snippet article-require-scrollview-module%}
### Declaring the ScrollView
``` XML
@@ -17,4 +17,4 @@ Using a ScrollView requires the ScrollView module.
```
### Creating a ScrollView
-
+{%snippet article-creating-scrollview%}
diff --git a/tests/app/ui/search-bar/search-bar.md b/tests/app/ui/search-bar/search-bar.md
index e0ba099dc..676b26db1 100644
--- a/tests/app/ui/search-bar/search-bar.md
+++ b/tests/app/ui/search-bar/search-bar.md
@@ -7,8 +7,8 @@ previous_url: /ApiReference/ui/search-bar/HOW-TO
---
# SearchBar
Using the SearchBar requires the "ui/search-bar" module.
-
+{%snippet article-require-searchbar-module%}
### Creating a SearchBar
-
+{%snippet article-creating-searchbar%}
### Searching
-
+{%snippet article-searching%}
diff --git a/tests/app/ui/segmented-bar/segmented-bar.md b/tests/app/ui/segmented-bar/segmented-bar.md
index 6b23d8c4a..64dd6c66a 100644
--- a/tests/app/ui/segmented-bar/segmented-bar.md
+++ b/tests/app/ui/segmented-bar/segmented-bar.md
@@ -7,9 +7,9 @@ previous_url: /ApiReference/ui/segmented-bar/HOW-TO
---
# SegmentedBar
Using a SegmentedBar requires the "ui/segmented-bar" module.
-
+{%snippet article-require-segmentedbar-module%}
## Creating a SegmentedBar
-
+{%snippet article-create-segmentedbar%}
``` XML
@@ -22,6 +22,6 @@ Using a SegmentedBar requires the "ui/segmented-bar" module.
### Creating segmentedBar.items
It is important that an items array gets created and filled with
items first and then assigned to the segmented bar.
-
+{%snippet article-creating-segmentedbar-items%}
### Selecting an item programmatically
-
+{%snippet artcile-selecting-item%}
diff --git a/tests/app/ui/slider/slider.md b/tests/app/ui/slider/slider.md
index d1c9fa198..95bcff207 100644
--- a/tests/app/ui/slider/slider.md
+++ b/tests/app/ui/slider/slider.md
@@ -7,7 +7,7 @@ previous_url: /ApiReference/ui/slider/HOW-TO
---
# Slider
Using a slider requires the Slider module.
-
+{%snippet article-require-slider%}
### Binding the Progress and Slider value properties to a observable view-model property.
``` XML
@@ -17,10 +17,10 @@ Using a slider requires the Slider module.
```
-
+{%snippet article-binding-slider-properties%}
### Creating a slider
-
+{%snippet article-creating-slider%}
### Setting the slider value and bounds
-
+{%snippet article-setting-slider-values%}
### Binding value property to a model
-
+{%snippet article-binding-value-property%}
diff --git a/tests/app/ui/styling/styling.md b/tests/app/ui/styling/styling.md
index bfddaf553..abc2a1527 100644
--- a/tests/app/ui/styling/styling.md
+++ b/tests/app/ui/styling/styling.md
@@ -7,14 +7,14 @@ previous_url: ApiReference/ui/styling/HOW-TO
---
# Styling
### Setting CSS to a page
-
+{%snippet article-setting-css-page%}
## Using CSS selectors
### Using type selector
-
+{%snippet article-using-type-selector%}
### Using class selector
-
+{%snippet article-using-class-selector%}
### Using id selector
-
+{%snippet article-using-id-selector%}
### Using state selector
-
+{%snippet article-using-state-selector%}
For information and example how to use style properties please refer to special [**Styling**](../../../styling.md) topic.
diff --git a/tests/app/ui/switch/switch.md b/tests/app/ui/switch/switch.md
index cb6b4eaad..34828f428 100644
--- a/tests/app/ui/switch/switch.md
+++ b/tests/app/ui/switch/switch.md
@@ -7,7 +7,7 @@ previous_url: /ApiReference/ui/switch/HOW-TO
---
# Switch
Using a switch requires the Switch module.
-
+{%snippet article-require-switch%}
### Binding the Switch checked property and Button isEnabled property to a observable view-model property.
``` XML
@@ -17,10 +17,10 @@ Using a switch requires the Switch module.
```
-
+{%snippet article-binding-switch-property%}
### Creating a switch
-
+{%snippet article-create-switch%}
### Setting the checked property of a switch
-
+{%snippet article-setting-checked-property%}
### Binding checked property to a model
-
+{%snippet aricle-binding-checked-property%}
diff --git a/tests/app/ui/tab-view/tab-view.md b/tests/app/ui/tab-view/tab-view.md
index 206432bbf..b073c50dd 100644
--- a/tests/app/ui/tab-view/tab-view.md
+++ b/tests/app/ui/tab-view/tab-view.md
@@ -26,10 +26,10 @@ previous_url: /ApiReference/ui/tab-view/HOW-TO
```
Using a TabView requires the "ui/tab-view" module.
-
+{%snippet article-require-tabview-module%}
### Binding TabView.items
-
+{%snippet article-binding-tabview-items%}
### Selecting a tab programmatically
-
+{%snippet article-select-tab%}
## Creating a TabView
-
+{%snippet article-create-tabview%}
diff --git a/tests/app/ui/text-field/text-field-tests.ts b/tests/app/ui/text-field/text-field-tests.ts
index 609128ba1..85080ba31 100644
--- a/tests/app/ui/text-field/text-field-tests.ts
+++ b/tests/app/ui/text-field/text-field-tests.ts
@@ -15,12 +15,12 @@ import textFieldModule = require("ui/text-field");
// Other frequently used modules when working with buttons include:
import bindable = require("ui/core/bindable");
-// >> require-observable
+// >> require-observable-textfield
import observable = require("data/observable");
-// << require-observable
+// << require-observable-textfield
// ### Binding two TextFields text property to observable view-model property.
-// >> binding-text-property
+// >> binding-text-property-textfield
function pageLoaded(args) {
var page = args.object;
var obj = new observable.Observable();
@@ -28,7 +28,7 @@ function pageLoaded(args) {
page.bindingContext = obj;
}
exports.pageLoaded = pageLoaded;
-// << binding-text-property
+// << binding-text-property-textfield
var _createTextFieldFunc = function (): textFieldModule.TextField {
// >> creating-textfield
@@ -252,7 +252,7 @@ export var testBindHintDirectlyToModel = function () {
helper.buildUIAndRunTest(_createTextFieldFunc(), function (views: Array) {
var textField = views[0];
- // >> binding-hint-property
+ // >> binding-hint-property-textfield
var model = new observable.Observable();
model.set("hint", "type your username here");
var options: bindable.BindingOptions = {
@@ -271,7 +271,7 @@ export var testBindHintDirectlyToModel = function () {
TKUnit.assert(textField.hint === "type your password here", "Actual: " + textField.text + "; Expected: " + "type your password here");
TKUnit.assert(textFieldTestsNative.getNativeHint(textField) === "type your password here", "Actual: " + textFieldTestsNative.getNativeHint(textField) + "; Expected: " + "type your password here");
// << (hide)
- // << binding-hint-property
+ // << binding-hint-property-textfield
});
}
@@ -534,4 +534,4 @@ export var test_WhenFormattedTextPropertyChanges_TextIsUpdated_TextBase = functi
view.formattedText = null;
TKUnit.assertEqual(view.text, "");
});
-}
\ No newline at end of file
+}
diff --git a/tests/app/ui/text-field/text-field.md b/tests/app/ui/text-field/text-field.md
index bdf753a21..68bee00de 100644
--- a/tests/app/ui/text-field/text-field.md
+++ b/tests/app/ui/text-field/text-field.md
@@ -7,8 +7,8 @@ previous_url: /ApiReference/ui/text-field/HOW-TO
---
# TextField
Using a TextField requires the text-field module.
-
-
+{%snippet require-textfield%}
+{%snippet require-observable-textfield%}
### Binding two TextFields text property to observable view-model property.
```XML
@@ -18,20 +18,20 @@ Using a TextField requires the text-field module.
```
-
+{%snippet binding-text-property-textfield%}
## Creating a TextField
-
+{%snippet creating-textfield%}
### Setting the text of a TextField
-
+{%snippet setting-text-property%}
### Setting the text of a TextField
-
+{%snippet setting-hint-property%}
### Binding text property directly to model
-
+{%snippet binding-text-property-second%}
### Setting the hint of a TextField
-
+{%snippet setting-hint-text%}
### Binding hint property directly to model
-
+{%snippet binding-hint-property-textfield%}
### Setting the secure property of a TextField
-
+{%snippet setting-secure-property%}
### Binding secure property directly to model
-
+{%snippet binding-secure-property%}
diff --git a/tests/app/ui/text-view/text-view-tests.ts b/tests/app/ui/text-view/text-view-tests.ts
index 178304bb9..f03186e0f 100644
--- a/tests/app/ui/text-view/text-view-tests.ts
+++ b/tests/app/ui/text-view/text-view-tests.ts
@@ -13,9 +13,9 @@ import textViewModule = require("ui/text-view");
// Other frequently used modules when working with buttons include:
import bindable = require("ui/core/bindable");
-// >> require-observable
+// >> require-observable-textview
import observable = require("data/observable");
-// << require-observable
+// << require-observable-textview
// >> text-view-xml
//
@@ -96,7 +96,7 @@ export var testBindTextDirectlyToModel = function () {
helper.buildUIAndRunTest(_createTextViewFunc(), function (views: Array) {
var textView = views[0];
- // >> binding-text-property
+ // >> binding-text-property-textview
var model = new observable.Observable();
model.set("username", "john");
var options: bindable.BindingOptions = {
@@ -115,7 +115,7 @@ export var testBindTextDirectlyToModel = function () {
TKUnit.assert(textView.text === "mary", "Actual: " + textView.text + "; Expected: " + "mary");
TKUnit.assert(textViewTestsNative.getNativeText(textView) === "mary", "Actual: " + textViewTestsNative.getNativeText(textView) + "; Expected: " + "mary");
// << (hide)
- // >> binding-text-property
+ // << binding-text-property-textview
});
}
@@ -176,7 +176,7 @@ export var testBindHintDirectlyToModel = function () {
var textView = views[0];
textView.text = "";
- // >> binding-hint-property
+ // >> binding-hint-property-textview
var model = new observable.Observable();
model.set("hint", "type your username here");
var options: bindable.BindingOptions = {
@@ -195,7 +195,7 @@ export var testBindHintDirectlyToModel = function () {
TKUnit.assert(textView.hint === "type your password here", "Actual: " + textView.hint + "; Expected: " + "type your password here");
TKUnit.assert(textViewTestsNative.getNativeHint(textView) === "type your password here", "Actual: " + textViewTestsNative.getNativeHint(textView) + "; Expected: " + "type your password here");
// << (hide)
- // << binding-hint-property
+ // << binding-hint-property-textview
});
}
@@ -493,4 +493,4 @@ export function test_watch_listerer_is_removed_at_onDetach() {
editText.setText("FAIL");
});
}
-}
\ No newline at end of file
+}
diff --git a/tests/app/ui/text-view/text-view.md b/tests/app/ui/text-view/text-view.md
index 02741a7f6..103b52af6 100644
--- a/tests/app/ui/text-view/text-view.md
+++ b/tests/app/ui/text-view/text-view.md
@@ -7,22 +7,22 @@ previous_url: /ApiReference/ui/text-view/HOW-TO
---
# TextView
Using a TextView requires the text-view module.
-
-
+{%snippet require-textmodules%}
+{%snippet require-observable-textview%}
### Binding two TextViews text property to observable view-model property.
-
-
+{%snippet text-view-xml%}
+{%snippet observable-declare%}
### Creating a TextView
-
+{%snippet text-view-create%}
### Setting the text of a TextView
-
+{%snippet set-text-value%}
### Binding text property directly to model
-
+{%snippet binding-text-property-textview%}
### Setting the hint of a TextView
-
+{%snippet set-textview-hint%}
### Binding hint property directly to model
-
+{%snippet binding-hint-property-textview%}
### Setting the editable property of a TextView
-
+{%snippet setting-editable-property%}
### Binding editable property directly to model
-
+{%snippet binding-editable-property%}
diff --git a/tests/app/ui/time-picker/time-picker.md b/tests/app/ui/time-picker/time-picker.md
index 8bd6aac88..1c818a7ce 100644
--- a/tests/app/ui/time-picker/time-picker.md
+++ b/tests/app/ui/time-picker/time-picker.md
@@ -7,6 +7,6 @@ previous_url: /ApiReference/ui/time-picker/HOW-TO
---
# TimePicker
Using a TimePicker requires the "ui/time-picker" module.
-
+{%snippet require-time-picker%}
## Configuring a TimePicker
-
+{%snippet declare-time-picker%}
diff --git a/tests/app/ui/web-view/web-view.md b/tests/app/ui/web-view/web-view.md
index d5aed9458..c73490e19 100644
--- a/tests/app/ui/web-view/web-view.md
+++ b/tests/app/ui/web-view/web-view.md
@@ -7,14 +7,14 @@ previous_url: /ApiReference/ui/web-view/HOW-TO
---
# WebView
Using a WebView requires the web-view module.
-
+{%snippet webview-require%}
### Declaring a WebView.
-
+{%snippet declare-webview-xml%}
### Creating a WebView
-
+{%snippet declare-webview%}
### Using WebView
-
+{%snippet webview-url%}
### Using WebView
-
+{%snippet webview-localfile%}
### Using WebView
-
+{%snippet webview-string%}
diff --git a/tests/app/xml-parser-tests/xml-parser.md b/tests/app/xml-parser-tests/xml-parser.md
index 985f63782..d5efb71b6 100644
--- a/tests/app/xml-parser-tests/xml-parser.md
+++ b/tests/app/xml-parser-tests/xml-parser.md
@@ -7,7 +7,7 @@ previous_url: /ApiReference/xml/HOW-TO
---
# Xml module
Using xml requires the Xml module.
-
+{%snippet xml-module-snippet%}
### Parse XML
-
+{%snippet xml-parser-snippet%}