Archive for the ‘Geek’ Category

Our first DjangoDash: Try-Box – A truly interactive Python and Django Tutorial

On 17th and 18th august 2012 we participated in one of the most exciting python community-organized events: the Django Dash.

48 hours of pure adrenaline to put all of hour skills to test in order to create a cool application. Our goal was to build something that would add value to the community and would be a starting point for us to continue working on an interesting project.

Background

Are you familiar with Try Git? You should. You can learn about it at try.github.com. It’s an interactive tutorial created by the Github team to show show in a very simple way how to work with a Git repository. It emulates a console, allowing a subset of Git commands to be executed.

Yes, your guess is correct: our idea is intended to be an evolution of Try Git. We set out to create a virtual development environment that worked as an interactive educational platform. A bit too ambitious for only 48 hours of development, isn’t it? Well, we thought of that too but we liked the idea so much that we decided the Django Dash to work on an alpha version that was good enough as a starting point.

Our score at the competition wasn’t as good as we hoped for. Anyway our coding skills were really improved, we gained a bit more of hackathon experience  and most important of all we learned a lot from exchanging ideas with the community and from receiving feedback from the judges.

The Mission

The goal of Try Box is to allow the user to learn about different programming languages, libraries and frameworks by interacting with an assisted development environment.

The environment has 6 main components:

  • Continous Github integration
  • A Tree-like filesystem browsing widget to edit files
  • An Enhanced text editor to put in all of your magic
  • A bash console for executing commands as needed
  • A Virtual application server to test the application being built
  • Most important: a wizard to guide you through the steps to create an application

Milestones, Steps & Hints

The key to understand the tutorial is to know that there are a number of milestones to be reached. Each milestones is reachable by following a number of steps. The user might need hints to complete each step. A milestone is a conceptual unit that belongs to a tutorial and hints are little pieces of advice given by Try Box to help the user to go through the steps to complete the milestone.

For each step, once that it’s been completed by following all the hints, Try Box will enable the “Next” button to go to the next step. Behind scenes, Try Box back end will run a set of tests to ensure the required result of the code given by the user, and if successful it will commit the code and push it to Github.
Once the tutorial is complete, project will be available on Github along with commit history so the user can review or share code, or even use it as a starting point for a another project.

The team

Sophilab’s was represented by three of our magicians:

Educators and learners

As you can see, there are two strengths about Try Box that are very important in our opinion. It’s designed for educators. From the very beginning we took both actors into account: teachers and students. This platform must assist not only people who seek to learn, but people who want to teach about best development practices and new technologies. Everyone willing to create a tutorial will be able to do so by following a well defined set of configuration patterns.
It’s designed for those who want to learn a new technology but don’t really have the time to configure a whole new development environment. With Try Box, you won’t need to install anything on your local development box. Simply follow the tutorial and see your progress in real time.

Current Status

  • Github integration: 60% complete
  • Navigation tree: 70% complete
  • Editor: 80% complete
  • Interactive console: 30% complete
  • Interactive hints: 10% complete
  • Interactive steps: 80% complete
  • Virtual application server: 10%complete
  • Tutorial creation support: 0%

Technologies

python, django, google closure, 0mq, fabric, supervisor

Contact

If you’re interested in joining us and develop a component, please contact us at contact@sophilabs.com, we’ll be really happy to hear from you. You can also take a look at the project status at https://github.com/sophilabs/trybox


A jQuery Counter Plugin

Overview

A jQuery counter based on http://code.google.com/p/jquery-countdown with extra options like the ability to count up.

  • Format: fully customized using an element attribute or an init option
  • Direction: Up or Down
  • Stop: fully customized using an element attribute or an init option
  • Appearance: fully customized using CSS3
  • License: MIT

View Demo on GitHub

jQuery Counter

Options

Options can be set by attribute data-<name>="value" or in the options hash on counter initialization: $(element).counter({name: value, ...})

  • direction: up|down Counter direction – default: down
  • format: string Defines the number of parts and the maximum number for each of them – default: 23:59:59
  • interval: number Sets the increment/decrement in milliseconds – default 1000
  • stop: string Sets the counter stop number – default: maximum number allowed by the format.

