matestack-ui-core 0.7.6 → 1.0.0.rc.1

data/app/concepts/matestack/ui/core/component/children.haml

@@ -1,2 +1,2 @@
-- @children_cells.each do |key, cell|
-  = cell.call(:show)
+- @children.each do |child|
+  = child.show

data/app/concepts/matestack/ui/core/component/component.js

@@ -1,59 +1,5 @@
-import Vue from 'vue/dist/vue.esm'
-import axios from 'axios'
-import VRuntimeTemplate from "v-runtime-template"
-import matestackEventHub from '../js/event-hub'
-
 const componentMixin = {
-  props: ['componentConfig', 'params'],
-  data: function(){
-    return {
-      asyncTemplate: null
-    }
-  },
-  methods: {
-    onRerender: function(event){
-      if (this.$el.id === event+"__wrapper"){
-        this.rerender()
-      }
-    },
-    onMatestackUiCoreChannel: function(event){
-      if (this.componentConfig["rerender_on"] == event.message){
-        this.rerender()
-      }
-    },
-    rerender: function(){
-      var self = this;
-      self.params["component_key"] = self.componentConfig["component_key"]
-      axios({
-        method: "get",
-        url: location.pathname + location.search,
-        headers: {
-          'X-CSRF-Token': document.getElementsByName("csrf-token")[0].getAttribute('content')
-        },
-        params: {"component_key": self.componentConfig["component_key"]}
-      })
-      .then(function(response){
-        self.asyncTemplate = response["data"];
-      })
-    },
-    rerenderWith: function(newParams){
-      Object.assign(this.params, newParams);
-      this.rerender()
-    }
-  },
-  created: function () {
-    const self = this
-    matestackEventHub.$on('rerender', self.onRerender)
-    matestackEventHub.$on('MatestackUiCoreChannel', self.onMatestackUiCoreChannel)
-  },
-  beforeDestroy: function() {
-    const self = this
-    matestackEventHub.$off('rerender', self.onRerender);
-    matestackEventHub.$off('MatestackUiCoreChannel', self.onMatestackUiCoreChannel)
-  },
-  components: {
-    VRuntimeTemplate: VRuntimeTemplate
-  }
+  props: ['componentConfig', 'params']
 }
 
 export default componentMixin

data/app/concepts/matestack/ui/core/component/dynamic.haml

@@ -1,5 +1,5 @@
 %component{dynamic_tag_attributes}
-  %div
+  %div{class: "matestack-async-component-wrapper", "v-bind:class": "{ 'loading': loading === true }"}
     %div{"v-if": "asyncTemplate == null"}
       = render_content
     %div{"v-if": "asyncTemplate != null"}

data/app/concepts/matestack/ui/core/component/dynamic.rb

@@ -1,269 +1,46 @@
 module Matestack::Ui::Core::Component
-  class Dynamic < Trailblazer::Cell
-    include Matestack::Ui::Core::Cell
-    include Matestack::Ui::Core::ApplicationHelper
-    include Matestack::Ui::Core::ToCell
-    include Matestack::Ui::Core::HasViewContext
+  class Dynamic < Base
 
-    view_paths << "#{Matestack::Ui::Core::Engine.root}/app/concepts"
-    view_paths << "#{::Rails.root}/app/matestack"
-
-    extend ViewName::Flat
-
-    def self.prefixes
-      _prefixes = super
-      modified_prefixes = _prefixes.map do |prefix|
-        prefix_parts = prefix.split("/")
-
-        if prefix_parts.last.include?(self.name.split("::")[-1].downcase)
-          prefix_parts[0..-2].join("/")
-        else
-          prefix
-        end
-
-      end
-
-      return modified_prefixes + _prefixes
-    end
-
-    def self.views_dir
-      return ""
-    end
-
-    def initialize(model=nil, options={})
+    def initialize(*_args)
       super
-      @component_config = options.except(:context, :children, :url_params, :included_config)
-      @url_params = options[:url_params].except(:action, :controller, :component_key)
-      @component_key = options[:component_key]
-      @children_cells = {}
-      @controller_context = context[:controller_context]
-      @argument = model
-      @static = false
-      @nodes = {}
-      @cells = {}
-      @included_config = options[:included_config]
-      @cached_params = options[:cached_params]
-      @rerender = false
-      @options = options
-      set_tag_attributes
-      setup
-      generate_component_name
-      generate_children_cells
-      validate_options
-    end
-
-    def validate_options
-      if defined? self.class::REQUIRED_KEYS
-        self.class::REQUIRED_KEYS.each do |key|
-          raise "required key '#{key}' is missing" if options[key].nil?
-        end
-      end
-      custom_options_validation
     end
 
-    def custom_options_validation
-      true
+    def show
+      render :dynamic_without_rerender
     end
 
