Merge remote-tracking branch 'origin/3.1'

Conflicts:
	.travis.yml
	composer.json
This commit is contained in:
Damian Mooyman 2014-05-06 10:22:09 +12:00
commit e9c3ff933f
119 changed files with 360 additions and 7851 deletions

View File

@ -26,6 +26,9 @@ matrix:
env: DB=MYSQL CORE_RELEASE=master env: DB=MYSQL CORE_RELEASE=master
- php: 5.4 - php: 5.4
env: DB=MYSQL CORE_RELEASE=master BEHAT_TEST=1 env: DB=MYSQL CORE_RELEASE=master BEHAT_TEST=1
allow_failures:
- php: 5.6
env: DB=MYSQL CORE_RELEASE=master
before_script: before_script:
- composer self-update - composer self-update
@ -38,7 +41,7 @@ before_script:
- php ~/travis-support/travis_setup_php54_webserver.php --if-env BEHAT_TEST - php ~/travis-support/travis_setup_php54_webserver.php --if-env BEHAT_TEST
script: script:
- "if [ \"$BEHAT_TEST\" = \"\" ]; then phpunit framework/tests; fi" - "if [ \"$BEHAT_TEST\" = \"\" ]; then vendor/bin/phpunit framework/tests; fi"
- "if [ \"$BEHAT_TEST\" = \"1\" ]; then vendor/bin/behat @framework; fi" - "if [ \"$BEHAT_TEST\" = \"1\" ]; then vendor/bin/behat @framework; fi"
after_failure: after_failure:

View File

