From 5 minutes to 30 minutes (android phone)

I came home from work around 7 – 8 pm, while on the way home I either listen to the radio, mp3s, Twitter, Facebook, Vines, Path or Reddit. One of the shortcoming of using it intensively, is the battery life tend to shorten and it is obnoxious. Because the trip from work to home is around 100 minutes, I don’t want spending it by daydreaming just because the battery is dead.

I knew this all along, I never been a fan of saving battery apps, so i have a couple of routine things that i do to save battery. But never have I seeing the benefit directly from my action. Last week, i was Redditing intensively, suddenly i got a warning that battery is only 15% left, that’s quite horrific, knowingly i just charged up my phone to 80% around noonish.

Star trails over Yosemite Falls

The activity that I’ve done that costing the battery is reading & posting path, reading feed at Feedly and last Reddit, using bacon reader app. I notice before that the biggest battery hog are screen, after a quick check, the battery cost around 35%, and more quick look, i notice gps cost 5% battery, android keyboard eats a large amount too, around 5-10%, WiFi 5%, and others like OS & system 30% etc ( which we can’t do anything about it ).

So what did I do to save up battery? The first thing I do is, sets the brightness setting all the way to the lowest setting, because its night time I don’t really need really bright screen. The second I did is, turning off the WiFi, the bus that I rode doesn’t provide any WiFi, so why bother? And turning off GPS is also a must, unless you’re using apps that uses GPS (Path, Instagram, Google maps, if you’re just reading news or Reddit, just turn it off right away).

That’s just the basic, I usually do extra things to save more on battery life, i skim apps that run on background. Facebook is one of the apps that run intensively on the background, i usually uninstalled right away on my phone, but have it on my tablet. Antivirus cost around 5 to 10 %, but there’s not much to do there. One of the dreaded, background apps that i hate the most are carrier app, that pop notification a couple of times a day, you can’t remove it (unless you root it), but fortunately in android 4.1, you can disabled (look in setting menu) it so it does not active at all. This is awesome btw, this feature are alpha on android 4.0 .

TL;DR version of this writing are, to save up battery

  1. Set the screen to the lowest brightness setting
  2. Turn off WiFi (if there’s no secure WiFi around)
  3. Turn off GPS (unless your app use GPS, like Path, Instagram, Google Maps)
  4. Disabled annoying menu

Just by doing this, my 15% battery, gone to 10% in the next 30 minutes later

Game Backlog

I’ve been active buying PC games from steam for quite a while now, the reasons are, the concept are dead simple: buy once and installed anywhere as long I have only one account logging on on my steam client, I can play at home and office the same game (sometimes the same save game too); there are workshop for many pc games (like fan base in game customization) and last but not least, the crazy game sale that they often have, either on steam itself or on other site.

Stacks

Now about the sale that happen often, are sometimes crazy cheap, it felt irrelevant to buy or download pirated games. Why, you say? First of all it’s freaking cheap, sometimes I can have 3 awesome games for a mere 1-2$ USD; the second is I don’t need to worry about cracking or viruses, upload ISO, daemon etc. here’s a couple of website that I always take a look to find those sale:

I use Google reader to read these site, but because its going to close on July 1st, now I use Feedly. There are company that offer game sales (mostly high quality indie game) in a bundle:

  • The Humble Bundle, These by far the best in “Pay what you want. support charity. Get cross-platform, DRM-free games” sale model. The game choice are almost always awesome.
  • The Humble Bundle Weekly, same as above but happen more frequently (7 days deal) with a smaller bundle to offer
  • The Indie Gala, sometimes super awesome, sometimes just average games
  • Groupees, same as above
  • Indie Royale, same as above
  • IndieGameStand, only offer one game and its up for 3 days
  • for others, just watched the subreddit on game deals

December 11 2012

With all of these sale happens on regular basis, its going to make my game backlog abundance, plus the steam summer sale is going to happen soon, so time to save up! :)

It’s been a while

oh! The things we find while cleaning house!

It’s been a while since my last post. A couple of things that i want to do is redesign my website with the glittering responsive of HTML5 and CSS3. The theme that i use now is custom twentyten childthemes, i was too lazy with the function and just wanted to design the layout, so i use childthemes instead.

Life’s happens between now and my last post. I have a super awesome son, i got jobs, and move places. Got a couple of android also, from 2.3 china made tablet, 2.3smartphone to a new 4.0 tablet and 4.1 android smartphone. Have tried iPhone and iPad but felt too much boundaries, and hate to jailbreak it, if there’s a thing that i don’t like about android is, i don’t get root straight away, because i’d like to set my own firewall.

