title: Parsing HTML hpple replacing [element raw]
body: <p>I'm having an issue using hpple library for parsing an HTML content.</p>
  
  <p>I want to use textkit to display a good html content.</p>
  
  <p>So here's my issue.</p>
  
  <p>I want to replace all image or video tags with my own tag and then instert it with textkit on an UITextview.</p>
  
  <p>My alogorithm :</p>
  
  <p>I parse my html content on <p>
  I test with a regex if [the element raw] contains a  of a  with a regex</p>
  
  <p>if it does, i extract the "src" of my image of video and create a personalized string</p>
  
  <p>Then i want to replace the entire [element raw] with my new string</p>
  
  <p>So for example :</p>
  
  <pre><code>&lt;p&gt;
      &lt;img src="blablabla.jpg" /&gt;
  &lt;/p&gt;
  </code></pre>
  
  <p>will look like : </p>
  
  <pre><code>\IMG\blablabla.jpg
  </code></pre>
  
  <p>Then I remove all the HTML tags using a regex</p>
  
  <p><strong>My problem is when i want to replace the [element raw] with my new tag "\IMG\blablabla.jpg"</strong></p>
  
  <p><strong>The regex I use</strong></p>
  
  <pre><code>#define REGEX_IMG_CONTENT           @"&lt;img[^&gt;]+src=\"([^\"&gt;]+)\""
  #define REGEX_IFRAME_CONTENT        @"&lt;iframe[^&gt;]+src=\"([^\"]+).*?&lt;/iframe&gt;"
  #define REGEX_ALL_BALISE            @"&lt;(?:\"[^\"]*\"['\"]*|'[^']*'['\"]*|[^'\"&gt;])+&gt;"
  </code></pre>
  
  <p><strong>Initializing my custom NSTextstorage</strong></p>
  
  <pre><code>_textStorage                   = [[HTMLTextStorage alloc]init];
  
  NSDictionary  *attrs           = @{NSFontAttributeName:[UIFont preferredFontForTextStyle:UIFontTextStyleBody]};
  NSAttributedString *attrString = [[NSAttributedString alloc] initWithString:[self.textStorage formatedHTMLStringWithString:self.post.wpContent] attributes:attrs];
  </code></pre>
  
  <p><strong>Formatting my HTML String with my own tags</strong></p>
  
  <pre><code>- (NSString *)formatedHTMLStringWithString:(NSString *)string {
  
      NSData   *tutorialsHtmlData         = [string dataUsingEncoding:NSUTF8StringEncoding];
      TFHpple  *tutorialsParser           = [TFHpple hppleWithHTMLData:tutorialsHtmlData];
      NSString *tutorialsXpathQueryString = @"//p";
      NSArray  *tutorialsNodes            = [tutorialsParser searchWithXPathQuery:tutorialsXpathQueryString];
  
      for (TFHppleElement *element in tutorialsNodes) {
  
          NSString *imageRegexString = REGEX_IMG_CONTENT;
          NSString *videoRegexString = REGEX_IFRAME_CONTENT;
  
          [self formatElement:element withRegexString:imageRegexString andInitialString:string];
          [self formatElement:element withRegexString:videoRegexString andInitialString:string];
      }
  
      NSError *error                   = nil;
      NSRange range                    = NSMakeRange(0, string.length);
      NSString *htmlBalisesRegexString = REGEX_ALL_BALISE;
      NSRegularExpression *reg         = [NSRegularExpression regularExpressionWithPattern:htmlBalisesRegexString options:0 error:&amp;error];
      NSString *finalString            = [reg stringByReplacingMatchesInString:string options:0 range:range withTemplate:@""];
  
      return finalString;
  }
  
  - (void)formatElement:(TFHppleElement *)element withRegexString:(NSString *)regexString andInitialString:(NSString *)initialString{
  
      NSString *raw            = [[element raw] stringByDecodingHTMLEntities];
      NSError *error           = nil;
      NSRange range            = NSMakeRange(0, raw.length);
      NSRegularExpression *reg = [NSRegularExpression regularExpressionWithPattern:regexString options:0 error:&amp;error];
      NSArray *matches         = [reg matchesInString:raw options:0 range:range];
  
      if (matches.count != 0) {
  
          NSLog(@"initialString : %@",initialString);
          NSLog(@"Paragraph contains regex : %@",raw);
  
          NSArray *firstNode    = [element children];
          TFHppleElement *child = firstNode[0];
  
          if ([child hasChildren]) child = [child children][0];
  
          [self handleAllRegexFormatWithInitialString:initialString raw:raw child:child andRegexString:regexString];
  
      }
  }
  
  - (void)handleAllRegexFormatWithInitialString:(NSString *)initialString raw:(NSString *)raw child:(TFHppleElement *)child andRegexString:(NSString *)regexString {
  
      if ([regexString isEqualToString:REGEX_IMG_CONTENT]) initialString = [self formatedStringForChild:child withRaw:raw andInitialString:initialString andTag:@"IMG"];
  
      else if ([regexString isEqualToString:REGEX_IFRAME_CONTENT]) initialString = [self formatedStringForChild:child withRaw:raw andInitialString:initialString andTag:@"VIDEO"];
  
  }
  
  - (NSString *)formatedStringForChild:(TFHppleElement *)child withRaw:(NSString *)raw andInitialString:(NSString *)initialString andTag:(NSString *)tag {
  
      NSString *string                 = @"";
      NSDictionary *attributes         = [child attributes];
      NSString *replacementImageString = [NSString stringWithFormat:@"\\%@\\%@",tag,[attributes objectForKey:@"src"]];
      NSRange range                    = [initialString rangeOfString:raw];
  
      NSLog(@"Range : %@",NSStringFromRange(range));
  
      if (range.location != NSNotFound) string = [initialString stringByReplacingOccurrencesOfString:raw withString:replacementImageString];
  
      return string;
  }
  </code></pre>
  
  <p><strong>In this method, my lenght range is alway equal to 0</strong></p>
  
  <p>Here an example of what i get : </p>
  
  <p><strong>The initial html content</strong></p>
  
  <pre><code>initialString : &lt;p style="text-align: center;"&gt;
  &lt;a href="http://www.tuxboard.com/cet-artiste-dessine-en-negatif"&gt;
  &lt;img class="alignnone size-medium wp-image-150233" alt="dessin negatif 640x398 Cet artiste dessine en négatif" src="http://www.tuxboard.com/photos/2013/12/dessin-negatif-640x398.jpg" width="640" height="398" title="Cet artiste dessine en négatif" /&gt;
  &lt;/a&gt;
  &lt;/p&gt;
  &lt;p&gt;
  &lt;span id="more-150230"&gt;&lt;/span&gt;&lt;br /&gt;
  Réaliser des dessins hyperréalistes, c’est déjà assez costaud, mais savoir les faire &lt;strong&gt;en négatif&lt;/strong&gt; se révèle être un exploit que l’artiste malaisien &lt;strong&gt;Brian Lai&lt;/strong&gt; maitrise avec perfection.&lt;/p&gt;
  &lt;p&gt;Voici un exemple. D’un côté, le dessin comme on le verrait à l’œil nu, de l’autre côté, quand il est passé en négatif.&lt;/p&gt;
  &lt;p style="text-align: center;"&gt;
  &lt;a href="http://www.tuxboard.com/photos/2013/12/negatif-dessin.jpg"&gt;
  &lt;img class="alignnone size-full wp-image-150234" alt="negatif dessin Cet artiste dessine en négatif" src="http://www.tuxboard.com/photos/2013/12/negatif-dessin.jpg" width="504" height="729" title="Cet artiste dessine en négatif" /&gt;
  &lt;/a&gt;
  &lt;/p&gt;
  &lt;p style="text-align: center;"&gt;
  &lt;a href="http://www.tuxboard.com/photos/2013/12/art-negatif.jpg"&gt;
  &lt;img class="alignnone size-medium wp-image-150235" alt="art negatif 640x428 Cet artiste dessine en négatif" src="http://www.tuxboard.com/photos/2013/12/art-negatif-640x428.jpg" width="640" height="428" title="Cet artiste dessine en négatif" /&gt;
  &lt;/a&gt;
  &lt;/p&gt;
  &lt;p&gt;Vous pensez « fake » ? Vous vous trompez. L’artiste a même réalisé une vidéo pour expliquer sa technique.&lt;/p&gt;
  &lt;div id="tuxplayer"&gt;Chargement du player …&lt;/div&gt;
  &lt;p&gt;&lt;script type="text/javascript"&gt;jwplayer("tuxplayer").setup({ flashplayer: "http://medias.tuxboard.com/playerv2.swf", file: "http://medias.tuxboard.com/Brian_Lai_Invert_Drawing.mp4",image: "http://www.tuxboard.com/photos/2013/12/Video-Brian-Lai-negatif.jpg", height: 370,width: '100%', 'plugins': 'sharing-3'});&lt;/script&gt;&lt;/p&gt;
  </code></pre>
  
  <p><strong>The extracted [element raw]</strong></p>
  
  <pre><code>2013-12-19 11:40:50.247 Tuxboard[6279:70b] Paragraph contains regex : 
  &lt;p style="text-align: center;"&gt;
  &lt;a href="http://www.tuxboard.com/cet-artiste-dessine-en-negatif"&gt;
  &lt;img class="alignnone size-medium wp-image-150233" alt="dessin negatif 640x398 Cet artiste dessine en négatif" src="http://www.tuxboard.com/photos/2013/12/dessin-negatif-640x398.jpg" width="640" height="398" title="Cet artiste dessine en négatif"/&gt;
  &lt;/a&gt;
  &lt;/p&gt;
  </code></pre>
  
  <p><strong>The range</strong></p>
  
  <pre><code>2013-12-19 11:40:50.247 Tuxboard[6279:70b] Range : {2147483647, 0}
  </code></pre>
  
  <p><strong>EDIT</strong></p>
  
  <p>I've extracted manually the part that i want my algorithm to extract and matched it with the [element raw] returned by the HTML Parser and it seems that the HTML parser remove so whitespace characters...</p>