Difference between revisions of "Image Plugin"

From MSX - Wiki
Jump to navigation Jump to search
Line 8: Line 8:
 
If you would like to use the plugin as reference to implement your own plugin, please have a look at this implementation script: http://msx.benzac.de/plugins/js/image.js.
 
If you would like to use the plugin as reference to implement your own plugin, please have a look at this implementation script: http://msx.benzac.de/plugins/js/image.js.
  
== Plugin Example ==
+
== Syntax ==
 +
{| class="wikitable sortable"
 +
|+ Parameter syntax of image plugin
 +
|-
 +
! Parameter !! Type !! Default Value !! Mandatory !! class="unsortable" | Description
 +
|-
 +
 
 +
|}
 +
 
 +
== Example ==
 +
=== Screenshot ===
 +
[[File:plugins.png|thumb|640px|none|Example Screenshot (Image Plugin)]]
 +
 
 +
=== Code ===
 +
<syntaxhighlight lang="json">
 +
{
 +
    "type": "pages",
 +
    "headline": "Image Plugin Test",
 +
    "template": {     
 +
        "type": "separate",
 +
        "layout": "0,0,2,4",
 +
        "icon": "msx-white-soft:extension",
 +
        "color": "msx-glass",
 +
        "properties": {
 +
            "control:load": "silent"
 +
        }
 +
    },
 +
    "items": [{
 +
            "title": "Video 1",
 +
            "playerLabel": "Video 1",
 +
            "action": "video:http://msx.benzac.de/media/video1.mp4"
 +
        }, {
 +
            "background": "http://msx.benzac.de/img/bg1.jpg",
 +
            "title": "Audio 1",
 +
            "playerLabel": "Audio 1",
 +
            "action": "audio:http://msx.benzac.de/media/audio1.mp3"
 +
        }, {           
 +
            "title": "Image 1",
 +
            "playerLabel": "Image 1",
 +
            "action": "video:plugin:http://msx.benzac.de/plugins/image.html?url=http://msx.benzac.de/img/bg3.jpg"
 +
        }, {
 +
            "title": "Video 2",
 +
            "playerLabel": "Video 2",
 +
            "action": "video:http://msx.benzac.de/media/video2.mp4"
 +
        }, {
 +
            "background": "http://msx.benzac.de/img/bg2.jpg",
 +
            "title": "Audio 2",
 +
            "playerLabel": "Audio 2",
 +
            "action": "audio:http://msx.benzac.de/media/audio2.mp3"
 +
        }, {
 +
            "title": "Image 2",
 +
            "playerLabel": "Image 2",
 +
            "action": "video:plugin:http://msx.benzac.de/plugins/image.html?url=http://msx.benzac.de/img/test.jpg"
 +
        }]
 +
}
 +
</syntaxhighlight>
 +
 
 +
=== Demo ===
 +
* Launch via App: https://msx.benzac.de/?start=content:https://msx.benzac.de/info/data/plugin_test_3.json
 +
* Launch via Demo Page: https://msx.benzac.de/info/?start=content:https://msx.benzac.de/info/data/plugin_test_3.json

Revision as of 13:48, 15 January 2021

This is a special video plugin that displays an image for a specific time. It can be used to create a mixed playlist of videos, audios, and images. The plugin can be used with version 0.1.74 or or higher.

Plugin Usage[edit]

The plugin must be loaded with an image URL. Optionally, the display duration, the filler type, and the background color of the image can be indicated. Please see following action syntax example.

If you would like to use the plugin as reference to implement your own plugin, please have a look at this implementation script: http://msx.benzac.de/plugins/js/image.js.

Syntax[edit]

Parameter syntax of image plugin
Parameter Type Default Value Mandatory Description

Example[edit]

Screenshot[edit]

Example Screenshot (Image Plugin)

Code[edit]

{
    "type": "pages",
    "headline": "Image Plugin Test",
    "template": {       
        "type": "separate",
        "layout": "0,0,2,4",
        "icon": "msx-white-soft:extension",
        "color": "msx-glass",
        "properties": {
            "control:load": "silent"		
        }
    },
    "items": [{
            "title": "Video 1",
            "playerLabel": "Video 1",
            "action": "video:http://msx.benzac.de/media/video1.mp4"
        }, {
            "background": "http://msx.benzac.de/img/bg1.jpg",
            "title": "Audio 1",
            "playerLabel": "Audio 1",
            "action": "audio:http://msx.benzac.de/media/audio1.mp3"
        }, {            
            "title": "Image 1",
            "playerLabel": "Image 1",
            "action": "video:plugin:http://msx.benzac.de/plugins/image.html?url=http://msx.benzac.de/img/bg3.jpg"
        }, {
            "title": "Video 2",
            "playerLabel": "Video 2",
            "action": "video:http://msx.benzac.de/media/video2.mp4"
        }, {
            "background": "http://msx.benzac.de/img/bg2.jpg",
            "title": "Audio 2",
            "playerLabel": "Audio 2",
            "action": "audio:http://msx.benzac.de/media/audio2.mp3"
        }, {
            "title": "Image 2",
            "playerLabel": "Image 2",
            "action": "video:plugin:http://msx.benzac.de/plugins/image.html?url=http://msx.benzac.de/img/test.jpg"
        }]
}

Demo[edit]