How to build an shipable, "local", branded mini-browser - browser

Since I don't really have a good idea for word to search with myself I’d like to ask you:
Is there some project, technology, w/e that enables you to build a 'browser' with a very slim ui. Just some CI and a customised "starting page".
I'm thinking of something like the Webkit engine (and interface) Valve/Steam uses for it's clients store page.
In what direction should I search for something like that ? How would one start implement something like that ?
Answers to questions:
We need this to provide something like a "Kiosk" application (for touchscreens) and shippable to our Customers. Running a browser in "full screen" is a temporary solution.
As of Platforms: Windows is absolutely sufficient for now, but Mac/Linux wouldn't hurt.
Prism looks nice so far but lacks the "shippable" part, e.g. I see no way of packaging it.

Take a look at Mozilla Prism. It's a "UI-Less" version of the Mozilla/Gecko rendering engine aimed at deploying web apps on the Desktop. It's also multi-platform. It might be fairly close to what you need, with comparably little work.

WebKit has bindings for many languages, is cross-platform, and is full-featured as a HTML engine. A bit of work capturing signals and calling functions will make it into any kind of web browser you like.

You could use Adobe Air, follow this tutorial and include your website within an iframe. That would allow you to build an executable you can ship to your customer.

Various graphics toolkit libraries contain some components which can display a limited amount of HTML. I've seen this in qt (a C++ GUI library) and in Java Swing, and have indeed built a tiny "browser" in Java within a couple of hours. Java Swing lets you attach a link listener so links can be made clickable and thereby jump to different URLs. Thus, my application could be made to work as a very limited browser.
This approach lets you display text, images and links; in the case of Java, there's even fairly good support for CSS styling. However, there's no simple way to make buttons and form fields work, and of course no support for manipulating the DOM or anything else done in JavaScript.

Related

Xamarin.Forms + Custom Renderers vs. Xamarin.iOS/Xamarin.Android

I recently started using Xamarin.Forms for a project. Like the documentation mentions, it's great for prototyping. However, I'm really starting to notice limitations of the shared concepts for UI design. In particular, the inability to set custom button content (such as an image) is aggravating. I'm sure there will be several instances where I'll want to change how controls work.
The way I see it, there are two routes I could take. One, continue using Xamarin.Forms and make use of custom renderers. Considering I would still like my UI code to be shared, but also customized from the basic Xamarin.Forms controls, I'm leaning towards this option. Two, use the native Xamarin projects (Xamarin.iOS, Xamarin.Android). This would give me full control over the UI for each platform, but it would also mean more code to maintain.
Like I mentioned, I'm currently favoring the option to use custom renderers with Xamarin.Forms. Could I get some insight from those who have used one or (preferably) both options?
I've mainly used Xamarin.Forms. For the right kinds of apps (ones that are, well, "Forms"-like), it works pretty well.
Writing custom renderers isn't that hard, but the documentation is, unfortunately, not that great. Depending on what you're doing, it can be a bit tricky at times translating between the native control and the Forms layout engine. However once you get the hang of it, it makes sense, and now that the code is open source, you can peek inside to see how the "built-in" controls work.
There are various extensions that add more controls. Some are free and open source, like XLabs.Forms. So the control you need might be out there already.
You can use mechanisms like TapGestureRecognizer to turn an Image or a Label into a button, so just because the built-in Forms Button is really, really lacking in customizability, you can sometimes find other ways to get the same effect and still stay within pure Xamarin.Forms.
Hope that helps!
XamarinForms is good for sample application who don't need to use a lot of specificity of the device.
For complex applications, I advise you to start on Xamarin Ios and Android.
It will take more time to take charge but you will see it is much more permissive

Browser Extension the "Injected way" a cross-browser extension that include a JS from a distant server

