Skip to content

Commit

Permalink
Merge branch 'testing'
Browse files Browse the repository at this point in the history 
* testing:
  Updated changelog and readme for 0.4.0
  0.4.0 deployment
  • Loading branch information
@kevinberonilla
kevinberonilla committed Apr 18, 2017
2 parents bd57be5 + 1ab7826 commit f85ff5f
Show file tree
Hide file tree
Showing 50 changed files with 1,912 additions and 287 deletions.
37 changes: 32 additions & 5 deletions CHANGELOG.md
View file
@@ -1,5 +1,32 @@
# Strike by Appiphony

### Release 0.4.0 — April 18, 2017

#### New Features
* **Strike Multi Lookup:** Similar to Strike Multi Select Picklist, Strike Multi Lookup gives the user the ability to select multiple Salesforce records in one field
* **Strike Popover:** Similar to Strike Tooltip, a Strike Popover appears when a user hovers over its trigger element and can display markup/components in its body
* **Strike Tile:** A grouping of information that can be used to describe a record (fiddler and documentation coming soon; used in Strike Multi Lookup)
#### Improvements
* **Strike Datepicker:** Datepickers now use the system's datepicker on mobile devices <a href="https://github.com/appiphony/Strike-Components/issues/14" target="_blank">[GitHub Issue #14]</a>
* **Strike Input:** Added support for the `checkbox`, `radio`, and `toggle` types
* **Strike Input:** Added the `showError(errorMessage)` and `hideError()` methods
* **Strike Multi Select Picklist:** Added the `onchange` attribute that calls a controller method when a selection is added or removed
* **Strike Multi Select Picklist:** A "no results" message has been added
* **Strike Option:** Renamed the `strike_filterBy()` and `strike_optionSelected()` methods to `filterBy()` and `select()` respectively
* **Strike Option Group:** Renamed the `strike_filterBy()` method to `filterBy()`
* **Strike Select:** Strike Option Groups no longer display when `searchable` is set to `true` and no results in that group are found
* **Strike Select:** A "no results" message has been added when searchable is set to true
* **Strike Textarea:** Added the `blur()`, `focus()`, `select()`, `showError(errorMessage)`, and `hideError()` methods
#### Bug Fixes
* **Strike Datepicker:** Fixed an issue where datepickers were unintentionally closing when clicking the Today link, left/right month arrows, and year select <a href="https://github.com/appiphony/Strike-Components/issues/9" target="_blank">[GitHub Issue #9]</a>
* **Strike Multi Select Picklist:** Fixed an issue where options were not filterable on mobile devices, though the input was still in focus behind the overlay <a href="https://github.com/appiphony/Strike-Components/issues/10" target="_blank">[GitHub Issue #10]</a>
* **Strike Multi Select Picklist:** Fixed an issue where multiple selections could not be made on iOS <a href="https://github.com/appiphony/Strike-Components/issues/11" target="_blank">[GitHub Issue #11]</a>
* **Strike Multi Select Picklist:** Fixed an issue where options were not reset after closing the picklist immediately after a search that yielded no results <a href="https://github.com/appiphony/Strike-Components/issues/13" target="_blank">[GitHub Issue #13]</a>
* **Strike Select:** Fixed an issue where clicking/tapping on the search input (when `searchable` is set to `true`) closes the dropdown
* **Strike Select:** Fixed an issue where searches also returned option groups and sometimes displayed incorrect results

---

### Release 0.3.0 — March 31, 2017

#### Improvements
Expand Down Expand Up @@ -38,11 +65,11 @@
* **Strike Textarea:** Added the `helpText` attribute for descriptive tooltips (appears after the form label)
#### Bug Fixes
* **Strike Datepicker:** Fixed an issue where the menu opens when tabbing into the input
* **Strike Datepicker:** Fixed an issue where clicking the SVG portion of the datepicker's button did not open the menu in Microsoft Edge <a href="https://github.com/appiphony/Strike-Components/issues/5" target="_blank">(GitHub Issue #5)</a>
* **Strike Lookup**: Fixed an issue where records were still selected after closing the menu without confirming a selection <a href="https://github.com/appiphony/Strike-Components/issues/2" target="_blank">(GitHub Issue #2)</a>
* **Strike Lookup**: Fixed an issue where the menu doesn't close when tabbing out of the input <a href="https://github.com/appiphony/Strike-Components/issues/4" target="_blank">(GitHub Issue #4)</a>
* **Strike Datepicker:** Fixed an issue where clicking the SVG portion of the datepicker's button did not open the menu in Microsoft Edge <a href="https://github.com/appiphony/Strike-Components/issues/5" target="_blank">[GitHub Issue #5]</a>
* **Strike Lookup**: Fixed an issue where records were still selected after closing the menu without confirming a selection <a href="https://github.com/appiphony/Strike-Components/issues/2" target="_blank">[GitHub Issue #2]</a>
* **Strike Lookup**: Fixed an issue where the menu doesn't close when tabbing out of the input <a href="https://github.com/appiphony/Strike-Components/issues/4" target="_blank">[GitHub Issue #4]</a>
* **Strike Lookup**: Fixed an issue where the input's search icon was incorrectly positioned
* **Strike Lookup**: Removed `debugger` line <a href="https://github.com/appiphony/Strike-Components/issues/6" target="_blank">(GitHub Issue #6)</a>
* **Strike Lookup**: Removed `debugger` line <a href="https://github.com/appiphony/Strike-Components/issues/6" target="_blank">[GitHub Issue #6]</a>
* **Strike Multi Select Picklist**: Fixed an issue where the input's search icon was incorrectly positioned
* **Strike Multi Select Picklist**: Fixed an issue where selected pills did not have spacing between them
* **Strike Select:** Fixed an issue where the component was not focusable
Expand All @@ -54,7 +81,7 @@
### Release 0.1.1 — March 1, 2017

#### Bug Fixes
* **Lookup:** Fixed an issue where records with `null` values for the `search` and `subtitle` fields caused lookups to throw an exception <a href="https://github.com/appiphony/Strike-Components/issues/1" target="_blank">(GitHub Issue #1)</a>
* **Lookup:** Fixed an issue where records with `null` values for the `search` and `subtitle` fields caused lookups to throw an exception <a href="https://github.com/appiphony/Strike-Components/issues/1" target="_blank">[GitHub Issue #1]</a>

---

Expand Down
7 changes: 6 additions & 1 deletion README.md
View file
@@ -1,6 +1,6 @@
# Strike by Appiphony
### Work smarter (not harder) with Salesforce Lightning Components
Current release: 0.3.0
Current release: 0.4.0
See it in action here: <a href="http://www.lightningstrike.io" target="_blank">http://www.lightningstrike.io</a>

---
Expand All @@ -12,11 +12,16 @@ See it in action here: <a href="http://www.lightningstrike.io" target="_blank">h
* Inputs
* Lookups
* Modals
* Multi Lookups
* Multi Select Picklists
* Options
* Option Groups
* Pills
* Popovers
* Selects
* SVGs
* Textareas
* Tiles
* Tooltips

---
Expand Down
40 changes: 33 additions & 7 deletions aura/strike_datepicker/strike_datepicker.cmp
View file
Expand Up @@ -45,31 +45,52 @@

<aura:attribute name="datePickerOpen" type="Boolean" default="false" access="private"/>
<aura:attribute name="readOnly" type="Boolean" default="{!false}" access="private"/>
<aura:attribute name="isMobile" type="Boolean" default="{!false}" access="private"/>

<!-- Event registration and handlers -->
<aura:handler name="init" value="{!this}" action="{!c.init}"/>
<aura:handler name="change" value="{!v.value}" action="{!c.valueChanged}"/>

<!-- Strike Datepicker -->
<div class="{!'slds-form-element' + if(v.error, ' slds-has-error', '')}">
<div class="{!'slds-form-element' + if(v.error, ' slds-has-error', '') + if(v.isMobile, ' sd-datepicker--mobile ', '')}">
<div class="strike-datepicker-input slds-input-has-icon slds-input-has-icon--right">
<div class="strike-live-area" onclick="{!c.clickedDateInput}">
<aura:if isTrue="{!v.isMobile}">
<c:strike_input
aura:id="date-input"
type="date"
label="{!v.label}"
helpText="{!v.helpText}"
name="{!v.name}"
class="{!v.class}"
placeholder="{!v.placeholder}"
type="text"
value="{!v.displayDate}"
readonly="{!v.readOnly}"
disabled="{!v.disabled}"
required="{!v.required}"
error="{!v.error}"
onblur="{!c.processNewDate}"
onchange="{!c.processNewDate}"
/>
</div>
<lightning:buttonIcon onclick="{!c.clickedDateIcon}" iconName="utility:event" size="medium" variant="bare" alternativeText="Date Picker" disabled="{!v.disabled}" class="strike-datepicker-input__icon"/>
<aura:set attribute="else">
<div class="strike-live-area" onclick="{!c.clickedDateInput}">
<c:strike_input
aura:id="date-input"
type="text"
label="{!v.label}"
helpText="{!v.helpText}"
name="{!v.name}"
class="{!v.class}"
placeholder="{!v.placeholder}"
value="{!v.displayDate}"
readonly="{!v.readOnly}"
disabled="{!v.disabled}"
required="{!v.required}"
error="{!v.error}"
onblur="{!c.processNewDate}"
/>
</div>
<lightning:buttonIcon onclick="{!c.clickedDateIcon}" iconName="utility:event" size="medium" variant="bare" alternativeText="Date Picker" disabled="{!v.disabled}" class="strike-datepicker-input__icon"/>
</aura:set>
</aura:if>
</div>
<aura:if isTrue="{!and(v.error, not(empty(v.errorMessage)))}">
<div class="slds-form-element__help sd-error-message">{!v.errorMessage}</div>
Expand All @@ -91,11 +112,16 @@
</a>
</div>
</div>
<div class="slds-shrink-none">
<div class="slds-shrink-none slds-p-left--small">
<div class="sd-select_container">
<ui:inputSelect options="{!v.selectYears}" value="{!v.selectedYear}" change="{!c.yearChanged}" />
</div>
</div>
<!--<aura:if isTrue="{!v.isMobile}">
<div class="slds-shrink-none">
<lightning:button label="Cancel" variant="neutral" iconPosition="left" class="slds-m-left-|-small" onclick="{!c.closeDatepicker}" />
</div>
</aura:if>-->
</div>
<table class="datepicker__month" role="grid" aria-labelledby="month">
<thead>
Expand Down
56 changes: 52 additions & 4 deletions aura/strike_datepicker/strike_datepicker.css
View file
@@ -1,56 +1,72 @@
.THIS .strike-live-area {
pointer-events: none;
}

.THIS .strike-live-area .slds-form-element__label,
.THIS .strike-live-area .slds-input {
pointer-events: auto;
}

.THIS .strike-live-area .slds-input[readonly] {
cursor: text;
}

.THIS .strike-live-area .slds-input[readonly]:hover,
.THIS .strike-live-area .slds-input[readonly]:focus {
background-color: white;
}

.THIS .strike-live-area .slds-input[readonly][disabled] {
cursor: not-allowed;
}

.THIS .strike-live-area .slds-input[readonly][disabled]:hover {
background-color: t(colorBackgroundInputDisabled);
}

.THIS .strike-datepicker-input {
position: relative;
}

.THIS .strike-datepicker-input .strike-datepicker-input__icon {
position: absolute;
bottom: 0.5rem;
right: 0.5rem;
}

.THIS .strike-datepicker-input .strike-datepicker-input__icon:focus,
.THIS .strike-datepicker-input .strike-datepicker-input__icon:active {
outline: none;
box-shadow: none;
}

.THIS .strike-datepicker-input .strike-datepicker-input__icon .slds-button__icon {
pointer-events: none; /* Edge fix */
pointer-events: none;
/* Edge fix */
}

.THIS .slds-datepicker {
top: 3.5rem;
}

.THIS .slds-datepicker .slds-select[size],
.THIS .slds-datepicker .slds-select[multiple] {
height: calc(1.875rem + (1px * 2));
}

.THIS .slds-datepicker thead abbr {
text-transform: capitalize;
}

.THIS .slds-datepicker .slds-form-element__label {
display: none;
}

.THIS .slds-datepicker:focus,
.THIS .slds-datepicker:active {
outline: none;
}

.THIS .sd-select_container:before,
.THIS .sd-select_container:after {
position: absolute;
Expand All @@ -62,17 +78,21 @@
border-left: 3px solid transparent;
border-right: 3px solid transparent;
}

.THIS .sd-select_container {
position: relative;
}

.THIS .sd-select_container:before {
border-bottom: 5px solid t(colorBorderInverse);
top: calc((1.75rem / 2) - 6px);
}

.THIS .sd-select_container:after {
border-top: 5px solid t(colorBorderInverse);
border-top: 5px solid t(colorBorderInverse);
bottom: calc((1.75rem / 2) - 6px);
}

.THIS .sd-select_container select.uiInput {
-moz-appearance: none;
-webkit-appearance: none;
Expand All @@ -86,29 +106,57 @@
border: 1px solid #d8dde6;
border-radius: .25rem;
width: 100%;
transition: border .1s linear,background-color .1s linear;
transition: border .1s linear, background-color .1s linear;
height: calc(1.875rem + (1px * 2));
}


/* ----- Override lightning:input error states ----- */

.THIS.slds-form-element .is-required.slds-has-error .slds-input {
box-shadow: none;
border-color: t(colorBorderInput);
}

.THIS.slds-form-element .is-required.slds-has-error .slds-input:focus,
.THIS.slds-form-element .is-required.slds-has-error .slds-input:active {
border-color: t(colorBorderInputActive);
box-shadow: 0 0 3px #0070d2;
}

.THIS.slds-form-element.slds-has-error .is-required.slds-has-error .slds-input {
box-shadow: rgb(194, 57, 52) 0 0 0 1px inset;
border-color: t(colorBorderError);
}

.THIS.slds-form-element.slds-has-error .is-required.slds-has-error .slds-input:focus {
box-shadow: rgb(194, 57, 52) 0 0 0 1px inset, 0 0 3px #0070d2;
}

.THIS.slds-form-element.slds-has-error .strike-live-area .slds-input[readonly][disabled]:hover {
background-color: t(colorBackgroundInput);
}

.THIS .slds-form-element__help:not(.sd-error-message) {
display: none;
}
}


/* --------------------------------------------------
Salesforce1 Styles
-------------------------------------------------- */

.THIS.slds-form-element.sd-datepicker--mobile .slds-datepicker {
display: none; /* Now using system datepicker on mobile */
margin: 0;
border: none;
border-radius: 0;
box-shadow: none;
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
width: 100%;
max-width: 100%;
}
22 changes: 14 additions & 8 deletions aura/strike_datepicker/strike_datepickerController.js
View file
Expand Up @@ -4,22 +4,24 @@
helper.createLocaleDatePatternMap(component);
helper.processDateValue(component);

component.closeDatepicker = function(){
if(component.isValid()){
component.closeDatepicker = $A.getCallback(function(){
if (component.isValid()) {
helper.closeDatepicker(component, event, helper);
} else {
window.removeEventListener('click', component.closeDatepicker);
}
}
});

window.addEventListener('click', $A.getCallback(component.closeDatepicker));

component.set('v.isMobile', $A.get('$Browser.formFactor') == 'DESKTOP' ? false : true);
},
valueChanged: function(component, event, helper) {
var dateDebouncer = component.get('v.dateDebouncer');
var value = component.get('v.value');
var clickedValue = component.get('v.clickedValue');

if(value == clickedValue){
if (value == clickedValue) {
return;
}

Expand All @@ -31,11 +33,10 @@
var displayDate = component.get('v.displayDate');
var datePattern = component.get('v.valueFormat');
var locale = helper.getLocale();
var localeDatePattern = component.get('v.datePatternMap')[locale];

var localeDatePattern = helper.getLocaleDatePattern(component, locale);
var selectedDate = $A.localizationService.parseDateTime(displayDate, localeDatePattern, null, true);

if(selectedDate == null){
if (selectedDate == null) {
component.set('v.value', null);
component.set('v.timestamp', null);

Expand All @@ -45,7 +46,7 @@

var formattedDisplayDate = $A.localizationService.formatDate(selectedDate.toString(), datePattern);

if(currentValue == formattedDisplayDate){
if (currentValue == formattedDisplayDate) {
helper.closeDatepicker(component, event, helper);
return;
}
Expand All @@ -58,8 +59,10 @@
event.stopPropagation();
var notDisabled = !component.get('v.disabled');
var displayDate = component.get('v.displayDate');
var dateInput = component.find('date-input');

if(notDisabled && $A.util.isEmpty(displayDate)){
dateInput.blur();
helper.determineReadOnly(component);
component.set('v.datePickerOpen', true);
}
Expand Down Expand Up @@ -115,6 +118,9 @@
component.set('v.calendarRows', helper.getCalendarRows(component));
component.set('v.selectedMonthText', monthLabels[prevMonth].fullName);
},
closeDatepicker: function (component, event, helper) {
helper.closeDatepicker(component, event, helper);
},
yearChanged: function (component, event, helper) {
component.set('v.calendarRows', helper.getCalendarRows(component));
},
Expand Down

0 comments on commit f85ff5f

Please sign in to comment.