diff --git a/.gitignore b/.gitignore index c1acccabb..4eed927db 100644 --- a/.gitignore +++ b/.gitignore @@ -21,3 +21,6 @@ doc/ .DS_Store .idea *.iml + +Gemfile.lock +.sass-cache diff --git a/Gemfile b/Gemfile index 14074582d..d8d9ceeec 100644 --- a/Gemfile +++ b/Gemfile @@ -26,6 +26,7 @@ gem 'gon' # for passthrough of Ruby variables to Javascript variables group :development, :test do gem 'rspec-rails', '2.11.0' gem 'guard-rspec', '0.5.5' + gem 'jasmine' end # Gems used only for assets and not required diff --git a/Gemfile.lock b/Gemfile.lock deleted file mode 100644 index a62a9655c..000000000 --- a/Gemfile.lock +++ /dev/null @@ -1,254 +0,0 @@ -PATH - remote: ~/workspace/jam-db/target/ruby_package - specs: - jam_db (0.0.1) - pg_migrate (= 0.1.5) - -PATH - remote: ~/workspace/jam-pb/target/ruby/jampb - specs: - jampb (0.0.1) - -PATH - remote: ~/workspace/jam-ruby - specs: - jam_ruby (0.0.1) - -GEM - remote: https://rubygems.org/ - specs: - actionmailer (3.2.8) - actionpack (= 3.2.8) - mail (~> 2.4.4) - actionpack (3.2.8) - activemodel (= 3.2.8) - activesupport (= 3.2.8) - builder (~> 3.0.0) - erubis (~> 2.7.0) - journey (~> 1.0.4) - rack (~> 1.4.0) - rack-cache (~> 1.2) - rack-test (~> 0.6.1) - sprockets (~> 2.1.3) - activemodel (3.2.8) - activesupport (= 3.2.8) - builder (~> 3.0.0) - activerecord (3.2.8) - activemodel (= 3.2.8) - activesupport (= 3.2.8) - arel (~> 3.0.2) - tzinfo (~> 0.3.29) - activeresource (3.2.8) - activemodel (= 3.2.8) - activesupport (= 3.2.8) - activesupport (3.2.8) - i18n (~> 0.6) - multi_json (~> 1.0) - addressable (2.2.8) - arel (3.0.2) - bcrypt-ruby (3.0.1) - bootstrap-sass (2.0.4.0) - bootstrap-will_paginate (0.0.6) - will_paginate - builder (3.0.0) - capybara (1.1.2) - mime-types (>= 1.16) - nokogiri (>= 1.3.3) - rack (>= 1.0.0) - rack-test (>= 0.5.4) - selenium-webdriver (~> 2.0) - xpath (~> 0.1.4) - childprocess (0.3.5) - ffi (~> 1.0, >= 1.0.6) - chunky_png (1.2.6) - coffee-rails (3.2.2) - coffee-script (>= 2.2.0) - railties (~> 3.2.0) - coffee-script (2.2.0) - coffee-script-source - execjs - coffee-script-source (1.3.3) - compass (0.12.2) - chunky_png (~> 1.2) - fssm (>= 0.2.7) - sass (~> 3.1) - compass-rails (1.0.3) - compass (>= 0.12.2, < 0.14) - cucumber (1.2.1) - builder (>= 2.1.2) - diff-lcs (>= 1.1.3) - gherkin (~> 2.11.0) - json (>= 1.4.6) - cucumber-rails (1.2.1) - capybara (>= 1.1.2) - cucumber (>= 1.1.3) - nokogiri (>= 1.5.0) - database_cleaner (0.7.0) - diff-lcs (1.1.3) - erubis (2.7.0) - execjs (1.4.0) - multi_json (~> 1.0) - factory_girl (2.3.2) - activesupport - factory_girl_rails (1.4.0) - factory_girl (~> 2.3.0) - railties (>= 3.0.0) - faker (1.0.1) - i18n (~> 0.4) - ffi (1.1.5) - fssm (0.2.9) - gherkin (2.11.2) - json (>= 1.4.6) - gon (4.0.0) - actionpack (>= 2.3.0) - json - guard (1.3.2) - listen (>= 0.4.2) - thor (>= 0.14.6) - guard-rspec (0.5.5) - guard (>= 0.8.4) - guard-spork (0.3.2) - guard (>= 0.8.4) - spork (>= 0.8.4) - hike (1.2.1) - i18n (0.6.0) - journey (1.0.4) - jquery-rails (2.0.2) - railties (>= 3.2.0, < 5.0) - thor (~> 0.14) - json (1.7.5) - launchy (2.1.0) - addressable (~> 2.2.6) - libwebsocket (0.1.5) - addressable - listen (0.4.7) - rb-fchange (~> 0.0.5) - rb-fsevent (~> 0.9.1) - rb-inotify (~> 0.8.8) - little-plugger (1.1.3) - logging (1.7.2) - little-plugger (>= 1.1.3) - mail (2.4.4) - i18n (>= 0.4.0) - mime-types (~> 1.16) - treetop (~> 1.4.8) - mime-types (1.19) - multi_json (1.3.6) - nokogiri (1.5.5) - pg (0.14.0) - pg_migrate (0.1.5) - logging (= 1.7.2) - pg (= 0.14.0) - thor (= 0.15.4) - polyglot (0.3.3) - rabl (0.7.2) - activesupport (>= 2.3.14) - multi_json (~> 1.0) - rack (1.4.1) - rack-cache (1.2) - rack (>= 0.4) - rack-ssl (1.3.2) - rack - rack-test (0.6.1) - rack (>= 1.0) - rails (3.2.8) - actionmailer (= 3.2.8) - actionpack (= 3.2.8) - activerecord (= 3.2.8) - activeresource (= 3.2.8) - activesupport (= 3.2.8) - bundler (~> 1.0) - railties (= 3.2.8) - railties (3.2.8) - actionpack (= 3.2.8) - activesupport (= 3.2.8) - rack-ssl (~> 1.3.2) - rake (>= 0.8.7) - rdoc (~> 3.4) - thor (>= 0.14.6, < 2.0) - rake (0.9.2.2) - rb-fchange (0.0.5) - ffi - rb-fsevent (0.9.1) - rb-inotify (0.8.8) - ffi (>= 0.5.0) - rdoc (3.12) - json (~> 1.4) - rspec (2.11.0) - rspec-core (~> 2.11.0) - rspec-expectations (~> 2.11.0) - rspec-mocks (~> 2.11.0) - rspec-core (2.11.1) - rspec-expectations (2.11.2) - diff-lcs (~> 1.1.3) - rspec-mocks (2.11.2) - rspec-rails (2.11.0) - actionpack (>= 3.0) - activesupport (>= 3.0) - railties (>= 3.0) - rspec (~> 2.11.0) - ruby-protocol-buffers (1.2.2) - rubyzip (0.9.9) - sass (3.2.1) - sass-rails (3.2.5) - railties (~> 3.2.0) - sass (>= 3.1.10) - tilt (~> 1.3) - selenium-webdriver (2.25.0) - childprocess (>= 0.2.5) - libwebsocket (~> 0.1.3) - multi_json (~> 1.0) - rubyzip - spork (0.9.0) - sprockets (2.1.3) - hike (~> 1.2) - rack (~> 1.0) - tilt (~> 1.1, != 1.3.0) - thor (0.15.4) - tilt (1.3.3) - treetop (1.4.10) - polyglot - polyglot (>= 0.3.1) - tzinfo (0.3.33) - uglifier (1.2.3) - execjs (>= 0.3.0) - multi_json (>= 1.0.2) - uuidtools (2.1.2) - will_paginate (3.0.3) - xpath (0.1.4) - nokogiri (~> 1.3) - -PLATFORMS - ruby - -DEPENDENCIES - bcrypt-ruby (= 3.0.1) - bootstrap-sass (= 2.0.4) - bootstrap-will_paginate (= 0.0.6) - capybara (= 1.1.2) - coffee-rails (= 3.2.2) - compass-rails - cucumber-rails (= 1.2.1) - database_cleaner (= 0.7.0) - factory_girl_rails (= 1.4.0) - faker (= 1.0.1) - gon - guard-rspec (= 0.5.5) - guard-spork (= 0.3.2) - jam_db! - jam_ruby! - jampb! - jquery-rails (= 2.0.2) - launchy (= 2.1.0) - pg (= 0.14.0) - pg_migrate (= 0.1.5) - rabl - rack-test - rails (= 3.2.8) - rspec-rails (= 2.11.0) - ruby-protocol-buffers (= 1.2.2) - sass-rails (= 3.2.5) - spork (= 0.9.0) - uglifier (= 1.2.3) - uuidtools (= 2.1.2) - will_paginate (= 3.0.3) diff --git a/README.md b/README.md index 41d96a531..a8544c34b 100644 --- a/README.md +++ b/README.md @@ -1 +1,12 @@ -* TODO \ No newline at end of file +* TODO + +Jasmine Javascript Unit Tests +============================= + +1. Ensure you have the jasmine Gem installed; +$ bundle + +2. Start the jasmine server (defaults to :8888) +$ rake jasmine + +Open browser to localhost:8888 diff --git a/app/assets/javascripts/JamServer.js b/app/assets/javascripts/JamServer.js new file mode 100644 index 000000000..c17d9c462 --- /dev/null +++ b/app/assets/javascripts/JamServer.js @@ -0,0 +1,96 @@ +// The wrapper around the web-socket connection to the server +(function(global, $) { + var server = {}; + + // Let socket.io know where WebSocketMain.swf is + WEB_SOCKET_SWF_LOCATION = "assets/flash/WebSocketMain.swf"; + + server.socket = {}; + server.singedIn = false; + server.dispatchTable = {}; + + // TODO: Create the message factory here + //server.messageFactory = global.message_factory; + + server.registerMessageCallback = function(messageType, callback) { + if (server.dispatchTable[messageType] === undefined) { + server.dispatchTable[messageType] = []; + } + + server.dispatchTable[messageType].push(callback); + }; + + server.unregisterMessageCallback = function(messageType, callback) { + if (server.dispatchTable[messageType] !== undefined) { + for(var i = server.dispatchTable.length; i--;) { + if (server.dispatchTable[messageType][i] === callback) + { + server.dispatchTable[messageType].splice(i, 1); + break; + } + } + } + + if (server.dispatchTable[messageType].length == 0) { + delete server.dispatchTable[messageType]; + } + }; + + server.connect = function() { + server.registerMessageCallback(LOGIN_ACK, function() { server.signedIn = true; }); + + server.socket = new WebSocket(gon.websocket_gateway_uri); + server.socket.onopen = server.onOpen; + server.socket.onmessage = server.onMessage; + server.socket.onclose = server.onClose; + }; + + server.onOpen = function() { + var token, loginMessage; + + token = $.cookie("remember_token"); + loginMessage = global.message_factory.login_with_token(token); + + server.send(loginMessage); + }; + + server.onMessage = function(e) { + var message = JSON.parse(e.data), + payload = message[message.type.toLowerCase()], + callbacks = server.dispatchTable[message.type]; + + if (callbacks !== undefined) { + for(var i = callbacks.length; i--;) { + callbacks[i](payload); + } + } + else { + console.log("Unexpected message type %s.", message.type); + } + }; + + server.onClose = function() { + console.log("Socket to server closed."); + // TODO: reconnect + }; + + server.send = function(message) { + server.socket.send(JSON.stringify(message)); + }; + + server.loginSession = function(sessionId) { + var loginMessage; + + if (!signedIn) { + console.log("Not signed in!"); + // TODO: surface the error + return; + } + + loginMessage = global.message_factory.login_jam_session(sessionId); + server.send(loginMessage); + }; + + global.JamServer = server; + +})(window, jQuery); diff --git a/app/assets/javascripts/jamkazam.js b/app/assets/javascripts/jamkazam.js index e577a9398..67fe7c864 100644 --- a/app/assets/javascripts/jamkazam.js +++ b/app/assets/javascripts/jamkazam.js @@ -11,37 +11,6 @@ return template; } - var ChannelView = global.ChannelView = function($elem, options) { - var _view; - var _foo; - var _$element; - var _options = { - height: 300, - width: 100 - }; - - function _build() { - var instrument = _$element.attr("channel-instrument"); - var name = _$element.attr("channel-name"); - var template = $('#channel-view').html(); - var vals = { name: name, instrument: instrument}; - var filled = _fillTemplate(template, vals); - _$element.html(filled); - var containerStyle = "width:" + _options.width + "px; height:" + _options.height + "px;"; - containerStyle += "top:0px; left:0px;"; - $('.channel-container', _$element).attr("style", containerStyle); - } - - this.initialize = function(jqElem, user_options) { - _view = this; - _$element = jqElem; - _options = $.extend(_options, user_options); - _build(); - return _view; - }; - return this.initialize($elem, options); - }; - var JamKazam = global.JamKazam = function() { var app; @@ -87,4 +56,4 @@ return this; }; - })(window,jQuery); \ No newline at end of file + }(window,jQuery)); \ No newline at end of file diff --git a/app/assets/javascripts/layout.js b/app/assets/javascripts/layout.js index e9ab3998e..fec502265 100644 --- a/app/assets/javascripts/layout.js +++ b/app/assets/javascripts/layout.js @@ -318,7 +318,6 @@ function linkClicked(evt) { evt.preventDefault(); var destination = $(this).attr('layout-link'); - console.debug("Destination:" + destination); var destinationType = $('[layout-id="' + destination + '"]').attr("layout"); if (destinationType === "screen") { self.location = '#/' + destination; @@ -430,7 +429,6 @@ //}, 2000); }; - return this; }; diff --git a/app/assets/stylesheets/client/jamkazam.css.scss b/app/assets/stylesheets/client/jamkazam.css.scss index bd5153887..abc29d6e8 100644 --- a/app/assets/stylesheets/client/jamkazam.css.scss +++ b/app/assets/stylesheets/client/jamkazam.css.scss @@ -36,15 +36,28 @@ form { clear:both; margin: 1em; } +form .body { + /* TODO - size with layout */ + width: 100%; + height: 40%; + max-height: 40%; + overflow:auto; +} fieldset { - border: 1px solid #555; - padding: 1em; - margin: 2em 1em; - width:auto; - float:left; + /*border: 1px solid #555;*/ + /*padding: 1em;*/ + /*margin: 2em 1em;*/ + /*width:auto;*/ + /*float:left;*/ +} +fieldset.unstyled { + border: 1px solid #f00; } .formrow { - margin: 3em 0em; + margin: 1em; + padding: 1em; + border: 1px solid #555; + float:left; } label { display:block; diff --git a/app/assets/stylesheets/lato.css b/app/assets/stylesheets/lato.css new file mode 100644 index 000000000..ed16aefd1 --- /dev/null +++ b/app/assets/stylesheets/lato.css @@ -0,0 +1,116 @@ +@font-face { + font-family: 'LatoBlackItalic'; + src: url('lato/Lato-BlaIta-webfont.eot'); + src: url('lato/Lato-BlaIta-webfont.eot?#iefix') format('embedded-opentype'), + url('lato/Lato-BlaIta-webfont.woff') format('woff'), + url('lato/Lato-BlaIta-webfont.ttf') format('truetype'), + url('lato/Lato-BlaIta-webfont.svg#LatoBlackItalic') format('svg'); + font-weight: normal; + font-style: normal; + +} + +@font-face { + font-family: 'LatoBlack'; + src: url('lato/Lato-Bla-webfont.eot'); + src: url('lato/Lato-Bla-webfont.eot?#iefix') format('embedded-opentype'), + url('lato/Lato-Bla-webfont.woff') format('woff'), + url('lato/Lato-Bla-webfont.ttf') format('truetype'), + url('lato/Lato-Bla-webfont.svg#LatoBlack') format('svg'); + font-weight: normal; + font-style: normal; + +} + +@font-face { + font-family: 'LatoBoldItalic'; + src: url('lato/Lato-BolIta-webfont.eot'); + src: url('lato/Lato-BolIta-webfont.eot?#iefix') format('embedded-opentype'), + url('lato/Lato-BolIta-webfont.woff') format('woff'), + url('lato/Lato-BolIta-webfont.ttf') format('truetype'), + url('lato/Lato-BolIta-webfont.svg#LatoBoldItalic') format('svg'); + font-weight: normal; + font-style: normal; + +} + +@font-face { + font-family: 'LatoBold'; + src: url('lato/Lato-Bol-webfont.eot'); + src: url('lato/Lato-Bol-webfont.eot?#iefix') format('embedded-opentype'), + url('lato/Lato-Bol-webfont.woff') format('woff'), + url('lato/Lato-Bol-webfont.ttf') format('truetype'), + url('lato/Lato-Bol-webfont.svg#LatoBold') format('svg'); + font-weight: normal; + font-style: normal; + +} + +@font-face { + font-family: 'LatoItalic'; + src: url('lato/Lato-RegIta-webfont.eot'); + src: url('lato/Lato-RegIta-webfont.eot?#iefix') format('embedded-opentype'), + url('lato/Lato-RegIta-webfont.woff') format('woff'), + url('lato/Lato-RegIta-webfont.ttf') format('truetype'), + url('lato/Lato-RegIta-webfont.svg#LatoItalic') format('svg'); + font-weight: normal; + font-style: normal; + +} + +@font-face { + font-family: 'LatoRegular'; + src: url('lato/Lato-Reg-webfont.eot'); + src: url('lato/Lato-Reg-webfont.eot?#iefix') format('embedded-opentype'), + url('lato/Lato-Reg-webfont.woff') format('woff'), + url('lato/Lato-Reg-webfont.ttf') format('truetype'), + url('lato/Lato-Reg-webfont.svg#LatoRegular') format('svg'); + font-weight: normal; + font-style: normal; + +} +@font-face { + font-family: 'LatoLightItalic'; + src: url('lato/Lato-LigIta-webfont.eot'); + src: url('lato/Lato-LigIta-webfont.eot?#iefix') format('embedded-opentype'), + url('lato/Lato-LigIta-webfont.woff') format('woff'), + url('lato/Lato-LigIta-webfont.ttf') format('truetype'), + url('lato/Lato-LigIta-webfont.svg#LatoLightItalic') format('svg'); + font-weight: normal; + font-style: normal; + +} +@font-face { + font-family: 'LatoLight'; + src: url('lato/Lato-Lig-webfont.eot'); + src: url('lato/Lato-Lig-webfont.eot?#iefix') format('embedded-opentype'), + url('lato/Lato-Lig-webfont.woff') format('woff'), + url('lato/Lato-Lig-webfont.ttf') format('truetype'), + url('lato/Lato-Lig-webfont.svg#LatoLight') format('svg'); + font-weight: normal; + font-style: normal; + +} +@font-face { + font-family: 'LatoHairlineItalic'; + src: url('lato/Lato-HaiIta-webfont.eot'); + src: url('lato/Lato-HaiIta-webfont.eot?#iefix') format('embedded-opentype'), + url('lato/Lato-HaiIta-webfont.woff') format('woff'), + url('lato/Lato-HaiIta-webfont.ttf') format('truetype'), + url('lato/Lato-HaiIta-webfont.svg#LatoHairlineItalic') format('svg'); + font-weight: normal; + font-style: normal; + +} + +@font-face { + font-family: 'LatoHairline'; + src: url('lato/Lato-Hai-webfont.eot'); + src: url('lato/Lato-Hai-webfont.eot?#iefix') format('embedded-opentype'), + url('lato/Lato-Hai-webfont.woff') format('woff'), + url('lato/Lato-Hai-webfont.ttf') format('truetype'), + url('lato/Lato-Hai-webfont.svg#LatoHairline') format('svg'); + font-weight: normal; + font-style: normal; + +} \ No newline at end of file diff --git a/app/controllers/clients_controller.rb b/app/controllers/clients_controller.rb index bba33fde4..fad1d3213 100644 --- a/app/controllers/clients_controller.rb +++ b/app/controllers/clients_controller.rb @@ -1,9 +1,14 @@ class ClientsController < ApplicationController + include UsersHelper + # have to be signed in currently to see this screen before_filter :signed_in_user def index + # use gon to pass variables into javascript + gon.websocket_gateway_uri = Rails.application.config.websocket_gateway_uri + # don't use the rails tutorial layout for this page render :layout => 'client' end diff --git a/app/helpers/users_helper.rb b/app/helpers/users_helper.rb index c27d31cbb..cf892e07f 100644 --- a/app/helpers/users_helper.rb +++ b/app/helpers/users_helper.rb @@ -1,11 +1,12 @@ module UsersHelper # Returns the Gravatar (http://gravatar.com/) for the given user. - def gravatar_for(user, options = { size: 50 }) + def gravatar_for(user, options = { size: 50, hclass: "gravatar" }) gravatar_id = Digest::MD5::hexdigest(user.email.downcase) size = options[:size] + hclass = options[:hclass] gravatar = gravatar_url = "https://secure.gravatar.com/avatar/#{gravatar_id}?s=#{size}" - image_tag(gravatar_url, alt: user.name, class: "gravatar") + image_tag(gravatar_url, alt: user.name, class: "#{hclass}") end end diff --git a/app/views/clients/index.html.erb b/app/views/clients/index.html.erb index bb54e2fad..c751a03b7 100644 --- a/app/views/clients/index.html.erb +++ b/app/views/clients/index.html.erb @@ -2,16 +2,13 @@

