AppSuite:Creating a settings section in AppSuite settings - Revision history

Khgras at 10:00, 22 May 2017

2017-05-22T10:00:55Z

← Older revision		Revision as of 10:00, 22 May 2017
Line 104:		Line 104:

	== Stuck somewhere? ==		== Stuck somewhere? ==
	You got stuck with a problem while developing? OXpedia might help you out with the article about [~~[AppSuite~~:~~Debugging_the_UI \|~~ debugging the UI]].		You got stuck with a problem while developing? OXpedia might help you out with the article about [https://documentation.open-xchange.com/latest/ui/miscellaneous/debugging.html debugging the UI].

Khgras at 09:32, 22 May 2017

2017-05-22T09:32:12Z

← Older revision		Revision as of 09:32, 22 May 2017
Line 11:		Line 11:
	== File Structure ==		== File Structure ==
	=== Manifest ===		=== Manifest ===
	Creating a [~~[AppSuite~~:~~UI_manifests_explained \|~~ manifest]] is quite easy, writing the following into <code>com.example/helloWorld/settings/manifest.json</code> to load your settings, once AppSuite loads it's settings		Creating a [https://documentation.open-xchange.com/latest/ui/customize/manifests.html manifest] is quite easy, writing the following into <code>com.example/helloWorld/settings/manifest.json</code> to load your settings, once AppSuite loads it's settings

	<pre class="language-javascript">		<pre class="language-javascript">

Viktor.Pracht: /* Register */

2014-01-23T16:56:33Z

← Older revision		Revision as of 16:56, 23 January 2014
Line 80:		Line 80:
	ext.point("io.ox/settings/pane").extend({		ext.point("io.ox/settings/pane").extend({
	id: 'com.example/helloWorld',		id: 'com.example/helloWorld',
	title: 'Hello World Settings,		title: 'Hello World Settings',
	ref: 'com.example/helloWorld',		ref: 'com.example/helloWorld',
	loadSettingPane: false,		loadSettingPane: false,

Viktor.Pracht: /* Defaults */

2014-01-22T17:48:08Z

Defaults

← Older revision		Revision as of 17:48, 22 January 2014
Line 20:		Line 20:

	=== Defaults ===		=== Defaults ===
	<code>com.example/helloWorld/settings/~~default~~.js</code> should contain your default settings, so an example setting the variable <code>exampleBoolean</code> to <code>false</code> and <code>exampleInteger</code> to 15 might be		<code>com.example/helloWorld/settings/defaults.js</code> should contain your default settings, so an example setting the variable <code>exampleBoolean</code> to <code>false</code> and <code>exampleInteger</code> to 15 might be
	<pre class="language-javascript">		<pre class="language-javascript">
	define('com.example/helloWorld/settings/defaults', [], function () {		define('com.example/helloWorld/settings/defaults', [], function () {

Mark.schmidts at 11:26, 24 October 2013

2013-10-24T11:26:56Z

← Older revision		Revision as of 11:26, 24 October 2013
Line 102:		Line 102:
	});		});
	</pre>		</pre>

			== Stuck somewhere? ==
			You got stuck with a problem while developing? OXpedia might help you out with the article about [[AppSuite:Debugging_the_UI \| debugging the UI]].

Mark.schmidts: /* File Structure */

2013-10-24T11:26:12Z

File Structure

@@ Line 17: / Line 17: @@
      namespace: ['io.ox/settings/main']
+}
 </pre>

Mark.schmidts: /* Register */

2013-10-24T11:16:29Z

← Older revision		Revision as of 11:16, 24 October 2013
Line 53:		Line 53:
	var content=$('div').addClass('content');		var content=$('div').addClass('content');
	content.text('Add form elements to control your settings here');		content.text('Add form elements to control your settings here');
	this.append(content);		this.append(content);
	}		}
	});		});
	});		});
	</pre>		</pre>

Mark.schmidts: Created page with "
Creating a settings section in AppSuite settings
This article explains how to add an settings section into AppSuite settings. You can also AppSuite..."

2013-10-24T11:13:51Z

Created page with "<div class="title">Creating a settings section in AppSuite settings</div> This article explains how to add an settings section into AppSuite settings. You can also AppSuite..."

New page

<div class="title">Creating a settings section in AppSuite settings</div>

This article explains how to add an settings section into AppSuite settings. You can also [[AppSuite:Embedding_your_settings_into_AppSuite_settings | implement your own settings using iframes]].

__TOC__

== Folder structure ==
Assuming you got an app or plugin in a folder like <code>com.example/helloWorld</code> for which you want to implement settings in AppSuite, you will need a new subfolder called <code>settings</code>. So <code>com.example/helloWorld/settings</code> will prospectively contain the files managing your settings.

== File Structure ==
=== Manifest ===
Creating a [[AppSuite:UI_manifests_explained | manifest]] is quite easy, writing the following into <code>com.example/helloWorld/settings/manifest.json</code> to load your settings, once AppSuite loads it's settings

<pre class="language-javascript">
{
namespace: ['io.ox/settings/main']
}
</pre>

=== Register ===
Create a file called <code>com.example/helloWorld/settings/register.js</code> to extend the AppSuite settings and implement your own.

The Head should look like this:
<pre class="language-javascript">
define("com.example/helloWorld/settings/register",
['io.ox/core/extensions',
'settings!com.example/helloWorld'
],
function (ext, settings) {
'use strict';
</pre>

Extend the panel which stores the different setting categories:
<pre class="language-javascript">
ext.point("io.ox/settings/pane").extend({
id: 'com.example/helloWorld',
title: 'Hello World Settings,
ref: 'com.example/helloWorld',
loadSettingPane: false,
index: 400,
lazySaveSettings: true
});
</pre>

And now extend the extension point which was established through reffering to <code>com.example/helloWorld</code> above.
<code>(ref: 'com.example/helloWorld')</code>
<pre class="language-javascript">
ext.point("com.example/helloWorld/settings/detail").extend({
index: 50,
id: 'extensions',
draw: function () {
var content=$('div').addClass('content');
content.text('Add form elements to control your settings here');
this.append(content);
}
});
});
</pre>