Slack, Slack, Slack

When people in the general population think of the word “slack” they may think of someone slacking off and not doing their work. However people in the tech field are likely to think of Slack, the team chatting application. In fact, maybe even many tech people don’t know about Slack as it is still fairly new. However a lot of people of the younger tech based generation likely know of it, and probably make use of it in their University.

How can this adoption of students with Slack help Slack grow?

Usage on Campus

Slack is starting to make more of an appearance on campus lately. It is free to use, and works great for aiding teams in communicating. With students typically being involved in many group projects a chat system like Slack is incredibly useful. In person meetings with groups are annoying to arrange. Everyone has different schedules with both their classes, and also their part-time jobs they typically have. It is much more convenient to talk over the web.

Now almost every new groups first step is to decide who will setup the Slack team and invite everyone to it.

Why not other solutions?

Previously methods like email, text, Skype, or Facebook were being used. These all have their shortcomings. Email is too slow for the back and forth. It needs to be faster, especially if doing things like brainstorming. Text is not versatile enough and requires smaller messages and everyone to have a proper working phone that can text. Skype while it satisfies most of the problems is now fairly clunky and does not work so well across all systems. And until recently it didn’t even have a web interface. Chats also are not done offline, so in order to get a message from someone both parties need to be online otherwise the message sits in a queue and is seen later. Additionally there are no channels to manage separate pieces of work and group members.

Benefits to slack

The Slack organization may not be profiting off of all of these students using their services completely free, however they are definitely getting A LOT of advertising. And us students are a key audience to conquer as we are likely to be moving into the workplaces in a 1-4 years time, and bring with us a technology stack we are familiar with that we may influence a workplace to make use of.

With internships being so common, there is also the influence when students are on their 4 or 8 month internships to introduce new modern technology they have learned about. This has happened at my workplace and many others. The young interns introduce new technology and it is adopted.

In my case our workplace adopted a self-hosted alternative to Slack, but we originally were experimenting with Slack and loved it and it improved the workplace environment. The reason for going self-hosted was because of the policies regarding data storage. We could not be storing potentially sensitive data in an American based companies servers, nor can we assume they are not looking at that data either.

However regardless of this, the popularity of Slack may be increased at such a rate due to the students moving into the workplace.

Conclusion

Overall it is very likely that students are a big influence of many products adoption and Slack is just one of the many example you could likely come up with. It’s interesting to look at how different sources can influence a natural growth, and I think this is one of the big sources for this particular kind of application.

Looking into the possibility of the transition from introversion to extroversion

A question that I wondered is whether or not the scope of introversion and extroversion that applies to a person could significantly shift.  If someone has grown up being introverted, staying at home not caring to do things, could they break this style of life and become a person who is extroverted, and not only goes out and is social, but enjoys these activities that they may previously not have

For the purpose of this blog I’ll be looking at someone who is specifically introverted, not someone who was leaning on the edge and who may be classed with the more modern term of being an “ambivert”.

Overview

The simple answer to this kind of question is “no”. According to Hans Eysenck who did research in such a field, introversion and extroversion actually appears to be “hard-wired” in our brains. Our brain chemistry actually dictates these tendencies. Because of this knowledge it looks like it may not be technically possible to “switch” between the two traits, however that does not put an end to such a theory. Just because you will always have some introverted or extroverted tendencies and desires, does not mean that you could not end up learning to cope and adjust to a new style and end up being rated as “extroverted” on a test, even if you are wired to be introverted.

Essentially it is basic human nature that each human has to lean one way or the other, and I am trying to see if it is possible to overlap into the other domain enough that you’d be classified as a different personality type.

The Big 5 personality traits typically rate a level of extroversion and introversion using various sets of personality traits. The majority of the time you want to define personality traits of being pretty static and unchanging, otherwise they really are not personality traits, they are more so effects of the environment you’re in.

There are also many theories and scientific findings that suggest that you’re born with certain personality traits and they cannot really train, however they may adapt or you may appear to have different personalities based on different environments.

Changing of Personality Traits

As just discussed, it is very unlikely that you can ever really change a personality trait. But it sounds like traits can appear often times based on different environments people are in.

