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

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

@@ -1,32 +1,45 @@
 module Matestack::Ui::Core::Action
   class Action < Matestack::Ui::Core::Component::Dynamic
+    vue_js_component_name 'matestack-ui-core-action'
+
+    optional :path, :success, :failure, :notify, :confirm, 
+      method: { as: :action_method }, params: { as: :action_params }
 
     def setup
       @component_config[:action_path] = action_path
-      @component_config[:method] = options[:method]
-      @component_config[:success] = options[:success]
-      unless options[:success].nil?
-        unless options[:success][:transition].nil?
-          @component_config[:success][:transition][:path] = transition_path options[:success]
+      @component_config[:method] = action_method
+      @component_config[:success] = success
+      unless success.nil?
+        unless success[:transition].nil?
+          @component_config[:success][:transition][:path] = transition_path success
+        end
+        unless success[:redirect].nil?
+          @component_config[:success][:redirect][:path] = redirect_path success
         end
       end
-      @component_config[:failure] = options[:failure]
-      unless options[:failure].nil?
-        unless options[:failure][:transition].nil?
-          @component_config[:failure][:transition][:path] = transition_path options[:failure]
+      @component_config[:failure] = failure
+      unless failure.nil?
+        unless failure[:transition].nil?
+          @component_config[:failure][:transition][:path] = transition_path failure
+        end
+        unless failure[:redirect].nil?
+          @component_config[:failure][:redirect][:path] = redirect_path failure
         end
       end
-      if options[:notify].nil?
+      if notify.nil?
         @component_config[:notify] = true
       end
+      if @component_config[:confirm] = confirm
+        @component_config[:confirm_text] = confirm.try(:[], :text) || "Are you sure?"
+      end
     end
 
     def action_path
       begin
-        if options[:path].is_a?(Symbol)
-          return ::Rails.application.routes.url_helpers.send(options[:path], options[:params])
+        if path.is_a?(Symbol)
+          return ::Rails.application.routes.url_helpers.send(path, action_params)
         else
-          return options[:path]
+          return path
         end
       rescue
         raise "Action path not found"
@@ -48,5 +61,20 @@ module Matestack::Ui::Core::Action
       end
     end
 
+    def redirect_path callback_options
+      begin
+        if callback_options[:redirect][:path].is_a?(Symbol)
+          return ::Rails.application.routes.url_helpers.send(
+            callback_options[:redirect][:path],
+            callback_options[:redirect][:params]
+          )
+        else
+          return callback_options[:redirect][:path]
+        end
+      rescue
+        raise "Redirect path not found"
+      end
+    end
+
   end
 end

data/app/concepts/matestack/ui/core/{component/response_dynamic.haml → actionview/dynamic.haml}

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

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

@@ -0,0 +1,28 @@
+module Matestack::Ui::Core::Actionview
+  class Dynamic < Matestack::Ui::Core::Component::Dynamic
+
+    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::SanitizeHelper
+    include ActionView::Helpers::TagHelper
+    include ActionView::Helpers::TextHelper
+    include ActionView::Helpers::TranslationHelper
+    include ActionView::Helpers::UrlHelper
+
+  end
+end

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

@@ -0,0 +1,28 @@
+module Matestack::Ui::Core::Actionview
+  class Static < Matestack::Ui::Core::Component::Static
+
+    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::SanitizeHelper
+    include ActionView::Helpers::TagHelper
+    include ActionView::Helpers::TextHelper
+    include ActionView::Helpers::TranslationHelper
+    include ActionView::Helpers::UrlHelper
+
+  end
+end

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

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

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

@@ -1,5 +1,5 @@
 module Matestack::Ui::Core::Address
   class Address < Matestack::Ui::Core::Component::Static
-
+    optional :text
   end
 end

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

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

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

@@ -1,7 +1,8 @@
 import Vue from 'vue/dist/vue.esm'
-import axios from 'axios'
 import VRuntimeTemplate from "v-runtime-template"
 import Vuex from 'vuex'
+import isNavigatingToAnotherPage from "./location"
+import matestackEventHub from '../js/event-hub'
 
 const componentDef = {
   props: ['appConfig', 'params'],
@@ -10,18 +11,31 @@ const componentDef = {
   },
   computed: Vuex.mapState({
     asyncTemplate: state => state.pageTemplate,
+    currentPathName: state => state.currentPathName,
+    currentSearch: state => state.currentSearch,
+    currentOrigin: state => state.currentOrigin,
   }),
   mounted: function(){
     const self = this;
-    window.onpopstate = function(event) {
-      self.$store.dispatch("navigateTo", {url: document.location.pathname, backwards: true} );
-    }
+    window.addEventListener("popstate", (event) => {
+      if (isNavigatingToAnotherPage({
+          origin: self.currentOrigin,
+          pathName: self.currentPathName,
+          search: self.currentSearch
+        }, document.location)){
+          matestackEventHub.$emit("page_loading_triggered", document.location.pathname + document.location.search);
+          this.$store.commit('setPageLoading', true);
+          self.$store.dispatch("navigateTo", { url: document.location.pathname + document.location.search, backwards: true } );
+      }
+    })
   },
   components: {
     VRuntimeTemplate: VRuntimeTemplate
   }
 }
 
+
+
 let component = Vue.component('matestack-ui-core-app', componentDef)
 
 export default componentDef

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

@@ -1,98 +1,51 @@
 module Matestack::Ui::Core::App
-  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
+  # TODO: Similar to page, App doesn't need everything base offers atm
+  class App < Matestack::Ui::Core::Component::Base
+    include Matestack::Ui::Core::Cell
     include Matestack::Ui::Core::ApplicationHelper