Have a new Asus win8 laptop with 24gb SSD + 500gb HDD, oh dear, because of this laptop, i understand the meaning of 15second boot time. It’s heavenly fast and lightweight 1.8kg (2kg with adapter).

Well that’s just about it on what i want to share now.

6 Flash Based Game Similar to Angry Birds

After installing Angry Birds for PC, I can’t stop playing it. The game is really fun to play. It gets addictive seeing those pigs smashed by birds and those pigs smirk when you lose the round. But I have played this kind of gameplay before a while back.

Kongregate

I played mostly are flash based games at Kongregate (a free social gaming network). If you have an account there, add me :) My nick is bebek_ijo. This type of gameplay is called physics-based puzzle games; destroy the castle or more popularly called Crush the Castle.

I don’t know who created first, but the first released flash based game with this type of gameplay in Kongregate is Castle Clout, after that Armor Games release the famously Crush the Castle which is more easy to play and beautifully design. Then came similar game with more crafted gameplay.

In this post I’m going to tip you those flash based games that are similar with Angry Birds.

Crush the Castle - Flash based game similar to Angry Birds

Crush the Castle

This is the game that made this type of gameplay really popular, release by Armor Games at 2009 and it has been played more than 1.5 million times in Kongregate and more than 20 million times in Armor Games website. It is easier and more beautiful than Castle Clout, especially the interface, the gameplay are similar with Angry Birds but instead using a sling shot it uses a trebuchet, so it has less control in targeting but still manageable once you got a hang of it. There is an expansion of this version using map created player, it is called Crush the Castle Players Pack. You can play Crush the Castle in Kongregate here

Crush the Castle 2 - Flash based game similar to Angry Birds

Crush the Castle 2

It doesn’t seem fair not to mention Crush the Castle 2 in looking for a game that has a gameplay similar with Angry Birds. Yes, it has the same gameplay as Crush the Castle but it is different because it has more weapon arsenal (acid, ice, fire etc). Playing both of them offer a different experience. You can play Crush the Castle 2 in Kongregate here

Da Vinci Cannon - Flash based game similar to Angry Birds

Da Vinci Cannon

This game is released by King.com. It uses cannon to shoot, using two component, angle and power. Not very different from Crush the Castle except for its weapon, the use of these two components makes the game easy so the learning curve in targeting is a breeze. You can play Da Vinci Canon in Kongregate here

Old Cannon - Flash based game similar to Angry Birds

Old Cannon

Ahh, this game offer the same component as Da Vinci canon but the interesting part is, the design style is more classic (thus the name Old Cannon). It has smaller field of play so you can see directly where your shoot is, not back and forth like the usual crush the castle. This game is really just crush the castle, where in the game before, you have to kill the enemy, not necessarily destroy the castle, in this game you just point shoot and destroy the castle. You can play Old Cannon in Kongregate here

Sieger - Flash based game similar to Angry Birds

Sieger

Sieger offer the same atmosphere as Crush the Castle but with different gameplay. In this game you’re using first person view, so you shot from the front. Almost all of the castle have a one shot destroy the castle, so choosing the right target is essential in getting the gold medal. It has 29 level to keep you playing. You can play Sieger in Kongregate here

Sieger Master - Flash based game similar to Angry Birds

Sieger Master
Sieger Master has the same component like all the game mention above. But it has its differences, the game uses shop system to buy the ammunition and it has more accurate targeting system. The angle and power that are used to shoot are shown, so you can calculate which is the effective shot. You can play Sieger Master in Kongregate here

Note, the Castle Clout are where it all began, release in 2008 but it’s so hard to play because the high difficulty in targeting and it only have one map. Not much fun comparing the later. That’s why I didn’t put it on the list.

YouWave Android: the easy way to run Android on your PC

While looking for a demo of Angry Birds, I notice that Angry Birds for Android are free but alas, I don’t have an Android phone yet. So in the spirit of getting free stuff :) I try to install Android OS on my PC.

A lot of tutorial teaches how to install Android on PC but many of them are for developer, take a lot of numerous steps, needs Java to runs or even using live CD. This means, the choice is not for ordinary users who just want to try Android app. That is where YouWave Android came along. The process is brief; you just download and install the software.

To install YouWave Android, first you download the software at YouWave Android site (currently only for Windows XP/Vista/7)

youwave starts

Follow through the installation step and you’re done! To use it just click on the icon in the desktop

youwave desktop

It came pre-installed with a couple of apps, a news aggregate app Newspaper, tower defense game Robo Defense free, puzzle like rush hours, Othello, jewels and Advanced Task Killer to easily kill running app.

