How to display articles' image in Joomla search results - image

Is there a way to modify the code of the Joomla's search component so it can display even the article's image?
I have made a simple code that can search the image or youtube video in the article's text and return the media including the required tags as a string, but where do I put it?
// SEARCH IMAGE OR VIDEO
$hasImage = 0;
$hasVideo = 0;
$articleMedia = '';
$articleText = $text;
// has image?
preg_match_all('/<\s?img[^>]+\>/i', $articleText, $matches);
if(isset($matches['0']['0']))
{
$articleMedia = $matches['0']['0'] ;
$hasImage = 1;
}
// no image? maybe video
if ($hasImage == 0) {
preg_match_all('/(http:\/\/www\.youtube\.com\/watch\?v=([a-zA-Z0-9_-]+))/i', $articleText, $matches);
if(isset($matches['0']['0']))
{
$articleMediaID = $matches['2']['0'] ;
$articleMedia = "//www.youtube.com/embed/" . $articleMediaID;
$hasVideo = 1;
} else {
preg_match_all('/(http:\/\/youtu.be\/([a-zA-Z0-9_-]+))/i', $articleText, $matches1);
if( isset($matches1['0']['0']) ){
$articleMediaID = $matches1['2']['0'] ;
$articleMedia = "//www.youtube.com/embed/" . $articleMediaID;
$hasVideo = 1;
}
}
if ( $hasVideo == 1){
$articleMedia = '<iframe class="youtube" width="100%" src="' . $articleMedia . '" frameborder="0" allowfullscreen></iframe>';
}
}
// END SEARCH IMAGE OR VIDEO

You can create a search plugin, it's very simple to to create one, especially as you've worked out your core code already.
Depending on the type of Joomla search you're using you should read either:
Creating a Search Plugin
Creating a Smart Search Plugin

Related

TYPO3 10.4 / FLUIDTEMPLATE / renderObj / image

I've got a simple template which displays the full content from "content_icon" for a "page" - so far everything fine.
Now I want to add only the image(s) from the "content_icon" - no way.
This ist the (ext+)template:
<f:section name="main">
<f:format.htmlentitiesDecode>{content_icon}</f:format.htmlentitiesDecode>
<p>-----------------------------</p>
<p>
<f:cObject typoscriptObjectPath="SliderElement.10.variables.icon"/>
</p>
<p>{icon}</p>
</f:section>
I've tried this (and many more)
https://docs.typo3.org/m/typo3/reference-typoscript/master/en-us/ContentObjects/Files/Index.html#usage-with-references but -> no output at all.
I figured out, that if I add the following assignment anything seems to be read .... I get an output - but without images ....
page_id < styles.content.get
Struggeling now for 3 days with TYPO3 10.4 extension (template).
Didn't see any light.
SliderElement = PAGE
SliderElement.10 = FLUIDTEMPLATE
SliderElement.10 {
format = html
file = fileadmin/site_elements/Templates/SliderElement.html
partialRootPath = fileadmin/site_elements/Partials/
layoutRootPath = fileadmin/site_elements/Layouts/
variables {
page_id = FILE
page_id < styles.content.get
page_id.select.where = "tt_content"."colPos" = 20
page_id {
stdWrap.wrap = <div class="pic">|</div>
references {
uid.data = uid
#fieldName = image // try
#fieldName = media // try
fieldName = assets
}
renderObj = IMAGE
renderObj {
file {
import.data = file:current:uid
treatIdAsReference = 1
}
altText.data = file:current:alternative
stdWrap.typolink.parameter.data = file:current:link
}
}
content_icon < styles.content.get
content_icon.select.where = "tt_content"."colPos" = 20
}
}
Any help or idea would be nice...

Get variable from web page with javascript in C++ Builder

