wcc-styles 0.1.0

checksums.yaml

@@ -0,0 +1,7 @@
+---
+SHA1:
+  metadata.gz: 8168edb3a3c277525950f322c038700947026a2e
+  data.tar.gz: bed865fcb8f30fe8e53c05e525c09c5c6a6bec97
+SHA512:
+  metadata.gz: d490b8f06371f3be68a5e13cfc6d29fb3d5f243c8118174d121f62ff40f1cb06679197993230a2f9f94932dd04ece9b92bc5381bbeefa53e16c31b52dff7eb74
+  data.tar.gz: 831b8eddc93e927540e5fb617391c0a79cae00359defae652b588744bba1b70e2a41c05f9e84d5414b072ae2d2ade6fe1dbf42307925c50302e74cc5f37a76ed

data/README-GEM.md

@@ -0,0 +1,43 @@
+# WCC::Styles
+
+This gem holds all of the styles for Watermark apps. For Rails apps a
+Rails Engine will automatically be set up that configures the asset
+pipeline properly.
+
+## Installation
+
+Add these lines to your application's Gemfile:
+
+```ruby
+gem 'wcc-styles'
+
+source 'https://rails-assets.org' do
+  gem 'rails-assets-selectize'
+  gem 'rails-assets-dropzone'
+  gem 'rails-assets-moment'
+  gem 'rails-assets-datetimepicker', '2.4.5'
+end
+
+```
+
+And then execute:
+
+    $ bundle
+
+## Usage
+
+The assets are all namespaced in `wcc/styles` within the asset pipeline.
+So to include styles in an `application.sass` within your application
+include the following line:
+
+```sass
+# Import all styles
+@import "wcc/styles/base/all";
+```
+
+To include the Javascript code add this to your `application.js`:
+
+```javascript
+//= require wcc/styles/application
+```
+

data/lib/assets/images/wcc/styles/logo-dark.svg

@@ -0,0 +1,19 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 18.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 612 792" enable-background="new 0 0 612 792" xml:space="preserve">
+<g id="Layer_1_1_">
+	<path fill="#393939" d="M435.9,90H176.6C79.1,90,0,169.1,0,266.6v259.3c0,97,79.1,176.6,176.6,176.6h259.3
+		c97,0,176.6-79.1,176.6-176.6V266.6C612,169.1,532.9,90,435.9,90z M176.6,138.8h259.3c70.3,0,127.3,57,127.3,127.3v93.4
+		c-47.7,40-96.5,45.7-148.4,38.5l27.2-102.7c3.6-12.8-4.1-26.7-17.5-29.8c-12.8-3.6-26.7,4.1-29.8,17.5c0,0-13.9,51.3-28.2,105.8
+		c-3.6-1-6.7-1.5-10.3-2.6c-13.3-53.4-25.7-102.7-25.7-102.7c-2.6-10.8-12.3-18.5-23.6-18.5l0,0c-11.3,0-21.1,7.7-23.6,18.5
+		c0,0-8.7,35.4-19.5,78.6c-8.7-2.1-17.5-3.6-26.2-5.1c-11.3-41.1-20.5-73.9-20.5-73.9c-3.6-12.8-16.9-20.5-30.3-16.9
+		c-12.8,3.6-20.5,16.9-16.9,30.3l15.4,54.9c-3.6,0-7.2,0-10.8,0c-54.4,0-97,15.4-125.3,29.8V266.6
+		C48.8,196.3,106.3,138.8,176.6,138.8z M435.9,653.2H176.6c-70.3,0-127.3-57-127.3-127.3v-87.3c16.9-12.3,60.6-38.5,125.3-38.5
+		c8.2,0,16.4,0.5,24.6,1L230,512c3.1,10.8,12.8,18,24.1,18c11.3,0,20.5-7.7,23.6-18.5c0,0,10.3-41.6,22.6-89.3
+		c3.6,1,7.2,2.1,10.8,3.1c2.1,0.5,4.1,1,6.2,1.5c11.3,45.7,21.1,84.7,21.1,84.7c2.6,10.8,12.3,18.5,23.6,18.5
+		c11.3,0,21.1-7.2,23.6-18l17.5-65.2c53.4,8.2,107.3,5.6,160.7-26.2v105.8C563.2,595.7,506.2,653.2,435.9,653.2z"/>
+</g>
+<g id="Layer_2">
+</g>
+</svg>

