Data source build out

docs/canvas/canvas-elements.asciidoc

@@ -1,58 +1,114 @@
 [role="xpack"]
 [[canvas-elements]]
-== Customize your workpad with elements
+== Bring your workpad to life with elements
 
-Elements are the core building blocks of your workpad. When you add elements to your workpad, you can use the elements that come with Canvas, or create your own.
+Elements are the core building blocks of your workpad.
 
 [float]
 [[add-canvas-element]]
-== Add a Canvas element to your workpad
+=== Add a Canvas element
 
 . Click *Add Element*, then select the best element to show off your data. 
 +
 image::images/canvas-element-select.gif[]
 
+. To move the element, click and drag it across your workpad.
+
+. To resize the element, select the sizing icons, then drag to the size you want.
+
 . Elements come preselected with default styles and demo data so that you can familiarize yourself with the element. Play around with the default settings and see what the element can do. 
 
 [float]
 [[connect-element-data]]
-=== Connect your own data
+=== Connect the element to your data
 
-When you are ready, connect the element to your own data using the panel on the right.
+To connect the element to your own data, use the panel on the right.
 
 . Make sure that the element is selected, then select *Data*.
 
 . Click *Change your data source*.
 
-. Click on the type of data source you want to use.
+. Choose one of the following data sources:
 
-. Specify the data source options, then click *Preview*.
+* *Elasticsearch SQL* — Uses Elasticsearch SQL to generate a data table.
+
+* *Elasticsearch raw documents* — Uses the Lucene query syntax to pull back raw documentation from Elasticsearch.
+
+* *Timelion* — Uses Timelion syntax to retrieve time series data.
+
+* *Demo data* — Uses mock data sets.
+
+. Specify your data source preferences, then click *Preview*.
 
 . If the element looks correct, click *Save*.
 
+. To specify the auto-refresh interval for the element, click the *Control settings* icon in the top left corner, then click the interval you want to use.
++
+To manually refresh the data, click the *Refresh data* icon. 
+
+[float]
+[[elasticsearch-sql-data-source]]
+==== Connect the element to Elasticsearch SQL
+
+. Make sure that the element is selected, then select *Data*.
+
+. Click *Change your data source*.
+
+
 [float]
 [[element-display-options]]
-
 === Choose the display options
 
+Choose how you want the element to appear on your workpad. For each element type, the display options are different.
+
 . Make sure that the element is selected, then select *Display*.
 
-. For each element type, the display options are different. To expand the options, click *+*.
+. Specify the display options you want to use.
 
-. For advanced display options, expand and use the *Element style* options.
+. To use the advanced display options, click *+* next to *Element style*, then choose one of these options:
 
-. To move the element, click and drag it across your workpad.
+* To make small changes to the appearance of the element, click *Container style*.
 
-. To resize the element, select the sizing icons, then drag to the size you want.
+* To apply a CSS stylesheet to the element, click *CSS*.
 
+. To change the order of the element, use the icons next to *Selected element*.
 
+//TIP: For more advanced customization options, create Canvas plugins.
 
 [float]
-[[create-custom-element]]
-== Create a custom element
+[[canvas-expression-editor]]
+=== Customize your element with the expression editor
+
+Further define the appearance and behavior of the element with the expression editor.
+
+. In the lower right corner, click *Expression editor*.
+
+. Edit the parts of the element expression that you want to change. 
+
+. Click *Run*.
+
+. If you like what you see, click *Close*.
+
+For information about the Canvas expression language, see <<canvas-function-reference,Canvas function reference>>.
+
+//Insert expression video.
 
 [float]
-== Add more pages to your workpad
+[[element-save]]
+=== Save the element
+
+After you have made changes to the element, save it so that you can use it in future workpads.
+
+. Next to *Selected element, click the *Save as new element* icon.
+
+. In the *Create new element* window, enter a *Name* for the element.
+
+. Enter an optional *Description*, then click *Save*.
++
+To access the element, click *Add element*, then select *My elements*.
+
+[float]
+== Add more pages
 
 Add more pages to your workpad, then select the page transition.
 

docs/canvas/canvas-workpad.asciidoc

@@ -6,28 +6,28 @@ When you create a workpad, you'll start with a blank page, or you can choose a w
 
 . Open *Canvas*.
 
-. Choose one of the following options:
+. On the *Canvas workpads* page, choose one of the following options:
 
 * To start with a single, blank workpad, click *Create workpad*.
 
-* To create a workpad from a template, select *Templates*, then select a preconfigured template.
+* To create a workpad from a template, select *Templates*, then click on a preconfigured template.
 
 * To import an existing workpad, click and drag a workpad JSON file to the *Import workpad JSON file* field.
 
-For advanced workpad examples, add a <<add-sample-data, sample Kibana data set>>, then select *Canvas* from the *View Data* dropdown list.
+* To use a sample data workpad, click *Try the sample data workpads*, add the data, then select *Canvas* from the *View Data* dropdown list.
 
-For more workpad inspiration, go to the link:https://www.elastic.co/blog/[Elastic Blog]. 
+For workpad inspiration, go to the link:https://www.elastic.co/blog/[Elastic Blog]. 
 
 [float]
-=== Personalize your workpad
+=== Customize your workpad
 
-To personalize your workpad, use the editor on the right.
+To make your workpad look the way you want, use the editor on the right.
 
-. Add a *Name* to your workpad, for example, `My Canvas Workpad`.
+. Add a *Name* to your workpad. For example, `My Canvas Workpad`.
 
-. In the *Width* and *Height* fields, specify the size of your workpad. 
+. In the *Width* and *Height* fields, specify the size. 
 
-. Select the layout for your workpad. 
+. Select the layout. 
 +
 For example, click *720p* for a traditional presentation layout.
 
@@ -35,7 +35,7 @@ For example, click *720p* for a traditional presentation layout.
 +
 image::images/canvas-background-color-picker.gif[]
 
-. If you already know that you want to apply styles to the entire workpad, use the *Global CCS overrides*.
+. Apply a set of styles to the entire workpad.
 
 .. Expand *Global CCS overrides*.
 
@@ -44,10 +44,10 @@ image::images/canvas-background-color-picker.gif[]
 [float]
 === Share your workpad
 
-When you are ready to share your workpad, create a PDF, or export your workpad to another author.
+When you are ready to share your workpad, create a PDF, or export your workpad.
 
 [float]
-==== Create a PDF of your workpad
+==== Create a PDF
 
 To view your workpad outside of Kibana, generate a PDF.