官术网_书友最值得收藏!


Embedding multimedia objects in your application>

Flash or Shockwave plug-ins or YouTube videos can add that sparkling touch to web pages. It is nice to know that it is possible to include these multimedia objects into APEX web pages. Actually, it is quite simple to implement. To demonstrate this, we will create a web page where a user can select a movie from a listbox and see the requested video.

Getting ready

Make sure you have access to the APP_VIDEO table and that the table contains some records to test.

How to do it...

  1. In the Application Builder, click on the Create Page button.
  2. Select Blank Page.
  3. Enter a page alias, for example, Videos and click on Next.
  4. Enter a name for the page, for example, Videos. In the Optional HTML Regions section, enter a name in the first text field, for example select video. Click on Next.
  5. Select No Tabs and click on Next.
  6. Click on Finish to confirm the settings.

The page has now been created together with an HTML region. Now we will create a listbox and a PL/SQL dynamic region:

  1. Click on the Edit icon.
  2. In the Items section, click on the Add icon.
  3. Select Select List.
  4. Enter a name for the select list, for example, PXX_VIDEO (XX is the page ID). Click on Next.
  5. Click again on Next (leave the options as they are).
  6. In the Page Action when Value Changed listbox, select Submit Page. Click on Next.
  7. Click on the Create dynamic list of values link. A pop-up window appears.
  8. Select the table/view owner and click on Next.
  9. In the Table or View text field, select APP_VIDEO. You can use the button next to the field to select a table or view. Click on Next.
  10. In the Display Column listbox, select Name. In the Return Value listbox, select url. Click on Next.
  11. Click on the Finish button.
  12. Click on Next.
  13. As a last step, click on the Create Item button.

Now we will create the PL/SQL dynamic region:

  1. In the Regions section, click on the Add icon.
  2. Select PL/SQL dynamic action.
  3. Enter a title for the region, for example, showvid.
  4. In the Region Template listbox, select No template.
  5. In the Parent Region listbox, select showvid (that is the region you just created). Click on Next.
  6. In the PL/SQL Source textarea, enter the following code:
    Sys.htp.p('<object width="640" height="385">');
    Sys.htp.p('<param name="movie" value="'||:PXX_VIDEO||'&hl=nl_NL&autoplay=1&fs=1&">');
    Sys.htp.p('</param>');
    Sys.htp.p('<param name="allowFullScreen" value="true">');
    Sys.htp.p('</param>');
    Sys.htp.p('<param name="allowscriptaccess" value="always">');
    Sys.htp.p('</param><embed src="'||:PXX_VIDEO||'&hl=nl_NL&autoplay=1&fs=1&" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="640" height="385">');
    Sys.htp.p('</embed>');
    Sys.htp.p('</object>');
    [9672_03_14.txt]

    The PL/SQL code makes use of the htp.p function to output HTML and JavaScript to the screen. The result is the same code you should get when you want to embed a YouTube video:

    And the code looks like the following:

    <object width="640" height="385">
    <param name="movie" value="http://www.youtube.com/v/vwx814B9ed8&hl=nl_NL&fs=1&">
    </param>
    <param name="allowFullScreen" value="true">
    </param>
    <param name="allowscriptaccess" value="always">
    </param>
    <embed src="http://www.youtube.com/v/vwx814B9ed8&hl=nl_NL&fs=1&" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="640" height="385">
    </embed>
    </object>
    [9672_03_15.txt]

    First, the object tag tells APEX that a multimedia object such as an image or a movie will be included in the web page. The size of the object can be set with the width and height parameters. The next step in the code is the declaration of parameters. The allowscriptaccess parameter is necessary to enable the playing of a video on a different website than youtube.com. The embed tag is the actual inclusion of the multimedia object and src is the source of the object. In this case, the source is a URL to a movie at youtube.com. All this code will be showed as HTML using the htp.p function. To be able to use this code to show more videos, the listbox will be concatenated to the code.

  7. Well, the code has been entered, so click on the Create Region button.

The page is now ready. Run the page and see the result:

How it works...

This web page makes use of the embedded code which you can get from the YouTube website. We could have put this code into an HTML region; that works too. But in that case the URL of the YouTube video is hardcoded and cannot be changed by the user. With the use of the htp.p function you can make the code dynamic by concatenating the URL.

In the recipe, you could also see that the PL/SQL dynamic region has a parent HTML region. This is done to make it look as if all the objects are put together into one region, which looks better.

You can pass some more parameters to the player such as autoplay, genie menu (showing related videos after playing the video), enabling the fullscreen mode, or starting in High Definition (HD) whenever available.

There's more...

In this recipe we showed you how to embed a YouTube movie in your web page. It is also possible to embed other plug-ins such as a Flash plug-in, a Twitter widget, or a Weather widget. Websites like Twitter offer you the HTML code which you have to include in your web page, and similar to this recipe, you can use the htp.p function to send this HTML code to the screen.

You can also make a Region plug-in and give it some attributes such as movie, object width, and object height.

See also

主站蜘蛛池模板: 龙陵县| 珠海市| 淳化县| 平定县| 香港| 平利县| 高雄县| 巴塘县| 曲阳县| 丽江市| 新河县| 永仁县| 高台县| 申扎县| 金沙县| 施甸县| 崇明县| 天等县| 霍山县| 固镇县| 凯里市| 眉山市| 东源县| 沾化县| 子长县| 五原县| 会理县| 聊城市| 永善县| 嘉鱼县| 苍山县| 广德县| 屏山县| 平乐县| 久治县| 明光市| 保定市| 渭源县| 山西省| 舒城县| 舒兰市|