@ -715,9 +715,9 @@ class LeftAndMain extends Controller implements PermissionProvider {
$className = $this->stat('tree_class'); $className = $this->stat('tree_class');
if($className && $id instanceof $className) { if($className && $id instanceof $className) {
return $id; return $id;
} else if($id == 'root') { } else if($className && $id == 'root') {
return singleton($className); return singleton($className);
} else if(is_numeric($id)) { } else if($className && is_numeric($id)) {
return DataObject::get_by_id($className, $id); return DataObject::get_by_id($className, $id);
} else { } else {
return false; return false;

View File

@ -253,11 +253,19 @@
parentNode = data.ParentID ? self.getNodeByID(data.ParentID) : false, parentNode = data.ParentID ? self.getNodeByID(data.ParentID) : false,
newNode = $(html); newNode = $(html);
// Extract the state for the new node from the properties taken from the provided HTML template.
// This will correctly initialise the behaviour of the node for ajax loading of children.
var properties = {data: ''};
if(newNode.hasClass('jstree-open')) {
properties.state = 'open';
} else if(newNode.hasClass('jstree-closed')) {
properties.state = 'closed';
}
this.jstree( this.jstree(
'create_node', 'create_node',
parentNode.length ? parentNode : -1, parentNode.length ? parentNode : -1,
'last', 'last',
'', properties,
function(node) { function(node) {
var origClasses = node.attr('class'); var origClasses = node.attr('class');
// Copy attributes // Copy attributes
@ -265,6 +273,7 @@
var attr = newNode[0].attributes[i]; var attr = newNode[0].attributes[i];
node.attr(attr.name, attr.value); node.attr(attr.name, attr.value);
} }
// Substitute html from request for that generated by jstree
node.addClass(origClasses).html(newNode.html()); node.addClass(origClasses).html(newNode.html());
callback(node); callback(node);
} }
@ -357,12 +366,9 @@
// a tree "open"/"select" event, while at the same time creating a new node // a tree "open"/"select" event, while at the same time creating a new node
self.getNodeByID(node.data('id')).not(node).remove(); self.getNodeByID(node.data('id')).not(node).remove();
// Select this node
self.jstree('deselect_all'); self.jstree('deselect_all');
self.jstree('select_node', node); self.jstree('select_node', node);
// Similar to jstree's correct_state, but doesn't remove children
var hasChildren = (node.children('ul').length > 0);
node.toggleClass('jstree-leaf', !hasChildren);
if(!hasChildren) node.removeClass('jstree-closed jstree-open');
}; };
// TODO 'initially_opened' config doesn't apply here // TODO 'initially_opened' config doesn't apply here
@ -387,7 +393,7 @@
if(node.length) { if(node.length) {
self.updateNode(node, nodeData.html, nodeData); self.updateNode(node, nodeData.html, nodeData);
setTimeout(function() { setTimeout(function() {
correctStateFn(node) ; correctStateFn(node);
}, 500); }, 500);
} else { } else {
includesNewNode = true; includesNewNode = true;

View File

@ -19,6 +19,9 @@
"php": ">=5.3.3", "php": ">=5.3.3",
"composer/installers": "*" "composer/installers": "*"
}, },
"require-dev": {
"phpunit/PHPUnit": "~3.7"
},
"extra": { "extra": {
"branch-alias": { "branch-alias": {
"dev-master": "3.2.x-dev" "dev-master": "3.2.x-dev"

View File

@ -307,6 +307,8 @@ class HTTP {
* deprecated; in these cases, the headers are output directly. * deprecated; in these cases, the headers are output directly.
*/ */
public static function add_cache_headers($body = null) { public static function add_cache_headers($body = null) {
$cacheAge = self::$cache_age;
// Validate argument // Validate argument
if($body && !($body instanceof SS_HTTPResponse)) { if($body && !($body instanceof SS_HTTPResponse)) {
user_error("HTTP::add_cache_headers() must be passed an SS_HTTPResponse object", E_USER_WARNING); user_error("HTTP::add_cache_headers() must be passed an SS_HTTPResponse object", E_USER_WARNING);
@ -315,7 +317,7 @@ class HTTP {
// Development sites have frequently changing templates; this can get stuffed up by the code // Development sites have frequently changing templates; this can get stuffed up by the code
// below. // below.
if(Director::isDev()) return; if(Director::isDev()) $cacheAge = 0;
// The headers have been sent and we don't have an SS_HTTPResponse object to attach things to; no point in // The headers have been sent and we don't have an SS_HTTPResponse object to attach things to; no point in
// us trying. // us trying.
@ -326,16 +328,16 @@ class HTTP {
if(function_exists('apache_request_headers')) { if(function_exists('apache_request_headers')) {
$requestHeaders = apache_request_headers(); $requestHeaders = apache_request_headers();
if(isset($requestHeaders['X-Requested-With']) && $requestHeaders['X-Requested-With']=='XMLHttpRequest') { if(isset($requestHeaders['X-Requested-With']) && $requestHeaders['X-Requested-With']=='XMLHttpRequest') {
self::$cache_age = 0; $cacheAge = 0;
} }
// bdc: now we must check for DUMB IE6: // bdc: now we must check for DUMB IE6:
if(isset($requestHeaders['x-requested-with']) && $requestHeaders['x-requested-with']=='XMLHttpRequest') { if(isset($requestHeaders['x-requested-with']) && $requestHeaders['x-requested-with']=='XMLHttpRequest') {
self::$cache_age = 0; $cacheAge = 0;
} }
} }
if(self::$cache_age > 0) { if($cacheAge > 0) {
$responseHeaders["Cache-Control"] = "max-age=" . self::$cache_age . ", must-revalidate, no-transform"; $responseHeaders["Cache-Control"] = "max-age={$cacheAge}, must-revalidate, no-transform";
$responseHeaders["Pragma"] = ""; $responseHeaders["Pragma"] = "";
// To do: User-Agent should only be added in situations where you *are* actually // To do: User-Agent should only be added in situations where you *are* actually
@ -365,7 +367,7 @@ class HTTP {
} }
} }
if(self::$modification_date && self::$cache_age > 0) { if(self::$modification_date && $cacheAge > 0) {
$responseHeaders["Last-Modified"] = self::gmt_date(self::$modification_date); $responseHeaders["Last-Modified"] = self::gmt_date(self::$modification_date);
// Chrome ignores Varies when redirecting back (http://code.google.com/p/chromium/issues/detail?id=79758) // Chrome ignores Varies when redirecting back (http://code.google.com/p/chromium/issues/detail?id=79758)
@ -401,7 +403,7 @@ class HTTP {
} }
} }
$expires = time() + self::$cache_age; $expires = time() + $cacheAge;
$responseHeaders["Expires"] = self::gmt_date($expires); $responseHeaders["Expires"] = self::gmt_date($expires);
} }

View File

@ -82,7 +82,7 @@ class TestRunner extends Controller {
BASE_PATH, true, isset($_GET['flush']) BASE_PATH, true, isset($_GET['flush'])
); );
SS_ClassLoader::instance()->pushManifest($classManifest); SS_ClassLoader::instance()->pushManifest($classManifest, false);
SapphireTest::set_test_class_manifest($classManifest); SapphireTest::set_test_class_manifest($classManifest);
SS_TemplateLoader::instance()->pushManifest(new SS_TemplateManifest( SS_TemplateLoader::instance()->pushManifest(new SS_TemplateManifest(

View File

@ -138,12 +138,20 @@ class PhpUnitWrapper implements IPhpUnitWrapper {
public static function inst() { public static function inst() {
if (self::$phpunit_wrapper == null) { if (self::$phpunit_wrapper == null) {
if (fileExistsInIncludePath("/PHPUnit/Autoload.php")) { // Loaded via autoloader, composer or other generic
if (class_exists('PHPUnit_Runner_Version')) {
self::$phpunit_wrapper = new PhpUnitWrapper_Generic();
}
// 3.5 detection
else if (fileExistsInIncludePath("/PHPUnit/Autoload.php")) {
self::$phpunit_wrapper = new PhpUnitWrapper_3_5(); self::$phpunit_wrapper = new PhpUnitWrapper_3_5();
} else }
if (fileExistsInIncludePath("/PHPUnit/Framework.php")) { // 3.4 detection
else if (fileExistsInIncludePath("/PHPUnit/Framework.php")) {
self::$phpunit_wrapper = new PhpUnitWrapper_3_4(); self::$phpunit_wrapper = new PhpUnitWrapper_3_4();
} else { }
// No version found - will lead to an error
else {
self::$phpunit_wrapper = new PhpUnitWrapper(); self::$phpunit_wrapper = new PhpUnitWrapper();
} }
self::$phpunit_wrapper->init(); self::$phpunit_wrapper->init();
@ -209,7 +217,7 @@ class PhpUnitWrapper implements IPhpUnitWrapper {
$this->beforeRunTests(); $this->beforeRunTests();
$this->getSuite()->run($this->getFrameworkTestResults()); $this->getSuite()->run($this->getFrameworkTestResults());
$this->aferRunTests(); $this->afterRunTests();
} }
/** /**

View File

@ -9,7 +9,9 @@
*/ */
class PhpUnitWrapper_3_4 extends PhpUnitWrapper { class PhpUnitWrapper_3_4 extends PhpUnitWrapper {
protected $version = 'PhpUnit V3.4'; public function getVersion() {
return 'PhpUnit V3.4';
}
/** /**
* Initialise the wrapper class. * Initialise the wrapper class.
@ -46,10 +48,10 @@ class PhpUnitWrapper_3_4 extends PhpUnitWrapper {
} }
/** /**
* Overwrites aferRunTests. Creates coverage report and clover report * Overwrites afterRunTests. Creates coverage report and clover report
* if required. * if required.
*/ */
protected function aferRunTests() { protected function afterRunTests() {
if($this->getCoverageStatus()) { if($this->getCoverageStatus()) {

View File

@ -4,16 +4,10 @@
* @subpackage dev * @subpackage dev
*/ */
class PhpUnitWrapper_3_5 extends PhpUnitWrapper { class PhpUnitWrapper_3_5 extends PhpUnitWrapper_Generic {
protected $version = 'PhpUnit V3.5'; public function getVersion() {
return 'PhpUnit V3.5';
protected $coverage = null;
protected static $test_name = 'SapphireTest';
public static function get_test_name() {
return self::$test_name;
} }
/** /**
@ -23,56 +17,9 @@ class PhpUnitWrapper_3_5 extends PhpUnitWrapper {
if(!class_exists('PHPUnit_Framework_TestCase')) { if(!class_exists('PHPUnit_Framework_TestCase')) {
require_once 'PHP/CodeCoverage.php'; require_once 'PHP/CodeCoverage.php';
require_once 'PHP/CodeCoverage/Report/HTML.php'; require_once 'PHP/CodeCoverage/Report/HTML.php';
require_once 'PHPUnit/Autoload.php'; require_once 'PHPUnit/Autoload.php';
require_once 'PHP/CodeCoverage/Filter.php'; require_once 'PHP/CodeCoverage/Filter.php';
} }
} }
/**
* Overwrites beforeRunTests. Initiates coverage-report generation if
* $coverage has been set to true (@see setCoverageStatus).
*/
protected function beforeRunTests() {
if($this->getCoverageStatus()) {
$this->coverage = new PHP_CodeCoverage();
$coverage = $this->coverage;
$filter = $coverage->filter();
$modules = $this->moduleDirectories();
foreach(TestRunner::config()->coverage_filter_dirs as $dir) {
if($dir[0] == '*') {
$dir = substr($dir, 1);
foreach ($modules as $module) {
$filter->addDirectoryToBlacklist(BASE_PATH . "/$module/$dir");
}
} else {
$filter->addDirectoryToBlacklist(BASE_PATH . '/' . $dir);
}
}
$filter->addFileToBlacklist(__FILE__, 'PHPUNIT');
$coverage->start(self::get_test_name());
}
}
/**
* Overwrites aferRunTests. Creates coverage report and clover report
* if required.
*/
protected function aferRunTests() {
if($this->getCoverageStatus()) {
$coverage = $this->coverage;
$coverage->stop();
$writer = new PHP_CodeCoverage_Report_HTML();
$writer->process($coverage, ASSETS_PATH.'/code-coverage-report');
}
}
} }

View File

@ -0,0 +1,71 @@
<?php
/**
* Generic PhpUnitWrapper.
* Originally intended for use with Composer based installations, but will work
* with any fully functional autoloader.
*/
class PhpUnitWrapper_Generic extends PhpUnitWrapper {
/**
* Returns a version string, like 3.7.34 or 4.2-dev.
* @return string
*/
public function getVersion() {
return PHPUnit_Runner_Version::id();
}
protected $coverage = null;
protected static $test_name = 'SapphireTest';
public static function get_test_name() {
return static::$test_name;
}
/**
* Overwrites beforeRunTests. Initiates coverage-report generation if
* $coverage has been set to true (@see setCoverageStatus).
*/
protected function beforeRunTests() {
if($this->getCoverageStatus()) {
$this->coverage = new PHP_CodeCoverage();
$coverage = $this->coverage;
$filter = $coverage->filter();
$modules = $this->moduleDirectories();
foreach(TestRunner::config()->coverage_filter_dirs as $dir) {
if($dir[0] == '*') {
$dir = substr($dir, 1);
foreach ($modules as $module) {
$filter->addDirectoryToBlacklist(BASE_PATH . "/$module/$dir");
}
} else {
$filter->addDirectoryToBlacklist(BASE_PATH . '/' . $dir);
}
}
$filter->addFileToBlacklist(__FILE__, 'PHPUNIT');
$coverage->start(self::get_test_name());
}
}
/**
* Overwrites afterRunTests. Creates coverage report and clover report
* if required.
*/
protected function afterRunTests() {
if($this->getCoverageStatus()) {
$coverage = $this->coverage;
$coverage->stop();
$writer = new PHP_CodeCoverage_Report_HTML();
$writer->process($coverage, ASSETS_PATH.'/code-coverage-report');
}
}
}

View File

@ -210,4 +210,4 @@ blocks and concepts for more complex extensions as well.
* [Reference: CMS Architecture](../reference/cms-architecture) * [Reference: CMS Architecture](../reference/cms-architecture)
* [Reference: Layout](../reference/layout) * [Reference: Layout](../reference/layout)
* [Topics: Rich Text Editing](../topics/rich-text-editing) * [Topics: Rich Text Editing](../topics/rich-text-editing)
* [CMS Alternating Button](../reference/cms-alternating-button) * [CMS Alternating Button](../howto/cms-alternating-button)

View File

@ -98,6 +98,24 @@ A config object can be either injected as the fourth argument of the GridField c
$gridField = new GridField('pages', 'All pages', SiteTree::get()); $gridField = new GridField('pages', 'All pages', SiteTree::get());
$gridField->setConfig(GridFieldConfig_Base::create()); $gridField->setConfig(GridFieldConfig_Base::create());
By default the `[api:GridFieldConfig_Base]` constructor takes a single parameter to specify the number
of items displayed on each page.
:::php
// I have lots of items, so increase the page size
$myConfig = GridFieldConfig_Base::create(40);
The default page size can also be tweaked via the config. (put in your mysite/_config/config.yml)
:::yaml
// For updating all gridfield defaults system wide
GridFieldPaginator:
default_items_per_page: 40
Note that for [/reference/modeladmin](ModelAdmin) sections the default 30 number of pages can be
controlled either by setting the base `ModelAdmin.page_length` config to the desired number, or
by overriding this value in a custom subclass.
The framework comes shipped with some base GridFieldConfigs: The framework comes shipped with some base GridFieldConfigs:
### Table listing with GridFieldConfig_Base ### Table listing with GridFieldConfig_Base
@ -246,6 +264,8 @@ Here is a list of components for generic use:
- `[api:GridFieldDeleteAction]` - `[api:GridFieldDeleteAction]`
- `[api:GridFieldViewButton]` - `[api:GridFieldViewButton]`
- `[api:GridFieldEditButton]` - `[api:GridFieldEditButton]`
- `[api:GridFieldExportButton]`
- `[api:GridFieldPrintButton]`
- `[api:GridFieldPaginator]` - `[api:GridFieldPaginator]`
- `[api:GridFieldDetailForm]` - `[api:GridFieldDetailForm]`

View File

@ -15,12 +15,12 @@ RestfulService (see [flickrservice](http://silverstripe.org/flickr-module/) and
### Creating a new RestfulObject ### Creating a new RestfulObject
:::php :::php
//example for using RestfulService to connect and retrive latest twitter status of an user. //example for using RestfulService to connect and retrive latest twitter status of an user.
$twitter = new RestfulService("http://twitter.com/statuses/user_timeline/user.xml", $cache_expiry ); $twitter = new RestfulService("http://twitter.com/statuses/user_timeline/user.xml", $cache_expiry );
$params = array('count' => 1); $params = array('count' => 1);
$twitter->setQueryString($params); $twitter->setQueryString($params);
$conn = $twitter->connect(); $conn = $twitter->request();
$msgs = $twitter->getValues($conn, "status"); $msgs = $twitter->getValues($conn, "status");
### Extending to a new class ### Extending to a new class
@ -45,12 +45,12 @@ RestfulService (see [flickrservice](http://silverstripe.org/flickr-module/) and
$service->httpHeader('Accept: application/xml'); $service->httpHeader('Accept: application/xml');
$service->httpHeader('Content-Type: application/xml'); $service->httpHeader('Content-Type: application/xml');
$peopleXML = $service->connect('/people'); $peopleXML = $service->request('/people');
$people = $service->getValues($peopleXML, 'user'); $people = $service->getValues($peopleXML, 'user');
// ... // ...
$taskXML = $service->connect('/tasks'); $taskXML = $service->request('/tasks');
$tasks = $service->getValues($taskXML, 'task'); $tasks = $service->getValues($taskXML, 'task');
@ -71,12 +71,12 @@ You can traverse throught document tree to get the values or attribute of a part
for example you can traverse for example you can traverse
:::xml :::xml
<entries> <entries>
<entry id='12'>Sally</entry> <entry id='12'>Sally</entry>
<entry id='15'>Ted</entry> <entry id='15'>Ted</entry>
<entry id='30'>Matt</entry> <entry id='30'>Matt</entry>
<entry id='22'>John</entry> <entry id='22'>John</entry>
<entries> </entries>
to extract the id attributes of the entries use: to extract the id attributes of the entries use:
@ -96,14 +96,14 @@ If you don't know the exact position of dom tree where the node will appear you
node.Recommended for retrieving values of namespaced nodes. node.Recommended for retrieving values of namespaced nodes.
:::xml :::xml
<media:guide> <media:guide>
<media:entry id="2030">video</media:entry> <media:entry id="2030">video</media:entry>
</media:guide> </media:guide>
to get the value of entry node with the namespace media, use: to get the value of entry node with the namespace media, use:
:::php :::php
$this->searchValue($response, "//media:guide/media:entry") $this->searchValue($response, "//media:guide/media:entry")
@ -116,25 +116,25 @@ If the web service returned an error (for example, API key not available or inad
could delgate the error handling to it's descendant class. To handle the errors define a function called errorCatch could delgate the error handling to it's descendant class. To handle the errors define a function called errorCatch
:::php :::php
// This will raise Youtube API specific error messages (if any). // This will raise Youtube API specific error messages (if any).
public function errorCatch($response){ public function errorCatch($response){
$err_msg = $response; $err_msg = $response;
if(strpos($err_msg, '<') === false) { if(strpos($err_msg, '<') === false) {
user_error("YouTube Service Error : $err_msg", E_USER_ERROR); user_error("YouTube Service Error : $err_msg", E_USER_ERROR);
} }
return $response; return $response;
} }
If you want to bypass error handling on your sub-classes you could define that in the constructor. If you want to bypass error handling on your sub-classes you could define that in the constructor.
:::php :::php
public function __construct($expiry=NULL){ public function __construct($expiry=NULL){
parent::__construct('http://www.flickr.com/services/rest/', $expiry); parent::__construct('http://www.flickr.com/services/rest/', $expiry);
$this->checkErrors = false; //Set checkErrors to false to bypass error checking $this->checkErrors = false; //Set checkErrors to false to bypass error checking
} }
## Other Uses ## Other Uses
@ -147,21 +147,21 @@ such as del.icio.us
Put something like this code in mysite/code/Page.php inside class Page_Controller Put something like this code in mysite/code/Page.php inside class Page_Controller
:::php :::php
// Accepts an RSS feed URL and outputs a list of links from it // Accepts an RSS feed URL and outputs a list of links from it
public function RestfulLinks($url){ public function RestfulLinks($url){
$service = new RestfulService($url); $service = new RestfulService($url);
$request = $service->request(); $request = $service->request();
$body = $request->getBody(); $body = $request->getBody();
$items = $service->getValues($body,"channel","item"); $items = $service->getValues($body,"channel","item");
$output = ''; $output = '';
foreach($items as $item) { foreach($items as $item) {
// Fix quote encoding // Fix quote encoding
$description = str_replace('&amp;quot;', '&quot;', $item->description); $description = str_replace('&amp;quot;', '&quot;', $item->description);
$output .= "<li><a href=\"{$item->link}\">{$item->title}</a><br />{$description}</li>"; $output .= "<li><a href=\"{$item->link}\">{$item->title}</a><br />{$description}</li>";
}
return $output;
} }
return $output;
}
Put something like this code in `themes/<your-theme>/templates/Layout/HomePage.ss`: Put something like this code in `themes/<your-theme>/templates/Layout/HomePage.ss`:

View File

@ -47,6 +47,7 @@ SilverStripe what values to include in the feed.
class Page_Controller extends ContentController { class Page_Controller extends ContentController {
private static $allowed_actions = array('rss'); private static $allowed_actions = array('rss');
public function init() { public function init() {
parent::init();
// linkToFeed will add an appropriate HTML link tag to the website // linkToFeed will add an appropriate HTML link tag to the website
// <head> tag to notify web browsers that an RSS feed is available // <head> tag to notify web browsers that an RSS feed is available
// for this page. You can include as many feeds on the page as you // for this page. You can include as many feeds on the page as you
@ -56,7 +57,6 @@ SilverStripe what values to include in the feed.
// In this example $this->Link("rss") refers to the *rss* function // In this example $this->Link("rss") refers to the *rss* function
// we define below. // we define below.
RSSFeed::linkToFeed($this->Link("rss"), "RSS feed of this blog"); RSSFeed::linkToFeed($this->Link("rss"), "RSS feed of this blog");
parent::init();
} }
public function rss() { public function rss() {
// Creates a new RSS Feed list // Creates a new RSS Feed list
@ -87,8 +87,8 @@ updates. Update mysite/code/Page.php to something like this:
private static $allowed_actions = array('rss'); private static $allowed_actions = array('rss');
public function init() { public function init() {
RSSFeed::linkToFeed($this->Link() . "rss", "10 Most Recently Updated Pages");
parent::init(); parent::init();
RSSFeed::linkToFeed($this->Link() . "rss", "10 Most Recently Updated Pages");
} }
public function rss() { public function rss() {
@ -130,8 +130,8 @@ for all the students as we've seen before.
class Page_Controller extends ContentController { class Page_Controller extends ContentController {
private static $allowed_actions = array('students'); private static $allowed_actions = array('students');
public function init() { public function init() {
RSSFeed::linkToFeed($this->Link("students"), "Students feed");
parent::init(); parent::init();
RSSFeed::linkToFeed($this->Link("students"), "Students feed");
} }
public function students() { public function students() {
$rss = new RSSFeed( $rss = new RSSFeed(

View File

@ -85,7 +85,7 @@ not PHP's built-in [date()](http://nz.php.net/manual/en/function.date.php).
### Language Names ### Language Names
SilverStripe comes with a built-in list of common languages, listed by locale and region. SilverStripe comes with a built-in list of common languages, listed by locale and region.
They can be accessed via the `i18n.common_languages` and `i18n.common_locales` [config setting](/topics/configuratio). They can be accessed via the `i18n.common_languages` and `i18n.common_locales` [config setting](/topics/configuration).
In order to add a value, add the following to your `config.yml`: In order to add a value, add the following to your `config.yml`:

View File

@ -42,7 +42,7 @@ This is explained in a more in-depth topic at [Page Type Templates](/topics/page
## Adding Database Fields ## Adding Database Fields
Adding database fields is a simple process. You define them in an array of the static variable `$db`, this array is Adding database fields is a simple process. You define them in an array of the static variable `$db`, this array is
added on the object class. For example, Page or StaffPage. Every time you run dev/build to recompile the manifest, it added on the object class. For example, Page or StaffPage. Every time you run dev/build to recompile the manifest, it
checks if any new entries are added to the `$db` array and adds any fields to the database that are missing. checks if any new entries are added to the `$db` array and adds any fields to the database that are missing.
For example, you may want an additional field on a `StaffPage` class which extends `Page`, called `Author`. `Author` is a For example, you may want an additional field on a `StaffPage` class which extends `Page`, called `Author`. `Author` is a

View File

@ -158,7 +158,7 @@ Add the following code to the existing `form.css` file:
} }
All going according to plan, if you visit [http://localhost/your_site_name/home?flush=1](http://localhost/your_site_name/home?flush=1) it should look something like this: All going according to plan, if you visit [http://localhost/your_site_name/home/?flush=1](http://localhost/your_site_name/home/?flush=1) it should look something like this:
![](_images/tutorial3_pollform.jpg) ![](_images/tutorial3_pollform.jpg)

View File

@ -625,11 +625,6 @@ class File extends DataObject {
} }
} }
// Update title
if(!$this->getField('Title')) {
$this->__set('Title', str_replace(array('-','_'),' ', preg_replace('/\.[^.]+$/', '', $name)));
}
// Update actual field value // Update actual field value
$this->setField('Name', $name); $this->setField('Name', $name);
@ -637,7 +632,12 @@ class File extends DataObject {
// Important: Circumvent the getter to avoid infinite loops // Important: Circumvent the getter to avoid infinite loops
$this->setField('Filename', $this->getRelativePath()); $this->setField('Filename', $this->getRelativePath());
return $this->getField('Name'); // Update title
if(!$this->Title) {
$this->Title = str_replace(array('-','_'),' ', preg_replace('/\.[^.]+$/', '', $name));
}
return $name;
} }
/** /**

View File

@ -357,13 +357,16 @@ class Folder extends File {
* Note that this is not appropriate for files, because someone might want to create a human-readable name * Note that this is not appropriate for files, because someone might want to create a human-readable name
* of a file that is different from its name on disk. But folders should always match their name on disk. */ * of a file that is different from its name on disk. But folders should always match their name on disk. */
public function setTitle($title) { public function setTitle($title) {
$this->setField('Title',$title); $this->setName($title);
parent::setName($title); //set the name and filename to match the title }
public function getTitle() {
return $this->Name;
} }
public function setName($name) { public function setName($name) {
$this->setField('Title',$name);
parent::setName($name); parent::setName($name);
$this->setField('Title', $this->Name);
} }
public function setFilename($filename) { public function setFilename($filename) {

View File

@ -9,9 +9,17 @@
class GridFieldPaginator implements GridField_HTMLProvider, GridField_DataManipulator, GridField_ActionProvider { class GridFieldPaginator implements GridField_HTMLProvider, GridField_DataManipulator, GridField_ActionProvider {
/** /**
* Specifies default items per page
*
* @config
* @var int * @var int
*/ */
protected $itemsPerPage = 15; private static $default_items_per_page = 15;
/**
* @var int
*/
protected $itemsPerPage;
/** /**
* Which template to use for rendering * Which template to use for rendering
@ -30,7 +38,8 @@ class GridFieldPaginator implements GridField_HTMLProvider, GridField_DataManipu
* @param int $itemsPerPage - How many items should be displayed per page * @param int $itemsPerPage - How many items should be displayed per page
*/ */
public function __construct($itemsPerPage=null) { public function __construct($itemsPerPage=null) {
if($itemsPerPage) $this->itemsPerPage = $itemsPerPage; $this->itemsPerPage = $itemsPerPage
?: Config::inst()->get('GridFieldPaginator', 'default_items_per_page');
} }
/** /**

View File

@ -310,7 +310,7 @@ class DataList extends ViewableData implements SS_List, SS_Filterable, SS_Sortab
* *
* @todo extract the sql from $customQuery into a SQLGenerator class * @todo extract the sql from $customQuery into a SQLGenerator class
* *
* @param string|array Escaped SQL statement. If passed as array, all keys and values are assumed to be escaped. * @param string|array Key and Value pairs, the array values are automatically sanitised for the DB quesry
* @return DataList * @return DataList
*/ */
public function filter() { public function filter() {

View File

@ -275,12 +275,12 @@ class Hierarchy extends DataExtension {
if($children) { if($children) {
foreach($children as $child) { foreach($children as $child) {
$markingMatches = $this->markingFilterMatches($child); $markingMatches = $this->markingFilterMatches($child);
// Filtered results should always show opened, since actual matches if($markingMatches) {
// might be hidden by non-matching parent nodes. // Filtered results should always show opened, since actual matches
if($this->markingFilter && $markingMatches) { // might be hidden by non-matching parent nodes.
$child->markOpened(); if($this->markingFilter) {
} $child->markOpened();
if(!$this->markingFilter || $markingMatches) { }
if($child->$numChildrenMethod()) { if($child->$numChildrenMethod()) {
$child->markUnexpanded(); $child->markUnexpanded();
} else { } else {
@ -310,18 +310,24 @@ class Hierarchy extends DataExtension {
} }
/** /**
* Return CSS classes of 'unexpanded', 'closed', both, or neither, depending on * Return CSS classes of 'unexpanded', 'closed', both, or neither, as well as a
* the marking of this DataObject. * 'jstree-*' state depending on the marking of this DataObject.
*
* @return string
*/ */
public function markingClasses() { public function markingClasses() {
$classes = ''; $classes = '';
if(!$this->isExpanded()) { if(!$this->isExpanded()) {
$classes .= " unexpanded jstree-closed"; $classes .= " unexpanded";
} }
if($this->isTreeOpened()) {
if($this->numChildren() > 0) $classes .= " jstree-open"; // Set jstree open state, or mark it as a leaf (closed) if there are no children
if(!$this->numChildren()) {
$classes .= " jstree-leaf closed";
} elseif($this->isTreeOpened()) {
$classes .= " jstree-open";
} else { } else {
$classes .= " closed"; $classes .= " jstree-closed closed";
} }
return $classes; return $classes;
} }

View File

@ -55,8 +55,9 @@ class HTMLText extends Text {
* - whitelist: If provided, a comma-separated list of elements that will be allowed to be stored * - whitelist: If provided, a comma-separated list of elements that will be allowed to be stored
* (be careful on relying on this for XSS protection - some seemingly-safe elements allow * (be careful on relying on this for XSS protection - some seemingly-safe elements allow
* attributes that can be exploited, for instance <img onload="exploiting_code();" src="..." />) * attributes that can be exploited, for instance <img onload="exploiting_code();" src="..." />)
* * Text nodes outside of HTML tags are filtered out by default, but may be included by adding
* @return void * the text() directive. E.g. 'link,meta,text()' will allow only <link /> <meta /> and text at
* the root level.
*/ */
public function setOptions(array $options = array()) { public function setOptions(array $options = array()) {
parent::setOptions($options); parent::setOptions($options);
@ -184,20 +185,36 @@ class HTMLText extends Text {
} }
public function prepValueForDB($value) { public function prepValueForDB($value) {
return parent::prepValueForDB($this->whitelistContent($value));
}
/**
* Filter the given $value string through the whitelist filter
*
* @param string $value Input html content
* @return string Value with all non-whitelisted content stripped (if applicable)
*/
public function whitelistContent($value) {
if($this->whitelist) { if($this->whitelist) {
$dom = Injector::inst()->create('HTMLValue', $value); $dom = Injector::inst()->create('HTMLValue', $value);
$query = array(); $query = array();
foreach ($this->whitelist as $tag) $query[] = 'not(self::'.$tag.')'; $textFilter = ' | //body/text()';
foreach ($this->whitelist as $tag) {
if($tag === 'text()') {
$textFilter = ''; // Disable text filter if allowed
} else {
$query[] = 'not(self::'.$tag.')';
}
}
foreach($dom->query('//body//*['.implode(' and ', $query).']') as $el) { foreach($dom->query('//body//*['.implode(' and ', $query).']'.$textFilter) as $el) {
if ($el->parentNode) $el->parentNode->removeChild($el); if ($el->parentNode) $el->parentNode->removeChild($el);
} }
$value = $dom->getContent(); $value = $dom->getContent();
} }
return $value;
return parent::prepValueForDB($value);
} }
/** /**

View File

@ -267,7 +267,10 @@ class Oembed_Result extends ViewableData {
if(!$data) { if(!$data) {
// if the response is no valid JSON we might have received a binary stream to an image // if the response is no valid JSON we might have received a binary stream to an image
$data = array(); $data = array();
$image = @imagecreatefromstring($body); if (!function_exists('imagecreatefromstring')) {
throw new LogicException('imagecreatefromstring function does not exist - Please make sure GD is installed');
}
$image = imagecreatefromstring($body);
if($image !== FALSE) { if($image !== FALSE) {
preg_match("/^(http:\/\/)?([^\/]+)/i", $this->url, $matches); preg_match("/^(http:\/\/)?([^\/]+)/i", $this->url, $matches);
$protocoll = $matches[1]; $protocoll = $matches[1];

View File

@ -124,7 +124,7 @@ class MemberLoginForm extends LoginForm {
$js = <<<JS $js = <<<JS
(function() { (function() {
var el = document.getElementById("MemberLoginForm_LoginForm_Email"); var el = document.getElementById("MemberLoginForm_LoginForm_Email");
if(el && el.focus && (!jQuery || jQuery(el).is(':visible'))) el.focus(); if(el && el.focus && (typeof jQuery == 'undefined' || jQuery(el).is(':visible'))) el.focus();
})(); })();
JS; JS;
Requirements::customScript($js, 'MemberLoginFormFieldFocus'); Requirements::customScript($js, 'MemberLoginFormFieldFocus');

View File

@ -180,13 +180,65 @@ class CmsUiContext extends BehatContext {
} }
/** /**
* @When /^I click on "([^"]*)" in the tree$/ * Applies a specific action to an element
*
* @param NodeElement $element Element to act on
* @param string $action Action, which may be one of 'hover', 'double click', 'right click', or 'left click'
* The default 'click' behaves the same as left click
*/ */
public function stepIClickOnElementInTheTree($text) { protected function interactWithElement($element, $action = 'click') {
switch($action) {
case 'hover':
$element->mouseOver();
break;
case 'double click':
$element->doubleClick();
break;
case 'right click':
$element->rightClick();
break;
case 'left click':
case 'click':
default:
$element->click();
break;
}
}
/**
* @When /^I (?P<method>(?:(?:double |right |left |)click)|hover) on "(?P<link>[^"]*)" in the context menu/
*/
public function stepIClickOnElementInTheContextMenu($method, $link) {
$context = $this->getMainContext();
// Wait until context menu has appeared
$this->getSession()->wait(
1000,
"window.jQuery && window.jQuery('.jstree-apple-context').size() > 0"
);
$regionObj = $context->getRegionObj('.jstree-apple-context');
assertNotNull($regionObj, "Context menu could not be found");
$linkObj = $regionObj->findLink($link);
if (empty($linkObj)) {
throw new \Exception(sprintf(
'The link "%s" was not found in the context menu on the page %s',
$link,
$this->getSession()->getCurrentUrl()
));
}
$this->interactWithElement($linkObj, $method);
}
/**
* @When /^I (?P<method>(?:(?:double |right |left |)click)|hover) on "(?P<text>[^"]*)" in the tree$/
*/
public function stepIClickOnElementInTheTree($method, $text) {
$treeEl = $this->getCmsTreeElement(); $treeEl = $this->getCmsTreeElement();
$treeNode = $treeEl->findLink($text); $treeNode = $treeEl->findLink($text);
assertNotNull($treeNode, sprintf('%s not found', $text)); assertNotNull($treeNode, sprintf('%s not found', $text));
$treeNode->click(); $this->interactWithElement($treeNode, $method);
} }
/** /**

View File

@ -360,4 +360,19 @@ class FolderTest extends SapphireTest {
$this->assertEquals($folder->ID, $folder4->ID); $this->assertEquals($folder->ID, $folder4->ID);
} }
public function testTitleTiedToName() {
$newFolder = new Folder();
$newFolder->Name = 'TestNameCopiedToTitle';
$this->assertEquals($newFolder->Name, $newFolder->Title);
$newFolder->Title = 'TestTitleCopiedToName';
$this->assertEquals($newFolder->Name, $newFolder->Title);
$newFolder->Name = 'TestNameWithIllegalCharactersCopiedToTitle <!BANG!>';
$this->assertEquals($newFolder->Name, $newFolder->Title);
$newFolder->Title = 'TestTitleWithIllegalCharactersCopiedToName <!BANG!>';
$this->assertEquals($newFolder->Name, $newFolder->Title);
}
} }

View File

@ -179,11 +179,17 @@ class HTMLTextTest extends SapphireTest {
function testWhitelist() { function testWhitelist() {
$textObj = new HTMLText('Test', 'meta,link'); $textObj = new HTMLText('Test', 'meta,link');
$this->assertEquals( $this->assertEquals(
$textObj->prepValueForDB('<meta content="Keep"><link href="Also Keep">'), '<meta content="Keep"><link href="Also Keep">',
$textObj->prepValueForDB('<meta content="Keep"><p>Remove</p><link href="Also Keep" />'), $textObj->whitelistContent('<meta content="Keep"><p>Remove</p><link href="Also Keep" />Remove Text'),
'Removes any elements not in whitelist' 'Removes any elements not in whitelist excluding text elements'
);
$textObj = new HTMLText('Test', 'meta,link,text()');
$this->assertEquals(
'<meta content="Keep"><link href="Also Keep">Keep Text',
$textObj->whitelistContent('<meta content="Keep"><p>Remove</p><link href="Also Keep" />Keep Text'),
'Removes any elements not in whitelist including text elements'
); );
} }
} }

View File

@ -1,85 +0,0 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title>Test for jQuery validate() plugin</title>
<link rel="stylesheet" type="text/css" media="screen" href="css/screen.css" />
<style type="text/css">
.warning { color: red; }
</style>
<script src="../lib/jquery.js" type="text/javascript"></script>
<script src="../lib/jquery.form.js" type="text/javascript"></script>
<script src="../jquery.validate.js" type="text/javascript"></script>
<script type="text/javascript">
jQuery(function() {
// show a simple loading indicator
var loader = jQuery('<div id="loader"><img src="images/loading.gif" alt="loading..." /></div>')
.css({position: "relative", top: "1em", left: "25em"})
.appendTo("body")
.hide();
jQuery().ajaxStart(function() {
loader.show();
}).ajaxStop(function() {
loader.hide();
}).ajaxError(function(a, b, e) {
throw e;
});
var v = jQuery("#form").validate({
submitHandler: function(form) {
jQuery(form).ajaxSubmit({
target: "#result"
});
}
});
jQuery("#reset").click(function() {
v.resetForm();
});
});
</script>
</head>
<body>
<h1 id="banner"><a href="http://bassistance.de/jquery-plugins/jquery-plugin-validation/">jQuery Validation Plugin</a> Demo</h1>
<div id="main">
<form method="post" class="cmxform" id="form" action="form.php">
<fieldset>
<legend>Login Form (Enter "foobar" as password)</legend>
<p>
<label for="user">Username</label>
<input id="user" name="user" title="Please enter your username (at least 3 characters)" class="required" minlength="3" />
</p>
<p>
<label for="pass">Password</label>
<input type="password" name="password" id="password" class="required" minlength"5" />
</p>
<p>
<input class="submit" type="submit" value="Login"/>
</p>
</fieldset>
</form>
<div id="result">Please login!</div>
<br/>
<button id="reset">Programmatically reset above form!</button>
<p>Backend file: <a href="form.phps">form.phps</a></p>
<a href="index.html">Back to main page</a>
</div>
<script src="http://www.google-analytics.com/urchin.js" type="text/javascript">
</script>
<script type="text/javascript">
_uacct = "UA-2623402-1";
urchinTracker();
</script>
</body>
</html>

View File

@ -1,27 +0,0 @@
$(function(){
$("#refreshimg").click(function(){
$.post('newsession.php');
$("#captchaimage").load('image_req.php');
return false;
});
$("#captchaform").validate({
rules: {
captcha: {
required: true,
remote: "process.php"
}
},
messages: {
captcha: "Correct captcha is required. Click the captcha to generate a new one"
},
submitHandler: function() {
alert("Correct captcha!");
},
success: function(label) {
label.addClass("valid").text("Valid captcha!")
},
onkeyup: false
});
});

View File

@ -1,6 +0,0 @@
<?php
// Echo the image - timestamp appended to prevent caching
echo '<a href="index.php" onclick="refreshimg(); return false;" title="Click to refresh image"><img src="images/image.jpg?' . time() . '" width="132" height="46" alt="Captcha image" /></a>';
?>

View File

@ -1 +0,0 @@
AddType application/x-httpd-php .jpg

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.5 KiB

View File

@ -1,35 +0,0 @@
<?php
// Begin the session
session_start();
// If the session is not present, set the variable to an error message
if(!isset($_SESSION['captcha_id']))
$str = 'ERROR!';
// Else if it is present, set the variable to the session contents
else
$str = $_SESSION['captcha_id'];
// Set the content type
//header('Content-type: image/png');
header('Cache-control: no-cache');
// Create an image from button.png
$image = imagecreatefrompng('button.png');
// Set the font colour
$colour = imagecolorallocate($image, 183, 178, 152);
// Set the font
$font = '../fonts/Anorexia.ttf';
// Set a random integer for the rotation between -15 and 15 degrees
$rotate = rand(-15, 15);
// Create an image using our original image and adding the detail
imagettftext($image, 14, $rotate, 18, 30, $colour, $font, $str);
// Output the image as a png
imagepng($image);
?>

View File

@ -1,66 +0,0 @@
<?php
// Make the page validate
ini_set('session.use_trans_sid', '0');
// Include the random string file
require 'rand.php';
// Begin the session
session_start();
// Set the session contents
$_SESSION['captcha_id'] = $str;
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>AJAX CAPTCHA</title>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<meta name="keywords" content="AJAX,JHR,PHP,CAPTCHA,download,PHP CAPTCHA,AJAX CAPTCHA,AJAX PHP CAPTCHA,download AJAX CAPTCHA,download AJAX PHP CAPTCHA" />
<meta name="description" content="An AJAX CAPTCHA script, written in PHP" />
<script type="text/javascript" src="../../lib/jquery.js"></script>
<script type="text/javascript" src="../../jquery.validate.js"></script>
<script type="text/javascript" src="captcha.js"></script>
<link rel="stylesheet" type="text/css" href="style.css" />
<style type="text/css">
img { border: 1px solid #eee; }
p#statusgreen { font-size: 1.2em; background-color: #fff; color: #0a0; }
p#statusred { font-size: 1.2em; background-color: #fff; color: #a00; }
fieldset label { display: block; }
fieldset div#captchaimage { float: left; margin-right: 15px; }
fieldset input#captcha { width: 25%; border: 1px solid #ddd; padding: 2px; }
fieldset input#submit { display: block; margin: 2% 0% 0% 0%; }
#captcha.success {
border: 1px solid #49c24f;
background: #bcffbf;
}
#captcha.error {
border: 1px solid #c24949;
background: #ffbcbc;
}
</style>
</head>
<body>
<h1><acronym title="Asynchronous JavaScript And XML">AJAX</acronym> <acronym title="Completely Automated Public Turing test to tell Computers and Humans Apart">CAPTCHA</acronym>, based on <a href="http://psyrens.com/captcha/">http://psyrens.com/captcha/</a></h1>
<form id="captchaform" action="">
<fieldset>
<div id="captchaimage"><a href="<?php echo $_SERVER['PHP_SELF']; ?>" id="refreshimg" title="Click to refresh image"><img src="images/image.php?<?php echo time(); ?>" width="132" height="46" alt="Captcha image" /></a></div>
<label for="captcha">Enter the characters as seen on the image above (case insensitive):</label>
<input type="text" maxlength="6" name="captcha" id="captcha" />
<input type="submit" name="submit" id="submit" value="Check" />
</fieldset>
</form>
<p>If you can&#39;t decipher the text on the image, click it to dynamically generate a new one.</p>
</body>
</html>

View File

@ -1,12 +0,0 @@
<?php
// Include the random string file
require 'rand.php';
// Begin a new session
session_start();
// Set the session contents
$_SESSION['captcha_id'] = $str;
?>

View File

@ -1,14 +0,0 @@
<?php
// Begin the session
session_start();
// To avoid case conflicts, make the input uppercase and check against the session value
// If it's correct, echo '1' as a string
if(strtoupper($_GET['captcha']) == $_SESSION['captcha_id'])
echo 'true';
// Else echo '0' as a string
else
echo 'false';
?>

View File

@ -1,11 +0,0 @@
<?php
// Create a random string, leaving out 'o' to avoid confusion with '0'
$char = strtoupper(substr(str_shuffle('abcdefghjkmnpqrstuvwxyz'), 0, 4));
// Concatenate the random string onto the random numbers
// The font 'Anorexia' doesn't have a character for '8', so the numbers will only go up to 7
// '0' is left out to avoid confusion with 'O'
$str = rand(1, 7) . rand(1, 7) . $char;
?>

View File

@ -1,140 +0,0 @@
body {
margin: 3% 5%;
padding: 0;
background-color: #fff;
color: #333;
font: 0.9em/1.3 Helvetica, Arial, Verdana, Sans-serif;
}
a:link, a:visited {
background-color: #fff;
color: #333;
text-decoration: underline;
}
a:hover, a:focus, a:active {
background-color: #ffb;
color: #454545;
text-decoration: underline;
}
h1 {
margin: 2% 0%;
padding: 1%;
border-bottom: 1px solid #ddd;
background-color: #f8f8f8;
color: #666;
font: normal 1.5em Helvetica, Arial, Verdana, Sans-serif;
}
h2 {
margin: 2% 0%;
padding: 1%;
border-bottom: 1px solid #ddd;
background-color: #f8f8f8;
color: #666;
font: normal 1.3em Helvetica, Arial, Verdana, Sans-serif;
}
h3 {
margin: 2% 0%;
padding: 1%;
border-bottom: 1px solid #ddd;
background-color: #f8f8f8;
color: #666;
font: normal 1.2em Helvetica, Arial, Verdana, Sans-serif;
}
table {
margin: 0;
padding: 0;
width: 100%;
}
table th {
border: 1px solid #ddd;
font-weight: bold;
text-align: left;
padding: 1%;
}
table td {
border: 1px solid #ddd;
padding: 1%;
}
dl, dt, dd {
margin: 0;
padding: 0;
}
form {
margin: 0;
padding: 0;
}
fieldset {
border: 1px solid #ddd;
margin: 0% 0% 2% 0%;
padding: 2%;
}
fieldset legend {
margin: 0;
padding: 0 4px;
background-color: inherit;
color: #333;
}
code {
font: 1em "Courier New", Courier, Monospace;
}
pre code {
font: 1.1em "Courier New", Courier, Monospace;
border-bottom: 1px solid #eee;
}
img {
border: 1px solid #eee;
}
p#statusgreen {
font-size: 1.2em;
background-color: #fff;
color: #0a0;
}
p#statusred {
font-size: 1.2em;
background-color: #fff;
color: #a00;
}
fieldset label {
display: block;
}
fieldset label.error {
color: red;
}
fieldset label.valid {
color: green;
}
fieldset div#captchaimage {
float: left;
margin-right: 15px;
}
fieldset input#captcha {
width: 25%;
border: 1px solid #ddd;
padding: 2px;
}
fieldset input#submit {
display: block;
margin: 2% 0% 0% 0%;
}

View File

@ -1,15 +0,0 @@
.jscom, .mix htcom { color: #4040c2; }
.com { color: green; }
.regexp { color: maroon; }
.string { color: teal; }
.keywords { color: blue; }
.global { color: #008; }
.numbers { color: #880; }
.comm { color: green; }
.tag { color: blue; }
.entity { color: blue; }
.string { color: teal; }
.aname { color: maroon; }
.avalue { color: maroon; }
.jquery { color: #00a; }
.plugin { color: red; }

View File

@ -1,46 +0,0 @@
/**********************************
Name: cmxform Styles
***********************************/
form.cmxform {
width: 370px;
font-size: 1.0em;
color: #333;
}
form.cmxform legend {
padding-left: 0;
}
form.cmxform legend, form.cmxform label {
color: #333;
}
form.cmxform fieldset {
border: none;
border-top: 1px solid #C9DCA6;
background: url(../images/cmxform-fieldset.gif) left bottom repeat-x;
background-color: #F8FDEF;
}
form.cmxform fieldset fieldset {
background: none;
}
form.cmxform fieldset p, form.cmxform fieldset fieldset {
padding: 5px 10px 7px;
background: url(../images/cmxform-divider.gif) left bottom repeat-x;
}
form.cmxform label.error, label.error {
/* remove the next line when you have trouble in IE6 with labels in list */
color: red;
font-style: italic
}
div.error { display: none; }
input { border: 1px solid black; }
input.checkbox { border: none }
input:focus { border: 1px dotted black; }
input.error { border: 1px dotted red; }
form.cmxform .gray * { color: gray; }

View File

@ -1,55 +0,0 @@
/**********************************
Use: cmxform template
***********************************/
form.cmxform fieldset {
margin-bottom: 10px;
}
form.cmxform legend {
padding: 0 2px;
font-weight: bold;
_margin: 0 -7px; /* IE Win */
}
form.cmxform label {
display: inline-block;
line-height: 1.8;
vertical-align: top;
cursor: hand;
}
form.cmxform fieldset p {
list-style: none;
padding: 5px;
margin: 0;
}
form.cmxform fieldset fieldset {
border: none;
margin: 3px 0 0;
}
form.cmxform fieldset fieldset legend {
padding: 0 0 5px;
font-weight: normal;
}
form.cmxform fieldset fieldset label {
display: block;
width: auto;
}
form.cmxform label { width: 100px; } /* Width of labels */
form.cmxform fieldset fieldset label { margin-left: 103px; } /* Width plus 3 (html space) */
form.cmxform label.error {
margin-left: 103px;
width: 220px;
}
form.cmxform input.submit {
margin-left: 103px;
}
/*\*//*/ form.cmxform legend { display: inline-block; } /* IE Mac legend fix */

View File

@ -1,21 +0,0 @@
body, div { font-family: 'lucida grande', helvetica, verdana, arial, sans-serif }
body { margin: 0; padding: 0; font-size: small; color: #333 }
h1, h2 { font-family: 'trebuchet ms', verdana, arial; padding: 10px; margin: 0 }
h1 { font-size: large }
#main { padding: 1em; }
#banner { padding: 15px; background-color: #06b; color: white; font-size: large; border-bottom: 1px solid #ccc;
background: url(../images/bg.gif) repeat-x; text-align: center }
#banner a { color: white; }
p { margin: 10px 0; }
li { margin-left: 10px; }
h3 { margin: 1em 0 0; }
h1 { font-size: 2em; }
h2 { font-size: 1.8em; }
h3 { font-size: 1.6em; }
h4 { font-size: 1.4em; }
h5 { font-size: 1.2em; }

View File

@ -1,61 +0,0 @@
/**********************************
Use: Reset Styles for all browsers
***********************************/
body, p, blockquote {
margin: 0;
padding: 0;
}
a img, iframe { border: none; }
/* Headers
------------------------------*/
h1, h2, h3, h4, h5, h6 {
margin: 0;
padding: 0;
font-size: 100%;
}
/* Lists
------------------------------*/
ul, ol, dl, li, dt, dd {
margin: 0;
padding: 0;
}
/* Links
------------------------------*/
a, a:link {}
a:visited {}
a:hover {}
a:active {}
/* Forms
------------------------------*/
form, fieldset {
margin: 0;
padding: 0;
}
fieldset { border: 1px solid #000; }
legend {
padding: 0;
color: #000;
}
input, textarea, select {
margin: 0;
padding: 1px;
font-size: 100%;
font-family: inherit;
}
select { padding: 0; }

View File

@ -1,11 +0,0 @@
/**********************************
Use: Main Screen Import
***********************************/
@import "reset.css";
@import "core.css";
@import "cmxformTemplate.css";
@import "cmxform.css";

View File

@ -1,92 +0,0 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title>jQuery validation plug-in - comment form example</title>
<link rel="stylesheet" type="text/css" media="screen" href="css/screen.css" />
<script src="../lib/jquery.js" type="text/javascript"></script>
<script src="../jquery.validate.js" type="text/javascript"></script>
<script src="../lib/jquery.metadata.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#commentForm").validate({meta: "validate"});
$("#commentForm2").validate();
$("#commentForm3").validate({
messages: {
email: {
required: 'Enter this!'
}
}
});
});
</script>
<style type="text/css">
form { width: 500px; }
form label { width: 250px; }
form label.error,
form input.submit { margin-left: 253px; }
</style>
</head>
<body>
<h1 id="banner"><a href="http://bassistance.de/jquery-plugins/jquery-plugin-validation/">jQuery Validation Plugin</a> Demo</h1>
<div id="main">
<p>Take a look at the source to see how messages can be customized with metadata.</p>
<!-- Custom messages with custom "meta" setting -->
<form class="cmxform" id="commentForm" method="post" action="">
<fieldset>
<legend>Please enter your email address</legend>
<p>
<label for="cemail">E-Mail *</label>
<input id="cemail" name="email" class="{validate:{required:true, email:true, messages:{required:'Please enter your email address', email:'Please enter a valid email address'}}}"/>
</p>
<p>
<input class="submit" type="submit" value="Submit"/>
</p>
</fieldset>
</form>
<!-- Custom messages with default "meta" setting -->
<form class="cmxform" id="commentForm2" method="post" action="">
<fieldset>
<legend>Please enter your email address</legend>
<p>
<label for="cemail">E-Mail *</label>
<input id="cemail" name="email" class="{required:true, email:true, messages:{required:'Please enter your email address', email:'Please enter a valid email address'}}"/>
</p>
<p>
<input class="submit" type="submit" value="Submit"/>
</p>
</fieldset>
</form>
<!-- Custom message for "required" in metadata is overriden by a validate option -->
<form class="cmxform" id="commentForm3" method="post" action="">
<fieldset>
<legend>Please enter your email address</legend>
<p>
<label for="cemail">E-Mail *</label>
<input id="cemail" name="email" class="{required:true, email:true, messages:{email:'Please enter a valid email address'}}"/>
</p>
<p>
<input class="submit" type="submit" value="Submit"/>
</p>
</fieldset>
</form>
<a href="index.html">Back to main page</a>
<script src="http://www.google-analytics.com/urchin.js" type="text/javascript"></script>
<script type="text/javascript">_uacct = "UA-2623402-1";urchinTracker();</script>
</body>
</html>

View File

@ -1,122 +0,0 @@
<?xml version="1.0" encoding="ISO-8859-1" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title>Test for jQuery validate() plugin</title>
<link rel="stylesheet" type="text/css" media="screen" href="css/screen.css" />
<script src="../lib/jquery.js" type="text/javascript"></script>
<script src="../jquery.validate.js" type="text/javascript"></script>
<script type="text/javascript">
// extend the current rules with new groovy ones
// this one requires the text "buga", we define a default message, too
$.validator.addMethod("buga", function(value) {
return value == "buga";
}, 'Please enter "buga"!');
// this one requires the value to be the same as the first parameter
$.validator.methods.equal = function(value, element, param) {
return value == param;
};
$().ready(function() {
var validator = $("#texttests").bind("invalid-form.validate", function() {
$("#summary").html("Your form contains " + validator.numberOfInvalids() + " errors, see details below.");
}).validate({
debug: true,
errorElement: "em",
errorContainer: $("#warning, #summary"),
errorPlacement: function(error, element) {
error.appendTo( element.parent("td").next("td") );
},
success: function(label) {
label.text("ok!").addClass("success");
},
rules: {
number: {
required:true,
minlength:3,
maxlength:15,
number:true
},
secret: "buga",
math: {
equal: 11
}
}
});
});
</script>
<style type="text/css">
form.cmxform { width: 50em; }
em.error {
background:url("images/unchecked.gif") no-repeat 0px 0px;
padding-left: 16px;
}
em.success {
background:url("images/checked.gif") no-repeat 0px 0px;
padding-left: 16px;
}
form.cmxform label.error {
margin-left: auto;
width: 250px;
}
em.error { color: black; }
#warning { display: none; }
</style>
</head>
<body>
<h1 id="banner"><a href="http://bassistance.de/jquery-plugins/jquery-plugin-validation/">jQuery Validation Plugin</a> Demo</h1>
<div id="main">
<form class="cmxform" id="texttests" method="get" action="foo.html">
<h2 id="summary"></h2>
<fieldset>
<legend>Example with custom methods and heavily customized error display</legend>
<table>
<tr>
<td><label for="number">textarea</label></td>
<td><input id="number" name="number"
title="Please enter a number with at least 3 and max 15 characters!" />
</td>
<td></td>
</tr>
<tr>
<td><label for="secret">Secret</label></td>
<td><input name="secret" id="secret" /></td>
<td></td>
</tr>
<tr>
<td><label for="math">7 + 4 = </label></td>
<td><input id="math" name="math" title="Please enter the correct result!" /></td>
<td></td>
</tr>
</table>
<input class="submit" type="submit" value="Submit"/>
</fieldset>
</form>
<h3 id="warning">Your form contains tons of errors! Please try again.</h3>
<p><a href="index.html">Back to main page</a></p>
</div>
<script src="http://www.google-analytics.com/urchin.js" type="text/javascript">
</script>
<script type="text/javascript">
_uacct = "UA-2623402-1";
urchinTracker();
</script>
</body>
</html>

View File

@ -1,151 +0,0 @@
<?xml version="1.0" encoding="ISO-8859-1" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title>jQuery validation plug-in - dynamic forms demo</title>
<link rel="stylesheet" type="text/css" media="screen" href="css/screen.css" />
<script src="../lib/jquery.js" type="text/javascript"></script>
<script src="../jquery.validate.js" type="text/javascript"></script>
<script type="text/javascript">
// only for demo purposes
$.validator.setDefaults({
submitHandler: function() {
alert("submitted!");
}
});
$.validator.messages.max = jQuery.format("Your totals musn't exceed {0}!");
$.validator.addMethod("quantity", function(value, element) {
return !this.optional(element) && !this.optional($(element).parent().prev().children("select")[0]);
}, "Please select both the item and its amount.");
$().ready(function() {
$("#orderform").validate({
errorPlacement: function(error, element) {
error.appendTo( element.parent().next() );
},
highlight: function(element, errorClass) {
$(element).addClass(errorClass).parent().prev().children("select").addClass(errorClass);
}
});
var template = jQuery.format($("#template").val());
function addRow() {
$(template(i++)).appendTo("#orderitems tbody");
}
var i = 1;
// start with one row
addRow();
// add more rows on click
$("#add").click(addRow);
// check keyup on quantity inputs to update totals field
$("#orderform").delegate("keyup", "input.quantity", function(event) {
var totals = 0;
$("#orderitems input.quantity").each(function() {
totals += +this.value;
});
$("#totals").attr("value", totals).valid();
});
});
</script>
<style type="text/css">
form.cmxform { width: 50em; }
em.error {
background:url("images/unchecked.gif") no-repeat 0px 0px;
padding-left: 16px;
}
em.success {
background:url("images/checked.gif") no-repeat 0px 0px;
padding-left: 16px;
}
form.cmxform label.error {
margin-left: auto;
width: 250px;
}
form.cmxform input.submit {
margin-left: 0;
}
em.error { color: black; }
#warning { display: none; }
select.error {
border: 1px dotted red;
}
</style>
</head>
<body>
<h1 id="banner"><a href="http://bassistance.de/jquery-plugins/jquery-plugin-validation/">jQuery Validation Plugin</a> Demo</h1>
<div id="main">
<textarea style="display:none" id="template">
<tr>
<td>
<label>{0}. Item</label>
</td>
<td class='type'>
<select name="item-type-{0}">
<option value="">Select...</option>
<option value="0">Learning jQuery</option>
<option value="1">jQuery Reference Guide</option>
<option value="2">jQuery Cookbook</option>
<option vlaue="3">jQuery In Action</option>
<option value="4">jQuery For Designers</option>
</select>
</td>
<td class='quantity'>
<input size='4' class="quantity" min="1" id="item-quantity-{0}" name="item-quantity-{0}" />
</td>
<td class='quantity-error'></td>
</tr>
</textarea>
<form id="orderform" class="cmxform" method="get" action="foo.html">
<h2 id="summary"></h2>
<fieldset>
<legend>Example with custom methods and heavily customized error display</legend>
<table id="orderitems">
<tbody>
</tbody>
<tfoot>
<tr>
<td colspan="2"><label>Totals (max 25)</label></td>
<td class="totals"><input id="totals" name="totals" value="0" max="25" readonly="readonly" size='4' /></td>
<td class="totals-error"></td>
</tr>
<tr>
<td colspan="2">&nbsp;</td>
<td><input class="submit" type="submit" value="Submit"/></td>
</tr>
</tfoot>
</table>
</fieldset>
</form>
<button id="add">Add another input to the form</button>
<h1 id="warning">Your form contains tons of errors! Please try again.</h1>
<p><a href="index.html">Back to main page</a></p>
</div>
<script src="http://www.google-analytics.com/urchin.js" type="text/javascript">
</script>
<script type="text/javascript">
_uacct = "UA-2623402-1";
urchinTracker();
</script>
</body>
</html>

View File

@ -1,161 +0,0 @@
<?xml version="1.0" encoding="ISO-8859-1" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title>Test for jQuery validate() plugin</title>
<link rel="stylesheet" type="text/css" media="screen" href="css/screen.css" />
<script src="../lib/jquery.js" type="text/javascript"></script>
<script src="../lib/jquery.metadata.js" type="text/javascript"></script>
<script src="../jquery.validate.js" type="text/javascript"></script>
<style type="text/css">
.cmxform fieldset p.error label { color: red; }
div.container {
background-color: #eee;
border: 1px solid red;
margin: 5px;
padding: 5px;
}
div.container ol li {
list-style-type: disc;
margin-left: 20px;
}
div.container { display: none }
.container label.error {
display: inline;
}
form.cmxform { width: 30em; }
form.cmxform label.error {
display: block;
margin-left: 1em;
width: auto;
}
</style>
<script type="text/javascript">
// only for demo purposes
$.validator.setDefaults({
submitHandler: function() {
alert("submitted! (skipping validation for cancel button)");
}
});
$().ready(function() {
$("#form1").validate({
errorLabelContainer: $("#form1 div.error")
});
var container = $('div.container');
// validate the form when it is submitted
var validator = $("#form2").validate({
errorContainer: container,
errorLabelContainer: $("ol", container),
wrapper: 'li',
meta: "validate"
});
$(".cancel").click(function() {
validator.resetForm();
});
});
</script>
</head>
<body>
<h1 id="banner"><a href="http://bassistance.de/jquery-plugins/jquery-plugin-validation/">jQuery Validation Plugin</a> Demo</h1>
<div id="main">
<form method="get" class="cmxform" id="form1" action="">
<fieldset>
<legend>Login Form</legend>
<p>
<label>Username</label>
<input name="user" title="Please enter your username (at least 3 characters)" class="{required:true,minlength:3}" />
</p>
<p>
<label>Password</label>
<input type="password" maxlength="12" name="password" title="Please enter your password, between 5 and 12 characters" class="{required:true,minlength:5}" />
</p>
<div class="error">
</div>
<p>
<input class="submit" type="submit" value="Login"/>
</p>
</fieldset>
</form>
<!-- our error container -->
<div class="container">
<h4>There are serious errors in your form submission, please see below for details.</h4>
<ol>
<li><label for="email" class="error">Please enter your email address</label></li>
<li><label for="phone" class="error">Please enter your phone <b>number</b> (between 2 and 8 characters)</label></li>
<li><label for="address" class="error">Please enter your address (at least 3 characters)</label></li>
<li><label for="avatar" class="error">Please select an image (png, jpg, jpeg, gif)</label></li>
<li><label for="cv" class="error">Please select a document (doc, docx, txt, pdf)</label></li>
</ol>
</div>
<form class="cmxform" id="form2" method="get" action="">
<fieldset>
<legend>Validating a complete form</legend>
<p>
<label for="email">Email</label>
<input id="email" name="email" class="{validate:{required:true,email:true}}" />
</p>
<p>
<label for="agree">Favorite Color</label>
<select id="color" name="color" title="Please select your favorite color!" class="{validate:{required:true}}">
<option></option>
<option>Red</option>
<option>Blue</option>
<option>Yellow</option>
</select>
</p>
<p>
<label for="phone">Phone</label>
<input id="phone" name="phone" class="some styles {validate:{required:true,number:true, rangelength:[2,8]}}" />
</p>
<p>
<label for="address">Address</label>
<input id="address" name="address" class="some other styles {validate:{required:true,minlength:3}}" />
</p>
<p>
<label for="avatar">Avatar</label>
<input type="file" id="avatar" name="avatar" class="{validate:{required:true,accept:true}}" />
</p>
<p>
<label for="agree">Please agree to our policy</label>
<input type="checkbox" class="checkbox" id="agree" title="Please agree to our policy!" name="agree" class="{validate:{required:true}}" />
</p>
<p>
<label for="cv">CV</label>
<input type="file" id="cv" name="cv" class="{validate:{required:true,accept:'docx?|txt|pdf'}}" />
</p>
<p>
<input class="submit" type="submit" value="Submit"/>
<input class="cancel" type="submit" value="Cancel"/>
</p>
</fieldset>
</form>
<div class="container">
<h4>There are serious errors in your form submission, please see details above the form!</h4>
</div>
<a href="index.html">Back to main page</a>
</div>
<script src="http://www.google-analytics.com/urchin.js" type="text/javascript">
</script>
<script type="text/javascript">
_uacct = "UA-2623402-1";
urchinTracker();
</script>
</body>
</html>

View File

@ -1,53 +0,0 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title>jQuery validation plug-in - comment form example</title>
<link rel="stylesheet" type="text/css" media="screen" href="css/screen.css" />
<script src="../lib/jquery.js" type="text/javascript"></script>
<script src="../jquery.validate.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#commentForm").validate();
});
</script>
<style type="text/css">
#commentForm { width: 500px; }
#commentForm label { width: 250px; }
#commentForm label.error, #commentForm input.submit { margin-left: 253px; }
</style>
</head>
<body>
<form class="cmxform" id="commentForm" method="post" action="">
<fieldset>
<legend>Please provide your name, email address (won't be published) and a comment</legend>
<p>
<label for="cname">Name (required, at least 2 characters)</label>
<input id="cname" name="name" class="required" minlength="2" />
</p>
<p>
<label for="cemail">E-Mail (required)</label>
<input id="cemail" name="email" class="required email" />
</p>
<p>
<label for="curl">URL (optional)</label>
<input id="curl" name="url" class="url" value="" />
</p>
<p>
<label for="ccomment">Your comment (required)</label>
<textarea id="ccomment" name="comment" class="required"></textarea>
</p>
<p>
<input class="submit" type="submit" value="Submit"/>
</p>
</fieldset>
</form>
</body>
</html>

View File

@ -1,10 +0,0 @@
<?php
// wait a second to simulate a some latency
usleep(500000);
$user = $_REQUEST['user'];
$pw = $_REQUEST['password'];
if($user && $pw && $pw == "foobar")
echo "Hi $user, welcome back.";
else
echo "Your password is wrong (must be foobar).";
?>

View File

@ -1,10 +0,0 @@
<?php
// wait a second to simulate a some latency
usleep(500000);
$user = $_REQUEST['user'];
$pw = $_REQUEST['password'];
if($user && $pw && $pw == "foobar")
echo "Hi $user, welcome back.";
else
echo "Your password is wrong (must be foobar).";
?>

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.1 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 220 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 43 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 314 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 418 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 223 B

View File

@ -1,230 +0,0 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title>jQuery validation plug-in - main demo</title>
<link rel="stylesheet" type="text/css" media="screen" href="css/screen.css" />
<script src="../lib/jquery.js" type="text/javascript"></script>
<script src="../jquery.validate.js" type="text/javascript"></script>
<script type="text/javascript">
$.validator.setDefaults({
submitHandler: function() { alert("submitted!"); }
});
$().ready(function() {
// validate the comment form when it is submitted
$("#commentForm").validate();
// validate signup form on keyup and submit
$("#signupForm").validate({
rules: {
firstname: "required",
lastname: "required",
username: {
required: true,
minlength: 2
},
password: {
required: true,
minlength: 5
},
confirm_password: {
required: true,
minlength: 5,
equalTo: "#password"
},
email: {
required: true,
email: true
},
topic: {
required: "#newsletter:checked",
minlength: 2
},
agree: "required"
},
messages: {
firstname: "Please enter your firstname",
lastname: "Please enter your lastname",
username: {
required: "Please enter a username",
minlength: "Your username must consist of at least 2 characters"
},
password: {
required: "Please provide a password",
minlength: "Your password must be at least 5 characters long"
},
confirm_password: {
required: "Please provide a password",
minlength: "Your password must be at least 5 characters long",
equalTo: "Please enter the same password as above"
},
email: "Please enter a valid email address",
agree: "Please accept our policy"
}
});
// propose username by combining first- and lastname
$("#username").focus(function() {
var firstname = $("#firstname").val();
var lastname = $("#lastname").val();
if(firstname && lastname && !this.value) {
this.value = firstname + "." + lastname;
}
});
//code to hide topic selection, disable for demo
var newsletter = $("#newsletter");
// newsletter topics are optional, hide at first
var inital = newsletter.is(":checked");
var topics = $("#newsletter_topics")[inital ? "removeClass" : "addClass"]("gray");
var topicInputs = topics.find("input").attr("disabled", !inital);
// show when newsletter is checked
newsletter.click(function() {
topics[this.checked ? "removeClass" : "addClass"]("gray");
topicInputs.attr("disabled", !this.checked);
});
});
</script>
<style type="text/css">
#commentForm { width: 500px; }
#commentForm label { width: 250px; }
#commentForm label.error, #commentForm input.submit { margin-left: 253px; }
#signupForm { width: 670px; }
#signupForm label.error {
margin-left: 10px;
width: auto;
display: inline;
}
#newsletter_topics label.error {
display: none;
margin-left: 103px;
}
</style>
</head>
<body>
<h1 id="banner"><a href="http://bassistance.de/jquery-plugins/jquery-plugin-validation/">jQuery Validation Plugin</a> Demo</h1>
<div id="main">
<p>Default submitHandler is set to display an alert into of submitting the form</p>
<form class="cmxform" id="commentForm" method="get" action="">
<fieldset>
<legend>Please provide your name, email address (won't be published) and a comment</legend>
<p>
<label for="cname">Name (required, at least 2 characters)</label>
<input id="cname" name="name" class="required" minlength="2" />
<p>
<label for="cemail">E-Mail (required)</label>
<input id="cemail" name="email" class="required email" />
</p>
<p>
<label for="curl">URL (optional)</label>
<input id="curl" name="url" class="url" value="" />
</p>
<p>
<label for="ccomment">Your comment (required)</label>
<textarea id="ccomment" name="comment" class="required"></textarea>
</p>
<p>
<input class="submit" type="submit" value="Submit"/>
</p>
</fieldset>
</form>
<form class="cmxform" id="signupForm" method="get" action="">
<fieldset>
<legend>Validating a complete form</legend>
<p>
<label for="firstname">Firstname</label>
<input id="firstname" name="firstname" />
</p>
<p>
<label for="lastname">Lastname</label>
<input id="lastname" name="lastname" />
</p>
<p>
<label for="username">Username</label>
<input id="username" name="username" />
</p>
<p>
<label for="password">Password</label>
<input id="password" name="password" type="password" />
</p>
<p>
<label for="confirm_password">Confirm password</label>
<input id="confirm_password" name="confirm_password" type="password" />
</p>
<p>
<label for="email">Email</label>
<input id="email" name="email" />
</p>
<p>
<label for="agree">Please agree to our policy</label>
<input type="checkbox" class="checkbox" id="agree" name="agree" />
</p>
<p>
<label for="newsletter">I'd like to receive the newsletter</label>
<input type="checkbox" class="checkbox" id="newsletter" name="newsletter" />
</p>
<fieldset id="newsletter_topics">
<legend>Topics (select at least two) - note: would be hidden when newsletter isn't selected, but is visible here for the demo</legend>
<label for="topic_marketflash">
<input type="checkbox" id="topic_marketflash" value="marketflash" name="topic" />
Marketflash
</label>
<label for="topic_fuzz">
<input type="checkbox" id="topic_fuzz" value="fuzz" name="topic" />
Latest fuzz
</label>
<label for="topic_digester">
<input type="checkbox" id="topic_digester" value="digester" name="topic" />
Mailing list digester
</label>
<label for="topic" class="error">Please select at least two topics you'd like to receive.</label>
</fieldset>
<p>
<input class="submit" type="submit" value="Submit"/>
</p>
</fieldset>
</form>
<h3>Syntetic examples</h3>
<ul>
<li><a href="errorcontainer-demo.html">Error message containers in action</a></li>
<li><a href="custom-messages-metadata-demo.html">Custom Messages as Metadata</a></li>
<li><a href="radio-checkbox-select-demo.html">Radio and checkbox buttons and selects</a></li>
<li><a href="ajaxSubmit-intergration-demo.html">Integration with Form Plugin (AJAX submit)</a></li>
<li><a href="custom-methods-demo.html">Custom methods and message display.</a></li>
<li><a href="dynamic-totals.html">Dynamic forms</a></li>
<li><a href="themerollered.html">Forms styled with jQuery UI Themeroller</a></li>
</ul>
<h3>Real-world examples</h3>
<ul>
<li><a href="milk/">Remember The Milk signup form</a></li>
<li><a href="marketo/">Marketo signup form</a></li>
<li><a href="multipart/">Buy and Sell a House multipart form</a></li>
<li><a href="captcha/">Remote captcha validation</a></li>
</ul>
<h3>Testsuite</h3>
<ul>
<li><a href="../test/">Validation Testsuite</a></li>
</ul>
</div>
<script src="http://www.google-analytics.com/urchin.js" type="text/javascript">
</script>
<script type="text/javascript">
_uacct = "UA-2623402-1";
urchinTracker();
</script>
</body>
</html>

View File

@ -1 +0,0 @@
eval(function(p,a,c,k,e,d){e=function(c){return(c<a?"":e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--)d[e(c)]=k[c]||e(c);k=[function(e){return d[e]}];e=function(){return'\\w+'};c=1;};while(c--)if(k[c])p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c]);return p;}('8={3b:"1.6",2o:"1B.1Y,1B.23,1B.2e",2i:"",2H:1a,12:"",2C:1a,Z:"",2a:\'<H V="$0">$$</H>\',R:"&#F;",1j:"&#F;&#F;&#F;&#F;",1f:"&#F;<1W/>",3c:5(){9 $(y).39("1k")[0]},I:{},N:{}};(5($){$(5(){5 1J(l,a){5 2I(A,h){4 3=(1v h.3=="1h")?h.3:h.3.1w;k.1m({A:A,3:"("+3+")",u:1+(3.c(/\\\\./g,"%").c(/\\[.*?\\]/g,"%").3a(/\\((?!\\?)/g)||[]).u,z:(h.z)?h.z:8.2a})}5 2z(){4 1E=0;4 1x=x 2A;Q(4 i=0;i<k.u;i++){4 3=k[i].3;3=3.c(/\\\\\\\\|\\\\(\\d+)/g,5(m,1F){9!1F?m:"\\\\"+(1E+1+1t(1F))});1x.1m(3);1E+=k[i].u}4 1w=1x.3d("|");9 x 1u(1w,(a.3g)?"2j":"g")}5 1S(o){9 o.c(/&/g,"&3h;").c(/</g,"&3e;")}5 1R(o){9 o.c(/ +/g,5(1X){9 1X.c(/ /g,R)})}5 G(o){o=1S(o);7(R){o=1R(o)}9 o}5 2m(2E){4 i=0;4 j=1;4 h;19(h=k[i++]){4 1b=D;7(1b[j]){4 1U=/(\\\\\\$)|(?:\\$\\$)|(?:\\$(\\d+))/g;4 z=h.z.c(1U,5(m,1V,K){4 3f=\'\';7(1V){9"$"}v 7(!K){9 G(1b[j])}v 7(K=="0"){9 h.A}v{9 G(1b[j+1t(K,10)])}});4 1A=D[D.u-2];4 2h=D[D.u-1];4 2G=2h.2v(11,1A);11=1A+2E.u;14+=G(2G)+z;9 z}v{j+=h.u}}}4 R=8.R;4 k=x 2A;Q(4 A 2r a.k){2I(A,a.k[A])}4 14="";4 11=0;l.c(2z(),2m);4 2y=l.2v(11,l.u);14+=G(2y);9 14}5 2B(X){7(!8.N[X]){4 Y=\'<Y 32="1p" 33="p/2u"\'+\' 30="\'+X+\'">\';8.N[X]=1H;7($.31.34){4 W=J.1L(Y);4 $W=$(W);$("2d").1O($W)}v{$("2d").1O(Y)}}}5 1q(e,a){4 l=e&&e.1g&&e.1g[0]&&e.1g[0].37;7(!l)l="";l=l.c(/\\r\\n?/g,"\\n");4 C=1J(l,a);7(8.1j){C=C.c(/\\t/g,8.1j)}7(8.1f){C=C.c(/\\n/g,8.1f)}$(e).38(C)}5 1o(q,13){4 1l={12:8.12,2x:q+".1d",Z:8.Z,2w:q+".2u"};4 B;7(13&&1v 13=="2l")B=$.35(1l,13);v B=1l;9{a:B.12+B.2x,1p:B.Z+B.2w}}7($.2q)$.2q({36:"2l.15"});4 2n=x 1u("\\\\b"+8.2i+"\\\\b","2j");4 1e=[];$(8.2o).2D(5(){4 e=y;4 1n=$(e).3i("V");7(!1n){9}4 q=$.3u(1n.c(2n,""));7(\'\'!=q){1e.1m(e);4 f=1o(q,e.15);7(8.2H||e.15){7(!8.N[f.a]){1D{8.N[f.a]=1H;$.3v(f.a,5(M){M.f=f.a;8.I[f.a]=M;7(8.2C){2B(f.1p)}$("."+q).2D(5(){4 f=1o(q,y.15);7(M.f==f.a){1q(y,M)}})})}1I(3s){3t("a 3w Q: "+q+\'@\'+3z)}}}v{4 a=8.I[f.a];7(a){1q(e,a)}}}});7(J.1i&&J.1i.29){5 22(p){7(\'\'==p){9""}1z{4 16=(x 3A()).2k()}19(p.3x(16)>-1);p=p.c(/\\<1W[^>]*?\\>/3y,16);4 e=J.1L(\'<1k>\');e.3l=p;p=e.3m.c(x 1u(16,"g"),\'\\r\\n\');9 p}4 T="";4 18=1G;$(1e).3j().G("1k").U("2c",5(){18=y}).U("1M",5(){7(18==y)T=J.1i.29().3k});$("3n").U("3q",5(){7(\'\'!=T){2p.3r.3o(\'3p\',22(T));2V.2R=1a}}).U("2c",5(){T=""}).U("1M",5(){18=1G})}})})(1Z);8.I["1Y.1d"]={k:{2M:{3:/\\/\\*[^*]*\\*+(?:[^\\/][^*]*\\*+)*\\//},25:{3:/\\<!--(?:.|\\n)*?--\\>/},2f:{3:/\\/\\/.*/},2P:{3:/2L|2T|2J|2O|2N|2X|2K|2Z|2U|2S|2W|2Y|2Q|51|c-50/},53:{3:/\\/[^\\/\\\\\\n]*(?:\\\\.[^\\/\\\\\\n]*)*\\/[52]*/},1h:{3:/(?:\\\'[^\\\'\\\\\\n]*(?:\\\\.[^\\\'\\\\\\n]*)*\\\')|(?:\\"[^\\"\\\\\\n]*(?:\\\\.[^\\"\\\\\\n]*)*\\")/},27:{3:/\\b[+-]?(?:\\d*\\.?\\d+|\\d+\\.?\\d*)(?:[1r][+-]?\\d+)?\\b/},4X:{3:/\\b(D|1N|1K|1I|2t|2s|4W|1z|v|1a|Q|5|7|2r|4Z|x|1G|9|1Q|y|1H|1D|1v|4|4Y|19|59)\\b/},1y:{3:/\\b(58|2k|2p|5b|5a|55|J|54|57|1t|56|4L|4K|4N|4M|4H|4G|4J)\\b/},1C:{3:/(?:\\<\\w+)|(?:\\>)|(?:\\<\\/\\w+\\>)|(?:\\/\\>)/},26:{3:/\\s+\\w+(?=\\s*=)/},20:{3:/([\\"\\\'])(?:(?:[^\\1\\\\\\r\\n]*?(?:\\1\\1|\\\\.))*[^\\1\\\\\\r\\n]*?)\\1/},21:{3:/&[\\w#]+?;/},4I:{3:/(\\$|1Z)/}}};8.I["23.1d"]={k:{25:{3:/\\<!--(?:.|\\n)*?--\\>/},1h:{3:/(?:\\\'[^\\\'\\\\\\n]*(?:\\\\.[^\\\'\\\\\\n]*)*\\\')|(?:\\"[^\\"\\\\\\n]*(?:\\\\.[^\\"\\\\\\n]*)*\\")/},27:{3:/\\b[+-]?(?:\\d*\\.?\\d+|\\d+\\.?\\d*)(?:[1r][+-]?\\d+)?\\b/},1C:{3:/(?:\\<\\w+)|(?:\\>)|(?:\\<\\/\\w+\\>)|(?:\\/\\>)/},26:{3:/\\s+\\w+(?=\\s*=)/},20:{3:/([\\"\\\'])(?:(?:[^\\1\\\\\\r\\n]*?(?:\\1\\1|\\\\.))*[^\\1\\\\\\r\\n]*?)\\1/},21:{3:/&[\\w#]+?;/}}};8.I["2e.1d"]={k:{4S:{3:/\\/\\*[^*]*\\*+([^\\/][^*]*\\*+)*\\//},2f:{3:/(?:\\/\\/.*)|(?:[^\\\\]\\#.*)/},4V:{3:/\\\'[^\\\'\\\\]*(?:\\\\.[^\\\'\\\\]*)*\\\'/},4U:{3:/\\"[^\\"\\\\]*(?:\\\\.[^\\"\\\\]*)*\\"/},4P:{3:/\\b(?:[4O][2b][1s][1s]|[4R][4Q][2b][1P]|[5c][5v][1s][5u][1P])\\b/},5x:{3:/\\b[+-]?(\\d*\\.?\\d+|\\d+\\.?\\d*)([1r][+-]?\\d+)?\\b/},5y:{3:/\\b(?:5z|5w(?:5A|5E(?:5F(?:17|1c)|5G(?:17|1c))|17|1T|5B|5C|5D(?:17|1T|1c)|1c)|P(?:5h(?:5k|5j)|5e(?:5d|5g(?:5f|5l)|5r|E(?:5t|5s)|5n(?:5m|5p)|L(?:3X|3W)|O(?:S|3Y(?:3T|3S|3V))|3U|S(?:44|47|46)|41))|40)\\b/},1y:{3:/(?:\\$43|\\$42|\\$3R|\\$3G|\\$3F|\\$3I|\\$3H|\\$3C|\\$3B|\\$3D)\\b/},28:{3:/\\b(?:3O|3N|3P|3K|3J|3M|3L|48|4v|1N|1K|1I|4u|V|4x|4w|2t|4r|2s|4q|1z|4t|v|4s|4D|4C|4F|4E|4z|4y|4B|4A|4p|4d|2F|2F|4g|Q|4f|5|1y|7|4a|4m|4l|4o|4i|4k|x|4j|4h|4n|4b|4c|49|4e|3Q|3E|9|45|1Q|y|3Z|1D|5o|5q|4|19|5i)\\b/},2g:{3:/\\$(\\w+)/,z:\'<H V="28">$</H><H V="2g">$1</H>\'},1C:{3:/(?:\\<\\?[24][4T][24])|(?:\\<\\?)|(?:\\?\\>)/}}}',62,353,'|||exp|var|function||if|ChiliBook|return|recipe||replace||el|path||step|||steps|ingredients|||str|text|recipeName||||length|else||new|this|replacement|stepName|settings|dish|arguments||160|filter|span|recipes|document|||recipeLoaded|required|||for|replaceSpace||insidePRE|bind|class|domLink|stylesheetPath|link|stylesheetFolder||lastIndex|recipeFolder|options|perfect|chili|newline|ERROR|downPRE|while|false|aux|WARNING|js|codes|replaceNewLine|childNodes|string|selection|replaceTab|pre|settingsDef|push|elClass|getPath|stylesheet|makeDish|eE|Ll|parseInt|RegExp|typeof|source|exps|global|do|offset|code|tag|try|prevLength|aNum|null|true|catch|cook|case|createElement|mouseup|break|append|Ee|switch|replaceSpaces|escapeHTML|NOTICE|pattern|escaped|br|spaces|mix|jQuery|avalue|entity|preformatted|xml|Pp|htcom|aname|numbers|keyword|createRange|defaultReplacement|Uu|mousedown|head|php|com|variable|input|elementClass|gi|valueOf|object|chef|selectClass|elementPath|window|metaobjects|in|default|continue|css|substring|stylesheetFile|recipeFile|lastUnmatched|knowHow|Array|checkCSS|stylesheetLoading|each|matched|extends|unmatched|recipeLoading|prepareStep|unblockUI|ajaxSubmit|silverlight|jscom|unblock|block|plugin|clearFields|returnValue|fieldValue|blockUI|formSerialize|event|resetForm|ajaxForm|clearForm|fieldSerialize|href|browser|rel|type|msie|extend|selector|data|html|next|match|version|getPRE|join|lt|bit|ignoreCase|amp|attr|parents|htmlText|innerHTML|innerText|body|setData|Text|copy|clipboardData|recipeNotAvailable|alert|trim|getJSON|unavailable|indexOf|ig|recipePath|Date|_SESSION|_SERVER|php_errormsg|require_once|_GET|_FILES|_REQUEST|_POST|__METHOD__|__LINE__|and|abstract|__FILE__|__CLASS__|__FUNCTION__|require|_ENV|END|CONT|PREFIX|START|OCALSTATEDIR|IBDIR|UTPUT_HANDLER_|throw|__COMPILER_HALT_OFFSET__|VERSION|_COOKIE|GLOBALS|API|static|YSCONFDIR|HLIB_SUFFIX|array|protected|implements|print|private|exit|public|foreach|final|or|isset|old_function|list|include_once|include|php_user_filter|interface|exception|die|declare|elseif|echo|cfunction|as|const|clone|endswitch|endif|eval|endwhile|enddeclare|empty|endforeach|endfor|isNaN|NaN|jquery|Infinity|clearTimeout|setTimeout|clearInterval|setInterval|Nn|value|Rr|Tt|mlcom|Hh|string2|string1|delete|keywords|void|instanceof|content|taconite|gim|regexp|escape|constructor|parseFloat|unescape|toString|with|prototype|element|Ff|BINDIR|HP_|PATH|CONFIG_FILE_|EAR_|xor|INSTALL_DIR|EXTENSION_DIR|SCAN_DIR|MAX|INT_|unset|SIZE|use|DATADIR|XTENSION_DIR|OL|Ss|Aa|E_|number|const1|DEFAULT_INCLUDE_PATH|ALL|PARSE|STRICT|USER_|CO|MPILE_|RE_'.split('|'),0,{}))

Binary file not shown.

Before

Width:  |  Height:  |  Size: 89 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 442 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 664 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 121 B

View File

@ -1,76 +0,0 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Login Form with Email Password Link</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" media="screen" href="screen.css" />
<script type="text/javascript" src="../../lib/jquery.js"></script>
<script type="text/javascript" src="../../jquery.validate.js"></script>
<script type="text/javascript">
$(function() {
// highlight
var elements = $("input[type!='submit'], textarea, select");
elements.focus(function(){
$(this).parents('li').addClass('highlight');
});
elements.blur(function(){
$(this).parents('li').removeClass('highlight');
});
$("#forgotpassword").click(function() {
$("#password").removeClass("required");
$("#login").submit();
$("#password").addClass("required");
return false;
});
$("#login").validate()
});
</script>
</head>
<body>
<div id="page">
<div id="header">
<h1>Login</h1>
</div>
<div id="content">
<p id="status"></p>
<form action="" method="get" id="login">
<fieldset>
<legend>User details</legend>
<ul>
<li>
<label for="email"><span class="required">Email address</span></label>
<input id="email" name="email" class="text required email" type="text" />
<label for="email" class="error">This must be a valid email address</label>
</li>
<li>
<label for="password"><span class="required">Password</span></label>
<input name="password" type="password" class="text required" id="password" minlength="4" maxlength="20" />
</li>
<li>
<label class="centered info"><a id="forgotpassword" href="#">Email my password...</a></label>
</li>
</ul>
</fieldset>
<fieldset class="submit">
<input type="submit" class="button" value="Login..." />
</fieldset>
<div class="clear"></div>
</form>
</div>
</div>
</body>
</html>

View File

@ -1,457 +0,0 @@
/*******************************************************************************
********************************************************************************
**
* - GENERAL
*
* - PAGE CONTAINERS
*
* - HEADER
*
* - CONTENT
**
********************************************************************************
******************************************************************************/
/* GENERAL ------------------------------------------------------------------ */
html
{
height: 100%;
}
/* Zero default margin & padding around common elements */
body, dd, dl, dt, form, h1, h2, h3, h4, h5, h6, ul, ol, li, p
{
margin: 0;
border: none;
padding: 0;
}
body
{
height: 100%;
background-color: #333333;
background-image: url(images/bg.gif);
background-position: 0% 0;
color: #000000;
line-height: 1.5;
font-family: Arial, Helvetica, sans-serif;
font-size: 62.5%;
text-align: center;
overflow:auto;
}
a:link
{
color: #003399;
}
a:visited
{
color: #B266B2;
}
a:hover
{
text-decoration: none;
}
/* PAGE CONTAINERS ---------------------------------------------------------- */
#page
{
width: 636px;
w\idth: 600px;
min-height: 100%;
margin: 17px auto;
padding: 0 18px;
background-image: url(images/page.gif);
background-repeat: repeat-y;
text-align: left;
}
* html #page
{
height: 100%;
}
/* HEADER ------------------------------------------------------------------- */
#header
{
height: 90px;
background-color: #B2DD32;
background-image: url(images/header1.jpg);
background-repeat: repeat-x;
}
h1
{
padding: 0 35px;
font-size: 2.2em;
font-weight: normal;
line-height: 82px;
}
/* CONTENT ------------------------------------------------------------------ */
#content
{
padding: 0 25px;
}
p
{
font-size:1.1em;
margin-top: 1.5em;
}
form
{
margin-top: 1.5em;
}
/*** MASTER FORM WIDTHS - CUSTOMIZE THIS TO CHANGE THE FORM LAYOUT ***/
/*
form width: 550px
left column: 190px / 180px + 10px padding
mid column: 200px
right column: 160px
*/
form{
width:550px !important;
}
fieldset.submit
{
padding-left: 190px !important;
}
form label{
padding:0px 10px;
width: 160px;
}
form label.error,
form input.submit
{
margin-left:180px !important;
}
form fieldset fieldset label.error
{
margin-left:0px !important;
width:200px !important;
}
form .centered{
margin-left:180px !important;
width:200px !important;
}
form .text,
form .button,
form .group,
form .control,
form .submit,
form textarea,
form select
{
width: 200px !important;
}
/*** FIELDSETS AND LEGENDS ***/
form{
width:550px;
margin-bottom:25px;
clear:both;
}
form fieldset
{
margin: 0 0 1.5em 0;
padding: 0 0 10px 0px;
border: 1px solid #BFBAB0;
background-color: #F2EFE9;
background-image: url(images/fieldset_gradient.jpg);
background-repeat: repeat-x;
background-color: #fff;
background-image: url(images/fieldset-gradient-02.jpg);
background-position:bottom;
float: left;
clear: both;
width: 100%;
}
form fieldset.submit
{
padding: 0px 10px 10px 190px;
border-style: none;
background-color: transparent;
background-image: none;
float: none;
width: auto;
}
form legend
{
color: #000000;
font-size:1.3em;
font-weight: bold;
font-variant:small-caps;
margin-left: 1em;
padding:0px 5px;
}
form fieldset p{
margin:10px 0px 0px 10px;
}
/*** FORM BLOCKS ***/
form ul
{
padding:5px 10px;
list-style: none;
}
form li
{
width: 100%;
padding:5px 0px 10px 0;
border-top:1px dotted #ccc;
display:block;
float: left;
clear: left;
}
form li:first-child
{
border:none;
}
/*** FORM BLOCK ELEMENTS ***/
form label
{
padding:0px 10px;
width: 160px;
float: left;
}
form .error{
color: #c00;
}
form label.error
{
color: #c00;
font-size: 100%;
font-weight: bold;
font-variant:small-caps;
width:308px;
display: none;
margin:8px 0px 0px 180px;
padding:3px 0px 0px 5px;
border-top:1px dotted #ccc;
clear:both;
}
form label.info{
font-size: 100%;
font-weight: bold;
font-variant:small-caps;
margin:8px 0px 0px 180px;
padding:3px 0px 0px 5px;
}
form fieldset fieldset,
form .group
{
width:200px;
margin: 0;
border:none;
background:none;
float:left;
clear: none;
}
form fieldset fieldset label
{
width:auto !important;
white-space:nowrap;
padding:0px;
margin:0px;
display:block;
clear:both;
}
form label label.error{
margin-left:0px;
}
form label.centered{
padding:0px 0px;
width:200px !important;
}
/* see also the error class at the foot of the page */
form fieldset fieldset label.spaced
{
margin-bottom:3px;
}
/*** FORM ELEMENT COLUMNS ***/
.col-1,
fieldset fieldset.col-1 label
{
width:100%;
}
.col-2,
fieldset fieldset.col-2 label
{
width:50%;
}
.col-3,
fieldset fieldset.col-3 label
{
width:33%;
}
.col-4,
fieldset fieldset.col-4 label
{
width:25%;
}
/*** FORM ELEMENTS ***/
form input.submit{
margin:10px 0px 10px 180px;
padding:0px 2px;
}
form input, textarea, select,
form label
{
font-size:1.1em;
line-height:1.6em;
}
form input, textarea, select
{
font-family: Verdana, Arial, Helvetica, sans-serif;
}
form .input[type="text"],
form textarea
{
padding:1px;
}
form .input[type="radio"],
form .input[type="checkbox"]
{
margin:0px;
padding:0px;
position:relative;
top:3px;
}
/*** SUPPORTING CLASSES ***/
form label.required{
background-image:url(images/required_star.gif);
background-position:right;
background-repeat:no-repeat;
}
form span.required{
padding-right:15px;
}
form .clean
{
border:none;
}
form .info{
padding-top:0.5em;
font-size:80%;
line-height:100%;
color:#aaa;
}
form .indent{
padding:2px 20px;
width:auto !important;
white-space:nowrap;
padding-left: 25px !important;
}
form label.disabled{
color:#aaa;
}
form .highlight{
background-color:#e2e2e2;
}
.off{
display:none !important;
}
.clear{
clear:both;
}

View File

@ -1,10 +0,0 @@
<?php
$request = trim(strtolower($_REQUEST['email']));
$emails = array('glen@marketo.com', 'george@bush.gov', 'me@god.com', 'aboutface@cooper.com', 'steam@valve.com', 'bill@gates.com');
$valid = 'true';
foreach($emails as $email) {
if( strtolower($email) == $request )
$valid = 'false';
}
echo $valid;
?>

View File

@ -1,10 +0,0 @@
<?php
$request = trim(strtolower($_REQUEST['value']));
$emails = array('glen@marketo.com', 'george@bush.gov', 'me@god.com', 'aboutface@cooper.com', 'steam@valve.com', 'bill@gates.com');
$valid = 'true';
foreach($emails as $email) {
if( strtolower($email) == $request )
$valid = 'false';
}
echo $valid;
?>

View File

@ -1,35 +0,0 @@
img.png {
background-image: expression(
this.runtimeStyle.backgroundImage = "none",
this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.src + "', sizingMethod='image')",
this.src = "images/blank.gif"
);
}
.hidden {
display:none
}
div.login { width: 120px;}
div.nav-global LI,
div.nav-global LI A { display:inline !important; zoom: 1;}
div.nav-global LI A:hover,
div.nav-left li a:hover { text-decoration: none;}
div.buttonSubmit { height: 36px;}
div.buttonSubmit input { position: absolute;}
div.offerHeader {margin-left: 3px;}
#col-left { height: 340px;}
span#cancellation {
position: relative;
top: 20px;
}

Binary file not shown.

Before

Width:  |  Height:  |  Size: 137 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 2.4 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.6 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 799 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 4.4 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.1 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.6 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.3 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 2.0 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 8.2 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 3.7 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.3 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.3 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.3 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 4.6 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.6 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 793 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 845 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 234 B

View File

@ -1,247 +0,0 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/2000/REC-xhtml1-200000126/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="title" content="Subscription Signup | Marketo" />
<meta name="robots" content="index, follow" />
<meta name="description" content="Marketo Search Marketing application" />
<meta name="keywords" content="Marketo, Search Marketing" />
<meta name="language" content="en" />
<title>Subscription Signup | Marketo</title>
<link rel="shortcut icon" href="/favicon.ico" />
<script src="../../lib/jquery.js" type="text/javascript"></script>
<script src="../../jquery.validate.js" type="text/javascript"></script>
<script type="text/javascript" src="jquery.maskedinput.js"></script>
<script type="text/javascript" src="mktSignup.js"></script>
<link rel="stylesheet" type="text/css" media="screen" href="stylesheet.css" />
</head>
<body>
<!--[if lte IE 6]>
<link rel="stylesheet" type="text/css" media="all" href="ie6.css" />
<![endif]-->
<!-- start page wrapper --><div id="letterbox">
<!-- start header container -->
<div id="header-background">
<div class="nav-global-container">
<div class="login"><a href="#"><span></span>Customer Login</a></div>
<div class="logo"><a href="#"><img src="images/logo_marketo.gif" width="168" height="73" alt="Marketo" /></a></div>
<div class="nav-global">
<ul>
<li><a href="#" class="nav-g01"><span></span>Home</a></li>
<li><a href="#" class="nav-g02"><span></span>Products</a></li>
<li><a href="#" class="nav-g04"><span></span>B2B Marketing Resources</a></li>
<li><a href="#" class="nav-g05"><span></span>About Marketo</a></li>
</ul>
</div>
</div>
</div>
<!-- end header container -->
<div class="line-grey-tier"></div>
<!-- start page container 2 div-->
<div id="page-container" class="resize"><div id="page-content-inner" class="resize">
<!-- start col-main -->
<div id="col-main" class="resize" style="">
<!-- start main content -->
<div class="main-content resize">
<div class="action-container" style="display:none;"></div>
<h1>Step 1 of 2 </h1>
<p>
</p>
<br clear="all" />
<div>
<form id="profileForm" type="actionForm" action="step2.htm" method="get" >
<div class="error" style="display:none;">
<img src="images/warning.gif" alt="Warning!" width="24" height="24" style="float:left; margin: -5px 10px 0px 0px; " />
<span></span>.<br clear="all"/>
</div>
<table cellpadding="0" cellspacing="0" border="0">
<tr>
<td class="label"><label for="co_name">Company Name:</label></td>
<td class="field">
<input id="co_name" class="required" maxlength="40" name="co_name" size="20" type="text" tabindex="1" value="" />
</td>
</tr>
<tr>
<td class="label"><label for="co_url">Company URL:</label></td>
<td class="field">
<input id="co_url" class="required defaultInvalid url" maxlength="40" name="co_url" style="width:163px" type="text" tabindex="2" value="http://" />
</td>
</tr>
<tr>
<td/><td/>
</tr>
<tr>
<td class="label"><label for="first_name">First Name:</label></td>
<td class="field">
<input id="first_name" class="required" maxlength="40" name="first_name" size="20" type="text" tabindex="3" value="" />
</td>
</tr>
<tr>
<td class="label"><label for="last_name">Last Name:</label></td>
<td class="field">
<input id="last_name" class="required" maxlength="40" name="last_name" size="20" type="text" tabindex="4" value="" />
</td>
</tr>
<tr>
<td class="label"><label for="address1">Company Address:</label></td>
<td class="field">
<input maxlength="40" class="required" name="address1" size="20" type="text" tabindex="5" value="" />
</td>
</tr>
<tr>
<td class="label"></td>
<td class="field">
<input maxlength="40" name="address2" size="20" type="text" tabindex="6" value="" />
</td>
</tr>
<tr>
<td class="label"><label for="city">City:</label></td>
<td class="field">
<input maxlength="40" class="required" name="city" size="20" type="text" tabindex="7" value="" />
</td>
</tr>
<tr>
<td class="label"><label for="state">State:</label></td>
<td class="field">
<select id="state" class="required" name="state" style="margin-left: 4px;" tabindex="8">
<option value="">Choose State:</option>
<option value="AL">Alabama</option><option value="AK">Alaska</option><option value="AZ">Arizona</option><option value="AR">Arkansas</option><option value="CA">California</option><option value="CO">Colorado</option><option value="CT">Connecticut</option><option value="DE">Delaware</option><option value="FL">Florida</option><option value="GA">Georgia</option><option value="HI">Hawaii</option><option value="ID">Idaho</option><option value="IL">Illinois</option><option value="IN">Indiana</option><option value="IA">Iowa</option><option value="KS">Kansas</option><option value="KY">Kentucky</option><option value="LA">Louisiana</option><option value="ME">Maine</option><option value="MD">Maryland</option><option value="MA">Massachusetts</option><option value="MI">Michigan</option><option value="MN">Minnesota</option><option value="MS">Mississippi</option><option value="MO">Missouri</option><option value="MT">Montana</option><option value="NE">Nebraska</option><option value="NV">Nevada</option><option value="NH">New Hampshire</option><option value="NJ">New Jersey</option><option value="NM">New Mexico</option><option value="NY">New York</option><option value="NC">North Carolina</option><option value="ND">North Dakota</option><option value="OH">Ohio</option><option value="OK">Oklahoma</option><option value="OR">Oregon</option><option value="PA">Pennsylvania</option><option value="RI">Rhode Island</option><option value="SC">South Carolina</option><option value="SD">South Dakota</option><option value="TN">Tennessee</option><option value="TX">Texas</option><option value="UT">Utah</option><option value="VT">Vermont</option><option value="VA">Virginia</option><option value="WA">Washington</option><option value="WV">West Virginia</option><option value="WI">Wisconsin</option><option value="WY">Wyoming</option>
</select>
</td>
</tr>
<tr>
<td class="label"><label for="zip">Zip:</label></td>
<td class="field">
<input maxlength="10" name="zip" style="width: 100px" type="text" class="required zipcode" tabindex="9" value="" />
</td>
</tr>
<tr>
<td class="label"><label for="phone">Phone:</label></td>
<td class="field">
<input id="phone" maxlength="14" name="phone" type="text" class="required phone" tabindex="10" value="" />
</td>
</tr>
<tr>
<td colspan="2">
<h2 style="border-bottom: 1px solid #CCCCCC;">Login Information</h2>
</td>
</tr>
<tr>
<td class="label"><label for="email">Email:</label></td>
<td class="field">
<input id="email" class="required email" remote="emails.php" maxlength="40" name="email" size="20" type="text" tabindex="11" value="" />
</td>
</tr>
<tr>
<td class="label"><label for="password1">Password:</label></td>
<td class="field">
<input id="password1" class="required password" maxlength="40" name="password1" size="20" type="password" tabindex="12" value="" />
</td>
</tr>
<tr>
<td class="label"><label for="password2">Retype Password:</label></td>
<td class="field">
<input id="password2" class="required" equalTo="#password1" maxlength="40" name="password2" size="20" type="password" tabindex="13" value="" />
<div class="formError"></div>
</td>
</tr>
<tr>
<td></td>
<td>
<div class="buttonSubmit">
<span></span>
<input class="formButton" type="submit" value="Next" style="width: 140px" tabindex="14" />
</div>
</td>
</tr>
</table><br /><br />
</form>
<br clear="all"/>
</div>
</div> <!-- end main content -->
<br />
</div> <!-- end col-main -->
<!-- start left col -->
<div id="col-left" class="nav-left-back empty resize" style="position: absolute; min-height: 450px;">
<div class="col-left-header-tab" style="position: absolute;">Signup</div>
<div class="nav-left">
</div>
<div class="left-nav-callout png" style="top: 15px; margin-bottom: 100px;">
<img src="images/left-nav-callout-long.png" class="png" alt="" />
<h6>Sign Up Process</h6>
<a style="background-image: url(images/step1-24.gif); font-weight: normal; text-decoration: none; cursor: default;">Sign up with a valid credit card.</a>
<a style="background-image: url(images/step2-24.gif); font-weight: normal; text-decoration: none; cursor: default;">Connect to your Google AdWords account. You will need your AdWords Customer ID.</a>
<a style="background-image: url(images/step3-24.gif); font-weight: normal; text-decoration: none; cursor: default;">Start your 30 day trial. No payments until trial ends.</a>
</div>
<div class="footerAddress">
<b>Marketo Inc.</b><br />
1710 S. Amphlett Blvd.<br />
San Mateo, CA 94402 USA<br />
</div>
<br clear="all"/>
</div> <!-- end left col -->
</div> </div> <!-- end page container 2 divs-->
<div id="footer-container" align="center">
<div class="footer">
<ul>
<li><a href="..">Home</a></li>
<li class="line-off"><a href="step2.htm">Second step</a></li>
</ul>
</div></div>
<!-- end page wrapper -->
</div>
<script src="http://www.google-analytics.com/urchin.js" type="text/javascript">
</script>
<script type="text/javascript">
_uacct = "UA-2623402-1";
urchinTracker();
</script>
</body>
</html>

View File

@ -1,267 +0,0 @@
/*
* Copyright (c) 2007 Josh Bush (digitalbush.com)
*
* Permission is hereby granted, free of charge, to any person
* obtaining a copy of this software and associated documentation
* files (the "Software"), to deal in the Software without
* restriction, including without limitation the rights to use,
* copy, modify, merge, publish, distribute, sublicense, and/or sell
* copies of the Software, and to permit persons to whom the
* Software is furnished to do so, subject to the following
* conditions:
* The above copyright notice and this permission notice shall be
* included in all copies or substantial portions of the Software.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
* EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES
* OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
* NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT
* HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
* WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
* FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR
* OTHER DEALINGS IN THE SOFTWARE.
*/
/*
* Version: 1.1
* Release: 2007-09-08
*/
(function($) {
//Helper Functions for Caret positioning
function getCaretPosition(ctl){
var res = {begin: 0, end: 0 };
if (ctl.setSelectionRange){
res.begin = ctl.selectionStart;
res.end = ctl.selectionEnd;
}else if (document.selection && document.selection.createRange){
var range = document.selection.createRange();
res.begin = 0 - range.duplicate().moveStart('character', -100000);
res.end = res.begin + range.text.length;
}
return res;
};
function setCaretPosition(ctl, pos){
if(ctl.setSelectionRange){
ctl.focus();
ctl.setSelectionRange(pos,pos);
}else if (ctl.createTextRange){
var range = ctl.createTextRange();
range.collapse(true);
range.moveEnd('character', pos);
range.moveStart('character', pos);
range.select();
}
};
//Predefined character definitions
var charMap={
'9':"[0-9]",
'a':"[A-Za-z]",
'*':"[A-Za-z0-9]"
};
//Helper method to inject character definitions
$.mask={
addPlaceholder : function(c,r){
charMap[c]=r;
}
};
$.fn.unmask=function(){
return this.trigger("unmask");
};
//Main Method
$.fn.mask = function(mask,settings) {
settings = $.extend({
placeholder: "_",
completed: null
}, settings);
//Build Regex for format validation
var reString="^";
for(var i=0;i<mask.length;i++)
reString+=(charMap[mask.charAt(i)] || ("\\"+mask.charAt(i)));
reString+="$";
var re = new RegExp(reString);
return this.each(function(){
var input=$(this);
var buffer=new Array(mask.length);
var locked=new Array(mask.length);
//Build buffer layout from mask
for(var i=0;i<mask.length;i++){
locked[i]=charMap[mask.charAt(i)]==null;
buffer[i]=locked[i]?mask.charAt(i):settings.placeholder;
}
/*Event Bindings*/
function focusEvent(){
checkVal();
writeBuffer();
setTimeout(function(){
setCaretPosition(input[0],0);
},0);
};
input.bind("focus",focusEvent);
input.bind("blur",checkVal);
//Paste events for IE and Mozilla thanks to Kristinn Sigmundsson
if ($.browser.msie)
this.onpaste= function(){setTimeout(checkVal,0);};
else if ($.browser.mozilla)
this.addEventListener('input',checkVal,false);
var ignore=false; //Variable for ignoring control keys
function keydownEvent(e){
var pos=getCaretPosition(this);
var k = e.keyCode;
ignore=(k < 16 || (k > 16 && k < 32 ) || (k > 32 && k < 41));
//delete selection before proceeding
if((pos.begin-pos.end)!=0 && (!ignore || k==8 || k==46)){
clearBuffer(pos.begin,pos.end);
}
//backspace and delete get special treatment
if(k==8){//backspace
while(pos.begin-->=0){
if(!locked[pos.begin]){
buffer[pos.begin]=settings.placeholder;
if($.browser.opera){
//Opera won't let you cancel the backspace, so we'll let it backspace over a dummy character.
writeBuffer(pos.begin);
setCaretPosition(this,pos.begin+1);
}else{
writeBuffer();
setCaretPosition(this,pos.begin);
}
return false;
}
}
}else if(k==46){//delete
clearBuffer(pos.begin,pos.begin+1);
writeBuffer();
setCaretPosition(this,pos.begin);
return false;
}else if (k==27){
clearBuffer(0,mask.length);
writeBuffer();
setCaretPosition(this,0);
return false;
}
};
input.bind("keydown",keydownEvent);
function keypressEvent(e){
if(ignore){
ignore=false;
return;
}
e=e||window.event;
var k=e.charCode||e.keyCode||e.which;
var pos=getCaretPosition(this);
var caretPos=pos.begin;
if(e.ctrlKey || e.altKey){//Ignore
return true;
}else if ((k>=41 && k<=122) ||k==32 || k>186){//typeable characters
while(pos.begin<mask.length){
var reString=charMap[mask.charAt(pos.begin)];
var match;
if(reString){
var reChar=new RegExp(reString);
match=String.fromCharCode(k).match(reChar);
}else{//we're on a mask char, go forward and try again
pos.begin+=1;
pos.end=pos.begin;
caretPos+=1;
continue;
}
if(match)
buffer[pos.begin]=String.fromCharCode(k);
else
return false;//reject char
while(++caretPos<mask.length){//seek forward to next typable position
if(!locked[caretPos])
break;
}
break;
}
}else
return false;
writeBuffer();
if(settings.completed && caretPos>=buffer.length)
settings.completed.call(input);
else
setCaretPosition(this,caretPos);
return false;
};
input.bind("keypress",keypressEvent);
/*Helper Methods*/
function clearBuffer(start,end){
for(var i=start;i<end;i++){
if(!locked[i])
buffer[i]=settings.placeholder;
}
};
function writeBuffer(pos){
var s="";
for(var i=0;i<mask.length;i++){
s+=buffer[i];
if(i==pos)
s+=settings.placeholder;
}
input.val(s);
return s;
};
function checkVal(){
//try to place charcters where they belong
var test=input.val();
var pos=0;
for(var i=0;i<mask.length;i++){
if(!locked[i]){
while(pos++<test.length){
//Regex Test each char here.
var reChar=new RegExp(charMap[mask.charAt(i)]);
if(test.charAt(pos-1).match(reChar)){
buffer[i]=test.charAt(pos-1);
break;
}
}
}
}
var s=writeBuffer();
if(!s.match(re)){
input.val("");
clearBuffer(0,mask.length);
}
};
input.one("unmask",function(){
input.unbind("focus",focusEvent);
input.unbind("blur",checkVal);
input.unbind("keydown",keydownEvent);
input.unbind("keypress",keypressEvent);
if ($.browser.msie)
this.onpaste= null;
else if ($.browser.mozilla)
this.removeEventListener('input',checkVal,false);
});
});
};
})(jQuery);

View File

@ -1,125 +0,0 @@
$(document).ready(function(){
jQuery.validator.addMethod("password", function( value, element ) {
var result = this.optional(element) || value.length >= 6 && /\d/.test(value) && /[a-z]/i.test(value);
if (!result) {
element.value = "";
var validator = this;
setTimeout(function() {
validator.blockFocusCleanup = true;
element.focus();
validator.blockFocusCleanup = false;
}, 1);
}
return result;
}, "Your password must be at least 6 characters long and contain at least one number and one character.");
// a custom method making the default value for companyurl ("http://") invalid, without displaying the "invalid url" message
jQuery.validator.addMethod("defaultInvalid", function(value, element) {
return value != element.defaultValue;
}, "");
jQuery.validator.addMethod("billingRequired", function(value, element) {
if ($("#bill_to_co").is(":checked"))
return $(element).parents(".subTable").length;
return !this.optional(element);
}, "");
jQuery.validator.messages.required = "";
$("form").validate({
invalidHandler: function(e, validator) {
var errors = validator.numberOfInvalids();
if (errors) {
var message = errors == 1
? 'You missed 1 field. It has been highlighted below'
: 'You missed ' + errors + ' fields. They have been highlighted below';
$("div.error span").html(message);
$("div.error").show();
} else {
$("div.error").hide();
}
},
onkeyup: false,
submitHandler: function() {
$("div.error").hide();
alert("submit! use link below to go to the other step");
},
messages: {
password2: {
required: " ",
equalTo: "Please enter the same password as above"
},
email: {
required: " ",
email: "Please enter a valid email address, example: you@yourdomain.com",
remote: jQuery.validator.format("{0} is already taken, please enter a different address.")
}
},
debug:true
});
$(".resize").vjustify();
$("div.buttonSubmit").hoverClass("buttonSubmitHover");
if ($.browser.safari) {
$("body").addClass("safari");
}
$("input.phone").mask("(999) 999-9999");
$("input.zipcode").mask("99999");
var creditcard = $("#creditcard").mask("9999 9999 9999 9999");
$("#cc_type").change(
function() {
switch ($(this).val()){
case 'amex':
creditcard.unmask().mask("9999 999999 99999");
break;
default:
creditcard.unmask().mask("9999 9999 9999 9999");
break;
}
}
);
// toggle optional billing address
var subTableDiv = $("div.subTableDiv");
var toggleCheck = $("input.toggleCheck");
toggleCheck.is(":checked")
? subTableDiv.hide()
: subTableDiv.show();
$("input.toggleCheck").click(function() {
if (this.checked == true) {
subTableDiv.slideUp("medium");
$("form").valid();
} else {
subTableDiv.slideDown("medium");
}
});
});
$.fn.vjustify = function() {
var maxHeight=0;
$(".resize").css("height","auto");
this.each(function(){
if (this.offsetHeight > maxHeight) {
maxHeight = this.offsetHeight;
}
});
this.each(function(){
$(this).height(maxHeight);
if (this.offsetHeight > maxHeight) {
$(this).height((maxHeight-(this.offsetHeight-maxHeight)));
}
});
};
$.fn.hoverClass = function(classname) {
return this.hover(function() {
$(this).addClass(classname);
}, function() {
$(this).removeClass(classname);
});
};

View File

@ -1,291 +0,0 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/2000/REC-xhtml1-200000126/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="title" content="Subscription Signup | Marketo" />
<meta name="robots" content="index, follow" />
<meta name="description" content="Marketo Search Marketing application" />
<meta name="keywords" content="Marketo, Search Marketing" />
<meta name="language" content="en" />
<title>Subscription Signup | Marketo</title>
<link rel="shortcut icon" href="/favicon.ico" />
<script src="../../lib/jquery.js" type="text/javascript"></script>
<script src="../../lib/jquery.metadata.js" type="text/javascript"></script>
<script src="../../lib/jquery.ajaxQueue.js" type="text/javascript"></script>
<script src="../../lib/jquery.delegate.js" type="text/javascript"></script>
<script src="../../jquery.validate.js" type="text/javascript"></script>
<script type="text/javascript" src="jquery.maskedinput.js"></script>
<script type="text/javascript" src="mktSignup.js"></script>
<link rel="stylesheet" type="text/css" media="screen" href="stylesheet.css" />
</head>
<body>
<!--[if lte IE 6]>
<link rel="stylesheet" type="text/css" media="all" href="ie6.css" />
<![endif]-->
<!-- start page wrapper --><div id="letterbox">
<!-- start header container -->
<div id="header-background">
<div class="nav-global-container">
<div class="login"><a href="https://app.marketo.com"><span></span>Customer Login</a></div>
<div class="logo"><a href="#"><img src="images/logo_marketo.gif" width="168" height="73" alt="Marketo" /></a></div>
<div class="nav-global">
<ul>
<li><a href="#" class="nav-g01"><span></span>Home</a></li>
<li><a href="#" class="nav-g02"><span></span>Products</a></li>
<li><a href="#" class="nav-g04"><span></span>B2B Marketing Resources</a></li>
<li><a href="#" class="nav-g05"><span></span>About Marketo</a></li>
</ul>
</div>
</div>
</div>
<!-- end header container -->
<div class="line-grey-tier"></div>
<!-- start page container 2 div-->
<div id="page-container" class="resize"><div id="page-content-inner" class="resize">
<!-- start col-main -->
<div id="col-main" class="resize" style="">
<!-- start main content -->
<div class="main-content resize">
<div class="action-container" style="display:none;"></div>
<h1>Step 2 of 2</h1>
<h2>Billing Information</h2>
<p>
</p>
<br clear="all" />
<div>
<form id="billingForm" action="" method="get" >
<div class="error" style="display:none;">
<img src="images/warning.gif" alt="Warning!" width="24" height="24" style="float:left; margin: -5px 10px 0px 0px; " />
<span></span>.<br clear="all" />
</div>
<table cellpadding="0" cellspacing="0" border="0">
<tr>
<td class="label" style="vertical-align: top; padding-top: 8px;">Billing Address:</td>
<td class="field" style="font-weight: normal">
<div class="billingAddressControl">
<input type="checkbox" id="bill_to_co" name="bill_to_co" class="toggleCheck" checked="checked" style="width: auto;" tabindex="1" />
<label for="bill_to_co" style="cursor:pointer">Same as Company Address</label>
</div>
</td>
</tr>
<tr class="subTable">
<td colspan="2">
<div style="background-color: #EEEEEE; border: 1px solid #CCCCCC; padding: 10px;" class="subTableDiv">
<table cellpadding="0" cellspacing="0" border="0">
<tr>
<td class="label"><label for="bill_first_name">First Name:</label></td>
<td class="field">
<input maxlength="40" class="billingRequired" name="bill_first_name" size="20" type="text" tabindex="2" value="" />
</td>
</tr>
<tr>
<td class="label"><label for="bill_last_name">Last Name:</label></td>
<td class="field">
<input maxlength="40" class="billingRequired" name="bill_last_name" size="20" type="text" tabindex="3" value="" />
</td>
</tr>
<tr>
<td class="label"><label for="bill_email">Email:</label></td>
<td class="field">
<input maxlength="40" class="billingRequired email" remote="emails.php" name="email" size="20" type="text" tabindex="4" value="" />
<div class="formError"></div>
</td>
</tr>
<tr>
<td class="label"><label for="bill_address1">Address:</label></td>
<td class="field">
<input maxlength="40" class="billingRequired" name="bill_address1" size="20" type="text" tabindex="5" value="" />
</td>
</tr>
<tr>
<td class="label"></td>
<td class="field">
<input maxlength="40" name="bill_address2" size="20" type="text" tabindex="6" value="" />
</td>
</tr>
<tr>
<td class="label"><label for="bill_city">City:</label></td>
<td class="field">
<input maxlength="40" class="billingRequired" name="bill_city" size="20" type="text" tabindex="7" value="" />
</td>
</tr>
<tr>
<td class="label"><label for="bill_state">State:</label></td>
<td class="field">
<select id="bill_state" class="billingRequired" name="bill_state" style="margin-left: 4px;" tabindex="8">
<option value="">Choose State</option>
<option value="AL">Alabama</option><option value="AK">Alaska</option><option value="AZ">Arizona</option><option value="AR">Arkansas</option><option value="CA">California</option><option value="CO">Colorado</option><option value="CT">Connecticut</option><option value="DE">Delaware</option><option value="FL">Florida</option><option value="GA">Georgia</option><option value="HI">Hawaii</option><option value="ID">Idaho</option><option value="IL">Illinois</option><option value="IN">Indiana</option><option value="IA">Iowa</option><option value="KS">Kansas</option><option value="KY">Kentucky</option><option value="LA">Louisiana</option><option value="ME">Maine</option><option value="MD">Maryland</option><option value="MA">Massachusetts</option><option value="MI">Michigan</option><option value="MN">Minnesota</option><option value="MS">Mississippi</option><option value="MO">Missouri</option><option value="MT">Montana</option><option value="NE">Nebraska</option><option value="NV">Nevada</option><option value="NH">New Hampshire</option><option value="NJ">New Jersey</option><option value="NM">New Mexico</option><option value="NY">New York</option><option value="NC">North Carolina</option><option value="ND">North Dakota</option><option value="OH">Ohio</option><option value="OK">Oklahoma</option><option value="OR">Oregon</option><option value="PA">Pennsylvania</option><option value="RI">Rhode Island</option><option value="SC">South Carolina</option><option value="SD">South Dakota</option><option value="TN">Tennessee</option><option value="TX">Texas</option><option value="UT">Utah</option><option value="VT">Vermont</option><option value="VA">Virginia</option><option value="WA">Washington</option><option value="WV">West Virginia</option><option value="WI">Wisconsin</option><option value="WY">Wyoming</option>
</select>
</td>
</tr>
<tr>
<td class="label"><label for="bill_zip">Zip:</label></td>
<td class="field">
<input maxlength="10" class="billingRequired zipcode" name="bill_zip" style="width: 100px" type="text" class="zipcode" tabindex="9" value="" />
</td>
</tr>
<tr>
<td class="label"><label for="bill_phone">Phone:</label></td>
<td class="field">
<input maxlength="14" class="billingRequired phone" name="bill_phone" style="width: 100px" type="text" class="phone" tabindex="10" value="" />
</td>
</tr>
</table>
</div>
</td>
</tr>
<tr>
<td class="label">Credit Card Type:</td>
<td class="field">
<select id="cc_type" class="required" name="cc_type" class="creditCardType" tabindex="11">
<option value="">Choose Credit Card</option>
<option value="amex">American Express</option>
<option value="discover">Discover</option>
<option value="mastercard">MasterCard</option>
<option value="visa">Visa</option>
</select>
</td>
</tr>
<tr>
<td class="label">Expiration:</td>
<td class="field">
<select id="cc_exp_month" name="cc_exp_month" title="ExpirationMonth" tabindex="12">
<option value="01">01 - Jan</option>
<option value="02">02 - Feb</option>
<option value="03">03 - Mar</option>
<option value="04">04 - Apr</option>
<option value="05">05 - May</option>
<option value="06">06 - Jun</option>
<option value="07">07 - Jul</option>
<option value="08">08 - Aug</option>
<option value="09">09 - Sep</option>
<option value="10">10 - Oct</option>
<option value="11">11 - Nov</option>
<option value="12">12 - Dec</option>
</select>
<select id="cc_exp_year" name="cc_exp_year" title="ExpirationYear" tabindex="13">
<option value="2007">2007</option>
<option value="2008" selected="selected">2008</option>
<option value="2009">2009</option>
<option value="2010">2010</option>
<option value="2011">2011</option>
<option value="2012">2012</option>
<option value="2013">2013</option>
<option value="2014">2014</option>
<option value="2015">2015</option>
<option value="2016">2016</option>
</select>
</td>
</tr>
<tr>
<td class="label"><label for="credit_card">Credit Card Number:</label></td>
<td class="field">
<input maxlength="40" id="creditcard" class="required" name="credit_card" size="20" type="text" tabindex="14" />
</td>
</tr>
<tr>
<td class="label"><label for="cc_cvv">Security Code:</label></td>
<td class="field">
<input id="ccNumber" class="required" maxlength="4" name="cc_cvv" style="width: 30px;" type="text" style="vertical-align: top;" tabindex="16" value="" />
</td>
</tr>
<tr>
<td></td>
<td>
<div class="buttonSubmit">
<span></span>
<input class="formButton" type="submit" value="Finish" style="width: 180px" />
</div><br clear="all"/>
</td>
</tr>
</table>
</form>
<br clear="all" />
</div>
</div> <!-- end main content -->
<br />
</div> <!-- end col-main -->
<!-- start left col -->
<div id="col-left" class="nav-left-back empty resize" style="position: absolute; min-height: 450px;">
<div class="col-left-header-tab" style="position: absolute;">Signup</div>
<div class="nav-left">
</div>
<div class="left-nav-callout png" style="top: 15px; margin-bottom: 100px;">
<img src="images/left-nav-callout-long.png" class="png" alt="" />
<h6>Sign Up Process</h6>
<a style="background-image: url(images/step1-24.gif); font-weight: normal; text-decoration: none; cursor: default;">Sign up with a valid credit card.</a>
<a style="background-image: url(images/step2-24.gif); font-weight: normal; text-decoration: none; cursor: default;">Connect to your Google AdWords account. You will need your AdWords Customer ID.</a>
<a target="_blank" style="background-image: url(images/step3-24.gif); font-weight: normal; text-decoration: none; cursor: default;">Start your 30 day trial. No payments until trial ends.</a>
</div>
<div class="footerAddress">
<b>Marketo Inc.</b><br />
1710 S. Amphlett Blvd.<br />
San Mateo, CA 94402 USA<br />
</div>
<br clear="all"/>
</div> <!-- end left col -->
</div> </div> <!-- end page container 2 divs-->
<div id="footer-container" align="center">
<div class="footer">
<ul>
<li><a href="..">Home</a></li>
<li class="line-off"><a href=".">Back to first step</a></li>
</ul>
</div></div>
<!-- end page wrapper -->
</div>
<script src="http://www.google-analytics.com/urchin.js" type="text/javascript">
</script>
<script type="text/javascript">
_uacct = "UA-2623402-1";
urchinTracker();
</script>
</body>
</html>

View File

@ -1,1179 +0,0 @@
:-moz-any-link :focus {
outline: none;
}
:focus {
-moz-outline-style: none;
outline: none;
}
body {
font-size: 80%;
margin: 0;
padding: 0;
font-family: tahoma, geneva, sans-serif;
background-color: #000000;
}
a {
color: #0653AB;
outline: 0px;
text-decoration: none;
}
a:hover {
outline: 0px;
text-decoration: underline;
}
img {
border: 0px;
}
/* s1.0 - Page Containers */
#letterbox {
margin: 10px auto;
width: 883px;
background-color: #364158;
border: 8px solid #D4D4D4;
padding: 1px 1px 10px 1px;
}
#header-background {
background: url(images/back_nav_blue.gif) repeat-x;
margin: 0px auto;
padding: 0px;
height: 73px;
width: 883px;
border-top: 4px solid #CCEAFE;
border-bottom: 4px solid #D4D4D4;
}
#page-container {
width: 866px;
margin: 0px auto;
margin-top: 33px; /* pad from top menu to actions buts*/
margin-bottom: -11px;
padding-top: 8px;
padding-bottom: 8px;
background-color: #D4D4D4; /* light grey*/
border-right: 1px solid #464646;
}
#page-content-inner {
width: 849px;
margin: 0px auto;
border-top: 1px solid #9F9FA0;
border-left: 1px solid #A2A09A;
background-color: #F4F1E9;
position: relative;
}
#page-content-inner #col-left {
width: 210px;
float: left;
background-color: #F4F1E9;
}
#page-content-inner #col-main {
width: 639px;
background-color: #ffffff;
position: absolute;
right: 0px;
top: 0px;
}
#footer-container {
width: 866px;
position: relative;
left: 8px;
padding: 2px 0px 10px 0px;
background-color: #D4D4D4; /* light grey*/
}
/* s2.0 - Global navigation bar */
.nav-global-container {
width: 880px;
margin: 0px auto;
position: relative;
}
* html .nav-global-container { /* ie6 fix*/
margin-bottom: -6px;
}
.login {
position: absolute;
right: 20px;
text-align: center;
}
.login a,.login a span {
display: block;
height: 18px;
font-size: 11px;
background: url(images/login-sprite.gif) right -5px no-repeat;
text-decoration: none;
font-weight: bold;
padding: 5px 10px 5px 10px;
position: relative;
}
.login a:hover {
color: #000000;
text-decoration: underline;
}
div.login a span {
background-position: left -105px;
width: 4px;
position: absolute;
top: 0px;
left: 0px;
padding: 5px 0px 5px 0px;;
}
div.login a:hover span {
}
.logo {
float: left;
margin: 0px 0px -5px 0px; /* neg marging for ie6 */
}
.logo img {
border: 0px;
margin-left: -1px;
}
.nav-global {
float: left;
width: 645px;
margin: 40px 0px 0px 40px;
background-color: transparent;
}
.nav-global ul {
margin: 0px;
padding: 0px;
list-style: none;
}
.nav-global li {
float: left;
white-space: nowrap;
}
div.nav-global li a,div.nav-global li a span {
background-image: url(images/tab-sprite.gif);
background-position: right 100px;
background-repeat: no-repeat;
height: 32px;
color: #666666;
text-decoration: none;
font: bold 16px 'trebuchet ms';
margin-right: 15px;
display: block;
position: relative;
padding: 7px 15px 0px 15px;
}
div.nav-global li a:hover {
background-position: right 0px;
color: #333333;
}
div.nav-global li a:hover span {
background-position: left -100px;
display: block !important;
}
div.nav-global li a span {
background-position: left 150px;
width: 4px;
position: absolute;
left: 0px;
top: 0px;
padding: 7px 0px 0px 0px;
}
body.safari div.nav-global li a span {
display: none;
}
div.nav-global li a.on,div.nav-global li a.on:hover {
background-position: right -55px;
color: #FFFFFF;
}
div.nav-global li a.on span,div.nav-global li a.on:hover span {
background-position: left -155px;
display: block !important;
}
div.action-container {
position: relative;
top: -45px;
cursor: pointer;
}
div.action-icon-container {
position: absolute;
top: -17px;
left: -17px;
z-index: 10;
width: 100px;
height: 100px;
overflow: hidden;
}
div.action-icon {
border: 0px;
position: absolute;
top: -0px;
left: 0px;
}
div.action-button-container {
height: 106px;
width: 180px;
overflow: hidden;
position: absolute;
top: 0px;
left: 0px;
z-index: 5;
}
img.action-icon {
border: 0px;
position: absolute;
top: 0px;
left: 0px;
z-index: 0
}
div.action-text {
z-index: 20;
color: #FFFFFF;
position: absolute;
left: 40px;
top: 12px;
font: 14px tahoma, geneva;
padding-top: 30px;
}
div.bigbuttons {
top: -20px;
}
div.action-header {
z-index: 21;
position: absolute;
left: 40px;
top: 10px;
}
div.action-header b {
font: bold 17px tahoma, geneva;
display: block;
margin-bottom: 10px;
color: #0b2c89;
position: absolute;
top: 0px;
left: 0px;
width: 130px;
}
div.action-header b.shadow {
top: 1px;
left: 1px;
color: #d5d5d5;
}
img.action-button {
position: relative;
}
div.hover img.action-button {
top: -131px;
}
div.on img.action-button {
top: -261px;
}
/* s3.0 - top of content Action Buttons */
.action-buttons {
width: 100%; /* ie6 requires */
}
.action-buttons ul {
position: relative;
padding: 0px;
}
.action-buttons li {
position: relative; /* ie6 fix */
float: left;
list-style: none;
text-align: center;
line-height: 16px;
margin: -61px 0px 0px 0px;
}
.action-home li {
margin: -49px 0px 0px 0px;
}
.action-buttons a {
display: block;
height: 110px;
width: 175px;
padding: 14px 0px 0px 25px;
text-decoration: none;
font-size: 12px;
font-weight: bold;
color: #ffffff;
}
.action-buttons li span {
color: #053880;
line-height: 47px;
font-size: 17px;
}
div.action-bottom {
margin: 15px 0px 10px 0px;
float: left;
}
div.action-bottom a {
height: 61px;
width: 178px;
border: 0px;
background: url(images/action-bottom.gif) no-repeat 0px 0px;
color: #0b2c89;
float: left;
position: relative;
font: bold 17px tahoma, geneva;
text-decoration: none;
margin-right: 10px;
}
div.action-bottom a span {
position: absolute;
top: 15px;
left: 40px;
}
div.action-bottom a span.shadow {
top: 16px;
left: 41px;
color: #d4d4d4;
}
.line-grey {
background: url(images/line-grey.gif) 0 0 repeat-x;
height: 2px;
margin: 8px 25px 20px 0;
}
/* s4.0 - Home Hero Area */
.hero-background {
position: relative;
width: 880px;
background: url(images/back_home-hero.jpg) 10px 0px no-repeat;
height: 211px;
margin: -20px 0px 45px 0px;
}
.hero-text {
float: right;
width: 626px;
margin-top: 26px;
}
.hero-text a { /* Sign Up Now Button */
padding: 5px 32px 0px 0px;
float: right;
}
.hero-text h1 {
font-size: 2.3em;
line-height: 1.2em;
color: #333333;
font-family: Trebuchet MS;
margin: 12px 0px 10px 10px;
}
.hero-text h2 {
margin: 0px;
font-weight: normal;
font-size: 1.35em;
margin: 5px 0px 13px 10px
}
/* s4.1 - Home Left Header tab */
.col-left-header-tab {
position: relative; /* ie6 fix */
background: url(images/tab_green.gif) 0 0 no-repeat;
height: 30px;
width: 166px;
text-align: center;
color: #ffffff;
font: 20px 'trebuchet ms';
padding-top: 2px;
margin-top: -41px;
margin-left: 20px;
line-height: 29px;
margin-bottom: 8px;
display: block;
}
.col-left-header-tab a {
color: #FFFFFF;
}
.callout-green {
background: url(images/back_green-fade.gif) 0 0 repeat-x;
font-size: 1.2em;
padding: 10px 15px 20px 13px;
color: #303B52;
line-height: 1.4em;
}
/* s4.2 - Home Left Quote */
.callout-tan {
color: #666666;
}
.callout-tan h1 {
background: #F4F1E9 url(images/back_tan-fade.gif) 0 0 repeat-y;
font-size: 1.1em;
text-align: center;
margin: 0px;
padding: 11px 5px 11px 2px;
color: #333333;
}
.callout-tan p {
margin: 0px;
margin-top: 5px;
line-height: 1.4em;
padding: 5px 10px 7px 13px;
}
.callout-tan p img {
float: left;
margin: 5px 10px 5px 0px;
}
.callout-tan div {
text-align: left;
padding: 5px 10px 7px 0px;
font-weight: bold;
}
/* s4.3 - purple home boxes */
.box-purple {
background: #C6C8E3 url(images/back_home-icons.png) 0px 0px repeat-x;
border-left: 1px solid #ffffff;
color: #333333;
width: 581px;
padding: 10px 15px 20px 15px;
}
div.box-purple a {
}
.box-purple h1 {
font-size: 1.5em;
margin: 10px 0px -15px 0px;
}
.box-purple li {
margin: 0px 0px 0px -23px;
line-height: 1.6em;
font-size: 1em;
}
.box-purple div {
padding: 0px 0px 0px 110px;
}
.icon-text01 {
background-image: url(images/icon_search-engine-market.png);
background-repeat: no-repeat;
}
* html .icon-text01 {
width: 460px; /* must have a width or heigh tag for ie6*/
background-image: none;
filter: progid : DXImageTransform . Microsoft .
AlphaImageLoader(src = "images/icon_search-engine-market.png",
sizingMethod = "crop");
}
.icon-text02 {
background: url(images/icon_landing-pages.png) 0 0 no-repeat;
}
* html .icon-text02 {
width: 460px; /* must have a width or heigh tag for ie6*/
background-image: none;
filter: progid : DXImageTransform . Microsoft .
AlphaImageLoader(src = "images/icon_landing-pages.png", sizingMethod =
"crop");
}
.icon-text03 {
background: url(images/icon_salesforce.png) 0 0 no-repeat;
}
* html .icon-text03 {
width: 460px; /* must have a width or heigh tag for ie6*/
background-image: none;
filter: progid : DXImageTransform . Microsoft .
AlphaImageLoader(src = "images/icon_salesforce.png", sizingMethod =
"crop");
}
/* s4.4 - news home boxes */
.callout-news {
color: #555555;
float: left;
width: 49%;
margin: 10px 1px 0px 0px;
padding-bottom: 20px;
text-align: left;
}
.line-news-r {
border-right: 1px solid #D4D4D4;
}
.callout-news h1 {
background-color: #EEEEEE;
font-size: 1.2em;
margin: 0px;
padding: 11px 5px 11px 15px;
color: #333333;
}
.callout-news p {
margin: 10px 0px 0px 10px;
padding: 0px 10px 7px 20px;
background: url(images/news.gif) no-repeat left 1px;
}
.callout-news p a {
}
.callout-news ul {
list-style-type: none;
padding: 0;
margin: 10px 0 0 10px;
}
.callout-news li {
background: url(images/icon_news.gif) no-repeat left 2px;
padding: 0px 5px 5px 20px;
}
.callout-news li a {
display: block;
margin-bottom: 5px;
}
.callout-news div {
text-align: right;
}
#scrollup {
position: relative;
overflow: hidden;
height: 440px;
width: 200px
}
.headline {
position: absolute;
top: 600px;
left: 5px;
height: 585px;
width: 190px;
font: normal 12px tahoma, geneva !important;
}
div.more {
margin: 5px 0px 0px 0px;
padding: 0px 10px 0px 0px;
letter-spacing: inherit;
}
div.more a {
background: transparent url(images/arrow_r-blue.gif) no-repeat right 2px
;
font-weight: bold;
padding: 0px 20px 0px 0px;
font-weight: bold;
text-decoration: none;
}
div.more a:hover {
text-decoration: underline;
}
/* sX.0 - Left Nav */
.nav-left-back {
background: url(images/back_nav_side.gif) 0 0 repeat-x;
}
div.empty {
background: #F1F0E5 url(images/back_green-fade.gif) 0 0 repeat-x;
}
div.empty div.callout-green {
}
.nav-left {
padding-top: 12px;
/*background: url(images/logo_marketo_square.gif) 0 0 no-repeat;*/
width: 210px;
}
.nav-left ul {
margin: 0px;
padding: 0px;
list-style: none;
}
.nav-left li a {
display: block;
height: 24px;
text-decoration: none;
font-size: 12px;
font-weight: bold;
color: #ffffff;
border-top: 1px solid #B3D38D;
border-bottom: 1px solid #7CA84E;
border-left: 1px solid #97B973;
padding: 6px 0px 0px 20px;
}
.nav-left a:hover,.nav-left a.active:hover,#nav-left-sub a:hover {
color: #4C6F28;
background-color: #F4F1E9;
}
.nav-left a.open {
background-image: url(images/arrow_d-green.gif);
background-repeat: no-repeat;
background-position: 6px 11px;
}
.nav-left-header-tab {
position: relative; /* ie6 fix */
background: url(images/tab_green.gif) 0 0 no-repeat;
height: 32px;
width: 166px;
text-align: center;
color: #ffffff;
margin: -41px 0px 0px 22px;
line-height: 22px;
margin-bottom: 8px;
display: block;
}
div.empty div.nav-left-header-tab {
background: url(images/tab_green2.gif) 0 0 no-repeat;
}
.nav-left a.active {
/* background: url(images/arrow_d-green.gif) 5px 10px no-repeat; */
display: block;
height: 24px;
text-decoration: none;
font-size: 12px;
font-weight: bold;
background-color: #F4F1E9;
color: #4C6F28;
border-top: 1px solid #D1E5BB;
border-bottom: 1px solid #B0CB95;
border-left: 1px solid #DADADA;
padding: 6px 0px 0px 20px;
}
#nav-left-sub a {
display: block;
height: 24px;
text-decoration: none;
font-size: 12px;
font-weight: bold;
background-color: #D6E8C4;
color: #4C6F28;
border-top: 1px solid #D6E8C4;
border-bottom: 1px solid #B0CB95;
border-left: 1px solid #97B973;
border-right: 1px solid #8DBE5A;
padding: 6px 0px 0px 30px;
}
* html #nav-left-sub { /* ie6 fix */
margin-top: -1px;
}
*+html #nav-left-sub { /* ie7 fix */
margin-top: -1px;
}
#nav-left-sub a.active-page {
display: block;
height: 24px;
text-decoration: none;
font-size: 12px;
font-weight: bold;
background-color: #ffffff;
color: #666666;
border-top: 0px solid #7CA84E;
border-bottom: 1px solid #B0CB95;
border-left: 1px solid #97B973;
border-right: 0px solid #8DBE5A;
padding: 6px 0px 0px 30px;
cursor: default; /* turns off hand icon for link */
}
/* sX.0 - Main Content */
.main-content {
color: #666666;
position: absolute;
right: 20px;
padding-top: 20px;
width: 585px;
padding-bottom: 20px;
}
div.main-content div.main-content {
}
.main-content h1 {
color: #5890D1;
font-size: 1.9em;
font-family: Trebuchet MS;
border-bottom: 1px solid #cccccc;
margin: 0px 10px 0px 0px;
}
.main-content h2 {
color: #666666;
font-size: 1.3em;
font-weight: normal;
margin: 10px 10px 5px 0px;
}
.main-content p {
margin: 10px 10px 10px 0px;
line-height: 1.55em;
}
/* sX.1 - Main Content Sub Styles */
.sub-grey {
border-top: 1px solid #D4D4D4;
border-bottom: 1px solid #D4D4D4;
background-color: #F4F4F4;
margin: 10px 10px 0px 0px;
padding: 0px 10px 20px 15px;
}
.sub-white {
margin: 10px 10px 0px 0px;
padding: 0px 10px 20px 15px;
}
img.screen-grab-r {
margin-right: -8px;
text-align: right;
padding: 0px 0px 0px 10px;
}
div.main-content a.screenshot {
float: right;
padding: 10px 10px 0px 0px
}
.content-foot {
border-top: 1px solid #D4D4D4;
font-size: .9em;
line-height: 1.45em;
margin: 10px 20px 0px 0px;
padding: 10px 10px 30px 0px;
}
div.main-content ul {
position: relative;
left: -25px;
}
div.main-content li {
margin-bottom: 5px;
list-style-type: disc
}
div.main-content li a {
color: #6A6CB0;
}
/* sX.0 - Footer */
div.footer {
color: #666666;
font-size: .85em;
font-weight: normal;
height: 18px;
margin: 0px auto;
font-family: Tahoma, Geneva, sans-serif;
margin-top: 10px;
}
.footer ul {
list-style-type: none;
}
.footer li {
float: left;
border-right: 1px solid #666666;
padding: 0px 7px 0px 7px;
margin-top: 3px;
}
.footer a {
color: #666666;
text-decoration: none;
}
.footer a:hover {
color: #0653AB;
text-decoration: none;
}
.footer li.line-off {
border-right: 0px solid #ffffff;
}
div.footer strong {
font-weight: normal;
}
/* sX.0 - General Colors */
.line-grey,.line-grey-tier {
border-top: 1px solid #A3A3A2;
}
.line-grey-tier {
padding-bottom: 25px;
}
.bottom {
height: 10px;
}
div.p10bottom {
padding-bottom: 10px;
}
.clear {
clear: both;
}
table.grid {
background: #EEEEEE;
}
table.grid th {
background-color: #F4F4F4;
}
table.grid td {
background-color: #FFFFFF;
}
div.buttonSubmit {
position: relative;
}
div.buttonSubmit input,div.buttonSubmit span {
height: 36px;
position: relative;
background-image: url(images/button-submit.gif);
background-repeat: no-repeat;
background-position: right 0px;
float: left;
color: #FFFFFF;
font-weight: bold;
padding: 0px 15px 2px 15px;
margin: 20px 0px 20px 0px;
border: 0px;
cursor: pointer;
z-index: 5;
}
div.buttonSubmit input {
width: auto;
}
div.buttonSubmit span {
width: 4px;
position: absolute;
left: 0px;
top: 0px;
background-position: left -36px;
padding: 0px 0px 0px 0px;
z-index: 10;
}
body.safari div.buttonSubmit span {
display: none
}
div.buttonSubmitHover input {
background-position: right -72px;
}
div.buttonSubmitHover span {
background-position: left -108px;
}
a.demoLink {
padding: 1px 10px 0px 17px;
height: 24px;
background: url(images/bullet_triangle_blue.gif) no-repeat 0px 4px;
display: block;
float: left;
}
div.callout-tan a {
background: none;
color: #0653AB;
margin: auto;
display: block;
}
div.callout-tan a:hover {
background: none;
color: #0653AB;
}
label.error {
display: block;
color: red;
font-style: italic;
font-weight: normal;
}
input.error {
border: 2px solid red;
}
p.demoBlock {
border-bottom: 1px solid #DDDDDD;
padding-bottom: 10px;
}
div.left-nav-callout {
height: 200px;
width: 190px;
top: 55px;
left: 5px;
position: relative;
padding-left: 9px;
padding-top: 13px;
}
div.left-nav-callout img.png {
position: absolute;
z-index: 0;
top: 0px;
left: 0px;
}
div.left-nav-callout h6 {
font: bold 14px tahoma, geneva;
color: #333333;
height: 36px;
padding-left: 5px;
margin: 0px;
position: relative;
z-index: 10;
}
div.left-nav-callout a {
background: url(images/monitor24.gif) no-repeat 0px center;
padding: 5px 0px 5px 30px;
display: block;
font: bold 12px tahoma, geneva;
color: #336699;
margin-bottom: 5px;
position: relative;
z-index: 10;
width: 140px;
}
form table td {
padding: 5px;
}
form table input {
width: 200px;
padding: 3px;
margin: 0px;
}
textarea {
width: 400px
}
td.label {
width: 150px;
}
tr.required td.label {
font-weight: bold;
background: url(/images/forms/backRequiredGray.gif) no-repeat right
center;
}
div.subTableDiv {
width: 500px;
}
div.subTableDiv td.label {
width: 135px;
}
ul#homeBlog li div.description {
display: none;
}
td.field input.error, td.field select.error, tr.errorRow td.field input,tr.errorRow td.field select {
border: 2px solid red;
background-color: #FFFFD5;
margin: 0px;
color: red;
}
tr td.field div.formError {
display: none;
color: #FF0000;
}
tr.errorRow td.field div.formError {
display: block;
font-weight: normal;
}
div.error {
color: red;
}
div.error a {
color: #336699;
font-size: 12px;
text-decoration: underline
}
div.tooltip {
position: absolute;
left: 30px;
bottom: 0px;
display: none; /* in case javascript is disabled */
width: 170px;
background-color: #F4F1E9;
z-index: 100;
padding: 10px;
border: 1px solid #CCCCCC;
}
div.offerbox {
width: 125px;
float: left;
position: relative;
}
div.offerbox h3 {
font: bold 17px tahoma, geneva;
color: #333333;
height: 55px;
margin: 0px auto;
text-align: center;
}
div.offerbox h4 {
height: 100px;
font: normal 13px tahoma, geneva;
margin: 0px;
}
div.offerbox h5 {
font: bold 14px tahoma, geneva;
margin: 0px;
height: 55px;
}
div.offerbox h5 small {
float: left;
font-weight: normal;
font-size: 10px;
}
div.offerbox div.learnmore {
padding-left: 25px;
}
div#marketoEditions {
background: url(images/buynowBack.gif) no-repeat;
width: 584px;
height: 376px;
float: left;
position: relative;
margin-bottom: 10px;
}
div.offerHeader {
background: #0D8BBD;
position: absolute;
top: 20px;
width: 266px;
height: 34px;
border: 1px solid #e1e4e2;
}
div.offerHeader span {
font: 20px 'trebuchet ms';
color: #FFFFFF;
position: absolute;
left: 0px;
top: 0px;
}
div.offerHeader span.shadow {
font: 20px 'trebuchet ms';
color: #333333;
position: absolute;
}
div.offerbox div.buttonSubmit {
margin: 5px 0px 0px 10px;
}
div.footerAddress {
position: absolute;
bottom: 30px;
left: 20px;
color: #666666;
font-size: 11px;
display: none;
}

Binary file not shown.

Before

Width:  |  Height:  |  Size: 73 B

View File

@ -1,10 +0,0 @@
<?php
$request = trim(strtolower($_REQUEST['email']));
$emails = array('glen@marketo.com', 'george@bush.gov', 'me@god.com', 'aboutface@cooper.com', 'steam@valve.com', 'bill@gates.com');
$valid = 'true';
foreach($emails as $email) {
if( strtolower($email) == $request )
$valid = '"Thats already taken."';
}
echo $valid;
?>

View File

@ -1,10 +0,0 @@
<?php
$request = trim(strtolower($_REQUEST['value']));
$emails = array('glen@marketo.com', 'george@bush.gov', 'me@god.com', 'aboutface@cooper.com', 'steam@valve.com', 'bill@gates.com');
$valid = 'true';
foreach($emails as $email) {
if( strtolower($email) == $request )
$valid = 'false';
}
echo $valid;
?>

View File

@ -1,235 +0,0 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title>Remember The Milk signup form - jQuery Validate plugin demo - with friendly permission from the RTM team</title>
<link rel="stylesheet" type="text/css" media="screen" href="milk.css" />
<link rel="stylesheet" type="text/css" media="screen" href="../css/chili.css" />
<script src="../../lib/jquery.js" type="text/javascript"></script>
<script src="../../jquery.validate.js" type="text/javascript"></script>
<style type="text/css">
pre { text-align: left; }
</style>
<script id="demo" type="text/javascript">
$(document).ready(function() {
// validate signup form on keyup and submit
var validator = $("#signupform").validate({
rules: {
firstname: "required",
lastname: "required",
username: {
required: true,
minlength: 2,
remote: "users.php"
},
password: {
required: true,
minlength: 5
},
password_confirm: {
required: true,
minlength: 5,
equalTo: "#password"
},
email: {
required: true,
email: true,
remote: "emails.php"
},
dateformat: "required",
terms: "required"
},
messages: {
firstname: "Enter your firstname",
lastname: "Enter your lastname",
username: {
required: "Enter a username",
minlength: jQuery.format("Enter at least {0} characters"),
remote: jQuery.format("{0} is already in use")
},
password: {
required: "Provide a password",
rangelength: jQuery.format("Enter at least {0} characters")
},
password_confirm: {
required: "Repeat your password",
minlength: jQuery.format("Enter at least {0} characters"),
equalTo: "Enter the same password as above"
},
email: {
required: "Please enter a valid email address",
minlength: "Please enter a valid email address",
remote: jQuery.format("{0} is already in use")
},
dateformat: "Choose your preferred dateformat",
terms: " "
},
// the errorPlacement has to take the table layout into account
errorPlacement: function(error, element) {
if ( element.is(":radio") )
error.appendTo( element.parent().next().next() );
else if ( element.is(":checkbox") )
error.appendTo ( element.next() );
else
error.appendTo( element.parent().next() );
},
// specifying a submitHandler prevents the default submit, good for the demo
submitHandler: function() {
alert("submitted!");
},
// set this class to error-labels to indicate valid fields
success: function(label) {
// set &nbsp; as text for IE
label.html("&nbsp;").addClass("checked");
}
});
// propose username by combining first- and lastname
$("#username").focus(function() {
var firstname = $("#firstname").val();
var lastname = $("#lastname").val();
if(firstname && lastname && !this.value) {
this.value = firstname + "." + lastname;
}
});
});
</script>
</head>
<body>
<h1 id="banner"><a href="http://bassistance.de/jquery-plugins/jquery-plugin-validation/">jQuery Validation Plugin</a> Demo</h1>
<div id="main">
<div id="content">
<div id="header">
<div id="headerlogo"><img src="milk.png" alt="Remember The Milk" /></div>
</div>
<div style="clear: both;"><div></div></div>
<div class="content">
<div id="signupbox">
<div id="signuptab">
<ul>
<li id="signupcurrent"><a href=" ">Signup</a></li>
</ul>
</div>
<div id="signupwrap">
<form id="signupform" autocomplete="off" method="get" action="">
<table>
<tr>
<td class="label"><label id="lfirstname" for="firstname">First Name</label></td>
<td class="field"><input id="firstname" name="firstname" type="text" value="" maxlength="100" /></td>
<td class="status"></td>
</tr>
<tr>
<td class="label"><label id="llastname" for="lastname">Last Name</label></td>
<td class="field"><input id="lastname" name="lastname" type="text" value="" maxlength="100" /></td>
<td class="status"></td>
</tr>
<tr>
<td class="label"><label id="lusername" for="username">Username</label></td>
<td class="field"><input id="username" name="username" type="text" value="" maxlength="50" /></td>
<td class="status"></td>
</tr>
<tr>
<td class="label"><label id="lpassword" for="password">Password</label></td>
<td class="field"><input id="password" name="password" type="password" maxlength="50" value="" /></td>
<td class="status"></td>
</tr>
<tr>
<td class="label"><label id="lpassword_confirm" for="password_confirm">Confirm Password</label></td>
<td class="field"><input id="password_confirm" name="password_confirm" type="password" maxlength="50" value="" /></td>
<td class="status"></td>
</tr>
<tr>
<td class="label"><label id="lemail" for="email">Email Address</label></td>
<td class="field"><input id="email" name="email" type="text" value="" maxlength="150" /></td>
<td class="status"></td>
</tr>
<tr>
<td class="label"><label>Which Looks Right</label></td>
<td class="field" colspan="2" style="vertical-align: top; padding-top: 2px;">
<table>
<tbody>
<tr>
<td style="padding-right: 5px;">
<input id="dateformat_eu" name="dateformat" type="radio" value="0" />
<label id="ldateformat_eu" for="dateformat_eu">14/02/07</label>
</td>
<td style="padding-left: 5px;">
<input id="dateformat_am" name="dateformat" type="radio" value="1" />
<label id="ldateformat_am" for="dateformat_am">02/14/07</label>
</td>
<td>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
<td class="label">&nbsp;</td>
<td class="field" colspan="2">
<div id="termswrap">
<input id="terms" type="checkbox" name="terms" />
<label id="lterms" for="terms">I have read and accept the Terms of Use.</label>
</div> <!-- /termswrap -->
</td>
</tr>
<tr>
<td class="label"><label id="lsignupsubmit" for="signupsubmit">Signup</label></td>
<td class="field" colspan="2">
<input id="signupsubmit" name="signup" type="submit" value="Signup" />
</td>
</tr>
</table>
</form>
</div>
</div>
</div>
</div>
</div>
<script src="http://www.google-analytics.com/urchin.js" type="text/javascript">
</script>
<script type="text/javascript">
_uacct = "UA-2623402-1";
urchinTracker();
</script>
<script type="text/javascript">
$(document).ready(function() {
$("<a href='#'>Show script used on this page</a><br/>").appendTo("body").click(function() {
script.toggle();
return false;
});
$("<a href='#'>Show serverside script</a>").appendTo("body").click(function() {
serverscript.toggle();
return false;
});
var script = $("<code class='mix'>").html( $("#demo").html() ).wrap("<pre></pre>").parent().hide().appendTo("body");
var serverscript;
$.get("users.phps", function(response) {
serverscript = $("<pre>").hide().html( response ).appendTo("body");
})
});
</script>
<script src="../js/chili-1.7.pack.js" type="text/javascript"></script>
</body>
</html>

Binary file not shown.

Before

Width:  |  Height:  |  Size: 538 B

View File

@ -1,236 +0,0 @@
/* GENERAL ELEMENTS */
* { margin: 0; padding: 0; }
body, input, select, textarea { font-family: verdana, arial, helvetica, sans-serif; font-size: 11px; }
body { color: #333; background-color: #fff; text-align: center; }
a:link { color:#0060BF; text-decoration: underline; }
a:visited { color:#0060BF; text-decoration: underline; }
a:active { color:#0060BF; text-decoration: underline; }
a:hover { color:#000000; text-decoration: underline; }
h1, h2, h3, h4, h5, h6 { font-family: "Lucida Grande", "Lucida Sans Unicode", geneva, verdana, arial, helvetica, sans-serif; font-weight: bold; color: #666; }
h1 { font-size: 1.8em; margin: 0em 0em 0.6em 0em; color: #EC5800; }
h2 { font-size: 1.5em; margin: 1.2em 0em 0.4em 0em; }
h3 { font-size: 1.4em; margin: 1.2em 0em 0.4em 0em; color: #EC5800; }
h4 { font-size: 1.2em; margin: 1.2em 0em 0.4em 0em; }
h5 { font-size: 1.0em; margin: 1.2em 0em 0.4em 0em; }
h6 { font-size: 0.8em; margin: 1.2em 0em 0.4em 0em; }
img { border: 0px; }
p { font-size: 1.0em; line-height: 1.3em; margin: 1.2em 0em 1.2em 0em; }
li > p { margin-top: 0.2em; }
pre { font-family: monospace; font-size: 1.0em; }
strong, b { font-weight: bold; }
/* PAGE ELEMENTS */
/* Content */
#content { margin: 0em auto; width: 765px; padding: 10px 0 10px 0; text-align: left; /* Win IE5 */ }
.content { margin-left: 4.5em; margin-right: 4.5em; }
.content ol, .content ul, .content li { font-size: 1.0em; line-height: 1.3em; margin: 0.2em 0 0.1em 1.5em; }
.content ol.terms li { margin-bottom: 1em; }
/* Header */
#header { padding-bottom: 10em; }
#headerlogo { float: left; }
#headerlogo img { width: 188px; height: 83px; }
#headernav { float: right; }
label { font-weight: bold; }
#reminders label { font-weight: normal; }
table.tabbedtable { padding-left: 3em; }
table.tabbedtable td { padding-bottom: 5px; }
table.tabbedtable label { text-align: right; padding-right: 9px; }
.hiddenlabel { visibility: hidden; }
.largelink { border: 1px solid #cacaca; padding: 10px; background-color: #E8EEF7; font-size: 1.2em; font-weight: bold; }
.largelinkwrap { padding-top: 10px; padding-bottom: 10px; }
#signuptab {
float:left;
width:100%;
background:#fff url("bg.gif") repeat-x bottom;
font-size: 1.0em;
line-height: normal;
}
#signuptab ul {
margin:0;
padding: 0px 10px 0px 10px;
list-style:none;
}
#signuptab li {
float:left;
background:url("left_white.png") no-repeat left top;
margin:0;
padding:0 3px 0 9px;
border-bottom:1px solid #CACACA;
}
#signuptab a {
float:left;
display:block;
width:.1em;
background:url("right_white.png") no-repeat right top;
padding:2px 15px 0px 6px;
text-decoration:none;
font-weight:bold;
color:#fff;
white-space: nowrap;
}
#signuptab > ul a {width:auto;}
/* Commented Backslash Hack hides rule from IE5-Mac \*/
#signuptab a {float:none;}
/* End IE5-Mac hack */
#signuptab a:hover {
color:#333;
}
#signuptab #signupcurrent {
background-position:0 -150px;
border-width:0;
}
#signuptab #signupcurrent a {
background-position:100% -150px;
padding-bottom:1px;
color:#000;
}
#signuptab li:hover, #signuptab li:hover a {
background-position:0% -150px;
color:#000;
}
#signuptab li:hover a {
background-position:100% -150px;
}
/* Signup box */
#signupbox {
width: 100%;
text-align: center;
margin: 0em auto;
}
#signupwrap {
border: 1px solid #CACACA;
border-top: 0;
text-align: left;
padding: 35px 10px 20px 30px;
clear: both;
}
/* Unsupported browsers */
.orange_rbcontent { padding: 0.4em; }
.orange_rbroundbox { width: 100%; }
#unsupported {
font-weight: bold;
text-align: left;
}
/*#content {
padding-top: 15px;
}*/
/* Signup form */
#signupform table {
border-spacing: 0px;
border-collapse: collapse;
empty-cells: show;
}
#signupform .label {
padding-top: 2px;
padding-right: 8px;
vertical-align: top;
text-align: right;
width: 125px;
white-space: nowrap;
}
#signupform .field {
padding-bottom: 10px;
white-space: nowrap;
}
#signupform .status {
padding-top: 2px;
padding-left: 8px;
vertical-align: top;
width: 246px;
white-space: nowrap;
}
#signupform .textfield {
width: 150px;
}
#signupform label.error {
background:url("../images/unchecked.gif") no-repeat 0px 0px;
padding-left: 16px;
padding-bottom: 2px;
font-weight: bold;
color: #EA5200;
}
#signupform label.checked {
background:url("../images/checked.gif") no-repeat 0px 0px;
}
#signupform .success_msg {
font-weight: bold;
color: #0060BF;
margin-left: 19px;
}
#signupform #dateformatStatus, #signupform #termsStatus {
margin-left: 6px;
}
#signupform #dateformat_eu {
vertical-align: middle;
}
#signupform #ldateformat_eu {
font-weight: normal;
vertical-align: middle;
}
#signupform #dateformat_am {
vertical-align: middle;
}
#signupform #ldateformat_am {
font-weight: normal;
vertical-align: middle;
}
#signupform #termswrap {
float: left;
}
#signupform #terms {
vertical-align: middle;
float: left;
display: block;
margin-right: 5px;
}
#signupform #lterms {
font-weight: normal;
vertical-align: middle;
float: left;
display: block;
width: 350px;
white-space: normal;
}
#signupform #lsignupsubmit {
visibility: hidden;
}

Binary file not shown.

Before

Width:  |  Height:  |  Size: 5.0 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.5 KiB

View File

@ -1,12 +0,0 @@
<?php
$request = trim(strtolower($_REQUEST['username']));
//sleep(2);
usleep(150000);
$users = array('asdf', 'Peter', 'Peter2', 'George');
$valid = 'true';
foreach($users as $user) {
if( strtolower($user) == $request )
$valid = 'false';
}
echo $valid;
?>

View File

@ -1,10 +0,0 @@
<?php
$request = trim(strtolower($_REQUEST['value']));
$users = array('asdf', 'Peter', 'Peter2', 'George');
$valid = 'true';
foreach($users as $user) {
if( strtolower($user) == $request )
$valid = 'false';
}
echo $valid;
?>

View File

@ -1,412 +0,0 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>jQuery accordion form with validation</title>
<link rel="stylesheet" href="../assets/demo_blue.css" type="text/css" />
<script type="text/javascript" src="../../lib/jquery.js"></script>
<script type="text/javascript" src="../../jquery.validate.js"></script>
<script type="text/javascript" src="js/jquery.maskedinput-1.0.js"></script>
<script type="text/javascript" src="js/ui.core.js"></script>
<script type="text/javascript" src="js/ui.accordion.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#recordClientPhone").mask("(999) 999-9999");
$("#recordClientPhoneAlt").mask("(999) 999-9999");
$("#recordClientZip").mask("99999");
$("#recordPropertyZip").mask("99999");
$("#recordPurchaseZip").mask("99999");
// add * to required field labels
$('label.required').append('&nbsp;<strong>*</strong>&nbsp;');
// accordion functions
var accordion = $("#stepForm").accordion();
var current = 0;
$.validator.addMethod("pageRequired", function(value, element) {
var $element = $(element)
function match(index) {
return current == index && $(element).parents("#sf" + (index + 1)).length;
}
if (match(0) || match(1) || match(2)) {
return !this.optional(element);
}
return "dependency-mismatch";
}, $.validator.messages.required)
var v = $("#cmaForm").validate({
errorClass: "warning",
onkeyup: false,
onblur: false,
submitHandler: function() {
alert("Submitted, thanks!");
}
});
// back buttons do not need to run validation
$("#sf2 .prevbutton").click(function(){
accordion.accordion("activate", 0);
current = 0;
});
$("#sf3 .prevbutton").click(function(){
accordion.accordion("activate", 1);
current = 1;
});
// these buttons all run the validation, overridden by specific targets above
$(".open2").click(function() {
if (v.form()) {
accordion.accordion("activate", 2);
current = 2;
}
});
$(".open1").click(function() {
if (v.form()) {
accordion.accordion("activate", 1);
current = 1;
}
});
$(".open0").click(function() {
if (v.form()) {
accordion.accordion("activate", 0);
current = 0;
}
});
});
</script>
<link rel="stylesheet" type="text/css" media="screen" href="style.css" />
</head>
<body>
<div id="wrap">
<div id="main">
<h1 class="top bottom"><span>Help me</span> Buy and Sell a House</h1>
<h2>This form is quick &amp; easy to complete - in only 3 steps!</h2>
<form name="cmaForm" id="cmaForm" method="post">
<input type="hidden" name="recordRequestPrimaryServiceID" id="recordRequestPrimaryServiceID" value="100" />
<input type="hidden" name="recordClientServices" id="recordClientServices" value="1,3" />
<ul id="stepForm" class="ui-accordion-container">
<li id="sf1"><a href='#' class="ui-accordion-link"> </a>
<div>
<fieldset><legend> Step 1 of 3 </legend>
<div class="requiredNotice">*Required Field</div>
<h3 class="stepHeader">Tell us about the property you're buying</h3>
<label for="recordPurchaseMetRealtor" class="input required">Are you currently working with a<br />
real estate agent? </label> &nbsp;&nbsp;No: <input name="recordPurchaseMetRealtor" type="radio" checked="checked" class="inputclass" value="0" /> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Yes: <input name="recordPurchaseMetRealtor" type="radio" class="inputclass pageRequired" value="1" title="Please choose Yes or No" />
<div class="formspacer"></div>
<label for="recordPurchaseTimeFrameID" class="input required">When would you like to move?</label> <select name="recordPurchaseTimeFrameID" id="recordPurchaseTimeFrameID" class="inputclass pageRequired" title="Select a Time Frame">
<option value="">-Select-</option>
<option value="1">Less than 3 months</option>
<option value="2">3-6 months</option>
<option value="3">6-9 months</option>
<option value="4">9-12 months</option>
<option value="5">Over 12 months</option>
</select> <br />
<label for="recordPurchasePriceRangeID" class="input required">Purchase price range:</label> <select name="recordPurchasePriceRangeID" id="recordPurchasePriceRangeID" class="inputclass pageRequired" title="Select a Price Range">
<option value="">-Select-</option>
<option value="1"></option>
<option value="2">$75,000 - $100,000</option>
<option value="3">$100,000 - $125,000</option>
<option value="4">$125,000 - $150,000</option>
<option value="5">$150,000 - $200,000</option>
<option value="6">$200,000 - $250,000</option>
<option value="7">$250,000 - $300,000</option>
<option value="8">$300,000 - $350,000</option>
<option value="9">$350,000 - $400,000</option>
<option value="10">$400,000 - $500,000</option>
<option value="11">$500,000 - $700,000</option>
<option value="12">$700,000 - $900,000</option>
<option value="13">> $900,000</option>
</select> <br />
<label for="recordPurchaseState" class="input required">State:</label> <select name="recordPurchaseState" id="recordPurchaseState" class="inputclass pageRequired" title="Select a State">
<option value="">-Select-</option>
<option value="AL">Alabama</option>
<option value="AK">Alaska</option>
<option value="AZ">Arizona</option>
<option value="AR">Arkansas</option>
<option value="CA">California</option>
<option value="CO">Colorado</option>
<option value="CT">Connecticut</option>
<option value="DE">Delaware</option>
<option value="DC">Dist of Columbia</option>
<option value="FL">Florida</option>
<option value="GA">Georgia</option>
<option value="HI">Hawaii</option>
<option value="ID">Idaho</option>
<option value="IL">Illinois</option>
<option value="IN">Indiana</option>
<option value="IA">Iowa</option>
<option value="KS">Kansas</option>
<option value="KY">Kentucky</option>
<option value="LA">Louisiana</option>
<option value="ME">Maine</option>
<option value="MD">Maryland</option>
<option value="MA">Massachusetts</option>
<option value="MI">Michigan</option>
<option value="MN">Minnesota</option>
<option value="MS">Mississippi</option>
<option value="MO">Missouri</option>
<option value="MT">Montana</option>
<option value="NE">Nebraska</option>
<option value="NV">Nevada</option>
<option value="NH">New Hampshire</option>
<option value="NJ">New Jersey</option>
<option value="NM">New Mexico</option>
<option value="NY">New York</option>
<option value="NC">North Carolina</option>
<option value="ND">North Dakota</option>
<option value="OH">Ohio</option>
<option value="OK">Oklahoma</option>
<option value="OR">Oregon</option>
<option value="PA" selected="selected">Pennsylvania</option>
<option value="RI">Rhode Island</option>
<option value="SC">South Carolina</option>
<option value="SD">South Dakota</option>
<option value="TN">Tennessee</option>
<option value="TX">Texas</option>
<option value="UT">Utah</option>
<option value="VT">Vermont</option>
<option value="VA">Virginia</option>
<option value="WA">Washington</option>
<option value="WV">West Virginia</option>
<option value="WI">Wisconsin</option>
<option value="WY">Wyoming</option>
</select> <br />
<label for="recordPurchasePropertyTypeID" class="input">Desired property type:</label> <select name="recordPurchasePropertyTypeID" id="recordPurchasePropertyTypeID" class="inputclass" title="Select a Property Type">
<option value="">-Select-</option>
<option value="1">Single Family Detached</option>
<option value="2">Condo</option>
<option value="3">Townhouse</option>
<option value="4">Rental</option>
<option value="5">Multi-Family</option>
<option value="6">Vacation Home</option>
<option value="7">Other</option>
</select> <br />
<div class="buttonWrapper"><input name="formNext1" type="button" class="open1 nextbutton" value="Next" alt="Next" title="Next" /></div>
</fieldset>
</div>
</li>
<li id="sf2">
<a href='#' class="ui-accordion-link">
</a>
<div>
<fieldset><legend> Step 2 of 3 </legend>
<div class="requiredNotice">*Required Field</div>
<h3 class="stepHeader">Tell us about the property you're selling</h3>
<label for="recordClientTimeFrameID" class="input required">When would you like to sell?</label> <select name="recordClientTimeFrameID" id="recordClientTimeFrameID" class="inputclass pageRequired" title="Select a Time Frame">
<option value="">-Select-</option>
<option value="1">Less than 3 months</option>
<option value="2">3-6 months</option>
<option value="3">6-9 months</option>
<option value="4">9-12 months</option>
<option value="5">Over 12 months</option>
</select> <br />
<label for="recordClientHomeTypeID" class="input required">Type of property you are selling:</label> <select name="recordClientHomeTypeID" id="recordClientHomeTypeID" class="inputclass pageRequired" title="Select a Property Type">
<option value="">-Select-</option>
<option value="1">Single Family Detached</option>
<option value="2">Condo</option>
<option value="3">Townhouse</option>
<option value="4">Rental</option>
<option value="5">Multi-Family</option>
<option value="6">Vacation Home</option>
<option value="7">Other</option>
</select> <br />
<label for="recordPropertyAddress1" class="input required">Property Street Address:</label> <input name="recordPropertyAddress1" id="recordPropertyAddress1" class="inputclass pageRequired" title="Street Address is required" maxlength="254" onblur="recordClientAddress1.value = this.value" /><br />
<label for="recordPropertyAddress2" class="input">Address (2):</label> <input name="recordPropertyAddress2" id="recordPropertyAddress2" class="inputclass" maxlength="254" onblur="recordClientAddress2.value = this.value" /><br />
<label for="recordPropertyCity" class="input required">City:</label> <input name="recordPropertyCity" id="recordPropertyCity" class="inputclass pageRequired" title="City is required" maxlength="254" onblur="recordClientCity.value = this.value" /><br />
<label for="recordPropertyState" class="input required">State:</label> <select name="recordPropertyState" id="recordPropertyState" class="inputclass pageRequired" title="Select a State" onchange="recordClientState.value = this.value">
<option value="">-Select-</option>
<option value="AL">Alabama</option>
<option value="AK">Alaska</option>
<option value="AZ">Arizona</option>
<option value="AR">Arkansas</option>
<option value="CA">California</option>
<option value="CO">Colorado</option>
<option value="CT">Connecticut</option>
<option value="DE">Delaware</option>
<option value="DC">Dist of Columbia</option>
<option value="FL">Florida</option>
<option value="GA">Georgia</option>
<option value="HI">Hawaii</option>
<option value="ID">Idaho</option>
<option value="IL">Illinois</option>
<option value="IN">Indiana</option>
<option value="IA">Iowa</option>
<option value="KS">Kansas</option>
<option value="KY">Kentucky</option>
<option value="LA">Louisiana</option>
<option value="ME">Maine</option>
<option value="MD">Maryland</option>
<option value="MA">Massachusetts</option>
<option value="MI">Michigan</option>
<option value="MN">Minnesota</option>
<option value="MS">Mississippi</option>
<option value="MO">Missouri</option>
<option value="MT">Montana</option>
<option value="NE">Nebraska</option>
<option value="NV">Nevada</option>
<option value="NH">New Hampshire</option>
<option value="NJ">New Jersey</option>
<option value="NM">New Mexico</option>
<option value="NY">New York</option>
<option value="NC">North Carolina</option>
<option value="ND">North Dakota</option>
<option value="OH">Ohio</option>
<option value="OK">Oklahoma</option>
<option value="OR">Oregon</option>
<option value="PA" selected="selected">Pennsylvania</option>
<option value="RI">Rhode Island</option>
<option value="SC">South Carolina</option>
<option value="SD">South Dakota</option>
<option value="TN">Tennessee</option>
<option value="TX">Texas</option>
<option value="UT">Utah</option>
<option value="VT">Vermont</option>
<option value="VA">Virginia</option>
<option value="WA">Washington</option>
<option value="WV">West Virginia</option>
<option value="WI">Wisconsin</option>
<option value="WY">Wyoming</option>
</select> <br />
<label for="recordPropertyZip" class="input required">Zip:</label> <input name="recordPropertyZip" id="recordPropertyZip" class="inputclass pageRequired" title="Zip Code is required" maxlength="254" onblur="recordClientZip.value = this.value" /><br />
<label for="recordClientPropertyValueID" class="input required">Estimated Market Value:</label> <select name="recordClientPropertyValueID" id="recordClientPropertyValueID" class="inputclass pageRequired" title="Select a Price Range">
<option value="">-Select-</option>
<option value="1">Less Than $75K</option>
<option value="2">$75-$100K</option>
<option value="3">$100-$125K</option>
<option value="4">$125-$150K</option>
<option value="5">$150-$200K</option>
<option value="6">$200-$250K</option>
<option value="7">$250-$300K</option>
<option value="8">$300-$350K</option>
<option value="9">$350-$400K</option>
<option value="10">$400-$500K</option>
<option value="11">$500-$700K</option>
<option value="12">$700-$900K</option>
<option value="13">Over $900K</option>
</select> <br />
<label for="recordPropertyBedroomsID" class="input">Bedrooms:</label> <select name="recordPropertyBedroomsID" id="recordPropertyBedroomsID" class="inputclass">
<option value="">-Select-</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5+</option>
</select> <br />
<label for="recordPropertyBathroomsId" class="input">Bathrooms:</label> <select name="recordPropertyBathroomsId" id="recordPropertyBathroomsId" class="inputclass">
<option value="">-Select-</option>
<option value="1">1</option>
<option value="2">1.5</option>
<option value="3">2</option>
<option value="4">2.5</option>
<option value="5">3</option>
<option value="6">3.5</option>
<option value="7">4+</option>
</select> <br />
<label for="recordPropertyAgeId" class="input">Approx. Age of Home:</label> <select name="recordPropertyAgeId" id="recordPropertyAgeId" class="inputclass">
<option value="">-Select-</option>
<option value="1">Less Than 1 year</option>
<option value="2">1-5 years</option>
<option value="3">6-10 years</option>
<option value="4">11-15 years</option>
<option value="5">More than 15 years</option>
</select> <br />
<label for="recordPropertySqFt" class="input">Approx. Square Footage:</label> <input name="recordPropertySqFt" id="recordPropertySqFt" class="inputclass" maxlength="254" /><br />
<div class="buttonWrapper"><input name="formBack0" type="button" class="open0 prevbutton" value="Back" alt="Back" title="Back" /> <input name="formNext2" type="button" class="open2 nextbutton" value="Next" alt="Next" title="Next" /></div>
</fieldset>
</div>
</li>
<li id="sf3">
<a href='#' class="ui-accordion-link">
</a>
<div>
<fieldset><legend> Step 3 of 3 </legend>
<div class="requiredNotice">*Required Field</div>
<h3 class="stepHeader">Tell us about yourself</h3>
<label for="recordClientNameFirst" class="input required">First Name:</label> <input name="recordClientNameFirst" id="recordClientNameFirst" class="inputclass pageRequired" title="First Name is required" maxlength="254" /> <br />
<label for="recordClientNameLast" class="input required">Last Name:</label> <input name="recordClientNameLast" id="recordClientNameLast" class="inputclass pageRequired" maxlength="254" title="Last Name is required" /> <br />
<label for="recordClientAddress1" class="input required">Current Address:</label> <input name="recordClientAddress1" id="recordClientAddress1" class="inputclass pageRequired" maxlength="254" title="Address is required" /> <br />
<label for="recordClientAddress2" class="input">Address (2):</label> <input name="recordClientAddress2" id="recordClientAddress2" class="inputclass" maxlength="254" /> <br />
<label for="recordClientCity" class="input required">City:</label> <input name="recordClientCity" id="recordClientCity" class="inputclass pageRequired" maxlength="254" title="City is required" /> <br />
<label for="recordClientState" class="input required">State:</label> <select name="recordClientState" id="recordClientState" class="inputclass pageRequired" title="Select a State">
<option value="">-Select-</option>
<option value="AL">Alabama</option>
<option value="AK">Alaska</option>
<option value="AZ">Arizona</option>
<option value="AR">Arkansas</option>
<option value="CA">California</option>
<option value="CO">Colorado</option>
<option value="CT">Connecticut</option>
<option value="DE">Delaware</option>
<option value="DC">Dist of Columbia</option>
<option value="FL">Florida</option>
<option value="GA">Georgia</option>
<option value="HI">Hawaii</option>
<option value="ID">Idaho</option>
<option value="IL">Illinois</option>
<option value="IN">Indiana</option>
<option value="IA">Iowa</option>
<option value="KS">Kansas</option>
<option value="KY">Kentucky</option>
<option value="LA">Louisiana</option>
<option value="ME">Maine</option>
<option value="MD">Maryland</option>
<option value="MA">Massachusetts</option>
<option value="MI">Michigan</option>
<option value="MN">Minnesota</option>
<option value="MS">Mississippi</option>
<option value="MO">Missouri</option>
<option value="MT">Montana</option>
<option value="NE">Nebraska</option>
<option value="NV">Nevada</option>
<option value="NH">New Hampshire</option>
<option value="NJ">New Jersey</option>
<option value="NM">New Mexico</option>
<option value="NY">New York</option>
<option value="NC">North Carolina</option>
<option value="ND">North Dakota</option>
<option value="OH">Ohio</option>
<option value="OK">Oklahoma</option>
<option value="OR">Oregon</option>
<option value="PA" selected="selected">Pennsylvania</option>
<option value="RI">Rhode Island</option>
<option value="SC">South Carolina</option>
<option value="SD">South Dakota</option>
<option value="TN">Tennessee</option>
<option value="TX">Texas</option>
<option value="UT">Utah</option>
<option value="VT">Vermont</option>
<option value="VA">Virginia</option>
<option value="WA">Washington</option>
<option value="WV">West Virginia</option>
<option value="WI">Wisconsin</option>
<option value="WY">Wyoming</option>
</select> <br />
<label for="recordClientZip" class="input required">Zip:</label> <input name="recordClientZip" id="recordClientZip" class="inputclass pageRequired" maxlength="12" title="Zip Code is required" /> <br />
<label for="recordClientPhone" class="input required">Phone Number:</label> <input name="recordClientPhone" id="recordClientPhone" class="inputclass pageRequired" maxlength="254" title="Phone Number is required" /> <br />
<label for="recordClientPhoneAlt" class="input">Alternate Number:</label> <input name="recordClientPhoneAlt" id="recordClientPhoneAlt" class="inputclass" maxlength="254" /> <br />
<label for="recordClientEmail" class="input required">Email Address:</label> <input name="recordClientEmail" id="recordClientEmail" class="inputclass pageRequired email" maxlength="254" title="Email address is required" /> <br />
<label for="recordClientEmail1" class="input required">Confirm Email:</label> <input name="recordClientEmail1" id="recordClientEmail1" class="inputclass pageRequired" equalTo:"'#recordClientEmail" maxlength="254" title="Please confirm your email address" /> <br />
<br />
<p class="formDisclaimer">This is a sample form, no information is sent anywhere.</p>
<div class="buttonWrapper"><input name="formBack1" type="button" class="open1 prevbutton" value="Back" alt="Back" title="Back" /> <input name="submit" type="submit" id="submit" value="Submit" class="submitbutton" alt="Submit" title="Submit"></div>
</fieldset>
</div>
</li>
</ul>
</form>
</div>
</div>
</body>
</html>

View File

@ -1,246 +0,0 @@
/*
* Copyright (c) 2007 Josh Bush (digitalbush.com)
*
* Permission is hereby granted, free of charge, to any person
* obtaining a copy of this software and associated documentation
* files (the "Software"), to deal in the Software without
* restriction, including without limitation the rights to use,
* copy, modify, merge, publish, distribute, sublicense, and/or sell
* copies of the Software, and to permit persons to whom the
* Software is furnished to do so, subject to the following
* conditions:
* The above copyright notice and this permission notice shall be
* included in all copies or substantial portions of the Software.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
* EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES
* OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
* NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT
* HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
* WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
* FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR
* OTHER DEALINGS IN THE SOFTWARE.
*/
/*
* Version: 1.0
* Release: 2007-07-25
*/
(function($) {
//Helper Functions for Caret positioning
function getCaretPosition(ctl){
var res = {begin: 0, end: 0 };
if (ctl.setSelectionRange){
res.begin = ctl.selectionStart;
res.end = ctl.selectionEnd;
}else if (document.selection && document.selection.createRange){
var range = document.selection.createRange();
res.begin = 0 - range.duplicate().moveStart('character', -100000);
res.end = res.begin + range.text.length;
}
return res;
};
function setCaretPosition(ctl, pos){
if(ctl.setSelectionRange){
ctl.focus();
ctl.setSelectionRange(pos,pos);
}else if (ctl.createTextRange){
var range = ctl.createTextRange();
range.collapse(true);
range.moveEnd('character', pos);
range.moveStart('character', pos);
range.select();
}
};
//Predefined character definitions
var charMap={
'9':"[0-9]",
'a':"[A-Za-z]",
'*':"[A-Za-z0-9]"
};
//Helper method to inject character definitions
$.mask={
addPlaceholder : function(c,r){
charMap[c]=r;
}
};
//Main Method
$.fn.mask = function(mask,settings) {
settings = $.extend({
placeholder: "_",
completed: null
}, settings);
//Build Regex for format validation
var reString="^";
for(var i=0;i<mask.length;i++)
reString+=(charMap[mask.charAt(i)] || ("\\"+mask.charAt(i)));
reString+="$";
var re = new RegExp(reString);
return this.each(function(){
var input=$(this);
var buffer=new Array(mask.length);
var locked=new Array(mask.length);
//Build buffer layout from mask
for(var i=0;i<mask.length;i++){
locked[i]=charMap[mask.charAt(i)]==null;
buffer[i]=locked[i]?mask.charAt(i):settings.placeholder;
}
/*Event Bindings*/
input.focus(function(){
checkVal();
writeBuffer();
setCaretPosition(this,0);
});
input.blur(checkVal);
//Paste events for IE and Mozilla thanks to Kristinn Sigmundsson
if ($.browser.msie)
this.onpaste= function(){setTimeout(checkVal,0);};
else if ($.browser.mozilla)
this.addEventListener('input',checkVal,false);
var ignore=false; //Variable for ignoring control keys
input.keydown(function(e){
var pos=getCaretPosition(this);
var k = e.keyCode;
ignore=(k < 16 || (k > 16 && k < 32 ) || (k > 32 && k < 41));
//delete selection before proceeding
if((pos.begin-pos.end)!=0 && (!ignore || k==8 || k==46)){
clearBuffer(pos.begin,pos.end);
}
//backspace and delete get special treatment
if(k==8){//backspace
while(pos.begin-->=0){
if(!locked[pos.begin]){
buffer[pos.begin]=settings.placeholder;
if($.browser.opera){
//Opera won't let you cancel the backspace, so we'll let it backspace over a dummy character.
writeBuffer(pos.begin);
setCaretPosition(this,pos.begin+1);
}else{
writeBuffer();
setCaretPosition(this,pos.begin);
}
return false;
}
}
}else if(k==46){//delete
clearBuffer(pos.begin,pos.begin+1);
writeBuffer();
setCaretPosition(this,pos.begin);
return false;
}else if (k==27){
clearBuffer(0,mask.length);
writeBuffer();
setCaretPosition(this,0);
return false;
}
});
input.keypress(function(e){
if(ignore){
ignore=false;
return;
}
e=e||window.event;
var k=e.charCode||e.keyCode||e.which;
var pos=getCaretPosition(this);
var caretPos=pos.begin;
if(e.ctrlKey || e.altKey){//Ignore
return true;
}else if ((k>=41 && k<=122) ||k==32 || k>186){//typeable characters
while(pos.begin<mask.length){
var reString=charMap[mask.charAt(pos.begin)];
var match;
if(reString){
var reChar=new RegExp(reString);
match=String.fromCharCode(k).match(reChar);
}else{//we're on a mask char, go forward and try again
pos.begin+=1;
pos.end=pos.begin;
caretPos+=1;
continue;
}
if(match)
buffer[pos.begin]=String.fromCharCode(k);
else
return false;//reject char
while(++caretPos<mask.length){//seek forward to next typable position
if(!locked[caretPos])
break;
}
break;
}
}else
return false;
writeBuffer();
if(settings.completed && caretPos>=buffer.length)
settings.completed.call(input);
else
setCaretPosition(this,caretPos);
return false;
});
/*Helper Methods*/
function clearBuffer(start,end){
for(var i=start;i<end;i++){
if(!locked[i])
buffer[i]=settings.placeholder;
}
};
function writeBuffer(pos){
var s="";
for(var i=0;i<mask.length;i++){
s+=buffer[i];
if(i==pos)
s+=settings.placeholder;
}
input.val(s);
return s;
};
function checkVal(){
//try to place charcters where they belong
var test=input.val();
var pos=0;
for(var i=0;i<mask.length;i++){
if(!locked[i]){
while(pos++<test.length){
//Regex Test each char here.
var reChar=new RegExp(charMap[mask.charAt(i)]);
if(test.charAt(pos-1).match(reChar)){
buffer[i]=test.charAt(pos-1);
break;
}
}
}
}
var s=writeBuffer();
if(!s.match(re)){
input.val("");
clearBuffer(0,mask.length);
}
};
});
};
})(jQuery);

View File

@ -1,477 +0,0 @@
/*
* jQuery UI Accordion 1.7.1
*
* Copyright (c) 2009 AUTHORS.txt (http://jqueryui.com/about)
* Dual licensed under the MIT (MIT-LICENSE.txt)
* and GPL (GPL-LICENSE.txt) licenses.
*
* http://docs.jquery.com/UI/Accordion
*
* Depends:
* ui.core.js
*/
(function($) {
$.widget("ui.accordion", {
_init: function() {
var o = this.options, self = this;
this.running = 0;
// if the user set the alwaysOpen option on init
// then we need to set the collapsible option
// if they set both on init, collapsible will take priority
if (o.collapsible == $.ui.accordion.defaults.collapsible &&
o.alwaysOpen != $.ui.accordion.defaults.alwaysOpen) {
o.collapsible = !o.alwaysOpen;
}
if ( o.navigation ) {
var current = this.element.find("a").filter(o.navigationFilter);
if ( current.length ) {
if ( current.filter(o.header).length ) {
this.active = current;
} else {
this.active = current.parent().parent().prev();
current.addClass("ui-accordion-content-active");
}
}
}
this.element.addClass("ui-accordion ui-widget ui-helper-reset");
// in lack of child-selectors in CSS we need to mark top-LIs in a UL-accordion for some IE-fix
if (this.element[0].nodeName == "UL") {
this.element.children("li").addClass("ui-accordion-li-fix");
}
this.headers = this.element.find(o.header).addClass("ui-accordion-header ui-helper-reset ui-state-default ui-corner-all")
.bind("mouseenter.accordion", function(){ $(this).addClass('ui-state-hover'); })
.bind("mouseleave.accordion", function(){ $(this).removeClass('ui-state-hover'); })
.bind("focus.accordion", function(){ $(this).addClass('ui-state-focus'); })
.bind("blur.accordion", function(){ $(this).removeClass('ui-state-focus'); });
this.headers
.next()
.addClass("ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom");
this.active = this._findActive(this.active || o.active).toggleClass("ui-state-default").toggleClass("ui-state-active").toggleClass("ui-corner-all").toggleClass("ui-corner-top");
this.active.next().addClass('ui-accordion-content-active');
//Append icon elements
$("<span/>").addClass("ui-icon " + o.icons.header).prependTo(this.headers);
this.active.find(".ui-icon").toggleClass(o.icons.header).toggleClass(o.icons.headerSelected);
// IE7-/Win - Extra vertical space in lists fixed
if ($.browser.msie) {
this.element.find('a').css('zoom', '1');
}
this.resize();
//ARIA
this.element.attr('role','tablist');
this.headers
.attr('role','tab')
.bind('keydown', function(event) { return self._keydown(event); })
.next()
.attr('role','tabpanel');
this.headers
.not(this.active || "")
.attr('aria-expanded','false')
.attr("tabIndex", "-1")
.next()
.hide();
// make sure at least one header is in the tab order
if (!this.active.length) {
this.headers.eq(0).attr('tabIndex','0');
} else {
this.active
.attr('aria-expanded','true')
.attr('tabIndex', '0');
}
// only need links in taborder for Safari
if (!$.browser.safari)
this.headers.find('a').attr('tabIndex','-1');
if (o.event) {
this.headers.bind((o.event) + ".accordion", function(event) { return self._clickHandler.call(self, event, this); });
}
},
destroy: function() {
var o = this.options;
this.element
.removeClass("ui-accordion ui-widget ui-helper-reset")
.removeAttr("role")
.unbind('.accordion')
.removeData('accordion');
this.headers
.unbind(".accordion")
.removeClass("ui-accordion-header ui-helper-reset ui-state-default ui-corner-all ui-state-active ui-corner-top")
.removeAttr("role").removeAttr("aria-expanded").removeAttr("tabindex");
this.headers.find("a").removeAttr("tabindex");
this.headers.children(".ui-icon").remove();
var contents = this.headers.next().css("display", "").removeAttr("role").removeClass("ui-helper-reset ui-widget-content ui-corner-bottom ui-accordion-content ui-accordion-content-active");
if (o.autoHeight || o.fillHeight) {
contents.css("height", "");
}
},
_setData: function(key, value) {
if(key == 'alwaysOpen') { key = 'collapsible'; value = !value; }
$.widget.prototype._setData.apply(this, arguments);
},
_keydown: function(event) {
var o = this.options, keyCode = $.ui.keyCode;
if (o.disabled || event.altKey || event.ctrlKey)
return;
var length = this.headers.length;
var currentIndex = this.headers.index(event.target);
var toFocus = false;
switch(event.keyCode) {
case keyCode.RIGHT:
case keyCode.DOWN:
toFocus = this.headers[(currentIndex + 1) % length];
break;
case keyCode.LEFT:
case keyCode.UP:
toFocus = this.headers[(currentIndex - 1 + length) % length];
break;
case keyCode.SPACE:
case keyCode.ENTER:
return this._clickHandler({ target: event.target }, event.target);
}
if (toFocus) {
$(event.target).attr('tabIndex','-1');
$(toFocus).attr('tabIndex','0');
toFocus.focus();
return false;
}
return true;
},
resize: function() {
var o = this.options, maxHeight;
if (o.fillSpace) {
if($.browser.msie) { var defOverflow = this.element.parent().css('overflow'); this.element.parent().css('overflow', 'hidden'); }
maxHeight = this.element.parent().height();
if($.browser.msie) { this.element.parent().css('overflow', defOverflow); }
this.headers.each(function() {
maxHeight -= $(this).outerHeight();
});
var maxPadding = 0;
this.headers.next().each(function() {
maxPadding = Math.max(maxPadding, $(this).innerHeight() - $(this).height());
}).height(Math.max(0, maxHeight - maxPadding))
.css('overflow', 'auto');
} else if ( o.autoHeight ) {
maxHeight = 0;
this.headers.next().each(function() {
maxHeight = Math.max(maxHeight, $(this).outerHeight());
}).height(maxHeight);
}
},
activate: function(index) {
// call clickHandler with custom event
var active = this._findActive(index)[0];
this._clickHandler({ target: active }, active);
},
_findActive: function(selector) {
return selector
? typeof selector == "number"
? this.headers.filter(":eq(" + selector + ")")
: this.headers.not(this.headers.not(selector))
: selector === false
? $([])
: this.headers.filter(":eq(0)");
},
_clickHandler: function(event, target) {
var o = this.options;
if (o.disabled) return false;
// called only when using activate(false) to close all parts programmatically
if (!event.target && o.collapsible) {
this.active.removeClass("ui-state-active ui-corner-top").addClass("ui-state-default ui-corner-all")
.find(".ui-icon").removeClass(o.icons.headerSelected).addClass(o.icons.header);
this.active.next().addClass('ui-accordion-content-active');
var toHide = this.active.next(),
data = {
options: o,
newHeader: $([]),
oldHeader: o.active,
newContent: $([]),
oldContent: toHide
},
toShow = (this.active = $([]));
this._toggle(toShow, toHide, data);
return false;
}
// get the click target
var clicked = $(event.currentTarget || target);
var clickedIsActive = clicked[0] == this.active[0];
// if animations are still active, or the active header is the target, ignore click
if (this.running || (!o.collapsible && clickedIsActive)) {
return false;
}
// switch classes
this.active.removeClass("ui-state-active ui-corner-top").addClass("ui-state-default ui-corner-all")
.find(".ui-icon").removeClass(o.icons.headerSelected).addClass(o.icons.header);
this.active.next().addClass('ui-accordion-content-active');
if (!clickedIsActive) {
clicked.removeClass("ui-state-default ui-corner-all").addClass("ui-state-active ui-corner-top")
.find(".ui-icon").removeClass(o.icons.header).addClass(o.icons.headerSelected);
clicked.next().addClass('ui-accordion-content-active');
}
// find elements to show and hide
var toShow = clicked.next(),
toHide = this.active.next(),
data = {
options: o,
newHeader: clickedIsActive && o.collapsible ? $([]) : clicked,
oldHeader: this.active,
newContent: clickedIsActive && o.collapsible ? $([]) : toShow.find('> *'),
oldContent: toHide.find('> *')
},
down = this.headers.index( this.active[0] ) > this.headers.index( clicked[0] );
this.active = clickedIsActive ? $([]) : clicked;
this._toggle(toShow, toHide, data, clickedIsActive, down);
return false;
},
_toggle: function(toShow, toHide, data, clickedIsActive, down) {
var o = this.options, self = this;
this.toShow = toShow;
this.toHide = toHide;
this.data = data;
var complete = function() { if(!self) return; return self._completed.apply(self, arguments); };
// trigger changestart event
this._trigger("changestart", null, this.data);
// count elements to animate
this.running = toHide.size() === 0 ? toShow.size() : toHide.size();
if (o.animated) {
var animOptions = {};
if ( o.collapsible && clickedIsActive ) {
animOptions = {
toShow: $([]),
toHide: toHide,
complete: complete,
down: down,
autoHeight: o.autoHeight || o.fillSpace
};
} else {
animOptions = {
toShow: toShow,
toHide: toHide,
complete: complete,
down: down,
autoHeight: o.autoHeight || o.fillSpace
};
}
if (!o.proxied) {
o.proxied = o.animated;
}
if (!o.proxiedDuration) {
o.proxiedDuration = o.duration;
}
o.animated = $.isFunction(o.proxied) ?
o.proxied(animOptions) : o.proxied;
o.duration = $.isFunction(o.proxiedDuration) ?
o.proxiedDuration(animOptions) : o.proxiedDuration;
var animations = $.ui.accordion.animations,
duration = o.duration,
easing = o.animated;
if (!animations[easing]) {
animations[easing] = function(options) {
this.slide(options, {
easing: easing,
duration: duration || 700
});
};
}
animations[easing](animOptions);
} else {
if (o.collapsible && clickedIsActive) {
toShow.toggle();
} else {
toHide.hide();
toShow.show();
}
complete(true);
}
toHide.prev().attr('aria-expanded','false').attr("tabIndex", "-1").blur();
toShow.prev().attr('aria-expanded','true').attr("tabIndex", "0").focus();
},
_completed: function(cancel) {
var o = this.options;
this.running = cancel ? 0 : --this.running;
if (this.running) return;
if (o.clearStyle) {
this.toShow.add(this.toHide).css({
height: "",
overflow: ""
});
}
this._trigger('change', null, this.data);
}
});
$.extend($.ui.accordion, {
version: "1.7.1",
defaults: {
active: null,
alwaysOpen: true, //deprecated, use collapsible
animated: 'slide',
autoHeight: true,
clearStyle: false,
collapsible: false,
event: "click",
fillSpace: false,
header: "> li > :first-child,> :not(li):even",
icons: {
header: "ui-icon-triangle-1-e",
headerSelected: "ui-icon-triangle-1-s"
},
navigation: false,
navigationFilter: function() {
return this.href.toLowerCase() == location.href.toLowerCase();
}
},
animations: {
slide: function(options, additions) {
options = $.extend({
easing: "swing",
duration: 300
}, options, additions);
if ( !options.toHide.size() ) {
options.toShow.animate({height: "show"}, options);
return;
}
if ( !options.toShow.size() ) {
options.toHide.animate({height: "hide"}, options);
return;
}
var overflow = options.toShow.css('overflow'),
percentDone,
showProps = {},
hideProps = {},
fxAttrs = [ "height", "paddingTop", "paddingBottom" ],
originalWidth;
// fix width before calculating height of hidden element
var s = options.toShow;
originalWidth = s[0].style.width;
s.width( parseInt(s.parent().width(),10) - parseInt(s.css("paddingLeft"),10) - parseInt(s.css("paddingRight"),10) - (parseInt(s.css("borderLeftWidth"),10) || 0) - (parseInt(s.css("borderRightWidth"),10) || 0) );
$.each(fxAttrs, function(i, prop) {
hideProps[prop] = 'hide';
var parts = ('' + $.css(options.toShow[0], prop)).match(/^([\d+-.]+)(.*)$/);
showProps[prop] = {
value: parts[1],
unit: parts[2] || 'px'
};
});
options.toShow.css({ height: 0, overflow: 'hidden' }).show();
options.toHide.filter(":hidden").each(options.complete).end().filter(":visible").animate(hideProps,{
step: function(now, settings) {
// only calculate the percent when animating height
// IE gets very inconsistent results when animating elements
// with small values, which is common for padding
if (settings.prop == 'height') {
percentDone = (settings.now - settings.start) / (settings.end - settings.start);
}
options.toShow[0].style[settings.prop] =
(percentDone * showProps[settings.prop].value) + showProps[settings.prop].unit;
},
duration: options.duration,
easing: options.easing,
complete: function() {
if ( !options.autoHeight ) {
options.toShow.css("height", "");
}
options.toShow.css("width", originalWidth);
options.toShow.css({overflow: overflow});
options.complete();
}
});
},
bounceslide: function(options) {
this.slide(options, {
easing: options.down ? "easeOutBounce" : "swing",
duration: options.down ? 1000 : 200
});
},
easeslide: function(options) {
this.slide(options, {
easing: "easeinout",
duration: 700
});
}
}
});
})(jQuery);

View File

@ -1,519 +0,0 @@
/*
* jQuery UI 1.7.1
*
* Copyright (c) 2009 AUTHORS.txt (http://jqueryui.com/about)
* Dual licensed under the MIT (MIT-LICENSE.txt)
* and GPL (GPL-LICENSE.txt) licenses.
*
* http://docs.jquery.com/UI
*/
;jQuery.ui || (function($) {
var _remove = $.fn.remove,
isFF2 = $.browser.mozilla && (parseFloat($.browser.version) < 1.9);
//Helper functions and ui object
$.ui = {
version: "1.7.1",
// $.ui.plugin is deprecated. Use the proxy pattern instead.
plugin: {
add: function(module, option, set) {
var proto = $.ui[module].prototype;
for(var i in set) {
proto.plugins[i] = proto.plugins[i] || [];
proto.plugins[i].push([option, set[i]]);
}
},
call: function(instance, name, args) {
var set = instance.plugins[name];
if(!set || !instance.element[0].parentNode) { return; }
for (var i = 0; i < set.length; i++) {
if (instance.options[set[i][0]]) {
set[i][1].apply(instance.element, args);
}
}
}
},
contains: function(a, b) {
return document.compareDocumentPosition
? a.compareDocumentPosition(b) & 16
: a !== b && a.contains(b);
},
hasScroll: function(el, a) {
//If overflow is hidden, the element might have extra content, but the user wants to hide it
if ($(el).css('overflow') == 'hidden') { return false; }
var scroll = (a && a == 'left') ? 'scrollLeft' : 'scrollTop',
has = false;
if (el[scroll] > 0) { return true; }
// TODO: determine which cases actually cause this to happen
// if the element doesn't have the scroll set, see if it's possible to
// set the scroll
el[scroll] = 1;
has = (el[scroll] > 0);
el[scroll] = 0;
return has;
},
isOverAxis: function(x, reference, size) {
//Determines when x coordinate is over "b" element axis
return (x > reference) && (x < (reference + size));
},
isOver: function(y, x, top, left, height, width) {
//Determines when x, y coordinates is over "b" element
return $.ui.isOverAxis(y, top, height) && $.ui.isOverAxis(x, left, width);
},
keyCode: {
BACKSPACE: 8,
CAPS_LOCK: 20,
COMMA: 188,
CONTROL: 17,
DELETE: 46,
DOWN: 40,
END: 35,
ENTER: 13,
ESCAPE: 27,
HOME: 36,
INSERT: 45,
LEFT: 37,
NUMPAD_ADD: 107,
NUMPAD_DECIMAL: 110,
NUMPAD_DIVIDE: 111,
NUMPAD_ENTER: 108,
NUMPAD_MULTIPLY: 106,
NUMPAD_SUBTRACT: 109,
PAGE_DOWN: 34,
PAGE_UP: 33,
PERIOD: 190,
RIGHT: 39,
SHIFT: 16,
SPACE: 32,
TAB: 9,
UP: 38
}
};
// WAI-ARIA normalization
if (isFF2) {
var attr = $.attr,
removeAttr = $.fn.removeAttr,
ariaNS = "http://www.w3.org/2005/07/aaa",
ariaState = /^aria-/,
ariaRole = /^wairole:/;
$.attr = function(elem, name, value) {
var set = value !== undefined;
return (name == 'role'
? (set
? attr.call(this, elem, name, "wairole:" + value)
: (attr.apply(this, arguments) || "").replace(ariaRole, ""))
: (ariaState.test(name)
? (set
? elem.setAttributeNS(ariaNS,
name.replace(ariaState, "aaa:"), value)
: attr.call(this, elem, name.replace(ariaState, "aaa:")))
: attr.apply(this, arguments)));
};
$.fn.removeAttr = function(name) {
return (ariaState.test(name)
? this.each(function() {
this.removeAttributeNS(ariaNS, name.replace(ariaState, ""));
}) : removeAttr.call(this, name));
};
}
//jQuery plugins
$.fn.extend({
remove: function() {
// Safari has a native remove event which actually removes DOM elements,
// so we have to use triggerHandler instead of trigger (#3037).
$("*", this).add(this).each(function() {
$(this).triggerHandler("remove");
});
return _remove.apply(this, arguments );
},
enableSelection: function() {
return this
.attr('unselectable', 'off')
.css('MozUserSelect', '')
.unbind('selectstart.ui');
},
disableSelection: function() {
return this
.attr('unselectable', 'on')
.css('MozUserSelect', 'none')
.bind('selectstart.ui', function() { return false; });
},
scrollParent: function() {
var scrollParent;
if(($.browser.msie && (/(static|relative)/).test(this.css('position'))) || (/absolute/).test(this.css('position'))) {
scrollParent = this.parents().filter(function() {
return (/(relative|absolute|fixed)/).test($.curCSS(this,'position',1)) && (/(auto|scroll)/).test($.curCSS(this,'overflow',1)+$.curCSS(this,'overflow-y',1)+$.curCSS(this,'overflow-x',1));
}).eq(0);
} else {
scrollParent = this.parents().filter(function() {
return (/(auto|scroll)/).test($.curCSS(this,'overflow',1)+$.curCSS(this,'overflow-y',1)+$.curCSS(this,'overflow-x',1));
}).eq(0);
}
return (/fixed/).test(this.css('position')) || !scrollParent.length ? $(document) : scrollParent;
}
});
//Additional selectors
$.extend($.expr[':'], {
data: function(elem, i, match) {
return !!$.data(elem, match[3]);
},
focusable: function(element) {
var nodeName = element.nodeName.toLowerCase(),
tabIndex = $.attr(element, 'tabindex');
return (/input|select|textarea|button|object/.test(nodeName)
? !element.disabled
: 'a' == nodeName || 'area' == nodeName
? element.href || !isNaN(tabIndex)
: !isNaN(tabIndex))
// the element and all of its ancestors must be visible
// the browser may report that the area is hidden
&& !$(element)['area' == nodeName ? 'parents' : 'closest'](':hidden').length;
},
tabbable: function(element) {
var tabIndex = $.attr(element, 'tabindex');
return (isNaN(tabIndex) || tabIndex >= 0) && $(element).is(':focusable');
}
});
// $.widget is a factory to create jQuery plugins
// taking some boilerplate code out of the plugin code
function getter(namespace, plugin, method, args) {
function getMethods(type) {
var methods = $[namespace][plugin][type] || [];
return (typeof methods == 'string' ? methods.split(/,?\s+/) : methods);
}
var methods = getMethods('getter');
if (args.length == 1 && typeof args[0] == 'string') {
methods = methods.concat(getMethods('getterSetter'));
}
return ($.inArray(method, methods) != -1);
}
$.widget = function(name, prototype) {
var namespace = name.split(".")[0];
name = name.split(".")[1];
// create plugin method
$.fn[name] = function(options) {
var isMethodCall = (typeof options == 'string'),
args = Array.prototype.slice.call(arguments, 1);
// prevent calls to internal methods
if (isMethodCall && options.substring(0, 1) == '_') {
return this;
}
// handle getter methods
if (isMethodCall && getter(namespace, name, options, args)) {
var instance = $.data(this[0], name);
return (instance ? instance[options].apply(instance, args)
: undefined);
}
// handle initialization and non-getter methods
return this.each(function() {
var instance = $.data(this, name);
// constructor
(!instance && !isMethodCall &&
$.data(this, name, new $[namespace][name](this, options))._init());
// method call
(instance && isMethodCall && $.isFunction(instance[options]) &&
instance[options].apply(instance, args));
});
};
// create widget constructor
$[namespace] = $[namespace] || {};
$[namespace][name] = function(element, options) {
var self = this;
this.namespace = namespace;
this.widgetName = name;
this.widgetEventPrefix = $[namespace][name].eventPrefix || name;
this.widgetBaseClass = namespace + '-' + name;
this.options = $.extend({},
$.widget.defaults,
$[namespace][name].defaults,
$.metadata && $.metadata.get(element)[name],
options);
this.element = $(element)
.bind('setData.' + name, function(event, key, value) {
if (event.target == element) {
return self._setData(key, value);
}
})
.bind('getData.' + name, function(event, key) {
if (event.target == element) {
return self._getData(key);
}
})
.bind('remove', function() {
return self.destroy();
});
};
// add widget prototype
$[namespace][name].prototype = $.extend({}, $.widget.prototype, prototype);
// TODO: merge getter and getterSetter properties from widget prototype
// and plugin prototype
$[namespace][name].getterSetter = 'option';
};
$.widget.prototype = {
_init: function() {},
destroy: function() {
this.element.removeData(this.widgetName)
.removeClass(this.widgetBaseClass + '-disabled' + ' ' + this.namespace + '-state-disabled')
.removeAttr('aria-disabled');
},
option: function(key, value) {
var options = key,
self = this;
if (typeof key == "string") {
if (value === undefined) {
return this._getData(key);
}
options = {};
options[key] = value;
}
$.each(options, function(key, value) {
self._setData(key, value);
});
},
_getData: function(key) {
return this.options[key];
},
_setData: function(key, value) {
this.options[key] = value;
if (key == 'disabled') {
this.element
[value ? 'addClass' : 'removeClass'](
this.widgetBaseClass + '-disabled' + ' ' +
this.namespace + '-state-disabled')
.attr("aria-disabled", value);
}
},
enable: function() {
this._setData('disabled', false);
},
disable: function() {
this._setData('disabled', true);
},
_trigger: function(type, event, data) {
var callback = this.options[type],
eventName = (type == this.widgetEventPrefix
? type : this.widgetEventPrefix + type);
event = $.Event(event);
event.type = eventName;
// copy original event properties over to the new event
// this would happen if we could call $.event.fix instead of $.Event
// but we don't have a way to force an event to be fixed multiple times
if (event.originalEvent) {
for (var i = $.event.props.length, prop; i;) {
prop = $.event.props[--i];
event[prop] = event.originalEvent[prop];
}
}
this.element.trigger(event, data);
return !($.isFunction(callback) && callback.call(this.element[0], event, data) === false
|| event.isDefaultPrevented());
}
};
$.widget.defaults = {
disabled: false
};
/** Mouse Interaction Plugin **/
$.ui.mouse = {
_mouseInit: function() {
var self = this;
this.element
.bind('mousedown.'+this.widgetName, function(event) {
return self._mouseDown(event);
})
.bind('click.'+this.widgetName, function(event) {
if(self._preventClickEvent) {
self._preventClickEvent = false;
event.stopImmediatePropagation();
return false;
}
});
// Prevent text selection in IE
if ($.browser.msie) {
this._mouseUnselectable = this.element.attr('unselectable');
this.element.attr('unselectable', 'on');
}
this.started = false;
},
// TODO: make sure destroying one instance of mouse doesn't mess with
// other instances of mouse
_mouseDestroy: function() {
this.element.unbind('.'+this.widgetName);
// Restore text selection in IE
($.browser.msie
&& this.element.attr('unselectable', this._mouseUnselectable));
},
_mouseDown: function(event) {
// don't let more than one widget handle mouseStart
// TODO: figure out why we have to use originalEvent
event.originalEvent = event.originalEvent || {};
if (event.originalEvent.mouseHandled) { return; }
// we may have missed mouseup (out of window)
(this._mouseStarted && this._mouseUp(event));
this._mouseDownEvent = event;
var self = this,
btnIsLeft = (event.which == 1),
elIsCancel = (typeof this.options.cancel == "string" ? $(event.target).parents().add(event.target).filter(this.options.cancel).length : false);
if (!btnIsLeft || elIsCancel || !this._mouseCapture(event)) {
return true;
}
this.mouseDelayMet = !this.options.delay;
if (!this.mouseDelayMet) {
this._mouseDelayTimer = setTimeout(function() {
self.mouseDelayMet = true;
}, this.options.delay);
}
if (this._mouseDistanceMet(event) && this._mouseDelayMet(event)) {
this._mouseStarted = (this._mouseStart(event) !== false);
if (!this._mouseStarted) {
event.preventDefault();
return true;
}
}
// these delegates are required to keep context
this._mouseMoveDelegate = function(event) {
return self._mouseMove(event);
};
this._mouseUpDelegate = function(event) {
return self._mouseUp(event);
};
$(document)
.bind('mousemove.'+this.widgetName, this._mouseMoveDelegate)
.bind('mouseup.'+this.widgetName, this._mouseUpDelegate);
// preventDefault() is used to prevent the selection of text here -
// however, in Safari, this causes select boxes not to be selectable
// anymore, so this fix is needed
($.browser.safari || event.preventDefault());
event.originalEvent.mouseHandled = true;
return true;
},
_mouseMove: function(event) {
// IE mouseup check - mouseup happened when mouse was out of window
if ($.browser.msie && !event.button) {
return this._mouseUp(event);
}
if (this._mouseStarted) {
this._mouseDrag(event);
return event.preventDefault();
}
if (this._mouseDistanceMet(event) && this._mouseDelayMet(event)) {
this._mouseStarted =
(this._mouseStart(this._mouseDownEvent, event) !== false);
(this._mouseStarted ? this._mouseDrag(event) : this._mouseUp(event));
}
return !this._mouseStarted;
},
_mouseUp: function(event) {
$(document)
.unbind('mousemove.'+this.widgetName, this._mouseMoveDelegate)
.unbind('mouseup.'+this.widgetName, this._mouseUpDelegate);
if (this._mouseStarted) {
this._mouseStarted = false;
this._preventClickEvent = (event.target == this._mouseDownEvent.target);
this._mouseStop(event);
}
return false;
},
_mouseDistanceMet: function(event) {
return (Math.max(
Math.abs(this._mouseDownEvent.pageX - event.pageX),
Math.abs(this._mouseDownEvent.pageY - event.pageY)
) >= this.options.distance
);
},
_mouseDelayMet: function(event) {
return this.mouseDelayMet;
},
// These are placeholder methods, to be overriden by extending plugin
_mouseStart: function(event) {},
_mouseDrag: function(event) {},
_mouseStop: function(event) {},
_mouseCapture: function(event) { return true; }
};
$.ui.mouse.defaults = {
cancel: null,
distance: 1,
delay: 0
};
})(jQuery);

View File

@ -1,705 +0,0 @@
/********************************************
AUTHOR: Erwin Aligam
WEBSITE: http://www.styleshout.com/
TEMPLATE NAME: Techmania 1.0
TEMPLATE CODE: S-0003
VERSION: 1.1
*******************************************/
/********************************************
HTML ELEMENTS
********************************************/ /* Top elements */
/** { margin:0; padding: 0; }*/
body {
background-color: #000;
color: #555;
font: 78%/ 1.6 Verdana, 'Trebuchet MS', arial, sans-serif;
text-align: center;
margin: 15px 0;
}
/* links */
a {
color: #213540;
background: inherit;
text-decoration: none;
}
a:hover {
color: #3e4255;
text-decoration: underline;
background: inherit;
}
/* headers */
h1,h2,h3 {
font-family: 'Trebuchet MS', Arial, sans-serif;
font-weight: bold;
}
h1 {
font-size: 1.5em;
margin: 10px 15px;
}
h2 {
font-size: 1.3em;
text-transform: uppercase;
color: #339900;
margin: 10px 15px;
}
h3 {
font-size: 1.1em;
color: #333;
margin: 16px 0 0 18px;
}
h1,h2,h3 {
padding: 0;
}
p {
line-height: 1.4em;
padding: 0 15px;
}
p.error {
color: #CC0033;
}
ul,ol {
margin: 10px 6px;
padding: 0 15px;
color: #006699;
}
ul span,ol span {
color: #666666;
}
/* images */
img {
border: 2px solid #CCC;
}
img.float-right {
margin: 5px 0px 10px 10px;
}
img.float-left {
margin: 5px 10px 10px 0px;
}
code {
margin: 5px 0;
padding: 10px;
text-align: left;
display: block;
overflow: auto;
font: 500 1em/ 1.5em 'Lucida Console', 'courier new', monospace;
/* white-space: pre; */
background: #FAFAFA;
border: 1px solid #EAEAEA;
border-left: 5px solid #72A545;
}
acronym {
cursor: help;
border-bottom: 1px solid #777;
}
blockquote {
margin: 15px;
padding: 0 0 0 32px;
background: #FAFAFA url(quote.gif) no-repeat 5px 10px !important;
background-position: 8px 10px;
border: 1px solid #EAEAEA;
border-left: 5px solid #72A545;
font-weight: bold;
}
/* form elements */
fieldset {
margin: 12px 12px 18px;
padding-left: 6px;
border: 1px solid #004080;
color: #006699;
}
fieldset fieldset {
border: 1px solid #9ea190;
margin: 17px 14px;
}
form {
margin: 10px 15px;
padding: 0;
}
label {
font-weight: bold;
margin: 5px 3px 0 0;
width: 160px;
text-align: right;
float: left;
}
legend {
font-size: 1.2em;
padding: 0 12px;
font-weight: 900;
background-color: #F9F9F9;
}
fieldset fieldset legend {
font-size: 1em;
color: #1a2129;
padding: 0 18px;
margin-left: 75px;
}
input {
padding: 3px;
margin: 4px 0;
border: 1px solid #CFCED3;
font: normal 1em Verdana, sans-serif;
color: #777;
}
textarea {
width: 400px;
padding: 4px;
font: normal 1em Verdana, sans-serif;
border: 1px solid #eee;
height: 100px;
display: block;
color: #777;
}
input.button {
margin: 0;
font: bold 12px Arial, Sans-serif;
border: 1px solid #EAEAEA;
padding: 3px 4px;
background: #CCC url(buttonbg.gif) repeat-x left bottom;
color: #333; /* color: #339900; */
cursor: pointer;
}
input.submitbutton {
background-color: #006699;
color: #FFF;
background-image: none;
font-weight: 900;
border: 1px solid #EAEAEA;
margin: 0 0 0 200px;
}
/* search */
#sidebar #search {
background: #f2f2f2;
margin: 0 15px;
padding: 5px 0;
}
#sidebar #search img {
vertical-align: bottom;
}
#sidebar #search .textbox {
background: #FFF url(input.png) no-repeat top left;
border: 1px solid #EAEAEA;
font-size: 11px;
padding: 3px;
width: 110px;
}
#sidebar #search input.searchbutton {
margin: 0;
font: bold 100% Arial, Sans-serif;
border: 1px solid #CCC;
background: #CCC url(buttonbg.gif) repeat-x left bottom;
padding: 1px;
height: 25px;
color: #333;
width: 55px;
}
/*****************************
LAYOUT
******************************/
#wrap {
margin: 0 auto;
padding: 0;
text-align: left;
background-color: #FFF;
width: 790px;
}
#content-wrap {
clear: both;
margin: 0;
padding: 0;
width: 790px;
}
/* header */
#header {
position: relative;
clear: left;
width: 790px;
height: 137px;
margin: 0;
padding: 0;
background: #000 url(headerbg.jpg) no-repeat left bottom;
}
#header h1#logo-text {
float: right;
margin: 39px 58px 0 0;
padding: 0;
font: bolder 3.2em 'Trebuchet MS', Arial, Sans-serif;
letter-spacing: -2px;
color: #FFF;
text-transform: none;
/* change the values of top and right to adjust the position of the logo*/
top: 35px;
right: 30px;
}
#header h2#slogan {
float: right;
margin: 0 38px 0 0;
padding: 0;
font: bold 1.5em 'Trebuchet MS', Arial, Sans-serif;
text-transform: none;
letter-spacing: 1px;
color: #FFF;
clear: both;
text-align: right;
}
#header h1#logo-text span {
color: #CFCED3;
}
/* menu tabs */
#header #header-tabs {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 25px;
background: #000;
font: bold 1.1em Verdana, Tahoma, 'Trebuchet MS', Sans-serif;
}
#header-tabs ul {
margin: 0;
padding: 2px 0px 0px 0px;
list-style: none;
}
#header-tabs li {
display: inline;
margin: 0;
padding: 0;
}
#header-tabs a {
float: left;
background: url(tableft.gif) no-repeat left top;
margin: 0;
padding: 0 0 0 4px;
text-decoration: none;
}
#header-tabs a span {
float: left;
display: block;
background: url(tabright.gif) no-repeat right top;
padding: 7px 15px 4px 8px;
color: #CCC;
}
/* Commented Backslash Hack hides rule from IE5-Mac \*/
#header-tabs a span {
float: none;
}
/* End IE5-Mac hack */
#header-tabs a:hover span {
color: #FFF;
}
#header-tabs a:hover {
background-position: 0% -42px;
}
#header-tabs a:hover span {
background-position: 100% -42px;
}
#header-tabs #current a {
background-position: 0% -42px;
}
#header-tabs #current a span {
background-position: 100% -42px;
color: #FFF;
}
/* main content */
#main {
width: 748px;
margin: 0;
padding: 8px 16px;
background-color: #F9F9F9;
border-left: 5px solid #000;
border-right: 5px solid #000;
}
#main h1 {
padding: 8px 0 3px 25px;
text-transform: none;
border-bottom: 2px solid #f2f2f2;
color: #339900;
}
/* sidebar */
#sidebar { /* float: right;
width: 245px;
margin: 0 0 10px 0; padding: 0;
background-color: inherit; */
display: none;
}
#sidebar h1 {
padding: 8px 0px 3px 25px;
background: url(square_arrow.gif) no-repeat 0% .7em;
text-transform: none;
color: #339900;
}
#sidebar ul.sidemenu {
list-style: none;
margin: 10px 15px;
padding: 0;
}
#sidebar ul.sidemenu li {
margin-bottom: 1px;
border: 1px solid #f2f2f2;
}
#sidebar ul.sidemenu a {
display: block;
font-weight: bold;
color: #333;
text-decoration: none;
padding: 2px 5px 2px 10px;
background: #f2f2f2;
border-left: 5px solid #CCC;
min-height: 18px;
}
* html body #sidebar ul.sidemenu a {
height: 18px;
}
#sidebar ul.sidemenu a:hover {
padding: 2px 5px 2px 10px;
background: #f2f2f2;
color: #339900;
border-left: 5px solid #72A545;
}
/* footer */
#footer {
clear: both;
height: 40px;
color: #CCC;
background: #000;
margin: 0;
font-size: 92%;
}
#footer a {
text-decoration: none;
font-weight: bold;
color: #FFF;
}
#footer #footer-left {
width: 68%;
float: left;
text-align: left;
margin: 0;
padding: 10px;
}
#footer #footer-right {
width: 25%;
float: right;
text-align: right;
margin: 0;
padding: 10px;
}
/* alignment classes */
.float-left {
float: left;
}
.float-right {
float: right;
}
.align-left {
text-align: left;
}
.align-right {
text-align: right;
}
/* additional classes */
.clear {
clear: both;
}
.hide {
display: none;
}
.gray {
color: #CCC;
}
.comments {
color: #333;
background: #FFF;
text-align: right;
border-top: 1px dashed #EFF0F1;
border-bottom: 1px dashed #EFF0F1;
padding: 5px 0;
margin-top: 20px;
}
html {
min-height: 100.1%;
}
/* ------ one ------------*/
body .mainText {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
}
#demoText h1,.mainText h1 {
font-size: 130%;
color: #0099FF;
text-decoration: none;
font-family: Arial, Helvetica, sans-serif;
margin: 5px 4px 5px 24px;
background: none;
padding: 0;
border: none;
text-transform: capitalize;
}
.mainText h2 {
font-size: 110%;
color: #000033;
font-family: Arial, Helvetica, sans-serif;
text-decoration: none;
background: none;
margin: 4px 32px 6px 22px;
text-transform: capitalize;
}
.mainText h3 {
font-size: 120%;
font-weight: 900;
margin: 14px 0 0 0;
text-align: center;
color: #000033;
}
.mainText table {
width: 95%;
border: 1px solid #0099FF;
border-collapse: collapse;
margin: 18px 7px;
}
.mainText table td {
background-color: #99CCFF;
color: #000033;
padding: 4px;
}
.mainText table th {
background-color: #000033;
color: #99CCFF;
padding: 4px;
}
.mainText .linkPar a {
color: #000033;
text-decoration: underline;
}
.mainText .linkPar a:hover {
color: #660033;
text-decoration: none;
font-weight: 900;
}
.pusher {
cursor: pointer;
padding: 3px 10px 3px 22px;
font-weight: 900;
font-size: 14px;
}
/* ------------- form specific styles are here -------------- */
fieldset {
margin: 0;
border: 1px solid #C3DE00;
padding: 10px;
/*border:none;
padding:0;*/
color: #7563A5;
}
legend {
background-color: #FFFFFF;
text-align: center;
color: #097981;
padding: 0 12px;
}
label {
text-align: right;
width: 298px;
border-right: 1px dotted #099;
padding-right: 5px;
margin: 0 0 8px 0;
float: left;
clear: left;
display: block;
color: #7563A5;
}
label.checkbox,label.textarea {
border: none;
}
label.lgfield {
border: none;
text-align: center;
clear: both;
float: none;
width: 100%;
}
fieldset input,fieldset select,fieldset textarea {
margin-left: 10px;
margin-bottom: 8px;
}
select.longfield {
margin: 0 0 0 115px;
}
input [type="radio"],input [type="checkbox"] {
margin: 2px 0 0 4px;
}
textarea {
width: 250px;
float: left;
}
/*Get Help Form Styles*/
p.formDisclaimer {
text-align: center;
margin: 32px 24px 12px 0;
font-style: italic;
}
div.buttonWrapper {
margin: 28px 0 14px 0;
clear: both;
text-align: center;
}
.formspacer {
height: 1em;
clear: both;
}
.hideField {
display: none;
}
.pushOpen {
height: 18em;
}
/* ----- error message for field validation ----- */
#stepForm label.warning {
text-align: left;
width: auto;
padding: 0;
margin: 0 0 0 10px;
float: none;
clear: none;
display: inline;
color: #CC3366;
font-size: 10px;
border: none;
border-top: 1px dotted #CC3366;
}
div.requiredNotice {
width: 140px;
float: right;
margin: 0 24px 0 0;
padding: 0;
}
h3.stepHeader {
text-align: left;
font-size: 16px;
font-weight: bold;
margin: 0 0 24px 24px;
color: #676cac;
}
ul#stepForm,ul#stepForm li {
margin: 0;
padding: 0;
}
ul#stepForm li {
list-style: none;
}
/* Form Buttons */
input.submitbutton,.nextbutton,.prevbutton {
width: 100px;
height: 40px;
background-color: #663399;
padding: 4px;
border: 1px solid #339933;
cursor: pointer;
text-align: center;
color: #FFFFFF;
margin: 7px;
}
input.submitbutton {
background-color: #006699;
}