Therefore by surrounding oneself with extroverted people often and social environments transitions, abiet temporary transitions to other traits may be possible.

Using this reasoning, someone could likely acquire many extroverted traits, while still being biologically an introverted person. They may even still feel very introverted in situations and want to be alone. However, I’d argue that this can be coped with, just like mental disorders like anxiety and depression, which are often traits that relate to introversion.

You may be able to see where this is going. If you can expose yourself to situations that are extroverted style events, and also to learn to cope with personality traits that may draw you to the introverted side, is there a reason to say that you are not extroverted?

Is this possible?

Is it actually possible? You could argue that someone was really extroverted in these cases and maybe didn’t know it, or that their introverted tendencies were already not strong to begin with, and by modern standards may be classed as an “ambivert”.

Looking at the scientific data I doubt it is really possible to switch between the two, however I do believe the studies that suggest coping is possible, and you can employ a “fake-it-till-you-make-it” approach.

And maybe there is nothing wrong with that either?

Conclusion

In the end it seems to come to the conclusion that while you can’t get away from being introverted, you can try and implement coping methods to be more extroverted. Being an introverted personality does not mean you still can’t desire and want to be social and do social activities. No need to let a label define how an individual must feel or act in their day to day lives.

Setting up a quick and dirty image host

I wanted to be able to host images on my own host that could be directly linked to without having to worry about other services. Sites like Imgur are great, except I would rather keep my images on my own host so that I can have access to them all easily. But I still wanted to use tools like ShareX to upload quickly and share images.

Summary

First off, let me explain what you’ll end up with. You end up with something like https://i.jhvisser.com/Dgui.png . This will be a direct link right to an image. I created this right from ShareX without having to do any manual work.

Setting up DNS

DNS is a matter of simply setting up an A record pointing to the subdomain you want to use for the record.

Here is what my Cloudflare DNS looks like for the i.jhvisser.com part:

IL5p

That is all you need to change for the DNS.

Apache Configuration

The apache configuration is what I’ll be showing here, if you use a different engine you’ll have to figure that out on your own. I am using Ubuntu 14.04 LTS so my apache file locations may be slightly different than yours.

I created a new file called /etc/apache/sites-available/i.jhvisser.com.conf. 

The file ended up looking like this:

Let me explain what is going on in this file, since it looks a little big for what it is doing. The virtual host section for port 80 is simply redirecting everything to the HTTPS version of my site. I know these are just images, but I might as well serve them with HTTPS, with Let’s Encrypt there is not much reason to not use SSL.

Virtual Host changes

  • I set the “ServerName” and “ServerAlias” to be that of my subdomain. This should be the same as what I made my A record in the DNS.
  • I specify the directory my images are “/var/www/images/”.  Within this I setup basic authentication, but only on the directory itself, not the files within it. This is so that I could still have access to the directory index to see all the files, but don’t have to worry about everyone seeing this.
  • I also have the required elements for using an SSL cert setup.

Then to finish off the apache setup just run:

sudo a2ensite /etc/apache/sites-available/i.jhvisser.com.conf

This will enable the configuration. Make sure you adjust the SSL part or just use the port 80 virtualhost and don’t have SSL.

Permissions

You’ll need to make sure that the directory you’re storing the images has permissions to be viewable on the web. In my case I made it own by my www-data group, and my user account is part of this group. That way there are no permission problems when uploading.

ShareX Setup

I will be showing how to setup ShareX here, however the settings are similar for most programs. It is a matter of setting up ftp/sftp in your screenshot program. In the “destination settings” I added a new FTP configuration:

ShareX Destination Settings

ShareX Destination Settings

Once the destination is set, I needed to also make sure that the selected image host to use is “FTP”:

ShareX Image Host Selection

ShareX Image Host Selection

And then to complete this I also wanted it so that a random 4 character string is used for the image name, instead of something longer. I did that in the “Task Settings” under “Upload”. I changed the name to “%ra{4}”:

ShareX name settings

ShareX name settings

 

And that is all! You should now all be setup! If you have any questions feel free to ask me via the comments or contact me by email.

