Newer Version Available

This content describes an older version of this product. View Latest

Step 4: Create a Visualforce Page

Create a Visualforce page to display the channel notifications.
  1. From Setup, enter Visualforce Pages in the Quick Find box, then select Visualforce Pages.
  2. Click New.
  3. In the Label field, enter the name of the page StreamingAPIDemo.
  4. Replace the code in the page with the code from the StreamingApiDemo file that you downloaded.
    1<apex:page >
    2<apex:includeScript value="{!$Resource.json2_js}"/>
    3<apex:includeScript value="{!URLFOR($Resource.cometd, 'dojo/dojo.js')}"/>
    4<apex:includeScript value="{!$Resource.demo_js}"/>
    5<apex:stylesheet value="{!$Resource.demo_css}"/>
    6    <script>var token = '{!$Api.Session_ID}';</script>
    7        <div id="demo">
    8            <div id="datastream"></div>
    9            <div id="input">
    10                <div id="join">
    11                    <table>
    12                        <tbody>
    13                            <tr>
    14                                <td>&nbsp;</td>
    15                                <td> Enter Topic Name </td>
    16                                <td>
    17                                    <input id="topic" type="text" />
    18                                </td>
    19                                <td>
    20                                    <button id="subscribeButton" 
    21                                        class="button">Subscribe</button>
    22                                </td>
    23                            </tr>
    24                        </tbody>
    25                    </table>
    26                </div>
    27                <div id="joined">
    28                    <table>
    29                        <tbody>
    30                            <tr>
    31                                <td>
    32                                    <button id="leaveButton" 
    33                                        class="button">Unsubscribe</button>
    34                                </td>
    35                            </tr>
    36                        </tbody>
    37                    </table>
    38                </div>
    39            </div>
    40        </div>
    41</apex:page>
  5. Click Save to save the page.