matestack-ui-core 0.6.0

data/app/concepts/action/view/action.haml

@@ -0,0 +1,3 @@
+%a{"@click.prevent": "perform", "href": action_path}
+  - if block_given?
+    = yield

data/app/concepts/app/cell/app.rb

@@ -0,0 +1,76 @@
+module App::Cell
+  class App < 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 Shared::Utils::ToCell
+    # include ::Rails.application.routes.url_helpers
+
+    view_paths << "#{Matestack::Ui::Core::Engine.root}/app/concepts"
+
+    def initialize(model=nil, options={})
+      super
+      @nodes = {}
+      @cells = {}
+      @page_block = nil
+      @page_id = ""
+      setup
+    end
+
+    def setup
+      true
+    end
+
+    def prepare
+      true
+    end
+
+    def show(page_id, page_nodes, &block)
+      @page_id = page_id
+      @page_nodes = page_nodes
+      prepare
+      response
+      render(view: :app, &block)
+    end
+
+    def page_nodes
+      @page_nodes
+    end
+
+    def components(&block)
+      @nodes = ::App::Utils::AppNode.build(self, &block)
+
+      @nodes.each do |key, node|
+        @cells[key] = to_cell(key, node["component_name"], node["config"], node["argument"], node["components"], nil)
+      end
+    end
+
+    def partial(&block)
+      ::App::Utils::AppNode.build(self, &block)
+    end
+
+  end
+end

data/app/concepts/app/js/app.js

@@ -0,0 +1,27 @@
+import Vue from 'vue/dist/vue.esm'
+import axios from 'axios'
+import VRuntimeTemplate from "v-runtime-template"
+import Vuex from 'vuex'
+
+const componentDef = {
+  props: ['appConfig', 'params'],
+  data: function(){
+    return {}
+  },
+  computed: Vuex.mapState({
+    asyncTemplate: state => state.pageTemplate,
+  }),
+  mounted: function(){
+    const self = this;
+    window.onpopstate = function(event) {
+      self.$store.dispatch("navigateTo", {url: document.location.pathname, backwards: true} );
+    }
+  },
+  components: {
+    VRuntimeTemplate: VRuntimeTemplate
+  }
+}
+
+let component = Vue.component('app-cell', componentDef)
+
+export default componentDef

data/app/concepts/app/js/store.js

@@ -0,0 +1,71 @@
+import Vue from 'vue/dist/vue.esm'
+import Vuex from 'vuex'
+import axios from 'axios'
+
+import matestackEventHub from 'core/js/event-hub'
+
+Vue.use(Vuex)
+
+const store = new Vuex.Store({
+  state: {
+    pageTemplate: null,
+    currentPath: document.location.pathname
+  },
+  mutations: {
+    setPageTemplate (state, serverResponse){
+      state.pageTemplate = serverResponse
+    },
+    setCurrentPath (state, path){
+      state.currentPath = path
+    }
+  },
+  actions: {
+    navigateTo ({ commit, state }, { url, backwards }) {
+      matestackEventHub.$emit("page_loading", url);
+      if (typeof matestackUiCoreTransitionStart !== 'undefined') {
+        matestackUiCoreTransitionStart(url);
+      }
+      if (!window.history.pushState) {
+        document.location.href = url;
+        return;
+      }
+      return new Promise((resolve, reject) => {
+        axios({
+          method: "get",
+          url: url,
+          headers: {
+            'X-CSRF-Token': document.getElementsByName("csrf-token")[0].getAttribute('content')
+          },
+          params: {"only_page": true}
+        })
+        .then(function(response){
+          if (backwards){
+            window.history.replaceState({matestackApp: true, url: url}, null, url);
+          } else {
+            window.history.pushState({matestackApp: true, url: url}, null, url);
+          }
+          setTimeout(function () {
+            resolve(response["data"])
+            commit('setPageTemplate', response["data"])
+            commit('setCurrentPath', url)
+            matestackEventHub.$emit("page_loaded", url);
+            if (typeof matestackUiCoreTransitionSuccess !== 'undefined') {
+              matestackUiCoreTransitionSuccess(url);
+            }
+          }, 5);
+        })
+        .catch(function(error){
+          setTimeout(function () {
+            resolve(error)
+            matestackEventHub.$emit("page_loading_error", error);
+            if (typeof matestackUiCoreTransitionError !== 'undefined') {
+              matestackUiCoreTransitionError(url);
+            }
+          }, 5);
+        })
+      })
+    }
+  }
+})
+
+export default store

data/app/concepts/app/utils/app_node.rb

