DOCSP-16310 Creating time series collection using VS code playgrounds (#47)

* DOCSP-16310 & DOCSP-16375 time-series collections in vscode playgrounds

* DOCSP-16310 & DOCSP-16375 time-series collections in vscode playgrounds

* DOCSP-16310 & DOCSP-16375 time-series collections in vscode playgrounds

* DOCSP-16310 & DOCSP-16375 time-series collections in vscode playgrounds

* DOCSP-16310 added example

* DOCSP-16310 changing steps to create time series

* DOCSP-16310 fixed final code block explanation

* DOCSP-16310 removed settings.json file to be added to gitignore

* DOCSP-16310 removed .DS_Stor file to be added to gitignore

* DOCSP-16310 removed .DS_Stor file to be added to gitignore

Co-authored-by: Jocelyn Mendez <[email protected]>

Author: jocelyn-mendez1

source/images/vsce-time-series-icon.png

@@ -212,3 +212,4 @@ Consideration for Authentication
    /run-agg-pipelines
    /export-to-language
    /require-modules
+   /time-series-collections

source/playgrounds.txt

@@ -0,0 +1,117 @@
+.. _vsce-time-series:
+
+==============================
+Create Time Series Collections
+==============================
+.. default-domain:: mongodb
+
+.. contents:: On this page
+   :local:
+   :backlinks: none
+   :depth: 1
+   :class: singlecol
+
+.. include:: /includes/fact-vsce-preview.rst
+
+You can create 
+:manual:`time series collections </core/timeseries-collections/>` using 
+a MongoDB Playground. 
+
+Prerequisites
+-------------
+
+If you have not done so already, you must complete the following 
+prerequisites before you can create a time series collection with a 
+MongoDB Playground:
+
+- :ref:`Create a connection to a MongoDB deployment 
+  <vsce-connect-task>`.
+- :ref:`Activate the connection to the MongoDB deployment 
+  <vsce-activate-connection>`.
+
+Create a Time Series Collection
+-------------------------------
+
+Once you connect to your deployment using MongoDB for VS code, use the left 
+navigation to: 
+
+1. Expand an active connection and hover over the database where you want 
+   your collection to exist.
+
+#. Click the :icon-fa5:`plus` icon that appears. 
+
+#. A MongoDB playground automatically opens with a template form to create 
+   both regular collections and time series collections.
+
+#. Delete the regular collection form and uncomment the time series form.
+
+#. Fill in the provided fields with details for your time series collection.
+
+#. To run the playground, click the :guilabel:`Play Button` at the top right
+   of the VS code navigation bar.
+
+After running the playground with the time series collection, the left 
+navigation will update the collection icon to identify it is a 
+time series collection.
+   
+.. figure:: /images/vsce-time-series-icon.png
+   :figwidth: 200px
+   :alt: Image showing time series icon in VS Code extension
+
+.. seealso::
+
+   - To learn more about time series collections, see 
+     :manual:`Time Series Collections </core/timeseries-collections/>` 
+
+   - To add documents to the collection, see 
+     :ref:`vsce-create-doc-playground`.  
+
+Example
+-------
+
+This example creates a time series collection named ``weather`` in the ``test`` 
+database.
+
+To use this example, start with a collection template from your MongoDB 
+Playgrounds. Delete the template form for regular collections and keep the 
+template for time series collections found below the regular collection 
+template. 
+
+.. code-block:: javascript
+
+   use('test');
+
+   db.createCollection(
+    "weather",
+    {
+       timeseries: {
+          timeField: "timestamp",
+          granularity: "hours"
+       }
+    }
+  )
+
+In the example:
+
+- ``use('test')`` selects the database where the collection is added to.
+
+- ``timeseries`` specifies fields to create a time series collection.
+
+  - ``timeField: "timestamp"`` names the field that contains the dates in 
+    the time series documents. In this case, it is ``timestamp``.
+
+  - ``granularity: "hours"`` defines the time scale by which the documents
+    are stored. 
+
+When you press the :guilabel:`Play Button`, MongoDB for VS Code splits your 
+Playground and outputs the following result in the Playground Results.json 
+pane to confirm the creation of the time series collection. 
+
+.. code-block:: javascript
+
+   {
+      "ok": 1
+   }
+
+The ``weather`` collection also appears in your collection list, and is 
+marked with the time series icon.