editor view's web view doesn't retrieve image file from Documents folder

[DominikButz]

editor view's web view doesn't retrieve image file from Documents folder

[cjwirth]

Hey!

Sorry for taking so long to respond to this. I went and tried it out using this code:

let image = RichEditorOptionItem(image: nil, title: "Add Image") { toolbar in
    let manager = NSFileManager.defaultManager()
    let documents = manager.URLsForDirectory(.DocumentDirectory, inDomains: .UserDomainMask).last!
    let filepath = documents.URLByAppendingPathComponent("pasta.jpg", isDirectory: false)

    if !manager.fileExistsAtPath(filepath.path!) {
        let url = NSURL(string: "http://www.crissa.ca/images/Pasta-Dish.jpg")!
        let data = NSData(contentsOfURL: url)!
        _ = try! manager.createDirectoryAtURL(documents, withIntermediateDirectories: true, attributes: nil)
        data.writeToURL(filepath, atomically: true)
    }

    toolbar?.editor!.insertImage(filepath.absoluteString, alt: "Our Special Image")
}

This way the first time I run it, it downloads the image, and after that first time, it just loads it straight from the local Documents directory.

This code is working fine for me, so I'm not really sure what your problem is. It looks like you're using one of the sample images from the Photo Library? I have no idea if there is a connection, but maybe you are having some permissions problem the 2nd time running, because you haven't opened the Photo Library assets, but are trying to use the URL directly? I'm not sure if it works like that though.

Do you have any sample code that reproduces this problem? I'd like to take a look and see what's going on.

[DominikButz]

Thanks for looking into this! The code that saves the image to the Documents folder of the app is very similar to yours (see below). I also tried using safari in the simulator to save some random image to the simulator camera roll rather than using one of the default images. The result is the same...
In the logic of this app however, the user cannot just insert an image by adding a web URL. It all works through the camera or the image library.

After dismissing the edit view and reopening the same item ( a note object in this case), the image appears as part of the Html. but I guess it is kept in cache so the simulator does not actually reload it from the documents folder...
When I stop the simulator and rebuild however, the web view in the editor apparently can't reload the image...

text information in the html-string can be retrieved without any problem though - it is just the image that is missing.

func imagePickerController(picker: UIImagePickerController, didFinishPickingMediaWithInfo info: [String : AnyObject]) {
    if let pickedImage = info[UIImagePickerControllerOriginalImage] as? UIImage {
        if let imageData = pickedImage.resizeImage(200.0 , maxWidth:300.0, compression:0.7) {
            let filename = NSUUID().UUIDString + ".jpg"
            let path = getDocumentsURL()
            let fileURL = path.URLByAppendingPathComponent(filename)
            print("file url: \(fileURL)")
            do {
                try imageData.writeToURL(fileURL, options: NSDataWritingOptions.DataWritingAtomic)
            }
            catch let error as NSError  {
                print(error)
            }
            self.keyboardToolbar.editor?.insertImage(fileURL.absoluteString, alt: "new image")
            dismissViewControllerAnimated(true, completion: {
                print("file url abs string \(fileURL.absoluteString)")
            })
        }
    } else {
        dismissViewControllerAnimated(true, completion: nil)
    }
}

func getDocumentsURL() -> NSURL {
    let documentsURL = NSFileManager.defaultManager().URLsForDirectory(.DocumentDirectory, inDomains: .UserDomainMask)[0]
    return documentsURL
}

[cjwirth]

Ah, I see. You're actually saving the local image URL in the HTML, and then displaying it again the next time with the same HTML.

I played around with it again today. It seems like the Documents directory URL is changing each time you launch the app. For example, for one run, I got

file:/// ... /Application/6D820E65-30F6-480A-90FE-C31B0CDB6F65/Documents/pasta.jpg

But then the next time I got

file:/// ... /Application/6399E27A-E729-46D6-A523-45FD2D65CFBA/Documents/pasta.jpg

So it worked for my sample code, because I am always generating the documents directory code before inserting it into the web view.

For you, it's a little bit more difficult. I might suggest, when you save the HTML, you take the documents directory, and change it to some token, like [DOCUMENTS_DIRECTORY]/pasta.jpg . Then, when you load the content the next time, you pre-process the HTML, changing [DOCUMENTS_DIRECTORY] with whatever the real new documents directory is.

How does that sound, does that fit your situation?

[cjwirth]

I think I'm going to close this issue, because I don't think it's really a problem with the editor itself. I don't think local URLs like that were supported in the first place (or else why would they change the directory? lol)

If you think differentl or something, feel free to reopen the issue 👍

[DominikButz]

Thank you for figuring this out! I have opened the sub folder in the core simulator path and indeed the folder name changes every time I do a new build.
This is actually an issue that only occurs in the simulator. I have just tested my app on a real device for the first time. When I add an image to a note, save it and then simply remove the app from memory and re-start it, the image is displayed as expected. Thanks anyway and yes, you can close they issue!

[NancyZY]

@DominikButz Can you get the resizeImage() method in there ? I try to pick image from Photo Library, and then set image to "toolbar.editor", there I found you have worded that . So I copied your code ,then showed error in resizeImage() method . Need your help, Thx

[cjwirth]

You won't be able to just copy/paste it, but I'm pretty sure he's using an extension on UIImage that has a resizeImage method that looks something like what is in the SO answer

[DominikButz]

yes, that is correct, I used an extension to UIImage. there are several ways of resizing images. you can find a lot of solutions on numerous sites.

here is the one I used:

public extension UIImage {

    public func resizeImage(maxHeight:CGFloat, maxWidth:CGFloat, compression:CGFloat)->NSData? {

        var actualHeight = self.size.height
        var actualWidth = self.size.width
        var imgRatio = actualWidth/actualHeight
        let maxRatio = maxWidth/maxHeight

        if actualHeight > maxHeight || actualWidth > maxWidth
        {
            if imgRatio < maxRatio
            {
                //adjust width according to maxHeight
                imgRatio = maxHeight / actualHeight
                actualWidth = imgRatio * actualWidth
                actualHeight = maxHeight
            }
            else if(imgRatio > maxRatio)
            {
                //adjust height according to maxWidth
                imgRatio = maxWidth / actualWidth;
                actualHeight = imgRatio * actualHeight;
                actualWidth = maxWidth;
            }
            else
            {
                actualHeight = maxHeight;
                actualWidth = maxWidth;
            }
        }

        let rect = CGRectMake(0, 0, actualWidth, actualHeight)
        UIGraphicsBeginImageContext(rect.size)
        self.drawInRect(rect)
        let image = UIGraphicsGetImageFromCurrentImageContext()
        let imageData = UIImageJPEGRepresentation(image, compression)
        UIGraphicsEndImageContext()

        return imageData! as NSData

    }


}

[NancyZY]

So kind of you, I just wonder why I insert image does not work, I made the class achieve UIImagePickerControllerDelegate , there in
func imagePickerController(picker: UIImagePickerController, didFinishPickingMediaWithInfo info: [String : AnyObject]) like the DominikButz's code , then there no image insert, I try to print some information , the console has no hint. I cannot find the result

[cjwirth]

Did you set you class to be the image picker's delegate? Is the delegate method actually being called?

[DominikButz]

yes, you need to create an instance variable like

let imagePicker = UIImagePickerController()

first and in viewDidLoad :

imagePicker.delegate  = self

use print(...) and check in the console if the function didFinishPickingMediaWithInfo is called.