@@ -0,0 +1,53 @@
+module App::Utils
+  class AppNode
+
+    def self.build(app_instance, &block)
+      node = AppNode.new(app_instance)
+      node.instance_eval(&block)
+      node.hash
+    end
+
+    attr_reader :hash
+
+    def initialize(app_instance)
+      @hash = {}
+      @node_start_id = 0
+      @app_instance = app_instance
+      app_instance.instance_variables.each do |app_instance_var_key|
+        self.instance_variable_set(app_instance_var_key, app_instance.instance_variable_get(app_instance_var_key))
+      end
+    end
+
+    def method_missing meth, *args, &block
+      begin
+        @app_instance.send(meth, *args, &block)
+      rescue
+        node_id = @node_start_id + 1
+        @node_start_id = node_id
+        current_node = "#{meth}_#{@node_start_id}"
+        @hash[current_node] = {}
+        @hash[current_node]["component_name"] = meth.to_s
+        @hash[current_node]["config"] = {}
+        @hash[current_node]["argument"] = nil
+
+        if meth == :page_content
+          @hash[current_node]["components"] = @app_instance.send(:page_nodes)
+        elsif meth == :partial
+          @hash[current_node]["components"] = @app_instance.send(args.first, *args.drop(1))
+        else
+          if args.first.is_a?(Hash)
+            @hash[current_node]["config"] = args.first
+          else
+            @hash[current_node]["argument"] = args.first
+          end
+
+          if block_given?
+            @hash[current_node]["components"] = AppNode.build(@app_instance, &block)
+          end
+        end
+      end
+
+    end
+
+  end
+end

data/app/concepts/app/view/app.haml

@@ -0,0 +1,4 @@
+%component{"is": "app-cell", "inline-template": true}
+  %div{"class": "matestack_app"}
+    - @cells.each do |key, cell|
+      = cell.call(:show)

data/app/concepts/async/cell/async.rb

@@ -0,0 +1,10 @@
+module Async::Cell
+    class Async < Component::Cell::Dynamic
+
+      def setup
+        @rerender = true
+      end
+
+
+    end
+  end

data/app/concepts/async/js/async.js

@@ -0,0 +1,57 @@
+import Vue from 'vue/dist/vue.esm'
+
+import matestackEventHub from 'core/js/event-hub'
+
+import componentMixin from 'component/js/component'
+
+const componentDef = {
+  mixins: [componentMixin],
+  data: function(){
+    return {
+      showing: true,
+      hide_after_timeout: null,
+      event: {
+        data: {}
+      }
+    }
+  },
+  methods: {
+    show: function(event_data){
+      const self = this
+      this.showing = true
+      this.event.data = event_data
+      if(this.componentConfig["hide_after"] != undefined){
+        self.hide_after_timeout = setTimeout(function () {
+          self.hide()
+        }, parseInt(this.componentConfig["hide_after"]));
+      }
+    },
+    hide: function(){
+      this.showing = false
+      this.event.data = {}
+    }
+  },
+  created: function () {
+    const self = this
+    matestackEventHub.$on(this.componentConfig["rerender_on"], self.rerender)
+    matestackEventHub.$on(this.componentConfig["show_on"], self.show)
+    matestackEventHub.$on(this.componentConfig["hide_on"], self.hide)
+    if(this.componentConfig["show_on"] != undefined){
+      this.showing = false
+    }
+    if(this.componentConfig["hide_on"] != undefined){
+      this.showing = true
+    }
+  },
+  beforeDestroy: function() {
+    const self = this
+    clearTimeout(self.hide_after_timeout)
+    matestackEventHub.$off(this.componentConfig["rerender_on"], self.rerender);
+    matestackEventHub.$off(this.componentConfig["show_on"], self.show);
+    matestackEventHub.$off(this.componentConfig["hide_on"], self.hide);
+  },
+}
+
+let component = Vue.component('async-cell', componentDef)
+
+export default componentDef

data/app/concepts/async/view/async.haml

@@ -0,0 +1,2 @@
+%div{"v-if": "showing"}
+  = yield

data/app/concepts/br/cell/br.rb

@@ -0,0 +1,5 @@
+module Br::Cell
+  class Br < Component::Cell::Static
+
+  end
+end

data/app/concepts/br/view/br.haml

@@ -0,0 +1,5 @@
+- unless options[:times].nil?
+  - options[:times].times do
+    %br
+- else
+  %br

data/app/concepts/button/cell/button.rb

@@ -0,0 +1,5 @@
+module Button::Cell
+  class Button < Component::Cell::Static
+
+  end
+end

data/app/concepts/button/view/button.haml

@@ -0,0 +1,7 @@
+- if options[:text].nil?
+  %button{@tag_attributes}
+    - if block_given?
+      = yield
+- else
+  %button{@tag_attributes}
+    = options[:text]

data/app/concepts/component/cell/dynamic.rb

@@ -0,0 +1,226 @@
+module Component::Cell
+  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 ActionView::Helpers::UrlHelper
+    # include ActionView::Helpers::TranslationHelper
+    include ::Cell::Haml
+    include ::Matestack::Ui::Core::ApplicationHelper
+    include Shared::Utils::ToCell
+
+    view_paths << "#{Matestack::Ui::Core::Engine.root}/app/concepts"
+    view_paths << "#{::Rails.root}/app/matestack"
+
+    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]
+      @rerender = false
+      @options = options
+      generate_component_name
+      generate_children_cells
+      set_tag_attributes
+      validate_options
+      setup
+    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 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 = ::Component::Utils::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"])
+      end
+    end
+
+    def partial(&block)
+      return ::Component::Utils::ComponentNode.build(self, nil, &block)
+    end
+
+    def slot(&block)
+      return ::Component::Utils::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"])
+          end
+        end
+      end
+
+      def generate_component_name
+        name_parts = self.class.name.split("::")
+        module_name = name_parts[0]
+        if module_name == "Components"
+          name_parts.shift
+        end
+        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
+        @component_name = @component_class.gsub("-cell", "")
+      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