android bejewelled

To install Android app are easy, just download from your browser and put it in the default apps directory “<user home directory> /youwave/Android apps/” or any directory of your choice.

download .apk

No direct install from Android market yet so you have to install it manually, there are many places you can download Android app, just Google it using “Android apps” keyword, or you can visit slideme.org or getjar.com to download the apps, Android apps use .apk for its file extensions.

The minimum requirements for YouWave Android are Intel 1.6GHz CPU or its equivalent, with 1G of RAM and 500MBytes of free disk space. Internet connections are needed depends on what the apps you are using.

Pros:

  • It is easy to install the software
  • And it is easy to install Android apps; just download it on the default or preferred apps folder
  • Can try a huge library of Android apps
  • It is fast.
  • Have screen rotations features but you have to click it manually

Cons:

  • Ads, there is a lots of ads in it, but there is a work way around, just block any connection to the internet. Usually there is a connection each time the software start, you can block those connections using firewall or just turn off the internet connection.
  • Huge resource use, it means it decreases laptop battery fast, my laptop battery usually lasted around 2-3 hours before it needs to be plugged in, with this software, my laptop only lasted 1 hour or so while playing tower of defense game (Xeno Tactic II Lite) (tested on i5).
  • Huge resolutions, this is usually good news but for wide monitor like my laptop and LCD (1366 x 768 pixels) it is bad news, because it uses a really high resolutions for its height and no resize options, that is why I couldn’t took a good screenshot of the software.
  • No access to Android market yet but you can download apps
  • The means to use the software only trough mouse and keyboards, so no microphone, camera, orientation sensor, SD card support and accelerometer in here yet (tested version 1.31).
  • Still can’t play Angry Birds, because it need ARM Code processor (tested on Intel i5) :(

Check out YouWave Android here

Awesome Extensions for Your Firebug

Firebug, an add-on for Firefox browser, is an awesome tool for web development. It can inspect and tweak HTML page and CSS in real-time, so you can see temporary changes that are made to the page in that moment without refreshing the page. It also has an advanced JavaScript debugger; you can see the full Firebug features here

This article is about further extensions for Firebug, which can extend Firebug from its basic feature for web development by installing additional extensions (that is also a Firefox add-on). If you’re still new in what is Firebug and how to use it, there is an extensive tutorial here at Makeuseof about “Amateur’s Guide To Customizing Website Design With Firebug”.

Here are a couple of its popular extensions, which I use in day to day basis:

YSlow

Among other extensions for Firebug, the most popular one, are developed by Yahoo! inc Company. YSlow analyzes web pages and why they’re slow based on Yahoo!’s rules for high performance web sites. The rules are

  1. Minimize HTTP Requests
  2. Use a Content Delivery Network
  3. Add an Expires or a Cache-Control Header
  4. Gzip Components
  5. Put StyleSheets at the Top
  6. Put Scripts at the Bottom
  7. Avoid CSS Expressions
  8. Make JavaScript and CSS External
  9. Reduce DNS Lookups
  10. Minify JavaScript and CSS
  11. Avoid Redirects
  12. Remove Duplicate Scripts
  13. Configure ETags
  14. Make AJAX Cacheable
  15. Use GET for AJAX Requests
  16. Reduce the Number of DOM Elements
  17. No 404s
  18. Reduce Cookie Size
  19. Use Cookie-Free Domains for Components
  20. Avoid Filters
  21. Do Not Scale Images in HTML
  22. Make favicon.ico Small and Cacheable

It ranked (like A, B, C, D) your website for performance based on three predefined rulesets:

  1. YSlow(V2) – this ruleset contains the 22 rules listed above.
  2. Classic(V1)- this ruleset contains the first 13 rules listed above.
  3. Small Site or Blog- this ruleset contains 14 rules that are applicable to small web sites or blogs.

Note, the tools that are available in YSlow are also really useful, like JSlint a JavaScript code quality tools; YUI CSS compressor, Yahoo own tools that minifies CSS and including one of my favorite image compressors, Smush.it. It compresses image size so it became smaller without any loss of quality and thus makes the web load faster because of it smaller size.
You can install the YSlow extensions here and the full guide for the extensions here .

SenSEO

This extension analyzes web pages and tells you how good they fulfill on-page Search Engine Optimization criteria. It gives you

  • Overview of SEO-important web page components
  • Analysis of on-page-SEO-criteria
  • In the newest version SenSEO (1.4.3 in the time of writing) checks
    Correct usage of Document-Title, Meta-Description and Meta-Keywords
  • Headlines, Domain and URL-Path
  • Other general content-criteria

As you can see in the screenshot, it shows all of the component that are needed for search engine optimization, from h1 to h6, meta description and keyword, the alt attribute in images and it even show how the search engine read the website trough visible content.
You can install the extensions from here.

There are others popular extensions like Flashbug (displays all the running .SWF file trace output), FireQuery (plugin for jQuery development), you can see it at “Firebug Extensions add-on page”, The extensions is ranked by its popularity and the complete list is in the official “wiki for list of all Firebug extensions.”.

Like Button Metadata in WordPress

Adding Facebook Like Button dinamically on WordPress posts is easy, there’s a tut on it in wpbeginner, to summarize the tut, let just say that you can add like button by adding this code below on single.php file on WordPress themes

You can add this code under the title of post (the_title) or under the content (the_content), or anywhere you like actually, the code uses permalink that wrap in php url_encode, there’s a styling for the frame, by using scrolling, border and inline css.

1
2
3
4
5
6
<iframe 
src="http://www.facebook.com/plugins/like.php?href=<?php echo urlencode(get_permalink($post->ID)); ?>&amp;layout=standard&amp;show_faces=false&amp;width=450&amp;action=like&amp;colorscheme=light" 
scrolling="no" 
frameborder="0" 
allowTransparency="true" 
style="border:none; overflow:hidden; width:450px; height:60px;"></iframe>

But if your posts is about a product like movies, books, clothes or anything, you could add metadata on it. Adding additional info about the posts is by using the Facebook Open Graph Protocol. I’ve stumbled to Facebook Open Graph while developing on my wife online store using WordPress in Jongkok.com.

The Open Graph protocol enables you to integrate your Web pages into the social graph. It is currently designed for Web pages representing profiles of real-world things. things like movies, sports teams, celebrities, and restaurants.

Source

There’s an extensive explanation on what kind of additional data you could add on Open Graph Facebook.

lolcat book

There’s a lot of them, you could check it on the Open Graph page. but i’m only going to use the ones on this code below and for the example product i use LOLcat book

The required ones are

1
2
3
4
  <meta property="og:title" content="LOLcat Colleckshun"/>
  <meta property="og:type" content="book"/>
  <meta property="og:url" content="http://lolmart.com/product/i-can-has-cheezburger-a-lolcat-colleckshun/"/>
  <meta property="og:image" content="http://test-lolmart.com/wp-content/uploads/2010/05/ICHC-book1-thumb.jpeg"/>

The recommended one

1
2
3
  <meta property="fb:admins" content="YOUR_FACEBOOK_USER_ID"/><!-- You could use 2 user or by apps ID-->
  <meta property="og:site_name" content="lolmart"/>
  <meta property="og:description" content="The original I Can Has Cheezburger book is a favorite gift item that makes you and your friends laugh with joy.."/>

The meta data should be put on the header section. To applied it to WordPress, each meta data, i’m going to use WordPress function in header for single posts (header.php), the final code will be look like this

1
2
3
4
5
6
7
8
9
10
11
12
13
<?php
// facebook opengraph
if ( is_single() ) { ?>
<meta property="og:title" content="<? single_post_title(); ?>"/>  <!-- The title of product -->
<meta property="og:type" content="book"/> <!-- look what type of product on opengraph -->
<meta property="og:url" content="<?php the_permalink() ; ?>" /><!-- permalink -->
<meta property="og:image" content="<?php echo get_post_meta($post->ID, "image", $single = true); ?>"/> 
<!-- image use is 3:1 ratio, i’m using custom field named “image” for this -->
<meta property="fb:app_id" content="xxxxxx"/><!-- your web app id, or use user ID -->
<meta property="og:site_name" content="YourWebsite.com" /><!-- your site name -->
<meta property="og:description" content="<?php the_excerpt(); ?>" />
<!-- for the description, while posting a product make sure the excerpt are filled -->
<? } ?>

That’s it!

Rollip.com

Earlier this year, i got an email from Rollip, asking me if i could review their site because it would interest the reader here, I reply, i’d be happy to do it! :) I found Rollip last year from Makeuseof.com, tried a several effect and forgot ever since because of works. This site is really useful for me if i want a quick effect on my images.

