matestack-ui-core 0.7.2

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

@@ -0,0 +1,6 @@
+%component{dynamic_tag_attributes}
+  %div
+    %div{"v-if": "asyncTemplate == null"}
+      = render_content
+    %div{"v-if": "asyncTemplate != null"}
+      %v-runtime-template{":template":"asyncTemplate"}

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

@@ -0,0 +1,261 @@
+module Matestack::Ui::Core::Component
+  class Dynamic < Trailblazer::Cell
+
+    include ActionView::Helpers::ActiveModelHelper
+    include ActionView::Helpers::ActiveModelInstanceTag
+    include ActionView::Helpers::AssetTagHelper
+    include ActionView::Helpers::AssetUrlHelper
+    include ActionView::Helpers::AtomFeedHelper
+    include ActionView::Helpers::CacheHelper
+    include ActionView::Helpers::CaptureHelper
+    include ActionView::Helpers::CspHelper
+    include ActionView::Helpers::CsrfHelper
+    include ActionView::Helpers::DateHelper
+    include ActionView::Helpers::DebugHelper
+    include ActionView::Helpers::FormHelper
+    include ActionView::Helpers::FormOptionsHelper
+    include ActionView::Helpers::FormTagHelper
+    include ActionView::Helpers::JavaScriptHelper
+    include ActionView::Helpers::NumberHelper
+    include ActionView::Helpers::OutputSafetyHelper
+    include ActionView::Helpers::RecordTagHelper
+    # include ActionView::Helpers::RenderingHelper
+    include ActionView::Helpers::SanitizeHelper
+    include ActionView::Helpers::TagHelper
+    include ActionView::Helpers::TextHelper
+    include ActionView::Helpers::TranslationHelper
+    include ActionView::Helpers::UrlHelper
+    include ::Cell::Haml
+    include Matestack::Ui::Core::ApplicationHelper
+    include Matestack::Ui::Core::ToCell
+
+    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={})
+      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
+    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
+
+    def js_action name, arguments
+      argumentString = arguments.join('", "')
+      argumentString = '"' + argumentString + '"'
+      [name, '(', argumentString, ')'].join("")
+    end
+
+    def navigate_to path
+      js_action("navigateTo", [path])
+    end
+
+    def components(&block)
+      @nodes = Matestack::Ui::Core::ComponentNode.build(self, nil, &block)
+
+      @nodes.each do |key, node|
+        @cells[key] = to_cell(key, node["component_name"], node["config"], node["argument"], node["components"], node["included_config"], node["cached_params"])
+      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
+      end
+      result.join(" ")
+    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/dynamic_without_rerender.haml

@@ -0,0 +1,2 @@
+%component{dynamic_tag_attributes}
+  = render_content

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

@@ -0,0 +1,2 @@
+- @cells.each do |key, cell|
+  = cell.call(:show)

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

@@ -0,0 +1,7 @@
+%component{dynamic_tag_attributes}
+  %div{"id": component_id, "class": @component_class}
+    %div{"v-if": "asyncTemplate == null"}
+      - @cells.each do |key, cell|
+        = cell.call(:show)
+    %div{"v-if": "asyncTemplate != null"}
+      %v-runtime-template{":template":"asyncTemplate"}

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

@@ -0,0 +1,3 @@
+%component{dynamic_tag_attributes}
+  - @cells.each do |key, cell|
+    = cell.call(:show)

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

@@ -0,0 +1 @@
+= render_content

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

@@ -0,0 +1,16 @@
+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
+    end
+
+  end
+end

data/app/concepts/matestack/ui/core/details/details.haml

@@ -0,0 +1,3 @@
+%details{@tag_attributes}
+  - if block_given?
+    = yield

data/app/concepts/matestack/ui/core/details/details.rb

@@ -0,0 +1,5 @@
+module Matestack::Ui::Core::Details
+  class Details < Matestack::Ui::Core::Component::Static
+
+  end
+end

data/app/concepts/matestack/ui/core/div/div.haml

@@ -0,0 +1,3 @@
+%div{@tag_attributes}
+  - if block_given?
+    = yield

data/app/concepts/matestack/ui/core/div/div.rb

@@ -0,0 +1,5 @@
+module Matestack::Ui::Core::Div
+  class Div < Matestack::Ui::Core::Component::Static
+
+  end
+end

data/app/concepts/matestack/ui/core/footer/footer.haml

@@ -0,0 +1,3 @@
+%footer{@tag_attributes}
+  - if block_given?
+    = yield

data/app/concepts/matestack/ui/core/footer/footer.rb

