Skip to content

Commit

Permalink
updated dev deps, remove grunt-bower, use generated spec runner for i…
Browse files Browse the repository at this point in the history
…n-browser testing
  • Loading branch information
jackocnr committed Feb 24, 2014
1 parent 4106b7d commit 818e065
Show file tree
Hide file tree
Showing 9 changed files with 97 additions and 110 deletions.
2 changes: 1 addition & 1 deletion .bowerrc
Original file line number Diff line number Diff line change
@@ -1,3 +1,3 @@
{
"directory" : "./.bower_cache"
"directory" : "lib"
}
4 changes: 3 additions & 1 deletion .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -2,4 +2,6 @@
/lib/jasmine/
/lib/jasmine-jquery/
/lib/jquery/
/.bower_cache/
/.bower_cache/
/.sass-cache/
/.grunt/
20 changes: 6 additions & 14 deletions Gruntfile.js
Original file line number Diff line number Diff line change
Expand Up @@ -15,10 +15,7 @@ module.exports = function(grunt) {
style: "compact"
},
files: {
'build/css/intlTelInput.css': [
'src/css/intlTelInput.scss',
'src/css/flags.scss'
],
'build/css/intlTelInput.css': 'src/css/intlTelInput.scss'
}
},
demo: {
Expand Down Expand Up @@ -103,22 +100,17 @@ module.exports = function(grunt) {
],
options: {
vendor: [
'lib/jquery/jquery.js',
'lib/jasmine-jquery/jasmine-jquery.js'
'lib/jquery/dist/jquery.js',
'lib/jasmine-jquery/lib/jasmine-jquery.js'
],
helpers: [
'src/spec/helpers/**/*.js'
],
specs: [
'src/spec/tests/**/*.js'
]
}
},

// Asset libs
bower: {
install: {
// defaults are fine
],
outfile: 'spec.html',
keepRunner: true
}
},