-    include Matestack::Ui::Core::ToCell
-    # include ::Rails.application.routes.url_helpers
+    # include Matestack::Ui::Core::ToCell
+    include Matestack::Ui::Core::HasViewContext
 
-    view_paths << "#{Matestack::Ui::Core::Engine.root}/app/concepts"
+    def initialize(page_class, controller_instance, context)
+      super(nil, context: context)
 
-    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
-    end
-
-    def self.views_dir
-      return ""
+      @page_class = page_class
+      @controller_instance = controller_instance
     end
 
-    def initialize(model=nil, options={})
-      super
-      @nodes = {}
-      @cells = {}
-      @page_block = nil
-      @page_id = ""
-      setup
+    def show
+      render :app
     end
 
-    def setup
-      true
+    # Default "response" for just rendering the page without a more
+    # sophisticated app being supplied
+    def response
+      page_content
     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 = Matestack::Ui::Core::AppNode.build(self, &block)
-
-      @nodes.each do |key, node|
-        @cells[key] = to_cell(key, node["component_name"], node["config"], node["argument"], node["components"], nil, node["cached_params"])
+    # new alternative method name to be used in app defentions
+    # slots may contain a loading state element will be rendered during form start to finish of a transition
+    def yield_page slots: {}
+      page_content_wrapper slots: slots do
+        add_child @page_class,
+                  controller_instance: @controller_instance,
+                  context: context
       end
     end
 
-    def partial(&block)
-      Matestack::Ui::Core::AppNode.build(self, &block)
+    def page_content slots: {}
+      yield_page slots: slots
     end
 
+
+    # def page_content loading_state_element_slot: nil
+    #   # TODO: Content probably needs/would benefit from a better name - like "DynamicWrapper" ?
+    #   context[:loading_state_element_slot] = loading_state_element_slot
+    #   add_child Matestack::Ui::Core::Page::Content, context: context do
+    #     add_child @page_class,
+    #               controller_instance: @controller_instance,
+    #               context: context
+    #   end
+    # end
   end
 end

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

@@ -0,0 +1,9 @@
+const isNavigatingToAnotherPage = function(currentLocation, targetLocation) {
+
+  // omits hash by design
+  return currentLocation.pathName !== targetLocation.pathname ||
+    currentLocation.origin !== targetLocation.origin ||
+    currentLocation.search !== targetLocation.search
+}
+
+export default isNavigatingToAnotherPage

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

@@ -1,25 +1,52 @@
 import Vue from 'vue/dist/vue.esm'
 import Vuex from 'vuex'
 import axios from 'axios'
-import matestackEventHub from 'js/event-hub'
+import matestackEventHub from '../js/event-hub'
 
 Vue.use(Vuex)
 
 const store = new Vuex.Store({
   state: {
     pageTemplate: null,
-    currentPath: document.location.pathname
+    pageLoading: false,
+    currentPathName: document.location.pathname,
+    currentSearch: document.location.search,
+    currentOrigin: document.location.origin
   },
   mutations: {
     setPageTemplate (state, serverResponse){
       state.pageTemplate = serverResponse
     },
-    setCurrentPath (state, path){
-      state.currentPath = path
+    setPageLoading (state, boolean){
+      state.pageLoading = boolean
+    },
+    setCurrentLocation (state, current){
+      state.currentPathName = current.path
+      state.currentSearch = current.search
+      state.currentOrigin = current.origin
+    },
+    resetPageTemplate (state) {
+      state.pageTemplate = null;
+    },
+    pageScrollTop (state) {
+      //https://stackoverflow.com/a/35940276/13886137
+      const getScrollParent = function(node) {
+        if (node == null) {
+          return null
+        }
+        if (node.scrollHeight > node.clientHeight) {
+          return node
+        } else {
+          return getScrollParent(node.parentNode)
+        }
+      }
+      getScrollParent(document.getElementsByClassName("matestack-page-root")[0]).scrollTop = 0
     }
   },
   actions: {
     navigateTo ({ commit, state }, { url, backwards }) {
+      const self = this
+      commit('setPageLoading', true)
       matestackEventHub.$emit("page_loading", url);
       if (typeof matestackUiCoreTransitionStart !== 'undefined') {
         matestackUiCoreTransitionStart(url);
@@ -44,9 +71,11 @@ const store = new Vuex.Store({
             window.history.pushState({matestackApp: true, url: url}, null, url);
           }
           setTimeout(function () {
-            resolve(response["data"])
+            resolve(response["data"]);
             commit('setPageTemplate', response["data"])
-            commit('setCurrentPath', url)
+            commit('setCurrentLocation', { path: url.split("?")[0], search: document.location.search, origin: document.location.origin })
+            commit('setPageLoading', false)
+            commit('pageScrollTop')
             matestackEventHub.$emit("page_loaded", url);
             if (typeof matestackUiCoreTransitionSuccess !== 'undefined') {
               matestackUiCoreTransitionSuccess(url);

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

@@ -0,0 +1 @@
+%area{@tag_attributes}

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

@@ -0,0 +1,20 @@
+module Matestack::Ui::Core::Area
+  class Area < Matestack::Ui::Core::Component::Static
+    optional :alt, :coords, :download, :href, :hreflang, :media, :rel, :shape, :target, :type
+    
+    def setup
+      @tag_attributes.merge!({
+        alt: alt,
+        coords: coords.join(','),
+        download: download,
+        href: href,
+        hreflang: hreflang,
+        media: media,
+        rel: rel,
+        shape: shape,
+        target: target,
+        type: type
+      })
+    end
+  end
+end