improve JSON rendering+example

The following are Ruby object representations that can be serialized with .to_json.  We can also filter this structure with .as_json methods on the components of this structure before handing it off to serialization in .to_json.

 Proposal #1

{:card =>   # I think {:cards => [ {:name=>"Home" ...},{} ...]} is what we want, although we can consider that different view parameters 
# could select either/both kinds of root node. If :card represents a codename, we could put the cardname of that card as the
# element name to give wagneer control ...
 { :attributes =>
    {:name =>"Home",
     :cardId =>80,    # optional, but when present is an unchangable Id of a real card
     :type_id =>3,   # :type would be the typename, I think, and we can have :typecode optionally as well
     :class=> ..., :style =>nil, :home_view =>nil, :item =>nil, :base =>nil  # These Html orientled style attributes may be supplied (when non-nill,
# of course) as needed to  populate these attributes in the DOM, but most of the time we will let the Html rendering populate this style information },
   :result =>[  #  :result is probably the wrong name, these are the child nodes, the woudl be inside the <card> </card> tags in Xml, and
                #  in Json this is often called :children. I think :contents would make the most sense for cards, but maybe that is a
# codename and changable by rename?
      "<h1>Welcome to Wagn!</h1>\n<p>&nbsp;</p>\n<p>",
      {:cardlink =>{   # view controls on the nested inclusions would say whether this is rendered like this as a nested data object represeting the
# link or something rendered at a link to string
          :class =>"known-card",
          :url =>"/Config"
        :text =>"Start configuring"
      }},
      " or learn more:</p>\n<ul>\n<li>",
      {:link =>{
          :class =>"external-link",
          :url =>"http://wagn.org/wagn/configuration",
          :text =>"Configuration"
      }},
      "</li>\n<li>",
      {:link =>{
          :class =>"external-link",
        :url =>"http://wagn.org/wagn/Documentation",
          :text =>"Other Documentation"
      }},
      "</li>\n<li>",
    {:link =>{
          :class =>"external-link",
          :url =>"http://wagn.org/wagn/Support",
          :text =>"Support"
      }},
      "</li>\n</ul>\n<div><em>Double-click content to edit.</em></div>\n<p>&nbsp;</p>"
   ]
 }
}

Proposal #2

{ 
  :card => {
    :name    => 'whatever',
    :type    => 'Basic',
    :content => (raw content), # for export
:parsed_content=> [
'I include:', {
# should this be in :card?
:name => 'whatever else',
:type => 'Phrase'
}, '!'
] }
# other card metadata } # request metadata, etc. }

 

Proposal #3 (actually generated in wagn)

 

Sample output:

{
  "url": "http://cutch:3000/rules_to_export.json?pretty=true",
  "timestamp": "2013-09-23 15:37:11 -0600",
  "card": {
    "name": "rules_to_export",
    "type": "Search",
    "content": "{\r\n\"left\":{\"type\":\"Set\"},\r\n\"right\":{\r\n  \"type\":\"Setting\",\r\n  \"not\":{\"name\":[\"in\",\"*create\",\"*read\",\"*update\",\"*delete\"]}\r\n},\r\n\"edited_by\":{\"not\":\"WagnBot\"},\r\n\"return\":\"name\"\r\n}",
    "value": [
      {
        "name": "item type+*right+*option label",
        "type": "Phrase",
        "content": ""
      },
      {
        "name": "item type+*right+*default",
        "type": "Pointer",
        "content": "Image"
      },....

 

In this proposal, "content" is the raw content, where "value" involves processed content.  The above example shows search results.  Typical inclusions might be handled as follows:

...
  :content => "I include {{whatever else}}",
  :value=> [
    'I include:', 
     {
       :name => 'whatever else',
       :type => 'Phrase'
     },
     '!'
  ] 

 

note that there really isn't much need to keep labeling things as a "card".  Every hash is a card.

 

Preliminary Notes from a Demo/Example with Jquery Widgets

These widgets are somewhat rigid about how they they will take the json data, but you can re-arrange things in the success callback.  All the same, we can produce something closer if needed:

{data:"TheCardname":attr:{field1:value1,field2,value2...},children:{data:'PlusName',attr:...}}