I'm displaying an image like that:
<img :src="imageUrlAlt(this.form.logo_image)">
I tried many ways to display image, and only require() works with data bind.
My script:
data: () => ({
form: {
logo_image: null // data will be mounted when load page
}
}),
methods: {
imageUrlAlt(type) {
try {
return require('../../../../../storage/app/public/'+ type)
} catch (e) {
return require('../../../../../storage/app/public/images/organization/alt-image.png')
}
}
}
When I'm load the view and inspect, the image source is something like "/images/logo.jpeg?b0c864c0f180003c61d83266b55df0c6", and an image look exactly the same with my image will be created in public/images, so I understanding that this one has been displayed instead of the original.
However, when I'm create a function to upload image, after refresh page, the image displayed still the old, because image in public/images still not updated or delete. How to fix that? Thanks a lot. And sorry if my english is bad.
if anybody konws this,please help me.how to give name to pdf.
i generated pdf using mpdf codeigniter. on click of a button the pdf wil be viewed. but how can give name for that pdf? it shows 1 on the top of the pdf.how can i give name to that pdf?
My controller
public function viewpdf($key,$option) {
if($option=='1')
{
$searchdata['fetchproduct']=$this->b2bproduct_model->fetch_productdata1($key);
}
if($option=='2')
{
$searchdata['fetchproduct']=$this->b2bproduct_model->fetch_productdata2($key);
}
if($option=='3')
{
$searchdata['fetchproduct']=$this->b2bproduct_model->fetch_productdata3($key);
}
$html=$this->load->view('moderator/pdf_data', $searchdata,true);
//this the the PDF filename that user will get to download
$pdfFilePath = "shany.pdf";
//load mPDF library
$this->load->library('m_pdf');
//generate the PDF from the given html
$this->m_pdf->pdf->WriteHTML($html);
//download it.
$this->m_pdf->pdf->Output($pdfFilePath, "I");
}
Use this code.
$mpdf=new mPDF();
$mpdf->SetTitle('My Title');
$mpdf->WriteHTML('<p>Hallo World</p>');
$mpdf->Output('filename.pdf');
Set the title for the document. The title is displayed at the top of the Adobe Reader screen when viewing the PDF file
Use code as bellow
public function mypdf() {
$this->load->library('pdf');
$pdf = $this->pdf->load();
$html=$this->load->view('welcome_message',null,true);
$pdf->WriteHTML($html);
// write the HTML into the PDF
$output = 'your_given_name.pdf'; //You can give a name of your generated pdf file or you can create it auto on timestamp by using $output = time().'.pdf'.
$pdf->Output("$output", 'I');
}
If you send data to view page then replace the variable with null in line 4.
For more details please see the tutorial from here.
If you are interested on DOMPDF please see from here.
Just a doubt about camera pictures (iOS/android/windows)
//take a picture
Ti.Media.showCamera({
saveToPhotoGallery:false,
success:function(event) {
if(event.mediaType == Ti.Media.MEDIA_TYPE_PHOTO) {
$.preview.image = event.media;
//insert on attachments table
database.insert('attachments',{
name:'test',
extension:'',
file:Ti.Utils.base64encode(event.media).toString()
});
}
}
});
When I send the picture to my backoffice, I need to send also the file extension, but there is no file, only the string of the encoded picture that I saved in a local SQLite table.
How do I get this extension, or it's required to save the image on the app directory?
You can set any image extension you want ! (PNG, jPEG ,..) , as you see data returned from camera is Blob ! , you don`t have to save the image local first just upload it to your server !
I'm trying to change the default behavior of Drupal when adding an image through image field on a content type.
When you choose an image to assign to a node, it's not directly uploaded. You also need to click "upload" to display the preview of your image, and this is not really user friendly.
How can I change this (programmatically) to make Drupal start uploading directly the image after choosing the file.
Thank you for help
You can do it this way:
(function ($) {
Drupal.behaviors.autoUpload = {
attach: function(context, settings) {
$('.form-item input.form-submit[value=Upload]', context).hide();
$('.form-item input.form-file', context).change(function() {
$parent = $(this).closest('.form-item');
setTimeout(function() {
if(!$('.error', $parent).length) {
$('input.form-submit[value=Upload]', $parent).mousedown();
}
}, 100);
});
$('.form-item input.form-submit[value=Transférer]', context).hide();
$('.form-item input.form-file', context).change(function() {
$parent = $(this).closest('.form-item');
setTimeout(function() {
if(!$('.error', $parent).length) {
$('input.form-submit[value=Transférer]', $parent).mousedown();
}
}, 100);
});
}
};
})(jQuery);
This solution works with either english and french browsers. Unlike AutoUpload module, which only works on browsers configured in english. Note the [value=Upload] / [value=Upload] attribute
I found a similar post:
https://drupal.stackexchange.com/questions/31121/how-can-i-automatically-upload-images-on-file-selection-rather-than-pressing-the
It's exactly what I need..
You should be able to use http://drupal.org/project/imce for your needs.
I am not sure about the Image field but when I encountered this issue I decided letting users add images in body since it is a much easier option for durpal - When inserting images in text They will show immediately .
IMCE + filefield seems like a viable option for your direct needs,They do mention AJAX support.
I have been trying to put an image with a hyperlink on it into a google apps script ui. I first thought of using createAnchor(), but that only allows text. Then I thought of using a button, but as far as I know you cannot open a new tab/window and redirect in a callback function.
I also tried createHTML(), but the element is not handled by it as yet.
I have seen people overlay transparent buttons over images, but still have same issue in callback.
My research has not found an answer to this. Does anyone have any solutions/examples?
Thanks
This worked for me on Chrome20 and IE9
// Container for box and results
var imageContainer = app.createFlexTable();
// Setup the button
var button = app.createButton("ImageButton");
button.setStyleAttribute("background", "url(dontshowimagehere.JPG) no-repeat");
button.setStyleAttribute("position", "absolute");
button.setStyleAttribute("color", "transparent");
button.setStyleAttribute('zIndex','1');
button.setStyleAttribute("border", "0px solid black");
imageContainer.setWidget(0, 0, button);
// image to click
var image = app.createImage("image.jpg").setId(imageId);
imageContainer.setWidget(1,0, image);
The image has a slight (3px) offset. If important, this looks to fix it http://www.w3schools.com/css/css_positioning.asp (use relative for the flex table and top etc for the image and button)
Did you try a transparent Anchor overlaying the image?
function doGet() {
var app = UiApp.createApplication().setTitle("Image Anchor");
var panel = app.createAbsolutePanel().setWidth('50%').setHeight('50%');
var image = app.createImage().setUrl("https://lh6.googleusercontent.com/-v0Q3gPQz03Q/T_y5gcVw7LI/AAAAAAAAAF8/ol9uup7Xm2g/s512/GooglePlus-512-Red.png").setStyleAttribute("width", "28px").setStyleAttribute("height", "28px");
var anchor = app.createAnchor("?", "https://plus.google.com/u/1/116085534841818923812/posts").setHeight("28px").setWidth("28px").setStyleAttribute("opacity", "0.1").setTarget("blank");
panel.add(image,100,50);
panel.add(anchor,100,50);
app.add(panel);
return app.close();
}
app.createAbsolutePanel()
.add(app.createImage('https://www.google.com/images/logos/google_logo_41.png'))
.add(app.createAnchor('','https://www.google.co.uk/intl/en/about/')
.setStyleAttributes({position:'absolute',top:'0px',left:'0px',width:'201px',height:'47px',opacity:'0'}))
This is a tested one. It works fine.
It doesn't work with positioning the image (as 'absolute').
It doesn't work with .setHorizontalAlignment(UiApp.HorizontalAlignment.CENTER)
I don't believe this is possible with the widgets available. I would suggest altering your UI's design to utilize an Anchor widget instead.
Use HTML Box if you are coding directly on your page. Click "Edit" to edit your page and go to "Insert>HTML Box" in your menu. It will accept javascript too! There are a few caveats - when using javascript, HTML Box will not accept links...too bad, but too many exploits there.
If you are coding in apps script, you could try to place the image on a panel and use absolute panel and position your link over your image. Another method could be to use the .setStyleAttribute for CSS styling and utilize the zIndex parameter to place a panel over top of your image....like so:
var panel = app.createSimplePanel();
// add your image to the simple panel or whatever panel you wish to choose in your GUI
var popPanel = app.createSimplePanel()
.setStyleAttribute('top','Y')
.setStyleAttribute('left','X')
.setStyleAttribute('zIndex','1')
.setStyleAttribute('position','fixed');
// add your anchor to the popPanel
app.add(panel).add(popPanel);
Not 100% sure if you can make this panel transparent, but you could try something like:
.setStyleAttribute('background',transparent')
or change the opacity via:
.setStyleAttribute('opacity','.5')
Hopes this gives you a few ideas!
I managed to do it with a single Anchor object and using CSS3.
It works on Chrome, I did not test it in other Browsers.
gui.createAnchor("", false, "$DESTINATION_URL$")
.setStyleAttributes({ "display":"block",
"width":"$IMAGE_WIDTH_IN_PIXEL$",
"height":"$IMAGE_HEIGHT_IN_PIXEL$",
"background":"url($URL_OF_THE_IMAGE$)",
"background-size":"100% 100%",
"background-repeat":"no-repeat" })
Of course you have to replace the $......$ with your data.
Thierry
If you first create all your HTML in a string, you can then replace the content of a page with the HTML you want like this:
var myString = 'the html you want to add, for example you image link and button';
var page = SitesApp.getSite('example.com', 'mysite').getChildByName('targetpage');
var upage = page.setHtmlContent('<div>' + myString + '</div>');