I’ve heard from some of my colleagues that it’s quite hard to maintain a lightweight class structure in Android because of the Activity classes. Nonetheless, seeing this code I saw so many beginner mistakes that I just can’t let it go unnoticed. I’m quite sure that if I asked the code author what a MVC is, he wouldn’t have a clue. Anyway, seeing so many errors I decided I’d point out some of them in hope that somebody less experienced than me (which might not be a lot of people, since I’m an active programmer for just… 6 years?) finds something useful.

1. Sharing data

Our application is basically a workflow of consecutive steps, each represented by its own Activity. They, however, all operate (edit, read) on the same data. My predecessor solved this problem by creating public variables in the main Activity, and then referencing them from all the other activities. I didn’t particularly like that, so I wrote my own solution. As long as the application lives on Android (even if it’s pushed into the background, paused etc.), a single Application class will exist. That’s the object we need to store our custom data in (as long as we don’t want to use the database, which is really overkill for many smaller apps)! I created my own Application class that looks like this:

MyApplication.java

public class MyApplication extends Application {

    private SharedData sharedData;

    /**
     * Called when the application is started.
     */
    @Override
    public void onCreate() {
        super.onCreate();

        // Initialize a new instance of shared data,
        // only once per application lifetime
        this.sharedData = new SharedData();
    }

    /**
     * Get the shared data.
     * @return The shared data.
     */
    public SharedData getSharedData() {
        return this.sharedData;
    }
}

SharedData is simply an object holding various variables & structures that are needed throughout the application. To ease the things a little bit, I also created a base Activity class from which I extend all my application activities:

MyActivity.java

public class MyActivity extends Activity {

    private SharedPreferences sharedPreferences;

    /**
     * Get the application-wide shared data.
     * @return The shared data object instance.
     */
    protected final SharedData getSharedData() {
        return ((MyApplication)getApplication()).getSharedData();
    }

    /**
     * Get the application-wide shared preferences.
     * @return The shared preferences object.
     */
    protected final SharedPreferences getPreferences() {
        if (this.sharedPreferences == null) {
            try {
                this.sharedPreferences = PreferenceManager.getDefaultSharedPreferences(this);
            } catch (Exception e) {
                this.sharedPreferences = null;
            }
        }

        return this.sharedPreferences;
    }
}

What that means is that whenever I need to access the shared data from any activity, I simply call the this.getSharedData() to retrieve or update it. I also added a function that kind of shortens the retrieval of the local preferences.

2. Separation of dialogs

Since our application uses quite many dialogs that are mostly just customized dialogs made from DialogBuilder factory, I still hated seeing all of them hard-coded inside individual activities. Since couple of activities use same dialogs, there was also some code duplication which is never hood. Solution? Isolate dialogs into individual classes:

MyDialog.java

public class MyDialogFragment extends DialogFragment {

    // region EVENTS INTERFACE
    /**
     * An interface, used to contain abstract method definitions which are fired on specific events from the dialog and
     * should be overriden in the calling Activity class.
     */
    public interface MyDialogEvents {
        public abstract void onSubmit(String someDataToPass);
        public abstract void onCancel();
    }
    // endregion

    // region STATIC INITIALIZATION
    /**
     * Initializes a new instance of MyDialogFragment.
     * @param dialogData1 the dialog data 1.
     * @param dialogData2 the dialog data 2.
     * @param target the target events interface.
     * @return the dialog fragment.
     */
    public static MyDialogFragment newInstance(
        ArrayList dialogData1,
        boolean dialogData2,
        final MyDialogEvents target) {
        MyDialogFragment fragment;
        Bundle args;

        fragment = new MyDialogFragment();
        args = new Bundle();
        args.putStringArrayList("dialogData1", dialogData1);
        args.putBoolean("dialogData2", dialogData2);
        fragment.setArguments(args);
        fragment.setTarget(target);
        return fragment;
    }
    // endregion

    // region FIELDS
    private MyDialogEvents target;
    // endregion

    @Override
    public Dialog onCreateDialog(Bundle savedInstanceState) {
        Builder builder;
        Dialog dialog;
        ArrayList dialogData1;
        boolean dialogData2;

        // Retrieve parameters from the bundle
        dialogData1 = this.getArguments().getStringArrayList("dialogData1");
        dialogData2 = this.getArguments().getBoolean("dialogData2");

        builder = new Builder(this.getActivity());
        builder.setTitle(getResources().getString(R.string.title_string));

        // Add custom controls to dialog

        // Add OK & Cancel buttons
        builder.setNegativeButton(getResources().getString(R.string.dialog_negative_default),
            new DialogInterface.OnClickListener() {
                @Override
                public void onClick(DialogInterface dialog, int whichButton) {
                    target.onCancel();
                }
            });
        builder.setPositiveButton(getResources().getString(R.string.dialog_positive_default),
            new DialogInterface.OnClickListener() {
                @Override
                public void onClick(DialogInterface dialog, int whichButton) {
                String dataToPass;

                // Read the data from the controls, do validation if needed

                // Fire the event
                target.onSubmit(dataToPass);
            }
        });

        dialog = builder.show();
        return dialog;
    }

