matestack-ui-core 0.7.0 → 0.7.1

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 99d5baa395a0bbd08fb3dd6ba51de334b3408399aa7bde23057fc1e2c6fd7f8a
-  data.tar.gz: 3cc9af9f8129174ae0628119476dc6c4760ffe49d6edca24478afacb74494818
+  metadata.gz: 1b357485aaf4b5a49cc255719c7113ffc12b0d65f540130bfa04d64e8fd9afc9
+  data.tar.gz: e2c691da1526db9e715eecb9609b283d49f7d7edaf30b7fe537d430cca0a7c88
 SHA512:
-  metadata.gz: b998a602726e454b65525852bfe72e7c604c18ac4f9f789afbd0c6321c0cc752ad9837cc4b90da71789080bfc1f672d768d3b1240029e0f4c740e8b72edd7dd8
-  data.tar.gz: acf096659352f4eca3c0f7861e291e3cbe022b8a0cb17c5391163057a60941cceef4cf604c9b3dfc26b8553f8475d466959880ed60116ff28a842985728712f0
+  metadata.gz: 224bb5440913ee5d88d67a9b118652e278a72d1f42d064f9ff89593f35922310533978f3014a86022bca3ec3b6a7f1220f1e5e303d4a771c5cd011792d6aedf7
+  data.tar.gz: b203163b2a42cdc4aa31849f799fa061826dc42509033cfb2fc9aed61f1f101d163bf0bfcf6d18e2a485448bd1b149b3b4e0fd92b6d8627c0d2e71be600292d2

data/README.md

@@ -213,15 +213,7 @@ Changelog can be found [here](./CHANGELOG.md)
 
 ### Roadmap
 
-Scheduled for 0.7.0:
-- Better naming conventions
-- Webpacker/Yarn Integration
-- Advanced Websockets Integration
-- 1:n Relations in Form components
-- More Form Components (Multi Select Components)
-- Component Based Caching
-- Rails View Integration
-- Dockerized Core Development
+We're currently finalizing the roadmap towards to a stable 1.0 release, supposed to happen towards the end of the year! For details make sure to check the [release management project](https://github.com/basemate/matestack-ui-core/projects/2) and get in touch via our [chat](https://gitter.im/basemate/community) for feedback!
 
 ### Community
 

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

