Mixpanel.track from the controller - javascript

I have an application that has a simple form submission (an email). I have MixPanel's tracking analytics integrated into the app, and want to track every time an interaction with this form happens--specifically, when a user successfully/unsuccessfully submits the form, and what their email is.
After doing some research, it seems simplest method is to track at the controller level (where I am running validations, and making the overall decision whether or not the submission is legitimate). This would require running a JS function from the controller. Is this possible? Is there a better method of doing this?

Let integrate this gem analytical.
Then just follow the instruction in above link, but here is the summary:
Add analytical to your controller
Setup mixpanel token in config/analytical.yml
production:
mixpanel:
key: your_mixpanel_project_token
development:
# Also define here if you want to test in development
test:
Track your event in controller:
# data_key_1, data_value_1, data_key_2 and data_value_2 are the data
# which were attached to mixpanel event, they are example, specify yours
analytical.event 'Your event', data_key_1: data_value_1, data_key_2: data_value_2
You may integrate more with GA, KISSMetrics, or whatever you want, the tracking code works in generic, this also works with javascript code, for more detail, please refer its documentation.

Related

Update data without reloading [duplicate]

I'm very very new to node.js, but there's actually only one simple thing that I am trying to achieve by learning the language.
I'd like to create a webpage, where by the code in a specific "div" can be hotswapped on the fly to users currently looking at that page. (ie. the div contains some text, but then an image replaces it.)
Ideally, the swap would be executed manually by the the webpage's admin through the click of a button, or some code fired off on the server or something. Regular viewers to the webpage would not be able to do this - they only see the live changes on the page.
real-life example:
live internet broadcast is off-air, therefore the "div" contains "off-air" text.
live hotswap of code happens when broadcast goes on-air, and the viewers of the webpage now see the html5 broadcast player in the "div" instead.
What's the simplest way to go about doing this for a node.js newbie?
Many thanks :)
Take a look at Socket.IO http://socket.io/#how-to-use
when the server decides to broadcast a change use:
io.sockets.emit('update-msg', { data: 'this is the data'});
on the client first connect socket.io and then wait for the "update-msg" event and update your dom:
var socket = io.connect('http://localhost');
socket.on('update-msg', function (msg) {
console.log(msg);
$('#mydiv').html(msg.data)
});
I created a system/methodology to live update (hot reload) front-end code using RequireJS and Node.js. I made sure it worked with both React and Backbone. You can read about it here:
https://medium.com/#the1mills/hot-reloading-with-react-requirejs-7b2aa6cb06e1
the basic steps involved in doing this yourself:
gulp.js watchers listen for filesystem changes
socket.io server in gulpfile sends a message to all browser clients
with the path of the file that changed
client deletes cache representing that file/module, and re-requires
it (using AJAX to pull it from the server filesystem)
front-end app is configured / designed to re-evaluate all references
to the modules that it wishes to hot-reload, in this case, only JS
views, templates and CSS are available to hot reload - the router,
controllers, datastores (Backbone Collections and Models) are not
configured yet. I do suspect all files could be hot reloaded with
the only exception being data stores.

How can I keep both users tables "synchronized" using BackAnd?

I'm good with registering users, login, etc.
Now I'm getting into modifying users with:
this.backand.object.update('users', user.userId, user)
but I can see that only my table gets modified, while I'll also need to modify the "Registered Users" table existing in "Security & Auth > Registered Users".
I understand I might need to create a custom action...maybe "Before Update"? ...but I can't find documentation on how to modify that specific table (via API or via BackAnd actions).
Thank you.
thanks for using Backand! We don't offer any methods via the SDK to update the registered users. You can use the HTTP object to send a call to the back-end's REST API directly, hitting the same URL that the SDK requests when creating a new user, but this isn't officially documented. In general, we try to limit direct modifications of the registered users table, as there are some security concerns regarding how frequently the data is accessed and modified, but you can access the users object directly via the /users URL. There is an article in our documentation at http://docs.backand.com/en/latest/apidocs/security/index.html#link-your-app-39-s-users-with-backand-39-s-registered-users that covers an automated process for making these kinds of changes - you should be able to adapt some of the server side code in that example to work with your use case.
One alternative that would work now would be to have any change in basic information (username, password, firstname, lastname) result in a new user being created, and you could then use a custom action to perform the migration to the new user, but that is unnecessarily complex. I will add a ticket for our developers to look at adding this registered user management functionality in the future.

Google sign in button with automatic approval of authorizations

