A banner type "Recent Reader" and Call for Co-work

At first I am trying to use gadget of Friend Connect, I notice that it was all vertical spread, but sometimes we need a banner type (horizontal spread) gadget, in fact, the first three gadgets is a prototype, if I want to use, I must make customized.

Now I notice that the "recent readers" is most popular gadget as I thought, I have written a banner type recent reader gadget when published, but I don't want to confuse the users, so I didn't publish it.

The URL (URI) of this gadget is "http://login.tw/gfc/recent_banner.xml", it is horizontal spread, so you can use the foot of your website or blog, there is a demonstration in my web, you can check in "BlogLook", or "bloG gOOd reaD", it look like as below illustrated.

At this time, I want to call for "Help" or "Cooperation", Is there anyone want to write such these gadgets for Open Social or Friend Connect, please contact with me, in fact, I am not a good programmer, My specialist is something other in Algorithm or other, I will very thank if you can join this project, you can use gtalk in sidebar, or give me a note.

I am long for your volunteer.


Plans for Login Card (A Friend Connect Gadgets Project)

There are a lots of plan to write gadgets for Friend Connect, in fact, I have written dozens of gadgets for blogger in Chinese, it called "Blog Look".

The plans for new gadgets is focus on Friend Connect, it has some goals:

1. OpenSocial: It must be using OpenSocial API.
2. Useful: It must be useful gadget.
3. Fun: It can add some fun stuff, or game concept.
4. Statics: It record the usage of user, and analytics the behavior.
5. History: User can see the history of the gadget.

Now, we (me and friends) plans 2 system for the gadgets:

1. Auto Recording History: it will record the member usage in this web/blog.
=> You can see who is the #100, #300, #1000 user reading this site today or history.
=> You can see who is the most loyalty reader coming here last for how many days...
=> and so on...

2. Message System: Like old time BBS, there are a note for next user.
=> You can message to next user
=> Member can message to particular user or Owner
=> Owner can mail mailling list to all users
=> and so on...

In fact, there are many ideal can be work out, but I know I still have hundreds gadgets to write in to do list...

Last night, I write a article in Chinese to tell experience of this project so far and more detail about this project, you can use translate program to read "Friend Connect Custom Gadget 經驗?", or wait for me to write more articles here in my bad English.

At last, I thank for Adobe Master mention me in article.


Google Friend Connect Custom Gadget work on IE now....

In fact, there are some changes since yesterday.

1. Before today, IE will halt by Custom Gadget.
2. Each site need to login again independly.

I think the last post "How to use Custom Gadget for Friend Connect" can be expired now.
Thank the Google Friend Connect Teams working hard, and We know there are some bug report that even the offical gadgets failed in IE today, I think it must be side effect while GFC debugging.

Anyway, you can take 3 gadgets freely now, see "Custom Gadgets for Google Friend Connect", if there are any bug, please free to tell me in wall gadget or gtalk session.

Login Card: Your Login tw Internet World (A Real Opensocial Gadget)

This project was started from last Thursday, and I took 4 days to determine the name of the project, It called "Login Card: Your Login tw Internet World", using the "login.tw" domain.

In spite of "Login.tw" is a project call "勇者登入卡: 你的網路第一人生", means "Brave Login Card: Your First Network Life", because this is a real life game using user's network usage profile, but the project was halt cause all of co-worker are busy including me.

It was a project for Yahoo Open Hack Day at first, but it wasn't won because it was not done in that day, but we hope this project can be go further.

After Google announce the "Friend Connect", I feel it will be a new start of "login.tw", so I took 3 days to thinking "How to write a real Friend Connect/OpenSocial Gadget"...

And you can check about last 2 post about what are these gadgets for, and I thank "Epeus" that he is using our gadget already even we are not ready, but after the link problem solved and avoid error for Internet Explorer, I think the first 3 gadget can be announce launch, and we must start to work on official site and what we really want to do. These 3 gadgets are just a test, not a real work even it will work now.

I wonder is there any one can write an illustration "how to using these gadgets" for me?


How to use Custom Gadget for Friend Connect

I think there are lots of people meet this problem, that the custom gadget for friend connect can cause error in IE 6 and IE 7, in spite the Microsoft provide 2 solutions, but these all need user to do something, ..
1. Adjust Security Level
2. Upgrade to IE8

I take a look, it need to be fix a lots in friendconnect.js or SocialNorms.js, so it can't be done in each custom gadget, so I use a method to judge which browser user using, if user use IE 6, IE 7, so disable this gadget.