data/lib/assets/images/wcc/styles/logo.svg

@@ -0,0 +1,15 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 18.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 119.2 119.2" enable-background="new 0 0 119.2 119.2" xml:space="preserve">
+<path fill="#FFFFFF" d="M84.9,0H34.4C15.4,0,0,15.4,0,34.4v50.5c0,18.9,15.4,34.4,34.4,34.4h50.5c18.9,0,34.4-15.4,34.4-34.4V34.4
+	C119.2,15.4,103.8,0,84.9,0z M34.4,9.5h50.5c13.7,0,24.8,11.1,24.8,24.8v18.2c-9.3,7.8-18.8,8.9-28.9,7.5l5.3-20
+	c0.7-2.5-0.8-5.2-3.4-5.8c-2.5-0.7-5.2,0.8-5.8,3.4c0,0-2.7,10-5.5,20.6c-0.7-0.2-1.3-0.3-2-0.5c-2.6-10.4-5-20-5-20
+	c-0.5-2.1-2.4-3.6-4.6-3.6h0c-2.2,0-4.1,1.5-4.6,3.6c0,0-1.7,6.9-3.8,15.3c-1.7-0.4-3.4-0.7-5.1-1c-2.2-8-4-14.4-4-14.4
+	c-0.7-2.5-3.3-4-5.9-3.3c-2.5,0.7-4,3.3-3.3,5.9l3,10.7c-0.7,0-1.4,0-2.1,0c-10.6,0-18.9,3-24.4,5.8V34.4
+	C9.5,20.7,20.7,9.5,34.4,9.5z M84.9,109.7H34.4c-13.7,0-24.8-11.1-24.8-24.8v-17c3.3-2.4,11.8-7.5,24.4-7.5c1.6,0,3.2,0.1,4.8,0.2
+	l6,21.6c0.6,2.1,2.5,3.5,4.7,3.5c2.2,0,4-1.5,4.6-3.6c0,0,2-8.1,4.4-17.4c0.7,0.2,1.4,0.4,2.1,0.6c0.4,0.1,0.8,0.2,1.2,0.3
+	c2.2,8.9,4.1,16.5,4.1,16.5c0.5,2.1,2.4,3.6,4.6,3.6c2.2,0,4.1-1.4,4.6-3.5l3.4-12.7c10.4,1.6,20.9,1.1,31.3-5.1v20.6
+	C109.7,98.5,98.6,109.7,84.9,109.7z"/>
+</svg>

data/lib/assets/javascripts/wcc/styles/application.js

@@ -0,0 +1,3 @@
+//= require wcc/styles/selectize
+//= require wcc/styles/tessa
+//= require wcc/styles/wcc.datetimepicker

data/lib/assets/javascripts/wcc/styles/selectize.js

@@ -0,0 +1,13 @@
+//= require sifter
+//= require microplugin
+//= require selectize
+
+var $ = window.jQuery;
+
+$(function () {
+  $('body.enable-selectize select:not(.no-selectize)').each(function(i, item) {
+    $(item).selectize({
+      hideSelected: false
+    });
+  });
+});

data/lib/assets/javascripts/wcc/styles/tessa.js.coffee

