chardinjs is not working in ruby on rails

Question

Hello I try chardin js website for my project.but some how it is not worked.I am working on rails 3.2.14 and ruby 1.9.3 and chardin js version is 0.1.3, so please help me. Here i attach fiddle link.

Edit: Same things tried on my project(in view). but when i clicked on See it on action image is not appear.

Homes.coffee

$('body').chardinJs()

$('a[data-toggle="chardinjs"]').on 'click', (e) ->
    e.preventDefault()
    if $('.jumbotron img').is(':visible')
        ($('body').data('chardinJs')).toggle()
    else
        $('.jumbotron img').animate height: 250, 600, ->
            ($('body').data('chardinJs')).toggle()

$('body').on 'chardinJs:stop', ->
    $('a.btn.primary').off('click').text('See more on Github')
        .attr('href', 'https://github.com/heelhook/chardin.js')
    $('a#opentour').css display: 'block'

css same as in fiddle

homes/show.html.erb

  <body>
  <div class="container">
  <div class="jumbotron">
  <h1 data-intro="Project title" data-position="right">Chardin.js</h1>
  <p class="lead">
  Simple overlay instructions for your apps.
  </p>
  <img src="http://s11.postimg.org/5j9wr7n8z/chardin.png" data-intro="An awesome 18th-     century painter, who found beauty in everyday, common things." data-position="right" />
  <a id="asdfg" href="#" class="btn btn-large primary" data-toggle="chardinjs" data-intro="This button toggles the overlay, you can click it, even when the overlay is visible" data-position="left">See it in action</a>
  <a href="" id="opentour" class="hide" data-toggle="chardinjs">Or open it again</a>
  <div class="credits">
  <p data-intro="Author of this plugin, aka Pablo Fernandez" data-position="right">
    Baked with
    <b>&lt;3</b>
    by
    <a href="https://github.com/heelhook">@heelhook</a>.
  </p>
  </div>
  </div>
  <div class="links">
  <p id="links" data-intro="Links to Github, Twitter, etc." data-position="top">
  </p>
  </div>
  </div>
  </body>

application.js

//= require jquery
//= require jquery_ujs
//= require chardinjs.min
//= require_tree .

your fiddle misses chardin.js, makes things difficult – apneadiving Sep 18 '14 at 06:37 — apneadiving, Sep 18 '14 at 06:37
i fixed that.add chardinjs.js as a external resources – Ajay Barot Sep 18 '14 at 06:42 — Ajay Barot, Sep 18 '14 at 06:42
http://jsfiddle.net/ABPrime/5ah1wsyz/1/ – Ajay Barot Sep 18 '14 at 11:28 — Ajay Barot, Sep 18 '14 at 11:28

score 1 · Accepted Answer · answered Sep 18 '14 at 07:32

1

I feel like your issue can be the same as your gist's: you think github is a CDN but its not.

For js, use https://cdn.rawgit.com/heelhook/chardin.js/master/chardinjs.js

For css, use https://cdn.rawgit.com/heelhook/chardin.js/master/chardinjs.css

answered Sep 18 '14 at 07:32

apneadiving

114,565
26
219
213

yup you are right. now check my question what i exactly want. – Ajay Barot Sep 18 '14 at 11:24
Change this link: `.attr('href','https://github.com/heelhook/chardin.js')` try google.com for instance – apneadiving Sep 18 '14 at 11:42
thanks for reply . i tried google.com still image is not showing. – Ajay Barot Sep 18 '14 at 11:46
i put console.log after data-toggle on click event but console.log message is not work. – Ajay Barot Sep 18 '14 at 11:48
well... find a way to ilustrate in in your fiddle because: https://www.evernote.com/shard/s244/sh/2cbf0a1c-e872-4b69-b013-23c8833cf97d/985ca1c2058b287fda87aba35a90a43c – apneadiving Sep 18 '14 at 11:51

Ajay Barot · Answer 2 · 2017-01-03T06:28:39.757

1

Actually by mistake i put both files(chardinjs.js and chardinjs.min.js) in assets/javascript. And in application.js file require_tree load all tree js files. so that was a problem and also changed document.ready in homes.coffee file.

edited Jan 03 '17 at 06:28

answered Sep 19 '14 at 10:13

Ajay Barot

1,681
1
21
37

chardinjs is not working in ruby on rails

2 Answers2