View File

@ -1,155 +0,0 @@
<?xml version="1.0" encoding="ISO-8859-1" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title>Test for jQuery validate() plugin</title>
<link rel="stylesheet" type="text/css" media="screen" href="css/screen.css" />
<script src="../lib/jquery.js" type="text/javascript"></script>
<script src="../lib/jquery.metadata.js" type="text/javascript"></script>
<script src="../jquery.validate.js" type="text/javascript"></script>
<script type="text/javascript">
// only for demo purposes
$.validator.setDefaults({
submitHandler: function() {
alert("submitted!");
}
});
$.metadata.setType("attr", "validate");
$(document).ready(function() {
$("#form1").validate();
$("#selecttest").validate();
});
</script>
<style type="text/css">
.block { display: block; }
form.cmxform label.error { display: none; }
</style>
</head>
<body>
<h1 id="banner"><a href="http://bassistance.de/jquery-plugins/jquery-plugin-validation/">jQuery Validation Plugin</a> Demo</h1>
<div id="main">
<form class="cmxform" id="form1" method="get" action="">
<fieldset>
<legend>Validating a form with a radio and checkbox buttons</legend>
<fieldset>
<legend>Gender</legend>
<label for="gender_male">
<input type="radio" id="gender_male" value="m" name="gender" validate="required:true" />
Male
</label>
<label for="gender_female">
<input type="radio" id="gender_female" value="f" name="gender"/>
Female
</label>
<label for="gender" class="error">Please select your gender</label>
</fieldset>
<fieldset>
<legend>Family</legend>
<label for="family_single">
<input type="radio" id="family_single" value="s" name="family" validate="required:true" />
Single
</label>
<label for="family_married">
<input type="radio" id="family_married" value="m" name="family" />
Married
</label>
<label for="family_other">
<input type="radio" id="family_other" value="o" name="family" />
Other
</label>
<label for="family" class="error">Please select your family status.</label>
</fieldset>
<p>
<label for="agree">Please agree to our policy</label>
<input type="checkbox" class="checkbox" id="agree" name="agree" validate="required:true" />
<br/>
<label for="agree" class="error block">Please agree to our policy!</label>
</p>
<fieldset>
<legend>Spam</legend>
<label for="spam_email">
<input type="checkbox" class="checkbox" id="spam_email" value="email" name="spam[]" validate="required:true, minlength:2" />
Spam via E-Mail
</label>
<label for="spam_phone">
<input type="checkbox" class="checkbox" id="spam_phone" value="phone" name="spam[]" />
Spam via Phone
</label>
<label for="spam_mail">
<input type="checkbox" class="checkbox" id="spam_mail" value="mail" name="spam[]" />
Spam via Mail
</label>
<label for="spam[]" class="error">Please select at least two types of spam.</label>
</fieldset>
<p>
<input class="submit" type="submit" value="Submit"/>
</p>
</fieldset>
</form>
<form id="selecttest">
<h2>Some tests with selects</h2>
<p>
<label for="jungle">Please select a jungle noun</label><br/>
<select id="jungle" name="jungle" title="Please select something!" validate="required:true">
<option value=""></option>
<option value="1">Buga</option>
<option value="2">Baga</option>
<option value="3">Oi</option>
</select>
</p>
<p>
<label for="fruit">Please select at least two fruits</label><br/>
<select id="fruit" name="fruit" title="Please select at least two fruits" validate="required:true, minlength:2" multiple="multiple">
<option value="b">Banana</option>
<option value="a">Apple</option>
<option value="p">Peach</option>
<option value="t">Turtle</option>
</select>
</p>
<p>
<label for="vegetables">Please select no more than two vergetables</label><br/>
<select id="vegetables" name="vegetables" title="Please select no more than two vergetables" validate="required:true, maxlength:2" multiple="multiple">
<option value="p">Potato</option>
<option value="t">Tomato</option>
<option value="s">Salad</option>
</select>
</p>
<p>
<label for="cars">Please select at least two cars, but no more than three</label><br/>
<select id="cars" name="cars" title="Please select at least two cars, but no more than three" validate="required:true, rangelength:[2,3]" multiple="multiple">
<option value="m_sl">Mercedes SL</option>
<option value="o_c">Opel Corsa</option>
<option value="vw_p">VW Polo</option>
<option value="t_s">Titanic Skoda</option>
</select>
</p>
<p><input type="submit" value="Validate Selecttests"/></p>
</form>
<a href="index.html">Back to main page</a>
</div>
<script src="http://www.google-analytics.com/urchin.js" type="text/javascript">
</script>
<script type="text/javascript">
_uacct = "UA-2623402-1";
urchinTracker();
</script>
</body>
</html>

