Module: Sinatra::JS::Helpers

Defined in:
lib/sinatra/js.rb

Instance Attribute Summary collapse

Instance Method Summary collapse

Instance Attribute Details

#sinatra_js_custom_codeObject

Returns the value of attribute sinatra_js_custom_code.



279
280
281
# File 'lib/sinatra/js.rb', line 279

def sinatra_js_custom_code
  @sinatra_js_custom_code
end

#sinatra_js_custom_filesObject

Returns the value of attribute sinatra_js_custom_files.



279
280
281
# File 'lib/sinatra/js.rb', line 279

def sinatra_js_custom_files
  @sinatra_js_custom_files
end

Instance Method Details

#js(path = nil, attrs = {}, &block) ⇒ Object Also known as: javascript

Return script tag to path. When a block is passed, a script tag will be created with the yielded value as its contents.

Examples

js do
  "document.write('hi');"
end
# => 

js('jquery') # => 

  <script src="/jquery.js" type="text/javascript" charset="utf-8"></script>

js('/js/jquery-tools.js') # => 

  <script src="/js/jquery-tools.js" type="text/javascript" charset="utf-8"></script>

You can even pass an array of files to the method, which then outputs the <script> tags for each file.

js( ['/js/jquery.js', '/js/jquery.ui'] ) # => 

  <script src="/js/jquery.js" type="text/javascript" charset="utf-8"></script>
  <script src="/js/jquery.ui.js" type="text/javascript" charset="utf-8"></script>


311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
# File 'lib/sinatra/js.rb', line 311

def js(path = nil, attrs = {}, &block) 
  attrs = { :type => 'text/javascript', :charset => "utf-8" }.merge(attrs)
  return tag(:script, yield, attrs) if block_given?
  unless path.nil?
    if path.is_a?(Array)
      out = ''
      path.each do |f|
        fpath = url_for("#{f.sub(/\.js$/,'')}.js") unless remote_asset?(f)
        attrs[:src] = fpath
        out << tag(:script, { :newline => false }.merge(attrs) )
      end
      out
    else
      path = url_for("#{path.sub(/\.js$/,'')}.js") unless remote_asset?(path)
      attrs[:src] = path
      tag(:script, { :newline => false }.merge(attrs) )
    end
  end
end

#js_custom(js = nil, add_jquery_block = nil) ⇒ Object

Outputs given custom JS if provided from within a view, helper method and so on

Examples

js_custom => <script...> var custom  = 'it works'; </script>

You can also add the JQuery document.ready code to the output, by simply adding :jquery_block to the method.

<%= js_custom(:jquery_block) %>

<script type="text/javascript" charset="utf-8">
  $(document).ready( function () {
    // some custom JS code here
  });
</script>


447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
# File 'lib/sinatra/js.rb', line 447

def js_custom(js=nil, add_jquery_block = nil) 
  if js.is_a?(Symbol)
    js = nil
    add_jquery_block = :jquery
  end
  out = ''
  out << js unless js.nil?
  unless @sinatra_js_custom_code.nil?
    @sinatra_js_custom_code.each { |i| out << "        #{i}\n" } 
  end
  if add_jquery_block.nil?
    code_js = out.strip
  else
    code_js = "$(document).ready( function () {\n   #{out.strip}\n  } );"
  end
  out = out.empty? ? 
    '' : %Q[<script type="text/javascript" charset="utf-8">\n#{code_js}\n</script>\n]
end

#js_custom_add(js) ⇒ Object

Adds custom JS to the page load from within a view, helper method and so on

Examples

js_custom_add("window.alert('this works');") => void (output is handled through the :js_custom method)


340
341
342
343
# File 'lib/sinatra/js.rb', line 340

def js_custom_add(js) 
  @sinatra_js_custom_code ||= []
  @sinatra_js_custom_code << js
end

#js_custom_add_file(file, insert_into_html = nil, path = nil) ⇒ Object

Add a custom JS file to the page load from within a view, helper method and so on

Examples

js_custom_add_file(:filename || path to remote file)  => void (output handled through the :js_custom_files method)

# You can also embed the code from a .js file into the head element of a page. NB! path is starting from APP_ROOT/public/

js_custom_add_file('home.js',:insert_into_html) 
  => <script type="text/javascript"..> JS content </script>

You can even give a file system path to embed the styles of a .js file.

js_custom_add_file('home.js',:insert_into_html, '/path/2/some/directory') 
  => <script type="text/javascript"..> Some JS content </script>


364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
# File 'lib/sinatra/js.rb', line 364

def js_custom_add_file(file, insert_into_html = nil, path = nil) 
  if insert_into_html.nil?
    @sinatra_js_custom_files ||= []
    if file.is_a?(Array)
      file.each {|f| @sinatra_js_custom_files << f }
    else
      @sinatra_js_custom_files << file
    end
  else
    # read the file into js_custom_add
    path_js = path.nil? ? self.class.public : path
    file_js = "#{path_js}/#{file.sub('.js','')}.js"
    if test(?f, file_js) 
      js_custom_add(IO.read(file_js))
    else
      err_msg = "ERROR: js_custom_add_file(:insert_into_html) method could NOT find and embed this JS file=[ #{file_js} ]"
      if self.respond_to?(:logger)
        logger.warn(err_msg)
      else
        warn(err_msg)
      end
    end
  end
end

#js_custom_filesObject

Outputs given custom JS files that have been included

Examples

<%= js_custom_files %> => 
  <script src="/js/custom1.js" ...>
  <script src="/js/custom2.js" ...>


476
477
478
479
480
481
482
483
484
485
486
487
488
489
# File 'lib/sinatra/js.rb', line 476

def js_custom_files 
  unless @sinatra_js_custom_files.nil? 
    out = "<!-- custom js files -->\n"
    @sinatra_js_custom_files.each do |file|
      # file = url_for("#{file.to_s.sub(/\.js$/,'')}.js") unless remote_asset?(file)
      file = "#{file.to_s.sub(/\.js$/,'')}.js" unless remote_asset?(file)
      out << js(file)
      # out << %Q[    <script src="#{file}" type="text/javascript" charset="utf-8"></script>\n]
    end
    out << "    <!-- /custom js files -->\n"
  else
    '' # return empty string, it's better than nil in this case 
  end
end

#js_insert_file(path = '', local = nil) ⇒ Object

Simple convenicence method that takes a path to a JS file and inserts its content into the current .js.erb file

Depends upon the settings of the :js_source_files_dir configuration variable defined inside your application. By default it is set to '/$HOME/.alt/css'

Examples

# in your app's routes configurations
get('/js/app.js') do
  content_type 'application/javascript'
  erb('js/app.js'.to_sym, :layout => false)
end

# in views/js/app.js.erb
js_insert_file('min/jquery') => path/2/js/files/min/jquery.js

which inserts the JS code from that file into the output.



415
416
417
418
419
420
421
422
423
424
# File 'lib/sinatra/js.rb', line 415

def js_insert_file(path = '', local = nil ) 
  file_path = local.nil? ? "#{self.class.js_shared_source_files_dir}/#{path}" : path
  file_path = file_path.sub(/\.js$/,'') << ".js"
  if test(?f, file_path)
    content = IO.read(file_path)
  else
    content = "// ERROR: the JS file [#{file_path}] could NOT be found"
  end
  content
end