netzke-core 0.7.7 → 0.8.0

data/test/core_test_app/app/components/card_component_loader.rb

@@ -4,7 +4,7 @@ class CardComponentLoader < Netzke::Base
   action :load_server_caller
   action :load_extended_server_caller
 
-  js_property :bbar, [:load_server_caller.action, :load_extended_server_caller.action]
+  js_property :bbar, [:load_server_caller, :load_extended_server_caller]
 
   component :server_caller
   component :extended_server_caller
@@ -12,14 +12,14 @@ class CardComponentLoader < Netzke::Base
   js_method :on_load_server_caller, <<-JS
     function(){
       var existing = this.items.findBy(function(i){ return i.getId() == this.getId() + "__server_caller"}, this);
-      if (existing) this.getLayout().setActiveItem(existing); else this.loadNetzkeComponent({name: 'server_caller', container: this, append: true, callback: function(el){this.getLayout().setActiveItem(el)}, scope: this});
+      if (existing) this.getLayout().setActiveItem(existing); else this.netzkeLoadComponent({name: 'server_caller', container: this, append: true, callback: function(el){this.getLayout().setActiveItem(el)}, scope: this});
     }
   JS
 
   js_method :on_load_extended_server_caller, <<-JS
     function(){
       var existing = this.items.findBy(function(i){ return i.getId() == this.getId() + "__extended_server_caller"}, this);
-      if (existing) this.getLayout().setActiveItem(existing); else this.loadNetzkeComponent({name: 'extended_server_caller', container: this, append: true, callback: function(el){this.getLayout().setActiveItem(el)}, scope: this});
+      if (existing) this.getLayout().setActiveItem(existing); else this.netzkeLoadComponent({name: 'extended_server_caller', container: this, append: true, callback: function(el){this.getLayout().setActiveItem(el)}, scope: this});
     }
   JS
-end
+end

data/test/core_test_app/app/components/component_loader.rb

@@ -1,139 +1,59 @@
 # TODO: some functionality (one that is calling doNothing) does not belong here, as it loads no componens, but rather to ServerCaller. Move it there.
 class ComponentLoader < Netzke::Base
-  component :simple_component, :title => "Simple Component", :lazy_loading => true
-
-  component :component_loaded_in_window, {
-    :class_name => "SimpleComponent",
-    :title => "Component loaded in window",
-    :lazy_loading => true
-  }
-
-  component :window_with_simple_component, {
-    :class_name => "SimpleWindow",
-    :width => 400,
-    :height => 300,
-    :items => [{
-      :class_name => "SimpleComponent",
-      :title => "Simple Component Inside Window"
-    }],
-    :lazy_loading => true
-  }
-
-  component :some_composite, :lazy_loading => true
-
-  # this action is using loadNetzkeComponent "special" callback
-  js_method :on_load_with_feedback, <<-JS
-    function(){
-      this.loadNetzkeComponent({name: 'simple_component', callback: function(){
-        this.setTitle("Callback" + " invoked!");
-      }, scope: this});
-    }
-  JS
-
-  # this action is using generic endpoint callback
-  action :load_with_generic_callback
-  js_method :on_load_with_generic_callback, <<-JS
-    function(){
-      this.doNothing({}, function () {
-        this.setTitle("Generic callback invoked!");
-      });
-    }
-  JS
-
-  # this action is using generic endpoint callback with scope
-  action :load_with_generic_callback_and_scope
-  js_method :on_load_with_generic_callback_and_scope, <<-JS
-    function(){
-      var that=this;
-      var fancyScope={
-        setFancyTitle: function () {
-          that.setTitle("Fancy title set!");
-        }
-      };
-      this.doNothing({}, function () {
-        this.setFancyTitle();
-      }, fancyScope);
-    }
-  JS
-
-  endpoint :do_nothing do |params|
-    # here be tumbleweed
-#    {}
+  js_configure do |c|
+    c.mixin
   end
 
-  action :load_component
+  component :simple_component
 
-  action :load_in_window
+  component :component_loaded_in_window do |c|
+    c.klass = SimpleComponent
+    c.title = "Component loaded in window"
+  end
+
+  component :window_with_simple_component do |c|
+    c.width = 400
+    c.height = 300
+  end
+
+  component :some_composite
 
+  component :inaccessible do |c|
+    c.klass = Netzke::Core::Panel
+    c.excluded = true
+  end
+
+
+  # this action is using netzkeLoadComponent "special" callback
   action :load_with_feedback
 
+  action :load_component
+
+  action :load_in_window
+
   action :load_window_with_simple_component
 
   action :load_composite
 
   action :load_with_params
 
