Kevin GiszewskiArchetype
Install Dependencies
Requires Node.js to be installed and in your system path
npm install -g grunt-cli && npm install -g grunt
npm install
Build
grunt
Deploy
grunt deploy --target=C:\\path\\to\\umbraco\\site
grunt watch:dev --target=C:\\path\to\\umbraco\\site
Add --touch to either command to automatically touch the web.config on a deploy
Installation
To use this package right from this repo you will need to manually download and copy the files into the appropriate spot:
###/App_Plugins###
Your /App_Plugins should contain this structure:
/App_Plugins
- package.manifest
- /css
-- archetype.css
- /js
-- archetype.js (our Grunt script concats the controller.js and all directives into one file, you may have to do so manually)
- /views
-- archetype.html
###/bin###
- Drop the Imulus.Archetype.dll in the /bin of your Umbraco install (this dll only handles template helpers, PVC's at present)
- You will have to build this yourself or download it here.
Prevalue Configs
Most of the fields are self evident, the following fields will be discussed further:
###Empty Fieldset Models### This option is required and defines the fieldsets and their properties.
If you get a YSOD regarding truncating of data, it's b/c Umbraco has a arbitrarily low limit on the number of characters (2500) allowed as prevalues in the DB. See: http://issues.umbraco.org/issue/U4-2120
An example follows below:
( //note that this needs to start with an open parentheses and notice the closing one at the end of this. This avoids issues with only seeing [object].
[ //this array holds the array of fieldset objects
{ //fieldset object
alias: "FS1", //fieldset alias (unique)
tooltip: "This is for fieldset 1", //used as a helper text
icon: "/umbraco/Images/aboutNew.png", //a custom icon
label: "Fieldset 1", //the fieldset label
headerText: "Please fill out the boxes.", // text to be prepended to the fieldset properties?
footerText: "Thanks!", //text to be appended to the fieldset properties?
properties:[ //an array of property objects
{
alias: "firstName", //uniquely name the property (unique to the fieldset)
label: "First Name", //a label to use
helpText: "(Required)", //a note that will appear under the label
view: "/umbraco/views/propertyeditors/textbox/textbox.html", //a path to a view
value: "", //set to none or set to a default; can be json (if the view understands it)
config: { //pass configs to the view; configs are based on the view used
}
},
{ //another property
alias: "lastName",
label: "Last Name",
helpText: "(Required)",
view: "/umbraco/views/propertyeditors/textbox/textbox.html",
value: "",
config: {
}
},
{
alias: "age",
label: "Age",
helpText: "(Optional)",
view: "/umbraco/views/propertyeditors/textbox/textbox.html",
value: "",
config: {
}
},
{
alias: "blah",
label: "Blah",
helpText: "",
view: "/umbraco/views/propertyeditors/contentpicker/contentpicker.html",
value: "",
config: {
}
}
]
},
{ //another fieldset
alias: "FS2",
tooltip: "This is for fieldset 2",
icon: "/umbraco/Images/about.png",
label: "Fieldset 2",
headerText: "Please fill out the boxes.",
footerText: "Thanks!",
properties:[
{
alias: "foo",
label: "Foo",
helpText: "(Required)",
view: "/umbraco/views/propertyeditors/textbox/textbox.html",
value: "",
config: {
}
},
{
alias: "bar",
label: "Bar",
helpText: "",
view: "/umbraco/views/propertyeditors/textbox/textbox.html",
value: "",
config: {
}
}
]
}
]
)//close it
###Default Model### Here is the spot to define a starting value. This model uses only the essential data that must be saved. This example shows multiple fieldsets with multiple properties:
( //again use a parenthesis to avoid [object]
{
"fieldsets": [
{
"alias": "FS2",
"properties": [
{
"alias": "bar",
"value": "Field"
},
{
"alias": "foo",
"value": "Another"
}
]
},
{
"alias": "FS2",
"properties": [
{
"alias": "foo",
"value": "The Foo Field"
},
{
"alias": "bar",
"value": "The Bar Field"
}
]
},
{
"alias": "FS1",
"properties": [
{
"alias": "age",
"value": "Old"
},
{
"alias": "lastName",
"value": "Giszewski"
},
{
"alias": "firstName",
"value": "Kevin"
},
{
"alias": "blah",
"value": ""
}
]
}
]
}
)
###Developer Mode###
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.
###Sortable Options### Just in case you need to pass something into the jQueryUI sort options, you can override the default behavior by passing in a new JS snippet here.
##View Compatibility## The basis of compatibility is based on the following:
- The model of the view must use
$scope.model.valueand 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:
<compilation defaultLanguage="c#" debug="true" batch="false" targetFramework="4.5">
This is in order to circumvent the minification and caching of the JavaScript files.