Merge branch 'develop' of github.com:martini/zammad into develop

This commit is contained in:
Martin Edenhofer 2015-11-24 13:38:08 +01:00
commit c190abf342
7 changed files with 141 additions and 71 deletions

28
LICENSE-3RD-PARTY.txt Normal file
View file

@ -0,0 +1,28 @@
-----------------------------------------------------------------------------
tinycolor-min.js by (c) Brian Grinstead
Source: https://github.com/bgrins/TinyColor
Copyright (c), Brian Grinstead, http://briangrinstead.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.
-----------------------------------------------------------------------------

View file

@ -66,6 +66,12 @@ class App.ChannelChat extends App.Controller
type: 'String'
description: 'CSS font-size with a unit like 12px, 1.5em. If left to undefined it inherits the font-size of the website.'
}
{
name: 'flat'
default: 'false'
type: 'boolean'
description: 'Removes the shadows for a flat look.'
}
{
name: 'buttonClass'
default: "'open-zammad-chat'"
@ -167,45 +173,47 @@ class App.ChannelChat extends App.Controller
if !src.startsWith('http')
src = "http://#{ src }"
@iframe.attr 'src', src
@urlInput.addClass('is-loading')
# clear swatches and iframe
@swatches.empty()
@iframe.attr('src', '').css('background-image', '')
$.ajax
url: 'https://images.zammad.com/api/v1/webpage/colors'
data:
url: src
count: 20
success: @renderSwatches
success: @renderDemoWebsite
dataType: 'json'
renderSwatches: (data, xhr, status) =>
renderDemoWebsite: (data) =>
# @iframe.attr 'src', src
@renderSwatches data
@urlInput.removeClass('is-loading')
renderSwatches: (swatches) ->
swatches = _.map swatches, tinycolor
# filter white
data = _.filter data, (color) =>
@getLuminance(color) < 0.85
swatches = _.filter swatches, (color) =>
0.25 < color.getLuminance() < 0.85
htmlString = ''
count = 0
countMax = 8
for color in data
count += 1
max = 8
for color, i in swatches
htmlString += App.view('channel/color_swatch')
color: color
break if count == countMax
color: color.toHexString()
break if i is max
@swatches.html htmlString
if data[0]
@useSwatchColor(undefined, data[0])
getLuminance: (hex) ->
# input: #ffffff, output: 1
result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec hex
r = parseInt(result[1], 16)
g = parseInt(result[2], 16)
b = parseInt(result[3], 16)
return (0.2126*r + 0.7152*g + 0.0722*b)/255
# auto use first color
if swatches[0]
@useSwatchColor undefined, swatches[0].toHexString()
useSwatchColor: (event, code) ->
if event
@ -267,6 +275,11 @@ class App.ChannelChat extends App.Controller
if parseInt(params.fontSize, 10) > 2
@chat.css('font-size', params.fontSize)
@chatBackground.css('background', params.background)
if params.flat is 'on'
@chat.addClass('zammad-chat--flat')
params.flat = true
else
@chat.removeClass('zammad-chat--flat')
if @permanent
for key, value of @permanent
@ -278,7 +291,7 @@ class App.ChannelChat extends App.Controller
# coffeelint: disable=no_unnecessary_double_quotes
paramString += ",\n"
# coffeelint: enable=no_unnecessary_double_quotes
if value == 'true' || value == 'false' || _.isNumber(value)
if value == true || value == false || _.isNumber(value)
paramString += " #{key}: #{value}"
else
paramString += " #{key}: '#{quote(value)}'"

File diff suppressed because one or more lines are too long

View file

@ -63,7 +63,7 @@
<div class="browser-head">
<form class="browser-input js-testurl" novalidate>
<input type="url" class="js-testurl-input" id="preview-iframe" placeholder="zammad.org">
<span class="help-block"><%- @T("Because of security reasons some websites can't be displayed (for example google.com).") %></span>
<div class="loading icon small"></div>
</form>
</div>
<div class="browser-body js-demo">
@ -138,6 +138,17 @@
</div>
<span class="help-block"><%- @T('The default font size is 12px.') %></span>
</div>
<div class="switch form-group formGroup--halfSize">
<div class="formGroup-label">
<label for="form-chat-flat"><%- @T('Flat Design') %></label>
</div>
<div class="controls">
<div class="zammad-switch">
<input name="flat" type="checkbox" id="form-chat-flat">
<label for="form-chat-flat"></label>
</div>
</div>
</div>
</fieldset>
<br>
@ -159,16 +170,6 @@
</span>
<%- @T('Enable debugging for implementation.') %>
</label>
<tr>
<td>
<label class="inline-label">
<span class="checkbox-replacement checkbox-replacement--inline">
<input type="checkbox" name="flat" value="true">
<%- @Icon('checkbox', 'icon-unchecked') %>
<%- @Icon('checkbox-checked', 'icon-checked') %>
</span>
<%- @T('Flat design.') %>
</label>
</tbody>
</table>
</form>

View file

@ -30,7 +30,7 @@
<span class="counter badge badge--big"><%= item.counter %></span>
<% end %>
<% if item.switch isnt undefined: %>
<span class="zammad-switch zammad-switch--dark zammad-switch--small">
<span class="zammad-switch zammad-switch--dark zammad-switch--small zammad-switch--green">
<input type="checkbox" id="<%- item.class %>-switch" class="js-switch" <% if item.switch: %>checked<% end %>>
<label for="<%- item.class %>-switch"></label>
</span>

View file

@ -1383,6 +1383,12 @@ textarea,
&.form-control--multiline {
height: auto;
}
&:focus,
&.focus {
border-color: hsl(200,71%,59%);
box-shadow: 0 0 0 3px hsl(201,62%,90%);
}
}
input[type=url] {
@ -1417,8 +1423,6 @@ input.time.time--12 {
width: 7.5ch;
}
.form-control:focus,
.form-control.focus,
.tokenfield.focus {
border-color: hsl(200,71%,59%);
box-shadow: 0 0 0 3px hsl(201,62%,90%);
@ -6451,10 +6455,10 @@ output {
}
.zammad-switch {
overflow: hidden;
width: 50px;
height: 30px;
border-radius: 15px;
overflow: hidden;
&.zammad-switch--small {
width: 40px;
@ -6473,9 +6477,14 @@ output {
background: hsl(234,10%,19%);
}
}
&.zammad-switch--green input:checked + label {
background: $supergood-color;
}
}
.zammad-switch label {
margin: 0;
position: relative;
width: 100%;
height: 100%;
@ -6483,44 +6492,46 @@ output {
outline: none;
cursor: pointer;
background: white;
box-shadow: 0 0 0 1px rgba(0,0,0,.2) inset;
box-shadow: 0 0 0 1px rgba(0,0,0,.1) inset;
user-select: none;
transition: background 200ms;
&:after {
content: "";
position: absolute;
transition: transform 200ms;
width: calc(60% - 2px);
height: calc(100% - 2px);
border-radius: inherit;
left: 1px;
top: 1px;
box-shadow:
0 0 0 1px rgba(0,0,0,.05),
0 1px 3px rgba(0,0,0,.2);
background: white;
}
}
.zammad-switch input {
display: none;
&:focus + label {
transition: none;
background: hsl(200,71%,59%);
box-shadow: 0 0 0 3px hsl(201,62%,90%);
}
&:checked + label {
background: hsl(200,71%,59%);
}
&:checked + label:after {
transform: translateX(70%);
}
}
.zammad-switch input:checked + label {
background: $supergood-color;
transition: none;
}
.zammad-switch input:focus + label {
transition: none;
background: hsl(200,71%,59%);
box-shadow: 0 0 0 3px hsl(201,62%,90%);
}
.zammad-switch label:after {
content: "";
position: absolute;
transition: transform 200ms;
}
.zammad-switch label:after {
width: calc(60% - 2px);
height: calc(100% - 2px);
border-radius: inherit;
left: 1px;
top: 1px;
box-shadow:
0 0 0 1px rgba(0,0,0,.05),
0 1px 3px rgba(0,0,0,.2);
background: white;
}
.zammad-switch input:checked + label:after {
transform: translateX(70%);
.controls .zammad-switch {
margin-top: 10px;
}
.horizontal-filter-text {
@ -7439,10 +7450,22 @@ output {
.browser-input {
flex: 1;
margin-right: 10px;
position: relative;
input {
min-width: 0;
padding-right: 40px;
}
.loading.icon {
position: absolute;
right: 11px;
top: 11px;
display: none;
}
&.is-loading .loading.icon {
display: block;
}
}

View file

@ -13,6 +13,7 @@ do($ = window.jQuery, window) ->
host: ''
port: 6042
debug: false
flat: false
fontSize: undefined
buttonClass: 'open-zammad-chat'
inactiveClass: 'is-inactive'