JamKazam

- <%= image_tag "avatars/avatar_jonathon.png", :class=> "avatar medium" %> + <%= gravatar_for current_user, size: 52, hclass: "avatar medium" %>
-

Jonathon Wilson

+

<%= current_user.name %>

<%= image_tag "down_arrow.png", :class=> "profile-toggle" %>
  • Profile
    • -
  • Log Out
    • -
  • Log Out
    • -
  • Log Out
    • -
  • Log Out
    • +
  • <%= link_to "Sign out", signout_path, method: "delete" %>
@@ -104,116 +101,143 @@

Home >

-

Create Session (1/3): Session Info

+

Create Session

-

Viewers: If it isn't obvious, no visual work has been done on this. Just putting the "stuff" on the page. We should be able to start making it function, and then styling can happen in parallel later.

-
-
- Session Type - - - - -
-
- -
-
- - -
-
- -
-
- - -
-
-
+
+
+
+ Unstyled (obviously) +
+ +
- -
-
-

Home >

-

Create a Session (2/3): Invite

-
- -
- Invite Musicians - - -
-
- Invite Fans - - - - +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ + +
+ +
+ +
+ +
+ +

+ Upgrade your Studio subscription to let more fans listen +

+
+ +
+ +
+
- - - + +
+

Home >