Events

  • counterStop: Raised when the counter reaches the stop number
$('.counter').on('counterStop', function() {
    //code
});

Usage

10 seconds countdown:

<span class="counter">0:10</span>
<script type="text/javascript">// <![CDATA[
  $('.counter').counter();
// ]]></script>

120 seconds count:

<span class="counter" data-direction="up" data-format="120">0</span>
<script type="text/javascript">// <![CDATA[
  $('.counter').counter();
// ]]></script>

Binary counter stopping at 001000000 (note the spaces between the binary digits):

<span class="counter" data-direction="up" data-format="1 1 1 1 1 1 1 1" data-stop="">0 0 1 0 0 0 0 0</span>
<script type="text/javascript">// <![CDATA[
  $('.counter').counter();
// ]]></script>

Download

You can download jquery-counter from Github.


Converting Microsoft Word documents to PDF programmatically – server side.

We couldn’t find one plain and simple example on the web so we’re posting it here in case it helps someone. Our requirements:

converting DOC and DOCX to PDF from command line, server side.
No X of course. (LibreOffice excluded).
Not just DOC (Antiword excluded).
Debian packages whenever possible (python-docx excluded).

Log in to your server:

sudo apt-get install abiword
abiword --to=pdf --to-name=<your_document_name.pdf> <your_document_name.docx>

That should give you “your_document_name.pdf”. We’re just interested in extracting text, so we’re not sure about format quality.

Enjoy!


Python Access for JIRA Part I

A while ago we were required to add functionality for some project. It was about a portal where customers could log in and manage some assets. Our client wanted their customers to be able to create JIRA tickets so the support team would be able to take action. Of course JIRA is too complex for the regular user, so we were required to build a simple interface with JIRA, and to add some fancy stuff like charts showing working progress and amount of tickets by priority.

JIRA RPC service is very limited, so we decided to create our own interface to JIRA in Python.

This is what the class looks like:

class JiraHTTPConnection:

    def init(self, domain, username, password):
        print domain
        self.__cookie = None
        self.__headers = None
        self.__connection = httplib.HTTPConnection(domain)
        response = self.get("/")
        data = response.read()
        self.__headers = response.getheaders()
        self.__cookie = [x[1] for x in self.__headers if x[0] == "set-cookie"][0]
        self.__login(username, password)

    def get(self, path, headers=None):
        if headers is None:
            headers = {"Cookie": self.__cookie}
        self.__connection.request("GET", path, "", headers)
        return self.__connection.getresponse()

    def post(self, path, post_data, headers=None):
        if not headers:
            headers = {"Cookie": self.__cookie}
        self.__connection.request("POST", path, post_data, headers)
        return self.__connection.getresponse()

These are our implemented methods:

projects
project_issues
filtered_issues
issues
issue
user
add_comment
watchers
add_watchers

I’ll post details about these methods in upcoming posts.


Error 403 Forbidden: symbolic link not allowed

Have you ever had this problem with Apache?
Well, I have. I spent a lot of time trying to find where the problem was. Finally, I found the solution, and It was so simple that I thought that hanging it in ‘the cloud’ would be a good idea, maybe there is some other unfortunate like me that is shaking his head against the monitor every time this error arise.
The story
I use to configure my applications in Apache using the Option FollowSymLinks, because they are in the development phase and I don’t want to move all my code to /var/www or whatever.
So, the idea is to create a symlink in /var/www (using ln -s) to my project folder (it is usually located in ~/workspace).
Then I add the FollowSymLinks Option in the site configuration, as follows:

<Directory /var/www/project>
    Options FollowSymLinks
</Directory>

And when I load the page in my browser:
Error 403 Forbidden:
WTF!?

The solution
I ran:

sudo -i -u www-data

Then I tried navigating the symbolik link’s path, directory by directory. Luckily, I realized that one of directories of the path’s chain was not accesible by the user www-data. I changed the permissions with chmod and voila!, the page was loaded like a charm.
I know that this is a newbies’ problem, but who knows, no one is free anyway.