View File

@ -1,157 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>jQuery UI tabs integration demo</title>
<link rel="stylesheet" type="text/css" media="screen" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.1/themes/base/jquery-ui.css" />
<script src="../../lib/jquery.js" type="text/javascript"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.1/jquery-ui.min.js" type="text/javascript"></script>
<script src="../../jquery.validate.js" type="text/javascript"></script>
<script id="demo" type="text/javascript">
$(document).ready(function() {
var tabs = $("#tabs").tabs();
var validator = $("#signupform").validate({
groups: {
birthdate: "birthdateDay birthdateMonth birthdateYear"
},
errorPlacement: function(label, element) {
if (/^birthdate/.test(element[0].name)) {
label.insertAfter("#birthdateYear");
} else {
label.insertAfter(element);
}
}
});
// validate the other two selects when one changes to update the whole group
var birthdaySelects = $("#birthdateGroup select").click(function() {
birthdaySelects.not(this).valid();
})
// overwrite focusInvalid to activate tab with invalid elements
validator.focusInvalid = function() {
if( this.settings.focusInvalid ) {
try {
var focused = $(this.findLastActive() || this.errorList.length && this.errorList[0].element || []).filter(":visible");
tabs.tabs("select", tabs.find(">div").index(focused.parent().parent()));
focused.focus();
} catch(e) {
// ignore IE throwing errors when focusing hidden elements
}
}
};
});
</script>
<style>
body { font-size: 65.2% }
label { display: inline-block; width: 8em; }
label.error { color: red; margin-left: 0.5em; width: 20em; }
</style>
</head>
<body>
<form id="signupform">
<div id="tabs">
<ul>
<li><a href="#logindata">Login data</a></li>
<li><a href="#personaldata">Personal data</a></li>
<li><a href="#subscriptions">Subscriptions</a></li>
</ul>
<div id="logindata">
<p>
<label for="username">Username</label>
<input id="username" name="username" class="required" minlength="3" maxlength="20" type="text" />
</p>
<p>
<label for="email">Email address</label>
<input id="email" name="email" class="required email" type="text" />
</p>
<p>
<label for="password">Password</label>
<input name="password" type="password" class="required" id="password" minlength="4" maxlength="50" />
</p>
<p>
<label for="confirmpassword">Confirm Password</label>
<input name="confirmpassword" type="password" class="required" equalTo="#password" id="confirmpassword" />
</p>
</div>
<div id="personaldata">
<p>
<label for="street">Street</label>
<input id="street" name="street" class="required" minlength="3" maxlength="50" type="text" />
</p>
<p>
<label for="city">City</label>
<input id="city" name="city" class="required" minlength="3" maxlength="50" type="text" />
</p>
<p id="birthdateGroup">
<label for="birthdateDay">Birthdate</label>
<select id="birthdateDay" name="birthdateDay" class="required">
<option value="">Day</option>
<option>1</option>
<option>2</option>
<option>3</option>
<option>...</option>
</select>
<select id="birthdateMonth" name="birthdateMonth" class="required">
<option value="">Month</option>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
<option>8</option>
<option>9</option>
<option>10</option>
<option>11</option>
<option>12</option>
</select>
<select id="birthdateYear" name="birthdateYear" class="required">
<option value="">Year</option>
<option>1950</option>
<option>1951</option>
<option>1952</option>
<option>1953</option>
<option>1954</option>
<option>1955</option>
<option>...</option>
</select>
</p>
</div>
<div id="subscriptions">
<p>
<label for="weekly">Weekly Newsletter</label>
<input id="weekly" name="weekly" type="checkbox" />
</p>
<p>
<label for="updates">Product Updates</label>
<input id="updates" name="updates" type="checkbox" />
</p>
<p>
<label for="terms">Terms and conditions</label>
<input id="terms" name="terms" class="required" type="checkbox" />
</p>
</div>
</div>
<input type="submit" />
</form>
<script src="http://www.google-analytics.com/urchin.js" type="text/javascript">
</script>
<script type="text/javascript">
_uacct = "UA-2623402-1";
urchinTracker();
</script>
</body>
</html>