-  action :non_existing_component, :text => "Non-existing component"
-
-  js_properties(
-    :title => "Component Loader",
-    :layout => "fit",
-    :bbar => [:load_component.action, :load_in_window.action, :load_with_feedback.action, :load_window_with_simple_component.action, :load_composite.action, :load_with_params.action, :load_with_generic_callback.action, :load_with_generic_callback_and_scope.action, :non_existing_component.action]
-  )
-
-  js_method :on_load_window_with_simple_component, <<-JS
-    function(params){
-      this.loadNetzkeComponent({name: "window_with_simple_component", callback: function(w){
-        w.show();
-      }});
-    }
-  JS
-
-  js_method :on_load_composite, <<-JS
-    function(params){
-      this.loadNetzkeComponent({name: "some_composite", container: this});
-    }
-  JS
-
-  js_method :on_load_with_params, <<-JS
-    function(params){
-      this.loadNetzkeComponent({name: "simple_component", params: {html: "Simple Component" + " with changed HTML"}, container: this});
-    }
-  JS
-
-  js_method :on_load_component, <<-JS
-    function(){
-      this.loadNetzkeComponent({name: 'simple_component', container: this});
-    }
-  JS
-
-  js_method :on_non_existing_component, <<-JS
-    function(){
-      this.loadNetzkeComponent({name: 'non_existing_component', container: this});
-    }
-  JS
-
-  js_method :on_load_in_window, <<-JS
-    function(){
-      var w = new Ext.window.Window({
-        width: 500, height: 400, modal: false, layout:'fit', title: 'A window'
-      });
-      w.show();
-      this.loadNetzkeComponent({name: 'component_loaded_in_window', container: w});
-    }
-  JS
-
-  def deliver_component_endpoint(params)
+  action :config_only
+
+  action :non_existing_component do |a|
+    a.text = "Non-existing component"
+  end
+
+  action :inaccessible
+
+  def configure(c)
+    super
+    c.bbar = [:load_component, :load_in_window, :load_with_feedback, :load_window_with_simple_component, :load_composite, :load_with_params, :non_existing_component, :inaccessible, :config_only]
+  end
+
+  endpoint :deliver_component do |params, this|
     if params[:name] == "simple_component" && params[:html]
       components[:simple_component].merge!(:html => params[:html])
     end
-    super
+    super(params, this)
   end
-
-  # For visual testing purposes
-  # def deliver_component_endpoint(params)
-  #   sleep 2
-  #   super
-  # end
-
 end

data/test/core_test_app/app/components/component_loader/javascripts/component_loader.js

@@ -0,0 +1,49 @@
+{
+  title: "Component Loader",
+  layout: "fit",
+
+  onLoadComponent: function(){
+    this.netzkeLoadComponent('simple_component');
+  },
+
+  onLoadWithFeedback: function(){
+    this.netzkeLoadComponent('simple_component', {callback: function() { this.setTitle("Callback" + " invoked!"); }, scope: this});
+  },
+
+  onLoadWindowWithSimpleComponent: function(params){
+    this.netzkeLoadComponent('window_with_simple_component', {callback: function(w){ w.show(); }});
+  },
+
+  onLoadComposite: function(params){
+    this.netzkeLoadComponent('some_composite');
+  },
+
+  onLoadWithParams: function(params){
+    this.netzkeLoadComponent("simple_component", {params: {html: "Simple Component" + " with changed HTML"}, container: this});
+  },
+
+  onNonExistingComponent: function(){
+    this.netzkeLoadComponent('non_existing_component');
+  },
+
+  onLoadInWindow: function(){
+    var w = new Ext.window.Window({
+      width: 500, height: 400, modal: false, layout:'fit', title: 'A window'
+    });
+    w.show();
+    this.netzkeLoadComponent('component_loaded_in_window', {container: w});
+  },
+
+  onInaccessible: function() {
+    this.netzkeLoadComponent('inaccessible');
+  },
+
+  onConfigOnly: function() {
+    this.netzkeLoadComponent('simple_component', {configOnly: true, callback: function(config) {
+      this.removeAll();
+      config.title = config.title + " (overridden)";
+      var instance = Ext.ComponentManager.create(config);
+      this.add(instance);
+    }, scope: this});
+  }
+}

data/test/core_test_app/app/components/component_with_actions.rb

@@ -1,59 +1,73 @@
 class ComponentWithActions < Netzke::Base
-  title "Panel that has actions"
-
-  # Define actions as a hash
-  action :another_action, :disabled => true, :text => "Disabled action", :icon => :accept
-
-  # ... or as a block returning hash
-  action :some_action do
-    {:text => "Some Cool Action", :icon => Netzke::Core.icons_uri + "/delete.png"}
+  action :some_action do |a|
+    a.text = "Some Cool Action"
+    a.icon = Netzke::Core.icons_uri + "/tick.png" # specify full icon uri
   end
 
-  # ... or directly as a method
-  def _my_action_action
-    {:text => "Not used"}
+  action :another_action do |a|
+    a.disabled = true
+    a.text = "Disabled action"
+    a.icon = :accept # accept.png icon will be looked for in Netzke::Core.icons_uri
   end
 
+  action :action_with_custom_handler do |c|
+    c.text = "Action with custom handler"
+    c.handler = :custom_action_handler
+  end
 
-  js_property :bbar, [:some_action.action, :another_action.action]
+  action :excluded_action do |c|
+    c.excluded = true
+  end
 
