source: main/trunk/ibisph-view/src/main/webapp/xslt/html/VideoDialog.xslt @ 19868

Last change on this file since 19868 was 19798, checked in by GarthBraithwaite_STG, 3 years ago

view - topic content updated for structure. NM resource html content files added. newer kendo fonts. more Panellist to megamenu and popup css updates. Some rem vs em css updates. Processing of content through ibis.copy.

File size: 2.1 KB
Line 
1<?xml version="1.0" encoding="ISO-8859-1"?>
2
3<xsl:stylesheet version="3.0" 
4        xmlns:xsl ="http://www.w3.org/1999/XSL/Transform" 
5        xmlns:ibis="http://www.ibisph.org"
6
7        exclude-result-prefixes="ibis"
8>
9
10        <ibis:doc>
11                <name>html/VideoDialog</name>
12                <summary>
13                </summary>
14                <description>
15                </description>
16        </ibis:doc>
17
18
19        <xsl:template name="Page.videoDialog">
20                <dialog id="videoDialog" class="DialogContent">
21                        <div class="InnerCanvas"><div id="mediaPlayer"></div></div>
22                        <button type="button" title="Closes map selection without updating selections."
23                                onclick="closeVideo()" 
24                        >Close</button>
25                </dialog>
26
27                <script type="text/javascript">
28                        var webappContextPath = "<xsl:value-of select="$ibis.contextPath"/>";
29                        // <![CDATA[
30                        window.videoDialog = null;
31                        window.videoPlayer = null;
32                        $(document).ready(function()
33                        {
34                                window.videoDialog = $("#videoDialog").kendoWindow(
35                                        {
36                                                "title": "Learn More Video"
37                                                ,"visible": false
38                                                ,"width": "75%"
39                                                ,"resizable": true
40                                                ,"modal": true
41                                                ,close: function(e) { window.videoPlayer.stop(); }
42                                        }
43                                ).data("kendoWindow");
44                        });
45
46                        // https://demos.telerik.com/kendo-ui/mediaplayer/playlist
47                        // https://docs.telerik.com/kendo-ui/api/javascript/ui/mediaplayer?_ga=2.5892464.272183754.1572845261-1689576755.1572632213
48                        function showVideo(videoURL, videoTitle)
49                        {
50                                if(null == window.videoPlayer)
51                                {
52                                        window.videoPlayer = $("#mediaPlayer").kendoMediaPlayer(
53                                                {
54                                                        "autoPlay": false
55                                                        ,"navigatable": true
56                                                }
57                                        ).data("kendoMediaPlayer");
58                                }
59                                if(0 != videoURL.indexOf('http://')) videoURL = webappContextPath + videoURL;
60                                var mediaOptions =
61                                        {
62                                                "source": videoURL
63                                        };
64                window.videoPlayer.media(mediaOptions);
65
66                                window.videoDialog.title(videoTitle);
67                                window.videoDialog.center().open();
68
69                                window.videoPlayer.play();
70                        }
71
72                        function closeVideo()
73                        {
74                                window.videoDialog.close();
75                        }
76                        // <![CDATA[
77                        // ]]>
78                </script>
79
80        </xsl:template>
81
82</xsl:stylesheet>
83<!-- ============================= End of File ============================= -->
84
Note: See TracBrowser for help on using the repository browser.