I have a MiFi modem (Huawei e5776) which comes with its own web page that displays total traffic per month. I want to extract this value and display a meter in the icon tray. I'm sure this is possible in C++ Builder (or Delphi) but even though I'm pretty experienced in using C++ Builder, I am not in anything web related. Can someone give me some pointers how to do this? I assume I need to run the script and then extract the variable somewhere, how do I do this?
Thanks.
PS: I'd add the contents of the page but can't see a way to attach a document. Here's the first few lines..
// JavaScript Document
var g_monitoring_traffic_statistics = null;
var g_wlan_security_settings = null;
var g_wlan_basic_settings = null;
var g_connection_trafficresponse = null;
//Prefix string of ssid2 of Multi-SSID
var g_prefixWifiSsid = "ssid2_";
function getTrafficInfo(bit) {
var final_number = 0;
var final_str = "";
if(g_monitoring_dumeter_kb > bit) {
final_number = formatFloat(parseFloat(bit), 2);
final_str = final_number + " B";
}
else if(g_monitoring_dumeter_kb <= bit && g_monitoring_dumeter_mb > bit) {
final_number = formatFloat(parseFloat(bit) / g_monitoring_dumeter_kb, 2);
final_str = final_number + " KB";
}
else if(g_monitoring_dumeter_mb <= bit && g_monitoring_dumeter_gb > bit) {
final_number = formatFloat((parseFloat(bit) / g_monitoring_dumeter_mb), 2);
final_str = final_number + " MB";
}
else if(g_monitoring_dumeter_gb <= bit && g_monitoring_dumeter_tb > bit) {
final_number = formatFloat((parseFloat(bit) / g_monitoring_dumeter_gb), 2);
final_str = final_number + " GB";
}
else {
final_number = formatFloat((parseFloat(bit) / g_monitoring_dumeter_tb), 2);
final_str = final_number + " TB";
}
return final_str;
}
I suggest you to use a great html wrapper (named BCB HTML) for mshtml writed specially for C++Builder; With this wrapper you can execute java script inside C++ Builder cpp codes:
THTMLDocument document;
document.create();
document.write(
"<html><body><script>"
"function myFunc(n)"
"{"
"return n * n;"
"}"
"</script></body></html>");
document.parentWindow.execScript("alert(myFunc(3))", "javascript");
For your jscript:
String value = document.parentWindow.execScript("getTrafficInfo(1024)", "javascript");
Also it is possible to handle html events inside BCB, access html objects , ...
you can download it from here.
To use this source add html.cpp to your project.
If you use TWebBrowser to load a html page, you need just define document in global scope and write below code to connect/attach document variable to WebBrowser1->Document:
void __fastcall TForm1::WebBrowser1DocumentComplete(TObject *ASender,
const IDispatch *pDisp, const OleVariant &URL)
{
document.documentFromVariant(WebBrowser1->Document);
String value = document.parentWindow.execScript("getTrafficInfo(1024)", "javascript");
}

NicEdit link creation doesn't work in IE 8 and FireFox if text wasn't selected

I have a problem with nicEdit link creation tool in IE and Firefox.
In general, I think the problem is related to the execCommand in IE and FireFox. It seems document doesn't get updated after execCommand executes.
This is an example of my problem with nicEdit create link command.
if(!this.ln) {
var tmp = 'javascript:nicTemp();';
this.ne.nicCommand("createlink",tmp);
this.ln = this.findElm('A','href',tmp);
// set the link text to the title or the url if there is no text selected
alert(this.ln);
if (this.ln.innerHTML == tmp) {
this.ln.innerHTML = this.inputs['title'].value || url;
};
}
The code above is called when no text is selected, Chrome returns 'javascript:nicTemp()' for the alert(this.ln), while IE 8 and Firefox return 'undefined', so the next line after the alert encounters an error in IE and Firefox.
it seems findElem can't find the newly created link by nicCommand which in turn calls execCommand
I had similar problems when I try to find and modify tags created with execCommand, it seems the dom isn't updated to include them.
Am I right? How can I solve this problem? how can I force the document to be updated ....
please help
my trick for nicEdit, in the situation when no text is selected, is to paste the title given via the Add Link form into the document and select it, then the rest code works as it works when a text is selected.
I used the function pasteHtmlAtCaret described in the following link to paste the title
Insert html at caret in a contenteditable div
this.removePane();
var url = this.inputs.href.value;
var selected = getSelected();
var B= 'javascript:nicTemp()';
if (selected == '')
{
var B = url;
pasteHtmlAtCaret(this.inputs['title'].value || url,true);
}
if(!this.ln){
this.inputs.title.value;this.ne.nicCommand("createlink",B);
this.ln=this.findElm("A","href",B)
}
the getSelected is also a simple function as below
function getSelected()
{
if (document.selection)
return document.selection.createRange().text;
else
return window.getSelection();
}
Ahmad, just use this variation of the "submit" function to avoid the "insert/edit" problem with the link, it worked for me:
submit : function(e) {
var url = this.inputs['href'].value;
if(url == "http://" || url == "") {
alert("Introduce una URL valida para crear el Link.");
return false;
}
this.removePane();
if(!this.ln) {
//**************** YOUR CHANGE WITH A BIT OF VARIATION **************
var selected = this.getSelected();
var tmp = 'javascript:void(0)';
if (selected == '') {
tmp = url;
this.pasteHtmlAtCaret(this.inputs['title'].value || tmp, true);
}
//**************** END OF YOUR CHANGE WITH A BIT OF VARIATION **************
this.ne.nicCommand("createlink",tmp);
this.ln = this.findElm('A','href',tmp);
// set the link text to the title or the url if there is no text selected
if (this.ln.innerHTML == tmp) {
this.ln.innerHTML = this.inputs['title'].value || url;
};
}
if(this.ln) {
var oldTitle = this.ln.title;
this.ln.setAttributes({
href: this.inputs['href'].value,
title: this.inputs['title'].value,
target: '_blank'
});
// set the link text to the title or the url if the old text was the old title
if (this.ln.innerHTML == oldTitle) {
this.ln.innerHTML = this.inputs['title'].value || this.inputs['href'].value;
};
}
}
this.removePane();
var url = this.inputs['href'].value;
var selected = getSelected();
var isChrome = /Chrome/.test(navigator.userAgent) && /Google Inc/.test(navigator.vendor);
var tmp = "";
if(isChrome == true){
tmp=url;
}
else{tmp='javascript:nicTemp()'}
if (selected == '' && isChrome == false)
{
pasteHtmlAtCaret(this.inputs['title'].value || url,true);
}
if (!this.ln) {
//var tmp = this.inputs['title'].value == "" ? this.inputs['href'].value : this.inputs['title'].value;
this.ne.nicCommand("createlink", tmp);
this.ln = this.findElm('A', 'href', tmp);
}
function getSelected()
{
if (document.selection)
return document.selection.createRange().text;
else
return window.getSelection();
}
function pasteHtmlAtCaret(html) {
var sel, range;
if (window.getSelection) {
// IE9 and non-IE
sel = window.getSelection();
if (sel.getRangeAt && sel.rangeCount) {
range = sel.getRangeAt(0);
range.deleteContents();
// Range.createContextualFragment() would be useful here but is
// non-standard and not supported in all browsers (IE9, for one)
var el = document.createElement("div");
//create a link format
el.innerHTML = ''+ html +'';
var frag = document.createDocumentFragment(), node, lastNode;
while ( (node = el.firstChild) ) {
lastNode = frag.appendChild(node);
}
range.insertNode(frag);
// Preserve the selection
if (lastNode) {
range = range.cloneRange();
range.setStartAfter(lastNode);
range.collapse(true);
sel.removeAllRanges();
sel.addRange(range);
}
}
} else if (document.selection && document.selection.type != "Control") {
// IE < 9
document.selection.createRange().pasteHTML(html);
}
}

