Class: Isomorfeus::TopLevel

Inherits:
Object show all
Defined in:
lib/isomorfeus/top_level.rb,
lib/isomorfeus/top_level_ssr.rb

Class Attribute Summary collapse

Class Method Summary collapse

Class Attribute Details

.ssr_route_path ⇒ Object

Returns the value of attribute ssr_route_path.



4
5
6
 
# File 'lib/isomorfeus/top_level_ssr.rb', line 4

def ssr_route_path
  @ssr_route_path
end

.transport_ws_url ⇒ Object

Returns the value of attribute transport_ws_url.



5
6
7
 
# File 'lib/isomorfeus/top_level_ssr.rb', line 5

def transport_ws_url
  @transport_ws_url
end

Class Method Details

.mount! ⇒ Object 



4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
 
# File 'lib/isomorfeus/top_level.rb', line 4

def mount!
  Isomorfeus.init
  Isomorfeus::TopLevel.on_ready do
    root_element = `document.querySelector('div[data-iso-root]')`
    Isomorfeus.raise_error(message: "Isomorfeus root element not found!") unless root_element
    component_name = root_element.JS.getAttribute('data-iso-root')
    Isomorfeus.env = root_element.JS.getAttribute('data-iso-env')
    user_sid = root_element.JS.getAttribute('data-iso-usid')
    Isomorfeus.current_user_sid =`JSON.parse(user_sid)` if user_sid
    component = nil
    begin
      component = component_name.constantize
    rescue Exception => e
      `console.warn("Deferring mount: " + #{e.message})`
      @timeout_start = Time.now unless @timeout_start
      if (Time.now - @timeout_start) < 10
        `setTimeout(Opal.Isomorfeus.TopLevel['$mount!'], 100)`
      else
        `console.error("Unable to mount '" + #{component_name} + "'!")`
      end
    end
    if component
      props_json = root_element.JS.getAttribute('data-iso-props')
      props = `Opal.Hash.$new(JSON.parse(props_json))`
      raw_hydrated = root_element.JS.getAttribute('data-iso-hydrated')
      hydrated = (raw_hydrated && raw_hydrated == "true")
      #state_json = root_element.JS.getAttribute('data-iso-state')
      #if state_json
        %x{
          if (global.ServerSideRenderingStateJSON) {
          var state = global.ServerSideRenderingStateJSON;
            var keys = Object.keys(state);
            for(var i=0; i < keys.length; i++) {
              if (Object.keys(state[keys[i]]).length > 0) {
                global.Opal.Isomorfeus.store.native.dispatch({ type: keys[i].toUpperCase(), set_state: state[keys[i]] });
              }
            }
          }
        }
      #end
      Isomorfeus.execute_init_after_store_classes
      begin
        result = Isomorfeus::TopLevel.mount_component(component, props, root_element, hydrated)
        @tried_another_time = false
        result
      rescue Exception => e
        if  !@tried_another_time
          @tried_another_time = true
          `console.warn("Deferring mount: " + #{e.message})`
          `setTimeout(Opal.Isomorfeus.TopLevel['$mount!'], 250)`
        else
          `console.error("Unable to mount '" + #{component_name} + "'! Error: " + #{e.message} + "!")`
          `console.error(#{e.backtrace.join("\n")})`
       end
      end
    end
  end
end

.mount_component(component, props, element_or_query, hydrated = false) ⇒ Object 



85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
 
# File 'lib/isomorfeus/top_level.rb', line 85

def mount_component(component, props, element_or_query, hydrated = false)
  if `(typeof element_or_query === 'string')` || (`(typeof element_or_query.$class === 'function')` && element_or_query.class == String)
    element = `document.body.querySelector(element_or_query)`
  elsif `(typeof element_or_query.$is_a === 'function')` && element_or_query.is_a?(Browser::Element)
    element = element_or_query.to_n
  else
    element = element_or_query
  end

  top = if hydrated
          ReactDOM.hydrate(React.create_element(component, props), element)
        else
          ReactDOM.render(React.create_element(component, props), element)
        end
  Isomorfeus.top_component = top if top
end

.on_ready(&block) ⇒ Object 



63
64
65
66
67
68
69
70
71
72
73
74
75
 
# File 'lib/isomorfeus/top_level.rb', line 63

def on_ready(&block)
  %x{
    function run() { block.$call() };
    function ready_fun(fn) {
      if (document.readyState === "complete" || document.readyState === "interactive") {
        setTimeout(fn, 1);
      } else {
        document.addEventListener("DOMContentLoaded", fn);
      }
    }
    ready_fun(run);
  }
end

.on_ready_mount(component, props = nil, element_query = nil) ⇒ Object 



77
78
79
80
81
82
83
 
# File 'lib/isomorfeus/top_level.rb', line 77

def on_ready_mount(component, props = nil, element_query = nil)
  # init in case it hasn't been run yet
  Isomorfeus.init
  on_ready do
    Isomorfeus::TopLevel.mount_component(component, props, element_query)
  end
end

.render_component_to_static_markup(component_name, props) ⇒ Object 



11
12
13
14
15
16
17
18
19
20
21
22
23
24
 
# File 'lib/isomorfeus/top_level_ssr.rb', line 11

def render_component_to_static_markup(component_name, props)
  component = nil
  %x{
    if (typeof component_name === 'string' || component_name instanceof String) {
      component = component_name.split(".").reduce(function(o, x) {
        return (o !== null && typeof o[x] !== "undefined" && o[x] !== null) ? o[x] : null;
      }, Opal.global)
    } else {
      component = component_name;
    }
  }
  component = Isomorfeus.cached_component_class(component_name) unless component
  ReactDOMServer.render_to_static_markup(React.create_element(component, `Opal.Hash.$new(props)`))
end

.render_component_to_string(component_name, props) ⇒ Object 



26
27
28
29
30
31
32
33
34
35
36
37
38
39
 
# File 'lib/isomorfeus/top_level_ssr.rb', line 26

def render_component_to_string(component_name, props)
  component = nil
  %x{
    if (typeof component_name === 'string' || component_name instanceof String) {
      component = component_name.split(".").reduce(function(o, x) {
        return (o !== null && typeof o[x] !== "undefined" && o[x] !== null) ? o[x] : null;
      }, Opal.global)
    } else {
      component = component_name;
    }
  }
  component = Isomorfeus.cached_component_class(component_name) unless component
  ReactDOMServer.render_to_string(React.create_element(component, `Opal.Hash.$new(props)`))
end