@@ -0,0 +1,5 @@
+module Matestack::Ui::Core::Footer
+  class Footer < Matestack::Ui::Core::Component::Static
+
+  end
+end

data/app/concepts/matestack/ui/core/form/form.haml

@@ -0,0 +1,2 @@
+%form{@tag_attributes}
+  = yield

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

@@ -0,0 +1,136 @@
+import Vue from 'vue/dist/vue.esm'
+import Vuex from 'vuex'
+import axios from 'axios'
+
+import matestackEventHub from 'js/event-hub'
+
+import componentMixin from 'component/component'
+
+const componentDef = {
+  mixins: [componentMixin],
+  data: function(){
+    return {
+      data: {},
+      showInlineForm: false,
+      errors: {}
+    }
+  },
+  methods: {
+    initDataKey: function(key, initValue){
+      this.data[key] = initValue;
+    },
+    inputChanged: function(key){
+      this.resetErrors(key)
+    },
+    updateFormValue: function(key, value){
+      this.data[key] = value;
+    },
+    resetErrors: function(key){
+      if (this.errors[key]){
+        this.errors[key] = null;
+      }
+    },
+    launchInlineForm: function(key, value){
+      this.showInlineForm = true;
+      this.data[key] = value;
+      const self = this;
+      setTimeout(function () {
+        self.$refs.inlineinput.focus();
+      }, 300);
+    },
+    closeInlineForm: function(){
+      this.showInlineForm = false;
+    },
+    setProps: function(flat, newVal){
+       for(var i in flat){
+         if((typeof flat[i] === "object") && !(flat[i] instanceof Array)){
+           setProps(flat[i], newVal);
+           return;
+         } else {
+           flat[i] = newVal;
+         }
+      }
+    },
+    initValues: function(){
+      let self = this;
+      let data = {}
+      for (let key in self.$refs) {
+        let initValue = self.$refs[key]["attributes"]["init-value"]
+        let valueType = self.$refs[key]["attributes"]["value-type"]
+
+        if (key.startsWith("input.")){
+          if(initValue){
+            data[key.replace('input.', '')] = initValue["value"]
+          }else{
+            data[key.replace('input.', '')] = null
+          }
+        }
+        if (key.startsWith("select.")){
+          if (key.startsWith("select.multiple.")){
+            if(initValue){
+              data[key.replace('select.multiple.', '')] = JSON.parse(initValue["value"])
+            }else{
+              data[key.replace('select.multiple.', '')] = []
+            }
+          }else{
+            if(initValue){
+              if(valueType && valueType["value"] == "Integer")
+                data[key.replace('select.', '')] = parseInt(initValue["value"])
+              else{
+                data[key.replace('select.', '')] = initValue["value"]
+              }
+            }else{
+              data[key.replace('select.', '')] = null
+            }
+          }
+
+        }
+      }
+      self.data = data;
+    },
+    perform: function(){
+      const self = this
+      let payload = {}
+      payload[self.componentConfig["for"]] = self.data
+      axios({
+        method: self.componentConfig["method"],
+        url: self.componentConfig["submit_path"],
+        data: payload,
+        headers: {
+          'X-CSRF-Token': document.getElementsByName("csrf-token")[0].getAttribute('content')
+        }
+      })
+      .then(function(response){
+        if (self.componentConfig["success"] != undefined && self.componentConfig["success"]["emit"] != undefined) {
+          matestackEventHub.$emit(self.componentConfig["success"]["emit"], response.data);
+        }
+        if (self.componentConfig["success"] != undefined && self.componentConfig["success"]["transition"] != undefined && self.$store != undefined) {
+          let path = self.componentConfig["success"]["transition"]["path"]
+          self.$store.dispatch('navigateTo', {url: path, backwards: false})
+        }
+        self.setProps(self.data, null);
+        self.initValues()
+        self.showInlineForm = false;
+      })
+      .catch(function(error){
+        if(error.response && error.response.data && error.response.data.errors){
+          self.errors = error.response.data.errors;
+        }
+        if (self.componentConfig["failure"] != undefined && self.componentConfig["failure"]["emit"] != undefined) {
+          matestackEventHub.$emit(self.componentConfig["failure"]["emit"], error.response.data);
+        }
+        if (self.componentConfig["failure"] != undefined && self.componentConfig["failure"]["transition"] != undefined && self.$store != undefined) {
+          let path = self.componentConfig["failure"]["transition"]["path"]
+          self.$store.dispatch('navigateTo', {url: path, backwards: false})
+        }
+      })
+    }
+  },
+  mounted: function(){
+    this.initValues()
+  }
+}
+
+let component = Vue.component('matestack-ui-core-form', componentDef)
+
+export default componentDef