I have successfully installed the my crossrider extension on Chrome, Firefox and IE (all up to date) but the browser button (although enabled on all) only works for Chrome.
Background code seems to work, since I can trigger alerts.
My background.js looks like this:
appAPI.ready(function() {
var popupDims = {
CH: {height: 400, width: 400},
FF: {height: 400, width: 400},
IE: {height: 400, width: 400},
SF: {height: 400, width: 400}
};
if ("CHFFIESF".indexOf(appAPI.platform) !== -1) {
appAPI.browserAction.setPopup({
resourcePath:'popup.html',
height:popupDims[appAPI.platform].height,
width:popupDims[appAPI.platform].width
});
}
else {
alert('This extension is not supported on your browser');
}});
In my popup.html I have some javascript:
function crossriderMain($) {
// load libraries
eval(appAPI.resources.get('select2.js'));
$('[as-trigger]').click(function () {
// retrieves the information for the active tab
appAPI.tabs.getActive(function(tabInfo) {
activeUrl = tabInfo.tabUrl;
appAPI.request.get({
url: 'http://...',
onSuccess: function(response, additionalInfo) {
// show message
},
onFailure: function(httpCode) {
console.log('GET:: Request failed. HTTP Code: ' + httpCode);
}
});
});
})
$('[as-project-dropdown]').select2().on('select2-selecting', function (e) {
// some jquery code
});
appAPI.request.get({
url: 'http://...',
onSuccess: function(response, additionalInfo) {
var dataObject = JSON.parse(response);
$.each(dataObject.data, function(key, value) {
$('[as-project-list]').append('some html...');
});
$('[as-companyname]').html(dataObject.company);
},
onFailure: function(httpCode) {
console.log('GET:: Request failed. HTTP Code: ' + httpCode);
}
});}
And in my firefox console I can see an error thrown by my extension:
MyExtension <Warning: document.getElementById(...) is null Function-name: appAPI.request.get User callback>
#Crossrider support: my app id is 65982
Looking at your code I can see that you did not set the browser action's icon. Per the Browser Action docs, on some browsers this is essential for the button to properly initialize. I created an extension with your code and added the icon using appAPI.browserAction.setResourceIcon and the button worked fine.
So taking the snippet from your background.js, add the icon as follows:
appAPI.ready(function() {
var popupDims = {
CH: {height: 400, width: 400},
FF: {height: 400, width: 400},
IE: {height: 400, width: 400},
SF: {height: 400, width: 400}
};
if ("CHFFIESF".indexOf(appAPI.platform) !== -1) {
appAPI.browserAction.setResourceIcon('logo.jpg');
appAPI.browserAction.setPopup({
resourcePath:'popup.html',
height:popupDims[appAPI.platform].height,
width:popupDims[appAPI.platform].width
});
}
else {
alert('This extension is not supported on your browser');
}});
[Disclosure: I am a Crossrider empployee]
Related
Hi so as you can see i have a problem with videojs-recorder, problem is i can't get access to my cam on phone. I use code down below and i am testing it with remote dev tools on chrome. Error is:
VIDEOJS: ERROR: TypeError: Cannot read property 'getUserMedia' of undefined
This is my code:
let player;
const options = {
controls: true,
width: 300,
height: 300,
plugins: {
record: {
audio: true,
screen: true,
image: false,
maxLength: 3600,
debug: true,
}
}
};
player = videojs("myVideo", options , function(){
// print version information at startup
videojs.log('Using video.js', videojs.VERSION,
'with videojs-record', videojs.getPluginVersion('record'),
'and recordrtc', RecordRTC.version);
});
// error handling
player.on('deviceError', function() {
console.log('device error:', player.deviceErrorCode);
});
player.on('error', function(element, error) {
console.error(error);
});
player.on('startRecord', function() {
console.log('started recording!');
});
player.on('finishRecord', function() {
console.log('finished recording: ', player.recordedData);
});
Edit:
Currently i am using 2.1.2 and i am unable to do update.
I am using cubeportfolio.js as part of a bootstrap template. It seems to be working but the custom .js part of the template is causing an error in the console.
The template I am using can be seen here, which is working without errors.
The error is 'Uncaught Error: cubeportfolio is already initialized. Destroy it before initialize again!'
For confidentiality reasons I can't post all the code but I have called the jquery.cubeportfolio.min.js at the bottom of the with the custom .js underneath.
Here is the custom .js
(function($, window, document, undefined) {
'use strict';
var gridContainer = $('#grid-container'),
filtersContainer = $('#filters-container'),
wrap, filtersCallback;
/*********************************
init cubeportfolio
*********************************/
gridContainer.cubeportfolio({
layoutMode: 'grid',
rewindNav: true,
scrollByPage: false,
defaultFilter: '*',
animationType: 'slideLeft',
gapHorizontal: 0,
gapVertical: 0,
gridAdjustment: 'responsive',
mediaQueries: [{
width: 800,
cols: 3
}, {
width: 500,
cols: 2
}, {
width: 320,
cols: 1
}],
caption: 'zoom',
displayType: 'lazyLoading',
displayTypeSpeed: 100
});
/*********************************
add listener for filters
*********************************/
if (filtersContainer.hasClass('cbp-l-filters-dropdown')) {
wrap = filtersContainer.find('.cbp-l-filters-dropdownWrap');
wrap.on({
'mouseover.cbp': function() {
wrap.addClass('cbp-l-filters-dropdownWrap-open');
},
'mouseleave.cbp': function() {
wrap.removeClass('cbp-l-filters-dropdownWrap-open');
}
});
filtersCallback = function(me) {
wrap.find('.cbp-filter-item').removeClass('cbp-filter-item-active');
wrap.find('.cbp-l-filters-dropdownHeader').text(me.text());
me.addClass('cbp-filter-item-active');
wrap.trigger('mouseleave.cbp');
};
} else {
filtersCallback = function(me) {
me.addClass('cbp-filter-item-active').siblings().removeClass('cbp-filter-item-active');
};
}
filtersContainer.on('click.cbp', '.cbp-filter-item', function() {
var me = $(this);
if (me.hasClass('cbp-filter-item-active')) {
return;
}
// get cubeportfolio data and check if is still animating (reposition) the items.
if (!$.data(gridContainer[0], 'cubeportfolio').isAnimating) {
filtersCallback.call(null, me);
}
// filter the items
gridContainer.cubeportfolio('filter', me.data('filter'), function() {});
});
/*********************************
activate counter for filters
*********************************/
gridContainer.cubeportfolio('showCounter', filtersContainer.find('.cbp-filter-item'), function() {
// read from url and change filter active
var match = /#cbpf=(.*?)([#|?&]|$)/gi.exec(location.href),
item;
if (match !== null) {
item = filtersContainer.find('.cbp-filter-item').filter('[data-filter="' + match[1] + '"]');
if (item.length) {
filtersCallback.call(null, item);
}
}
});
})(jQuery, window, document);
You have to destroy it before init:
gridContainer.cubeportfolio('destroy');
/*********************************
init cubeportfolio
*********************************/
gridContainer.cubeportfolio({
layoutMode: 'grid',
rewindNav: true,
scrollByPage: false,
defaultFilter: '*',
animationType: 'slideLeft',
gapHorizontal: 0,
gapVertical: 0,
gridAdjustment: 'responsive',
mediaQueries: [{
width: 800,
cols: 3
}, {
width: 500,
cols: 2
}, {
width: 320,
cols: 1
}],
caption: 'zoom',
displayType: 'lazyLoading',
displayTypeSpeed: 100
});
It is initialized somewhere else and therefore it throws an error because it doesn't know with which cubeportfolio() instance has to deal.
From the error output I’m pretty sure that you instantiate Cube Portfolio twice for the same element.
If you want to instantiate again the plugin call on that element the method destroy
jQuery('#my-grid').cubeportfolio('destroy');
and then the init method to instantiate again
jQuery('#my-grid').cubeportfolio(options);
If you need further help please send me a link to your website to check your code.
I need to create a script that uploads for the first time a APK file to Google Play (their API only allows to upload APKs after the first version has been published).
Here is the script I have so far:
var fs = require('fs');
var data = fs.read('test.cookies');
phantom.cookies = JSON.parse(data);
var x = require('casper').selectXPath;
var casper = require('casper').create({
//verbose: true,
//logLevel: 'debug',
stepTimeout: 60000,
pageSettings: {
loadImages: false,
loadPlugins: false,
userAgent: 'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_7_5) AppleWebKit/537.4 (KHTML, like Gecko) Chrome/22.0.1229.94 Safari/537.4'
}
});
casper.start().thenOpen('https://play.google.com/apps/publish/?dev_acc=14088528817615018970', function() {
if (this.getCurrentUrl().indexOf('accounts.google.com') == -1) {
// cookies working
this.bypass(3);
} else {
console.log('sign in page opened!')
}
});
casper.then(function() {
console.log('populating form with email');
this.evaluate(function() {
document.querySelector('input#Email').value = "email#address.com";
document.querySelector('input#next').click();
});
})
casper.waitForSelector("input#Email-hidden", function() {
console.log('populating form with password');
this.evaluate(function() {
document.querySelector('input#Passwd').value = "passwd";
document.querySelector('input#signIn').click();
});
})
//Wait to be redirected to the Home page, and then make a screenshot
casper.then(function(){
console.log(this.getCurrentUrl());
var cookies = JSON.stringify(phantom.cookies);
fs.write('test.cookies', cookies, 644);
});
// Google play page
casper.then(function() {
console.log('Current page: ' + this.getCurrentUrl());
});
casper.waitForSelector(".BVO4BTD-b-a.BVO4BTD-b-o.BVO4BTD-Be-a", function() {
console.log('Add new app');
this.evaluate(function() {
document.querySelector('.BVO4BTD-b-a.BVO4BTD-b-o.BVO4BTD-Be-a').click();
});
});
casper.waitForSelector(".BVO4BTD-hj-a", function() {
console.log('Filling form');
this.capture('5.png',{
top: 0,
left: 0,
width: 500,
height: 400
});
this.evaluate(function() {
document.querySelector('.BVO4BTD-hj-a > input.gwt-TextBox').value = "App Teste";
document.querySelector('.BVO4BTD-g-K .BVO4BTD-b-a.BVO4BTD-b-o').click();
});
});
casper.waitForSelector(".BVO4BTD-gg-a .BVO4BTD-b-a.BVO4BTD-b-o", function() {
this.capture('6.png',{
top: 0,
left: 0,
width: 500,
height: 400
});
console.log('Current page: ' + this.getCurrentUrl());
console.log('Click for app upload');
this.evaluate(function() {
document.querySelector(".BVO4BTD-gg-a .BVO4BTD-b-a.BVO4BTD-b-o").click();
});
});
casper.waitForSelector(".BVO4BTD-Re-b.BVO4BTD-g-U.BVO4BTD-d-b", function() {
this.capture('7.png',{
top: 0,
left: 0,
width: 500,
height: 400
});
/**/
this.evaluate(function() {
document.querySelector(".BVO4BTD-Re-b.BVO4BTD-g-U.BVO4BTD-d-b .BVO4BTD-b-a.BVO4BTD-b-m").click();
casper.page.uploadFile(".BVO4BTD-Re-b.BVO4BTD-g-U.BVO4BTD-d-b input[type=file]", '/path/to/apk/file.apk');
});
this.wait(3000, function() {
this.capture('8.png',{
top: 0,
left: 0,
width: 500,
height: 400
});
});
});
casper.run(function() {
console.log('end');
});
These steps already work:
Sign In at Google Play (saves a cookie, so it skips this part)
Creates an app named App Teste
Goes to Upload APK screen
I can't make the upload script work, I guess there is a lot of javascript behind Google Play's upload mechanism.
My attempt to upload happens on the last waitForSelector section.
Thank you.
casper.page is actually just a phantomjs WebPage object, and probably shouldn't be used inside of the this.evaluate.
To accomplish the same goal, you can try:
casper.waitForSelector(".form-selector", function() {
// your capture code
casper.page.uploadFile('selector', '/path/to/file');
});
casper.then(function() {
// whatever you need to do after file upload
});
Also, to fill out the forms, you can try casper.fill().
Sources: http://docs.casperjs.org/en/latest/modules/casper.html#then (casper), http://phantomjs.org/api/webpage/method/upload-file.html (phantomjs)
Check the following script it might work
Note: where 'filename' is the path of the file from your local directory.
var filename = /home/xyz/android/file_you_want_to_upload.apk
casper.then(function () {
this.evaluate(function (fileName) {
__utils__.findOne('input[type="file"]').setAttribute('value', fileName)
}, {fileName: fileName});
this.page.uploadFile('input[type="file"]', fileName);
console.log('Selecting a file');
});
casper.then(function () {
console.log("Clicking on Upload ");
this.click(x("xpath of upload button"));
});
I am trying to set the minimum width of a chrome app and I looked at some chrome documention and I implemented it into my chrome app like this:
chrome.app.runtime.onLaunched.addListener(function(launchData) {
chrome.app.window.create(
'index.html',
{
id: 'mainWindow',
bounds: {
width: 800,
height: 600,
minWidth: 600
}
}
);
});
However I got the error:
Error
Error in event handler for app.runtime.onLaunched: Error: Invalid value for argument 2. Property 'bounds.minWidth': Unexpected property.
From my knowledge, this means that the property doesn't exist but this can't be the case as it's in the documentation. Maybe I implemented it wrong? Any help would be appreciated!
I found out that it's innerBounds I needed to use! Here is my code now:
chrome.app.runtime.onLaunched.addListener(function(launchData) {
chrome.app.window.create(
'index.html',
{
id: 'mainWindow',
bounds: {width: 800, height: 600},
innerBounds: { minWidth: 800}
}
);
});
The player works fine on all other browsers, but isn't working in IE11. I'm getting the error message "Could not add internal listener" 8 times (one time for each playlist item, I assume).
The script gets to the onReady event, but never gets to onPlay. I'm running version 6.8. I have confirmed that the playList is being generated as it should, and as I mentioned, it works in all browsers except for IE11.
//get our playlist
var playListItems = [];
$(courseXML).find("audiofile").each(function() {
var newItem = {
file: "assets/audio/"+ $(this).text(),
type: "mp3"
};
playListItems.push(newItem);
});
//redoing this as a playlist
jwplayer("mediaplayer").setup({
flashplayer: "js/jwplayer.flash.swf",
html5player: "js/jwplayer.html5.js",
controls: false,
width: 1,
height: 1,
autostart: false,
playlist: playListItems,
allowscriptaccess: 'always',
events: {
onComplete: function() {
alert("I'm completed");
},
onReady: function() {
alert("I'm ready");
},
onPlay: function() {
alert("I'm playing!");
}
}
});