Creating a Notification Icon with Dojo 1.9 - javascript

I want to create a notification icon with Dojo, but I'm not sure where to start.
The icon has to be similar to those found on Facebook and Whatsapp, showing how many new messages/notifications you have.
I've been looking in the Dojo reference, but couldn't find a good widget to use. Maybe I'm missing something obvious, but I might as well ask it here.
Googling hasn't been of much use unfortunately.

As far as I know there's no widget that automatically does the stuff for you. This problem is far too specific to provide a general widget for it. You also have to think about several things before you can start.
Do you want to use WebSockets? The web is generally made for pulling content, if you want to push your notifications from your server to your client, then you will need to look at WebSockets. A good tutorial to use them can be found on Sitepen.
If you don't want to use websockets (you're not able to create a websocket server or you have some other reasons) then you will probably have to use a simple "REST service" and obtain the amount of notifications from it. This means you're script won't be "live", so you will need to pull the content from the webservice every X seconds/minutes. This means you need a normal AJAX request which can be done with the dojo/request/script module.
If you need to time this AJAX request, you can use the dojox/timing module.
This is only the "logic" part, the user interface (icon + # notifications) can be made by yourself with plain HTML and CSS.

What about dojox/mobile/Badge:
http://livedocs.dojotoolkit.org/dojox/mobile/Badge
?

From comment:
"Maybe you can find something in the DojoX library" -
off course you will find much.
I would recommend
dojox/socket
see http://dojotoolkit.org/features/1.6/dojo-websocket

Related

Wordpress to other source rest calls with username / password

I have been asked to create some custom content on a wordpress site, basically just some web app stuff (html/css/js), but leveraging data from another source via restcalls. There is a service account un/pwd required, and I am wondering what is best practice/approach in terms of the cross site calls with this un? The wire is encrypted but I certainly don't want to store the creds on the client (wordpress admin stuff). I am assuming there is a mechanism to store such on the 'back-end', filesystem, but I am not even sure such access exists? How you get to this....I have gone through the wordpress admin board and haven't found anything that provides access to the filesystem/php files, etc. Perhaps I am not looking in the right place or after the wrong bits?
I have googled but am such a noob with wordpress I am not even sure I have the right approach in mind; any help/advice is greatly appreciated.
EDIT: so if curl is the standard approach for this type of thing, where/how am I able to access the filesystem/php? Is there a specific place this type if thing lives or a convention of where it is placed? Just help with some 101 direction please.
First things first, you will need to develop a plugin for WordPress to properly hook into everything and play nice with everyone else. There are many tutorials for getting started. Here's one that integrates with an API
If you have to store things to make your plugin integrate with this third party, you should use the Options API that WP provides to you, with the information set from a settings page. Please don't hardcode that into a file somewhere in the code. (I'll also mention if you need something more powerful than the plugin options, you can add custom tables)
Now we have code running on WordPress with the information it needs, now it needs to do something. To pull the information from this third party, we can use PHP cURL.
Last, depending on how we want this information to end up being consumed by the user. We can do something simply such as just fetching/injecting the data during a regular WP page load on our custom page. Or we could be fancier and set up a WP REST API endpoint that re-serves the information we got from the 3rd party. Shortcodes? Widgets? Custom Templates? Filter Hooks? There is a lot of ways to present our final interface to the user.

how to update a value direct once its change(client side)?

For example: i've changed "user balance" in my database, how to update this value direct on client side. So my client in this case see that change immediately.
I don't like to do it with jQuery since it will be slow with required speed and will makes some performance troubles.
a website called blockchain.info does that somehow, maybe he is using websocket.
BTW I tried to use Ratchet webSocket but I don't know how to link each connection to specific client.
Any help would be appreciated, ask me if you have any questions.
If it is a new project, try using the meteor framework, but I don't know if such a drastic change makes sense for the size or stage of your project or the criticality of your requirement. Meteor is very good for "subscribing" to changes in data and updating the view based on that. In fact, it is very trivial in meteor. However, moving your entire application to meteor may not make sense, only you can decide. Check out https://www.meteor.com/
I commend your dedication to efficiency. Maybe take a look at this site to see if thats what you're looking for.
AJAX with Vanilla JavaScript

Make Mithril application SEO friendly

Me and my friend have created a website which we want to use as en experiment for school purpose.
https://www.daniellindgren.se/
But we are encountering some problem when we want Google bots to crawl the subpages, like CV and contact.
When we use Google webmaster tool to how the indexing from Google goes, it says that they can't crawl anything else then the startpage.
We have built a sitemap and we have also declared that in the robots.txt.
But we read somewhere that Mithril can cause problem for Google bots because their links to subpages starts with an "?".
Is there any workaround for that we can use or what other solution is there? Should we maybe try to re-make it a single-page application instead?
I don't see any "?" in the links on your site, and in general Google should be able to index SPA:s nowadays.
But it's not always working, so an option could be to use Mithril to render the templates server-side as well. Depending on your backend it may take a little bit of work. If you're using Node.js it's easy with mithril-node-render, if not I recommend Haxe and mithril-hx for cross-platform support.
Then you need to change the routing strategy so a request from outside the application hits the server as well. Unless you think about it from the beginning, you probably need to rewrite quite a bit of the backend to make it more isomorphic.
But your site doesn't have much client-side functionality however, so as it is right now, I'd treat the site as a non-SPA, and use Mithril when you want some dynamic, ajax-driven functionality.

