I have a project where I need to create a desktop app that acts like a browser, however, I need to be able to execute my own css and javascript on ANY page that a user goes to. The goal is to have a user be able to browse to a website, and then click on certain elements of the site and quickly pull information regarding that element (divID, classes, etc), then add some javascript inside the browser that will add some new functionality to the page (though only in the browser). I'll also need to sync this desktop app up to both an internal database as well as connect to a remote database online.
I'm a javascript developer, and so I really want to be able to use jquery to help build out the interaction with the site. I've played around with adobe air, and was able to build a browser using flex, but then I wasn't able to use jquery to manipulate the pages (maybe there's a way, but I don't know flex at all, and I couldn't figure it out and didn't want to waste too much time to discover that I couldn't do it). I then tried to create an HTML air app and have the browser essentially be an iframe. However, the cross domain scripting became an issue, and I don't think that the iframe sandBox solution is what I'm after because that looks like I would need to create a local version for each page that is browsed to, and then alter that local version.
So, I'm back to square one and am trying to find what technology I should be looking at where I can add my own javascript and css to a page within a browser? I'm familiar with javascript and PHP, but this will be my first desktop app. I'm willing to learn a new technology though I obviously want to be able to stick to what I'm most familiar with. I've thought about building a firefox plugin, but I'm hoping to sell this app, and I think a stand alone app would allow for a higher price tag.
Try Adobe Air. It's cross platform, has the ability to create "real" apps, can load and process HTML and CSS (has webkit built in), and allows for the creation of applications using HTML/CSS/JavaScript. If you're looking for something more freedom loving, check out Titanium, which is a similar framework.
Related
If you look at the image, there are shared web pages between the 3 applications, Web, Mobile and Touch Browser. I need to report the web pages uniquely per application. So if web page A is loaded, it will need to load different JS libraries for each type of application. Currently a JS bootstrap loader file handles the logic to load the proper JS libraries but that is a 1-to-1 relationship. I now need a way to determine which application is loading the web page and load the appropriate libraries (DTM libraries but irrelevant). The solution would have to reside in the JS bootstrap loader file logic. I’m looking into using the navigator object to sniff out which type of application is requesting the web page but not sure how feasible that is? Maybe feature detection is another way but not sure how/if this would work with the applications? Any ideas?
You might want to take a look at this article: http://www.stucox.com/blog/you-cant-detect-a-touchscreen/
As far as I'm aware, there's no good/reliable ways to specifically detect touch devices, and even if you could, how would you differentiate between a phone and a HP Spectre laptop, for example?
Sniffing for UserAgents can get you some of the results you want, but it's considered to be a suboptimal solution.
Cloudflare gives you the ability to serve different sub-domains for mobile devices, but I'm not sure what criteria they use.
Screen width is a reliable way of detecting whether your content will fit or not.
You can do this in javascript by detecting screen width and redirecting them, but that would be quite inefficient to load the page only to redirect them, so you may want to look into server-side detection: https://webplatform.github.io/docs/concepts/Detecting_device_and_browser/
Hope that helps somewhat.
I work for a medium sized company that has an application used by a few thousand people and is built primarily with HTML,Javascript, aspx, xml, xsl, and runs on IE 11. This application is proprietary and not designed in house but we have access to the code for possible modifications and its just sitting out there on the server(s). A new project has come down the pipline for an enhancement\adjustment to be made to a particular area of the application and I'm wondering what kind of web framework I could use to do this work. I am really just needing to call an enterprise service and get data back, display it, and that's about it, so its not incredibly hard. I am worried though about how to integrate it with the existing application.
I am not sure how this scenario would go:
User navigates to page A inputs data, I want that data to go to a controller or something I built, fetch info and send it back to page A. I was thinking of using Spring MVC but not sure. Any feed back or suggestions would be greatly appreciated! I know this question doesn't include code, so please don't hate me.
Thank you.
From a very high point of view and with no knowledge about any specific requirement.
If you have already an application developed in ASP.NET, it's better that you continue the development of the new module of the application on the same platform.
If you want to develop a new module (actually a new web app) that looks like the old application but with a totally different platform like Spring MVC (could use any other), you can reuse the existing css styles and databases.
For integration purpose you could modify the original application in the menu(or links) that redirects you to the new module and implement a single sign on server (this will required work on both applications) to made the transitions smoothly between both applications (something like a portal style). Note that they will have a different context application path.
I am trying to find a way how to build a browser web app that runs in 2 monitors, like;
i have a secondary monitor that i want to put there some window, i want it fullscreen, and automatically in the secondary, so no drags, while the main app should stay in the primary monitor, where is the browser... no way seems, nothing really works so the only way seems to be with some desktop app.
I don't really care if the solution is browser dependent at this point, but still can't find a real solution.
Does a ny body tried something like this and can give me some ideas how to build it?
EDIT
... i need the second monitor to have some specific content, so not a clone of the primary...
kind of... i'm playing some game in the first monitor and i see statistics on the second...
What you are trying to do is not possible yet, but there is a Presentation API that is being discussed that would let you do exactly what you are looking for:
This specification defines an API to enable web content to access external presentation-type displays and use them for presenting web content.
Unfortunately, it seems like there are no browser implementations yet.
Your only other option right now is to use 2 independent browser pages that communicate with each other somehow (LocalStorage, WebSockets etc.).
I wanted to ask if there is any alternative to JavaScript/AJAX.
My goal is to have functionality of dynamic content without reloading the page. My problem with JavaScript/Flash or any other plug-ins is that user can disable those.
I already did some research and found Google Dart but this is implemented through JavaScript so it doesn't help.
TL;DR - I want an alternative to JavaScript/AJAX, which cant be disabled so that every user will see the same web page without having disadvantages through disabling plug-ins.
There is nothing like what you're describing that a user cannot disable. Nor should there be. Users should be the ultimate arbiters of what runs on their machines.
JavaScript and Ajax is your most broadly-supported solution. Yes, users can disable it, but globally, fewer than 2% do and it's easy to detect that they have and present a non-JavaScript version of your page (or a message saying your page isn't accessible without). Also, note that JavaScript is not a plug-in for web browsers; all popular browsers (and most niche browsers) support it natively.
Flash would be your next stop, but despite the Flash plug-in having great penetration there are more users without Flash than without JavaScript (anyone using an iPhone or iPad, for instance). Also, since Flash has been used so heavily for irritating advertising, a lot of people install Flash blockers that prevent the Flash app from running by default, requiring them to click on it to run it. (And of course Flash is closed and proprietary.)
There's also Silverlight from Microsoft (also a plug-in) and the open-source version Moonlight, but there are a lot more people without Silverlight/Moonlight than without Flash.
At the end of the day, you need code running on the end-user's computer, which means they control whether that code is allowed to run — by enabling/disabling JavaScript, by installing or not installing Flash (and using or not using Flash blockers, since it's used for so much irritating advertising), etc.
There is no alternative to "client side programming" for doing "client side actions". Evey option that exists (JS, Flash, Shockwave, Silverlight, Unity, Dart, etc.) can also be disabled.
The purpose of this is to allow the user to control every data request himself and protect him from JS or 3rd party plugins security flaws.
JavaScript is not meant to show page content to the user. For that you have HTML.
It's not even meant to style the page. There is CSS for that.
With HTML and CSS the page content can be seen by search engines, and by people using different devices and browsing methods thanks to CSS, even impaired users.
JavaScript is meant to enhance the functionalities of a web page by allowing a smoother navigation for the user. It should not be used to show content impossible to see if JS is being disabled.
If using AJAX, be sure that each content loaded with AJAX may also be accessible if a user has JS disabled using normal links.
First develop your pages without thinking about JavaScript or other scripting/plugins technologies. Let your pages be fully navigable for every user and every browser.
Then, use JavaScript to enhance the site navigation and give users with JS enabled the best user experience possible.
I'm looking to create a cross platform Mobile App and have been looking into Developing using PhoneGap. I'm an amateur programmer and most of my knowledge is in ASP.Net and C#.
Will only being able to use HTML, CSS and Javascript with PhoneGap limit me to specific functionality of my App? and would migrating to HTML5 help in adding more functionality to an App?
I'm looking to be able to Populate Drop-Downs from a Database, Add/Edit/Delete Items from a Database, Create Reports Ect...
Your only real limitation as far as data access goes is that you're limited to an SQLite database, which to be honest isn't much of a limitation since it performs great for single-user access.
The short of it is that you have access to a database from within your app, so you can do whatever you need to. The tools are HTML & JS as opposed to C# with some graphics layer, so doing things like creating graphs is quite different, but it's all possible.
Also note that depending on what your app is doing, PhoneGap is one of several solutions. If you want a "native" look/feel, consider TitaniumUI -- it takes common code (still JS) and pushes it through some translation layers to create native UI components.