How in Sails to access globals in assets? - sails.js

I am using Sails JS and would like to access globals (sails.config.myGlobals) in my assets, currently in js files.
I would have hoped I there is a similar way like injecting in ejs files. But its not.
Any ideas? Do I have to do a Grunt task for that?

In your config folder create a config file for example MyConfig.js (name doesn't matter). Fill that config with something that you wanted like.
module.exports.myconfig = {
configA: 'this is config A'
}
Use that config in your controller, like.
showconfig: function(req, res){
res.view('viewname', {
config: sails.config.myconfig
});
}
Now in your EJS file that is called, by that example is viewName.ejs at views folder, you can use it like <% config.configA %>, and this is config A would be printed. Also if you want Front End js (in assets folder) able to read that value, just print it in script tag, like this.
<script>
global.configA = '<%= config.configA %>';
</script>
Or if you use front end framework library, it can be placed under some value, service, or factory, not making global variable dirty, so other JS are able to read that value.

I don't think this is possible with Sails.
However, what you can do is setting the variable in a ejs view file to access its value in your js asset file.
// someView.ejs
<script>
myGlobals = '<%= config.myGlobals %>';
</script>

Related

Multiple language code in the same file - Visual Studio Code

actually I'm working with .phtml file and it works fine for HTML part of it.
But it doesn't recognize JS inside the script: Image->1
JS is total-white... how can I fix it?
OFC I need both at the same time.
Edit:
For example:
<div dojoType="dijit.form.Form" id="insCliFo" jsId="insCliFo">
<script type="dojo/method" event="onShow">
var f1=false;
var idWebAzienda = "";
if('<?=$this->az?>'=="69691c7bdcc3ce6d5d8a1361f22d04ac"){
window.progressDialog.show('Caricamento...');
dojo.xhrPost({
url: stdUrl("cdamodificare",'<?=$this->c?>'),
load: function(data){
window.progressDialog.close();
data=JSON.parse(data);
dijit.byId('ragSoc').attr("value",data.items.RagioneSociale);
dijit.byId('indirizzo').attr("value",data.items.indirizzoResidenza);
dijit.byId('nCivico').attr("value",data.items.nCivico);
dijit.byId('stato').attr("value",data.items.idStato);
f1=data.items.idProvincia+"~"+data.items.Comune+"~"+data.items.CAP;
dijit.byId('cap').attr("value",data.items.CAP);
dijit.byId('piva').attr("value",data.items.PIVA);
dijit.byId('cf').attr("value",data.items.CodF);
if(data.items.idTipo==0)
.
.
.
the div and the script are correctly "colorized"... but the Javascript inside the script is completly "black/white"...

How do I load an ejs template file into my HTML?

I am using EJS in the browser (not on the server).
I have some ejs that I would like to use in multiple pages, so I want to put that in its own file, say table.ejs.
Is there a way I can include it in my HTML such that it is immediately accessible to my javascript after onload?
I was thinking something like:
<script id="table-ejs" type="text/ejs" src="ejs/table.ejs"></script>
then in my javascript:
ejs.render(document.querySelector('#table-ejs').???, data)
Is this possible?
I could use the Fetch API to retrieve the ejs file but then I would need to rewrite a lot of code to make it async. I was wondering if I could avoid that.
Well,
place all your ejs-files within a file "views" - within your views you can create another file "partials" - in this file you place your header and footer.ejs.
Within, lets say, your home.ejs you have to include the following code:
<%- include('partials/header'); -%>
// the rest of your code
<%- include('partials/footer'); -%>
You can find more here: https://ejs.co/#docs

Passing ejs parameters to stylus file

I am looking to pass a parameter to my Stylus file when it is being rendered. So for example in my app.js file I have:
app.get('/myPage', function(req, res) {res.render('myPageTemplate', { title:
'MyPageTitle' , myColor: '#E3D'});});
app.get('/myPage2', function(req, res) {res.render('myPageTemplate', { title:
'MyPage2Title' , myColor: '#0FF'});});
Obviously I can access these parameters in my ejs files e.g.
<title><%= title%></title>
In my Stylus file I would like to be able to do something like:
div{
background-color: <%=myColor%>;
}
Is this possible or am I going about this the wrong way?
Thanks for your help!
This is really a bad idea as most of the reverse proxies (if you are using one like cloudflare) cache your css and also it sets the Cache-Control headers so that browsers can cache it. So you will not get your desired behaviour.
Instead doing what you are doing now, you can create multiple css classes and add those classes to your div in .ejs file based on conditions.

How to pass a list of image filenames from Docpad to browser client

I want to get a list of filenames from a directory in my Docpad project and then pass them to the client for preloading. What is the best way to do this?
What I have been trying is to extract a list of file names from the directory and then pass them to the client via the document.
So I have a collection, like so in docpad.coffee:
collections:
myImages: ->
#getFilesAtPath({relativeOutDirPath: 'images'})
And then in the footer of my html, I've been trying something like this:
<script>
var images = <%= #getCollection('myImages').toJSON() %>
</script>
This however is not coming even close to working. What I really want to do is have images set to an array of urls pointing to the files. But I can't seem to figure out how this would be done. The Docpad documentation and the Query-Engine documentation are simply to sparse.
Anyone have any ideas? Or is there a totally different way to think about this? Is there a way to hand over a variable directly from the Node/Docpad backend to the client, by passing the need to pass it along with the HTML?
Not sure why you want to separate it as a script (btw if you want you can really put it in a separate script if it is called js.eco). I guess it is just for clear separation.
This is how it will work:
<script>
var images = [];
<%for obj in #getCollection("myImages").toJSON(): %>
images.push('<%= obj.url %>');
<% end %>
console.log(images[0]);
</script>
So you will have an array with url's only. I've put there an info to print out in console first element to show it works.

Accessing session information in JavaScript

I am newer one in ASP.net. I want to store text in the text box from JavaScript to session variables and pass those session variables to client side JavaScript. Is this possible?
You will need to do this in the code behind.
To store the value from the textbox in the session, in the correct event handler you would need to put code like:
if (!IsPostback) {
Session("TextboxContent") = txtTextbox.Text;
}
And to populate it in client side javascript, it depends on if you are using a library or not, but something that should work regardless is to have the following in your markup:
<script type="text/javascript">
var tb = document.getElementById('<%= txtTextbox.ClientID');
if (tb) tb.value = '<%= Session("TextboxContent").ToString().Replace("'", #"\'") %>';
</script>
Note that having code like I have done here in <%= %> ("alligator tags") is generally considered pretty bad practice, but you can use an <asp:Literal> or whatever if you like.