I am just reposting this article.
In this post I am going to talk very quickly about what is new to JBBar and what it offers. Bear in mind JBBar was designed with my own requirements at the forefront which include a dark mode, floating 'orb' icon, a search box and the ability to flip between fixed mode and non-fixed mode (and of course to be responsive, essential of any menu these days).
JBBar has at the very core the intention of being a lightweight, easy to use menu that is open for future development and expansion. The aim of the menu is to create a flexible menu that takes little or no real room on the host server and takes no time to download to the client's computer.
Although in appearance this menu is identical to the menu used before (jQuery SmartMenus), it is an entirely new menu. The menu I had before appeared the same way due to make a lot of modifications to the design, most of which inspired JBBar. These core design concepts paved the way to the creation of this menu - too much modification of another menu is counter productive when an update comes out that fixes vulnerabilities or core flaws.
One of the key things missing from the other menu used was the search box. JBBar does not include a search box but provides a wrapper so that you may choose your own search box.
The next core concept that I have kept is my floating orb idea. I have integrated this much more deeply into the menu which should help improve compatibility with older browsers as well.
I also mentioned dark mode. This was a key feature I wanted in JBBar. Now it is deeply integrated as a core feature.
There are plans to bring div dropdowns as well as the possibility of a right-hand side menu and I am considering options such as instead of using the dropdown menu in mobile using a slide out menu (there will be a quick option to toggle between left hand slide out menu and top drop down).
As you may already know, I have been working on a new project which is known (currently, maybe not forever) as JBBar. JBBar is a lightweight menu for websites that you will find across my website (look up at the top of the page). It is designed to be flexible in that it will work on a mobile device as well as on a desktop device. A lot of time went into this menu before I officially released it to my own personal website as a non-development stage menu.
A lot of time was spent getting round a major flaw in devices of today. I talk specifically about interaction. It is of course somewhat obvious that touch devices work differently to those which include pointer devices, and currently JavaScript is not quite ready enough to detect these differences. The resolution is somewhat annoyingly fiddled together.
The issue arises because touch devices register a hover event as an event despite tablets not really featuring hover. Thankfully, they also register click events. Of course, on a desktop browser, you want to hover over items to show them when in the full-sized menu but when it scales down you really want to have to click on items (if you are on a desktop browser, take a look and see what I mean by scaling the page).
Here's the issue: click and touch register at the same time (sometimes even twice each) on touch devices. To fix this, there is a very slight delay then a variable is set to say the event has been fired and not to fire again. This then causes problems on desktop (a viable 'hack' would not be to use user agent sniffing - it's ugly). The issue resolves itself however, I do not need to register hover events on screen sizes that use the mobile menu (900 pixels or less) and only want to see click events.
There you go. Done.
If you interested in a free, open source, very lightweight menu for your own projects or websites, feel free to read more about it from here.
I am very happy to say that as of today I have released to DevNet my new JBBar, a lightweight and flexible menu that is responsive and flexible. It works on all tested devices currently including touch and click devices.
It is now available as a jQuery plugin too, so feel free to download and try it yourself. Instructions can be found on DevNet as to how to do this.
I am very, very happy to announce a new menu on my website! This is the fifth new menu on my website and this one is absolutely here to stay!
The reason I know this one is staying is because I made it - meet JBBar.
As part of my Neutral Web controls I decided to create a menu that is responsive and looks similar to my previous one.
I previously used jQuery SmartMenus, which gave me inspiration for my own menu. The theme is designed to look suitable for BootStrap but also to give maximum flexibility.
The source is written in JavaScript and SCSS, so it's easy to modify. In comparison to SmartMenus, my menu is so lightweight that it barely makes a difference including it - just 272 lines of code in the SCSS file at the time of writing this post.
In order for me to get SmartMenus to work on my website the way I wanted, I had to do a lot of alteration to the code. I also had to use the BootStrap theme and cut it down as much as possible to make it work as I needed it to. My menu is so simple that it just gives the basic JavaScript functionalities and the core of what is needed. It's also miles easier to update and tailored to how I want it.
You probably will not notice any difference in the design. The differences are so subtle that perhaps the change was only necessary for back-end reasons and not for front-end aesthetics.
There is still a lot needing done on the menu, but the general front-end functionality is done. You will notice it is now available across the whole website.
I also have added a new section to my menu called Projects. This section currently redirects you to the appropriate pages on my website but soon will be a dedicated section again, specifically for projects that are current or completed.
The SmartMenus menu I used before
The new menu called JBBar that I have created myself
This year, Apple's September event was, in a word, mediocre.
For those that did not see the event or know much about it, you can read more in the previous post on my blog.
The majority of the event focus on iPad. The new iPad Pro that Apple launched is 'the biggest thing to happen to iPad', literally. The iPad Pro is a 12.9 inch iPad (as predicted) which also has a new Smart Connector to connect a specific external keyboard. It also comes with a digitizer known as the Apple Pencil. The Pro is designed with business folks in mind.
The other major announcement was the iPhone 6s. Again, this was pretty much predicted down to the last feature. As expected, it supports 4K video recording and has a 12MP camera. The other new feature that was added was Live Photos, which are basically small video recordings take with photos and attached to them. This will work with El Capitan and iOS 9 and hopefully other devices in the future so that we can relive those photographic moments. As someone who takes a lot of photographs and loves to make memories, I really like this idea. The 6s also features faster Touch ID and more, but these features were pretty minor in the grand scale.
Apple also announced the next generation of Apple TV. This model brings solid state storage to the device and a remote control with both motion sensors and a microphone. Personally, this was the biggest announcement of the day. The storage is included so that app from a new dedicated Apple TV App Store can be installed.
There was no mention of Macs, but there you go.
This post is a collection of all the information you will need from the keynote today. I will likely do a full review of this in the next few hours.
The introduction
The start of the keynote was all about Watch OS 2 and what it has brought to the Apple Watch. New Watch apps include Facebook Messenger, a Go Pro app, iTranslate and a new app for measuring pregnant mothers.
iPad
Tim Cook talks about how the iPad has changed the way we work and create. Now Apple asks itself how they could improve it. The result, the biggest change in the history of the iPad: the iPad Pro. Does this mean I will need to update my website's media queries?
The Pro looks beautiful. The iPad Pro is twice the height of the iPad Air 2 in width. It has 5.6 million pixels with a resolution of 2048 by 2772 pixels on a 12.9 inch display. It features an Apple A9X APU which is now 1.8x times faster than the iPad Air 2 in CPU performance and 2x faster in graphics performance. It is faster than 80% of portable PCs sold in the last year and faster than 90% of PCs sold in the last year in terms of graphics.
All this, and still ten hours of battery life and incredibly slim (6.1mm)! It also features a four speaker audio system.
The iPad Pro was actually expected by many, so the shock was rather small for me!
Apple also introduced the Smart Connector, which allows a new physical Smart Keyboard to be attached to physically to the iPad and whilst I do not like the looks of the official keyboard but the physical connection is a huge bonus!
Apple also spoke about a new accessory called Pencil. Pencil is basically a really awesome stylus for the iPad.
Microsoft had a say today at the event as well - they announced that they were bringing features for the Pencil to Microsoft Office that allow input from the Apple Pencil. It's nice to Microsoft and Apple working together on this.
Adobe also spoke about their new apps that are coming to the new iPad. Adobe Comp looks really impressive (maybe not something I would use) and the multitasking works so well with it.
The new iPad Pro starts at $799!
The iPad mini 4 also got a short introduction. It is simply a smaller version of the iPad Air 2.
Apple TV
Today, Apple "did something" about the lack of innovation in the TV industry.
The new remote uses a new touch surface that makes it fluid to move around. This is a more innovative way to interact. The new Apple TV also supports voice commands through Siri.
The Siri search also searches across multiple apps including Hulu, Netflix and iTunes, all in one search. Siri can also rewind the video and put subtitles on when you mention that you missed what someone said!
There was a lot of focus on the new screensaver features, which doesn't really interest me but there we go. There was a bit that really touched the inner Bond fan in me as well which was nice!
The new Apple TV also now features its own App Store.
The games coming to the Apple TV look incredible.
Unfortunately, Tom from Hipster Whale didn't make it across the road in Crossy Road. Crossy Road looks lovely on the new TV, but I'm not sure I'm that thrilled by the idea of games on my Apple TV with the remote.
Apple has also taken the concept of hand off further by allowing you to continue playing games you own on your iPhone and Apple TV.
Oh and yea, my favourite feature, it has HDMI-CEC. The new Apple TV has 32GB or 64GB of built in storage. The new Apple TV has all the same connectors as the previous one other than the removed optical audio port.
iPhone
The iPhone 6 is the most popular iPhone ever and indeed they are the most popular and most loved phone in the world. Tim Cook now asks, how do you continue that success? The answer, the iPhone 6s.
The new iPhone 6s looks exactly the same as the iPhone 6, but it changes are phenomenal.
Multitouch is replaced by a new type of interaction called 3D Touch. As expected, this is a similar technology to the new Force Touch Trackpad found on the new MacBook. iOS 9 deeply integrates this to allow contextual data to appear where it could be considered useful. I really like the looks of this and cannot wait to try it out in the next few weeks. At this point, 3D Touch looks well integrated into iOS.
The new iPhone is also made with a new 7000 series aluminium. The new iPhone 6s also features the new Apple A9 APU. It is supposedly 70% faster in CPU tasks and 90% in graphics tasks. The new iPhone 6s has a new fingerprint sensor for Touch ID which is twice as fast.
The new camera is 12 megapixels, which will increase resolution but not at the price of quality. The new camera seems to take great photos. It can now take 4K video (that's 8 million pixels!). The front FaceTime camera now also has a flash that uses the display of the camera using True Tone technology.
Live Photos now also add a small video to the photo, which allows the photo to transform to something that moves.
Apple are also adding a new Android transfer app that they consider the 'neighbourly thing to do'. This allows Android users to transfer much easier.
Prices are still the same of the iPhone 6s, starting at $299 for the 16GB.
Apple are also launching a new iPhone Upgrade Program that entitles you to a new iPhone every year and includes an unlocked iPhone and AppleCare.
The best news, iOS 9 will launch on the 16th September.
The new ad had a slight rip off of the 'Okay Google' adverts but it was very Apple.
To finish
Tim Cook made a really nice tribute to the all the Apple employees and there was, as always, some live music (this time from One Republic) and a song specifically for Tim Cook.
And that is it for another year from Apple.
Just a quick reminder that Apple's September event takes place today at 18.00 UK time.
You can find out more on Apple's website.
Possible releases could be a new Apple TV, a bigger iPad, the iPhone 6s, new Macs and more information about the new OSes.
I would love to make a liveblog on this, but unfortunately my host runs an Apache server and not an nginx server therefore every livepost I make ends up overloading the server so I will do a summary post at the end.
Just yesterday I got myself an Xbox One (There may be a review on this coming soon). I tried out Internet Explorer on it, which I found out was Internet Explorer 10.
I also discovered that my PHP script to detect Internet Explorer 8 accepted Internet Explorer 10 as being an older version than Internet Explorer 8. This is a simple mistake to make but it's also incredibly easy to fix.
Here was what I had:
preg_match("/.* MSIE [1-8] .*/i", $userAgent)
And here is a working solution, to detect all browsers less than IE8:
preg_match("/.* MSIE [1-8].[0-9]?; .*/i", $userAgent)
And the reason for this happening is down to the fact this only checks the first number of the version, not the second, so IE10 would be recognised as IE1. I also put in, just for the sake of it, a check for a dot (.) and a check for a minor version number ([0-9]) and a semi-colon at the end. At the beginning and end of the regular expression match are any symbols.
Finally, I have managed to get Windows 10. And the good news is it was so easy to install on my Mac (not like my PCs).
Windows 10 scaling features work well, unlike Windows 7, 8 and 8.1 so I can finally use the high DPI of my Mac's display with Windows. I've been waiting for some time (since August 2014) to use Windows on my Mac (I had Windows until April of that year on my older MacBook and I've always had it on my Mac mini as well) and it's nice to finally have it again!
My tablet has just finished upgrading to Windows 10 as well due to the fact that unlike the installer Microsoft has been giving out, 'burning' a plain old ISO to a USB drive on my Mac works.
I will finally get round to doing my review. In general, I'm positive about the experience I'm going to have with this OS, considering Microsoft's tick-tock cycle of good OS (ME, XP, 7, 10) then bad OS (2000, Vista, 8).