@@ -384,31 +408,20 @@

- - - - + diff --git a/app/views/layouts/client.html.erb b/app/views/layouts/client.html.erb index adee70b54..f566f6f12 100644 --- a/app/views/layouts/client.html.erb +++ b/app/views/layouts/client.html.erb @@ -4,8 +4,7 @@ <%= full_title(yield(:title)) %> - <%= stylesheet_link_tag "client/common", media: "all" %> + <%= stylesheet_link_tag "client/ie", media: "all" %> <%= stylesheet_link_tag "client/jamkazam", media: "all" %> <%= stylesheet_link_tag "client/lato", media: "all" %> diff --git a/config/application.rb b/config/application.rb index f68e29ce7..3e49197c2 100644 --- a/config/application.rb +++ b/config/application.rb @@ -66,6 +66,10 @@ module SampleApp config.assets.version = '1.0' # Runs the websocket gateway within the web app - config.websocket_gateway_uri = "ws://localhost:6767/websocket" + config.websocket_gateway_uri = "ws://ubuntu:6767/websocket" + + # Add the assets/fonts directory to assets.paths + config.assets.paths << "#{Rails.root}/app/assets/fonts" + end end diff --git a/spec/javascripts/helpers/.gitkeep b/spec/javascripts/helpers/.gitkeep new file mode 100644 index 000000000..e69de29bb diff --git a/spec/javascripts/layout.spec.js b/spec/javascripts/layout.spec.js new file mode 100644 index 000000000..d2b492ab3 --- /dev/null +++ b/spec/javascripts/layout.spec.js @@ -0,0 +1,161 @@ +(function(context, $) { + + describe("Layout", function() { + var layout, cardLayout, testOpts; + + beforeEach(function() { + layout = new context.Layout(); + }); + + describe("Construct", function() { + describe("defaults", function() { + it("headerHeight should be 75", function() { + expect(layout.getOpts().headerHeight).toEqual(75); + }); + it("sidebarWidth should be 300", function() { + expect(layout.getOpts().sidebarWidth).toEqual(300); + }); + it("gutter should be 20", function() { + expect(layout.getOpts().gutter).toEqual(20); + }); + }); + describe("override one default", function() { + it("headerHeight should be 300", function() { + testOpts = { + headerHeight: 300 + }; + layout.initialize(testOpts); + expect(layout.getOpts().headerHeight).toEqual(300); + }); + it("sidebarWidth should be 300", function() { + expect(layout.getOpts().sidebarWidth).toEqual(300); + }); + }); + + }); + + describe("getScreenDimensions", function() { + describe("Description", function() { + + }); + }); + + describe("CardLayout", function() { + describe("One cell, zero margins", function() { + it("should fill space", function() { + testOpts = { gridOuterMargin: 0, gridPadding: 0}; + layout.initialize(testOpts); + cardLayout = layout.getCardLayout(100, 100, 1, 1, 0, 0, 1, 1); + expect(cardLayout).toEqual({top:0,left:0,width:100,height:100}); + }); + }); + + describe("Two columns, zero margins", function() { + it("should be half width each", function() { + testOpts = { gridOuterMargin: 0, gridPadding: 0}; + layout.initialize(testOpts); + cardLayout = layout.getCardLayout(100, 100, 1, 2, 0, 0, 1, 1); + expect(cardLayout).toEqual({top:0,left:0,width:50,height:100}); + + cardLayout = layout.getCardLayout(100, 100, 1, 2, 0, 1, 1, 1); + expect(cardLayout).toEqual({top:0,left:50,width:50,height:100}); + }); + }); + + describe("Two rows, zero margins", function() { + it("should be half height each", function() { + testOpts = { gridOuterMargin: 0, gridPadding: 0}; + layout.initialize(testOpts); + cardLayout = layout.getCardLayout(100, 100, 2, 1, 0, 0, 1, 1); + expect(cardLayout).toEqual({top:0,left:0,width:100,height:50}); + + cardLayout = layout.getCardLayout(100, 100, 2, 1, 1, 0, 1, 1); + expect(cardLayout).toEqual({top:50,left:0,width:100,height:50}); + }); + }); + + describe("two cols, colspan 2, zero margins", function() { + it("should fill width", function() { + testOpts = { gridOuterMargin: 0, gridPadding: 0}; + layout.initialize(testOpts); + cardLayout = layout.getCardLayout(100, 100, 1, 2, 0, 0, 1, 2); + expect(cardLayout).toEqual({top:0,left:0,width:100,height:100}); + }); + }); + + describe("two rows, rowspan 2, zero margins", function() { + it("should fill height", function() { + testOpts = { gridOuterMargin: 0, gridPadding: 0}; + layout.initialize(testOpts); + cardLayout = layout.getCardLayout(100, 100, 2, 1, 0, 0, 2, 1); + expect(cardLayout).toEqual({top:0,left:0,width:100,height:100}); + }); + }); + + describe("4x4, zero margins, row 1, col 1, rowspan 2, colspan 2", function() { + it("should fill middle 4 cells", function() { + testOpts = { gridOuterMargin: 0, gridPadding: 0}; + layout.initialize(testOpts); + cardLayout = layout.getCardLayout(100, 100, 4, 4, 1, 1, 2, 2); + expect(cardLayout).toEqual({top:25,left:25,width:50,height:50}); + }); + }); + + // Outer margins + describe("1x1, 100x100, outermargin 10", function() { + it("should be inset 10 pixels, 80x80", function() { + testOpts = { gridOuterMargin: 10, gridPadding: 0}; + layout.initialize(testOpts); + cardLayout = layout.getCardLayout(100, 100, 1, 1, 0, 0, 1, 1); + expect(cardLayout).toEqual({top:10,left:10,width:80,height:80}); + }); + }); + describe("2x2, 100x100, outermargin 10", function() { + it("should be inset 10 pixels, 40x40", function() { + testOpts = { gridOuterMargin: 10, gridPadding: 0}; + layout.initialize(testOpts); + cardLayout = layout.getCardLayout(100, 100, 2, 2, 0, 0, 1, 1); + expect(cardLayout).toEqual({top:10,left:10,width:40,height:40}); + }); + }); + + // Inner margins + describe("2x2, 100x100, padding 10", function() { + it("10 pixels in and 10 pixel gutters", function() { + testOpts = { gridOuterMargin: 0, gridPadding: 10}; + layout.initialize(testOpts); + // upper left + cardLayout = layout.getCardLayout(100, 100, 2, 2, 0, 0, 1, 1); + expect(cardLayout).toEqual({top:10,left:10,width:30,height:30}); + // upper right + cardLayout = layout.getCardLayout(100, 100, 2, 2, 0, 1, 1, 1); + expect(cardLayout).toEqual({top:10,left:60,width:30,height:30}); + }); + }); + + // 5 block test like starting home. + describe("home page test", function() { + it("5 blocks", function() { + testOpts = { gridOuterMargin: 10, gridPadding: 10}; + layout.initialize(testOpts); + // Cell 1 + cardLayout = layout.getCardLayout(1000, 1000, 2, 4, 0, 0, 1, 1); + expect(cardLayout).toEqual({top:20,left:20,width:225,height:470}); + // Cell 2 + cardLayout = layout.getCardLayout(1000, 1000, 2, 4, 0, 1, 1, 1); + expect(cardLayout).toEqual({top:20,left:265,width:225,height:470}); + // Cell 3 + cardLayout = layout.getCardLayout(1000, 1000, 2, 4, 0, 2, 1, 2); + expect(cardLayout).toEqual({top:20,left:510,width:470,height:470}); + // Cell 4 + cardLayout = layout.getCardLayout(1000, 1000, 2, 4, 1, 0, 1, 2); + expect(cardLayout).toEqual({top:510,left:20,width:470,height:470}); + // Cell 5 + cardLayout = layout.getCardLayout(1000, 1000, 2, 4, 1, 2, 1, 2); + expect(cardLayout).toEqual({top:510,left:510,width:470,height:470}); + }); + }); + + }); + }); +}(window, jQuery)); \ No newline at end of file diff --git a/spec/javascripts/support/jasmine.yml b/spec/javascripts/support/jasmine.yml new file mode 100644 index 000000000..9bfa261a3 --- /dev/null +++ b/spec/javascripts/support/jasmine.yml @@ -0,0 +1,76 @@ +# src_files +# +# Return an array of filepaths relative to src_dir to include before jasmine specs. +# Default: [] +# +# EXAMPLE: +# +# src_files: +# - lib/source1.js +# - lib/source2.js +# - dist/**/*.js +# +src_files: + - assets/application.js + +# stylesheets +# +# Return an array of stylesheet filepaths relative to src_dir to include before jasmine specs. +# Default: [] +# +# EXAMPLE: +# +# stylesheets: +# - css/style.css +# - stylesheets/*.css +# +stylesheets: + - stylesheets/**/*.css + +# helpers +# +# Return an array of filepaths relative to spec_dir to include before jasmine specs. +# Default: ["helpers/**/*.js"] +# +# EXAMPLE: +# +# helpers: +# - helpers/**/*.js +# +helpers: + - helpers/**/*.js + +# spec_files +# +# Return an array of filepaths relative to spec_dir to include. +# Default: ["**/*[sS]pec.js"] +# +# EXAMPLE: +# +# spec_files: +# - **/*[sS]pec.js +# +spec_files: + - '**/*[sS]pec.js' + +# src_dir +# +# Source directory path. Your src_files must be returned relative to this path. Will use root if left blank. +# Default: project root +# +# EXAMPLE: +# +# src_dir: public +# +src_dir: + +# spec_dir +# +# Spec directory path. Your spec_files must be returned relative to this path. +# Default: spec/javascripts +# +# EXAMPLE: +# +# spec_dir: spec/javascripts +# +spec_dir: spec/javascripts