-    def setup
-      true
-    end
-
-    def show(&block)
-      if respond_to? :prepare
-        prepare
-      end
-      if respond_to? :response
-        response &block
-        if @static
-          render :response
-        else
-          if @rerender
-            render :response_dynamic
-          else
-            render :response_dynamic_without_rerender
-          end
-        end
-      else
-        if @static
-          render(view: :static, &block)
-        else
-          if @rerender
-            render(view: :dynamic, &block)
-          else
-            render(view: :dynamic_without_rerender, &block)
-          end
-        end
-      end
-    end
-
-    def render_children
-      render(view: :children)
-    end
-
-    def render_content(&block)
-      if respond_to? :prepare
-        prepare
-      end
-      if respond_to? :response
-        response &block
-          render :response
-      else
-        # render(view: self.class.name.split("::")[-1].downcase.to_sym) do
-        render do
-          render_children
-        end
-      end
-    end
-
-    def component_id
-      options[:id] ||= nil
-    end
+    private
 
-    def js_action name, arguments
-      argumentString = arguments.join('", "')
-      argumentString = '"' + argumentString + '"'
-      [name, '(', argumentString, ')'].join("")
+    def dynamic_tag_attributes
+      attrs = {
+        "is": get_vue_js_name,
+        "ref": component_id,
+        ":params":  params.except(:controller, :action).to_json,
+        ":component-config": @component_config.to_json,
+        "inline-template": true,
+      }
+      attrs.merge!(options[:attributes]) unless options[:attributes].nil?
+      attrs
     end
 
-    def navigate_to path
-      js_action("navigateTo", [path])
+    def get_vue_js_name
+      self.class.vue_js_name
     end
 
-    def components(&block)
-      @nodes = Matestack::Ui::Core::ComponentNode.build(self, nil, &block)
+    class << self
 
-      @nodes.each do |key, node|
-        @cells[key] = to_cell("#{@component_key}__#{key}", node["component_name"], node["config"], node["argument"], node["components"], node["included_config"], node["cached_params"])
+      def inherited(subclass)
+        subclass.vue_js_component_name vue_js_name unless self == Matestack::Ui::Core::Component::Dynamic
       end
-    end
-
-    def partial(&block)
-      return Matestack::Ui::Core::ComponentNode.build(self, nil, &block)
-    end
 
-    def slot(&block)
-      return Matestack::Ui::Core::ComponentNode.build(self, nil, &block)
-    end
-
-    def get_children
-      return options[:children]
-    end
-
-    def to_css_class(symbol)
-      symbol.to_s.gsub("_", "-")
-    end
-
-    def modifiers
-      result = []
-      return unless defined? self.class::OPTIONS
-      self.class::OPTIONS.select{ |modifer_key, modifier_options|
-        modifier_options[:css_modifier] == true
-      }.each do |modifer_key, modifier_options|
-        if !options[modifer_key] == false || modifier_options[:default] == true
-          result << "#{to_css_class(self.class::CSSClASS)}--#{to_css_class(modifer_key)}"
-        end
+      def vue_js_component_name(name)
+        @vue_js_name = name.to_s
       end
-      result.join(" ")
-    end
 
-    def render_child_component component_key, current_search_keys_array
-      if respond_to? :prepare
-        prepare
-      end
-
-      response
-
-      if current_search_keys_array.count > 1
-        if @nodes.dig(*current_search_keys_array) == nil
-          rest = []
-          while @nodes.dig(*current_search_keys_array) == nil
-            rest << current_search_keys_array.pop
-          end
-          node = @nodes.dig(*current_search_keys_array)
-          cell = to_cell(component_key, node["component_name"], node["config"], node["argument"], node["components"], node["included_config"], node["cached_params"])
-          begin
-            return cell.render_child_component component_key, rest.reverse[1..-1]
-          rescue
-            return cell.render_content
-          end
-        else
-          node = @nodes.dig(*current_search_keys_array)
-          cell = to_cell(component_key, node["component_name"], node["config"], node["argument"], node["components"], node["included_config"], node["cached_params"])
-          return cell.render_content
-        end
-      else
-        node = @nodes[current_search_keys_array[0]]
-        cell = to_cell(component_key, node["component_name"], node["config"], node["argument"], node["components"], node["included_config"], node["cached_params"])
-        return cell.render_content
+      def vue_js_name
+        @vue_js_name ||= self.name.split(/(?=[A-Z])/).join("-").downcase.gsub("::", "")
       end
     end
 
