Tag: software
ExtJS 2+ Navigation Plugin for creating simple site navigation.
I use the ExtJS library a lot. In using the library I found in 3.0 they support a grouptab panels. Unfortunately, I am still working on 2.2 and needed a similar solution that is compatible with both ExtJs 2.2 & Ext 3.0. My goal was to build a clean navigation similar to ExtJS 3.0 groupTabPanel option. What I came up with was small extension on the library that works with Ext2.2+ and will allow me to upgrade later without having to change any code. Below you an see an image of the example of NavPanel my first ExtJS extension.
NavPanel example screen shot.
Features
- Clean/Fast Navigation creation with minimal code.
- Can support multiple navigation panels on same page each target to different Panel.
- Supported by ExtJS 2.2+
- Syntax similar to other Ext Objects.
- Menu layout adjustable (including icon positioning)
Usage
Here is a simple code example usage of the extension:
Basic Example Usage
viewPt = new Ext.Viewport({
layout: 'border',
border: false,
items: [{
xtype: 'panel',
region: 'west',
border: false,
bodyStyle: 'background-color: rgb(40, 120, 50);',
width: 200,
items: [{
xtype: 'navpanel',
width: 150,
panelXAlign: 'right',
yOffset: 10,
menuItemAlign: 'left',
activePanel: true,
target: 'centerpanel',
defaultItem: 1,
items: [{
header: true,
text: 'My 1st ExtJS Ext',
iconCls: 'myspecial_header'
},{
text: 'Ext.ux.NavPanel',
icon: 'asterisk_yellow.png',
items: [{
xtype: 'panel',
width: 500,
height: 200,
style: 'padding: 10px;',
title: 'Sample Panel',
html: 'something special'
}]
}]
}]
},{
xtype: 'panel',
id: 'centerpanel',
style: 'padding: 10px',
height: 500,
width: 600,
border: false,
region: 'center'
}}
});
Files
This zipfile contains all the resources used in the included example file (example.html) and the NavPanel.js file itself. I did not minify the file and the code is commented to aid you along your way.
navpanel.zip
Example:
Here is a link to the example I put together demonstrating some of the different layouts and targeting.
navpanel example
Terms
Feel free to download and use however you want to. Realize this is my first true ExtJS extension built from scratch so there may be bugs that need addressed. Feel free to point them out and I will fix as time allows. All I ask if you do use this particular extension is that you leave a comment on this page on how you intend to use it or where you are going to use it, this is for my own curiosity. Enjoy!
Changelog
Feb 17 2010
** Fixed Bug with NavPanel Z-Index causing it to bleed through parent windows and masks.
My suggested free software list! (Advanced and Home)
Ok it's that time again for a techy like email to help my fellow computer users. I have worked hard to compile some suggested software that cost you nothing! I have many of these installed on my own computer at home and recommend them. I am going to cover a variety of different types of applications from plain old home user to more advance user suggestions. From anti-virus to developer frameworks. I am only going to worry about stand alone applications in this case. I will save web application for another time. Let's get started... Anti-Virus: Avast! This is completely free anti-virus software with active monitoring. It can be somewhat resource heavy to run everything so you may want to turn off certain features. I use this and recommend this. Microsoft Word Substitute: Open Office if you have used Microsoft Office this is a simliar type product. It will even open most Office type documents. It has it's own version of Word, Excel, Access, and Powerpoint. It is different but has an active community of people working on it and is updated often. Better then paying $600. Digital Graphics: The Gimp modeled after Abode Photoshop except without the $800 price tag. I will say I do not like the Gimp in comparison to Photoshop...there to pay for software. Still it is a lot better then nothing. If coming from Photoshop you will notice the commands are a little clunk to get around and the layer system is so-so. There are a lot of plugins you can download for free to do some pretty nifty filters if you are into that sort of thing. There is also a fair amount of supported brushes you can find by googling Gimp Brushes. Web Browser: Mozilla FireFox in my opinion far and away better then IE. Especially if you are a web developer. If you are running vista you will notice IE runs faster and FireFox sometimes hits some random hang ups. Still I have found the multiple plugins you can get for FireFox the huge advantage. Plugins: Tab Preview - shows a small image of your browser tabs. Web Developer Toolkit - (For web developers) Allows you some in depth controls your webpage. FireBug - a Must have for developers who want to really dig in deep to code. Javascript programming this is a must. I also like it for drilling down on myspace pages to figure out what CSS classes and div ids I can control. Compressions and Decompression Tool: If you do a lot of downloading online. You will learn to love this tool. It will compress almost every file type I have ever come across. It is called IZarc and it is completely free...at the moment. Pitch WinZip and get this. IZarc Best Text Editor: PSPad simply one of the best free editors for developing code and in general a good basic text editor. I use this one almost daily. FTP Client: Filezilla simple to use FTP. Pretty much a good stand by if you are going to be transferring a lto of files up or down from the web via FTP Online Video Encoder: Riva Encoder will take your home movies and encode them to FLV which is the most popular web format in existence right now. It has some nice features which will allow you to decide on the compression of the video. Spyware Removal: AdAware I have always liked their software and it seems to be effective for me. It will update itself and scan relatively quickly using it's smart scan feature. I would recommend setting this to run at least once a week to stay on top of things. Disk Cleanup Software: SequiaView is a small program that lets you see where your hard drive usage is and allows you to clean some house. I have not used this one much but from what I can tell it does a good job. This is no longer working I have been informed. Base on Daniels Recommendation: Diskkeeper Pro: Defragging software. I have not taken the time to try this out but if you post a comment and let us know how it was. Disk Defrag: Ultra Defrag If you are not familiar with deframentation let me basically say its when your hard drive is a mess. Just like as you live longer in a house and more and more stuff accumulate you have to try and reorganize it in the space you have available in your home. If you do not stuff ends up everywhere and find stuff becomes a slow tedious process. This is the same as a computer. As you fill up that hard drive the computer fills up space. Software like this is like spring cleaning it goes in and reorganizes things so they are easier to find. Which makes things run faster! Well thats the list for now. Thanks for readingComplete Site Update!
Time for a change... again. I know I change my layout more then I post content. I enjoy doing it though, I learn something new or find some cool tool to use so I feel I have to do it. I been researching the blogging software out there lately and decided that Pivot is just not as developed (with less supported plugin and themes) then some of the other blogging software out there that is also free. I installed wordpress onto the site to see if I like the system better. It is by far one of the most popular and supported php/MySQL blogging tools out there. It also is in current development and undergoing constant updates. The community for wordpress is also huge. So over the next week or so I will be migrating this page over and start using that as my main tool. Again then I will try and take time to post whats up in the world though likely I will end up finding some new thing to play with and change the site again
Added MySpace Crossposting support! A useful plugin to keep my blog content current on MySpace with my website content.
Cool Site for snagging videos (FLV)
www.videodl.org is currently in a beta state but allows you to actually download videos from the big video providers. The videos will come down in FLV format (Macromedia's Flash Video Format) therefore you will need to have an FLV player installed on your computer. You can get one from Wimpy Player. I ran across this site when adding Flash Video Ad Hosting to our Ad hosting platform at work. It helped me to be able to grab some small FLV's for testing purposes.Search
Recent
Topics
Comments
- Thank you, kind person. You have saved me a good deal of time. -- Adam Williams
IE8 Javascript external s[..] - Thanks for this code. I am using it with some modification to determine DST for any year, not just 2009. This has save -- Jonathan
Javascript: Figuring out [..] - I do not handle the 2AM switch over. This would be a minor bug. I checked your solution that would work I have never l -- ben
Javascript: Figuring out [..] - Your also doesn't seem to take into account the hour of the day. Daylight savings switch happens at 2AM... So there is -- Kevin
Javascript: Figuring out [..] - Matt corrected code has been posted. -- ben
Javascript: Figuring out [..]
Photos (view gallery)
