Compare commits
38 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| c374ae7f3e | |||
| c85fd354a6 | |||
| 926e12fa8f | |||
| 081fc1ad6d | |||
| 110f8fc1b2 | |||
| 8077742c13 | |||
| 01a45477b8 | |||
| 8eb005941f | |||
| 04cda8c646 | |||
| cf3b8ee30e | |||
| 424740cdec | |||
| 80bda94265 | |||
| d431f24d27 | |||
| 2deb639d28 | |||
| 4d753d057c | |||
| 57d4ac42b5 | |||
| 340ab297ee | |||
| 4d4d94d0eb | |||
| 72a53b2711 | |||
| 852510fd70 | |||
| bc7025ec69 | |||
| 548113a34a | |||
| eb36f30c11 | |||
| daff37074e | |||
| f27949cfbb | |||
| 1fb5ab489e | |||
| 3cff83af72 | |||
| b78b4627db | |||
| 0a5b3f9c37 | |||
| b94a6048e7 | |||
| 12428c71a9 | |||
| ffc876eed2 | |||
| 41c43f1b7e | |||
| acc27c1976 | |||
| 41dfac827a | |||
| d5d05cef2f | |||
| 4900dcc5b6 | |||
| 1443149264 |
+2
-2
@@ -62,7 +62,7 @@ module.exports = function(grunt) {
|
||||
'app/controllers/controller.js',
|
||||
'app/controllers/config.controller.js',
|
||||
'app/directives/archetypeproperty.js',
|
||||
'app/services/propertyeditor.js'
|
||||
'app/resources/propertyeditor.js'
|
||||
],
|
||||
dest: '<%= dest %>/js/archetype.js'
|
||||
}
|
||||
@@ -104,8 +104,8 @@ module.exports = function(grunt) {
|
||||
build: {
|
||||
files: [
|
||||
{expand: true, cwd: 'app/', src: ['package.manifest'], dest: '<%= dest %>', flatten: true},
|
||||
{expand: true, cwd: 'app/config/', src: ['config.views.js'], dest: '<%= dest %>/js', flatten: true},
|
||||
{expand: true, cwd: 'app/views/', src: ['archetype.html', 'archetype.config.html'], dest: '<%= dest %>/views', flatten: true},
|
||||
{expand: true, cwd: 'app/config/', src: ['propertyEditors.views.js'], dest: '<%= dest %>/js', flatten: true},
|
||||
{expand: true, cwd: 'app/Umbraco/Umbraco.Archetype/bin/Debug/', src: ['Archetype.dll'], dest: '<%= dest %>/bin', flatten: true}
|
||||
]
|
||||
},
|
||||
|
||||
@@ -18,31 +18,12 @@ Archetype
|
||||
Add `--touch` to either command to automatically touch the web.config on a deploy
|
||||
|
||||
## Installation
|
||||
1) Install the <a href='http://bit.ly/1gUYKW8'>package</a> through the Umbraco package installer. Recommended if you want to just see the packaged version.
|
||||
1) Install the selected <a href='https://github.com/imulus/Archetype/releases'>release</a> through the Umbraco package installer. Recommended if you want to just see the packaged version.
|
||||
|
||||
OR
|
||||
|
||||
2) Deploy with Grunt (see above). Recommended if you wish to extend this repo as this will inject this project into an existing v7 Umbraco install.
|
||||
|
||||
OR
|
||||
|
||||
3) Not recommended but a down and dirty way is to manually download and copy the files into the appropriate spot:
|
||||
|
||||
Your /App_Plugins and /bin should contain this structure:
|
||||
|
||||
/App_Plugins
|
||||
- package.manifest
|
||||
- /css
|
||||
-- archetype.css
|
||||
- /js
|
||||
-- archetype.js (our Grunt script concats the controller.js/config.controller.js, services and all directives into one file, you will have to do so manually)
|
||||
-- config.views.js
|
||||
- /views
|
||||
-- archetype.html
|
||||
-- archetype.config.html
|
||||
/bin
|
||||
-- archetype.dll (you'll have to build it)
|
||||
|
||||
## Prevalue Configs ##
|
||||
|
||||
Most of the fields are self evident, the following fields will be discussed further:
|
||||
@@ -51,13 +32,6 @@ Most of the fields are self evident, the following fields will be discussed furt
|
||||
|
||||
By turning this on, you will get a textarea visible with the data model (not prevalue model). You can change the contents of the textarea for real-time editing. Additionally when in developer mode, the console will reflect the scope object of each property.
|
||||
|
||||
##View Compatibility##
|
||||
The basis of compatibility is based on the following:
|
||||
|
||||
- The model of the view must use `$scope.model.value` and the config must use `$scope.model.config`.
|
||||
|
||||
All core properties have not been tested yet :)
|
||||
|
||||
##Developer Notes##
|
||||
If you decide to extend this project locally, you'll want to set the `<compilation>` `debug` property in your `web.config` to `true`:
|
||||
|
||||
|
||||
@@ -1,22 +0,0 @@
|
||||
[
|
||||
{
|
||||
"name": "Textstring",
|
||||
"path": "/umbraco/views/propertyeditors/textbox/textbox.html"
|
||||
},
|
||||
{
|
||||
"name": "Content Picker",
|
||||
"path": "/umbraco/views/propertyeditors/contentpicker/contentpicker.html"
|
||||
},
|
||||
{
|
||||
"name": "Boolean",
|
||||
"path": "/umbraco/views/propertyeditors/boolean/boolean.html"
|
||||
},
|
||||
{
|
||||
"name": "Checkbox List",
|
||||
"path": "/umbraco/views/propertyeditors/checkboxlist/checkboxlist.html"
|
||||
},
|
||||
{
|
||||
"name": "Radio Buttons",
|
||||
"path": "/umbraco/views/propertyeditors/radiobuttons/radiobuttons.html"
|
||||
}
|
||||
]
|
||||
@@ -0,0 +1,148 @@
|
||||
[
|
||||
{
|
||||
"propertyEditorAlias": "Umbraco.CheckBoxList",
|
||||
"view": "checkboxlist"
|
||||
},
|
||||
{
|
||||
"propertyEditorAlias": "Umbraco.ColorPickerAlias",
|
||||
"view": "colorpicker"
|
||||
},
|
||||
{
|
||||
"propertyEditorAlias": "Umbraco.ContentPickerAlias",
|
||||
"view": "contentpicker"
|
||||
},
|
||||
{
|
||||
"propertyEditorAlias": "Umbraco.Date",
|
||||
"view": "datepicker",
|
||||
"defaultPreValues": [{ "format": "yyyy-MM-dd", "pickTime": false }]
|
||||
},
|
||||
{
|
||||
"propertyEditorAlias": "Umbraco.DateTime",
|
||||
"view": "datepicker",
|
||||
"format": "yyyy-MM-dd hh:mm:ss"
|
||||
},
|
||||
{
|
||||
"propertyEditorAlias": "Umbraco.DropDown",
|
||||
"view": "dropdown"
|
||||
},
|
||||
{
|
||||
"propertyEditorAlias": "Umbraco.DropDownMultiple",
|
||||
"view": "dropdown"
|
||||
},
|
||||
{
|
||||
"propertyEditorAlias": "Umbraco.DropDownMultiplePublishKeys",
|
||||
"view": "dropdown"
|
||||
},
|
||||
{
|
||||
"propertyEditorAlias": "Umbraco.DropdownlistPublishingKeys",
|
||||
"view": "dropdown"
|
||||
},
|
||||
{
|
||||
"propertyEditorAlias": "Umbraco.EmailAddress",
|
||||
"view": "email"
|
||||
},
|
||||
{
|
||||
"propertyEditorAlias": "Umbraco.UploadField",
|
||||
"view": "fileupload"
|
||||
},
|
||||
{
|
||||
"propertyEditorAlias": "Umbraco.FolderBrowser",
|
||||
"view": "folderbrowser"
|
||||
},
|
||||
{
|
||||
"propertyEditorAlias": "Umbraco.Integer",
|
||||
"view": "integer"
|
||||
},
|
||||
{
|
||||
"propertyEditorAlias": "Umbraco.NoEdit",
|
||||
"view": "readonlyvalue"
|
||||
},
|
||||
{
|
||||
"propertyEditorAlias": "Umbraco.ListView",
|
||||
"view": "listview"
|
||||
},
|
||||
{
|
||||
"propertyEditorAlias": "Umbraco.MacroContainer",
|
||||
"view": "macrocontainer"
|
||||
},
|
||||
{
|
||||
"propertyEditorAlias": "Umbraco.MarkdownEditor",
|
||||
"view": "markdowneditor"
|
||||
},
|
||||
{
|
||||
"propertyEditorAlias": "Umbraco.MediaPicker",
|
||||
"view": "mediapicker",
|
||||
"defaultPreValues": [{ "multiPicker": "0" }]
|
||||
},
|
||||
{
|
||||
"propertyEditorAlias": "Umbraco.MemberGroupPicker",
|
||||
"view": "membergrouppicker"
|
||||
},
|
||||
{
|
||||
"propertyEditorAlias": "Umbraco.MemberPicker",
|
||||
"view": "memberpicker"
|
||||
},
|
||||
{
|
||||
"propertyEditorAlias": "Umbraco.MultiNodeTreePicker",
|
||||
"view": "contentpicker",
|
||||
"defaultPreValues": [{ "multiPicker": "1" }]
|
||||
},
|
||||
{
|
||||
"propertyEditorAlias": "Umbraco.MultipleMediaPicker",
|
||||
"view": "mediapicker"
|
||||
},
|
||||
{
|
||||
"propertyEditorAlias": "Umbraco.MultipleTextstring",
|
||||
"view": "multipletextbox"
|
||||
},
|
||||
{
|
||||
"propertyEditorAlias": "Umbraco.RadioButtonList",
|
||||
"view": "radiobuttons"
|
||||
},
|
||||
{
|
||||
"propertyEditorAlias": "Umbraco.RelatedLinks",
|
||||
"view": "relatedlinks"
|
||||
},
|
||||
{
|
||||
"propertyEditorAlias": "Umbraco.TinyMCEv3",
|
||||
"view": "rte"
|
||||
},
|
||||
{
|
||||
"propertyEditorAlias": "Umbraco.Slider",
|
||||
"view": "slider"
|
||||
},
|
||||
{
|
||||
"propertyEditorAlias": "Umbraco.Tags",
|
||||
"view": "tags",
|
||||
"defaultPreValues": [{ "group": "default" }]
|
||||
},
|
||||
{
|
||||
"propertyEditorAlias": "Umbraco.TextboxMultiple",
|
||||
"view": "textarea"
|
||||
},
|
||||
{
|
||||
"propertyEditorAlias": "Umbraco.Textbox",
|
||||
"view": "textbox"
|
||||
},
|
||||
{
|
||||
"propertyEditorAlias": "Umbraco.TrueFalse",
|
||||
"view": "boolean"
|
||||
},
|
||||
{
|
||||
"propertyEditorAlias": "Umbraco.UserPicker",
|
||||
"view": "entitypicker",
|
||||
"defaultPreValues": [{ "entityType": "User" }]
|
||||
},
|
||||
{
|
||||
"propertyEditorAlias": "Umbraco.NoEdit",
|
||||
"view": "readonlyvalue"
|
||||
},
|
||||
{
|
||||
"propertyEditorAlias": "Umbraco.Textbox",
|
||||
"view": "textbox"
|
||||
},
|
||||
{
|
||||
"propertyEditorAlias": "Imulus.Archetype",
|
||||
"view": "/App_Plugins/Archetype/views/archetype.html"
|
||||
}
|
||||
]
|
||||
@@ -1,21 +1,35 @@
|
||||
angular.module("umbraco").controller("Imulus.ArchetypeConfigController", function ($scope, $http, assetsService, propertyEditorService) {
|
||||
angular.module("umbraco").controller("Imulus.ArchetypeConfigController", function ($scope, $http, assetsService, dialogService, propertyEditorResource) {
|
||||
|
||||
//$scope.model.value = "";
|
||||
//console.log($scope.model.value);
|
||||
|
||||
var newPropertyModel = '{alias: "", remove: false, collapse: false, label: "", helpText: "", view: "", value: "", config: ""}';
|
||||
var newFieldsetModel = '{alias: "", remove: false, collapse: false, labelTemplate: "", tooltip: "", icon: "", label: "", headerText: "", footerText: "", properties:[' + newPropertyModel + ']}';
|
||||
var defaultFieldsetConfigModel = eval("({showAdvancedOptions: false, hideFieldsetToolbar: false, enableMultipleFieldsets: false, hideFieldsetControls: false, hideFieldsetLabels: false, hidePropertyLabel: false, maxFieldsets: null, fieldsets: [" + newFieldsetModel + "]})");
|
||||
|
||||
//define empty items
|
||||
var newPropertyModel = '{"alias": "", "remove": false, "collapse": false, "label": "", "helpText": "", "dataTypeId": "-88", "value": ""}';
|
||||
var newFieldsetModel = '{"alias": "", "remove": false, "collapse": false, "labelTemplate": "", "icon": "", "label": "", "properties": [' + newPropertyModel + ']}';
|
||||
var defaultFieldsetConfigModel = JSON.parse('{"showAdvancedOptions": false, "hideFieldsetToolbar": false, "enableMultipleFieldsets": false, "hideFieldsetControls": false, "hidePropertyLabel": false, "maxFieldsets": null, "fieldsets": [' + newFieldsetModel + ']}');
|
||||
|
||||
//ini the model
|
||||
$scope.model.value = $scope.model.value || defaultFieldsetConfigModel;
|
||||
|
||||
//ini the render model
|
||||
initConfigRenderModel();
|
||||
|
||||
//get the available views
|
||||
propertyEditorService.getViews().then(function(data){
|
||||
$scope.availableViews = data;
|
||||
|
||||
//get the available datatypes
|
||||
propertyEditorResource.getAllDataTypes().then(function(data) {
|
||||
$scope.availableDataTypes = data;
|
||||
});
|
||||
|
||||
|
||||
//iconPicker
|
||||
$scope.selectIcon = function(fieldset){
|
||||
var dialog = dialogService.iconPicker({
|
||||
callback: function(data){
|
||||
fieldset.icon = data;
|
||||
}
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
//config for the sorting
|
||||
$scope.sortableOptions = {
|
||||
axis: 'y',
|
||||
cursor: "move",
|
||||
@@ -28,6 +42,7 @@ angular.module("umbraco").controller("Imulus.ArchetypeConfigController", functio
|
||||
}
|
||||
};
|
||||
|
||||
//function that determines how to manage expanding/collapsing fieldsets
|
||||
$scope.focusFieldset = function(fieldset){
|
||||
var iniState;
|
||||
|
||||
@@ -58,9 +73,11 @@ angular.module("umbraco").controller("Imulus.ArchetypeConfigController", functio
|
||||
fieldset.collapse = !iniState;
|
||||
}
|
||||
}
|
||||
//ini
|
||||
|
||||
//ini the fieldsets
|
||||
$scope.focusFieldset();
|
||||
|
||||
//function that determines how to manage expanding/collapsing properties
|
||||
$scope.focusProperty = function(properties, property){
|
||||
var iniState;
|
||||
|
||||
@@ -85,6 +102,11 @@ angular.module("umbraco").controller("Imulus.ArchetypeConfigController", functio
|
||||
property.collapse = !iniState;
|
||||
}
|
||||
}
|
||||
|
||||
//ini the properties
|
||||
_.each($scope.archetypeConfigRenderModel.fieldsets, function(fieldset){
|
||||
$scope.focusProperty(fieldset.properties);
|
||||
});
|
||||
|
||||
//setup JSON.stringify helpers
|
||||
$scope.archetypeConfigRenderModel.toString = stringify;
|
||||
@@ -101,7 +123,7 @@ angular.module("umbraco").controller("Imulus.ArchetypeConfigController", functio
|
||||
$scope.archetypeConfigRenderModel = JSON.parse(v);
|
||||
$scope.archetypeConfigRenderModel.toString = stringify;
|
||||
}
|
||||
}, true);
|
||||
});
|
||||
|
||||
//helper that returns if an item can be removed
|
||||
$scope.canRemoveFieldset = function ()
|
||||
@@ -141,6 +163,7 @@ angular.module("umbraco").controller("Imulus.ArchetypeConfigController", functio
|
||||
return count;
|
||||
}
|
||||
|
||||
//determines how many properties are visible
|
||||
function countVisibleProperty(fieldset)
|
||||
{
|
||||
var count = 0;
|
||||
@@ -156,7 +179,7 @@ angular.module("umbraco").controller("Imulus.ArchetypeConfigController", functio
|
||||
|
||||
//handles a fieldset add
|
||||
$scope.addFieldsetRow = function ($index, $event) {
|
||||
$scope.archetypeConfigRenderModel.fieldsets.splice($index + 1, 0, eval("(" + newFieldsetModel + ")"));
|
||||
$scope.archetypeConfigRenderModel.fieldsets.splice($index + 1, 0, JSON.parse(newFieldsetModel));
|
||||
$scope.focusFieldset();
|
||||
}
|
||||
|
||||
@@ -171,7 +194,7 @@ angular.module("umbraco").controller("Imulus.ArchetypeConfigController", functio
|
||||
|
||||
//handles a property add
|
||||
$scope.addPropertyRow = function (fieldset, $index) {
|
||||
fieldset.properties.splice($index + 1, 0, eval("(" + newPropertyModel + ")"));
|
||||
fieldset.properties.splice($index + 1, 0, JSON.parse(newPropertyModel));
|
||||
}
|
||||
|
||||
//rather than splice the archetypeConfigRenderModel, we're hiding this and cleaning onFormSubmitting
|
||||
|
||||
@@ -1,16 +1,17 @@
|
||||
angular.module("umbraco").controller("Imulus.ArchetypeController", function ($scope, $http, $interpolate, assetsService, angularHelper, notificationsService) {
|
||||
|
||||
//$scope.model.value = "";
|
||||
//set default value of the model
|
||||
//this works by checking to see if there is a model; then cascades to the default model then to an empty fieldset
|
||||
|
||||
//get a reference to the current form
|
||||
var form = angularHelper.getCurrentForm($scope);
|
||||
|
||||
//set the config equal to our prevalue config
|
||||
$scope.model.config = $scope.model.config.archetypeConfig;
|
||||
|
||||
//ini the model
|
||||
$scope.model.value = $scope.model.value || { fieldsets: [getEmptyRenderFieldset($scope.model.config.fieldsets[0])] };
|
||||
|
||||
//ini
|
||||
//ini the render model
|
||||
$scope.archetypeRenderModel = {};
|
||||
initArchetypeRenderModel();
|
||||
|
||||
@@ -31,10 +32,7 @@
|
||||
return parsedTemplate;
|
||||
};
|
||||
|
||||
/* add/remove/sort */
|
||||
|
||||
//defines the options for the jquery sortable
|
||||
//i used an ng-model="archetypeRenderModel" so the sort updates the right model
|
||||
//sort config
|
||||
$scope.sortableOptions = {
|
||||
axis: 'y',
|
||||
cursor: "move",
|
||||
@@ -128,7 +126,7 @@
|
||||
return (typeof property !== 'undefined') ? property.value : '';
|
||||
};
|
||||
|
||||
//helper for collapsing
|
||||
//helper for expanding/collapsing fieldsets
|
||||
$scope.focusFieldset = function(fieldset){
|
||||
|
||||
var iniState;
|
||||
@@ -154,24 +152,9 @@
|
||||
}
|
||||
}
|
||||
|
||||
//ini
|
||||
//ini the fieldset expand/collapse
|
||||
$scope.focusFieldset();
|
||||
|
||||
//helper returns valid JS or null
|
||||
function getValidJson(variable, json)
|
||||
{
|
||||
if(!json) return null;
|
||||
|
||||
try {
|
||||
return eval("(" + json + ")");
|
||||
}
|
||||
catch (e) {
|
||||
console.log("There was an error while using 'eval' on " + variable);
|
||||
console.log(json);
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
//developerMode helpers
|
||||
$scope.archetypeRenderModel.toString = stringify;
|
||||
|
||||
@@ -228,10 +211,10 @@
|
||||
});
|
||||
}
|
||||
|
||||
//helper to add an empty fieldset
|
||||
//helper to add an empty fieldset to the render model
|
||||
function getEmptyRenderFieldset (fieldsetModel)
|
||||
{
|
||||
return eval("({ alias: '" + fieldsetModel.alias + "', remove: false, properties: []})");
|
||||
return JSON.parse('{"alias": "' + fieldsetModel.alias + '", "remove": false, "isValid": true, "properties": []}');
|
||||
}
|
||||
|
||||
//helper for validation
|
||||
@@ -288,6 +271,7 @@
|
||||
return validation;
|
||||
}
|
||||
|
||||
//helper to lookup validity when given a fieldsetIndex and property alias
|
||||
$scope.getPropertyValidity = function(fieldsetIndex, alias)
|
||||
{
|
||||
if($scope.archetypeRenderModel.fieldsets[fieldsetIndex])
|
||||
|
||||
@@ -1,17 +1,13 @@
|
||||
angular.module("umbraco").directive('archetypeProperty', function ($compile, $http) {
|
||||
angular.module("umbraco").directive('archetypeProperty', function ($compile, $http, propertyEditorResource, umbPropEditorHelper) {
|
||||
|
||||
function getFieldsetByAlias(fieldsets, alias)
|
||||
{
|
||||
for (var i in fieldsets)
|
||||
{
|
||||
if (fieldsets[i].alias == alias)
|
||||
{
|
||||
return fieldsets[i];
|
||||
}
|
||||
}
|
||||
return _.find(fieldsets, function(fieldset){
|
||||
return fieldset.alias == alias;
|
||||
});
|
||||
}
|
||||
|
||||
function getPropertyIdByAlias(properties, alias)
|
||||
function getPropertyIndexByAlias(properties, alias)
|
||||
{
|
||||
for (var i in properties)
|
||||
{
|
||||
@@ -21,56 +17,72 @@
|
||||
}
|
||||
}
|
||||
|
||||
var linker = function (scope, element, attrs) {
|
||||
|
||||
var configFieldsetModel = getFieldsetByAlias(scope.archetypeConfig.fieldsets, scope.fieldset.alias);
|
||||
//helper that returns a JS ojbect from 'value' string or the original string
|
||||
function jsonOrString(value, developerMode, debugLabel){
|
||||
if(value && typeof value == 'string'){
|
||||
try{
|
||||
if(developerMode == '1'){
|
||||
console.log("Trying to parse " + debugLabel + ": " + value);
|
||||
}
|
||||
value = JSON.parse(value);
|
||||
}
|
||||
catch(exception)
|
||||
{
|
||||
if(developerMode == '1'){
|
||||
console.log("Failed to parse " + debugLabel + ".");
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
var view = configFieldsetModel.properties[scope.propertyConfigIndex].view;
|
||||
if(value && developerMode == '1'){
|
||||
console.log(debugLabel + " post-parsing: ");
|
||||
console.log(value);
|
||||
}
|
||||
|
||||
return value;
|
||||
}
|
||||
|
||||
var linker = function (scope, element, attrs) {
|
||||
var configFieldsetModel = getFieldsetByAlias(scope.archetypeConfig.fieldsets, scope.fieldset.alias);
|
||||
var view = "";
|
||||
var label = configFieldsetModel.properties[scope.propertyConfigIndex].label;
|
||||
var config = configFieldsetModel.properties[scope.propertyConfigIndex].config;
|
||||
var dataTypeId = configFieldsetModel.properties[scope.propertyConfigIndex].dataTypeId;
|
||||
var config = null;
|
||||
var alias = configFieldsetModel.properties[scope.propertyConfigIndex].alias;
|
||||
var defaultValue = configFieldsetModel.properties[scope.propertyConfigIndex].value;
|
||||
|
||||
//try to convert the config to a JS object
|
||||
if(config && typeof config == 'string'){
|
||||
try{
|
||||
if(scope.archetypeConfig.developerMode == '1'){
|
||||
console.log("Trying to eval config: " + config);
|
||||
}
|
||||
config = eval("(" + config + ")");
|
||||
}
|
||||
catch(exception)
|
||||
{
|
||||
if(scope.archetypeConfig.developerMode == '1'){
|
||||
console.log("Failed to eval config.");
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if(config && scope.archetypeConfig.developerMode == '1'){
|
||||
console.log("Config post-eval: " + config);
|
||||
}
|
||||
|
||||
//try to convert the defaultValue to a JS object
|
||||
if(defaultValue && typeof defaultValue == 'string'){
|
||||
try{
|
||||
if(scope.archetypeConfig.developerMode == '1'){
|
||||
console.log("Trying to eval default value: " + defaultValue);
|
||||
}
|
||||
defaultValue = eval("(" + defaultValue + ")");
|
||||
}
|
||||
catch(exception)
|
||||
{
|
||||
if(scope.archetypeConfig.developerMode == '1'){
|
||||
console.log("Failed to eval defaultValue.");
|
||||
}
|
||||
}
|
||||
}
|
||||
defaultValue = jsonOrString(defaultValue, scope.archetypeConfig.developerMode, "defaultValue");
|
||||
|
||||
if(defaultValue && scope.archetypeConfig.developerMode == '1'){
|
||||
console.log("Default value post-eval: " + defaultValue);
|
||||
}
|
||||
//grab info for the selected datatype, prepare for view
|
||||
propertyEditorResource.getDataType(dataTypeId).then(function (data) {
|
||||
//transform preValues array into object expected by propertyeditor views
|
||||
var configObj = {};
|
||||
_.each(data.preValues, function(p) {
|
||||
configObj[p.key] = p.value;
|
||||
});
|
||||
config = configObj;
|
||||
|
||||
//determine the view to use [...] and load it
|
||||
propertyEditorResource.getPropertyEditorMapping(data.selectedEditor).then(function(propertyEditor) {
|
||||
var pathToView = umbPropEditorHelper.getViewPath(propertyEditor.view);
|
||||
|
||||
//load in the DefaultPreValues for the PropertyEditor, if any
|
||||
var defaultConfigObj = {};
|
||||
if (propertyEditor.hasOwnProperty('defaultPreValues')) {
|
||||
_.each(propertyEditor.defaultPreValues, function(p) {
|
||||
_.extend(defaultConfigObj, p)
|
||||
});
|
||||
}
|
||||
var mergedConfig = _.extend(defaultConfigObj, config);
|
||||
|
||||
loadView(pathToView, mergedConfig, defaultValue, alias, scope, element);
|
||||
});
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
function loadView(view, config, defaultValue, alias, scope, element) {
|
||||
if (view)
|
||||
{
|
||||
$http.get(view).success(function (data) {
|
||||
@@ -80,19 +92,17 @@
|
||||
console.log(scope);
|
||||
}
|
||||
|
||||
var rawTemplate = data;
|
||||
|
||||
//define the initial model and config
|
||||
scope.model = {};
|
||||
scope.model.config = {};
|
||||
|
||||
//ini the property value after test to make sure a prop exists in the renderModel
|
||||
var renderModelPropertyIndex = getPropertyIdByAlias(scope.archetypeRenderModel.fieldsets[scope.fieldsetIndex].properties, alias);
|
||||
var renderModelPropertyIndex = getPropertyIndexByAlias(scope.archetypeRenderModel.fieldsets[scope.fieldsetIndex].properties, alias);
|
||||
|
||||
if (!renderModelPropertyIndex)
|
||||
{
|
||||
scope.archetypeRenderModel.fieldsets[scope.fieldsetIndex].properties.push(eval("({alias: '" + alias + "', value:'" + defaultValue + "'})"));
|
||||
renderModelPropertyIndex = getPropertyIdByAlias(scope.archetypeRenderModel.fieldsets[scope.fieldsetIndex].properties, alias);
|
||||
scope.archetypeRenderModel.fieldsets[scope.fieldsetIndex].properties.push(JSON.parse('{"alias": "' + alias + '", "value": "' + defaultValue + '"}'));
|
||||
renderModelPropertyIndex = getPropertyIndexByAlias(scope.archetypeRenderModel.fieldsets[scope.fieldsetIndex].properties, alias);
|
||||
}
|
||||
scope.model.value = scope.archetypeRenderModel.fieldsets[scope.fieldsetIndex].properties[renderModelPropertyIndex].value;
|
||||
|
||||
@@ -107,7 +117,7 @@
|
||||
scope.archetypeRenderModel.fieldsets[scope.fieldsetIndex].properties[renderModelPropertyIndex].value = newValue;
|
||||
});
|
||||
|
||||
element.html(rawTemplate).show();
|
||||
element.html(data).show();
|
||||
$compile(element.contents())(scope);
|
||||
}
|
||||
});
|
||||
|
||||
+77
-19
@@ -1,20 +1,62 @@
|
||||
.archetypeEditor fieldset{
|
||||
border: 1px solid #666;
|
||||
padding: 5px;
|
||||
.archetypeEditor {
|
||||
width: 98%;
|
||||
}
|
||||
|
||||
.archetypeEditor fieldset{
|
||||
border: 1px solid #dddddd;
|
||||
padding: 0;
|
||||
margin-bottom: 5px;
|
||||
background-color: #fff;
|
||||
background-color: #f1f1f1;
|
||||
clear: both;
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.archetypeEditor label{
|
||||
width: 75px;
|
||||
.archetypeEditor .archetypeFieldsetLabel {
|
||||
padding: 8px 25px 8px 3px;
|
||||
float: left;
|
||||
width: 98%;
|
||||
|
||||
span {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
cursor: pointer;
|
||||
|
||||
label span {
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
|
||||
.caret {
|
||||
float:left;
|
||||
margin: 8px 1px 0 7px;
|
||||
&.caret-right {
|
||||
border-bottom: 4px solid transparent;
|
||||
border-top: 4px solid transparent;
|
||||
border-left: 4px solid #000000;
|
||||
content: "";
|
||||
margin-top: 6px;
|
||||
}
|
||||
}
|
||||
|
||||
label{
|
||||
float: left;
|
||||
width: 80%;
|
||||
margin-bottom: 0;
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.archetypeEditor fieldset>label{
|
||||
float: left;
|
||||
width: 200px;
|
||||
padding-left: 0;
|
||||
.archetypeEditor .arechetypeCollapser{
|
||||
clear: both;
|
||||
height: 100%;
|
||||
margin-top: 10px;
|
||||
padding-top: 12px;
|
||||
background-color: #fff;
|
||||
border-top: 1px solid silver;
|
||||
border-radius: 0 0 0 5px;
|
||||
}
|
||||
|
||||
.archetypeEditor .multiPropertyTextbox{
|
||||
@@ -23,10 +65,22 @@
|
||||
|
||||
.archetypeEditor ul{
|
||||
list-style: none;
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.archetypeEditor .archetypeEditorControls{
|
||||
float: right;
|
||||
i:hover {
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.archetypeEditor form {
|
||||
margin-left:20px;
|
||||
|
||||
.control-label {
|
||||
padding-top: 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
.archetypeEditor .archetypeProperty{
|
||||
@@ -35,11 +89,6 @@
|
||||
margin-top: 3px;
|
||||
}
|
||||
|
||||
.archetypeEditor .umb-contentpicker{
|
||||
margin-left: 60px;
|
||||
padding-left: 25px;
|
||||
}
|
||||
|
||||
.archetypeEditor .archetypeDeveloperModel
|
||||
{
|
||||
width: 98%;
|
||||
@@ -146,10 +195,6 @@
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.archetypeConfig .archetypeFieldsetCollapser{
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.archetypeConfig .archetypeOptions label{
|
||||
width: 200px;
|
||||
}
|
||||
@@ -187,4 +232,17 @@
|
||||
margin-bottom: 5px;
|
||||
padding-top: 3px;
|
||||
padding-bottom: 3px;
|
||||
}
|
||||
|
||||
.ui-sortable-placeholder {
|
||||
visibility: visible !important;
|
||||
background-color: #d0e7f1 !important;
|
||||
}
|
||||
|
||||
.archetypeConfig .archetypeFieldsetCollapser{
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
.archetypeConfig .fieldsetIcon{
|
||||
margin-right: 10px;
|
||||
}
|
||||
@@ -0,0 +1,33 @@
|
||||
angular.module('umbraco').factory('propertyEditorResource', function($q, $http, umbRequestHelper){
|
||||
return {
|
||||
getAllDataTypes: function() {
|
||||
// Hack - grab DataTypes from Tree API, as `dataTypeService.getAll()` isn't implemented yet
|
||||
return umbRequestHelper.resourcePromise(
|
||||
$http.get("/umbraco/backoffice/UmbracoTrees/DataTypeTree/GetNodes?id=-1&application=developer&tree=&isDialog=false"), 'Failed to retrieve datatypes from tree service'
|
||||
).then(function (data) {
|
||||
return data.map(function(d) {
|
||||
return { "id": d.id, "name": d.name }
|
||||
});
|
||||
});
|
||||
},
|
||||
getDataType: function(id) {
|
||||
return umbRequestHelper.resourcePromise(
|
||||
$http.get("/umbraco/backoffice/UmbracoApi/DataType/GetById?id=" + id), 'Failed to retrieve datatype'
|
||||
);
|
||||
},
|
||||
getPropertyEditorMapping: function(alias) {
|
||||
return umbRequestHelper.resourcePromise(
|
||||
$http.get("/App_plugins/Archetype/js/propertyEditors.views.js"), 'Failed to retrieve datatype mappings'
|
||||
).then(function (data) {
|
||||
var result = _.find(data, function(d) {
|
||||
return d.propertyEditorAlias === alias;
|
||||
});
|
||||
|
||||
if (result != null)
|
||||
return result;
|
||||
|
||||
return "";
|
||||
});
|
||||
}
|
||||
};
|
||||
});
|
||||
@@ -1,9 +0,0 @@
|
||||
angular.module('umbraco').factory('propertyEditorService', function($q, $http, umbRequestHelper){
|
||||
return {
|
||||
getViews: function() {
|
||||
return umbRequestHelper.resourcePromise(
|
||||
$http.get("/App_Plugins/Archetype/js/config.views.js"), 'Failed to retreive config for views.'
|
||||
);
|
||||
}
|
||||
};
|
||||
});
|
||||
@@ -18,19 +18,10 @@
|
||||
<div class="archetypeFieldsetOption">
|
||||
<label>Label Template</label><input type="text" ng-model="fieldset.labelTemplate" />
|
||||
</div>
|
||||
<div class="archetypeFieldsetOption">
|
||||
<label>Tooltip</label><input type="text" ng-model="fieldset.tooltip" />
|
||||
<div class="archetypeFieldsetOption" ng-show="archetypeConfigRenderModel.enableMultipleFieldsets">
|
||||
<label>Icon</label><i class="fieldsetIcon icon ng-class:fieldset.icon"></i><a ng-click="selectIcon(fieldset)">Select...</a>
|
||||
</div>
|
||||
<div class="archetypeFieldsetOption">
|
||||
<label>Icon</label><input type="text" ng-model="fieldset.icon" />
|
||||
</div>
|
||||
<div class="archetypeFieldsetOption">
|
||||
<label>Header Text</label><input type="text" ng-model="fieldset.headerText" />
|
||||
</div>
|
||||
<div class="archetypeFieldsetOption">
|
||||
<label>Footer Text</label><input type="text" ng-model="fieldset.footerText" />
|
||||
</div>
|
||||
<div class="archetypeFieldsetOption">
|
||||
<div class="archetypeFieldsetOption">
|
||||
<label>Properties</label>
|
||||
</div>
|
||||
<div class="archetypePropertiesWrapper">
|
||||
@@ -53,14 +44,11 @@
|
||||
<label>Help Text</label><input type="text" ng-model="property.helpText" />
|
||||
</div>
|
||||
<div>
|
||||
<label>View</label><select ng-model="property.view" ng-options="view.path as view.name for view in availableViews"></select>
|
||||
<label>DataType</label><select ng-model="property.dataTypeId" ng-options="value.id as value.name for (key, value) in availableDataTypes"></select>
|
||||
</div>
|
||||
<div>
|
||||
<label>Default Value</label><input type="text" ng-model="property.value" />
|
||||
</div>
|
||||
<div>
|
||||
<label>Config</label><textarea ng-model="property.config" /></textarea>
|
||||
</div>
|
||||
<div>
|
||||
<label>Required</label><input type="checkbox" ng-model="property.required" />
|
||||
</div>
|
||||
@@ -84,9 +72,6 @@
|
||||
<div>
|
||||
<label>Hide fieldset editor controls?<small>Hides the fieldset add/remove/sort controls.</small></label><input type="checkbox" ng-model="archetypeConfigRenderModel.hideFieldsetControls"/>
|
||||
</div>
|
||||
<div>
|
||||
<label>Hide fieldset labels?<small>Hides the fieldset labels.</small></label><input type="checkbox" ng-model="archetypeConfigRenderModel.hideFieldsetLabels"/>
|
||||
</div>
|
||||
<div>
|
||||
<label>Hide property labels?<small>Hides the property labels.</small></label><input type="checkbox" ng-model="archetypeConfigRenderModel.hidePropertyLabels"/>
|
||||
</div>
|
||||
|
||||
+31
-26
@@ -1,42 +1,47 @@
|
||||
<div class="archetypeEditor ng-class:model.config.customCssClass" ng-controller="Imulus.ArchetypeController">
|
||||
<div class="archetypeEditor ng-class:model.config.customCssClass" ng-controller="Imulus.ArchetypeController">
|
||||
<textarea class="archetypeDeveloperModel" ng-show="model.config.developerMode" ng-model="archetypeRenderModel"></textarea>
|
||||
<div class="archetypeFieldsetToolbar" ng-show="model.config.fieldsets.length > 1 && model.config.hideFieldsetToolbar != '1'">
|
||||
<ul>
|
||||
<li ng-repeat="fieldsetModel in model.config.fieldsets" ng-click="addRow(fieldsetModel.alias)">
|
||||
<img ng-src='{{fieldsetModel.icon}}' title="{{fieldsetModel.tooltip}}" />
|
||||
<i class="fieldsetIcon icon ng-class:fieldsetModel.icon"></i>
|
||||
<span>{{fieldsetModel.label}}</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<ul ui-sortable="sortableOptions" ng-model="archetypeRenderModel.fieldsets">
|
||||
<li ng-repeat="fieldset in archetypeRenderModel.fieldsets" ng-hide="fieldset.remove">
|
||||
<fieldset ng-class="{archetypeFieldsetError: !fieldset.isValid}" ng-init="fieldsetConfigModel = getConfigFieldsetByAlias(fieldset.alias)">
|
||||
<label ng-hide="model.config.hideFieldsetLabels == '1'" ng-click="focusFieldset(fieldset)">
|
||||
<img ng-src='{{fieldsetConfigModel.icon}}' title="{{fieldsetConfigModel.tooltip}}"/>
|
||||
<span ng-bind="getFieldsetTitle(fieldsetConfigModel, $index)"></span>
|
||||
</label>
|
||||
<div class="archetypeEditorControls" ng-hide="model.config.hideFieldsetControls || model.config.maxFieldsets == '1'">
|
||||
<i class="icon icon-add" ng-click="addRow(fieldset.alias, $index)" ng-show="canAdd()"></i>
|
||||
<i class="icon icon-delete" ng-click="removeRow($index)" ng-show="canRemove()"></i>
|
||||
<i class="icon icon-navigation handle" ng-show="canSort()"></i>
|
||||
</div>
|
||||
<div class="arechetypeCollapser" ng-hide="fieldset.collapse">
|
||||
<div class="archetypeFieldsetHeaderText" ng-show="fieldsetConfigModel.headerText">
|
||||
<em>{{fieldsetConfigModel.headerText}}</em>
|
||||
</div>
|
||||
<div ng-class="{archetypePropertyError: getPropertyValidity($parent.$index, property.alias) === false}" class="archetypeProperty" ng-repeat="property in fieldsetConfigModel.properties">
|
||||
<label ng-hide="archetypeConfig.hidePropertyLabels == '1'">
|
||||
<span>{{property.label}}</span>
|
||||
<div class="archetypeFieldsetHelpText" ng-show="property.helpText">
|
||||
<em>{{property.helpText}}</em>
|
||||
</div>
|
||||
</label>
|
||||
<div class="archetypeFieldsetLabel">
|
||||
<span class="caret" ng-hide="fieldset.collapse"></span>
|
||||
<span class="caret caret-right" ng-show="fieldset.collapse"></span>
|
||||
|
||||
<archetype-property class="archetypeEditor ng-class:property.alias" property="property" fieldset-index="$parent.$index" fieldset="fieldset" archetype-config="model.config" property-config-index="$index" archetype-render-model="archetypeRenderModel"></archetype-property>
|
||||
<label ng-click="focusFieldset(fieldset)">
|
||||
<i class="fieldsetIcon icon ng-class:fieldsetConfigModel.icon"></i>
|
||||
<span ng-bind="getFieldsetTitle(fieldsetConfigModel, $index)"></span>
|
||||
</label>
|
||||
|
||||
<div class="archetypeEditorControls" ng-hide="model.config.hideFieldsetControls || model.config.maxFieldsets == '1'">
|
||||
<i class="icon icon-add" ng-click="addRow(fieldset.alias, $index)" ng-show="canAdd()"></i>
|
||||
<i class="icon icon-delete" ng-click="removeRow($index)" ng-show="canRemove()"></i>
|
||||
<i class="icon icon-navigation handle" ng-show="canSort()"></i>
|
||||
</div>
|
||||
<div class="archetypeFieldsetFooterText" ng-show="fieldsetConfigModel.footerText">
|
||||
<em>{{fieldsetConfigModel.footerText}}</em>
|
||||
</div>
|
||||
</div>
|
||||
<div class="arechetypeCollapser animate-hide" ng-hide="fieldset.collapse">
|
||||
<form class="form-inline">
|
||||
<div ng-class="{archetypePropertyError: getPropertyValidity($parent.$index, property.alias) === false}" class="archetypeProperty control-group" ng-repeat="property in fieldsetConfigModel.properties">
|
||||
<label ng-hide="archetypeConfig.hidePropertyLabels == '1'" class="control-label" for="archetype-property-{{property.alias}}">
|
||||
<span>{{property.label}}</span>
|
||||
<div class="archetypeFieldsetHelpText" ng-show="property.helpText">
|
||||
<em>{{property.helpText}}</em>
|
||||
</div>
|
||||
</label>
|
||||
|
||||
<div class="controls">
|
||||
<archetype-property class="archetypeEditor ng-class:property.alias" property="property" fieldset-index="$parent.$index" fieldset="fieldset" archetype-config="model.config" property-config-index="$index" archetype-render-model="archetypeRenderModel"></archetype-property>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</fieldset>
|
||||
</li>
|
||||
|
||||
@@ -21,5 +21,9 @@
|
||||
"grunt-touch": "~0.1.0",
|
||||
"fs-extra": "~0.8.1",
|
||||
"grunt-msbuild": "~0.1.9"
|
||||
},
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "https://github.com/imulus/Archetype.git"
|
||||
}
|
||||
}
|
||||
|
||||
+1
-1
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "Archetype",
|
||||
"version": "0.1.0-alpha",
|
||||
"version": "0.3.0-alpha",
|
||||
"url": "http://github.com/imulus/archetype/",
|
||||
"author": "Imulus",
|
||||
"authorUrl": "http://imulus.com/",
|
||||
|
||||
Reference in New Issue
Block a user