How to use Google Chrome’s New Options v2 with your Extension

Email Print Page Cleaner Options Picture

Email Print Page Cleaner Options

Google Chrome has a fairly new feature that allows “options” for extensions to appear in a popup page right in the extensions listing page. This means no new tab needs to open which makes things quite convenient. It still also allows you to use custom HTML and Javascript on this page which is exactly what I’ll be talking about here.

I suggest starting off with reading the Google Chrome Extension Developer page regarding the options v2.

It covers mostly everything, except some parts could be slightly confusing so I hope that this blog post gives a good example using my Email Print Page Cleaner extension as an example where I recently incorporated these new options into.

Implementing

Let’s go through the steps to implement this.

Manifest

The manifest page seems like one of the ideal locations to start this off. All you need to do is add these 4 lines into your manifest:

Now there is also another thing you need to add to the manifest which the chrome guide fails to mention. You are using the storage API here and as such you also need the storage permission added to your “permissions” section. It is as simple as adding "storage" to the permissions list you likely already have. Here is an example of what mine looks like:

And that is all for the manifest.json file.

Options

Now as defined in the manifest file we are making a use of the “page” that was named options.html, so we will need to create that. While creating that you might as well create an options.js file as that will be used to save and load our options.

I will simply paste below what my options.html file looks like and then explain what exactly is going on with it.

I have created three checkboxes with labels. The standard format for these is the following:

Of course, I have included these within the <body> tags as this is the body content, and outside of those <body> tags is the basic HTML template that you’ll see in almost every HTML file out there.

Once I have finished creating the 4 checkboxes with associated labels I also have a button and div for the status message which uses this code:

And last but not least the script tag which is used to include the Javascript  options.js file.

 The options.js file is almost the same as the one straight from the Google’s page so I will skip that part. If you have questions about it though feel free to leave any questions you have in the comments. You can also checkout the full code I have on Github.

Using the saved options

Another skipped element by Google is how exactly you can make use of these saved options. In my main.js file which is where my extensions code runs I create some variables with my defaults for the options. It is key to remember that someone may not necessarily ever go to your options and hit save so they may not have anything saved in the storage yet so you’ll definitely want to ensure there are defaults set. I just created some variables like so:

From here I just use the standard Chrome procedure for getting data from the storage:

And that is all that is required to grab the content. And then you use those just like normal variables.

Final Words

If you have any questions or concerns I’m always open to hear them via the comments or to my email blog@jhvisser.com

Email Print Page Cleaner Updated v1.1

Email Print Cleaner Logo Picture

Summary

Email Print Page Cleaner  is a little tool that I created a while ago to allow people to remove the Gmail logo from pages that they wanted to print. It only removes the logo on the print page.

Changes

I’ll briefly go over the changes I have made to the project.

Options page and Extra Removals

What I have done now is added an options window which allows additional choice as to what to remove, and gives even more options of what to remove than before.

A user can remove the following:

  • Hide the Gmail logo
  • Hide your email address
  • Hide the subject
  • Hide the sender details

These options can be seen in the screenshot of the options below:

Email Print Page Cleaner Options Picture

Email Print Page Cleaner Options

Check if print page

I used to not be checking if the Gmail page was a print page or not and was executing Javascript on every page trying to remove the Gmail logo. It would not work as the extension only ran on load, and when Gmail loads it actually has a loading screen first which means nothing is removed on that page. I noticed that the Gmail page appends “Gmail” to the title, whereas the print page prepends “Gmail” to the title.

So my method to avoid some extra code being executed is to just check if it starts with “Gmail”

How the Extension Came to be

I never thought there would be this much demand for such an extension (over 1000 people use it), and actually only made it for one person originally who had asked a questions on Stack Exchanges Webapps question site. I just released it to the public in case others were also interested and it looks like they were.

The code for this project can all be found on Github.

Technical Details

I used Google Chrome’s new v2 options page which nicely allow me to integrate the options page directly in the extensions list page as a pop-up. This also appears to be the new standard that will be used and the old one is being phased out.

