Development of browser extension questions - google-chrome

I am looking to develop a cross browser extension (plugin) and am having troubles getting answers to a few questions. So just looking for some simple answers if what I would like to do is possible. Thanks. I am currently looking at using Crossrider but would use whatever.
How do some extensions add a menu to the right click button. For example, when I right click in Chrome I see Evernote Web Clipper and Adblock options in the dropdown). How do they do that?
Could I embed a youtube player, for example. So when it's closed the audio still plays but when clicked you can see the video and what not?
For sites like Grooveshark. Could they have a plugin that when clicked you could change the song or stop the music, etc. So basically communicate with a website in your tab from the plugin?
Thanks. I just found Crossrider and it looks like some may be possible but havn't explored it too in depth yet. Kind of wondering if anyone has tried doing these things and if possible.

Google has a specific API for adding context menus. You can read about it here. Just be sure to request permissions for context menus in the manifest.json file and then you can add everything else to your background JavaScript file.
I don't think it's exactly possible to embed a YouTube player into the extension directly. Google Chrome will not allow for running inline scripts, which are clearly required to run YouTube within a popup page (or anything else, for that matter).
As for your third question, you would have to check into the individual APIs for any sites that you want to run the extension with. Every site is going to be a little bit different and my first instinct is that most sites are not going to allow for directly adding their player to the extension.
I would strongly suggest checking out the information about developing Google Chrome extensions available on Google Code. They provide a great tutorial and reference for the basics of developing extensions.

Related

Web browser interface using HTML/CSS/JS?

I’m building a simple browser, and I’d like to code most of it using HTML/JS/CSS. I cannot use iframes to display pages, due to frame-busting. What are my options?
The browser is not meant to be production-quality, but as a proof-of-concept for my thesis, similar to this interactive mockup. The main features it will need to support are:
Loading any page without frame-busting (even google.com),
Detecting when a link is clicked and opening it in a new frame, with the original one remaining intact.
I intend to write this using Web technologies, but it’s OK if it needs to be wrapped up in a small amount of something else, e.g., to turn it into an Android app. However, if it’s possible, it would be best if I could load the app as a web page. Finally, it is also preferable to be able to run the app on an Android device, but it’s OK if it only works on a desktop.
In researching this question, I came across a few options:
<iframe>. Google.com doesn't load at all in an iframe. I tried using the sandbox attribute, but it still didn’t load. Is there a way around this (for any page)?
Mozilla’s Browser API. This API was supposed to allow you to use the mozbrowser attribute in an iframe when building FirefoxOS apps. I suspect there’s no longer any way to access it. I couldn’t get the sample browser app loaded, and it seems that mozbrowser is not supported in WebExtensions. Did I miss something? Is there a way to make this work?
<webview> in a Chrome app. This is the only option that worked so far. I was able to download and install the sample browser app in Chrome. The one downside is that it seems to be Chrome-only (and I would prefer cross-platform or Firefox, all else being equal). Are there any issues with this option? Any way to make it run without Chrome?
Electron app with <webview>. While the setup here is more complicated than the previous option, it seems like the code would be very similar (there’s even a similar sample browser app). Are there any advantages/disadvantages to this option over the previous?
So, are there ways to make options 1 or 2 work? Are there perhaps other options?
HTML/CSS is a "language" translated by the browser into pages. You cannot code a browser in HTML. The easiest solution is to code it in C#.
I'm not sure if this is a good solution, but you can try Electron (nodeJS). You will only need to use JS/CSS/HTML.

Opening Chrome App from website (without extension)

