зеркало из https://github.com/wadewegner/GIFter.git
GIPHY searches working
This commit is contained in:
Родитель
4f0dd007f8
Коммит
083f7f77e5
|
@ -1,3 +1,5 @@
|
|||
<aura:component implements="force:appHostable">
|
||||
<aura:component implements="force:appHostable,flexipage:availableForAllPageTypes">
|
||||
|
||||
Post GIF to Chatter
|
||||
|
||||
</aura:component>
|
||||
|
|
|
@ -1,3 +1,45 @@
|
|||
<aura:component implements="force:appHostable">
|
||||
<aura:component implements="force:appHostable,flexipage:availableForAllPageTypes">
|
||||
|
||||
</aura:component>
|
||||
<aura:attribute name="searchTerms" type="String" />
|
||||
<aura:attribute name="results" type="Map" />
|
||||
|
||||
<aura:handler name="init" value="{!this}" action="{!c.doInit}" />
|
||||
|
||||
<ltng:require scripts="{!join(',',
|
||||
$Resource.jquery331,
|
||||
$Resource.GIPHY)}" afterScriptsLoaded="{!c.afterScriptsLoaded}" />
|
||||
|
||||
<lightning:card>
|
||||
|
||||
<lightning:layout verticalAlign="end" class="path-to-zip slds-m-around--small">
|
||||
<lightning:layoutitem flexibility="grow">
|
||||
<span onkeypress="{!c.keyCheck}">
|
||||
<lightning:input aura:id="searchTerms" type="text" label="Search Terms" value="{!v.searchTerms}" />
|
||||
</span>
|
||||
</lightning:layoutitem>
|
||||
<lightning:layoutitem>
|
||||
<lightning:button onclick="{!c.search}">Search</lightning:button>
|
||||
</lightning:layoutitem>
|
||||
</lightning:layout>
|
||||
|
||||
</lightning:card>
|
||||
|
||||
<lightning:card>
|
||||
<lightning:layout horizontalAlign="center" multipleRows="true">
|
||||
|
||||
<aura:iteration items="{!v.results}" var="result">
|
||||
<lightning:layoutItem padding="around-small" size="8" smallDeviceSize="6" mediumDeviceSize="4" largeDeviceSize="3">
|
||||
|
||||
<div class="gif-image">
|
||||
<a onclick="{!c.gifSelected}">
|
||||
<img src="{!result.images.fixed_height.url}"></img>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
</lightning:layoutItem>
|
||||
</aura:iteration>
|
||||
|
||||
</lightning:layout>
|
||||
</lightning:card>
|
||||
|
||||
</aura:component>
|
|
@ -1,2 +1,16 @@
|
|||
.THIS {
|
||||
.THIS .gif-image {
|
||||
position:relative;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
display: block;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
.THIS .path-to-zip {
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.THIS .path-to-zip .slds-button {
|
||||
margin-left: 8px;
|
||||
}
|
|
@ -1,5 +1,42 @@
|
|||
({
|
||||
myAction : function(component, event, helper) {
|
||||
|
||||
afterScriptsLoaded: function (component, event, helper) {
|
||||
console.log('afterScriptsLoaded called successfully');
|
||||
},
|
||||
|
||||
doInit: function (component, event, helper) {
|
||||
console.log('doInit called successfully');
|
||||
},
|
||||
|
||||
keyCheck: function (component, event, helper) {
|
||||
if (event.which == 13) {
|
||||
console.log('keyCheck detected enter')
|
||||
|
||||
var searchTerms = component.get("v.searchTerms");
|
||||
helper.search(searchTerms, function (results) {
|
||||
console.log('keyCheck enter returned from helper')
|
||||
component.set("v.results", results.data);
|
||||
});
|
||||
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
search: function (component, event, helper) {
|
||||
|
||||
console.log('search called successfully');
|
||||
|
||||
var searchTerms = component.get("v.searchTerms");
|
||||
helper.search(searchTerms, function (results) {
|
||||
console.log('search returned from helper')
|
||||
component.set("v.results", results.data);
|
||||
});
|
||||
|
||||
},
|
||||
|
||||
gifSelected: function (component) {
|
||||
var property = component.get("v.property");
|
||||
|
||||
console.log('gifSelected called successfully');
|
||||
}
|
||||
|
||||
})
|
|
@ -1,5 +1,20 @@
|
|||
({
|
||||
helperMethod : function() {
|
||||
search: function (searchTerms, data) {
|
||||
|
||||
}
|
||||
})
|
||||
console.log('search called successfully');
|
||||
console.log(searchTerms);
|
||||
|
||||
var apiKey = _GIPHY.getApiKey();
|
||||
console.log(apiKey);
|
||||
|
||||
$.getJSON("https://api.giphy.com/v1/gifs/search?api_key=" + apiKey + "&q=" + searchTerms + "&limit=8&offset=0&rating=G&lang=en", function (results) {
|
||||
|
||||
console.log('called api');
|
||||
console.log(results);
|
||||
console.log(results.data.length);
|
||||
|
||||
data(results);
|
||||
|
||||
});
|
||||
}
|
||||
})
|
|
@ -2,15 +2,7 @@
|
|||
<FlexiPage xmlns="http://soap.sforce.com/2006/04/metadata">
|
||||
<flexiPageRegions>
|
||||
<componentInstances>
|
||||
<componentInstanceProperties>
|
||||
<name>decorate</name>
|
||||
<value>true</value>
|
||||
</componentInstanceProperties>
|
||||
<componentInstanceProperties>
|
||||
<name>richTextValue</name>
|
||||
<value>Please work</value>
|
||||
</componentInstanceProperties>
|
||||
<componentName>flexipage:richText</componentName>
|
||||
<componentName>SearchGIPHY</componentName>
|
||||
</componentInstances>
|
||||
<name>main</name>
|
||||
<type>Region</type>
|
||||
|
|
|
@ -1,8 +1,8 @@
|
|||
window._GIPHY = (function() {
|
||||
var apiKey = "YOURGIPHYAPIKEY";
|
||||
var apiKey = "YOUR_GIPHY_API_KEY";
|
||||
|
||||
return { //public API
|
||||
getValue: function() {
|
||||
getApiKey: function() {
|
||||
return apiKey;
|
||||
}
|
||||
};
|
||||
|
|
Различия файлов скрыты, потому что одна или несколько строк слишком длинны
|
@ -0,0 +1,5 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<StaticResource xmlns="http://soap.sforce.com/2006/04/metadata">
|
||||
<cacheControl>Private</cacheControl>
|
||||
<contentType>text/javascript</contentType>
|
||||
</StaticResource>
|
|
@ -1,12 +1,12 @@
|
|||
{
|
||||
"packageDirectories": [
|
||||
{
|
||||
"path": "force-app",
|
||||
"default": true,
|
||||
"id": "",
|
||||
"versionNumber": "1.0.0.NEXT",
|
||||
"versionName": ""
|
||||
}
|
||||
"packageDirectories": [
|
||||
{
|
||||
"path": "force-app",
|
||||
"default": true,
|
||||
"id": "YOUR_PACKAGE_ID",
|
||||
"versionNumber": "1.0.0.NEXT",
|
||||
"versionName": "Spring ‘18"
|
||||
}
|
||||
],
|
||||
"namespace": "",
|
||||
"sfdcLoginUrl": "https://login.salesforce.com",
|
||||
|
|
Загрузка…
Ссылка в новой задаче