The awesomeness of the site is the availability of the effect, here’s an images that i’ve tried on
The original photo

Me & My Wife

Here’s some of the effect

Rollip Effect 1

Rollip Effect 2

Rollip Effect 3

Rollip Effect 4

Rollip Effect 5

the effects was awesome but some of it looks like a filter rape to me, nonetheless the other look simply awesome with just a simple click, it would be nice if they could also mention the name of the effect. The last effect is simply really neat and old look awesomeness. Note that you’ll only get low-res result for the effect, if you want the high-res you have to pay, for a profile pic in social networking the low-res result look okay to me.

Create Thumbnail From Offsite Image Using Timthumb Beta

thumbnail
by petervanallen

I host most of my images in Picasa and Flickr, for along time i couldn’t use the native feature in WordPress to create custom thumbnail that i wanted, i could upload it and use custom fields, but it would be tediously boring to do that.

A couple of month ago a message from heaven came by to fulfilled my wishes and whisper it to Ben Gillbanks ear, the developer of timthumb. So thus came the timthumb beta for offsite image. After downloading it i tried it, my wishes fulfilled and it looks awesome! Oh Joy

Happy! Happy! Joy! Joy! from psherman420 on Vimeo.

This hack is similar with the one that i use on this website and this was a follow up from my previous post about how to create custom index post layout, but the method could be applicable for other WordPress themes.