@@ -0,0 +1,173 @@
+#= require dropzone
+
+window.WCC ||= {}
+$ = window.jQuery
+
+Dropzone.autoDiscover = off
+
+class window.WCC.Dropzone extends Dropzone
+
+  uploadFile: (file) ->
+    xhr = new XMLHttpRequest
+    file.xhr = xhr
+
+    # Set in our custom accept method
+    xhr.open file.uploadMethod, file.uploadURL, true
+
+    response = null
+
+    handleError = =>
+      @_errorProcessing [file], response || @options.dictResponseError.replace("{{statusCode}}", xhr.status), xhr
+
+    updateProgress = (e) =>
+      if e?
+        progress = 100 * e.loaded / e.total
+
+        file.upload =
+          progress: progress
+          total: e.total
+          bytesSent: e.loaded
+      else
+        # Called when the file finished uploading
+
+        allFilesFinished = yes
+
+        progress = 100
+
+        allFilesFinished = no unless file.upload.progress == 100 and file.upload.bytesSent == file.upload.total
+        file.upload.progress = progress
+        file.upload.bytesSent = file.upload.total
+
+        # Nothing to do, all files already at 100%
+        return if allFilesFinished
+
+      @emit "uploadprogress", file, progress, file.upload.bytesSent
+
+    xhr.onload = (e) =>
+      return if file.status == WCC.Dropzone.CANCELED
+      return unless xhr.readyState is 4
+
+      response = xhr.responseText
+
+      if xhr.getResponseHeader("content-type") and ~xhr.getResponseHeader("content-type").indexOf "application/json"
+        try
+          response = JSON.parse response
+        catch e
+          response = "Invalid JSON response from server."
+
+      updateProgress()
+
+      unless 200 <= xhr.status < 300
+        handleError()
+      else
+        @_finished [file], response, e
+
+    xhr.onerror = =>
+      return if file.status == WCC.Dropzone.CANCELED
+      handleError()
+
+    # Some browsers do not have the .upload property
+    progressObj = xhr.upload ? xhr
+    progressObj.onprogress = updateProgress
+
+    headers =
+      "Accept": "application/json",
+      "Cache-Control": "no-cache",
+      "X-Requested-With": "XMLHttpRequest",
+
+    extend headers, @options.headers if @options.headers
+
+    xhr.setRequestHeader headerName, headerValue for headerName, headerValue of headers
+
+    @emit "sending", file, xhr
+
+    xhr.send file
+
+  uploadFiles: (files) ->
+    @uploadFile(file) for file in files
+
+WCC.Dropzone.uploadPendingWarning =
+  "File uploads have not yet completed. If you submit the form now they will
+  not be saved. Are you sure you want to continue?"
+
+WCC.Dropzone.prototype.defaultOptions.url = "UNUSED"
+
+WCC.Dropzone.prototype.defaultOptions.dictDefaultMessage = "Drop files or click to upload."
+
+WCC.Dropzone.prototype.defaultOptions.accept = (file, done) ->
+  dz = $(file._removeLink).closest('.tessa-upload').first()
+  tessaParams = dz.data('tessa-params') or {}
+
+  postData =
+    name: file.name
+    size: file.size
+    mime_type: file.type
+
+  postData = $.extend postData, tessaParams
+
+  $.ajax '/tessa/uploads',
+    type: 'POST',
+    data: postData,
+    success: (response) ->
+      file.uploadURL = response.upload_url
+      file.uploadMethod = response.upload_method
+      file.assetID = response.asset_id
+      done()
+    error: (response) ->
+      done("Failed to initiate the upload process!")
+
+$ ->
+  $('form:has(.tessa-upload)').each (i, form) ->
+    $form = $(form)
+    $form.bind 'submit', (event) ->
+      safeToSubmit = true
+      $form.find('.tessa-upload').each (j, dropzoneElement) ->
+        $(dropzoneElement.dropzone.files).each (k, file) ->
+          if file.status? and (file.status != WCC.Dropzone.SUCCESS)
+            safeToSubmit = false
+      if not safeToSubmit and not confirm(WCC.Dropzone.uploadPendingWarning)
+        return false
+
+  $('.tessa-upload').each (i, item) ->
+    $item = $(item)
+    args =
+      maxFiles: 1
+      addRemoveLinks: true
+
+    $.extend args, $item.data("dropzone-options")
+    args.maxFiles = null if $item.hasClass("multiple")
+    inputPrefix = $item.data("asset-field-prefix")
+
+    dropzone = new WCC.Dropzone item, args
+
+    $item.find('input[type="hidden"]').each (j, input) ->
+      $input = $(input)
+      mockFile = $input.data("meta")
+      mockFile.accepted = true
+      dropzone.options.addedfile.call(dropzone, mockFile)
+      dropzone.options.thumbnail.call(dropzone, mockFile, mockFile.url)
+      dropzone.emit("complete", mockFile)
+      dropzone.files.push mockFile
+
+    updateAction = (file) ->
+      return unless file.assetID?
+      inputID = "#tessa_asset_action_#{file.assetID}"
+      actionInput = $(inputID)
+      unless actionInput.length
+        actionInput = $('<input type="hidden">')
+          .attr
+            id: inputID
+            name: "#{inputPrefix}[#{file.assetID}][action]"
+          .appendTo item
+
+      actionInput.val file.action
+
+    dropzone.on 'success', (file) ->
+      file.action = "add"
+      updateAction(file)
+
+    dropzone.on 'removedfile', (file) ->
+      file.action = "remove"
+      updateAction(file)
+
+