Of course I opted to use Chrome’s sync function so that a users preferences are synced to their other systems as well. Oddly enough not many extension use the sync storage. Granted it does not store as much data, but it should still be enough for most.

Contact

If there are any problems feel free to leave a comment on this post or email me at print@jhvisser.com

The Journey of the University of Guelph Course Schedule to ical (.ics) – A Google Chrome Extension turned Webapp

Premise

Before I delve into the journey, let me express what the premise is. Like almost any student across the globe I have courses that I am taking in school and I have various times and locations for all these courses. Some students are given a beautiful interface for seeing this data and given lovely tools such as the ability to export to a calendar. Our system gave no such option, and was displayed in a quirky format.

I wanted all of my courses added into my Google Calendar so that I could get all the lovely features that come with Google Calendar, such as notifications, syncing, location support (can quickly pull up location in Google Maps). Moving all of these courses over would be time consuming manually. This leads into the journey…

Journey

I needed a way to get my courses into Google Calendar, and I thought others may benefit from such a tool as well so I sought out to make a browser extension which allowed you to export a course schedule simply by being on my school’s schedule view. A new button was added that looked native to the system being used and allowed you to simply download a ical (.ics) file which can be exported into almost any calendar application. Using fancy recurring events and everything. Nice and simply, no hassle for the user.

At least, I thought there was no hassle at first. The problem was that I was isolated to only helping ease the usage of our system if a user was on Google Chrome. Many people at Universities are mac users, and I realized a decent portion of people were using the default Safari. Before going into the problem of cutting off users, let me show you what exactly I added to the page:

Example of Export Schedule Button

Of course this button was not easy to find when you first started using the plugin. There were pictures in the Google Chrome screenshots advertising the extension, however as I should have assumed most users did not look at that. I’m still very far from being any kind of user interface expert here!

So the Google Chrome extension had to go. It would not be ideal to make the browser extension that supports all of the browsers as it gets harder to support such a product when working solo on this, and also came back to a similar problem of inconvenience. The effort involved for someone to add an extension to only be used for a few seconds seemed pointless. You were wasting a lot of the time you were trying to save. Not to mention you’d like only ever use the extension a whopping two times in a year so it was a waste of resources to even really want to keep installed.

I opted to keep what was working, the ical exports, and instead switch over to a webapp. I noticed: “hey, all of these course pages have the same format”. This meant that I could then get out some regular expressions and simply play around with parsing out the exact content I got before into the Google Chrome extension. In fact, with the help of regex101 I managed to get some nice regex setup and working leaving mostly just the ical part left.

Here is where I learned some of the importance of writing modular code. I was able to use almost unaltered code from the Chrome extension in this webapp. I just had to pass my old functions the correct data that was now parsed via regex. In the Chrome extension I actually injected the Javascript into the page and directly used one of the pages variables containing the course data.

In total since I could use most of the code from my Chrome extension I actually only spent a few hours making the web app which I have named “Course 2 Calendar“. The project is also open sourced for all to see and use. Who knows, maybe you want to apply my hacked out code to your own project specific to your school?

I should also mention that I reached out to Trackjs which graciously provided me a free account with their service as I am running a not for profit open source project. Using this tool I could work to ensure my export strategies for the ical download providing was working properly on many browsers and try to eliminate some bugs appearing on some browsers. The problem with Javascript in browsers is that some browsers try to nicely fix errors and not mention this which means there are problems on other browsers. It also helps as I have no idea what a user may enters to cause an error so it is great to have a log of the stack trace when an error is thrown. Here is an example of my messages page

trackjs messages image

Google Chrome Developer Dashboard notification annoyance

A little short post just sharing an annoyance with Google Chrome Extension Developer dashboard since many people will not have seen this side. You have the option to enable “User Feedback” for your Chrome Extension. It definitely has the potential to be a great tool for both the developer and the user. Looking at a Chrome extension there will be a “Support” tab that appears at the top of the extensions page, and it will allow the user to leave feedback/bug reports and see replies from the developer. This is great for potential users as they can see if there are any current problems, and see if they are being addressed as well as see if the author is engaged in interacting with the user. A great easy way to get feedback and respond.

