title: Social Share Cordova Plugin
body: <p>I am working with the <a href="https://github.com/bfcam/phonegap-ios-social-plugin" rel="nofollow noreferrer">Social Share Plugin</a> and <a href="https://github.com/DrewDahlman/ImageFilter" rel="nofollow noreferrer">ImageFilter Plugin</a>.  I have both set up and functioning.  What I am wanting to do is have a picture that I select from my photo library or take with the camera be the one that is shared instead of the predefined image.</p>
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
    &lt;head&gt;
    &lt;title&gt;&lt;/title&gt;
  
      &lt;meta name=&quot;viewport&quot; content=&quot;width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no;&quot; /&gt;
  &lt;meta charset=&quot;utf-8&quot;&gt;
  
  &lt;link rel=&quot;stylesheet&quot; href=&quot;css/style.css&quot;&gt;
  
  &lt;!-- CORE --&gt;
  &lt;script src='js/core/cordova-1.6.0.js'&gt;&lt;/script&gt;
  &lt;script src='js/core/jQuery.js'&gt;&lt;/script&gt;
  
  &lt;!-- PLUGINS --&gt;
  &lt;script src='js/plugins/ImageFilter.js'&gt;&lt;/script&gt;
  &lt;script src='js/core/social.js'&gt;&lt;/script&gt;
      
  &lt;!-- OUR SCRIPTS --&gt;
  &lt;script src='js/init.js'&gt;&lt;/script&gt;
  &lt;script&gt;
      window.plugins.social.available(function(avail) {
                                  if (avail) {
                                  // Show social widgets
                                  } else {
                                  // Social not supported
                                  }
                                  });
      &lt;/script&gt;
  
      
      
    &lt;/head&gt;
    &lt;body onload=&quot;app.bodyLoad()&quot;&gt;
  &lt;div id=&quot;header&quot;&gt;&lt;img src=&quot;images/header.png&quot; width=&quot;100%&quot;&gt;&lt;/div&gt;
  &lt;div id=&quot;wrapper&quot;&gt;
      &lt;div id=&quot;content&quot;&gt;
      
          &lt;!-- BUTTONS --&gt;
          &lt;div id=&quot;buttons&quot;&gt;
              &lt;div class=&quot;btn&quot; id=&quot;camera&quot; onClick=&quot;app.useCamera();&quot;&gt;use camera&lt;/div&gt;
              &lt;div class=&quot;btn&quot; id=&quot;roll&quot; onClick=&quot;app.useRoll();&quot;&gt;use library&lt;/div&gt;
              &lt;div class=&quot;btn&quot; id=&quot;share&quot; onClick=&quot;window.plugins.social.share('', '', 'www/images/filters/stark.png');&quot;&gt;Share&lt;/div&gt;
          &lt;/div&gt;
          &lt;!-- END BUTTONS --&gt;
          
          &lt;!-- IMAGE AREA --&gt;
          &lt;div id=&quot;imageArea&quot;&gt;
              &lt;!-- OUR IMAGE --&gt;
              &lt;div class=&quot;photo&quot;&gt;&lt;/div&gt;
              &lt;!-- FILTERS --&gt;
              &lt;div id=&quot;filters&quot;&gt;
                  &lt;div class=&quot;filter&quot; id=&quot;none&quot; onClick=&quot;filters.none(largeImage);&quot;&gt;
                      &lt;div class=&quot;filterIcon&quot;&gt;&lt;img src=&quot;images/filters/none.png&quot; height=&quot;100%&quot;&gt;&lt;/div&gt;
                      &lt;div class=&quot;filterTitle&quot;&gt;none&lt;/div&gt;
                  &lt;/div&gt;
                  &lt;div class=&quot;filter&quot; id=&quot;sunnySide&quot; onClick=&quot;filters.sunnySide(largeImage);&quot;&gt;
                      &lt;div class=&quot;filterIcon&quot;&gt;&lt;img src=&quot;images/filters/sunnySide.png&quot; height=&quot;100%&quot;&gt;&lt;/div&gt;
                      &lt;div class=&quot;filterTitle&quot;&gt;sunnySide&lt;/div&gt;
                  &lt;/div&gt;
                  &lt;div class=&quot;filter&quot; id=&quot;worn&quot; onClick=&quot;filters.worn(largeImage);&quot;&gt;
                      &lt;div class=&quot;filterIcon&quot;&gt;&lt;img src=&quot;images/filters/worn.png&quot; height=&quot;100%&quot;&gt;&lt;/div&gt;
                      &lt;div class=&quot;filterTitle&quot;&gt;worn&lt;/div&gt;
                  &lt;/div&gt;
                  &lt;div class=&quot;filter&quot; id=&quot;vintage&quot; onClick=&quot;filters.vintage(largeImage);&quot;&gt;
                      &lt;div class=&quot;filterIcon&quot;&gt;&lt;img src=&quot;images/filters/vintage.png&quot; height=&quot;100%&quot;&gt;&lt;/div&gt;
                      &lt;div class=&quot;filterTitle&quot;&gt;vintage&lt;/div&gt;
                  &lt;/div&gt;
                  &lt;div class=&quot;filter&quot; id=&quot;stark&quot; onClick=&quot;filters.stark(largeImage);&quot;&gt;
                      &lt;div class=&quot;filterIcon&quot;&gt;&lt;img src=&quot;images/filters/stark.png&quot; height=&quot;100%&quot;&gt;&lt;/div&gt;
                      &lt;div class=&quot;filterTitle&quot;&gt;stark&lt;/div&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
          &lt;/div&gt;
          &lt;!-- END IMAGE AREA --&gt;
          
          
          &lt;/div&gt;
      &lt;/div&gt;
    &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  <p>Here is the js file.</p>
  <pre><code>    var largeImage;
  
  var app = {
  bodyLoad: function () {
      document.addEventListener(&quot;deviceready&quot;, app.deviceReady, false);
  },
  deviceReady: function () {
      app.init();
  },
  init: function () {
      
  },
  useCamera: function () {
      navigator.camera.getPicture(app.onCameraSuccess, app.onCameraFail, {
          quality: 100,
          destinationType: Camera.DestinationType.FILE_URI,
          sourceType: Camera.PictureSourceType.CAMERA,
          //allowEdit : true,
          encodingType: Camera.EncodingType.JPEG,
          targetWidth: 910,
          targetHeight: 910,
          saveToPhotoAlbum: false
      });
  },
  useRoll: function () {
      navigator.camera.getPicture(app.onCameraSuccess, app.onCameraFail, {
          quality: 100,
          destinationType: Camera.DestinationType.FILE_URI,
          sourceType: Camera.PictureSourceType.PHOTOLIBRARY,
          encodingType: Camera.EncodingType.JPEG,
          targetWidth: 910,
          targetHeight: 910,
          saveToPhotoAlbum: false
      });
  },
  onCameraSuccess: function (imageURI) {
      
      largeImage = imageURI;
      $(&quot;.photo&quot;).html(&quot;&lt;img src='&quot; + imageURI + &quot;'&gt;&quot;);
      $(&quot;.photo&quot;).show();
      
  },
  onCameraFail: function (msg) {
      console.log(&quot;ERROR! -&quot; + msg);
  }
  };
  
  var filters = {
  none: function (imageURI) {
      plugins.ImageFilter.none(filters.rendered, {
          image: imageURI,
          save: 'false',
      });
  },
  sunnySide: function (imageURI) {
      plugins.ImageFilter.sunnySide(filters.rendered, {
          image: imageURI,
          save: 'false'
      });
  },
  worn: function (imageURI) {
      plugins.ImageFilter.worn(filters.rendered, {
          image: imageURI,
          save: 'false'
      });
  },
  vintage: function (imageURI) {
      plugins.ImageFilter.vintage(filters.rendered, {
          image: imageURI,
          save: 'false'
      });
  },
  stark: function (imageURI) {
      plugins.ImageFilter.stark(filters.rendered, {
          image: imageURI,
          save: 'false'
      });
  },
  rendered: function (msg) {
      
      $(&quot;.photo&quot;).html(&quot;&lt;img src='&quot; + msg + &quot;'&gt;&quot;);
  }
  }
  </code></pre>
  <p>I am struggling with what parameter I need to use to replace 'www/images/filters/stark.png' to get the image that is loaded in the (div class=&quot;photo&quot;) to be the image that is shared.</p>