how these javascript stuff can be used with sc?

Scriptcase 8 Discussion
#1

Hello, please see this

https://github.com/HubSpot/odometer

ny tutorial or somebody donates 10 minutes to write steps how this can be used with scc?

this will add so much value and fun to scc if we can add such effects and resources, I’m lacking how this external resources can be working in scc

but same time I’m sure many heroes here can help in telling us how to do so

any hints or steps to follow? or even similar scenario already discussed here in the forum? or example from scc netmake?

cheers

#2

This is pretty easy to install, however this library only can be integrated into a blank application, why? Because ScriptCase does not have a hook/event or whatever function to let you add stylesheets into the head section of the html template (this library need a stylesheet to be included). The odometer could be cool in a grid’s column to show some nice fact, but as I said, it is not possible. Anyway. let me give you an example.


?>
<html>
<head>
<link rel="stylesheet" href="http://github.hubspot.com/odometer/themes/odometer-theme-car.css" />
<script src="http://github.hubspot.com/odometer/odometer.js"></script>
<script type="text/javascript">
    setTimeout(function(){
    odometer.innerHTML = 456;
}, 1000);
</script>
</head>
</body>
    <div id="odometer" class="odometer">123</div>
</body>
</html>
<?php
#3

thank you manfred, but i still think it can be used in grid and in control, it is just the how to, i guess there is anotherway to do this, specially with the external library concept that scriptcase added recently,
any other guys can add suggestions?

note that is only example, i want to know how this stuff can be used in general, not only this odometter thing

thanks

#4

I will try something but I dont have a cmputer near, and weekend id difficult.

#5

take your time Gui, this will help everybody :slight_smile:
thanks in advance

cheers

#6

It’s very easy

How-To
Upload odometer js and css of the theme to an external library for example.
Then, onApplicationInit of grid:

echo '<link rel="stylesheet" href="'.sc_url_library("prj", "odometerjs", "odometer-theme-car.css").'" />';

echo "
<style>
.odometer {
  font-size: 40px;
}
</style>
";

echo '
<script src="' .
sc_url_library("prj", "odometerjs", "odometer.min.js"). '" />
';

Now, onRecord:

{id} = '<div class="odometer">'. {id} .'</div>';

Enjoy :cool:

#7

that is great! I was thinking of external library will do :slight_smile:
is it giving effect Giu??
how about control application?

#8

For control App almost the same way I guess. Try.

#9

thanks a lot Gui seems genuine :slight_smile: i will try for grid and control for sure

#10

Giu, I know that is cool to see the result expected by MikeDE, but putting css’s link in body section is a bad idea, the HTML 4/5 does not allow that practice there, and don’t forget that you are rendering the page twice, because when you put the link in head section all the style properties are loaded before the page was displayed/rendered, but in this case the things change because the properties are loaded before the first loading, so the web browser should apply the new properties again. That is why I said:

Because ScriptCase does not have a hook/event or whatever function to let you add stylesheets into the head section of the html template

If MikeDE is happy whit it, then ignore my words. I just thought this kind of things should not be wire fences. Hope you get my point.

#11

I know what are you talking about, but MikeDE need it working, and this is “the only way” to do it. If you expect to this hook be developed soon on SC … this is not the good idea :smiley:

HTML5 allows to use it on others ways, and you can do it with jquery too, but I just showed a fast way to get it working without headaches, not the best.

SC is full of bad practices in web design, one more don’t hurts.

#12

YES :slight_smile:

thanks manfred for the explanation i kind of understood the issue, can you please be kind and tell us what could happend in case of this done in the web page? i mean what is the worse could be, is it just the web design standards or is also security or other stuff?

thanks guys

#13

@Giu , thank you much for your reply, nice answer.
@MikeDE, in small projects there is not big deal. In large projects concretely the design and maintenance are the week points, it is too difficult to track changes and code.

#14

good news but what is the consequence anyway, just to know to which extend someone can do this and expect what in return?