Merge branch 'tensorflow' into patch-2
This commit is contained in:
commit
12965457c8
|
|
@ -221,6 +221,7 @@ $(document).ready(function () {
|
|||
miniCartKey: 0,
|
||||
quickView: false,
|
||||
productDetails: [],
|
||||
showPageLoader: false,
|
||||
}
|
||||
},
|
||||
|
||||
|
|
@ -331,6 +332,14 @@ $(document).ready(function () {
|
|||
})
|
||||
});
|
||||
},
|
||||
|
||||
showLoader: function () {
|
||||
this.showPageLoader = true;
|
||||
},
|
||||
|
||||
hideLoader: function () {
|
||||
this.showPageLoader = false;
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
|
|
|
|||
17
packages/Webkul/Velocity/src/Resources/assets/sass/components/app.scss
vendored
Normal file → Executable file
17
packages/Webkul/Velocity/src/Resources/assets/sass/components/app.scss
vendored
Normal file → Executable file
|
|
@ -2445,3 +2445,20 @@
|
|||
display: inline-block;
|
||||
}
|
||||
}
|
||||
|
||||
.image-search-container {
|
||||
top: 9px;
|
||||
right: 45px;
|
||||
z-index: 10;
|
||||
cursor: pointer;
|
||||
position: absolute;
|
||||
background: #fff;
|
||||
height: 24px !important;
|
||||
}
|
||||
|
||||
.camera-icon {
|
||||
width: 24px;
|
||||
display: inline-block;
|
||||
background-size: cover;
|
||||
background-image: url(/vendor/webkul/ui/assets/images/Camera.svg);
|
||||
}
|
||||
|
|
|
|||
97
packages/Webkul/Velocity/src/Resources/views/shop/UI/particals.blade.php
Normal file → Executable file
97
packages/Webkul/Velocity/src/Resources/views/shop/UI/particals.blade.php
Normal file → Executable file
|
|
@ -103,8 +103,10 @@
|
|||
name="term"
|
||||
type="search"
|
||||
class="form-control"
|
||||
:value="searchedQuery.term ? searchedQuery.term.split('+').join(' ') : ''"
|
||||
placeholder="{{ __('velocity::app.header.search-text') }}" />
|
||||
placeholder="{{ __('velocity::app.header.search-text') }}"
|
||||
:value="searchedQuery.term ? searchedQuery.term.split('+').join(' ') : ''" />
|
||||
|
||||
<image-search-component></image-search-component>
|
||||
|
||||
<button class="btn" type="submit" id="header-search-icon">
|
||||
<i class="fs16 fw6 rango-search"></i>
|
||||
|
|
@ -154,6 +156,9 @@
|
|||
</div>
|
||||
</script>
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/@tensorflow-models/mobilenet"></script>
|
||||
|
||||
<script type="text/x-template" id="sidebar-categories-template">
|
||||
<div class="wrapper" v-if="rootCategories">
|
||||
Hello World
|
||||
|
|
@ -164,6 +169,26 @@
|
|||
</div>
|
||||
</script>
|
||||
|
||||
<script type="text/x-template" id="image-search-component-template">
|
||||
<div class="d-inline-block">
|
||||
<label class="image-search-container" for="image-search-container">
|
||||
<i class="icon camera-icon"></i>
|
||||
|
||||
<input
|
||||
type="file"
|
||||
class="d-none"
|
||||
ref="image_search_input"
|
||||
id="image-search-container"
|
||||
v-on:change="uploadImage()" />
|
||||
|
||||
<img
|
||||
class="d-none"
|
||||
id="uploaded-image-url"
|
||||
:src="uploadedImageUrl" />
|
||||
</label>
|
||||
</div>
|
||||
</script>
|
||||
|
||||
<script type="text/javascript">
|
||||
(() => {
|
||||
Vue.component('cart-btn', {
|
||||
|
|
@ -319,5 +344,73 @@
|
|||
}
|
||||
}
|
||||
});
|
||||
|
||||
Vue.component('image-search-component', {
|
||||
template: '#image-search-component-template',
|
||||
data: function() {
|
||||
return {
|
||||
uploadedImageUrl: ''
|
||||
}
|
||||
},
|
||||
|
||||
methods: {
|
||||
uploadImage: function() {
|
||||
debugger
|
||||
this.$root.showLoader();
|
||||
var formData = new FormData();
|
||||
|
||||
formData.append('image', this.$refs.image_search_input.files[0]);
|
||||
|
||||
axios.post(
|
||||
"{{ route('shop.image.search.upload') }}",
|
||||
formData,
|
||||
{
|
||||
headers: {
|
||||
'Content-Type': 'multipart/form-data'
|
||||
}
|
||||
}
|
||||
).then(response => {
|
||||
var net;
|
||||
this.uploadedImageUrl = response.data;
|
||||
|
||||
(async () => {
|
||||
try {
|
||||
var queryString = '';
|
||||
var analysedResult = [];
|
||||
debugger
|
||||
net = await mobilenet.load();
|
||||
|
||||
const imgElement = document.getElementById('uploaded-image-url');
|
||||
|
||||
const result = await net.classify(imgElement);
|
||||
|
||||
result.forEach(value => {
|
||||
queryString = value.className.split(',');
|
||||
|
||||
if (queryString.length > 1) {
|
||||
analysedResult = analysedResult.concat(queryString)
|
||||
} else {
|
||||
analysedResult.push(queryString[0])
|
||||
}
|
||||
})
|
||||
|
||||
localStorage.searchedImageUrl = this.uploadedImageUrl;
|
||||
|
||||
queryString = localStorage.searched_terms = analysedResult.join('_');
|
||||
|
||||
this.$root.hideLoader();
|
||||
|
||||
window.location.href = "{{ route('shop.search.index') }}" + '?term=' + queryString + '&image-search=1';
|
||||
} catch (error) {
|
||||
this.$root.hideLoader();
|
||||
};
|
||||
})();
|
||||
}).catch(() => {
|
||||
debugger
|
||||
this.$root.hideLoader();
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
})()
|
||||
</script>
|
||||
4
packages/Webkul/Velocity/src/Resources/views/shop/layouts/master.blade.php
Normal file → Executable file
4
packages/Webkul/Velocity/src/Resources/views/shop/layouts/master.blade.php
Normal file → Executable file
|
|
@ -130,6 +130,10 @@
|
|||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="modal-parent" style="top: 0" v-if="showPageLoader">
|
||||
<overlay-loader :is-open="showPageLoader"></overlay-loader>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- below footer -->
|
||||
|
|
|
|||
Loading…
Reference in New Issue