I've seen many threads about it but cannot find a satisfying answer: when using the Google sign-in button (https://developers.google.com/identity/sign-in/web/sign-in), is it possible to already have the authorizations accepted ? Like if I add the client ID of my app somewhere in the Google console ?
For now I'm calling the auth2.grantOfflineAccess when clicking the button (so I can pass the returned code to my backend and make sure the user is from the expected domain).
If you're able to answer the first question and - bonus point - know if what I'm doing after clicking the button is right, you'd be awesome !
Thanks to Steven's comment, I'm now able to have the authorizations accepted by default. Be aware there will still be a second popup (after the one that requests your email and password) to inform you that your admin has granted the app to access your data. Only at your first connection though.
So what you need to do is to follow the third step of this document. They say you only need the plus.me and userinfo.email scopes if you only request the basic profile of the user but it was not working in my case, I also needed the userinfo.profile scope (because I use grantOfflineAccess() ?).

Implementation of Google Analytics pageView event on a single page application behave weird

I provide SEO services to a customer of mine.
The customer website uses AngularJS as a single-page-application using ui-router to swipe between pages (views).
I having troubles with sending pageView event for each different page, I've asked him to follow the instructions in this link.
He tried both:
ga('set', {
page: '/new-page',
title: 'New Page'
});
and:
ga('set', 'page', '/new-page');
for each route (page) on the site.
When I check Google Analytics 'real time' dashboard I can see the pageView(s)
but it count as the home page in the reports data.
I've tried implement it as GTM as well and still nothing.
p.s the routes look a bit different then regular ui-router routes, it looks like that:
http://www.example.com/s#!/page_name
Any idea why and what should I do to fix it?
appreciate any help, thanks :)
First - reconfigure tracker
This code seems to be OK, if you use default tracker and namespace names. After sending first pageview, you reconfigure tracker values. Your solution is right, because it keeps values for e.g. events fired later on virtual page.
ga('set', {
page: '/new-page',
title: 'New Page'
});
Second - send pageview again
After reconfiguring tracker, you have to send pageview again.
You do not show a lot of your code, but I am missing sending pageview. I expect you need to use some Angular router's method.
ga('send', 'pageview');
GTM alternations
The same is for GTM. Here you need firing event on virtual pageview and some data passed into dataLayer to update trackers values by page and title parameters. You have to recofigure Custom fields in PageView Tag settings.
Better debugging
If you have this kind of probles, please, add HTTP log (or console log from analytics_debug.js or whatever where is full signal).
Live HTTP headers, Omnibug, Charles Web debugging proxy or any other similar analyzer will help you.

rspec testing: putting :js => true also affects the before block

I have a page that is for booking an appointment and it has some javascript code that selects the earliest time and day when the appointment is available, after which user can click on the button to schedule the appointment.
So in order to test that, I was writing some rspec test like the following,
book_appointment_spec.rb
context "when on the profile page" do
before do
click_linkedin_button
end
it 'book an appointment', :js => true do
click_link "new-appointment"
choose "doctor1"
click_button "Submit and Schedule"
expect(page).to have_content "Congrats!"
end
end
click_linkedin_button is a method definition that just logins a user via linkedin oauth. The problem is that even after setting OmniAuth.config.mock_auth[:linkedin], whenever I set :js => true around it block, it asks me to login via linkedin, http://imgur.com/mYUOxgD
I was wondering if anyone knows how to fix this problem.
Following are other files that might be relevant to this problem.
spec_helper.rb
require 'capybara/webkit/matchers'
Capybara.javascript_driver = :webkit
Gemfile
gem 'capybara-webkit'
gem 'database_cleaner'
gem 'capybara'
As you've discoverd, you can't run part of a test using one driver and part of the test using another. This would be equivalent to saying
Given I login in using Safari.
Then I should be logged in using Firefox.
So your solution is that you have to run your js login code in the test environment to login. This is actually a good thing (you want to test your js login code). If you want to avoid actually connecting to linkedin, every time you run this test, then you need to mock the connection to linkedin. Have a look at VCR (https://github.com/vcr/vcr), this will allow you to record your connection to linkedin, so that in subsequent test runs you don't have to goto linkedin.
Setting js: true in your rspec block is a shortcut to use the javascript-enabled driver for the whole example. So this driver will be available and used during the whole execution or the example, which includes all before/after/around blocks.
To work around this, instead of using js: true, you can manually set which driver to use at the point(s) of your example where you need to.
it {
do_some_stuff_with_default_driver
Capybara.current_driver = :webkit
do_some_stuff_with_webkit
Capybara.current_driver = :selenium
do_some_stuff_with_selenium
}
EDIT
Oops I just read this, so perhaps that solution will not be working. please let me know
Note: switching the driver creates a new session, so you may not be able to switch in the middle of a test.
I solved it by creating an actual linkedin account, put that auth info in the .env and just called fill_in method to fill out email and password field during its callback. And stuck with running a js driver throughout the entire context block.
EDIT: This is of course not the best answer so I am still accepting other answers.

Categories