dojox/app - using with standard widgets

Question

I want to write simple application with dojox/app but not for mobile (every single example is for mobile application). At first I modify actual app by setting this config file:

{
"id": "simpleModelApp",
"name": "Simple Model App",
"description": "A simple app to show how to use different types of Stores and Models",
"splash": "splash",

"dependencies": [
    "dojo/parser",
    "dijit/layout/ContentPane",
    "dojo/store/Memory",
    "dojo/data/ItemFileWriteStore",
    "dojo/store/JsonRest",
    "dojox/app/utils/mvcModel",
    "dojox/mvc/EditStoreRefListController",
    "dojo/store/DataStore"
],
"modules": [],

"controllers": [
    "dojox/app/controllers/Load",
    "dojox/app/controllers/Transition",
    "dojox/app/controllers/Layout"
],  

//stores we are using 
"stores": {
},

"models": {
},

"has" : {
    "ie9orLess" : {
        "controllers": [
            "dojox/app/controllers/HistoryHash"
        ]
    },
    "!ie9orLess" : {
        "controllers": [
            "dojox/app/controllers/History"
        ]
    }
},  

"defaultView": "home",

"defaultTransition": "slide",

"views": {

    "home": {
        "dependencies":["dojo/parser", "dijit/layout/ContentPane", "dijit/layout/BorderContainer"],
        "template": "./main/main.html"
    }
}
}

Then I write simple html for view template:

<div data-dojo-type="dijit/layout/BorderContainer" data-dojo-props="design:'sidebar', gutters:true, liveSplitters:true" id="borderContainer">
<div data-dojo-type="dijit/layout/ContentPane" data-dojo-props="splitter:true, region:'leading'" style="width: 100px;">Hi, I'm leading pane</div>
<div data-dojo-type="dijit/layout/ContentPane" data-dojo-props="splitter:true, region:'center'">Hi, I'm center pane</div>

And run application using defined config file:

var cfg = jsonRef.fromJson(config);
Application(cfg);

Application should have widnow (browser) splited by splitter (BorderContainier) But id din't working. Is it possible to create desktop application witch using normal wigets ? or only mobile ? (I'm using dojo 1.9.1)

Answer 1

Look at https://github.com/dmachi/dojox_application/tree/master/tests/borderLayoutApp

This show how to import the djit theme properly and basically have a border layout.

As a note on any view you must have a wrapper div before any other dijit types. This is due to the fact that the view is created on the top div.