@@ -18,8 +18,16 @@ const componentDef = {
   methods: {
     show: function(event_data){
       const self = this
+      if (this.showing === true){
+        return
+      }
       this.showing = true
       this.event.data = event_data
+      if(this.componentConfig["defer"] != undefined){
+        if(!isNaN(this.componentConfig["defer"])){
+          this.startDefer()
+        }
+      }
       if(this.componentConfig["hide_after"] != undefined){
         self.hide_after_timeout = setTimeout(function () {
           self.hide()
@@ -29,6 +37,12 @@ const componentDef = {
     hide: function(){
       this.showing = false
       this.event.data = {}
+    },
+    startDefer: function(){
+      const self = this
+      setTimeout(function () {
+        self.rerender()
+      }, parseInt(this.componentConfig["defer"]));
     }
   },
   created: function () {
@@ -39,8 +53,12 @@ const componentDef = {
     if(this.componentConfig["show_on"] != undefined){
       this.showing = false
     }
-    if(this.componentConfig["hide_on"] != undefined){
-      this.showing = true
+    if(this.componentConfig["defer"] != undefined){
+      if(!isNaN(this.componentConfig["defer"])){
+        if (this.componentConfig["show_on"] == undefined){
+          this.startDefer()
+        }
+      }
     }
   },
   beforeDestroy: function() {

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

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

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

@@ -0,0 +1,9 @@
+module Matestack::Ui::Core::Blockquote
+  class Blockquote < Matestack::Ui::Core::Component::Static
+    def setup
+      @tag_attributes.merge!({
+        "cite": options[:cite]
+      })
+    end
+  end
+end

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

@@ -1,5 +1,11 @@
 module Matestack::Ui::Core::Button
   class Button < Matestack::Ui::Core::Component::Static
 
+    def setup
+      @tag_attributes.merge!({
+        "disabled": options[:disabled] ||= nil
+      })
+    end
+
   end
 end

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

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

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

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

data/app/concepts/matestack/ui/core/collection/content/content.js

@@ -0,0 +1,100 @@
+import Vue from 'vue/dist/vue.esm'
+
+import matestackEventHub from 'js/event-hub'
+import queryParamsHelper from 'js/helpers/query-params-helper'
+
+import componentMixin from 'component/component'
+import asyncMixin from 'async/async'
+
+const componentDef = {
+  mixins: [componentMixin, asyncMixin],
+  data: function(){
+    return {
+      currentLimit: null,
+      currentOffset: null,
+      currentFilteredCount: null,
+      currentBaseCount: null
+    }
+  },
+  methods: {
+    next: function(){
+      if (this.currentTo() < this.currentCount()){
+        this.currentOffset += this.currentLimit
+        var url = queryParamsHelper.updateQueryParams(this.componentConfig["id"] + "-offset", this.currentOffset)
+        window.history.pushState({matestackApp: true, url: url}, null, url);
+        matestackEventHub.$emit(this.componentConfig["id"] + "-update")
+      }
+    },
+    previous: function(){
+      if ((this.currentOffset - this.currentLimit)*-1 != this.currentLimit){
+        if((this.currentOffset - this.currentLimit) < 0){
+          this.currentOffset = 0
+        } else {
+          this.currentOffset -= this.currentLimit
+        }
+        var url = queryParamsHelper.updateQueryParams(this.componentConfig["id"] + "-offset", this.currentOffset)
+        window.history.pushState({matestackApp: true, url: url}, null, url);
+        matestackEventHub.$emit(this.componentConfig["id"] + "-update")
+      }
+    },
+    currentTo: function(){
+      var to = parseInt(this.currentOffset) + parseInt(this.currentLimit)
+      if (to > parseInt(this.currentCount())){
+        return this.currentCount();
+      } else {
+        return to;
+      }
+    },
+    currentCount: function(){
+      if (this.currentFilteredCount != null || this.currentFilteredCount != undefined){
+        return this.currentFilteredCount;
+      } else {
+        return this.currentBaseCount;
+      }
+    },
+    goToPage: function(page){
+      this.currentOffset = parseInt(this.currentLimit) * (parseInt(page)-1)
+      var url = queryParamsHelper.updateQueryParams(this.componentConfig["id"] + "-offset", this.currentOffset)
+      window.history.pushState({matestackApp: true, url: url}, null, url);
+      matestackEventHub.$emit(this.componentConfig["id"] + "-update")
+    }
+  },
+  mounted: function(){
+    if(queryParamsHelper.getQueryParam(this.componentConfig["id"] + "-offset") != null){
+        this.currentOffset = parseInt(queryParamsHelper.getQueryParam(this.componentConfig["id"] + "-offset"))
+    } else {
+      if(this.componentConfig["init_offset"] != undefined){
+        this.currentOffset = this.componentConfig["init_offset"]
+      } else {
+        this.currentOffset = 0
+      }
+    }
+
+    if(queryParamsHelper.getQueryParam(this.componentConfig["id"] + "-limit") != null){
+        this.currentOffset = parseInt(queryParamsHelper.getQueryParam(this.componentConfig["id"] + "-limit"))
+    } else {
+      if(this.componentConfig["init_limit"] != undefined){
+        this.currentLimit = this.componentConfig["init_limit"]
+      } else {
+        this.currentLimit = 10
+      }
+    }
+
+    if(this.componentConfig["filtered_count"] != undefined){
+      this.currentFilteredCount = this.componentConfig["filtered_count"]
+      if(this.currentOffset >= this.currentFilteredCount){
+        this.previous()
+      }
+    }
+    if(this.componentConfig["base_count"] != undefined){
+      this.currentBaseCount = this.componentConfig["base_count"]
+      if(this.currentOffset >= this.currentBaseCount){
+        this.previous()
+      }
+    }
+  }
+}
+
+let component = Vue.component('matestack-ui-core-collection-content', componentDef)
+
+export default componentDef

data/app/concepts/matestack/ui/core/collection/content/content.rb

@@ -0,0 +1,18 @@
+module Matestack::Ui::Core::Collection::Content
+  class Content < Matestack::Ui::Core::Component::Dynamic
+
+    def setup
+      @rerender = true
+      @component_config = @component_config.except(:data, :paginated_data)
+    end
+
+    def response
+      components {
+        div do
+          yield_components
+        end
+      }
+    end
+
+  end
+end

data/app/concepts/matestack/ui/core/collection/content/next/next.haml

@@ -0,0 +1,3 @@
+%a{@tag_attributes, "@click": "next()"}
+  - if block_given?
+    = yield

data/app/concepts/matestack/ui/core/collection/content/next/next.rb

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

data/app/concepts/matestack/ui/core/collection/content/page/link/link.haml

@@ -0,0 +1,3 @@
+%a{@tag_attributes, "@click": "goToPage(#{@options[:page]})"}
+  - if block_given?
+    = yield

data/app/concepts/matestack/ui/core/collection/content/page/link/link.rb

@@ -0,0 +1,5 @@
+module Matestack::Ui::Core::Collection::Content::Page::Link
+  class Link < Matestack::Ui::Core::Component::Static
+
+  end
+end

data/app/concepts/matestack/ui/core/collection/content/previous/previous.haml

@@ -0,0 +1,3 @@
+%a{@tag_attributes, "@click": "previous()"}
+  - if block_given?
+    = yield

data/app/concepts/matestack/ui/core/collection/content/previous/previous.rb

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

data/app/concepts/matestack/ui/core/collection/filter/filter.js

@@ -0,0 +1,50 @@
+import Vue from 'vue/dist/vue.esm'
+
+import matestackEventHub from 'js/event-hub'
+import queryParamsHelper from 'js/helpers/query-params-helper'
+
+import componentMixin from 'component/component'
+
+const componentDef = {
+  mixins: [componentMixin],
+  data: function(){
+    return {
+      filter: {}
+    }
+  },
+  methods: {
+    submitFilter: function(){
+      var url;
+      var filter = this.filter
+      for (var key in this.filter) {
+        url = queryParamsHelper.updateQueryParams(this.componentConfig["id"] + "-filter-" + key, this.filter[key], url)
+      }
+      url = queryParamsHelper.updateQueryParams(this.componentConfig["id"] + "-offset", 0, url)
+      window.history.pushState({matestackApp: true, url: url}, null, url);
+      matestackEventHub.$emit(this.componentConfig["id"] + "-update")
+    },
+    resetFilter: function(){
+      var url;
+      for (var key in this.filter) {
+        url = queryParamsHelper.updateQueryParams(this.componentConfig["id"] + "-filter-" + key, null, url)
+        this.filter[key] = null;
+        this.$forceUpdate();
+      }
+      window.history.pushState({matestackApp: true, url: url}, null, url);
+      matestackEventHub.$emit(this.componentConfig["id"] + "-update")
+    }
+  },
+  created: function(){
+    var self = this;
+    var queryParamsObject = queryParamsHelper.queryParamsToObject()
+    Object.keys(queryParamsObject).forEach(function(key){
+      if (key.startsWith(self.componentConfig["id"] + "-filter-")){
+        self.filter[key.replace(self.componentConfig["id"] + "-filter-", "")] = queryParamsObject[key]
+      }
+    })
+  }
+}
+
+let component = Vue.component('matestack-ui-core-collection-filter', componentDef)
+
+export default componentDef

data/app/concepts/matestack/ui/core/collection/filter/filter.rb

@@ -0,0 +1,17 @@
+module Matestack::Ui::Core::Collection::Filter
+  class Filter < Matestack::Ui::Core::Component::Dynamic
+
+    def setup
+      @component_config = @component_config.except(:data, :paginated_data)
+    end
+
+    def response
+      components {
+        div do
+          yield_components
+        end
+      }
+    end
+
+  end
+end

data/app/concepts/matestack/ui/core/collection/filter/input/input.haml

@@ -0,0 +1,8 @@
+- if [:text, :number, :email, :date, :password].include?(options[:type])
+  %input{"v-model#{'.number' if options[:type] == :number}": input_key,
+    type: options[:type],
+    class: options[:class],
+    id: component_id,
+    "@keyup.enter": "submitFilter()",
+    ref: "filter.#{attr_key}",
+    placeholder: options[:placeholder]}

data/app/concepts/matestack/ui/core/collection/filter/input/input.rb

@@ -0,0 +1,13 @@
+module Matestack::Ui::Core::Collection::Filter::Input
+  class Input < Matestack::Ui::Core::Component::Static
+
+    def input_key
+      'filter["' + options[:key].to_s + '"]'
+    end
+
+    def attr_key
+      return options[:key].to_s
+    end
+
+  end
+end

data/app/concepts/matestack/ui/core/collection/filter/reset/reset.haml

@@ -0,0 +1,3 @@
+%a{@tag_attributes, "@click": "resetFilter()"}
+  - if block_given?
+    = yield

data/app/concepts/matestack/ui/core/collection/filter/reset/reset.rb

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

data/app/concepts/matestack/ui/core/collection/filter/submit/submit.haml

@@ -0,0 +1,3 @@
+%a{@tag_attributes, "@click": "submitFilter()"}
+  - if block_given?
+    = yield

data/app/concepts/matestack/ui/core/collection/filter/submit/submit.rb

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

data/app/concepts/matestack/ui/core/collection/helper.rb

@@ -0,0 +1,114 @@
+module Matestack::Ui::Core::Collection
+
+  CollectionConfig = Struct.new(:id, :init_offset, :init_limit, :filtered_count, :base_count, :data, :context) do
+
+    def paginated_data
+      resulting_data = data
+      resulting_data = resulting_data.offset(get_collection_offset) unless get_collection_offset == 0
+      resulting_data = resulting_data.limit(get_collection_limit) unless get_collection_limit == 0
+
+      return resulting_data
+    end
+
+    def get_collection_offset
+      (context[:params]["#{id}-offset".to_sym] ||= init_offset).to_i
+    end
+
+    def get_collection_limit
+      (context[:params]["#{id}-limit".to_sym] ||= init_limit).to_i
+    end
+
+    def pages
+      offset = get_collection_offset
+      limit = get_collection_limit
+      if filtered_count.present?
+        count = filtered_count
+      else
+        count = base_count
+      end
+      page_count = count/limit
+      page_count += 1 if count%limit > 0
+      return (1..page_count).to_a
+    end
+
+    def from
+      return get_collection_offset + 1 if to > 0
+      return 0 if to == 0
+    end
+
+    def to
+      current_to = get_collection_offset + get_collection_limit
+      if filtered_count.present?
+        if current_to > filtered_count
+          return filtered_count
+        else
+          return current_to
+        end
+      else
+        if current_to > base_count
+          return base_count
+        else
+          return current_to
+        end
+      end
+    end
+
+    def config
+      self.to_h.except(:context)
+    end
+
+  end
+
+
+  module Helper
+
+    def get_collection_filter collection_id, key=nil
+      filter_hash = {}
+      context[:params].each do |param_key, param_value|
+        if param_key.start_with?("#{collection_id}-filter-")
+          param_key.gsub("#{collection_id}-filter-", "")
+          filter_hash[param_key.gsub("#{collection_id}-filter-", "").to_sym] = param_value
+        end
+      end
+      if key.nil?
+        return filter_hash
+      else
+        return filter_hash[key]
+      end
+    end
+
+    def get_collection_order collection_id, key=nil
+      order_hash = {}
+      context[:params].each do |param_key, param_value|
+        if param_key.start_with?("#{collection_id}-order-")
+          param_key.gsub("#{collection_id}-order-", "")
+          order_hash[param_key.gsub("#{collection_id}-order-", "").to_sym] = param_value
+        end
+      end
+      if key.nil?
+        return order_hash
+      else
+        return order_hash[key]
+      end
+    end
+
+    def set_collection id: nil, init_offset: 0, init_limit: nil, base_count: nil, filtered_count: nil, data: nil
+      @collections = {} if @collections.nil?
+
+      collection_config = CollectionConfig.new(
+        id,
+        init_offset,
+        init_limit,
+        filtered_count,
+        base_count,
+        data,
+        context
+      )
+
+      @collections[id.to_sym] = collection_config
+
+      return collection_config
+    end
+
+  end
+end