-  js_property :tbar, [{
-    :xtype =>  'buttongroup',
-    :columns => 3,
-    :title => 'A group',
-    :items => [{
-        :text => 'Paste',
-        :scale => 'large',
-        :rowspan => 3, :iconCls => 'add',
-        :iconAlign => 'top',
-        :cls => 'x-btn-as-arrow'
-    },{
-        :xtype => 'splitbutton',
-        :text => 'Menu Button',
-        :scale => 'large',
-        :rowspan => 3,
-        :iconCls => 'add',
-        :iconAlign => 'top',
-        :arrowAlign => 'bottom',
-        :menu => [:some_action.action]
-    },{
-        :xtype => 'splitbutton', :text => 'Cut', :menu => [:another_action.action]
-    }, :another_action.action,
-    {
-        :menu => [:some_action.action], :text => 'Format'
+  def configure(c)
+    super
+    c.title = "Panel that has actions"
+    c.bbar = [:some_action, :another_action, :action_with_custom_handler, :excluded_action]
+    c.tbar = [{
+      :xtype =>  'buttongroup',
+      :columns => 3,
+      :title => 'A group',
+      :items => [{
+          :text => 'Paste',
+          :scale => 'large',
+          :rowspan => 3, :iconCls => 'add',
+          :iconAlign => 'top',
+          :cls => 'x-btn-as-arrow'
+      },{
+          :xtype => 'splitbutton',
+          :text => 'Menu Button',
+          :scale => 'large',
+          :rowspan => 3,
+          icon: uri_to_icon(:anchor), # use uri_to_icon helper to get the full icon uri
+          :arrowAlign => 'bottom',
+          :menu => [:some_action]
+      },{
+          :xtype => 'splitbutton', :text => 'Cut', :menu => [:another_action]
+      }, :another_action,
+      {
+          :menu => [:some_action], :text => 'Format'
+      }]
     }]
-  }]
+  end
 
-  js_method :on_some_action, <<-JS
-    function(){
-      this.update("Some action was triggered");
-    }
-  JS
+  js_configure do |c|
+    c.on_some_action = <<-JS
+      function(){
+        this.update("Some action was triggered");
+        this.netzke.testik();
+      }
+    JS
 
-  js_method :on_another_action, <<-JS
-    function(){
-      this.update("Another action was triggered");
-    }
-  JS
+    c.on_another_action = <<-JS
+      function(){
+        this.update("Another action was triggered");
+      }
+    JS
 
+    c.custom_action_handler = <<-JS
+      function(){
+        this.update("Custom action handler was called");
+      }
+    JS
+  end
 end

data/test/core_test_app/app/components/component_with_custom_css.rb

@@ -1,8 +1,11 @@
 # This component has the header hidden by custom CSS
 class ComponentWithCustomCss < Netzke::Base
-  title "ComponentWithCustomCss"
+  js_configure do |c|
+    c.html = "A component with the body hidden by means of custom CSS"
+    c.title = "ComponentWithCustomCss"
+  end
 
-  js_property :html, "A component with the body hidden by means of custom CSS"
-
-  css_include :custom
-end
+  css_configure do |c|
+    c.require :custom
+  end
+end

data/test/core_test_app/app/components/component_with_js_mixin.rb

@@ -1,11 +1,17 @@
 class ComponentWithJsMixin < Netzke::Base
-  title "ComponentWithJsMixin"
+  js_configure do |c|
+    c.require :extra_one, :extra_two
+    c.mixin :method_set_one, :method_set_two
+    c.mixin # with no parameters, it'll assume :component_with_js_mixin
+  end
 
-  js_include :extra_one, :extra_two
-  js_mixin :method_set_one, :method_set_two
-  js_mixin # with no parameters, it'll assume :component_with_js_mixin
   action :action_one
   action :action_two
   action :action_three
-  js_property :bbar, [:action_one.action, :action_two.action, :action_three.action]
+
+  def configure(c)
+    super
+    c.bbar = [:action_one, :action_two, :action_three]
+    c.title = "ComponentWithJsMixin"
+  end
 end

data/test/core_test_app/app/components/component_with_js_mixin/javascripts/extra_one.js

@@ -1,2 +1,2 @@
 // Some included JS code
-actionOneMessage = "Action " + "One triggered!";
+actionOneMessage = "Action " + "One triggered!";

data/test/core_test_app/app/components/component_with_js_mixin/javascripts/extra_two.js

@@ -1,2 +1,2 @@
 // Some included JS code
-actionTwoMessage = "Action " + "Two triggered!";
+actionTwoMessage = "Action " + "Two triggered!";

data/test/core_test_app/app/components/component_with_js_mixin/javascripts/method_set_one.js

@@ -1,5 +1,5 @@
-// Some comments should be ok here
 {
+  // Some comments should be fine here
   onActionTwo: function() {
     this.setTitle(actionTwoMessage);
   }

data/test/core_test_app/app/components/component_with_nested_through.rb

@@ -19,10 +19,10 @@ class ComponentWithNestedThrough < Netzke::Base
 
   js_method :on_gear, <<-JS
     function(){
-      this.loadNetzkeComponent({name: 'some_window', callback: function(w){
+      this.netzkeLoadComponent({name: 'some_window', callback: function(w){
         w.show();
       }});
     }
   JS
 
-end
+end