Magento jQuery Ajax search issue

I am trying to implement a customize Magento Advanced Search, using jQuery and Ajax.
The search works something like this:
1) There are 2/3 options to select size
2) 6 options to narrow down search result
3) A text box to enter keywords etc
There is no submit button, that means, search starts when user clicks on any size and/or Options or enter more than 3 char in search text box, search starts, an ajax request is sent to server.
If user clicks on another option or say type in another character, I use to abort previous search using search_request.abort() and set previous search to null.
When you search for first couple of times, it works fine, search returns result and if no result is found, proper message is displayed.But, after after couple of requests, it starts failing. Like if I click on options in short interval (I mean, search is fired frequently)). Some times, it fails without any reason and sometimes it fails, and when I click on the same option a couple of seconds later, it display the results.
Sometimes, when the search fails or there is no result.
It displays the incomplete message in result area like:
Where as it should look like :
Search when it returns result:
Search when it fails
My question is:
1) do you think it might be failing because too many requests are submitted too frequently? I mean is there something related to Magento settings?
2) What can I do to correct this?
Here is the jQuery code:
<script type="text/javascript">
function search(textfield)
{
j('#slides').html("<img src='<?php echo Mage::getBaseUrl(Mage_Core_Model_Store::URL_TYPE_WEB); ?>skin/frontend/luckybloke/luckybloke/images/ajax-loader.gif' class='no-results-found' style='width:100px !important; padding-top:10px !important;text-align:center;margin-left: 43%;' />");
var form = j("#form-validate");
var action = form.attr("action");
var fieldAdded = Array();
var searchData = '';
var searchVal = '';
var sizeSelected = '';
var searchArray = new Array();
var searchCtr = 0;
var tmp = new Array();
if(typeof search_request =='object' && search_request!=null){
search_request.abort();
search_request = null;
j('#slides').html("<img src='<?php echo Mage::getBaseUrl(Mage_Core_Model_Store::URL_TYPE_WEB); ?>skin/frontend/luckybloke/luckybloke/images/ajax-loader.gif' class='no-results-found' style='width:100px !important; padding-top:10px !important;text-align:center;margin-left: 43%;' />");
}
j('.input-search').each(function(index,domEle){
var eleID = "#"+j(domEle).attr("id");
var curEle= j(domEle).attr("name");
fieldAdded.push(curEle.replace('[]',''));
////consloe.log(eleID);
if((j(eleID).val()!='' || !jQuery.inArray(curEle,fieldAdded))&& eleID!='#name'){
if(searchVal==''){
searchVal=searchVal+j(eleID).val();
}
if(searchData==''){
searchData = searchData+""+curEle+"="+j(eleID).val();
}else{
searchData = searchData+"&"+curEle+"="+j(eleID).val();
}
searchArray[searchCtr] = j(eleID).val();
searchCtr++;
}
//add description field to search query
tmp[curEle] = j(eleID).val();
}
});
if(searchVal==''){
}
if(j("#name").val()=='brand, style, keyword'){
var val = '';
}else{
val = j("#name").val();
}
searchData = searchData+"&search_keywords="+val;
//toggleFields(sizeSelected, searchArray);
search_request = j.ajax({
type:'get',
url:action,
data:searchData,
cache: false,
dataType:'html',
success:searchComplete
});
return;
}
function searchComplete(responseText, statusText, xhr, $form)
{
var no_item_msg = 'No product found matching your search criteria.';
if(statusText=='success'){
var isFound = responseText.toString().search(new RegExp(/no items found/i));
//alert(isFound+''+responseText.toString());
if((isFound>0 || responseText.length == 0) && search_request ){
j("div#slides").html("<span class='no-results-found'>"+no_item_msg+"</span>");
// j("div#slides").html("<span class='no-results-found'>"+no_item_msg+"</span>");
/*j("div#lb-product-list").block({message:no_item_msg});
setTimeout('j("div#lb-product-list").unblock()', 2000);*/
}else{
var dataToFill = j("div#lb-product-list");
var isFound = responseText.toString().search(new RegExp(/JUST_ONE/i));
if(isFound>=0){
responseText = responseText.replace(/just_one/i,'');
}else{
j.getScript("<?php echo Mage::getBaseUrl(Mage_Core_Model_Store::URL_TYPE_WEB); ?>js/carousol.js", function() {});
}
dataToFill.html(j(responseText).children());
search_request = null;
}
//reset the css attribute's position value, as ui blocking seems to be affecting positioning of elements are unblocking
j("div#lb-product-list").css("position",'');
return true;
}
}
</script>

