Skip to content

Instantly share code, notes, and snippets.

View aghuddleston's full-sized avatar

Annie aghuddleston

13 followers · 3 following
View GitHub Profile
@aghuddleston
aghuddleston / NotifyBar.css
Last active October 4, 2015 02:17
Success or error message notification bar extending from an Ext JS 4.1.0 toolbar.
.notifybar{
margin: 3px !important;
}
.notifybar-success, .x-nlg .notifybar-success {
border: 1px solid #AEE0AE !important;
background-color: #D1EED1 !important;
background-image: none !important;
}
.notifybar-error, .x-nlg .notifybar-error {
border: 1px solid #F79897 !important;
@aghuddleston
aghuddleston / PanelHeaderExtraIcons.js
Last active October 5, 2015 07:18
Ext JS 4.1 Plugin to add items to the right side of a panel header
Ext.define('Ext.ux.panel.header.ExtraIcons', {
extend: 'Ext.AbstractPlugin',
alias: 'plugin.headericons',
alternateClassName: 'Ext.ux.PanelHeaderExtraIcons',
iconCls: '',
index: undefined,
headerButtons: [],
@aghuddleston
aghuddleston / LinkButton.css
Created August 6, 2012 18:06
An Ext JS 4.1 link button. It is a button, styled as a link.
button.linkButton {
overflow:visible; /* Shrinkwrap the text in IE7- */
margin:0;
padding:0;
border:0;
color: #2B547D;
background:transparent;
font:inherit !important; /* Inherit font settings (doesn’t work in IE7-) */
line-height:normal; /* Override line-height to avoid spacing issues */
text-decoration:underline; /* Make it look linky */
@aghuddleston
aghuddleston / DismissableAlert.css
Created August 6, 2012 19:04
Ext JS 4 Alert, in the Twitter Bootstrap Style
/* CSS originally from http://twitter.github.com/bootstrap/index.html
and modified slightly since the full bootstrap css is not included */
.alert {
padding: 8px 35px 8px 14px;
margin-bottom: 18px;
color: #c09853;
text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
background-color: #fcf8e3;
border: 1px solid #fbeed5;
@aghuddleston
aghuddleston / DateFormatBugfix.txt
Created August 8, 2012 19:03
Ext JS 4 Grid Search Plugin originally by Saki and ported by Nathan LeBlanc for Ext JS 4
One bugfix
http://www.sencha.com/forum/showthread.php?23615-Grid-Search-Plugin&p=799141&viewfull=1#post799141
For datecolumns like:
,{
text:'date',
dataIndex:'datecreated',
xtype:'datecolumn',
format:'d.m.Y H:i'
}
@aghuddleston
aghuddleston / Ext.ux.data.proxy.JsonAjaxProxy.js
Created August 16, 2012 15:01
Ext JS 4 Proxy that puts params in JSON format, that can be used by Stores.
Ext.define('Ext.ux.data.proxy.JsonAjaxProxy', {
extend:'Ext.data.proxy.Ajax',
alias:'proxy.jsonajax',
actionMethods : {
create: "POST",
read: "POST",
update: "POST",
destroy: "POST"
},
@aghuddleston
aghuddleston / RemoteToLocalComboBox.js
Created September 6, 2012 19:47
Ext JS 4 Remote To Local Hybrid ComboBox Plugin
/**
This combo functions as a remote-local ExtJS combo hybrid. It starts out
as a remote combo so that nothing is loaded until the trigger button is clicked
or the user starts typing in the combobox. Once the data is loaded, it switches
to local mode so that no more queries are made to the server. It therefore
assumes that all data is loaded on the first load request. It also shows the
loading UI when data is being loaded since it starts out as 'remote'.
*/
Ext.define("Ext.ux.form.field.RemoteToLocalComboBox", {
extend: 'Ext.AbstractPlugin',
@aghuddleston
aghuddleston / StepBar.css
Created October 12, 2012 19:14
Ext JS 4.1 Step Bar - sizes hardcoded for 5 steps right now
div.stepbar {
height: 44px;
}
ul.steplist {
height: 44px;
list-style-image: none;
list-style-position: outside;
list-style-type: none;
margin: 2px 10px 0;
@aghuddleston
aghuddleston / Ext.ux.state.SessVarsProvider.js
Last active December 16, 2015 01:49
Ext.ux.state.SessVarProvider is an Ext JS 4 state provider for Thomas Frank's JavaScript session variables storage.
/**
* @class Ext.ux.state.SessVarsProvider
* @extends Ext.state.Provider
* Session state provider that stores state information on the client side
* for the length of the session. Important - sessvars.js must be included
* in the page. http://www.thomasfrank.se/sessionvars.html
* @depends sessvars.js
*/
Ext.define('Ext.ux.state.SessVarsProvider', {
extend: 'Ext.state.Provider',
@aghuddleston
aghuddleston / Ext.ux.EmailWindow.js
Created April 10, 2013 19:49
Basic Ext JS 4 email window that shows a preset "to" list in a tooltip.
Ext.define('Ext.ux.EmailWindow', {
extend: 'Ext.window.Window',
alias: 'widget.email',
requires: [
'Ext.form.*',
'Ext.window.Window',
'Ext.data.*',
'Ext.Ajax',
'Ext.LoadMask'
],