The problem however is that there are ZERO notifications for this. That is right, if a user leaves feedback or gives you a bug report you’ll have no idea unless you are vigilantly checking. I had 3 users all report the same issue to me about an extension I wrote and forgot about, and didn’t know the extension was broken until a month later when I checked the feedback and noticed these reports. You get absolutely no notifications, and even when you respond to the feedback, I don’t believe it will notify the user who left the feedback either.

This flaw alone makes the whole system quite pointless. Might as well turn the “User Feedback” option off and use Github issues or Uservoice. And it seems this is what almost every extension does do, and with good reason.

University of Guelph Web Enhancer Update!

University of Guelph Web Enhancer has gotten an update!

The extension now grabs information about new terms from my website so that when new terms come out, I don’t need to release an update just for the extension to work with the new terms, and it also means that the extension now supports all of the terms web adviser will display, not just one at a time.

If you have any suggestions for new features or any issues feel free to let me know in the comments or via my email:

extension@jhvisser.com

NetZero Hackathon – Community Spark (2nd Place!)

A couple weekends ago I was part of the NetZero hackathon. The NetZero hackathon had the goal of assisting homeowners in some way with their NetZero home. Of course this area is pretty niche with not a huge user base yet so we decided to expand ours to target energy saving in general.

The Problem and Idea

A problem we thought that many NetZero homeowners faced is that they are a rare breed, there are not exactly many people like them yet and as such finding other like-minded homeowners is not an easy task, nor is staying in contact with them always easy. We wanted to help people communicate with each other, whether it be sharing tips, earning imaginary internet points, or even sending each other messages just like a social network, we wanted to give them a place. So we set out to build Community Spark. Community Spark (you can login as TheLightningBolt with the password tesla1) is a website that brings people together. Not only that but it incorporates statistics about a houses usage. You can set goals and see progress and compare to other households of the same type. You get to see trending posts from the nation, as well as you can visit a more personal community page.

With this idea we ended up taking home 2nd place. Of course, we could have done better on the business side, but considering our competition consisted of many 3rd and 4th year students I think we did fairly well! You can also view a more official results page on the SoCS website. Pictured below is our team as well as our awesome sponsors!

The Technical Details

These are the details most probably don’t care about, but I am always interested in them, so I can’t be the only one!

Our server was being powered by the same server that is powering this blog you are on right now. It is using a 1GB VPS from Ramnode using the latest LAMP technology. We are using the Laravel 5 framework so that we could develop fast and efficiently and avoid leaving any gaping security holes due to our rapid development. Using Laravel gave us access to extra tools like a powerful Blade theming engine as well form builders. Overall without Laravel we may have spent a lot more time developing things for the project and got less done.

For the client facing side we were using Bootstrap with jQuery and Chart.js (for the fancy graphs).

Comments

If you have any comments or feedback on our project you can feel free to leave a comment on this post. If you’d like to address us more personally or about a business request you can email about this project using the email spark@jhvisser.com

A Browser Extension to hide the troll comments on YouTube – An Inside Look

Intro

My contribution to the “Hide Fedora” project has mostly been providing the web backend for the extension itself. Before I get into details as to how the web backend works I’d like to provide some insight into the purpose of the extension. And from the original author, why he made the extension:

I created the extension to learn how to make browser extensions and what better way than making something that I could actually use – Extension Creator

And his answer to the future plans with the extension is a simple “World Domination” answer.

The Whole Process

How the Hide Fedora process works.

Background

If you browse a lot of YouTube videos that you find on Reddit’s /r/videos subreddit you will notice that the comments of these YouTube videos are rather sabotaged by users identifying from /r/redditarmie (not linking this one). They post “troll” based comments posing as fedora wearing people, making fun of Reddit, and various types of people, including stealing people’s profile pictures and using them as their own. YouTube isn’t doing anything about it, and luckily I found the Hide Fedora project and noticed that the method of adding new users was rather old school.

  1. Find someone with a “Fedora” comment
  2. Go to their Google+ profile
  3. Get the Google+ profile ID from the URL
  4. Add this to a JSON file in a Github repo
  5. Submit a pull request

Read more →