I am trying to open a chrome app (this one here- https://chrome.google.com/webstore/detail/text/mmfbcljfglbokpmkimbfghdkjmjhdgbg) from a link/button within a website.
I have found similar posts about this topic but the answers say you need to make your own extension. I have seen in another post that you could use chrome.management.launchApp but I believe that this requires you to make your own extension.
My questions are -
1-Is it possible to do this without an extension
2-If not, is there an extension that is already out there
3-How would you implement a link to a chrome app within a website
I am sorry if my knowledge on this topic is a bit basic as I usually stick to html and css.

downloading parts of a html page on an event

I am developing an universal windows app. I need to download a webpage and extract images from it.
I got the html code and extracted the links to images and downloaded them. The thing is, the site has infinite scrolling (like facebook). When I scroll down to the bottom it loads more images. I am not able to incorporate this into my app. I am a beginner and have very little knowledge of web development or windows app development. This is my first app. I am stuck and have no idea how to proceed. I don't want to use webview as it displays ads from the site and other unnecessary contents. I only want the links to those images. Please help me go past this situation. I need a way to download the new html content that the site loads when user gets to the bottom or some other way to get the image links.
Thanks in advance.
You may or may not be a me to implement this specifically because of the reason you stated. You need to determine how the site loads this information. First I would download Fiddler and in turn enable https connect logging so you can see your encrypted traffic going through Fiddler. Btw the Web View has events you can hook to see loading URLs, etc and it can also be hidden.
So again you need to first understand how the site you want to do this on works and emulate that, assuming they don't have an api already to give you this information as mentioned I'm the comments.
When you do that, come back with code examples and you'll get better help.

Is it possible to detect a HTML video playing on a browser?

I want to know if a html video is being displayed on a browser, from outside said browser, ideally without any plugins or such.
Motivation - I am trying to add this feature to Caffeine which is a Linux utility which disables the OS screensaver if, say, you are watching a movie.
The flash support was done I believe by detecting the presence of particular files or folders created by the plugin.
Ideally I would like 1 solution, but if I get 2 solutions for Firefox and Chrome, that's good enough.
p.s. Ultimately this would involve python code, but I am not sure if that is sufficient to make this question on-topic, or if this belongs on Superuser or Unix&Linux
This reminds me of something a web browser I was building in VB .Net which needed to detect if there where web pages that had tags like <a href="tel: or <a href="smsI know you said you didn't want a plugin but I would think you could easily right a browser plugin for for just this. In fact not exactly what your looking for but theirs a script monkey script called Hangouts Unlimited which prevents you from getting annoying messages asking if your still awake while in a G+ hangout. I don't know much about python but I would recomennd trying to identify the elements of the tags and when ever it finds such tags to disable the screen saver. Obviously the hangouts unlimited doesn't affect the web browser and that is most likely why you prefer not to have a browser plugin because you need to access system files outside of the browser. But I hope this helps a bit.

What are Chrome apps vs plugins vs extensions and how to develop them

I am trying to understand about Chrome (browser) development. I am very new to this and trying to figure out where to start in order to develop for Chrome Browser.
Just have a couple of questions:
What is the difference between Chrome Browser apps vs. plugins vs. extensions (not sure, if this question make sense. But, hope you got what I am asking for)
What kind of applications can I develop for Chrome Browser
What technologies do I need to learn in order to develop for Chrome Browser.
To answer your first question this explains the differences between apps and extensions (I think there's no better way to explain their nature):
https://developers.google.com/chrome/web-store/articles/apps_vs_extensions
What do you mean with "what kind of apps"?
You can develop both hosted and packaged apps if is that what you intended, give a look at this:
https://developers.google.com/chrome/apps/docs/index
Anyway the easiest way to start would be by building an extension, how-tos and
good documentation makes it good to start with:
http://developer.chrome.com/extensions/getstarted.html
Just to add to the above answer which was missing difference between Plugin and Extension is:
Plugin is a third-party library that is plugged-in to the browser and allows for being embedded on a webpage. It affects only the web page that is using the plugin.
Extensions change the browser UI, add menus or change overall look of the browser and can process each page that gets loaded.
So to sum it up - plugins add functionality and extra features to a particular webpage while extensions add functionality and features to the whole browser and change the behavior of the browser.
Just to add on new information since people may continue to hit this question: Chrome has basically deprecated plugins as of March 2017 (Chrome 57). If you go to chrome://plugins now, you won't see anything (you used to see a list of installed plugins with enable-disable links like for extensions).
It seems the reasoning is that the only plugins they actually wanted to allow you to enable/disable are Flash and PDF Viewer, both of which were moved to the Settings menus (if they weren't already there, not sure). The rest are considered to be integral parts of the browser. https://www.ghacks.net/2017/01/29/google-removes-plugin-controls-from-chrome/
Makes things a bit simpler to think about now.