data/lib/assets/javascripts/wcc/styles/wcc.datetimepicker.js

@@ -0,0 +1,50 @@
+//= require moment
+//= require datetimepicker
+
+Date.parseDate = function( input, format ){
+  return moment(input,format).toDate();
+};
+Date.prototype.dateFormat = function( format ){
+  return moment(this).format(format);
+};
+
+if (typeof window.WCC == "undefined") window.WCC = {};
+
+WCC.datetimepicker = (function() {
+  var dtp = {};
+  var DDF = "MM/DD/YYYY";
+  var DTF = "h:mm a";
+
+  dtp.defaultConfig = {
+    format:      DDF + " " + DTF,
+    formatDate:  DDF,
+    formatTime:  DTF,
+    scrollMonth: false,
+    step: 30
+  };
+
+  return dtp;
+}());
+
+$(function() {
+  $("[data-datetimepicker]").each(function(i, item) {
+    var $item = $(item);
+    var $input = $($item.data('datetimepicker'));
+    var options = $item.data('datetimepicker-options');
+
+    item.config = $.extend({}, WCC.datetimepicker.defaultConfig, options);
+    $item.datetimepicker(item.config);
+
+    if (!$input.length) return;
+
+    $item.on('change', function(event) {
+      var time = moment(this.value, [this.config.format]);
+      if (time.isValid()) {
+        $input.val(time.toISOString());
+      } else {
+        $input.val('');
+      }
+    });
+  });
+});
+

data/lib/assets/stylesheets/wcc/styles/admin/_admin_base.scss

@@ -0,0 +1,24 @@
+.layout-header {
+  margin-top: 5px;
+  .logo {
+    @media(max-width: 768px) {
+      width: 100%;
+      text-align: center;
+    }
+  }
+  img {
+    width: 75px;
+    height: 75px;
+  }
+  .navbar-container {
+    margin-top: 15px;
+  }
+}
+
+.page-header {
+  position: relative;
+  div.actions {
+    position: absolute;
+    right: 0; bottom: 5px;
+  }
+}

data/lib/assets/stylesheets/wcc/styles/admin/_all.scss

@@ -0,0 +1 @@
+@import "admin_base";

data/lib/assets/stylesheets/wcc/styles/apps/_all.scss

@@ -0,0 +1,2 @@
+@import "events";
+@import "staff";

data/lib/assets/stylesheets/wcc/styles/apps/_events.scss