I've found this nice article about the "injected Way", but the author never finished it :
http://hightechstartups.blogspot.ch/2012/05/different-way-of-developing-browser.html
I would like a bare bone cross browser extension, without any 3rd party extensions or framework (to be as light as possible and not dependant on a 3rd party) that would load Jquery and a JS from a distant server and the ability to load it before or after the page is fully loaded.
I've read a lot of topics about the subject, but since IE10, Chrome 26 and FF20 are out with their new cross-link limitations, i was wondering if somebody had ressources, source code or tutorial about the following requirements :
I need :
Cross browser extension supporting (IE 8+ or 9+ worse case, Chrome
26+, FF20+, Safari)
Ability to inject a single JS hosted on another server. Inserts a script tag that references a javascript file in the head of the HTML
page and then be executed
Not be dependant on a third party extension (greasmonkey) or framework (Kango, Crossrider)
Ability to load before or after the page is fully loaded
This method allows me to customise the browser extension depending on the user's location and it also avoid having updates as the JS is updated on each page refresh.
I'm aware of the downsides, but i would like to achieve this.
I'm aware of cross browser framework like Kango or crossrider, but both don't fit me needs.
The closest example i could find is this How can I run a <script> tag that I just inserted dynamically from a BHO
but it only covers IE and as i got very little Csharp experience, i would like to see a full example to understand it properly and learn from example.
I would LOVE to have a few examples, even if it's not cross-browser (IE being the worst part for me).
Thanks a lot for your support !
Update1:
About Kango and Crossrider, Kango is 2000$ if you want to use IE and for Crossrider you're required to be distributed and monetized by them.
I've managed to code for IE and Chrome, but i was looking for an "elegant" way and figured it was the best place to ask given the level of knowledge of people on this site.
For the installer i currently use NSIS, but i'll test Wix too.
Finally i guess the only way for me would be to learn C++ and .net to get it to work with IE, but if anyone could provide more source code it would be great to test speed and compatibility and discuss here what's the best solution.
Why do Kango or Crossrider not fit your needs? Both frameworks allow you to manipulate the page's DOM (which is what you want):
Kango: Adding content script
Crossrider: documentation, example code
If you want to code your own solution, take a look at the relevant documentation:
Content scripts (Chrome)
The Page mod Jetpack API (Firefox)
Injected scrips (Safari)
Injected scripts (Opera)
Internet Explorer does not natively support extensions. It took me about 80 hours to create a stable and reliable IE extension which supports cross-site AJAX, a (preference) storage method and injection of scripts as early as possible in any frames based on its URL. I developed and tested the extension with Visual Express 2010 on Windows XP and Windows 7, for IE 8-10 (the extension might work on IE6/7, but I decided to not support these ancient and rarely used browsers).
First, I wrote an extension in C# based on LiveReloadIEExtension (a sample IE extension, which in turn is based on this Stack Overflow answer - see also this blog post). It was functional, but it required .NET 4, lacked support of frames, and it's relatively slow.
So, I decided to write an IE extension from scratch in C++. A good starting point is available at http://www.wischik.com/lu/programmer/bho.html: Sample code for C++ BHO, which changes the document's background based on key/mouse events. I've also learned a lot by looking at other code samples on CodeProject, topics on the MSDN forums, questions and answers on Stack Overflow, lots of other blogs, and the MSDN documentation:
DWebBrowserEvents2 interface lists several events which you use to find an appropriate injection point.
Scripting Object Interfaces (MSHTML) lists even more interfaces. You'll be mainly interested in the iHTMLDocument, iHTMLDocument2, ... interfaces.
After creating the IE extension, you want to deploy it of course. I used Wix toolset to create a MSI.

NodeJS Skinning

