How to write SCSS function to access file system? - ember.js

I'm using Broccoli (which uses node-sass) to compile SCSS code for an Ember project, and I'd like to create a SCSS function that reads a named file from the file system, processes it, and returns the result.
So far I haven't been able to find any references on writing a SCSS function that calls out to the file system.
How do I call out of a SCSS function to access the file system when using Broccoli?
EDIT:
I've found this thread about custom functions in node-sass, but it doesn't look like they're available yet.

SCSS or SASS are pre-processing languages to be used with your library (libsass) in order to generate CSS (styles).
If you are using Ember in your project then I suggest you use that to access the file system.
Ember is a Javascript Framework and it's where you should look at to combine it with, for instance, the HTML5 File API. Either that or a call to any back-end language.

Related

emberjs how to add external js files

I am novice to ember.js, This is how I have included my external java script file to ember project to call to jquery plugin in imagerotator.js
<script src="{{rootURL}}assets/imagerotator/html/js/imagerotator.js"></script>
when I am calling it from the document.ready() function it getting initialized properly.
But I need that plugin should be only in only one hadlerbar(.hbs) file.
Am I doing it correctly ?
I heard there is a "didInsertElement" function in components file and define there but in my case I don't have component just have template file only.
I am novice to emberjs and sorry for my poor English.
Place imagerotator/html/js/imagerotator.js file in vendor folder and include it in ember-cli-build.js file by app.import('vendor/imagerotator/html/js/imagerotator.js');
It good to create component and initialize it in didInsertElement hook.

Ember Cli - Transpiling vendor ES6 dependency in ember-cli-build?

I'm writing an Ember.js application using Ember Cli, and I want to include a non-bower dependency - basically a dependency from my vendor folder.
The instructions on doing so is telling me to add the following line into my ember-cli-build.js file:
app.import('vendor/dependency-to-include.js');
That would work fine with a normal ES5 flavored dependency, but what if I want to add a dependency written in ES6?
Right now it just delivers it to the browser untouched, which produces an error like:
Uncaught SyntaxError: Unexpected reserved word
because my ES6 flavored dependency uses the following syntax:
import Util from './util
I'm guessing that I need to tell ember-cli-build to transpile this particular dependency before passing it on to the browser, but how do I go about doing that?
Thanks
For transpiling imported dependencies you need to run the imported file(s) through the broccoli addon broccoli-babel-transpiler. For a basic example, checkout this file: https://github.com/thefrontside/ember-impagination/blob/2fa38d26ef1b27a3db7df109faa872db243e5e4c/index.js. You can adapt this addon to an in-repo addon for your project.
See this link for the background discussion and #rwjblue and #cowboyd on the actual fix: https://github.com/ember-cli/ember-cli/issues/2949
Are you currently including Babel within your project? I would have thought that it checks your vendor directory the same as it does everything else and converts the ES6 code to ES5.
The other option would be to just convert the file to ES5 manually whenever you need to include a vendor file with ES6 syntax. Not necessarily ideal, but if it's a static file then it's something you'll need to do once and then forget about.

Ember cli Managing dependencies for custom folders

I have an ember app, and a folder with a file playGame/game.js. This file includes game logic, and I want to import it for asset compilation.
If this file is under app/playGame/game.js and my Brocfile is like this:
app.import('app/playGame/game.js')
this gives the error, path or pattern app/playGame/game.js didn't match any files..
but if I put the file under bower_components/playGame/game.js and my Brocfile:
app.import('bower_components/playGame/game.js'), this compiles successfully.
What is the problem and solution here?
There are two parts to this:
Where should I put my file to import it as an asset?
Why isn't putting it in my app-folder working?
The way to do what you want is to create a folder called vendor in your root, put the file somewhere in there, and then import it in your Brocfile.js like so:
app.import('vendor/playGame/game.js');
This is documented on ember-cli.com, although somewhat hidden.
You could also put it in bower_components, but that folder is for things installed with bower, and could theoretically be deleted (in fact, this is a common recommendation to various issues). Things in bower_components is also not checked in to version control by default, which you probably want to do in this case.
This should solve your issue.
Now, why doesn't it work to put it in /app?
app is a special folder. From the documentation:
Contains your Ember application’s code. Javascript files in this
folder are compiled through the ES6 module transpiler and concatenated
into a file called app.js.
This is what makes it possible for you to import stuff from within your app. The folders in app is available directly under your <appname> namespace, along with some other files and folders like config/environment.
Example:
import myWidget from 'my-app/widgets/my-widget';`
The referenced file is /app/widgets/my-widget.js.
The ember-cli website has some more resources for how to use modules. Read those if this doesn't make any sense.
To sum up:
You could put your file in app, but that would make it part of your transpiled package, and you'd have to use it that way internally with an export and everything else that comes with it. It would end up as part of <appname>.js
You could put your file in vendor and import it in your Brocfile.js as explained above. It would be part of vendor.js and load before your app code.

Using Non-Local Data/Media Files with a C++ Application (gtkmm)

I'm beginning development on an acoustic spectrum analysis tool (inspired by spek) written in C++ with gtkmm (C++ bindings for the GTK+ GUI toolkit). I would imagine that I should know how to do this by now, however...
My directory structure is a-la-GNOME, e.g src/, data/, po/, man/. The specific situation that presented the need for my inquiry is the use of a GTK UI Manager that will be located in data/ui. For this specific situation, I want to be able to load the user-interface from this file in an install-independent manner (e.g. loading of the file does not depend on a make install; the executable may be run [and load the UI file] either from src/ after running make [thus compiling the sources into the selfsame exectuable] or from its install prefix). How would I refer to the UI file in my source code (keeping in mind that the loading of the file is not performed by creating a file object (fopen(...)) but rather by passing a file location as a string argument to (UIManager).add_ui_from_file(...))?
In addition to this particular situation of a UI file, how would I do similar references to files (i.e. databases, INI files, XML schemas) by using the autotools build process? Is there a piece of relevant Automake code to quickly set up a project to use this type of directory structure?
simply try to use both files (with the un-installed taking precedence):
if(!(UIManager).add_ui_from_file(../data/ui/mygui))
(UIManager).add_ui_from_file(/incalled/location/mygui)
In Glom, I created a helper function that tries both locations, with both locations being defined in the Makefile.am (this is simpler if you have only one Makefile.am, by using non-recursive automake, which is simpler anyway):
http://git.gnome.org/browse/glom/tree/glom/glade_utils.h#n38

Codeigniter Tank_Auth used as a HMVC module along with the Template library

I've successfully configured and run HMVC on my clean install of Codeigniter 2.1.0
Then I've included Template library. It consist of only 3 files: /system/library/Template.php, /application/config/template.php and finally, template file itself (somewhere in /views directory).
I've tested template library while loading one of my created modules. I had to go to /system/library/Template.php to correct paths so they point to my module/views instead of default CI's ones.
Then I tested and it seemed just fine.
The third step is to include Tank_Auth authentication library. I want it to reside in module as well (/modules/auth). This module should have the same directory structure just like a regular app directory does (config, controllers, language, libraries, models, views, etc.) so I can copy Tank_Auth's files to Auth module's respective directories.
Basically, I have already done that copy part. But now when I try to run http://adresar.local/auth/auth/login I get
An Error Was Encountered
Unable to load the requested file: auth/login.php
I've also tried changing
class Auth extends CI_Controller
to
class Auth extends MX_Controller
but to no avail.
If anyone can throw in some useful advice I will appreciate it a lot.