@@ -0,0 +1,22 @@
+.scheduled-occurrence {
+  background-color: $neutral1;
+  padding: 10px;
+  margin: 3px 0;
+  width: 100%;
+  float: left;
+  display: inline-block;
+
+  .start-date {
+    float: left;
+  }
+
+  .remove {
+    float: right;
+  }
+}
+
+.date-box {
+  border: 1px solid $neutral2;
+  padding: 15px 20px;
+  margin-bottom: 20px;
+}

data/lib/assets/stylesheets/wcc/styles/apps/_staff.scss

@@ -0,0 +1,151 @@
+.helpdesk {
+  float: right;
+  margin: 0px 15px 0 0;
+  padding: 0;
+
+  @media (max-width: 768px) {
+    display: none;
+  }
+
+  .btn {
+    display: inline;
+  }
+}
+
+.responsive-icon {
+  margin-right: 10px;
+
+  &:last-child {
+    margin-right: 0;
+  }
+}
+
+.responsive-text-hide {
+  float: right;
+}
+
+.auth-apps {
+  @include box-shadow(rgba(0,0,0,0.2) 0px 3px 20px inset);
+  background-color: $text;
+  padding: 20px;
+  text-align: center;
+
+  h3 {
+    display: inline-block;
+    width: auto;
+  }
+
+  ul.apps {
+    padding: 0;
+    margin: 0;
+    list-style: none;
+
+    li {
+      display: inline-block;
+      font-weight: 600;
+      font-size: 10px;
+      color: white;
+      text-transform: uppercase;
+      letter-spacing: .16em;
+      margin: 0 5px;
+
+      &.app-link {
+        margin: 0 3px;
+        border: 1px solid $light-grey;
+
+        a {
+          color: $light-grey;
+          font-size: 10px;
+          font-weight: 400;
+          padding: 6px 15px;
+          display: block;
+          text-transform: uppercase;
+          letter-spacing: .16em;
+        }
+      }
+
+    }
+  }
+}
+
+.staff-section {
+  border-bottom: 2px solid #F0F0F0;
+  position: relative;
+  float: left;
+  width: 100%;
+  min-height: 400px;
+}
+
+.staff-section .gif-holder {
+  -webkit-background-size: cover;
+  -moz-background-size: cover;
+  -o-background-size: cover;
+  background-size: cover;
+
+  min-height: 400px;
+  position: absolute;
+  top: 0px;
+  left: 0px;
+  right: 0px;
+  bottom: 0px;
+  display: inline;
+}
+
+@media (max-width: 768px) {
+  .staff-section .gif-holder {
+    width: 100%;
+    min-height: 300px;
+    float:left;
+    display: block;
+  }
+}
+
+.staff-section .section-links {
+  padding: 50px 50px 70px 50px;
+  float: right;
+}
+
+@media (max-width: 768px) {
+  .staff-section .gif-holder {
+    position: relative;
+  }
+  .staff-section .section-links {
+    padding: 30px;
+    float: left;
+    display: inline;
+  }
+}
+
+.staff-section .section-links ul.boxed-links {
+  list-style: none;
+  margin: 0;
+  padding: 0;
+}
+
+.staff-section .section-links ul.boxed-links li {
+  float: left;
+  display: inline-block;
+  margin: 10px 20px 10px 0;
+}
+
+.staff-section .section-links ul.boxed-links li a {
+  -moz-border-radius: 10px;
+  -webkit-border-radius: 10px;
+  background-color: #F2F2F2;
+  border-radius: 10px;
+  color: #292929;
+  display: inline-block;
+  float: left;
+  padding: 20px 30px;
+  transition: all 0.2s ease;
+}
+
+@media (max-width: 768px) {
+  .staff-section .section-links ul.boxed-links li a {
+    padding: 10px 20px;
+  }
+}
+
+.staff-section .section-links ul.boxed-links li a:hover {
+  color: #EB7F4C;
+}