luca 0.9.89 → 0.9.91
Sign up to get free protection for your applications and to get access to all the features.
- data/CHANGELOG +11 -1
- data/Gemfile +5 -2
- data/Gemfile.lock +84 -56
- data/Rakefile +10 -2
- data/app/assets/javascripts/luca/components/application.coffee +82 -89
- data/app/assets/javascripts/luca/components/collection_view.coffee +9 -5
- data/app/assets/javascripts/luca/components/controller.coffee +72 -11
- data/app/assets/javascripts/luca/components/fields/base.coffee +61 -8
- data/app/assets/javascripts/luca/components/fields/button_field.coffee +53 -7
- data/app/assets/javascripts/luca/components/fields/checkbox_array.coffee +12 -7
- data/app/assets/javascripts/luca/components/fields/text_field.coffee +1 -1
- data/app/assets/javascripts/luca/components/form_view.coffee +2 -2
- data/app/assets/javascripts/luca/components/grid_layout_view.coffee +0 -1
- data/app/assets/javascripts/luca/components/page.coffee +1 -0
- data/app/assets/javascripts/luca/components/table_view.coffee +2 -2
- data/app/assets/javascripts/luca/concerns/dom_helpers.coffee +2 -2
- data/app/assets/javascripts/luca/containers/card_view.coffee +84 -54
- data/app/assets/javascripts/luca/containers/container.coffee +126 -46
- data/app/assets/javascripts/luca/containers/modal_view.coffee +9 -9
- data/app/assets/javascripts/luca/containers/page_controller.coffee +25 -0
- data/app/assets/javascripts/luca/containers/panel_toolbar.coffee +1 -1
- data/app/assets/javascripts/luca/containers/viewport.coffee +2 -5
- data/app/assets/javascripts/luca/core/collection.coffee +18 -4
- data/app/assets/javascripts/luca/core/model.coffee +1 -1
- data/app/assets/javascripts/luca/core/panel.coffee +1 -1
- data/app/assets/javascripts/luca/core/view.coffee +26 -7
- data/app/assets/javascripts/luca/development/code_sync_manager.coffee +51 -4
- data/app/assets/javascripts/luca/development/console.coffee +1 -1
- data/app/assets/javascripts/luca/framework.coffee +1 -1
- data/app/assets/javascripts/luca/index.coffee +1 -0
- data/app/assets/javascripts/luca/util/luca.coffee +2 -1
- data/app/assets/stylesheets/luca/components/viewport.scss +0 -4
- data/bin/luca +14 -0
- data/docs/framework.json +1 -1
- data/docs/luca-framework-documentation.js +1 -0
- data/lib/luca/cli/generate.rb +37 -0
- data/lib/luca/cli/server.rb +20 -0
- data/lib/luca/cli/sync.rb +40 -0
- data/lib/luca/cli/watch.rb +16 -0
- data/lib/luca/cli.rb +68 -0
- data/lib/luca/collection/endpoint.rb +1 -0
- data/lib/luca/component_definition.rb +23 -5
- data/lib/luca/luca_application.rb +18 -7
- data/lib/luca/rails/version.rb +1 -1
- data/lib/luca/server.rb +7 -0
- data/lib/luca/stylesheet.rb +2 -3
- data/lib/luca/version.rb +3 -0
- data/lib/luca/watcher.rb +72 -0
- data/lib/luca.rb +8 -1
- data/luca.gemspec +14 -7
- data/site/.bundle/config +2 -0
- data/site/.gitignore +5 -0
- data/site/.rvmrc +1 -0
- data/site/CHANGELOG.md +41 -0
- data/site/DOCS.md +41 -0
- data/site/Gemfile +8 -0
- data/site/Gemfile.lock +134 -0
- data/site/LICENSE.md +19 -0
- data/site/config.rb +84 -0
- data/site/helpers/site_helpers.rb +20 -0
- data/site/html5bp-docs/README.md +38 -0
- data/site/html5bp-docs/contribute.md +104 -0
- data/site/html5bp-docs/crossdomain.md +21 -0
- data/site/html5bp-docs/css.md +135 -0
- data/site/html5bp-docs/extend.md +507 -0
- data/site/html5bp-docs/faq.md +77 -0
- data/site/html5bp-docs/htaccess.md +323 -0
- data/site/html5bp-docs/html.md +170 -0
- data/site/html5bp-docs/js.md +31 -0
- data/site/html5bp-docs/misc.md +25 -0
- data/site/html5bp-docs/usage.md +109 -0
- data/site/readme.md +47 -0
- data/site/source/.htaccess +540 -0
- data/site/source/404.html +157 -0
- data/site/source/app/assets/javascripts/dependencies.js.coffee +6 -0
- data/site/source/app/assets/javascripts/docs/application.coffee +64 -0
- data/site/source/app/assets/javascripts/docs/collections/docs_documentation.coffee +17 -0
- data/site/source/app/assets/javascripts/docs/collections/github_repositories.coffee +7 -0
- data/site/source/app/assets/javascripts/docs/collections/index.coffee +1 -0
- data/site/source/app/assets/javascripts/docs/collections/luca_documentation.coffee +17 -0
- data/site/source/app/assets/javascripts/docs/collections/public_gists.coffee +4 -0
- data/site/source/app/assets/javascripts/docs/config.coffee +5 -0
- data/site/source/app/assets/javascripts/docs/index.coffee +12 -0
- data/site/source/app/assets/javascripts/docs/lib/router.coffee +3 -0
- data/site/source/app/assets/javascripts/docs/lib/util.coffee +0 -0
- data/site/source/app/assets/javascripts/docs/models/component.coffee +99 -0
- data/site/source/app/assets/javascripts/docs/models/github_repository.coffee +3 -0
- data/site/source/app/assets/javascripts/docs/models/index.coffee +1 -0
- data/site/source/app/assets/javascripts/docs/templates/component_documentation.jst.ejs +55 -0
- data/site/source/app/assets/javascripts/docs/templates/examples_browser/overview.jst.ejs +4 -0
- data/site/source/app/assets/javascripts/docs/templates/examples_browser/selector.jst.ejs +11 -0
- data/site/source/app/assets/javascripts/docs/templates/github_repository.jst.ejs +4 -0
- data/site/source/app/assets/javascripts/docs/templates/layouts/main.jst.ejs +4 -0
- data/site/source/app/assets/javascripts/docs/templates/left_navigation.jst.ejs +5 -0
- data/site/source/app/assets/javascripts/docs/templates/pages/getting_started.jst.ejs +78 -0
- data/site/source/app/assets/javascripts/docs/templates/pages/home.jst.ejs +57 -0
- data/site/source/app/assets/javascripts/docs/views/components/code_editor/index.coffee +0 -0
- data/site/source/app/assets/javascripts/docs/views/components/code_editor.coffee +45 -0
- data/site/source/app/assets/javascripts/docs/views/components/component_documentation.coffee +72 -0
- data/site/source/app/assets/javascripts/docs/views/index.coffee +3 -0
- data/site/source/app/assets/javascripts/docs/views/pages/browse_source/details.coffee +37 -0
- data/site/source/app/assets/javascripts/docs/views/pages/browse_source/list.coffee +31 -0
- data/site/source/app/assets/javascripts/docs/views/pages/browse_source.coffee +46 -0
- data/site/source/app/assets/javascripts/docs/views/pages/component_editor.coffee +10 -0
- data/site/source/app/assets/javascripts/docs/views/pages/examples_browser/docs.coffee +12 -0
- data/site/source/app/assets/javascripts/docs/views/pages/examples_browser/source.coffee +13 -0
- data/site/source/app/assets/javascripts/docs/views/pages/examples_browser.coffee +102 -0
- data/site/source/app/assets/javascripts/docs/views/pages/home.coffee +10 -0
- data/site/source/app/assets/javascripts/docs/views/views/api_browser/index.coffee +43 -0
- data/site/source/app/assets/javascripts/docs/views/views/collection_view_examples/grid_layout_view_example.coffee +14 -0
- data/site/source/app/assets/javascripts/docs/views/views/collection_view_examples/table_view_example.coffee +39 -0
- data/site/source/app/assets/javascripts/docs/views/views/form_view_examples/basic_example.coffee +38 -0
- data/site/source/app/assets/javascripts/docs/views/views/form_view_examples/complex_layout.coffee +110 -0
- data/site/source/app/assets/javascripts/docs/views/views/top_navigation.coffee +6 -0
- data/site/source/app/assets/javascripts/docs-docs.js +1 -0
- data/site/source/app/assets/javascripts/luca-docs.js +1 -0
- data/site/source/app/assets/javascripts/luca-framework-documentation.js +1 -0
- data/site/source/app/assets/javascripts/site.js.coffee +4 -0
- data/site/source/app/assets/javascripts/vendor/codemirror.js +4786 -0
- data/site/source/app/assets/javascripts/vendor/coffeescript.js +346 -0
- data/site/source/app/assets/javascripts/vendor/css.js +465 -0
- data/site/source/app/assets/javascripts/vendor/htmlmixed.js +84 -0
- data/site/source/app/assets/javascripts/vendor/javascript.js +422 -0
- data/site/source/app/assets/javascripts/vendor/js-beautify.js +1353 -0
- data/site/source/app/assets/javascripts/vendor/modernizr-2.6.1.min.js +4 -0
- data/site/source/app/assets/javascripts/vendor/vim.js +2511 -0
- data/site/source/app/assets/stylesheets/docs/api-browser.css.scss +5 -0
- data/site/source/app/assets/stylesheets/docs/application.css.scss +35 -0
- data/site/source/app/assets/stylesheets/docs/browse-source.css.scss +5 -0
- data/site/source/app/assets/stylesheets/docs/scrollable-table.css.scss +5 -0
- data/site/source/app/assets/stylesheets/site.css.scss +2 -0
- data/site/source/app/assets/stylesheets/vendor/codemirror.css +240 -0
- data/site/source/app/assets/stylesheets/vendor/prettify-tomorrow-night-bright.css +160 -0
- data/site/source/app/assets/stylesheets/vendor/twilight.css +26 -0
- data/site/source/crossdomain.xml +15 -0
- data/site/source/documentation.html.haml +1 -0
- data/site/source/favicon_base.png +0 -0
- data/site/source/humans.txt +15 -0
- data/site/source/images/background.png +0 -0
- data/site/source/images/middleman.png +0 -0
- data/site/source/index.html.haml +1 -0
- data/site/source/layouts/layout.haml +55 -0
- data/site/source/readme.md +63 -0
- data/site/source/robots.txt +3 -0
- data/spec/javascripts/components/collection_view_spec.coffee +1 -1
- data/spec/javascripts/containers/card_view_spec.coffee +58 -5
- data/spec/javascripts/core/collection_spec.coffee +1 -1
- data/spec/javascripts/core/view_spec.coffee +2 -2
- data/vendor/assets/javascripts/backbone-min.js +37 -33
- data/vendor/assets/javascripts/backbone-query.min.js +1 -1
- data/vendor/assets/javascripts/jquery.js +5 -4
- data/vendor/assets/javascripts/luca-dependencies.min.js +8 -6
- data/vendor/assets/javascripts/luca-development.min.js +1 -1
- data/vendor/assets/javascripts/luca.full.min.js +12 -10
- data/vendor/assets/javascripts/luca.min.js +5 -5
- data/vendor/assets/javascripts/underscore-min.js +1 -5
- data/vendor/assets/javascripts/underscore-string.min.js +1 -1
- data/vendor/assets/stylesheets/luca-components.css +0 -2
- data/vendor/assets/stylesheets/luca-development.css +1 -1
- metadata +215 -39
- data/app/assets/javascripts/luca/components/page_controller.coffee +0 -3
- data/app/assets/javascripts/luca/core/collection_view.coffee +0 -150
- data/site/assets/bootstrap.min.js +0 -7
- data/site/assets/dependencies.js +0 -94
- data/site/assets/glyphicons-halflings-white.png +0 -0
- data/site/assets/glyphicons-halflings.png +0 -0
- data/site/assets/luca-ui-bootstrap.css +0 -1331
- data/site/assets/luca-ui-bootstrap.js +0 -9
- data/site/assets/luca-ui-development-tools.css +0 -234
- data/site/assets/luca-ui-development-tools.js +0 -18561
- data/site/assets/luca-ui-development-tools.min.js +0 -15
- data/site/assets/luca-ui-full.min.js +0 -8
- data/site/assets/luca-ui.min.js +0 -4
- data/site/assets/sandbox.css +0 -62
- data/site/assets/sandbox.js +0 -469
- data/site/docs/application.html +0 -41
- data/site/docs/caching.html +0 -43
- data/site/docs/collection.html +0 -75
- data/site/docs/collection_manager.html +0 -71
- data/site/docs/containers.html +0 -118
- data/site/docs/events.html +0 -153
- data/site/docs/view.html +0 -128
- data/site/img/glyphicons-halflings-white.png +0 -0
- data/site/img/glyphicons-halflings.png +0 -0
- data/site/index.html +0 -20
- data/site/source-map.js +0 -1
data/site/assets/sandbox.js
DELETED
@@ -1,469 +0,0 @@
|
|
1
|
-
(function() {
|
2
|
-
|
3
|
-
window.Sandbox = {
|
4
|
-
views: {},
|
5
|
-
collections: {},
|
6
|
-
models: {}
|
7
|
-
};
|
8
|
-
|
9
|
-
Luca.registry.addNamespace('Sandbox.views');
|
10
|
-
|
11
|
-
Luca.Collection.namespace = Sandbox.collections;
|
12
|
-
|
13
|
-
}).call(this);
|
14
|
-
(function() {
|
15
|
-
Luca.templates || (Luca.templates = {});
|
16
|
-
Luca.templates["builder"] = function(obj){var __p=[],print=function(){__p.push.apply(__p,arguments);};with(obj||{}){__p.push('<h1>Luca.JS Component Builder</h1>\n<p>This is coming soon. The Luca.JS sandbox application will provide interactive examples of various components and explain the architectural pieces that go into a well designed single page application.</p>\n');}return __p.join('');};
|
17
|
-
}).call(this);
|
18
|
-
(function() {
|
19
|
-
Luca.templates || (Luca.templates = {});
|
20
|
-
Luca.templates["builder/component_list"] = function(obj){var __p=[],print=function(){__p.push.apply(__p,arguments);};with(obj||{}){__p.push('<div class=\'component\'></div>\n');}return __p.join('');};
|
21
|
-
}).call(this);
|
22
|
-
(function() {
|
23
|
-
Luca.templates || (Luca.templates = {});
|
24
|
-
Luca.templates["main"] = function(obj){var __p=[],print=function(){__p.push.apply(__p,arguments);};with(obj||{}){__p.push('<div class=\'container\'>\n <div class=\'hero-unit\'>\n <h1>Want to build apps with Backbone?</h1>\n <p>This is a collection of application design components that you should use to build your next large backbone.js application.</p>\n <p>It combines the elegance and simplicity of backbone.js and bootstrap.css, with the experience of developers who have been building single page javascript apps since you were a baby.</p>\n <a class=\'btn btn-large btn-primary\' href=\'https://github.com/datapimp/luca/zipball/master\'>\n Download\n </a>\n <a class=\'btn btn-success btn-large\' href=\'#build\'>\n Build an App\n </a>\n </div>\n <hr />\n <div id=\'information\'>\n <div class=\'row heading\'>\n <div class=\'span12\'>\n <h2>Composite Application Architecture</h2>\n </div>\n </div>\n <div class=\'row\'>\n <div class=\'span4\'>\n <h3>Component Driven Design</h3>\n <p>Luca is a collection of common components needed to build large single page applications. Luca provides base classes for Model, View, and Collection classes which you can choose to extend where needed. Luca also provides an extensive library of application building components and UI elements which you can piece together in a variety of ways to build responsive, and snappy single page apps.</p>\n </div>\n <div class=\'span4\'>\n <h3>Backbone and Luca work together</h3>\n <p>Luca is not a replacement for Backbone, it is a smart use of Backbone\'s core classes. Large apps require layers of abstraction and patterns for communication between various components, Luca provides these for you.</p>\n <p>Like Backbone, you only have to use what you need.</p>\n </div>\n <div class=\'span4\'>\n <h3>Well Tested Patterns</h3>\n <p>We have extracted all of the common patterns and optimizations we have learned over the course of a year developing several large applications. Using Luca allows you to leverage the power of Backbone.js but only focus on what makes your app unique.</p>\n </div>\n <a href=\'https://github.com/datapimp/luca\'>\n <img alt=\'Fork me on GitHub\' src=\'https://s3.amazonaws.com/github/ribbons/forkme_right_red_aa0000.png\' style=\'position: absolute; top: 0; right: 0; border: 0; z-index:9000;\' />\n </a>\n </div>\n <div class=\'row heading\'>\n <div class=\'span12\'>\n <h2>Develop Apps Faster</h2>\n </div>\n </div>\n <div class=\'row\'>\n <div class=\'span4\'>\n <h3>Development Tools</h3>\n <p>Luca\'s development tools include an in-browser Coffeescript console, a CodeMirror based IDE which performs live updates in the browser.</p>\n <p>Live reloading of your code changes is also supported if you use the ruby gem and make changes in your favorite editor.</p>\n </div>\n <div class=\'span4\'>\n <h3>Experimentation and Debugging</h3>\n <p>The Luca framework was designed encourage developers to define apps mostly using JSON configuration, The structural components and style rules are generated for us, events get bound, and things just work.</p>\n <p>\n <a href=\'#application\'>Take a look at this application in the inspector.</a>\n </p>\n </div>\n <div class=\'span4\'>\n <h3>Not only for Ruby Developers</h3>\n <p>Luca is just javascript and css, and will work with any server backend.</p>\n <p>That being said, Luca was developed against Rails and Sinatra apps and comes with many development helpers which work in these environments. The development environment and sandbox is a Sinatra app, but like everything else in the framework you can only use what you need.</p>\n </div>\n </div>\n </div>\n</div>\n');}return __p.join('');};
|
25
|
-
}).call(this);
|
26
|
-
(function() {
|
27
|
-
Luca.templates || (Luca.templates = {});
|
28
|
-
Luca.templates["sandbox"] = function(obj){var __p=[],print=function(){__p.push.apply(__p,arguments);};with(obj||{}){__p.push('<h1>Hi</h1>\n');}return __p.join('');};
|
29
|
-
}).call(this);
|
30
|
-
(function() {
|
31
|
-
Luca.templates || (Luca.templates = {});
|
32
|
-
Luca.templates["sandbox/docs_index"] = function(obj){var __p=[],print=function(){__p.push.apply(__p,arguments);};with(obj||{}){__p.push('<h1>Documentation</h1>\n');}return __p.join('');};
|
33
|
-
}).call(this);
|
34
|
-
(function() {
|
35
|
-
Luca.templates || (Luca.templates = {});
|
36
|
-
Luca.templates["sandbox/navigation"] = function(obj){var __p=[],print=function(){__p.push.apply(__p,arguments);};with(obj||{}){__p.push('<ul class=\'nav\'>\n <li>\n <a href=\'#intro\'>Intro</a>\n </li>\n <li>\n <a href=\'#build\'>Component Builder</a>\n </li>\n <li>\n <a href=\'#docs\'>Documentation</a>\n </li>\n</ul>\n');}return __p.join('');};
|
37
|
-
}).call(this);
|
38
|
-
(function() {
|
39
|
-
Luca.templates || (Luca.templates = {});
|
40
|
-
Luca.templates["sandbox/readme"] = function(obj){var __p=[],print=function(){__p.push.apply(__p,arguments);};with(obj||{}){__p.push('<div class=\'container\'>\n <h1>Component Driven Architecture with Luca.JS</h1>\n <p>Luca is a component architecture framework based on Backbone.js, which includes</p>\n many development helpers, classes, patterns, and tools needed to build scalable\n and clean single page applications.\n <p>It uses twitter bootstrap compatible markup and css naming conventions,</p>\n making it possible to generate completely styled user interfaces with JSON alone.\n <p>Luca combines the functionality of other open source libraries as well, but you are not</p>\n required to use any of them if you don\'t like.\n <h3>Dependencies</h3>\n <ul>\n <li>\n <a href=\'https://twitter.github.com/bootstrap\'>Bootstrap by Twitter</a>\n </li>\n <li>\n <a href=\'https://github.com/davidgtonge/backbone_query\'>Backbone-Query by David Tonge</a>\n </li>\n <li>\n <a href=\'https://github.com/epeli/underscore.string\'>Underscore String by Esa-Matti Suuronen</a>\n </li>\n </ul>\n <h3>Development Tool Dependencies</h3>\n <ul>\n <li>\n <a href=\'https://codemirror.net\'>CodeMirror IDE</a>\n </li>\n <li>\n <a href=\'https://coffeescript.org\'>CoffeeScript Compiler</a>\n </li>\n </ul>\n</div>\n');}return __p.join('');};
|
41
|
-
}).call(this);
|
42
|
-
(function() {
|
43
|
-
|
44
|
-
_.def("Sandbox.views.Builder")["extends"]("Luca.core.Container")["with"]({
|
45
|
-
name: "builder",
|
46
|
-
id: "builder",
|
47
|
-
defaultCanvasPosition: 'below',
|
48
|
-
componentEvents: {
|
49
|
-
"editor_container toggle:search:option": "toggleSearchOption"
|
50
|
-
},
|
51
|
-
components: [
|
52
|
-
{
|
53
|
-
ctype: "container",
|
54
|
-
name: "editor_container",
|
55
|
-
additionalClassNames: 'row-fluid',
|
56
|
-
className: "builder-editor-container",
|
57
|
-
styles: {
|
58
|
-
position: "absolute"
|
59
|
-
},
|
60
|
-
bottomToolbar: {
|
61
|
-
buttons: [
|
62
|
-
{
|
63
|
-
group: true,
|
64
|
-
align: "left",
|
65
|
-
buttons: [
|
66
|
-
{
|
67
|
-
eventId: "toggle:search:option",
|
68
|
-
icon: "search",
|
69
|
-
classes: "search-options component-search"
|
70
|
-
}, {
|
71
|
-
eventId: "toggle:search:option",
|
72
|
-
icon: "list-alt",
|
73
|
-
classes: "search-options saved-components"
|
74
|
-
}
|
75
|
-
]
|
76
|
-
}, {
|
77
|
-
eventId: "toggle:settings",
|
78
|
-
icon: "cog",
|
79
|
-
align: 'right'
|
80
|
-
}
|
81
|
-
]
|
82
|
-
},
|
83
|
-
components: [
|
84
|
-
{
|
85
|
-
ctype: "builder_editor",
|
86
|
-
name: "builder_editor",
|
87
|
-
className: "builder-editor",
|
88
|
-
styles: {
|
89
|
-
position: "relative",
|
90
|
-
width: "100%",
|
91
|
-
top: "0",
|
92
|
-
left: "0"
|
93
|
-
}
|
94
|
-
}, {
|
95
|
-
type: "project_browser",
|
96
|
-
className: "project-browser",
|
97
|
-
name: "project_browser",
|
98
|
-
styles: {
|
99
|
-
position: "relative",
|
100
|
-
width: "30%",
|
101
|
-
top: "0",
|
102
|
-
left: "0"
|
103
|
-
}
|
104
|
-
}
|
105
|
-
]
|
106
|
-
}
|
107
|
-
],
|
108
|
-
initialize: function(options) {
|
109
|
-
var canvas,
|
110
|
-
_this = this;
|
111
|
-
this.options = options != null ? options : {};
|
112
|
-
Luca.core.Container.prototype.initialize.apply(this, arguments);
|
113
|
-
_.bindAll(this, "toggleSearchOption");
|
114
|
-
canvas = {
|
115
|
-
type: "builder_canvas",
|
116
|
-
className: "builder-canvas"
|
117
|
-
};
|
118
|
-
this.state = new Backbone.Model({
|
119
|
-
canvasLayout: "horizontal-split",
|
120
|
-
canvasPosition: this.defaultCanvasPosition || "above",
|
121
|
-
ratio: 0.4
|
122
|
-
});
|
123
|
-
this.state.bind("change:canvasLayout", function() {
|
124
|
-
return _this.$el.removeClass().addClass(_this.state.get("canvasLayout"));
|
125
|
-
});
|
126
|
-
if (this.state.get('canvasPosition') === "above") {
|
127
|
-
return this.components.unshift(canvas);
|
128
|
-
} else {
|
129
|
-
return this.components.push(canvas);
|
130
|
-
}
|
131
|
-
},
|
132
|
-
canvas: function() {
|
133
|
-
return Luca("builder_canvas");
|
134
|
-
},
|
135
|
-
editor: function() {
|
136
|
-
return Luca("builder_editor");
|
137
|
-
},
|
138
|
-
componentList: function() {
|
139
|
-
return Luca("component_list");
|
140
|
-
},
|
141
|
-
toggleSearchOption: function(button) {
|
142
|
-
return button.toggleClass('active');
|
143
|
-
},
|
144
|
-
fitToScreen: function() {
|
145
|
-
var filterHeight, half, toolbarHeight, viewportHeight;
|
146
|
-
this.$el.addClass("canvas-position-" + (this.state.get('canvasPosition')));
|
147
|
-
viewportHeight = $(window).height();
|
148
|
-
half = viewportHeight * this.state.get('ratio');
|
149
|
-
toolbarHeight = 0;
|
150
|
-
toolbarHeight += this.$('.toolbar-container.top').height() * this.$('.toolbar-container.top').length;
|
151
|
-
filterHeight = 0;
|
152
|
-
filterHeight += this.$('.component-list-filter-form').height();
|
153
|
-
this.canvas().$el.height(half - toolbarHeight - 40);
|
154
|
-
this.componentList().$el.height(half - filterHeight - 50);
|
155
|
-
this.editor().$el.height(half);
|
156
|
-
return this.editor().setHeight(half);
|
157
|
-
},
|
158
|
-
activation: function() {
|
159
|
-
return this.fitToScreen();
|
160
|
-
},
|
161
|
-
deactivation: function() {},
|
162
|
-
afterRender: function() {
|
163
|
-
var componentList;
|
164
|
-
this._super("afterRender", this, arguments);
|
165
|
-
componentList = Luca("component_list");
|
166
|
-
componentList.on("selected", function(component) {
|
167
|
-
Luca("builder_editor").setValue(component.get('source'));
|
168
|
-
return Luca("builder_editor").state.set('currentMode', 'coffeescript');
|
169
|
-
});
|
170
|
-
this.$('.component-list-filter-form input[type="text"]').on("keydown", function() {
|
171
|
-
return componentList.filterByName($(this).val());
|
172
|
-
});
|
173
|
-
return this.$('.component-list-filter-form input[type="text"]').on("keyup", function() {
|
174
|
-
var val;
|
175
|
-
val = $(this).val();
|
176
|
-
if (val.length === 0) return componentList.filterByName('');
|
177
|
-
});
|
178
|
-
},
|
179
|
-
beforeRender: function() {
|
180
|
-
var _ref;
|
181
|
-
if ((_ref = Luca.core.Container.prototype.beforeRender) != null) {
|
182
|
-
_ref.apply(this, arguments);
|
183
|
-
}
|
184
|
-
return this.$el.removeClass().addClass(this.state.get("canvasLayout"));
|
185
|
-
}
|
186
|
-
});
|
187
|
-
|
188
|
-
}).call(this);
|
189
|
-
(function() {
|
190
|
-
|
191
|
-
_.def("Sandbox.views.BuilderCanvas")["extends"]("Luca.View")["with"]({
|
192
|
-
name: "builder_canvas",
|
193
|
-
bodyTemplate: "builder"
|
194
|
-
});
|
195
|
-
|
196
|
-
}).call(this);
|
197
|
-
(function() {
|
198
|
-
|
199
|
-
_.def("Sandbox.views.BuilderEditor")["extends"]("Luca.tools.CoffeeEditor")["with"]({
|
200
|
-
name: "builder_editor",
|
201
|
-
toggleSource: function() {
|
202
|
-
return this._super("toggleMode", this, arguments);
|
203
|
-
}
|
204
|
-
});
|
205
|
-
|
206
|
-
}).call(this);
|
207
|
-
(function() {
|
208
|
-
|
209
|
-
_.def("Sandbox.views.ComponentList")["extends"]("Luca.components.CollectionView")["with"]({
|
210
|
-
name: "component_list",
|
211
|
-
id: "component_list",
|
212
|
-
collection: "components",
|
213
|
-
itemTagName: "div",
|
214
|
-
autoBindEventHandlers: true,
|
215
|
-
events: {
|
216
|
-
"click div.collection-item a": "clickHandler"
|
217
|
-
},
|
218
|
-
itemRenderer: function(item, model, index) {
|
219
|
-
return Luca.util.make("a", {
|
220
|
-
"data-index": index
|
221
|
-
}, model.className());
|
222
|
-
},
|
223
|
-
filterByName: function(name) {
|
224
|
-
var models;
|
225
|
-
models = this.collection.query({
|
226
|
-
className: {
|
227
|
-
$likeI: name
|
228
|
-
}
|
229
|
-
});
|
230
|
-
this.collection.reset(models, {
|
231
|
-
silent: true
|
232
|
-
});
|
233
|
-
this.refresh();
|
234
|
-
if ((name != null ? name.length : void 0) === 0) {
|
235
|
-
return this.resetToDefault();
|
236
|
-
}
|
237
|
-
},
|
238
|
-
resetToDefault: function() {
|
239
|
-
this.collection.reset(this.initialComponents, {
|
240
|
-
silent: true
|
241
|
-
});
|
242
|
-
return this.refresh();
|
243
|
-
},
|
244
|
-
beforeRender: function() {
|
245
|
-
var success,
|
246
|
-
_this = this;
|
247
|
-
success = function(collection, response) {
|
248
|
-
return _this.initialComponents = response;
|
249
|
-
};
|
250
|
-
return this.collection.fetch({
|
251
|
-
success: success
|
252
|
-
});
|
253
|
-
},
|
254
|
-
clickHandler: function(e) {
|
255
|
-
var component, me, my;
|
256
|
-
e.preventDefault();
|
257
|
-
me = my = $(e.target);
|
258
|
-
component = this.collection.at(my.data('index'));
|
259
|
-
return this.trigger("selected", component);
|
260
|
-
}
|
261
|
-
});
|
262
|
-
|
263
|
-
}).call(this);
|
264
|
-
(function() {
|
265
|
-
|
266
|
-
_.def("Sandbox.views.ProjectBrowser")["extends"]("Luca.core.Container")["with"]({
|
267
|
-
className: "project-browser",
|
268
|
-
components: [
|
269
|
-
{
|
270
|
-
type: "text_field",
|
271
|
-
name: "component_list_filter",
|
272
|
-
additionalClassNames: "well",
|
273
|
-
className: "component-list-filter-form",
|
274
|
-
placeHolder: "Find a component",
|
275
|
-
hideLabel: true,
|
276
|
-
prepend: "?"
|
277
|
-
}, {
|
278
|
-
type: "component_list",
|
279
|
-
name: "component_list"
|
280
|
-
}
|
281
|
-
]
|
282
|
-
});
|
283
|
-
|
284
|
-
}).call(this);
|
285
|
-
(function() {
|
286
|
-
|
287
|
-
_.def("Sandbox.views.DocsController")["extends"]("Luca.components.Controller")["with"]({
|
288
|
-
name: "docs",
|
289
|
-
defaultCard: "docs_index",
|
290
|
-
components: [
|
291
|
-
{
|
292
|
-
name: "docs_index",
|
293
|
-
bodyTemplate: "sandbox/docs_index"
|
294
|
-
}
|
295
|
-
]
|
296
|
-
});
|
297
|
-
|
298
|
-
}).call(this);
|
299
|
-
(function() {
|
300
|
-
|
301
|
-
_.def("Sandbox.views.ApplicationInspector")["extends"]("Luca.tools.ApplicationInspector")["with"]({
|
302
|
-
name: "application_inspector",
|
303
|
-
additionalClassNames: ["modal"],
|
304
|
-
toggle: function(options) {
|
305
|
-
if (options == null) {
|
306
|
-
options = {
|
307
|
-
backdrop: false
|
308
|
-
};
|
309
|
-
}
|
310
|
-
if (this.rendered !== true) this.render();
|
311
|
-
return this.$el.modal(options);
|
312
|
-
},
|
313
|
-
components: [
|
314
|
-
{
|
315
|
-
ctype: "instance_filter"
|
316
|
-
}
|
317
|
-
]
|
318
|
-
});
|
319
|
-
|
320
|
-
}).call(this);
|
321
|
-
(function() {
|
322
|
-
|
323
|
-
_.def("Sandbox.views.InstanceFilter")["extends"]("Luca.components.FormView")["with"]({
|
324
|
-
name: "instance_filter",
|
325
|
-
well: true,
|
326
|
-
horizontal: true,
|
327
|
-
inline: true,
|
328
|
-
toolbar: false,
|
329
|
-
components: [
|
330
|
-
{
|
331
|
-
ctype: "type_ahead_field",
|
332
|
-
label: "Find by name",
|
333
|
-
source: function() {
|
334
|
-
var names;
|
335
|
-
names = _(Luca.registry.instances()).pluck('name');
|
336
|
-
return _.uniq(_(names).compact());
|
337
|
-
}
|
338
|
-
}, {
|
339
|
-
ctype: "type_ahead_field",
|
340
|
-
label: "Find by class",
|
341
|
-
source: function() {
|
342
|
-
return Luca.registry.classes(true);
|
343
|
-
}
|
344
|
-
}
|
345
|
-
]
|
346
|
-
});
|
347
|
-
|
348
|
-
}).call(this);
|
349
|
-
(function() {
|
350
|
-
|
351
|
-
|
352
|
-
|
353
|
-
}).call(this);
|
354
|
-
(function() {
|
355
|
-
|
356
|
-
_.def("Sandbox.views.TopNavigation")["extends"]("Luca.components.NavBar")["with"]({
|
357
|
-
brand: "Luca",
|
358
|
-
name: "top_navigation",
|
359
|
-
template: "sandbox/navigation"
|
360
|
-
});
|
361
|
-
|
362
|
-
}).call(this);
|
363
|
-
(function() {
|
364
|
-
|
365
|
-
Sandbox.Router = Luca.Router.extend({
|
366
|
-
routes: {
|
367
|
-
"": "default",
|
368
|
-
"build": "build",
|
369
|
-
"intro": "intro",
|
370
|
-
"application": "inspector",
|
371
|
-
"docs": "docs",
|
372
|
-
"docs/:section": "docs"
|
373
|
-
},
|
374
|
-
"default": function() {
|
375
|
-
return this.app.navigate_to("pages").navigate_to("main");
|
376
|
-
},
|
377
|
-
build: function() {
|
378
|
-
return this.app.navigate_to("pages").navigate_to("build");
|
379
|
-
},
|
380
|
-
docs: function(section) {
|
381
|
-
if (section == null) section = "docs_index";
|
382
|
-
return this.app.navigate_to("docs").navigate_to(section);
|
383
|
-
},
|
384
|
-
intro: function() {
|
385
|
-
return this.app.navigate_to("pages").navigate_to("intro");
|
386
|
-
},
|
387
|
-
inspector: function() {
|
388
|
-
var inspector;
|
389
|
-
inspector = Luca("application_inspector", new Sandbox.views.ApplicationInspector());
|
390
|
-
return inspector.toggle();
|
391
|
-
}
|
392
|
-
});
|
393
|
-
|
394
|
-
}).call(this);
|
395
|
-
(function() {
|
396
|
-
|
397
|
-
_.def('Sandbox.Application')["extends"]('Luca.Application')["with"]({
|
398
|
-
autoBoot: true,
|
399
|
-
name: 'SandboxApp',
|
400
|
-
router: "Sandbox.Router",
|
401
|
-
el: '#viewport',
|
402
|
-
fluid: true,
|
403
|
-
topNav: 'top_navigation',
|
404
|
-
useKeyHandler: false,
|
405
|
-
keyEvents: {
|
406
|
-
meta: {
|
407
|
-
forwardslash: "developmentConsole"
|
408
|
-
}
|
409
|
-
},
|
410
|
-
collectionManager: {
|
411
|
-
initialCollections: ["components"]
|
412
|
-
},
|
413
|
-
components: [
|
414
|
-
{
|
415
|
-
ctype: 'controller',
|
416
|
-
name: 'pages',
|
417
|
-
components: [
|
418
|
-
{
|
419
|
-
name: "main",
|
420
|
-
className: "marketing-content",
|
421
|
-
bodyTemplate: 'main'
|
422
|
-
}, {
|
423
|
-
name: "intro",
|
424
|
-
className: "marketing-content",
|
425
|
-
bodyTemplate: "readme"
|
426
|
-
}, {
|
427
|
-
name: "build",
|
428
|
-
ctype: "builder"
|
429
|
-
}, {
|
430
|
-
name: "docs",
|
431
|
-
ctype: "docs_controller"
|
432
|
-
}
|
433
|
-
]
|
434
|
-
}
|
435
|
-
],
|
436
|
-
developmentConsole: function() {
|
437
|
-
var container;
|
438
|
-
this.developmentConsole = Luca("coffeescript-console", function() {
|
439
|
-
return new Luca.tools.DevelopmentConsole({
|
440
|
-
name: "coffeescript-console"
|
441
|
-
});
|
442
|
-
});
|
443
|
-
if (!this.consoleContainerAppended) {
|
444
|
-
container = this.make("div", {
|
445
|
-
id: "devtools-console-wrapper",
|
446
|
-
"class": "devtools-console-container modal",
|
447
|
-
style: "width:1000px"
|
448
|
-
}, this.developmentConsole.el);
|
449
|
-
$('body').append(container);
|
450
|
-
this.consoleContainerAppended = true;
|
451
|
-
this.developmentConsole.render();
|
452
|
-
}
|
453
|
-
return $('#devtools-console-wrapper').modal({
|
454
|
-
backdrop: false,
|
455
|
-
show: true
|
456
|
-
});
|
457
|
-
}
|
458
|
-
});
|
459
|
-
|
460
|
-
$(function() {
|
461
|
-
return new Sandbox.Application();
|
462
|
-
});
|
463
|
-
|
464
|
-
}).call(this);
|
465
|
-
(function() {
|
466
|
-
|
467
|
-
|
468
|
-
|
469
|
-
}).call(this);
|
data/site/docs/application.html
DELETED
@@ -1,41 +0,0 @@
|
|
1
|
-
<h1>Luca.Application</h1>
|
2
|
-
<p>A large single-page app generally needs some sort of globally available state tracking object, as well as something which acts as a single entry point into the application, and some sort of gateway to important objects.
|
3
|
-
|
4
|
-
</p>
|
5
|
-
<p>Luca.Application is a type of Viewport class which handles things such as:
|
6
|
-
|
7
|
-
</p>
|
8
|
-
<ul>
|
9
|
-
<li>collection manager ( manages your collections for you ) </li>
|
10
|
-
<li>socket manager ( relays websocket events as Backbone.Events )</li>
|
11
|
-
<li>url fragment router (<code>Backbone.Router</code>)</li>
|
12
|
-
<li>global attributes and change event bindings</li>
|
13
|
-
<li>page controller ( displays a unique page of the application) </li>
|
14
|
-
<li>active view, active sub view helpers</li>
|
15
|
-
</ul>
|
16
|
-
<p>The Luca.Application stores its state in a <code>Backbone.Model</code>, which means you can <code>get()</code> and <code>set()</code> attributes directly on the application, as well as bind to change events on the application itself, and expect the same API you would from a normal model.
|
17
|
-
|
18
|
-
</p>
|
19
|
-
<p>The ability to treat the Luca.Application instance as both a view, and a model allows for some clean patterns. Your views can declaratively list its dependency on the global application state attributes.
|
20
|
-
|
21
|
-
</p>
|
22
|
-
<pre><code class="lang-coffeescript"> _.def("MyView").extends("Luca.View").with
|
23
|
-
name: "my_view"
|
24
|
-
|
25
|
-
applicationEvents:
|
26
|
-
"change:status" : "onStatusChange"
|
27
|
-
|
28
|
-
onStatusChange: (app, currentStatus)->
|
29
|
-
if currentStatus is "inactive"
|
30
|
-
@markInactive()
|
31
|
-
|
32
|
-
markInactive: ()->
|
33
|
-
# mark this view inactive if the application
|
34
|
-
# goes into inactive status
|
35
|
-
|
36
|
-
|
37
|
-
app = Luca.getApplication()
|
38
|
-
|
39
|
-
# this will cause the view named 'my_view' to
|
40
|
-
# to fire its markInactive() method
|
41
|
-
app.set("status", "inactive")</code></pre>
|
data/site/docs/caching.html
DELETED
@@ -1,43 +0,0 @@
|
|
1
|
-
<h1>Method Caching and Computed Properties on Luca Collection and Model</h1>
|
2
|
-
<p>The concept of computed properties ( on the model ) or cached methods ( on the collection )
|
3
|
-
optimizes for cases where you call a method that performs calculations or some other operations
|
4
|
-
whose value is dependent on the model and its underlying attributes.
|
5
|
-
|
6
|
-
</p>
|
7
|
-
<h2>Cached Methods on Luca.Collection</h2>
|
8
|
-
<p>Luca provides a configuration API for Luca.Collection where you specify the method whose value
|
9
|
-
you wish to cache, and the change events which get bubbled up from the models that would change
|
10
|
-
the value, in essence expiring the cache. In addition to change events, standard events on the
|
11
|
-
collection for when a model is added or removed will expire the cached value.
|
12
|
-
|
13
|
-
</p>
|
14
|
-
<pre><code class="lang-coffeescript"> _.def("MyCollection").extends("Luca.Collection").with
|
15
|
-
name:"my_collection"
|
16
|
-
|
17
|
-
cachedMethods:[
|
18
|
-
"expensiveMethod:attributeOne,attributeTwo",
|
19
|
-
"anotherExpensiveMethod"
|
20
|
-
]
|
21
|
-
|
22
|
-
expensiveMethod: ()->
|
23
|
-
@map (model)-> model.get('attributeOne') + model.getAttribute('two')
|
24
|
-
|
25
|
-
anotherExpensiveMethod: ()->
|
26
|
-
@map (model)-> model.value()</code></pre>
|
27
|
-
<p>In the example above, the expensiveMethod is dependent on the attributeOne and attributeTwo attributes
|
28
|
-
on each of the models in the collection, therefor if any of these values change, the cache needs to be expired.
|
29
|
-
|
30
|
-
</p>
|
31
|
-
<p>the anotherExpensiveMethod call is not dependent on any specific values, so will only expire any time a new model
|
32
|
-
is added or removed, or the collection is reset.
|
33
|
-
|
34
|
-
</p>
|
35
|
-
<h2>Computed Properties on Luca.Model</h2>
|
36
|
-
<pre><code class="lang-coffeescript"> _.def("MyModel").extends("Luca.Model").with
|
37
|
-
computed:
|
38
|
-
"expensiveMethod" : ["dependencyOne","dependencyTwo"]
|
39
|
-
|
40
|
-
expensiveMethod: ()->
|
41
|
-
@get("dependencyOne") + @get("dependencyTwo")</code></pre>
|
42
|
-
<p>In the example above, once expensiveMethod is called, its value will be cached and will be invalidated
|
43
|
-
any time the dependencyOne or dependencyTwo attribute changes and triggers a change:dependencyTwo event.</p>
|
data/site/docs/collection.html
DELETED
@@ -1,75 +0,0 @@
|
|
1
|
-
<h1>Luca.Collection</h1>
|
2
|
-
<p>The <code>Luca.Collection</code> class is the base class for Luca components. A number of patterns and optimizations that are helpful in your collection classes have been extracted into the base class.
|
3
|
-
|
4
|
-
</p>
|
5
|
-
<h2>Backbone Query Integration</h2>
|
6
|
-
<p>Luca.Collection either extends from <code>Backbone.Collection</code>, or if it is available <code>Backbone.QueryCollection</code>. The Query Collection was developed by <a href="https://github.com/davidgtonge">Dave Tonge</a> and the project can be found on <a href="https://github.com/datapimp/backbone_query">Github</a>.
|
7
|
-
|
8
|
-
</p>
|
9
|
-
<p><code>Luca.Collections</code> which extend from <code>Backbone.QueryCollection</code> will have a query method which provides you with an API for filtering your collection's models with an API similar to <a href="http://www.mongodb.org/display/DOCS/Advanced+Queries">MongoDB</a>
|
10
|
-
|
11
|
-
</p>
|
12
|
-
<h2>Bootstrapping your models on page load for performance</h2>
|
13
|
-
<p>A good habit for any single page application is to not populate all of your collections via remote calls to your RESTful API. In a lot of cases it is better to put the data that needs to end up in your collections into the initial page load.
|
14
|
-
|
15
|
-
</p>
|
16
|
-
<p>Luca.Collection classes optimize for this pattern through the bootstrap functionality that is baked into the component.
|
17
|
-
|
18
|
-
</p>
|
19
|
-
<p>The bootstrap configuration for <code>Luca.Collection</code> classes depends on the collection being defined with a <code>@cache_key</code> property. <code>@cache_key</code> is either a function which returns a string, or a string, for simple cases.
|
20
|
-
|
21
|
-
</p>
|
22
|
-
<p>To make an array of objects available as models for a collection, either store the objects in <code>Luca.Collection._bootstrapped_models</code> on a property matching the value of <code>@cache_key</code> or use the <code>Luca.Collection.cache()</code> method like such:
|
23
|
-
|
24
|
-
</p>
|
25
|
-
<pre><code class="lang-html"> <body>
|
26
|
-
<script type="text/javascript">
|
27
|
-
Luca.Collection.cache("books",[{author:"Jonathan Soeder"}]
|
28
|
-
</script></code></pre>
|
29
|
-
<p>This will work with the following collection:
|
30
|
-
|
31
|
-
</p>
|
32
|
-
<pre><code class="lang-coffeescript"> _.def("BooksCollection").extends("Luca.Collection").with
|
33
|
-
name:"books"
|
34
|
-
cache_key: "books"</code></pre>
|
35
|
-
<p>Any calls to <code>(new BooksCollection()).fetch()</code> will look in the cached models first, and avoid an API call.
|
36
|
-
|
37
|
-
</p>
|
38
|
-
<p>If you want to refresh the BooksCollection from your API, just pass in an options hash like such:
|
39
|
-
|
40
|
-
</p>
|
41
|
-
<pre><code class="lang-coffeescript"> booksCollection.fetch(refresh:true)</code></pre>
|
42
|
-
<h2>Base Params for RESTful API</h2>
|
43
|
-
<p>There are a lot of cases where you need every API call to pass along the same parameters ( authentication_tokens, keys, etc )
|
44
|
-
|
45
|
-
</p>
|
46
|
-
<p><code>Luca.Collection</code> will wrap the <code>@url</code> property or method with a function which appends the base parameters as an HTTP Query Parameter string.
|
47
|
-
|
48
|
-
</p>
|
49
|
-
<pre><code class="lang-coffeescript"> _.def("BooksCollection").extends("Luca.Collection").with
|
50
|
-
name: "books"
|
51
|
-
url: "/api/v1/books"
|
52
|
-
|
53
|
-
app = Luca.getApplication()
|
54
|
-
|
55
|
-
app.on "authenticated", ()->
|
56
|
-
Luca.Collection.baseParams =
|
57
|
-
auth_token: app.get("authentication_token")
|
58
|
-
|
59
|
-
app.collection("books").url() # => "/api/v1/books?auth_token=123456"</code></pre>
|
60
|
-
<h2>onceLoaded and ifLoaded helpers</h2>
|
61
|
-
<p>There are cases where you want to do something on a collection if it has data, but if it doesn't, you need to fetch that data, and bind a callback to the reset event. This can get tedious.
|
62
|
-
|
63
|
-
</p>
|
64
|
-
<p>Passing a callback to <code>collection.ifLoaded(callback)</code> will eliminate the boilerplate in this pattern.
|
65
|
-
|
66
|
-
</p>
|
67
|
-
<p>If you only want the callback to run once, use <code>collection.onceLoaded()</code>.
|
68
|
-
|
69
|
-
</p>
|
70
|
-
<p>In either of these methods, if you don't watch to automatically call <code>@fetch()</code> on the collection, pass an autoFetch option set to false
|
71
|
-
|
72
|
-
</p>
|
73
|
-
<pre><code> app.collection("books").ifLoaded ()->
|
74
|
-
@doSomething()
|
75
|
-
, autoFetch: false</code></pre>
|