Forums

How Do I Disable a Jquery Script While in Edit Mode?

Permalink 1 user found helpful
Hi, I am developing a theme, and it requires a jquery script to function. I am calling it in elements/header.php. However, I need to know how to make it so that it auto-disables when the user is in edit mode. What is the code for me to do this? Here is my current code: 
<script type="text/javascript" src="<?php  echo $this->getThemePath()?>/js/jquery.masonry.min.js"></script>
      <script>
        $(function(){
          $('#masonry').masonry({
            itemSelector: '.box',
            columnWidth: 100,
            isAnimated: true
          });
        });
      </script>
PineCreativeLabs
 
surefyre replied on at Permalink Reply
surefyre
In your theme file(s) do this:
<?php $u = new User();  ?>
<script type="text/javascript">
is_edit_mode = <?php if($c->isEditMode()) { echo 'true'; } else {echo 'false';}?>;
</script>


then in javascript elsewhere on the pages using the theme you can just use:
if(is_edit_mode) {
    javascripty stuff;
}
Mnkras replied on at Permalink Reply
Mnkras
or,
if(!CCM_EDIT_MODE) {
//your stuff
}
PineCreativeLabs replied on at Permalink Reply
PineCreativeLabs
The script I'm calling in from the header applies a simple effect to a class of divs within the layout (affects their arrangement). It causes difficulty with adding new blocks, so the script needs to be disabled while in edit mode. I'm afraid I don't fully understand what to do here. Can you explain step-by step what I need to do?
hursey013 replied on at Permalink Reply
hursey013
Replace this:
<script type="text/javascript" src="<?php  echo $this->getThemePath()?>/js/jquery.masonry.min.js"></script>
      <script>
        $(function(){
          $('#masonry').masonry({
            itemSelector: '.box',
            columnWidth: 100,
            isAnimated: true
          });
        });
      </script>

With:
<?php if(!CCM_EDIT_MODE) { ?>
<script type="text/javascript" src="<?php  echo $this->getThemePath()?>/js/jquery.masonry.min.js"></script>
      <script>
        $(function(){
          $('#masonry').masonry({
            itemSelector: '.box',
            columnWidth: 100,
            isAnimated: true
          });
        });
      </script>
<?php } ?>
PineCreativeLabs replied on at Permalink Reply
PineCreativeLabs
Hmm, tried that now, and now the script doesn't seem to work when NOT in edit mode.
Mnkras replied on at Permalink Best Answer Reply
Mnkras
just do this then:

<?php if(!$c->isEditMode()) {
?>
<script type="text/javascript" src="<?php  echo $this->getThemePath()?>/js/jquery.masonry.min.js"></script>
      <script>
        $(function(){
          $('#masonry').masonry({
            itemSelector: '.box',
            columnWidth: 100,
            isAnimated: true
          });
        });
      </script>
<?php
}
?>
PineCreativeLabs replied on at Permalink Reply
PineCreativeLabs
THANK YOU! That worked perfectly! I'm just curious: does this solution work for all versions of concrete?
Mnkras replied on at Permalink Reply
Mnkras
yes
chanderdelhi replied on at Permalink Reply
Where To add this code I mean to say in which file, I am new to concrete5
PineCreativeLabs replied on at Permalink Reply
PineCreativeLabs
Generally, it would be in the header.php file, before the <body> tag.
tobi replied on at Permalink Reply
don't mind my quesiton below. I found out how to do it: create a view.js file in your block's js folder. in it use the code Mnkras gave on the very top: !if (CCM_EDIT...
that solved it :-)
thank you guys - another lesson learned.
Tobi


it's been a while but i just faced the same issue.

i added the code given by Mnkras to a view.php of a block. that would load the script not in the header but in the flow of the body.
however that did not work.
when placing the code in the header.php it did work.

does anybody know why that is so and how to place the script code as part of the view.php to avoid having it on every page even when it's not needed? (it's not needed on every page as the js files are only loaded when the corresponding block is on the page)

until then the code stays where it is (in the header) but an answer would be helpful :-)

Cheers,
Tobi