As we know, we goes to "Friend Connect" to add site and gadget, and when we add a custom gadget, we input the url of the module, like "http://login.tw/gfc/recent.xml", we will get a generated code as follow:
<!-- Include the Google Friend Connect javascript library. -->
<script type="text/javascript" src="http://www.google.com/friendconnect/script/friendconnect.js"></script>

<!-- Define the div tag where the gadget will be inserted. -->
<div id="div-1229147868491" style="width:200px;border:1px solid #cccccc;"></div>
<!-- Render the gadget into a div. -->
<script type="text/javascript">
var browser=navigator.appName;
var b_version=navigator.appVersion;
var version=parseFloat(b_version);
if (browser != "Microsoft Internet Explorer" || version > 7) {
var skin = {};
skin['BORDER_COLOR'] = '#cccccc';
skin['ENDCAP_BG_COLOR'] = '#e0ecff';
skin['ENDCAP_TEXT_COLOR'] = '#333333';
skin['ENDCAP_LINK_COLOR'] = '#0000cc';
skin['ALTERNATE_BG_COLOR'] = '#ffffff';
skin['CONTENT_BG_COLOR'] = '#ffffff';
skin['CONTENT_LINK_COLOR'] = '#0000cc';
skin['CONTENT_TEXT_COLOR'] = '#333333';
skin['CONTENT_HEADLINE_COLOR'] = '#333333';
google.friendconnect.container.setParentUrl('/' /* location of rpc_relay.html and canvas.html */);
{ id: 'div-1229147868491',
site: '00249003971097702571'},

The green code mean the option you input, the blue code is the system provide differ by each site and gadget, the red code is what we need to insert manually, ...

So you can use your google module or any custom gadget with your site/blog.


Sorry for Custom Google Friend Connect Gadget

One of my friends tell me that there is a problem while using IE to read the gadgets, cause I am using Mac to develop, so I didn't notice that.

"OpenSocial 客製小工具 Custom Gadget" said that it is a common problem for all custom gadget for google friend connect, and this is an known issue, so please don't use these custom gadgets or you really deny users using IE (like me).

I will try to fix this problem but I don't know how to fix it, but you can using fixing "Security Restricted Sites" like "Fix: IE7 with Sitemeter: Operation aborted", but this is not a really good ideal.

There are two ways to escape this problem, one is denying all visitor using IE, like:
var b =navigator.appName;
if (b == "Microsoft Internet Explorer") exit;
but it is still not a good way, another one is try to fix the problem, cause it is caused by "innerHTML or appendChild", not by XSS as I guess, ...

Thanks for Mr Stack(?) from keusta.net encourage me a lot, and hope I can write "How-To", I think this is a good ideal, but as a matter of fact, I am not a good author to writing instruction, but I will try my best.

I hope I can deal this problem tonight, otherwise, it will fixed in next week, cause my schedule is full by my family.

Oh, there is another issue about link, all of the link is not available, cause the Google Friend Connect does not provide this data, I think it will be available later or I will try to find other data to replace.

PS. After 3 hours, I add a escape condition while user use IE 6 or IE 7, you can add
var browser=navigator.appName;
var b_version=navigator.appVersion;
var version=parseFloat(b_version);
if (browser != "Microsoft Internet Explorer" || version > 7) {
before "var skin = {};" and place a "}" after "skin);", and it will preven IE 6 or IE 7 user goes to die...

Custom Gadgets for Google Friend Connect

I think there must be lots of people find Google Friend Connect is very fun, I do~~~

Because my bad personality, I try to write some statics gadgets base on Google Friend Connect, especial for it's "Community Base", that is, you can statics by members, not for all.

This is my first time to write such gadget, so I learn from the Demo "Lame Game".

I wrote 3 gadgets tonight:

1. Time Elapse:

2. Recently Reader:

3. Hits Ladder:

All you need to do is go to your Google Friend Page, you can see "Social Gadget" in your each sites/blogs, there will be a "Custom Gadget", while you click in, you can see there is a textarea for "Gadget URL", if you want to know the Hits Ladder of your member, just input "http://login.tw/gfc/hits.xml".

you can see the illustration above, but I use "Time Elapse", so it is "time.xml"

I want to write some fun gadgets, and those are under development, but I think these 3 gadgets will work fine and you can have fun with them.

(You can see Illustrate on my blog: http://gene-hong.blogspot.com/, I put all of them in sidebar)


Database Upgrade

I think there must be some users notice that since 06/16 that there is sometime out of service, cause I upgraded the database.

There was a lot of trouble during upgrading, but I fix most of situation last night, so the system will operate normally from then.

I know there are many function can be upgrade, but I don't know how much time that I can do, so if there is anyone interesting this system, and you can help me make this better, you can tell me freely, I need all kinds of help beside coding~~~

Anyway, I make my apologize the system down without announce in advanced, cause the system is almost overload, and I make most of effort to fix the problem, thank you all folks.


Yours MyMiniCity -- How to read City detail (I)

I know I am a numeric maniac, I keep track many statics fro MyMiniCity, Let see the detail of a city.

First of all, you can see the red words:
Add This City To My ListThe red icon provide you set this city to your list, so that you can see the list of your watch in MyList, so if you want to keep track of this city, just press it!

and following line is
This city is in Taiwan, the data is 8 minuite(s) ago
It is easy to see which country/region the city locate. The system fetch the latest data for interval, the interval according to the size of your city and latest increasing of the city, it might be in 5 to 50 mins.

Next is a huge table:
BlogLook XML RSS RankingNow: 2Today: 2Yesterday: 3
ItemsThis HourLast HourTodayYesterdayTotal
Unemployment Now0848 (49359)
Transport Now100164 (48675)
Criminality Now02037 (50548)
Pollution Now0600
I think most of data is easy to understand, but I must explain four numbers I mark as red and green. The red number mean if you don't increase your improvement, how many people you can capacity or how many people you can increase. In this example, the city can increase more 848 peoples to keep unemployment zero, and transport can support upto 48675 peoples. The green number is how many industries you can improve, but this is just an approximate number, cause it will depend on your population and commerce later.

The next line is:
Set My Primary
It will be use for exchange link, cause the city will count your hits for your primary city, so if you hits other city more, your primary city will get the higher rank of the exchange link.

See Neighbor City
The data from neighbor city depend from all the user watch list, this is a relational analysis algorithm, but if your friend use the system more, the data will be more correct.


Yours MyMiniCity -- Dynamic Signature

I found there are many user in http://createmycity.xooit.com/, and this is a forum for MyMiniCity, but it can only use images for signature.

So I create three type of dynamic signature for myminicity.

1. Line Graphic:

The line graphic drawing everyday progress, population and construction, the blue line is population, the yellow line is construction.

The construction means total of 5 improvement, Commerce, Environment, Industry, Security and Traffic, cause if we use 5 lines to draw, I think there will be too noisy.

The usage is like http://mmc.urs.tw/images/days.php?mmc=yourcityurl

2. Recent Detail:

It's a table present this hour, last hour, today and yesterday population added, and improvement added, and last column is status now.

The graphic cached for 5 minutes, and expire 5 minutes, so it may be 10 minutes ago data.

The usage is like http://mmc.urs.tw/images/table.php?mmc=yourcityurl

3. Week Progress Table:

It show only population and rank for recent 7 days and now. The title show the status of Unemployment, Transportation, Criminality and Pollution, if the number is 0 or 100, the color of number is blue, otherwise is red, and the Trans use "-0" for 100.

The usage is like http://mmc.urs.tw/images/week.php?mmc=yourcityurl

I hope these images can be useful for you, I will make some images for vertical in sidebar, not only in signature.


Yours MyMiniCity -- Introduction

I think there are many articles talking about MyMiniCity, even there is a forum in http://createmycity.xooit.com/, and there is a FAQ.

"Yours MyMiniCity" is a system assist you to play myminicity, especially in progress history, and provide the widget you can put in your Blog, but most important of all, there is a check list to make sure you can click all the cities of your friends.

1. MyList -- You can make your own list to know the city status of your friends..

2. Detail of your city -- you can check recently status and long-term history of your city, and provide you detail to make your city grow.. Like Below:

BlogLook XML RSS RankingNow: 7Today: 8Yesterday: 9
ItemsThis HourLast HourTodayYesterdayTotal
Unemployment Now0117 (6201)
Transport Now100551 (6635)
Criminality Now0116 (6200)
Pollution Now0N/A

3. Google Tool Bar Gadget -- You don't need to go to this site to check your status by using google toolbar plug-in.

4. Status and History Widget -- You can put the widget in your blog, to keep track of your blog, Like Below:

5. Click Remind Widget -- You can put the widget in your blog to remind you and recommend your friends to click the city listed. Like Below:

6. Automatic Anchor -- Providing the static link to make every click available, the click will automatic make decision which construction your city need.
Like http://mmc.urs.tw/c/genehong

I am not the one to write good introduction and how-to, so make your try and have fun.