Example of a quick Umbraco package

package.manifest

{
	propertyEditors: [		
		{
			alias: "ExamplePropertyEditor",
			name: "Example",
			editor: {
				view: "~/App_Plugins/Example/PropertyEditor.html",
				hideLabel: false,
				valueType: "JSON"	
			},
			prevalues: {
				fields: [
					{
						label: "Config",
						description: "Some description about the configuration.",
						key: "config",
						view: "~/App_Plugins/Example/PreValueEditor.html"
					}
				]
			}
		}
	],
	javascript: [
		'~/App_Plugins/Example/scripts.js'
	],
	css: [
		'~/App_Plugins/Example/styles.css'
	]
}

PreValueEditor.html

<div ng-controller="PreValueEditor.Controller">
    
    <label>
        <input type="checkbox" ng-model="model.value.a" />
        Option A
    </label>

    <label>
        <input type="checkbox" ng-model="model.value.b" />
        Option B
    </label>
    
    <pre>{{model | json}}</pre>

</div>

PropertyEditor.html

<div ng-controller="PropertyEditor.Controller">
    
    <input type="text" ng-model="model.value" />
    
    <br /><br />
    
    <pre>{{model | json}}</pre>

</div>

scripts.js

angular.module('umbraco').controller('PropertyEditor.Controller', ['$scope', function ($scope) {

}]);

angular.module('umbraco').controller('PreValueEditor.Controller', ['$scope', function ($scope) {
    if (!$scope.model.value) {
        $scope.model.value = {
            a: false,
            b: false
        };
    }
}]);