-    private
-
-      def generate_children_cells
-        unless options[:children].nil?
-          #needs refactoring --> in some cases, :component_key, :children, :origin_url, :url_params, :included_config get passed into options[:children] which causes errors
-          #quickfix: except them from iteration
-          options[:children].except(:component_key, :children, :origin_url, :url_params, :included_config).each do |key, node|
-            @children_cells[key] = to_cell("#{@component_key}__#{key}", node["component_name"], node["config"], node["argument"], node["components"], node["included_config"], node["cached_params"])
-          end
-        end
-      end
-
-      def generate_component_name
-        name_parts = self.class.name.split("::")
-        module_name = name_parts[0]
-        if module_name == "Components"
-          name_parts[0] = "Custom"
-        end
-        if name_parts.count > 1
-          if name_parts.include?("Cell")
-            name = name_parts[0] + name_parts[1]
-            if name_parts[0] == name_parts[2]
-              name = name_parts[0] + name_parts[1]
-              @component_class =  name.underscore.gsub("_", "-")
-            else
-              name = name_parts[0] + name_parts[2] + name_parts[1]
-              @component_class = name.underscore.gsub("_", "-")
-            end
-          else
-            if name_parts[-2] == name_parts[-1]
-              @component_class = name_parts[0..-2].join("-").downcase
-            else
-              @component_class = name_parts.join("-").downcase
-            end
-          end
-        else
-          name = name_parts[0]
-          @component_class = name.underscore.gsub("_", "-")
-        end
-        @component_name = @component_class
-      end
-
-      def set_tag_attributes
-        default_attributes = {
-          "id": component_id,
-          "class": options[:class]
-         }
-         unless options[:attributes].nil?
-           default_attributes.merge!(options[:attributes])
-         end
-
-         @tag_attributes = default_attributes
-      end
-
-      def dynamic_tag_attributes
-         attrs = {
-           "is": @component_class,
-           "ref": component_id,
-           ":params":  @url_params.to_json,
-           ":component-config": @component_config.to_json,
-           "inline-template": true,
-         }
-         attrs.merge!(options[:attributes]) unless options[:attributes].nil?
-         return attrs
-      end
-
   end
 end

data/app/concepts/matestack/ui/core/component/rerender.rb

@@ -0,0 +1,8 @@
+module Matestack::Ui::Core::Component
+  # NAME PENDING
+  class Rerender < Dynamic
+    def show
+      render :dynamic
+    end
+  end
+end

data/app/concepts/matestack/ui/core/component/static.rb

@@ -1,16 +1,7 @@
 module Matestack::Ui::Core::Component
-  class Static < Matestack::Ui::Core::Component::Dynamic
-
-    def initialize(model=nil, options={})
-      super
-      if options[:dynamic]
-        @static = false
-        @rerender = true
-        @component_class = "anonym-dynamic-component"
-      else
-        @static = true
-      end
+  class Static < Base
+    def show
+      render_content
     end
-
   end
 end

data/app/concepts/matestack/ui/core/form/checkbox/checkbox.rb

@@ -0,0 +1,79 @@
+require_relative '../utils'
+require_relative '../has_input_html_attributes'
+require_relative '../has_errors'
+module Matestack::Ui::Core::Form::Checkbox
+  class Checkbox < Matestack::Ui::Core::Component::Static
+    include Matestack::Ui::Core::Form::Utils
+    include Matestack::Ui::Core::Form::HasInputHtmlAttributes
+    include Matestack::Ui::Core::Form::HasErrors
+
+    requires :key
+    optional :value, :false_value, :multiple, :init, for: { as: :input_for }, label: { as: :input_label }, options: { as: :checkbox_options }
+
+    def response
+      # multiple values
+      if checkbox_options
+        checkbox_options.to_a.each do |item|
+          input html_attributes.merge(
+            attributes: vue_attributes,
+            type: :checkbox,
+            id: "#{id_for_item(item_value(item))}",
+            name: item_name(item),
+            value: item_value(item)
+          )
+          label text: item_name(item), for: id_for_item(item_value(item))
+        end
+        # checked/unchecked checkbox
+      else
+        form_input type: :hidden, key: key, value: (false_value || 0), errors: false
+        form_input type: :checkbox, key: key, value: checked_value, id: id_for_item(value), errors: false
+        label text: input_label, for: id_for_item(value)
+      end
+      render_errors
+    end
+
+    def vue_attributes
+      (options[:attributes] || {}).merge({
+        "@change": change_event,
+        ref: "select.multiple.#{attr_key}",
+        'init-value': init_value,
+        'v-bind:class': "{ '#{input_error_class}': #{error_key} }",
+        'value-type': value_type,
+        "#{v_model_type}": input_key,
+      })
+    end
+
+    def value_type
+      item_value(checkbox_options.first).is_a?(Integer) ? Integer : nil
+    end
+
+    def item_value(item)
+      item.is_a?(Array) ? item.last : item
+    end
+
+    def item_name(item)
+      item.is_a?(Array) ? item.first : item
+    end
+
+    def checked_value
+      value || 1
+    end
+
+    def v_model_type
+      if checkbox_options && checkbox_options.first.is_a?(Integer)
+        'v-model.number'
+      else
+        'v-model'
+      end
+    end
+
+    def change_event
+      "inputChanged('#{attr_key}')"
+    end
+
+    def id_for_item(value)
+      "#{html_attributes[:id]}_#{value}"
+    end
+
+  end
+end