Here is the screen shot on how the thumbnail will look like on the home page (i’m using thematicsamplechildtheme in the Thematic folder)

thumbnail screenshot

First we need to download timthumb beta at Binary Moon in here, put it on your child theme folder then create a folder called temp & cache (writeable 777)

Here are the code that we are going to use

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
<?php
function remove_index_loop() {
  remove_action('thematic_indexloop', 'thematic_index_loop');
}
add_action('init', 'remove_index_loop');
 
function catch_that_image() {
  global $post, $posts;
  $first_img = '';
  ob_start();
  ob_end_clean();
  $output = preg_match_all('/<img.+src=[\'"]([^\'"]+)[\'"].*>/i', $post->post_content, $matches);
  $first_img = $matches [1] [0];
 
  if(empty($first_img)){ //Defines a default image
    $first_img = "images/default.gif";
  }
  return $first_img;
}
 
function custom_index_loop() {
  global $post;
    /* Count the number of posts so we can insert a widgetized area */ $count = 1;
      while ( have_posts() ) : the_post() ?>
        <?php $counter++; ?>    
          <div class="column <?php if ($counter == 1) { echo 'one'; } else { echo 'two'; $counter = 0; } ?>">
            <div class="clear-fix">
              <div id="post-<?php the_ID() ?>" class="<?php thematic_post_class() ?>">
                <?php thematic_postheader(); ?>
                  <?php if(catch_that_image()) {
                    echo '<a href="' .get_permalink(). '" title="' .get_the_title(). '"><img src="' .get_stylesheet_directory_uri(). '/timthumb.php?src=' .urlencode(catch_that_image()). '&amp;h=100&amp;w=240&amp;zc=1&amp;q=90"></a>'; } ?>
                    <div class="entry-content">
                    <?php the_excerpt(); ?>
                    <?php wp_link_pages('before=<div class="page-link">' .__('Pages:', 'thematic') . '&after=</div>') ?>
                </div>
            <?php thematic_postfooter(); ?>
          </div><!-- .post -->
      </div><!-- .clear-fix -->
   </div><!-- .column -->
   <?php comments_template();
    if ($count==$thm_insert_position) { get_sidebar('index-insert');}
    $count = $count + 1;
    endwhile;
}
add_action('thematic_indexloop', 'custom_index_loop');
?>

The code below are to catch the first image on the post

1
2
3
4
5
6
7
8
9
10
11
12
13
function catch_that_image() {
  global $post, $posts;
  $first_img = '';
  ob_start();
  ob_end_clean();
  $output = preg_match_all('/<img.+src=[\'"]([^\'"]+)[\'"].*>/i', $post->post_content, $matches);
  $first_img = $matches [1] [0];
 
  if(empty($first_img)){ //Defines a default image
    $first_img = "images/default.gif";
  }
  return $first_img;
}

i use the_excerpt for the content so there’s no image there, i’m going to try catch the first image from post so i can feed it to the timthumb, this awesome function is from WPrecipes Jean-Baptiste Jung.

after catching it, we can call it with this

1
echo catch_that_image()

then i’m going to insert it to the custom index loop

1
2
<?php if(catch_that_image()) {
                    echo '<a href="' .get_permalink(). '" title="' .get_the_title(). '"><img src="' .get_stylesheet_directory_uri(). '/timthumb.php?src=' .urlencode(catch_that_image()). '&amp;h=100&amp;w=240&amp;zc=1&amp;q=90"></a>'; } ?>

change the h=100&w=240 for the size as needed

Voila! it’s done! simple right! :)

Food, Walk Around Jakarta, WordPress and Rants on Random Geekiness