View File

@ -1,227 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title>jQuery validation plug-in - main demo</title>
<link rel="stylesheet" type="text/css" media="screen" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/themes/cupertino/jquery-ui.css" />
<link rel="stylesheet" type="text/css" media="screen" href="http://jquery-ui.googlecode.com/svn/branches/dev/themes/base/ui.button.css" />
<script src="../lib/jquery.js" type="text/javascript"></script>
<script src="../jquery.validate.js" type="text/javascript"></script>
<script src="http://jquery-ui.googlecode.com/svn/tags/latest/ui/jquery.ui.core.js" type="text/javascript"></script>
<script src="http://jquery-ui.googlecode.com/svn/tags/latest/ui/jquery.ui.widget.js" type="text/javascript"></script>
<script src="http://jquery-ui.googlecode.com/svn/tags/latest/ui/jquery.ui.button.js" type="text/javascript"></script>
<script type="text/javascript" src="http://jqueryui.com/themeroller/themeswitchertool/"></script>
<script type="text/javascript">
$.validator.setDefaults({
submitHandler: function() { alert("submitted!"); },
highlight: function(input) {
$(input).addClass("ui-state-highlight");
},
unhighlight: function(input) {
$(input).removeClass("ui-state-highlight");
}
});
$().ready(function() {
$.fn.themeswitcher && $('<div/>').css({
position: "absolute",
right: 10,
top: 10
}).appendTo(document.body).themeswitcher();
// validate the comment form when it is submitted
$("#commentForm").validate();
// validate signup form on keyup and submit
$("#signupForm").validate({
rules: {
firstname: "required",
lastname: "required",
username: {
required: true,
minlength: 2
},
password: {
required: true,
minlength: 5
},
confirm_password: {
required: true,
minlength: 5,
equalTo: "#password"
},
email: {
required: true,
email: true
},
topic: {
required: "#newsletter:checked",
minlength: 2
},
agree: "required"
},
messages: {
firstname: "Please enter your firstname",
lastname: "Please enter your lastname",
username: {
required: "Please enter a username",
minlength: "Your username must consist of at least 2 characters"
},
password: {
required: "Please provide a password",
minlength: "Your password must be at least 5 characters long"
},
confirm_password: {
required: "Please provide a password",
minlength: "Your password must be at least 5 characters long",
equalTo: "Please enter the same password as above"
},
email: "Please enter a valid email address",
agree: "Please accept our policy"
}
});
// propose username by combining first- and lastname
$("#username").focus(function() {
var firstname = $("#firstname").val();
var lastname = $("#lastname").val();
if(firstname && lastname && !this.value) {
this.value = firstname + "." + lastname;
}
});
//code to hide topic selection, disable for demo
var newsletter = $("#newsletter");
// newsletter topics are optional, hide at first
var inital = newsletter.is(":checked");
var topics = $("#newsletter_topics")[inital ? "removeClass" : "addClass"]("gray");
var topicInputs = topics.find("input").attr("disabled", !inital);
// show when newsletter is checked
newsletter.click(function() {
topics[this.checked ? "removeClass" : "addClass"]("gray");
topicInputs.attr("disabled", !this.checked);
});
$("#signupForm input:not(:submit)").addClass("ui-widget-content");
$(":submit").button();
});
</script>
<style type="text/css">
body { font-size: 62.5%; }
label { display: inline-block; width: 100px; }
legend { padding: 0.5em; }
fieldset fieldset label { display: block; }
#commentForm { width: 500px; }
#commentForm label { width: 250px; }
#commentForm label.error, #commentForm button.submit { margin-left: 253px; }
#signupForm { width: 670px; }
#signupForm label.error {
margin-left: 10px;
width: auto;
display: inline;
}
#newsletter_topics label.error {
display: none;
margin-left: 103px;
}
</style>
</head>
<body>
<form class="cmxform" id="commentForm" method="get" action="">
<fieldset class="ui-widget ui-widget-content ui-corner-all">
<legend class="ui-widget ui-widget-header ui-corner-all">Please provide your name, email address (won't be published) and a comment</legend>
<p>
<label for="cname">Name (required, at least 2 characters)</label>
<input id="cname" name="name" class="required ui-widget-content" minlength="2" />
<p>
<label for="cemail">E-Mail (required)</label>
<input id="cemail" name="email" class="required email ui-widget-content" />
</p>
<p>
<label for="curl">URL (optional)</label>
<input id="curl" name="url" class="url ui-widget-content" value="" />
</p>
<p>
<label for="ccomment">Your comment (required)</label>
<textarea id="ccomment" name="comment" class="required ui-widget-content"></textarea>
</p>
<p>
<button class="submit" type="submit">Submit</button>
</p>
</fieldset>
</form>
<form class="cmxform" id="signupForm" method="get" action="">
<fieldset class="ui-widget ui-widget-content ui-corner-all">
<legend class="ui-widget ui-widget-header ui-corner-all">Validating a complete form</legend>
<p>
<label for="firstname">Firstname</label>
<input id="firstname" name="firstname" />
</p>
<p>
<label for="lastname">Lastname</label>
<input id="lastname" name="lastname" />
</p>
<p>
<label for="username">Username</label>
<input id="username" name="username" />
</p>
<p>
<label for="password">Password</label>
<input id="password" name="password" type="password" />
</p>
<p>
<label for="confirm_password">Confirm password</label>
<input id="confirm_password" name="confirm_password" type="password" />
</p>
<p>
<label for="email">Email</label>
<input id="email" name="email" />
</p>
<p>
<label for="agree">Please agree to our policy</label>
<input type="checkbox" class="checkbox" id="agree" name="agree" />
</p>
<p>
<label for="newsletter">I'd like to receive the newsletter</label>
<input type="checkbox" class="checkbox" id="newsletter" name="newsletter" />
</p>
<fieldset id="newsletter_topics" class="ui-widget-content ui-corner-all">
<legend class="ui-widget-header ui-corner-all">Topics (select at least two) - note: would be hidden when newsletter isn't selected, but is visible here for the demo</legend>
<label for="topic_marketflash">
<input type="checkbox" id="topic_marketflash" value="marketflash" name="topic" />
Marketflash
</label>
<label for="topic_fuzz">
<input type="checkbox" id="topic_fuzz" value="fuzz" name="topic" />
Latest fuzz
</label>
<label for="topic_digester">
<input type="checkbox" id="topic_digester" value="digester" name="topic" />
Mailing list digester
</label>
<label for="topic" class="error">Please select at least two topics you'd like to receive.</label>
</fieldset>
<p>
<button class="submit" type="submit">Submit</button>
</p>
</fieldset>
</form>
<script src="http://www.google-analytics.com/urchin.js" type="text/javascript">
</script>
<script type="text/javascript">
_uacct = "UA-2623402-1";
urchinTracker();
</script>
</body>
</html>

View File

@ -1,75 +0,0 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>jQuery Validation plugin: integration with TinyMCE</title>
<script type="text/javascript" src="../../lib/jquery.js"></script>
<script type="text/javascript" src="../../jquery.validate.js"></script>
<script type="text/javascript" src="tiny_mce.js"></script>
<script type="text/javascript">
tinyMCE.init({
mode : "textareas",
theme : "simple",
// update validation status on change
onchange_callback: function(editor) {
tinyMCE.triggerSave();
$("#" + editor.id).valid();
}
});
$(function() {
var validator = $("#myform").submit(function() {
// update underlying textarea before submit validation
tinyMCE.triggerSave();
}).validate({
rules: {
title: "required",
content: "required"
},
errorPlacement: function(label, element) {
// position error label after generated textarea
if (element.is("textarea")) {
label.insertAfter(element.next());
} else {
label.insertAfter(element)
}
}
});
validator.focusInvalid = function() {
// put focus on tinymce on submit validation
if( this.settings.focusInvalid ) {
try {
var toFocus = $(this.findLastActive() || this.errorList.length && this.errorList[0].element || []);
if (toFocus.is("textarea")) {
tinyMCE.get(toFocus.attr("id")).focus();
} else {
toFocus.filter(":visible").focus();
}
} catch(e) {
// ignore IE throwing errors when focusing hidden elements
}
}
}
})
</script>
<!-- /TinyMCE -->
</head>
<body>
<form id="myform" action="">
<h3>TinyMCE and Validation Plugin integration example</h3>
<label>Some other field</label>
<input name="title" />
<br/>
<label>Some richt text</label>
<textarea id="content" name="content" rows="15" cols="80" style="width: 80%"></textarea>
<br />
<input type="submit" name="save" value="Submit" />
</form>
</body>
</html>

View File

@ -1 +0,0 @@
(function(){var DOM=tinymce.DOM;tinymce.ThemeManager.requireLangPack('simple');tinymce.create('tinymce.themes.SimpleTheme',{init:function(ed,url){var t=this,states=['Bold','Italic','Underline','Strikethrough','InsertUnorderedList','InsertOrderedList'],s=ed.settings;t.editor=ed;ed.onInit.add(function(){ed.onNodeChange.add(function(ed,cm){tinymce.each(states,function(c){cm.get(c.toLowerCase()).setActive(ed.queryCommandState(c));});});ed.dom.loadCSS(url+"/skins/"+s.skin+"/content.css");});DOM.loadCSS((s.editor_css?ed.documentBaseURI.toAbsolute(s.editor_css):'')||url+"/skins/"+s.skin+"/ui.css");},renderUI:function(o){var t=this,n=o.targetNode,ic,tb,ed=t.editor,cf=ed.controlManager,sc;n=DOM.insertAfter(DOM.create('span',{id:ed.id+'_container','class':'mceEditor '+ed.settings.skin+'SimpleSkin'}),n);n=sc=DOM.add(n,'table',{cellPadding:0,cellSpacing:0,'class':'mceLayout'});n=tb=DOM.add(n,'tbody');n=DOM.add(tb,'tr');n=ic=DOM.add(DOM.add(n,'td'),'div',{'class':'mceIframeContainer'});n=DOM.add(DOM.add(tb,'tr',{'class':'last'}),'td',{'class':'mceToolbar mceLast',align:'center'});tb=t.toolbar=cf.createToolbar("tools1");tb.add(cf.createButton('bold',{title:'simple.bold_desc',cmd:'Bold'}));tb.add(cf.createButton('italic',{title:'simple.italic_desc',cmd:'Italic'}));tb.add(cf.createButton('underline',{title:'simple.underline_desc',cmd:'Underline'}));tb.add(cf.createButton('strikethrough',{title:'simple.striketrough_desc',cmd:'Strikethrough'}));tb.add(cf.createSeparator());tb.add(cf.createButton('undo',{title:'simple.undo_desc',cmd:'Undo'}));tb.add(cf.createButton('redo',{title:'simple.redo_desc',cmd:'Redo'}));tb.add(cf.createSeparator());tb.add(cf.createButton('cleanup',{title:'simple.cleanup_desc',cmd:'mceCleanup'}));tb.add(cf.createSeparator());tb.add(cf.createButton('insertunorderedlist',{title:'simple.bullist_desc',cmd:'InsertUnorderedList'}));tb.add(cf.createButton('insertorderedlist',{title:'simple.numlist_desc',cmd:'InsertOrderedList'}));tb.renderTo(n);return{iframeContainer:ic,editorContainer:ed.id+'_container',sizeContainer:sc,deltaHeight:-20};},getInfo:function(){return{longname:'Simple theme',author:'Moxiecode Systems AB',authorurl:'http://tinymce.moxiecode.com',version:tinymce.majorVersion+"."+tinymce.minorVersion}}});tinymce.ThemeManager.add('simple',tinymce.themes.SimpleTheme);})();

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.4 KiB

View File

@ -1,11 +0,0 @@
tinyMCE.addI18n('en.simple',{
bold_desc:"Bold (Ctrl+B)",
italic_desc:"Italic (Ctrl+I)",
underline_desc:"Underline (Ctrl+U)",
striketrough_desc:"Strikethrough",
bullist_desc:"Unordered list",
numlist_desc:"Ordered list",
undo_desc:"Undo (Ctrl+Z)",
redo_desc:"Redo (Ctrl+Y)",
cleanup_desc:"Cleanup messy code"
});

View File

@ -1,32 +0,0 @@
/* Reset */
.defaultSimpleSkin table, .defaultSimpleSkin tbody, .defaultSimpleSkin a, .defaultSimpleSkin img, .defaultSimpleSkin tr, .defaultSimpleSkin div, .defaultSimpleSkin td, .defaultSimpleSkin iframe, .defaultSimpleSkin span, .defaultSimpleSkin * {border:0; margin:0; padding:0; background:transparent; white-space:nowrap; text-decoration:none; font-weight:normal; cursor:default; color:#000}
/* Containers */
.defaultSimpleSkin {position:relative}
.defaultSimpleSkin table.mceLayout {background:#F0F0EE; border:1px solid #CCC;}
.defaultSimpleSkin iframe {display:block; background:#FFF; border-bottom:1px solid #CCC;}
.defaultSimpleSkin .mceToolbar {height:24px;}
/* Layout */
.defaultSimpleSkin span.mceIcon, .defaultSimpleSkin img.mceIcon {display:block; width:20px; height:20px}
.defaultSimpleSkin .mceIcon {background:url(../../img/icons.gif) no-repeat 20px 20px}
/* Button */
.defaultSimpleSkin .mceButton {display:block; border:1px solid #F0F0EE; width:20px; height:20px}
.defaultSimpleSkin a.mceButtonEnabled:hover {border:1px solid #0A246A; background-color:#B2BBD0}
.defaultSimpleSkin a.mceButtonActive {border:1px solid #0A246A; background-color:#C2CBE0}
.defaultSimpleSkin .mceButtonDisabled span {opacity:0.3; -ms-filter:'alpha(opacity=30)'; filter:alpha(opacity=30)}
/* Separator */
.defaultSimpleSkin .mceSeparator {display:block; background:url(../../img/icons.gif) -180px 0; width:2px; height:20px; margin:0 2px 0 4px}
/* Theme */
.defaultSimpleSkin span.mce_bold {background-position:0 0}
.defaultSimpleSkin span.mce_italic {background-position:-60px 0}
.defaultSimpleSkin span.mce_underline {background-position:-140px 0}
.defaultSimpleSkin span.mce_strikethrough {background-position:-120px 0}
.defaultSimpleSkin span.mce_undo {background-position:-160px 0}
.defaultSimpleSkin span.mce_redo {background-position:-100px 0}
.defaultSimpleSkin span.mce_cleanup {background-position:-40px 0}
.defaultSimpleSkin span.mce_insertunorderedlist {background-position:-20px 0}
.defaultSimpleSkin span.mce_insertorderedlist {background-position:-80px 0}

File diff suppressed because one or more lines are too long