Expand Down
3 changes: 1 addition & 2 deletions bower.json
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,6 @@
"jquery": "^1.8.0"
},
"devDependencies": {
"jasmine": "~1.3",
"jasmine-jquery": "~1.5"
"jasmine-jquery": "~2.0.2"
}
}
54 changes: 27 additions & 27 deletions build/css/intlTelInput.css
Original file line number Diff line number Diff line change
@@ -1,30 +1,3 @@
.intl-tel-input { position: relative; display: inline-block; }
.intl-tel-input .hide { display: none; }
.intl-tel-input .flag-dropdown { position: absolute; top: 0; bottom: 0; }
.intl-tel-input .flag-dropdown .selected-flag { z-index: 1; position: relative; }
.intl-tel-input .flag-dropdown .country-list { position: absolute; z-index: 2; }
.intl-tel-input .country-list { list-style: none; }
.intl-tel-input .country-list .flag { display: inline-block; }
.intl-tel-input .flag-dropdown:hover { cursor: pointer; }
.intl-tel-input input[disabled] + .flag-dropdown:hover { cursor: default; }
.intl-tel-input input { position: relative; z-index: 0; margin-top: 0 !important; margin-bottom: 0 !important; }
.intl-tel-input.pretty * { box-sizing: border-box; -moz-box-sizing: border-box; }
.intl-tel-input.pretty .flag-dropdown:hover .selected-flag { background-color: rgba(0, 0, 0, 0.05); }
.intl-tel-input.pretty input[disabled] + .flag-dropdown:hover .selected-flag { background-color: transparent; }
.intl-tel-input.pretty .flag-dropdown .selected-flag { width: 38px; height: 100%; padding: 0 0 0 8px; }
.intl-tel-input.pretty .flag-dropdown .selected-flag .flag { position: absolute; top: 50%; margin-top: -5px; }
.intl-tel-input.pretty .flag-dropdown .selected-flag .arrow { position: relative; top: 50%; margin-top: -2px; left: 20px; width: 0; height: 0; border-left: 3px solid transparent; border-right: 3px solid transparent; border-top: 4px solid #555555; }
.intl-tel-input.pretty .flag-dropdown .selected-flag .arrow.up { border-top: none; border-bottom: 4px solid #555555; }
.intl-tel-input.pretty .flag-dropdown .country-list { padding: 0; margin: 0 0 0 -1px; box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.2); background-color: white; border: 1px solid #cccccc; width: 430px; max-height: 200px; overflow-y: scroll; }
.intl-tel-input.pretty .flag-dropdown .country-list .divider { padding-bottom: 5px; margin-bottom: 5px; border-bottom: 1px solid #cccccc; }
.intl-tel-input.pretty .flag-dropdown .country-list .country { line-height: 11px; padding: 7px 10px; }
.intl-tel-input.pretty .flag-dropdown .country-list .country .dial-code { color: #999999; }
.intl-tel-input.pretty .flag-dropdown .country-list .country.highlight { background-color: rgba(0, 0, 0, 0.05); }
.intl-tel-input.pretty .flag-dropdown .country-list .flag, .intl-tel-input.pretty .flag-dropdown .country-list .country-name { margin-right: 6px; }
.intl-tel-input.inside .flag-dropdown { padding: 1px; }
.intl-tel-input.inside input { padding-left: 44px; margin-left: 0; }
.intl-tel-input.outside input { border: none; margin-left: 38px; }

/** Originally from https://github.com/tkrotoff/famfamfam_flags Then converted to SCSS and simplified/optimised, and removed full country classes (as we only deal in 2 digit country codes) */
.intl-tel-input .flag { width: 16px; height: 11px; background: url("../img/flags.png"); }
.intl-tel-input .zw { background-position: 0px 0px; }
Expand Down Expand Up @@ -278,3 +251,30 @@
.intl-tel-input .ad { background-position: -208px -121px; }
.intl-tel-input .np { background-position: -208px -132px; }
.intl-tel-input .ch { background-position: -208px -143px; }

.intl-tel-input { position: relative; display: inline-block; }
.intl-tel-input .hide { display: none; }
.intl-tel-input .flag-dropdown { position: absolute; top: 0; bottom: 0; }
.intl-tel-input .flag-dropdown .selected-flag { z-index: 1; position: relative; }
.intl-tel-input .flag-dropdown .country-list { position: absolute; z-index: 2; }
.intl-tel-input .country-list { list-style: none; }
.intl-tel-input .country-list .flag { display: inline-block; }
.intl-tel-input .flag-dropdown:hover { cursor: pointer; }
.intl-tel-input input[disabled] + .flag-dropdown:hover { cursor: default; }
.intl-tel-input input { position: relative; z-index: 0; margin-top: 0 !important; margin-bottom: 0 !important; }
.intl-tel-input.pretty * { box-sizing: border-box; -moz-box-sizing: border-box; }
.intl-tel-input.pretty .flag-dropdown:hover .selected-flag { background-color: rgba(0, 0, 0, 0.05); }
.intl-tel-input.pretty input[disabled] + .flag-dropdown:hover .selected-flag { background-color: transparent; }
.intl-tel-input.pretty .flag-dropdown .selected-flag { width: 38px; height: 100%; padding: 0 0 0 8px; }
.intl-tel-input.pretty .flag-dropdown .selected-flag .flag { position: absolute; top: 50%; margin-top: -5px; }
.intl-tel-input.pretty .flag-dropdown .selected-flag .arrow { position: relative; top: 50%; margin-top: -2px; left: 20px; width: 0; height: 0; border-left: 3px solid transparent; border-right: 3px solid transparent; border-top: 4px solid #555555; }
.intl-tel-input.pretty .flag-dropdown .selected-flag .arrow.up { border-top: none; border-bottom: 4px solid #555555; }
.intl-tel-input.pretty .flag-dropdown .country-list { padding: 0; margin: 0 0 0 -1px; box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.2); background-color: white; border: 1px solid #cccccc; width: 430px; max-height: 200px; overflow-y: scroll; }
.intl-tel-input.pretty .flag-dropdown .country-list .divider { padding-bottom: 5px; margin-bottom: 5px; border-bottom: 1px solid #cccccc; }
.intl-tel-input.pretty .flag-dropdown .country-list .country { line-height: 11px; padding: 7px 10px; }
.intl-tel-input.pretty .flag-dropdown .country-list .country .dial-code { color: #999999; }
.intl-tel-input.pretty .flag-dropdown .country-list .country.highlight { background-color: rgba(0, 0, 0, 0.05); }
.intl-tel-input.pretty .flag-dropdown .country-list .flag, .intl-tel-input.pretty .flag-dropdown .country-list .country-name { margin-right: 6px; }
.intl-tel-input.inside .flag-dropdown { padding: 1px; }
.intl-tel-input.inside input { padding-left: 44px; margin-left: 0; }
.intl-tel-input.outside input { border: none; margin-left: 38px; }
2 changes: 1 addition & 1 deletion demo.html
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@ <h1>International Telephone Input</h1>
<input id="mobile-number" type="tel" placeholder="e.g. +1 702 123 4567">
<button type="button">Submit</button>

<script src="lib/jquery/jquery.js"></script>
<script src="lib/jquery/dist/jquery.js"></script>
<script src="build/js/intlTelInput.js"></script>
<script>
$("#mobile-number").intlTelInput();
Expand Down
14 changes: 7 additions & 7 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -18,13 +18,13 @@
"devDependencies": {
"jquery": "^1.8.0",
"grunt": "~0.4.1",
"grunt-contrib-sass": "~0.3.0",
"grunt-contrib-jshint": "~0.5.4",
"grunt-contrib-watch": "~0.4.4",
"grunt-contrib-uglify": "~0.2.4",
"grunt-contrib-jasmine": "~0.5.2",
"grunt-bower-task": "~0.3.2",
"grunt-templater": "0.0.4-1",
"grunt-contrib-sass": "~0.7.2",
"grunt-contrib-jshint": "~0.8.0",
"grunt-contrib-watch": "~0.5.3",
"grunt-contrib-uglify": "~0.3.2",
"grunt-contrib-jasmine": "~0.6.1",
"bower": "~1.2.8",
"grunt-templater": "0.0.4",
"load-grunt-tasks": "~0.3.0",
"time-grunt": "~0.2.9",
"ejs": "~0.8.5"
Expand Down
106 changes: 49 additions & 57 deletions spec.html
Original file line number Diff line number Diff line change
@@ -1,69 +1,61 @@
<!DOCTYPE html>
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Jasmine Spec Runner</title>

<link rel="stylesheet" href="lib/jasmine/lib/jasmine-core/jasmine.css">
<script src="lib/jasmine/lib/jasmine-core/jasmine.js"></script>
<script src="lib/jasmine/lib/jasmine-core/jasmine-html.js"></script>

<!-- include source files here... -->
<script src="lib/jquery/jquery.js"></script>
<script src="build/js/intlTelInput.js"></script>

<!-- include helper files here... -->
<script src="lib/jasmine-jquery/jasmine-jquery.js"></script>
<link rel="stylesheet" type="text/css" href=".grunt/grunt-contrib-jasmine/jasmine.css">



<script src=".grunt/grunt-contrib-jasmine/phantom-polyfill.js"></script>

<script src=".grunt/grunt-contrib-jasmine/jasmine.js"></script>

<script src=".grunt/grunt-contrib-jasmine/jasmine-html.js"></script>

<script src=".grunt/grunt-contrib-jasmine/boot.js"></script>

<script src="lib/jquery/dist/jquery.js"></script>

<script src="lib/jasmine-jquery/lib/jasmine-jquery.js"></script>

<script src="src/spec/helpers/helpers.js"></script>

<!-- include spec files here... -->
<!-- vanilla -->
<script src="src/spec/tests/vanilla/core.js"></script>
<script src="src/spec/tests/vanilla/multipleInstances.js"></script>
<script src="src/spec/tests/vanilla/keyboardShortcuts.js"></script>
<!-- options -->
<script src="src/spec/tests/options/autoHideDialCode.js"></script>
<script src="src/spec/tests/options/americaMode.js"></script>
<script src="src/spec/tests/options/preferredCountries.js"></script>
<script src="src/spec/tests/options/onlyCountries.js"></script>
<script src="src/spec/tests/options/defaultStyling.js"></script>
<script src="src/spec/tests/options/defaultCountry.js"></script>
<!-- methods -->
<script src="src/spec/tests/methods/selectCountry.js"></script>
<script src="src/spec/tests/methods/setNumber.js"></script>

<script src="src/js/data.js"></script>

<script src="src/js/intlTelInput.js"></script>

<script src="src/spec/tests/methods/getCountryData.js"></script>

<script src="src/spec/tests/methods/selectCountry.js"></script>

<script src="src/spec/tests/methods/setCountryData.js"></script>

<script>
(function() {
var jasmineEnv = jasmine.getEnv();
jasmineEnv.updateInterval = 1000;

var htmlReporter = new jasmine.HtmlReporter();

jasmineEnv.addReporter(htmlReporter);

jasmineEnv.specFilter = function(spec) {
return htmlReporter.specFilter(spec);
};

var currentWindowOnload = window.onload;

window.onload = function() {
if (currentWindowOnload) {
currentWindowOnload();
}
execJasmine();
};

function execJasmine() {
jasmineEnv.execute();
}

})();
</script>

<script src="src/spec/tests/methods/setNumber.js"></script>

<script src="src/spec/tests/options/americaMode.js"></script>

<script src="src/spec/tests/options/autoHideDialCode.js"></script>

<script src="src/spec/tests/options/defaultCountry.js"></script>

<script src="src/spec/tests/options/defaultStyling.js"></script>

<script src="src/spec/tests/options/onlyCountries.js"></script>

<script src="src/spec/tests/options/preferredCountries.js"></script>

<script src="src/spec/tests/vanilla/core.js"></script>

<script src="src/spec/tests/vanilla/keyboardShortcuts.js"></script>

<script src="src/spec/tests/vanilla/multipleInstances.js"></script>

<script src=".grunt/grunt-contrib-jasmine/reporter.js"></script>


</head>

<body>
</body>
</html>
2 changes: 2 additions & 0 deletions src/css/intlTelInput.scss
Original file line number Diff line number Diff line change
@@ -1,3 +1,5 @@
@import 'flags';

// rgba is needed for the selected flag hover state to blend in with
// the border-highlighting some browsers give the input on focus
$hoverColor: rgba(0, 0, 0, 0.05);
Expand Down

0 comments on commit 818e065

Please sign in to comment.