Create a plugin to add my website functionalities on another website

I have a website A with a database and a search engine of some object, user can create account on my website then add comment for these objects.
I need to create an api with something like a plugin, it will result on having the seach engine on another website B.
I have planned to do like fb or twitter plugins : the dev who want to use my api will just need to add a line of js, and a line of html on website B, then it will load the plugin. But I'm wondering how to organize it.
Here it what I've guessed : I create a page on my website A, put the search engin on it. I create a js that will load this page whithin an iframe, on the dev's page (website B), under the div he added to have my plugin. Then I implement OAuth 2 (with a provider and so, so people can do post requests to alter my db), and people who is one the website B will have the ability to post comment on the objects of the search engine on website B.
Actually it seems to be the same as fb comment plugin process, but it seem too complicated to do all that stuff. Is it the right way? Can anyone detail the problems that I should face during implementation?
You need to develop a decent API which can return search result in JSON (and XML if you want to please everyone). That already would offer other developer the ability to use your site functionalities, that's mostly back end work tho. So they can develop their own widget.
To develop your own widget as a search widget you don't need that much, you just need either a set target (maybe a required element) or/and an initialization method (more flexibility for the dev) to which you pass a target.
Bind the search button, grab terms search, call your API and when you get your result display them or/and execute a custom callback pass the result as an argument, flexibility)
If you do your javascript well you can create a little API there too which facilitate the usage of your API via javascript. And then even easily port it to a jQuery plugin or something similar.
When serving JSON always remember to set your headers for your API to allow for crossdomain or go for jsonp instead.
Your question implies an architectural direction, but the requirements are too broad for such a choice. I would narrow down your requirements first. OAuth 2.0 could potentially help satisfy your needs, but ask yourself at least the following:
What user data needs to be protected?
What 3rd-party data access is needed? What functionality?
If you go with OAuth 2.0, are you prepared to follow a spec which is still changing? Are you willing to be the authentication provider?
What server-side languages/platforms are acceptable?
What other security considerations are important to you? (Such as social sharing, level of 3rd-party app trust...)
How much are you willing to rely on 3rd-party tools? Or write your own?
I agree that modeling your design off FB or Twitter or Google is not a bad idea, as they have done this sort of thing.
You might have a look at the new book Getting Started with OAuth 2.0.
Here are two simple ways of making custom search available to users.
The simplest option is to do what Google does - the search on your site would follow a simple, well defined API - so that
www.mysite.com/search?q=keyword1+keyword2
returns a list of results in HTML.
Then you'd tell your users to include a snippet of HTML:
<form action="http://www.mysite.com/search" method="get">
<input name="q" type="text" value="Search">
</form>
That would do, though at this juncture you may want to improve things with better search options, a javascript wrapper for the search form, a JSON or XML format for the data returned, security, a better worked out API that takes all these into account.
Another way is to use javascript and provide the data with a callback facility, so the URL:
www.mysite.com/js-search?q=keyword1+keyword2&callback=someHandle
will return a javascript file containing JSON data and a call to "someHandle" when it is loaded. The developer using your API have to write their own way of making the request and the handler. Bear in mind that because of XSS, the queries would probably come from your partners' servers. The simplest is probably to make your own search offer simple and well-documented so others can exploit it.
OAuth 2 could be helpful just if you would allow the website B to make POST request to the website A in background.
Instead if you want allow the users that visit the website B to post a comment then the iframe with a form that point to the website A is enough.
The easier bet, yet not necessarily the wisest, is to create some JS which calls on your website using JSONP.
iFrames are not W3C standard, try avoiding them if possible. Code a Javascript with some events that will do some JSONP calls into your own server and return the results in Javascript accordingly, so it would be able to interact with the page.

Widgets in Rails

I have a business that I outsourced all of the tech for. Its essentially a widget on an external site, with a management panel on our domain selecting whats shown on the widget. Lets say its a manual "relevant news" widget.
I think I can code the rails part, but how would I do the widgets part? Can someone point me in the right direction? The widget would need to be JavaScript and copy/pastable.
(More context, having to use the old system thats in PHP, and it breaks my heart having to ask the outsourcers to help me with every little thing, so I'm looking to rebuild it)
EDIT: how much of this is still valid? Its posted from 07 - http://www.igvita.com/2007/06/05/creating-javascript-widgets-in-rails/
Thanks!
Geoff
you could create a json api using https://github.com/fabrik42/acts_as_api (imho, this is the easiest way to create an api)
and then create your widget in pure javascript or jquery.
If you need to authenticate, you'll need to send an api key with your requests, and also on your server side check the request.domain with the api key you have given that domains webmaster.

Categories