    /**
     * Sets the target.
     * @param target the target interface.
     */
    public void setTarget(MyDialogEvents target) {
        this.target = target;
    }
}

Since you usually want to do some stuff after dialog is validated/confirmed/cancelled, I exposed an interface with those specific events that the user must implement in the calling code. As I’m writing this code I realized I could move the abstract method definitions into the DialogFragment class itself, and replace the static initialization with the one in the DialogFragment constructor. But oh well, this works perfectly as well. If you want to prevent the dialog from closing when the user clicks the positive/negative button, see this StackOverflow entry (answer #31). To open the given dialog, the simple following code is needed in the calling Activity:

MyDialogFragment dialogFragment;

dialogFragment = MyDialogFragment.newInstance(passedData1, passedData2, new MyDialogEvents() {
    @Override
    public void onSubmit(String someDataToPass) {
        // Do something with data after dialog submission
    }

    @Override
    public void onCancel() {
        // Do nothing on cancel
    }
});

dialogFragment.show(getFragmentManager(), TAG + "_MyDialogFragment");

Considering I spent almost 3 whole weeks to refactor the beast, there were many more modifications & improvements, but I’m too lazy to list them all at once . So for now that’s it folks!

All magic methods names start with two underscores. To implement constructor and destructor we have to override __construct() and __destruct() methods. The method __construct is invoked when we create an object and __destruct when all references on an object are removed or an object is explicitly destroyed.

class MilitaryBaracks {
 
  // note that construct methods starts with two underscores
  public function __construct() {
    // this code executes when object is created
    echo "Soldier " . $this->name . " was created.";
  }

  // ... rest of the class code
  
  public function __destruct() {
    // this code executes when object is destroyed
    echo "Destroying solider with name " . $this->name;
  }
}

We use constructor in cases, when we want to execute some piece of code when object is instantiated. For instance, set values to properties for which we want to be sure they are set. In case of a class which takes care of connecting to database, we would want to be sure that we have all data required for establishing connection. We could use destructor to close the connection. In practice, constructor is much more often used than destructor because PHP closes resources it uses when script finishes execution. Anyway, this stackoverflow link offers few examples of uses of destruct method in open source code.

For the sake of clarity, let’s build upon our MilitaryBaracks example. We want to be sure that every soldier has name and weapon.

class MilitaryBaracks {
 
  // name doesn't have default value no more
  private $_name;
  // so doesn't weapon
  private $_weapon;
 
  private $_ammunition = 10;
 
  // instead, we make sure that values are passed when object is created
  public function __construct($name, $weapon) {
    $this->_name = $name;
    $this->_weapon = $orozje;
  }

  // we want that soldier is able to switch weapon
  // so we create getter method to access weapon variable value
  public function getWeapon() {
    return $this->_weapon;
  }
 
  // and set method to switch weapon
  public function setWeapon($weapon) {
    $this->_weapon = $weapon;
    return $this;
  }
 
  // name can't be changed, so we create only getter method
  public function getName() {
    return $this->_name;
  }
 
  //...
}

Ookay, let’s print out a few lines:

// this is wrong because of missing arguments
$soldier = new MilitaryBaracks();
// the right way
$soldier = new MilitaryBaracks('Mougli', 'rifle');
 
echo $soldier->getname() . " has weapon " . $soldier->getWeapon() . ".<br>";
 
$soldier->setWeapon('gun');

echo $soldier->getName() . " has weapon " . $soldier->getWeapon() . "."; 

And we get:

This way our object are easier to instantiate and set, since we do everything in one line. Beside that, now we can be pretty sure that our objects have all needed properties set, as PHP throws a warning if we leave out an argument when instantiating new object. Our code and classes needs to be organized in a way that other programmers can easily understand its meaning and structure. The predictability is important “guide” of OOP.

Even though I previously announced a blog post about inheritance I saved it for next time. I intended to present constructor and inheritance in this post, but it would be too long and I want to keep series short and simple. For that reason I cover it in the next post.

After a couple of years of usage, I sadly found some things that buggered me. The inability to create a nested structure (you can only have ona layer of organization), and the somewhat outdated look & feel made me look again for alternatives, but when you have so many pictures at one provider already, it’s hard to move. The final nail in the coffin, however, was the merger of Picasa Web Albums and Google+. The galleries in G+, while certainly aesthetically appealing, were (at least in the first version of G+) incredibly bandwidth-hungry, and even required some insane hardware to play really smoothly. Besides, since I don’t use G+ much, I didn’t like the merger as my album was now directly tied to my G+ profile.

That’s when I decided I’ll implement my own gallery on my own server. Luckily, Google did (as many other things) the whole Picasa thing properly – the API to Picasa Web Albums is quite powerful and lets you customize the display of your galleries, while still retaining the ease of uploading images via Picasa, and preserving your old albums.

I will not walk you through the whole process of making the custom gallery, but instead, show you how I implemented it, and how I have tailored it to my needs. One thing I’d like to point out that I didn’t implement, as I don’t have a need for it, but is certainly doable – you can implement a multi-layer organization of your albums with the help of captions. Google lets you caption each image, and if you organize this caption into a nested structure, let’s say “subalbum1|subalbum2|subalbum3||caption”, you can create an “artificial” nested structure of your own!

Ookay, enough with the chatting. Let’s get to the code! Google Picasa Web Albums Data API offers libraries for many popular web languages. As I only needed a relatively simple gallery, I picked PHP as the language.

First, let’s check the contents of my conf.php file.

conf.php

<?php
// ======================================
// CONFIGURATION FILE FOR PICASA GALLERY
// ======================================

// The Picasa service username
$userId = '<your_google_id>';

// Maximum thumbnail size (can be 32, 48, 64, 72, 144, 160). Cropped (c) or uncropped (u).
$thumbSize = '160c';

// Maximum image size can be 94, 110, 128, 200, 220, 288, 320, 400, 512, 576, 640,
// 720, 800, 912, 1024, 1152, 1280, 1440, 1600. These images are available as only uncropped(u) sizes.

$imgSize = '1280u';

// An array containing the albums that should not be shown (even though they are public!)
$hideAlbums = array('Scrapbook Photos', 'Warhammer army sale', 'Profile Photos');

As you can see from the config file, it’s pretty straightforward – first 3 options are needed to connect to Google Picasa Albums API, and to initialize parameters. The last option is my own; I have certain albums (I’m looking at you, Scrapbook Photos & Profile Photos) that I don’t want to display under my gallery, as they’re default Google-created un-erasable albums that serve only G+.

index.php

<?php
// Include the config file
include "./conf.php";

// Load the albums
$file = file_get_contents('https://picasaweb.google.com/data/feed/api/user/' . $userId . '?kind=album&access=public&thumbsize=' . $thumbSize);
$xml = new SimpleXMLElement($file);
$xml->registerXPathNamespace('gphoto', 'http://schemas.google.com/photos/2007');
$xml->registerXPathNamespace('media', 'http://search.yahoo.com/mrss/');
?>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>zluftan.si ← Gallery</title>
<link rel="stylesheet" type="text/css" href="./style.css" />
<link rel="icon" type="image/ico" href="./favicon.ico">
<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Yanone+Kaffeesatz:400,200">
<script src="jquery-1.10.2.min.js"></script>
<script src="http://cdn.jquerytools.org/1.2.7/full/jquery.tools.min.js"></script>
</head>
<body>

 <!-- HEADER -->
 <?php echo file_get_contents('./header.html'); ?>

 <!-- BREADCRUMBS -->
 <div id="breadcrumbs">
 <ul>
 <li class="home"><i></i><a href="./index.php">&#160;</a></li>
 <li><i></i><span>Gallery</span></li>
 </ul>
 </div>

<!-- ALBUMS HOLDER -->
 <div class="albums">
 <?php
 foreach ($xml->entry as $feed) {
     // Skip the explicitly hidden albums
     if (in_array($feed->title, $hideAlbums)) {
         continue;
 }

 $group = $feed->xpath('./media:group/media:thumbnail');
 $a = $group[0]->attributes(); // We need thumbnail path
 $id = $feed->xpath('./gphoto:id'); // And album id for our thumbnail

 $summary = $feed->summary != '' ? $feed->summary : 'This album does not have any description.';
 if (strlen($summary) > 228) {
     $summary = substr($summary, 0, 228) . '...';
 }
 $title = $feed->title;
 if (strlen($title) > 47) {
     $title = substr($title, 0, 47) . '...';
 }

 echo '<div class="album">';
 echo '<a href="./album.php?id=' . $id[0] . '">'
 echo '<img src="' . $a[0] . '" alt="' . $feed->title . '" title="' . $feed->title . '" ref="' . $id[0] . '" /></a>';
 echo '<div>';
 echo '<a href="./album.php?id=' . $id[0] . '"><h2>' . $title . '</h2></a>';
 echo '<p>' . $summary . '</p>';
 echo '</div>';
 echo '</div>';
 }
 ?>
 </div>

 <!-- FOOTER -->
 <?php echo str_replace('$YEAR', date("Y"), file_get_contents('./footer.html')); ?>

</body>
</html>

My albums are structured in the default Picasa 2-layer hierarchy; I decided I’ll have a main page, containing all my albums, and when clicking individual album, you’ll be redirected to a page dedicated and showing all the images from the selected album. Retrieving your album information is as simple as calling the php function file_get_contents(PICASA_URL) with correct parameters, and you can retrieve everything, from information about all albums, individual images from single album, etc.

You then simply parse the retrieved file (which is in XML format) and pull specific information you need from it. In my instance, I select the thumbnail image location, description name, and unique album id for each of the albums, and display them on the page. I then construct the links for each individual album by simply calling my “album display” .php page, while giving the unique album id as a GET parameter.

My individual album page is a bit unique. I have a lot of short, daily trips, and I didn’t want to create an individual album for each daily excursion, so I merged all the “daily” excursions into albums called “Summer 2012″, “Winter 2012″, etc. Inside those albums, however, I still want to retain structure of individual events. When using Picasa, I decided to prepend a header to all the captions from a single excursion, so inside those “general” albums, I have captions structured like this: <dd>.<mm>.<yyyy> – <trip_title>: <actual image caption>. Of course, this only holds true for albums called “Winter 2012″ etc. To retain this “legacy” structure, there’s a lot of ugly mess in my .php code, but I hope it gives you an idea how you can implement a nested gallery structure for your albums I mentioned above. Let’s check album.php.

<?php
// Include the config file
include "./conf.php";

// Retrieve the album id from the parameters
$albumId = $_GET["id"];
if (empty($albumId)) {
	die;
}

// Load the contents of the specified album
$file = file_get_contents('https://picasaweb.google.com/data/feed/api/user/' . $userId . '/albumid/' . $albumId . '?kind=photo&access=public&thumbsize=' . $thumbSize .'&imgmax=' . $imgSize);
$xml = new SimpleXMLElement($file);
$xml->registerXPathNamespace('media', 'http://search.yahoo.com/mrss/');

// Check if special image description handling is required
$useSubAlbums = false;
if ($xml->title == 'Earlier stuff' ||
    preg_match('/^Summer (19|20)\\d{2}$/', trim($xml->title)) == 1 ||
    preg_match('/^Winter (19|20)\\d{2}\/(19|20)\\d{2}$/', trim($xml->title)) == 1) {
	$useSubAlbums = true;
}

// If we have sub albums, find all of them and save them into an ordered array, they should already be ordered (in Picasa)!
if ($useSubAlbums == true) {
	$subAlbums = array();
	foreach ($xml->entry as $feed) {
		$description = $feed->xpath('./media:group/media:description'); // Retrieve image description

		if (str_word_count($description[0]) <= 0) {
			continue;
		}

		// This works whether the image has the "sub-description" or not =)
		$res = explode(':', $description[0]);
		$title = $res[0];

		if (array_key_exists($title, $subAlbums) == true) {
			$subAlbums[$title][] = $feed;
		} else {
			$tmp = array($feed);
			$subAlbums[$title] = $tmp;
		}
	}
} else {
	$subAlbums = array("tmp" => $xml->entry);
}
?>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title><?php echo $xml->title; ?></title>
<link rel="stylesheet" type="text/css" href="./style.css" />
<link rel="icon" type="image/ico" href="./favicon.ico">
<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Yanone+Kaffeesatz:400,200">
<link rel="stylesheet" href="lightbox/css/lightbox.css" />
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="http://cdn.jquerytools.org/1.2.7/full/jquery.tools.min.js"></script>
<script src="lightbox/js/jquery-1.10.2.min.js"></script>
<script src="lightbox/js/lightbox-2.6.min.js"></script>
</head>
<body>
	<!-- HEADER -->
	<?php echo file_get_contents('./header.html'); ?>

	<!-- BREADCRUMBS -->
	<div id="breadcrumbs">
		<ul>
			<li class="home"><i></i><a href="./index.php">&#160;</a></li>
			<li><i></i><a href="./index.php">Gallery</a></li>
			<li><i></i><span><?php echo $xml->title; ?></span></li>
		</ul>
	</div>

	<!-- IMAGES -->
	<?php
	if ($useSubAlbums == true) {
		echo '<div class="subalbums_container">';
	}

	foreach ($subAlbums as $albumTitle => $images) {
		if ($useSubAlbums == true) {
			$res = explode(' - ', $albumTitle);
			$trimmedAlbumTitle = $res[1];
			echo '<div class="subalbum">';
			echo '<h2>' . $trimmedAlbumTitle . '</h2>';
		}

		// Show pictures
		echo '<div class="images' . ($useSubAlbums == true ? '2' : '') . '">';
		foreach ($images as $feed) {
			$group = $feed->xpath('./media:group/media:thumbnail'); // Let's find thumbnail tag
			$a = $group[0]->attributes(); // Now we need to get attributes of thumbnail tag, so we can extract the thumb link

			// Descriptions are tough nut
			$caption = 'Detail';
			$description = $feed->xpath('./media:group/media:description'); // Retrieve image description
			if (str_word_count($description[0]) > 0) {
				if ($useSubAlbums == true) {
					if (strpos($description[0], ':')) {
						$res = explode(': ', $description[0]);
						$caption = $res[1];
					}
				} else {
					$caption = $description[0];
				}
			}

			$b = $feed->content->attributes(); // Now we convert "content" attributes into array

			echo '<div class="image">';
                        echo '<a href="' . $b['src'] . '" title="' . $caption . '" data-lightbox="' . $albumTitle . '">';
                        echo '<img src="' . $a['url'] . '" alt="' . $feed->title . '" width="' . $a['width'] . '" height="' . $a['height'] . '"/>';
                        echo '</a></div>';
		}
		echo '</div>';

		if ($useSubAlbums == true) {
			echo '</div>';
		}
	}

	if ($useSubAlbums == true) {
		echo '</div>';
	}
	?>

	<!-- FOOTER -->
	<?php echo str_replace('$YEAR', date("Y"), file_get_contents('./footer.html')); ?>

</body>
</html>

As you can see, I have special handling when it comes to sub-album structure. Nonetheless, the image info of the album is really easy to retrieve! I decided to use Lightbox for display of full-size images, and in case of sub-albums, I give each of the sub-album images its own data-lightbox attribute, so you have images corresponding to the same sub-album grouped together as a Lightbox album.

And that’s it! Header & footer are just .html files for displaying header/footer. For some shameless self promotion, visit the gallery (mind you, I’m still waiting for the designer to make it a bit nicer).

First you need to install matplotlib. Here you can find instructions on how to do that.

Now, let take a look at how to plot that chart . First I needed to read data from .csv file into an array. Matplotlib takes in data in form of numpy array.

print "Read data ..."
lines = [line.strip() for line in open('data.csv')]

time = []
vol = []
for i, x in enumerate(lines):
    t, v = x.split(',')
    time.append(t)
    vol.append(v)

final = []
final.append(time[:650])
final.append(vol[:650])

# create numpy array
data = np.array(final)

All you have to do now is configure matplotlib.pyplot to draw chart the way you want.

fig1 = plt.figure()
plt.xlim(0, 70) # limit on X axis (modify to fit your data)
plt.ylim(0, 150) # limit on Y axis (modify to fit your data
plt.xlabel('Time')
plt.ylabel('Volume')
plt.title('The volume as a function of time')

Before we take a look at the interesting part, I would like to point out the following line

l, = plt.plot([], [], 'r-')

Normally we pass data to plot function as array of points ([X], [Y]), but in the case of dynamic chart, we pass it empty arrays because we draw points dynamically. The third argument is string which determines how the points are drawn. First char means color, second char the representation of a point. “-” means line, but you can choose whatever char you want. Here you can read more about plot function.

Ok, so far we haven’t seen anything special. Now let’s take a look at the part that does the magic. Matplotlib offers a FuncAnimation function to support animation of a chart. Animation is achieved by FuncAnimation repeatedly calling a function func.

def update_line(num, data, line):
    line.set_data(data[0, :num], data[1,:num])
    return lines

line_ani = animation.FuncAnimation(fig1, update_line, 5000, fargs=(data, l), interval=50, blit=True, repeat=False)

print "Starting drawing chart..."
plt.show()

As you can see, we pass the function update_line to FuncAnimation and arguments to update_line which takes 3 arguments. The num argument represents sequence number, which we don’t need to pass explicitly. Each iteration we draw points from 0 to num, which animates our chart. So, that all, if your goal is to draw only lines for one type of data. But what if you want to have 2 different data types for Y axis? Let’s take a look how you can implement that. First you have to define two sets of data and two different axis:

print "Prepare data and chart..."
data = np.array(final)
data2 = np.array(final2)

fig = plt.figure()
# add subplot to chart
ax = fig.add_subplot(111)
# first line is red
l, = ax.plot([], [], 'r-', label="Volume")

# define second axis
ax2 = ax.twinx()

#and set line color to blue
k, = ax2.plot([], [], 'b-', label="Temperature")

ax.legend([l,k], [l.get_label(), k.get_label()], loc=0)

plt.title('Volume and temperature in function with time.')
ax.set_xlabel("Time [seconds]")
ax.set_ylabel("Volume [liter]")
ax.set_ylim(0,150)
ax.set_xlim(0, 70)
ax2.set_ylabel("Temperature [Degrees celsius]")
ax2.set_ylim(0, 45)
ax2.set_xlim(0, 70)

I believe the above code shouldn’t give you trouble, because there were just some minor changes made. The main difference is that we add a subplot to the plot and set data to its ax. We define its color and label just like before. Then we specify second ax and repeat…

OK, we are almost there. The last thing we need to do is to modify our update_line function in a way that it accepts four parameters and pass them in FuncAnimation’s fargs argument.

def update_line(num, data, line, data2, line2):
    line.set_data(data[0, :num], data[1,:num])
    line2.set_data(data2[0, :num], data2[1, :num])
    return line, line2

# pass all data in fargs argument
line_ani = animation.FuncAnimation(fig, update_line, 5000, fargs=(data, l, data2, k), interval=50, blit=True, repeat=False)

And that is it. Just in case if you have any problem with putting it all together, here is the full source

import numpy as np
import matplotlib.pyplot as plt
import matplotlib.animation as animation

def update_line(num, data, line, data2, line2):
    line.set_data(data[0, :num], data[1,:num])
    line2.set_data(data2[0, :num], data2[1, :num])
    return line, line2

print "Read data ..."
lines = [line.strip() for line in open('data.csv')]
linesTemp = [line.strip() for line in open('cas_temp_ok.csv')]

pressure = []
time = []
for i, x in enumerate(lines):
    line = x.split(',')
    pressure.append(line[1])
    time.append(line[0])


temp = []
for i, x in enumerate(linesTemp):
    line = x.split(',')
    temp.append(line[1])



final = []
final.append(time)
final.append(pressure)

final2 = []
final2.append(time)
final2.append(temp)


print "Prepare data and chart..."
data = np.array(final)
data2 = np.array(final2)

fig = plt.figure()
# add subplot to chart
ax = fig.add_subplot(111)
# first line is red
l, = ax.plot([], [], 'r-', label="Volume")

# define second axis
ax2 = ax.twinx()

#and set line color to blue
k, = ax2.plot([], [], 'b-', label="Temperature")

ax.legend([l,k], [l.get_label(), k.get_label()], loc=0)

ax.set_xlabel("Time [seconds]")
ax.set_ylabel("Volume [liter]")
ax.set_ylim(0,150)
ax.set_xlim(0, 70)
ax2.set_ylabel("Temperature [Degrees celsius]")
ax2.set_ylim(0, 45)
ax2.set_xlim(0, 70)
plt.title('Volume and temperature in function with time.')

line_ani = animation.FuncAnimation(fig, update_line, 5000, fargs=(data, l, data2, k), interval=50, blit=True, repeat=False)
print "Starting drawing chart..."
plt.show()

The methods differ from the functions in that they are declared in the class.

public function myMethod() {
 
}

They support different types of visibility just like properties do. Visibility keywords are: public, protected and private. These keywords define from where we can access the method. Public methods can be accessed from anywhere while private methods can only be accessed in the same class they are defined in. There is also protected keyword, but we will take a closer look at it a bit later. First, let’s just take a look at the example of using public and private keywords.

class MilitaryBaracks {
 
  //properties that we can access anywhere
  public $name = 'Mougli';
  public $weapon = 'rifle';
 
  //properties that we can access in this class only
  //in practice we usually prepend _ to the private methods for the clarity
  private $_ammunition = 10;
 
  //because we are inside the class, which defines property $_ammunition, we can access that property
  public function getAmmunition() {
    return $this->_ammunition;
  }
 
  public function shoot() {
    //keyword this means that we refer to property of an instance of class -> an object
    //if soldier has any ammunition left, shoot and subtract one bullet
    if($this->_ammunition > 0) {
      $this->_ammunition = $this->_ammunition - 1;
       
      return true;
    }
    return false;
  }
}

Let’s take a look at the above code in more detail. I’ve added a private property $_ammunition and methods getAmmunition() and shoot(). Because we cannot access a private property, we need to create a public method, which returns its value (getAmmunition()). Method shoot() reduces a number of bullets left each time it is called.

It is a common practice to prepend _ to the private properties. This helps to quickly differentiate private properties from public. Maybe all this is confusing, so let me clear it up a bit with an example. Let’s see what happens if I try to change and print out both properties.

// we instantiate an object of type MilitaryBaracks
$soldier = new MilitaryBaracks();
 
// and print out its name (its property)
echo $soldier->name;
echo "<br>";
// we change its name to "Matic"
$soldier->name = 'Matic';
echo $soldier->name;
echo "<br>";
echo $soldier->_ammunition;

This is what we get:

As you see we can access and modify public properties values just like variables, but we cannot do that with private ones. This is a mechanism to protect properties which values shouldn’t be changed from outside the class. But sometimes (actually quite often) we want to access the private properties from outside of class scope. In that case we create a public method like we did in our case. That way we can enforce the rules – what someone can do with that property. In our case we want to allow just reading so we created a getAmmunition() method.

$soldier = new MilitaryBaracks();
echo "Soldier has " . $soldier->getAmmunition() . " bullets.";
echo "Soldier shoots.";
$soldier->shoot();
echo "Soldier has " . $soldier->getAmmunition() . " bullets.";

What does keyword $this means? With the use of $this keyword a class knows it’s operating on this object. For simplicity try changing word $this with “current object instance”.

When I was learning about OOP I was asking myself why would I set a method or property to private, if that just makes things more complicated. You have to write more code, because you have to write an additional method to access the property. Here is the answer. The thing with OOP is that we want to limit the access to class properties and methods as much as possible. This way me try to make code more clear and harder to use in a wrong way.

That is not so obvious in my case, because the example is to simple. But I hope it will become more clear in an upcoming posts, where we will roll up our sleeves and get to some more serious programming .

In next post of this series we will cover one of the most important but also more complex topic of object oriented programming, that is inheritance.

Shortcuts:

• 1. Code Completion – Ctrl + Space

  Well, since the very beginning and up to now, this is indubitably my favorite shortcut and probably the most used by developers all over the world.

• 2. Quickly Move Trough Text and Quickly Select Text – Ctrl + Arrow Left/Right and Ctrl + Shift + Arrow Left/Right

  Not exactly Eclipse shortcut, I don’t even know what its official name is, but I use it all the time to quickly move through words.

• 3. Delete Line – Ctrl + d

  Deletes whole line or selected lines. Comes in very handy

• 4. Quick Fix – Ctrl + 1

  This combination offers tips to fix the compilation error. Very useful so you don’t have to move mouse cursor to that small sign at the beginning of the line.

• 5. Open Type – Ctrl + T and Open Resource Ctrl + R

  Supports wildcards for searching through files.

• 6. Generate Source Code – Shift + Alt + S

  This shortcut opens a menu, which provides us with various different possible pieces of code Eclipse can generate for us. Some of the combinations are:

  • Create constructor using fields – Shift + Alt + S O
  • Create constructors from superclass – Shift + Alt + S C
  • Generate getters and setters – Shift + Alt + S R
  • Override/implement methods – Shift + Alt + S C

• 7. Move To Next/Previus Error – Ctrl + . and Ctrl + ,

  – This way one can quickly jump from one error/warning to another. The only problem with this shortcut is, that you can’t configure it in a way, that it would skip warnings. Or at least I wasn’t able to

• Jump To Point Of Last Edit – Ctrl + Q

  – Jump to position in a file (even if you are in different tab), where you edited it the last time.

• Show Outline of Class – Ctrl + O

  – Offers a great way to quickly search for a method in a class or check out its methods.

• Show All Shortcuts – Ctrl + Shift + L

  – This one comes in handy With this shortcut you can quickly find a combination you can’t remember at the moment .

Well, these are my favorites, but I use others as well. I would definitely put shortcuts like format file, indent all lines, organize imports etc , but I configured Eclipse to do these things on file save. That way is even faster and more effortless than using shortcuts . I hope I inspired someone to let the tool take care of tedious tasks like generating getters and setters and use extra time to be more productive …

In our standard Java EE applications we use Apache Ant for building project and deploying it to server. So I created a task which packed common classes into jar and copied it into libs folder in our android project. Now I was able to use common classes. I refactored some code and started Android project to test it. But build failed with Class not found exception … I checked again, all needed files were in jar, jar was in libs folder, classes were included in “private libraries” … After a bit of googleing I discovered that this might be because files were compiled with java 1.7, which Android doesn’t support, instead of 1.6. I was surprised, because I knew I set my java to 1.6 in eclipse workspace. Then I remembered that Apache Ant uses its own JRE. After changing JRE for Ant, everything worked fine

Here are short instructions on how to change ANT’s JRE:

First, right click on ANT task you want to run:

In the first part of this series I will try to lay out the most basic terms as simple as possible. I will describe what is an object, class and a property.

Class

Personally I see a class as some kind of a frame, with which help we generate objects. I would say that the best comparison is the one with a computer game e.g. old strategic game – Age Of Empires. Each building, that we create has a special task. Let’s say it generates soldiers. So, we create a class MilitaryBarack (a building in the game) and that class generates objects (soldiers in the game).

We create a class with a reserved word class ClassName and brackets {}.

class MilitaryBarack 
{
}

Even though this piece of code is perfectly legit, it is pretty useless, because it doesn’t do anything. We will fix that later.

Object

As I mentioned before, class generates, or more accurately, instantiates an object. But what is an object? Let me return back to game comparison. MilitaryBracket generates an object, a soldier, which has certain properties. In programming terms we say that an object is an instance of a class. We instantiate it with the use of a reserved word new plus the ClassName.

$soldier1 = new MilitaryBaracks();
$soldier2 = new MilitaryBaracks();

When we create new instance of an object, it gets a unique identity. We can print object id and all of its properties with very useful function var_dump();.

var_dump($soldier1);
var_dump($soldier2);

If we open that in browser, we will see the output

object(MilitaryBaracks)[1] // note the object id in square brackets. Object has no properties yet.

object(MilitaryBaracks)[2]

Properties

All of this code is still quite useless. To make it more useful, we will add it some properties. Property of an object can contain different types of data. In our case, we could use a soldier’s name and a type of weapon he carries. To assign properties to an object, we have to declare it in its class. PHP offers three types of properties: public, protected and private. I will write more about the meaning of this words in next posts. For now it is enough to know, that they exist. We declare property with one of these reserved words plus a variable.

// class
class MilitaryBaracks {
  // and its properties with defined default values
  public $name = 'Mougli';  
  public $weapon = 'rifle';
}

As you se, we defined two properties to MilitaryBaracks class. If we now instantiate and print a new object, we can see all values it holds. To access the property value we use an arrow (->).

$soldier = new MilitaryBaracks();
echo "Soldier " . $soldier->name . " carries a " . $soldier->weapon;

These is were I stop for today. In part 2 of these series I will write about methods and visibility.

function closeWindows() {
    var browserName = navigator.appName;
    var browserVer = parseInt(navigator.appVersion);
    //alert(browserName + " : "+browserVer);

    //document.getElementById("flashContent").innerHTML = "<br>&nbsp;<font face='Arial' color='blue' size='2'><b> You have been logged out of the Game. Please Close Your Browser Window.</b></font>";

    if(browserName == "Microsoft Internet Explorer"){
        var ie7 = (document.all && !window.opera && window.XMLHttpRequest) ? true : false;  
        if (ie7)
        {  
          //This method is required to close a window without any prompt for IE7 & greater versions.
          window.open('','_parent','');
          window.close();
        }
       else
        {
          //This method is required to close a window without any prompt for IE6
          this.focus();
          self.opener = this;
          self.close();
        }
   }else{  
       //For NON-IE Browsers except Firefox which doesnt support Auto Close
       try{
           this.focus();
           self.opener = this;
           self.close();
       }
       catch(e){

       }

       try{
           window.open('','_self','');
           window.close();
       }
       catch(e){

       }
   }
}

Sadly, Firefox happens to be the exception here, as you cannot close it from the JavaScript. For other browsers, this script should work. Alright, but how do we hook this JavaScript to Wicket? First, we (obviously) have to include the .js file that contains the above script into our page. In Wicket 1.5, we then actually have multiple options for calling this JavaScript from code. Let’s say we have the following class:

public class CloseWindowPage extends WebPage implements IHeaderContributor {

    private AjaxLink<Void> link1;
    private AjaxLink<Void> link2;

    private boolean closeWindow = false;

    @Override
    public void renderHead(IHeaderResponse response) {
        if (this.closeWindow)
            // This JS is executed after the page is completely loaded
            response.renderOnLoadJavaScript("closeWindows();");
    }

    public CloseWindowPage(PageParameters parameters) {
        super(parameters);

        if (!parameters.get("close").isEmpty())
            this.closeWindow = true;

        link1 = new AjaxLink<Void>("link1") {
            @Override
            public void onClick(AjaxRequestTarget target) {}
        };
        link1.add(new AttributeAppender("onclick", "closeWindows();");
        add(link1);

        link2 = new AjaxLink<Void>("link2") {
            @Override
            public void onClick(AjaxRequestTarget target) {
                // Do some stuff...

                // Redirect to this page, set the parameters
                PageParameters params = new PageParameters();
                params.add("close", "true");
                setResponsePage(CloseWindowPage.class, params);
            }
        };
        add(link2);
    }
}

I added two links to our sample page. The first option to call this JS function is not really much of a Wicket solution – basically, you create a HTML link (or a button), and set its onclick attribute to call our JavaScript function, like this:

<a href="#" onclick="closeWindows();" wicket:id="link1">Click me</a>

To set the attribute of the element from Wicket, we use the AttributeAppender class, but in essence, it does the same as you would write the event handler in HTML. link1 is an example of such behavior. My case, however, was different; when a user clicks a button/link in our application, the Wicket must do some background work, before the browser should close. In this case, the AttributeAppender will not work. We solve this problem by using the renderHead overriden method, and depending on the page parameter, we inject the JavaScript code calling our funcion into the body onload attribute. All we are left to do is to implement a link, override its onClick method, do the work we need and finally redirect to the same page, using the page parameter. This behavior is demonstrated by the link2 component. I hope I offered some insight and threw an idea or two out there. Now to wait for Firefox to enable the window closing action…