PWA: Template Manifest File

From Lianjapedia
Revision as of 07:54, 28 September 2020 by Yvonne.milne (Talk | contribs)

(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)
Jump to: navigation, search

Template Manifest File

{
	/* 
		member:			"name"
		mandatory:		yes
		description:	can be used by app stores or browsers on startup screens and prompts 
	*/
	"name": "Lianja Example App",
	/* 
		member:			"short_name"
		mandatory:		yes
		description:	used to display the name to the user within the icon. For example: in the homescreen 
	*/
	"short_name": "Lianja Example",
	/* 
		member:			"description"
		mandatory:		yes
		description:	provides additional context about the app 
	*/
	"description": "This is an example PWA Lianja App",
	/*
		member:			"short-name"
		mandatory:		yes
		description:	Direction of the text. 		
		values: 		ltr(left to right), rtl (right to left), auto	
	*/
	"dir": "ltr",
	/*
		member:			"icons"
		mandatory:		yes
		description:	Language of the text. 
	*/
	"lang": "en",
	/*
		member:			"icons"
		mandatory:		yes
		description:	Array of icons that the browser can choose from, including size and type.		
		values:

		Member	Description
		sizes	A string containing space-separated image dimensions.
		src		The path to the image file. If src is a relative URL, the base URL will be the URL of the manifest.
		type	A hint as to the media type of the image. The purpose of this member is to allow a user agent to quickly ignore images with media types it does not support.
		purpose	Defines the purpose of the image, for example if the image is intended to 
				serve some special purpose in the context of the host OS (i.e., for better integration).

		purpose can have one or more of the following values, separated by spaces:

		monochrome: A user agent can present this icon where a monochrome icon with a solid fill is needed. 
					The color information in the icon is discarded and only the alpha data is used. 
					The icon can then be used by the user agent like a mask over any solid fill.
		maskable: 	The image is designed with icon masks and safe zone in mind, 
					such that any part of the image outside the safe zone can safely be ignored 
					and masked away by the user agent.
		any: 		The user agent is free to display the icon in any context (this is the default value).
		
		e.g.
		[
			{
				"src": "icon/lowres.png",
				"sizes": "48x48",
				"type": "image/png"
			},
			{
				"src": "icon/lowres",
				"sizes": "48x48"
			},
			{
				"src": "icon/hd_hi.ico",
				"sizes": "72x72 96x96 128x128 256x256"
			},
			{
				"src": "icon/hd_hi.svg",
				"sizes": "72x72"
			}
		]
	*/
	"icons": [ 
			  {
				"src": "http:/localhost:8001/apps/{appname}/icon.png", 
			    "sizes": "48x48",
			    "type": "image/png"
			  },
			  {
				"src": "http:/localhost:8001/apps/{appname}/icon.png", 
			    "sizes": "48x48"
			  },
			  {
				"src": "http:/localhost:8001/apps/{appname}/icon.png", 
			    "sizes": "72x72 96x96 128x128 256x256"
			  },
			  {
				"src": "http:/localhost:8001/apps/{appname}/icon.png", 
			    "sizes": "72x72"
			  }
	
		],
 	/*
		member:			"display"
		mandatory:		yes
		description:	Preferred display mode for the App.		
        Values: 		fullscreen, standalone, minimal-ui, browser.	
	*/
	"display": "standalone",
	/*
		it represents the set of urls that can be viewed through the installable web context, 
		if the user navigates outside this scope, those pages will be opened in a standard browser.
             Example:"https://example.com/", "/app/"	
	*/
    "scope": "http:/localhost:8001/apps/{appname}/",
	/*
		member:			"start_url"
		mandatory:		no
		description:	The start_url member is a string that represents the start URL of the web application 
						i.e. the preferred URL that should be loaded when the user launches the web application 
						(e.g., when the user taps on the web application's icon from a device's 
						application menu or homescreen).	
	*/
    "start_url": "http:/localhost:8001/apps/{appname}/index.html",
	/*
		member:			"orientation"
		mandatory:		no
		description:	you can enforce the orientation of your app, it can be ommited.
        Values: 		any, natural (default), landscape, landscape-primary, 
						landscape-secondary, portrait, portrait-primary, portrait-secondary
	*/
    "orientation": "natural",
	/*
		member:			"background_color"
		mandatory:		no
		description:	tells the browser what color to use on the startup splash screen 
						that users will see when they launch your app.
	*/
    "background_color": "#363636",
	/*
		member:			"background_color"
		mandatory:		no
		Description:	is used by some browsers to tint the status bar, address bar, 
						and other parts of the browser user interface.	
	*/
    "theme_color": "#363636",
	/*
		member:			"categories"
		mandatory:		no
		description:	This is intended to be used by app stores to categorize your app.
 	*/
    "categories": ["business", "technology", "web"],
 	/*
		member:			"screenshots"
		mandatory:		no
		description:	The screenshots member defines an array of screenshots intended to 
						showcase the application. These images are intended to be used by 
						progressive web app stores.
	*/
	"screenshots":  [
						{
						"src": "screenshot1.webp",
						"sizes": "1280x720",
						"type": "image/webp"
						},
						{
						"src": "screenshot2.webp",
						"sizes": "1280x720",
						"type": "image/webp"
						}
					]
}