Save current Google Map view as an image

I have a database with some addresses. For each address the view of the map will be different.
Is there a way, for each address, to save the map view as an image?
<img src='http://maps.googleapis.com/maps/api/staticmap?center=<?php echo
$MyAddress?>CA&zoom=14&size=500x500&markers=<?php echo $myAddress?>&sensor=false' alt=''/>
The center is where the map will be centered.
The markers is the address you want so i put center=markers.
Zoom is how close you want to zoom in the map
Size the size you want of the picture.
Take a look here
http://code.google.com/intl/el-GR/apis/maps/documentation/staticmaps/
In this case you can use the Google Static Maps API, from here.
For storage and bandwidth purposes you can only storage the GeoPoint of the location and only render the image when the user requests it.
public static function getGoogleMapImage($params = array(), $saveTo = null, $https = true){
//set default parameters
if(!isset($params['markers'])){
$params['center'] = isset($params['center']) ? $params['center'] : 0;
$params['zoom'] = isset($params['zoom']) ? $params['zoom'] : 0;
}
$params['size'] = isset($params['size']) ? $params['size'] : '200x200';
$params['sensor'] = isset($params['sensor']) ? $params['sensor'] : 'false';
foreach($params as $name => $value){
$paramString.=$name . '=' . urlencode($value) . '&';
}
$paramString = trim($paramString, '&');
$httpPrefix = $https ? 'https://' : 'http://';
$imageUrl = $httpPrefix . 'maps.googleapis.com/maps/api/staticmap?' . $paramString;
if(!$saveTo){ //if you don't want to save image, just to display it
return $imageUrl;
}
if(isset($params['format'])){
switch($params['format']){
case 'png8': $imgExt = '.png'; break;
case 'gif': $imgExt = '.gif'; break;
case 'jpg': $imgExt = '.jpg'; break;
case 'jpg-baseline': $imgExt = '.jpg'; break;
default: $imgExt = '.png';
}
}else{
$imgExt = '.png';
}
$saveTo = preg_replace("/\\.[^.\\s]{3,4}$/", "", $saveTo) . $imgExt; //in case requested file extension and provided in $saveTo don't match
if(self::getImage($imageUrl, $saveTo)){
return realpath($saveTo);
}
return false;
}
I used curl call for getting images from created $imageUrl

Resources