I have an app set up using backbone. I'm using requirejs to get load files as different modules. I have the following declared at the top of my app.js file:
var fs = require('fs');
var base = require(__dirname + '/views/base.js');
var template = fs.readFileSync(__dirname + '/views/templates/sampleView.mu', 'utf8');
var SampleCollection = require(__dirname + '../collections/sample.js');
base and template load fine, but SampleCollection does not because it is actually located one directory up from the current directory where app.js is located. I get this error when I run my app:
Error: Cannot find module '/app/collections/sample.js'
Why can't I use the "../" syntax to move up one directory? And what is the right way to do this?
Related
I have a resampler.js file which does audio resampling. This file requires 2 other .js files:
var WebAudioLoader = require('webaudioloader');
var WavEncoder = require("wav-encoder");
I want to use this resampler in my angular controller like:
resampler(URL, 192000, function (event) { });
When i run my app i get the error: require is not defined
I read about the browserify library which lets include npm libraries for the browser but I am still unable to make it work.
Any ideas?
How to automate file uploading functionality using protractor?
I believe you are asking how to upload a file to your app, correct? if so this code works:
var path = require('path');
//the file to upload
var fileToUpload = 'C:\\your file path',
//this is variable that inserts the path to find file to upload
absolutePath = path.resolve(__dirname, fileToUpload);
//inserts the path
$('input[type="file"]').sendKeys(absolutePath);
I'm part of a team developing an AngularJS application and right now I'm working on modifying the Gulp build script. Part of my task is prepopulating the template cache (up till now we have been loading the templates as the routes/directives needed them).
The Gulp task is basically:
var templateCache = require('gulp-angular-templatecache');
gulp.task('cache-templates', function(){
var dest = destinationPath,
src = sourcePath;
return gulp.src(src)
.pipe(plumber())
.pipe(templateCache('templates.js', {root: './templates/'}))
.pipe(gulp.dest(dest));
});
The problem I am getting is that gulp removes the "./" from the root. For instance:
$templateCache.put("templates/foo.html","<div>some html</div>");
in stead of
$templateCache.put("./templates/foo.html","<div>some html</div>");
The module is loaded correctly into app.js and declared as a dependency, and if I do put the "./"'s as a prefix manually, after building, everything works fine. So could you please tell me how to force Gulp to include the "./" prefix in my root?
Note: Every other prefix works fine, it just removes the "./". I would prefer it if I could solve this from within the Gulpfile, without having to modify the templateUrl's in my directives and $routeProvider, because the application is rather large and that would only be asking for trouble. Thanks! :)
What you can do is use gulp-replace and replace 'templates/' with './templates/'.
Old Answer
In the options that you pass to template you can provide a base function
.pipe(templateCache('templates.js', {root: './templates/', base: baseFn}))
you can modify the file-path there
var baseFn = function (file) { return './' + file.relative; }
I want to use the Cordova facebook plugin for my project. Since the instructions are done for phonegap I get confused when I have to use it only on angular.
So here is what I have so far.
1.I add the CordovaFacebook.js in my scripts and reference it in bundleConfig.
2.I create a new service.js file like this:
'use strict';
var app = angular.module('app.FacebookService', []); // extend the app
var plugin = new CC.CordovaFacebook();
app.factory('FacebookService', [ 'plugin', function(plugin) {
plugin.init('1111111111', 'Cordova',
['public_profile', 'email', 'publish_actions'],
function(response) {
if (response) {
console.log("Access token is: " + response.accessToken);
console.log("Expires: " + response.expirationDate);
console.log("Permissions are: " + response.permissions);
}
}, failureCallback);
plugin.login(function(response) {
console.log("Access token is: " + response.accessToken);
console.log("Expires: " + response.expirationDate);
console.log("Permissions are: " + response.permissions);
}, failureCallback);
}]);
I add this app.service in the App.js file
And at this point I am stuck, when I run my application it says CC from CC.CordovaFacebook() is not defined.
Can you please let me know how is this done step by step. What am I missing ?
Looks like your reference to bundleConfig does not contain CordovaFacebook.js, so your code complaining about CC namespace defined in CordovaFacebook.js.
If you are using Cordova, why don't you simply try cordova plugin add ... from command line to use the plugin? I am pretty sure it's a cordova plugin (hint: I wrote this plugin).
Solution to this was. Load all the cordova files on your root. And reference them.
In that way the module.exports = CC; will be defined.
I'm trying to replace the directory lists generated by Firefox by a custom one.
So, I need three things:
I need to know when Firefox tries to load a file:// URI.
I have to test if that URI targets a directory or a file.
If the target of the URI is a directory, i have to prevent Firefox from generating the directory listing, and show my own directory listing instead.
It's the first point that is the most problematic:
I read the documentation of the nsIObserverService but it doesn't do what I want (there is a http-on-modify-request but no file-on-modify-request)
I tried to use the Jetpack's addon-kit/page-mod on file://* URIs, but it seems it doesn't allow me to verify if the URI targets a directory before loading my stuff.
I read the documentation of the nsIFileProtocolHandler, but it doesn't help me.
So how can I intercept the file://* requests?
Does somebody have an idea?
I tried to use the Jetpack's addon-kit/page-mod on file://* URIs, but it seems it doesn't allow me to verify if the URI targets a directory before loading my stuff.
That's right. However, you can do the same thing that page-mod module is doing, namely listen to the document-element-inserted observer notification. Something along these lines:
var events = require("sdk/system/events");
var urls = require("sdk/url");
events.on("document-element-inserted", function(event)
{
var window = event.subject.defaultView;
if (!window) // XBL document?
return;
var url = urls.URL(window.document.URL);
if (url.scheme == "file")
{
// A file:/// URL was loaded, do something with this window
}
});
For reference: system/events module, url module.
I have to test if that URI targets a directory or a file.
The url module also allows you to get the file path, and then you can use the io/file module to access it:
var files = require("sdk/io/file");
var path = urls.toFileName(url);
var isDir = files.exists(path) && !files.isFile(path);
If the target of the URI is a directory, i have to prevent Firefox from generating the directory listing, and show my own directory listing instead.
That's the hard part. I don't think that you can prevent Firefox from generating the directory listing but calling window.stop() should have the same effect. You can then dynamically add your own contents to the window. You can use files.list(path) method to get a list of directory entries:
window.stop();
var entries = files.list(path);
for (var i = 0; i < entries.length; i++)
addEntry(window, path, entries[i]);