Is there a module or similar things that support skinning in NodeJS? I want to build a NodeJS website, and want to be able to re-skin the website as I like without much efforts, like in Wordpress.
Is skinning supported in NodeJS?
If you're interested in building a website in Node.js and don't need a wordpress-style cms behind it, there are few projects that can help you out.
Have you looked into Bootstrap? It's built with less which you can easily plug in to your Express setup (see the guide here, using the command line executable to set up a new project you can specify less like this: express --css less myapp and it will do all the work for you)
In the bootstrap less file are several variables you can use to change the colours, fonts, sizes, etc, and it's also got a lot of helpers for grid layouts and responsive designs.
It even includes a few useful javascript plugins too which make the ui nicer with less work.
There are also a lot of sites with themes and theme generators around which then work on top of bootstrap, and may achieve what you want.
Plugging in this sort of solution (whether bootstrap or other) is about as close as you can come to getting skinning for node; As otherwise suggested if you're looking for a CMS out of the box as well, probably best to look for another platform like Wordpress.
Node.js is not a content management system. It is a platform on top of which you could built a web server with a content management system. To answer your question you need to be looking for node.js based content management systems that support themes.
The only node.js CMS that I am aware of is Calipso. It's still pretty alpha-stage. It may have some theming support, but it is nowhere near as polished as Wordpress.
Also is there a reason why you want to use node.js? I mean there is nothing wrong in using Wordpress for creating a themeable website - it is just awesome for that.
If you just want another OnlineShop, or maybe a blog, i think nodejs is maybe not your right choose as Jed Watson told.
If your requirements are more complicated, and you want a quick and easy implementation of a nice web interface, and you have html, javascript, and css knowledge... I strongly recommend you just trying to work with MEAN.js
It puts together MongoDB Expressjs, AngularJs, and NodeJs.
Use this, for example with a yeoman fullstack constructor and you will have a powerful webapp, with user autentication, and much more in a few minutes.
After that, the use of jade, less, scss, and similar languages of modelling the front, and the easy way you can also model collections in the back, is for me the best combination you´ll find for creating a website today.
Hope it´ll help you
King Regards

Best choice to build a website like http://www.pageflakes.com/

What is the best language and approach to build the widgets website like http://www.pageflakes.com/. By best I mean rapid development, performance, smoothness and by approach I mean that some one will use drag and drop plug in jQuery (some issues) etc.
Two functionality will be main in my site:
selecting the widget and then dragging on the specified position i like
saving the state without login for the user.
You don't mention your existing language skills which might be the most important detail here. Also, are you prepared to learn a new language/framework for this project?
Some generic advice assuming you would be using Java: since the site in consideration looks more like a web application as opposed to a "web site", a framework which supports rich controls/Ajax natively might work wonders here. A GWT based framework like SmartGWT might be an interesting candidate.

Running C# app inside browser as a plugin

I have a small 2D game engine written in C#, using DirectX. Is it possible to somehow run it in a browser as a plugin? Like for example Flash and others, where you go to a site with a game and it will ask you to install a certain plugin and then you can play the game in the browser, with mouse and keyboard input.
I have searched around for hours and I still don't know what I'm looking for. I have so far primarily focused on Internet Explorer, but there are plugins, addons, extensions, etc I don't know what I need really.
Yes I think it is possible.
For example, I have an HTML page which includes an element like this:
<object id="simpleControl1"
classid="http:RenderTextProject5.dll#RenderTextProject.ScrollableControl"
height="300"
width="300">
</object>
The 'classid' attribute value has the following meaning/syntax:
RenderTextProject5.dll is the filename of a compiled .NET assembly
RenderTextProject.ScrollableControl is the qualified name (namespace plus classname) of a class which subclasses System.Windows.Forms.Control
I can then see the control being rendered in the browser.
I'm using IE (IE8, but it used to work with IE6 too), and I have the .NET framework installed on my machine (but I think I needn't have the RenderTextProject5 assembly installed on the client machine).
There may be some other caveats too (e.g. I needed to run in the Intranet security zone).
See Return of the Rich Client: Code Access Security and Distribution Features in .NET Enhance Client-Side Apps.
Look for Silverlight.. It is maybe not exactly what you need but it is a browser plugin capable of running C# code ;)
There is a relatively new plugin called Unity. It is a bit more complex, as it is a dev/3D authoring environment on its own, but uses C# as its language as far as I know. However I don't know if pure 2D programming is possible (well, may be worked around using ortho 3d?).
The basic version is free to download recently, maybe worth a check.
It is possible to run C# applications in a web browser without using plugins. For example, C# applications can be compiled into JavaScript applications using JSIL.

Resources