I have a problem when I use TRegEx against long text and the long text is coming from web!, I use Indy to get web page source and after that I use Regex to find links! but the problem that Regex not working as it have to be!
my regex:
'/stream_map=(.[^&]*?)&/i'
source:
const HTTP_RESPONSE_OK = 200;
function GetPage(aURL: string): string;
var
Response: TStringStream;
HTTP: TIdHTTP;
begin
Result := '';
Response := TStringStream.Create('');
try
HTTP := TIdHTTP.Create(nil);
try
HTTP.Get(aURL, Response);
if HTTP.ResponseCode = HTTP_RESPONSE_OK then begin
Result := Response.DataString;
end else begin
// TODO -cLogging: add some logging
end;
finally
HTTP.Free;
end;
finally
Response.Free;
end;
end;
procedure TForm1.Button1Click(Sender: TObject);
var
regex : TRegEx;
exper : string;
result : string;
fmatch : TMatchCollection;
begin
//Edit1.Text = http://www.youtube.com/watch?v=rzADrNmwYI0&feature=player_embedded
Memo1.Text := GetPage(Edit1.Text);
exper := '/stream_map=(.[^&]*?)&/i';
regex := TRegEx.Create(exper);
fmatch := regex.Matches(Memo1.Text); //Memo1.Text = web pagesource
ShowMessage(IntToStr(fmatch.Count));
end;
Memo1.Text contain source code of youtube web page: * I couldn't add the whole source code but this part contain what Regex hae to find*
<!DOCTYPE html>
<html lang="ar" dir="rtl" >
<head>
<script>
var yt = yt || {};yt.timing = yt.timing || {};yt.timing.tick = function(label, opt_time) {var timer = yt.timing['timer'] || {};if(opt_time) {timer[label] = opt_time;}else {timer[label] = new Date().getTime();}yt.timing['timer'] = timer;};yt.timing.info = function(label, value) {var info_args = yt.timing['info_args'] || {};info_args[label] = value;yt.timing['info_args'] = info_args;};yt.timing.info('e', "922401,920704,912806,927201,925706,922403,913546,913556,916805,920201,901451");yt.timing.wff = true;yt.timing.info('an', "");if (document.webkitVisibilityState == 'prerender') {document.addEventListener('webkitvisibilitychange', function() {yt.timing.tick('start');}, false);}yt.timing.tick('start');yt.timing.info('li','0');try {yt.timing['srt'] = window.gtbExternal && window.gtbExternal.pageT() ||window.external && window.external.pageT;} catch(e) {}if (window.chrome && window.chrome.csi) {yt.timing['srt'] = Math.floor(window.chrome.csi().pageT);}if (window.msPerformance && window.msPerformance.timing) {yt.timing['srt'] = window.msPerformance.timing.responseStart - window.msPerformance.timing.navigationStart;} </script>
<script>var yt = yt || {};yt.preload = {};yt.preload.counter_ = 0;yt.preload.start = function(src) {var img = new Image();var counter = ++yt.preload.counter_;yt.preload[counter] = img;img.onload = img.onerror = function () {delete yt.preload[counter];};img.src = src;img = null;};yt.preload.start("http:\/\/o-o---preferred---sn-apo3qvuoxuxbt-j5pe---v1---lscache6.c.youtube.com\/crossdomain.xml");yt.preload.start("http:\/\/o-o---preferred---sn-apo3qvuoxuxbt-j5pe---v1---lscache6.c.youtube.com\/generate_204?ip=41.130.156.126\u0026upn=kcE458sG0pI\u0026sparams=algorithm%2Cburst%2Ccp%2Cfactor%2Cid%2Cip%2Cipbits%2Citag%2Csource%2Cupn%2Cexpire\u0026fexp=922401%2C920704%2C912806%2C927201%2C925706%2C922403%2C913546%2C913556%2C916805%2C920201%2C901451\u0026mt=1353328753\u0026ms=au\u0026algorithm=throttle-factor\u0026burst=40\u0026ipbits=8\u0026itag=34\u0026sver=3\u0026signature=714099358414A97203AB854A2368EA03C52C15B1.5A59DBDF733A57676263F529B85080CCB60567C0\u0026mv=m\u0026source=youtube\u0026expire=1353352420\u0026key=yt1\u0026factor=1.25\u0026cp=U0hUSFNQUF9HSkNONF9LSlRFOjNUWG00ckdxbFE2\u0026id=af3003acd9b0608d");</script><title>Katyusha - Original Version - YouTube</title><link rel="search" type="application/opensearchdescription+xml" href="http://www.youtube.com/opensearch?locale=ar_EG" title="بØØ« الÙيديو ÙÙŠ YouTube"><link rel="icon" href="http://s.ytimg.com/yts/img/favicon-vfldLzJxy.ico" type="image/x-icon"><link rel="shortcut icon" href="http://s.ytimg.com/yts/img/favicon-vfldLzJxy.ico" type="image/x-icon"> <link rel="icon" href="//s.ytimg.com/yts/img/favicon_32-vflWoMFGx.png" sizes="32x32"><link rel="canonical" href="/watch?v=rzADrNmwYI0"><link rel="alternate" media="handheld" href="http://m.youtube.com/watch?v=rzADrNmwYI0"><link rel="alternate" media="only screen and (max-width: 640px)" href="http://m.youtube.com/watch?v=rzADrNmwYI0"><link rel="shortlink" href="http://youtu.be/rzADrNmwYI0"> <meta name="title" content="Katyusha - Original Version">
<meta name="description" content="Dedicate to friend "Jenya". Sung by Lidiya Ruslanova.">
<meta name="keywords" content="katusha, Lidiya, katyusha, Ruslanova">
<link rel="alternate" type="application/json+oembed" href="http://www.youtube.com/oembed?url=http%3A%2F%2Fwww.youtube.com%2Fwatch%3Fv%3DrzADrNmwYI0&format=json" title="Katyusha - Original Version">
<link rel="alternate" type="text/xml+oembed" href="http://www.youtube.com/oembed?url=http%3A%2F%2Fwww.youtube.com%2Fwatch%3Fv%3DrzADrNmwYI0&format=xml" title="Katyusha - Original Version">
<meta property="og:url" content="http://www.youtube.com/watch?v=rzADrNmwYI0">
<meta property="og:title" content="Katyusha - Original Version">
<meta property="og:description" content="Dedicate to friend "Jenya". Sung by Lidiya Ruslanova.">
<meta property="og:type" content="video">
<meta property="og:image" content="http://i3.ytimg.com/vi/rzADrNmwYI0/mqdefault.jpg">
<meta property="og:video" content="http://www.youtube.com/v/rzADrNmwYI0?version=3&autohide=1">
<meta property="og:video:type" content="application/x-shockwave-flash">
<meta property="og:video:width" content="480">
<meta property="og:video:height" content="360">
<meta property="og:site_name" content="YouTube">
<meta property="fb:app_id" content="87741124305">
<meta name="twitter:card" value="player">
<meta name="twitter:site" value="#youtube">
<meta name="twitter:player" value="https://www.youtube.com/embed/rzADrNmwYI0">
<meta property="twitter:player:width" content="480">
<meta property="twitter:player:height" content="360">
<link id="css-3848904683" rel="stylesheet" href="http://s.ytimg.com/yts/cssbin/www-core-rtl-vflG11Gbd.css">
<script>
yt.setConfig({
'VIDEO_ID': "rzADrNmwYI0" });
yt.setAjaxToken('watch_actions_ajax', "");
if (window['gYouTubePlayerReady']) {
yt.registerGlobal('gYouTubePlayerReady');
}
</script>
<script>
yt = yt || {};
yt.playerConfig = {"assets": {"css_actions": "http:\/\/s.ytimg.com\/yts\/cssbin\/www-player-actions-vflJeCcsD.css", "html": "\/html5_player_template", "css": "http:\/\/s.ytimg.com\/yts\/cssbin\/www-player-vfltPqzFT.css", "js": "http:\/\/s.ytimg.com\/yts\/jsbin\/html5player-vflfytLU0.js"}, "url": "http:\/\/s.ytimg.com\/yts\/swfbin\/watch_as3-vfle2krMl.swf", "min_version": "8.0.0", "args": {"is_html5_mobile_device": false, "fexp": "909713,914071,901460,922401,920704,912806,927201,925706,922403,913546,913556,916805,920201,901451", "ptk": "youtube_none", "enablecsi": "1", "allow_embed": 1, "rvs": "view_count=125%2C985\u0026feature_type=fvwp\u0026author=ulaghchi\u0026title=Katyusha\u0026length_seconds=158\u0026featured=1\u0026id=5w0k75NuOdk,view_count=106%2C966\u0026author=etalococh\u0026length_seconds=145\u0026id=h-qTrtu6uS4\u0026title=Joseph+Stalin+dancing+Katyusha,view_count=170%2C742\u0026author=lekutski\u0026length_seconds=289\u0026id=Y-wFYkGvX2c\u0026title=%D0%AE.%D0%A8%D0%B5%D0%B2%D1%87%D1%83%D0%BA-%22%D0%A0%D0%B0%D1%81%D0%BA%D0%B8%D0%BD%D1%83%D0%BB%D0%BE%D1%81%D1%8C+%D0%BC%D0%BE%D1%80%D0%B5+%D1%88%D0%B8%D1%80%D0%BE%D0%BA%D0%BE%22,view_count=2%2C053%2C337\u0026author=Vdovkinanadya\u0026length_seconds=127\u0026id=llS6p4YzsaY\u0026title=%D0%9A%D0%B0%D1%82%D1%8E%D1%88%D0%B0+%28%D0%9A%D0%BE%D0%BD%D1%86%D0%B5%D1%80%D1%82+%22%D0%9F%D0%B5%D1%81%D0%BD%D0%B8+%D0%B2%D0%BE%D0%B5%D0%BD%D0%BD%D1%8B%D1%85+%D0%BB%D0%B5%D1%82%22%29,view_count=553%2C516\u0026author=OdessaNLA\u0026length_seconds=230\u0026id=65RhWzrbqPA\u0026title=%D0%9F%D0%B5%D1%81%D0%BD%D0%B8+%D0%BF%D0%BE%D0%B1%D0%B5%D0%B4%D1%8B+2010+%22%D0%9A%D0%B0%D1%82%D1%8E%D1%88%D0%B0%22+%28%D0%9D%D0%A3+%22%D0%9E%D0%AE%D0%90%22%29,view_count=418%2C833\u0026author=myevro\u0026length_seconds=125\u0026id=rnt-7MWxb8M\u0026title=%D0%9A%D0%B0%D1%82%D1%8E%D1%88%D0%B0-%D0%9C%D0%B0%D1%80%D0%B8%D0%BD%D0%B0+%D0%94%D0%B5%D0%B2%D1%8F%D1%82%D0%BE%D0%B2%D0%B0+%D0%B8+%D0%9A%D0%B0%D1%82%D1%8F+%D0%A0%D1%8F%D0%B1%D0%BE%D0%B2%D0%B0.,view_count=97%2C149\u0026author=muratshawn\u0026length_seconds=196\u0026id=C1KFoJfpiao\u0026title=Katyusha+%2F+%D0%9A%D0%B0%D1%82%D1%8E%D1%88%D0%B0+-+Turkish+%26+Russian+Pride+together%21%21%21,view_count=291%2C062\u0026author=%D0%A2%D0%B0%D1%82%D1%8C%D1%8F%D0%BD%D0%B0+%D0%91%D1%83%D0%BB%D0%B0%D0%BD%D0%BE%D0%B2%D0%B0\u0026length_seconds=139\u0026id=-w-0sFmBo0I\u0026title=%22%D0%9A%D0%B0%D1%82%D1%8E%D1%88%D0%B0%22+%D0%A2.%D0%91%D1%83%D0%BB%D0%B0%D0%BD%D0%BE%D0%B2%D0%B0+%28live%29,view_count=126%2C353\u0026author=SovietMusicLover\u0026length_seconds=175\u0026id=MqgHn27h60c\u0026title=Katyusha+English+Version+%28with+lyrics%29,view_count=645%2C699\u0026author=stmnf\u0026length_seconds=103\u0026id=n0kgtHRGkjk\u0026title=%D0%9A%D0%B0%D1%82%D1%8E%D1%88%D0%B0+%D0%BD%D0%B0+%D0%BA%D0%B8%D1%82%D0%B0%D0%B9%D1%81%D0%BA%D0%BE%D0%BC+%28Katyusha+-+Chinese+version%29,view_count=141%2C603\u0026author=joseeash\u0026length_seconds=181\u0026id=nEUqmMNf6dk\u0026title=%D0%9B%D0%B8%D0%B4%D0%B8%D1%8F+%D0%A0%D1%83%D1%81%D0%BB%D0%B0%D0%BD%D0%BE%D0%B2%D0%B0+%D0%9E%D0%BA%D1%80%D0%B0%D1%81%D0%B8%D0%BB%D1%81%D1%8F+%D0%BC%D0%B5%D1%81%D1%8F%D1%86+%D0%B1%D0%B0%D0%B3%D1%80%D1%8F%D0%BD%D1%86%D0%B5%D0%BC,view_count=161%2C453\u0026author=olegtimes\u0026length_seconds=179\u0026id=bmaRGOa0mz4\u0026title=%D0%A0%D0%B0%D1%81%D0%BA%D0%B8%D0%BD%D1%83%D0%BB%D0%BE%D1%81%D1%8C+%D0%BC%D0%BE%D1%80%D0%B5+%D1%88%D0%B8%D1%80%D0%BE%D0%BA%D0%BE...%28%D0%BF%D0%B0%D0%BC%D1%8F%D1%82%D0%B8+%D0%BC%D0%BE%D0%B5%D0%B3%D0%BE+%D0%B4%D0%B5%D0%B4%D0%B0%29", "vq": "auto", "account_playback_token": "", "autohide": "2", "csi_page_type": "watch5", "keywords": "katusha,Lidiya,katyusha,Ruslanova", "cr": "EG", "fmt_list": "43\/640x360\/99\/0\/0,34\/640x360\/9\/0\/115,18\/640x360\/9\/0\/115,5\/320x240\/7\/0\/0,36\/320x240\/99\/0\/0,17\/176x144\/99\/0\/0", "title": "Katyusha - Original Version", "length_seconds": 178, "feature": "player_embedded", "enablejsapi": 1, "plid": "AATO2QkpPQoh4PMK", "tmi": "1", "watch_xlb": "http:\/\/s.ytimg.com\/yts\/xlbbin\/watch-strings-ar_EG-vfl8x8AOb.xlb", "sdetail": "f:player_embedded,", "url_encoded_fmt_stream_map": "itag=43\u0026url=http%3A%2F%2Fo-o---preferred---sn-apo3qvuoxuxbt-j5pe---v24---lscache6.c.youtube.com%2Fvideoplayback%3Fupn%3DsKXkbQaXRVo%26sparams%3Dcp%252Cid%252Cip%252Cipbits%252Citag%252Cratebypass%252Csource%252Cupn%252Cexpire%26fexp%3D909713%252C914071%252C901460%252C922401%252C920704%252C912806%252C927201%252C925706%252C922403%252C913546%252C913556%252C916805%252C920201%252C901451%26key%3Dyt1%26expire%3D1353356020%26itag%3D43%26ipbits%3D8%26sver%3D3%26ratebypass%3Dyes%26mt%3D1353331452%26ip%3D41.130.156.126%26mv%3Dm%26source%3Dyoutube%26ms%3Dau%26cp%3DU0hUSFNQVF9HSkNONF9LSlhBOnlKX3RvWnNqQmpJ%26id%3Daf3003acd9b0608d\u0026type=video%2Fwebm%3B+codecs%3D%22vp8.0%2C+vorbis%22\u0026fallback_host=tc.v24.cache6.c.youtube.com\u0026sig=49ABA8D1BEFB1DFC8A34723985E46C52C2345836.C90B5EB1FC04705DC80908D5DEB69355D9F27BF3\u0026quality=medium,itag=34\u0026url=http%3A%2F%2Fo-o---preferred---sn-apo3qvuoxuxbt-j5pe---v1---lscache6.c.youtube.com%2Fvideoplayback%3Fupn%3DsKXkbQaXRVo%26sparams%3Dalgorithm%252Cburst%252Ccp%252Cfactor%252Cid%252Cip%252Cipbits%252Citag%252Csource%252Cupn%252Cexpire%26fexp%3D909713%252C914071%252C901460%252C922401%252C920704%252C912806%252C927201%252C925706%252C922403%252C913546%252C913556%252C916805%252C920201%252C901451%26expire%3D1353356020%26algorithm%3Dthrottle-factor%26burst%3D40%26ip%3D41.130.156.126%26itag%3D34%26sver%3D3%26key%3Dyt1%26mt%3D1353331452%26mv%3Dm%26source%3Dyoutube%26ms%3Dau%26ipbits%3D8%26factor%3D1.25%26cp%3DU0hUSFNQVF9HSkNONF9LSlhBOnlKX3RvWnNqQmpJ%26id%3Daf3003acd9b0608d\u0026type=video%2Fx-flv\u0026fallback_host=tc.v1.cache6.c.youtube.com\u0026sig=4FEAD1755F1E057F47DDD670D4AA35BD73A23F26.3FA850543DC5016C9ED03B1C46CFF1A010CB6A66\u0026quality=medium,itag=18\u0026url=http%3A%2F%2Fo-o---preferred---sn-apo3qvuoxuxbt-j5pe---v5---lscache1.c.youtube.com%2Fvideoplayback%3Fupn%3DsKXkbQaXRVo%26sparams%3Dcp%252Cid%252Cip%252Cipbits%252Citag%252Cratebypass%252Csource%252Cupn%252Cexpire%26fexp%3D909713%252C914071%252C901460%252C922401%252C920704%252C912806%252C927201%252C925706%252C922403%252C913546%252C913556%252C916805%252C920201%252C901451%26key%3Dyt1%26expire%3D1353356020%26itag%3D18%26ipbits%3D8%26sver%3D3%26ratebypass%3Dyes%26mt%3D1353331452%26ip%3D41.130.156.126%26mv%3Dm%26source%3Dyoutube%26ms%3Dau%26cp%3DU0hUSFNQVF9HSkNONF9LSlhBOnlKX3RvWnNqQmpJ%26id%3Daf3003acd9b0608d\u0026type=video%2Fmp4%3B+codecs%3D%22avc1.42001E%2C+mp4a.40.2%22\u0026fallback_host=tc.v5.cache1.c.youtube.com\u0026sig=C4E2F657F55A18E9295DD24FFA840608B4253F93.45B3E0816ADA603DC572C59D9E8586AA4385C009\u0026quality=medium,itag=5\u0026url=http%3A%2F%2Fo-o---preferred---sn-apo3qvuoxuxbt-j5pe---v17---lscache8.c.youtube.com%2Fvideoplayback%3Fupn%3DsKXkbQaXRVo%26sparams%3Dalgorithm%252Cburst%252Ccp%252Cfactor%252Cid%252Cip%252Cipbits%252Citag%252Csource%252Cupn%252Cexpire%26fexp%3D909713%252C914071%252C901460%252C922401%252C920704%252C912806%252C927201%252C925706%252C922403%252C913546%252C913556%252C916805%252C920201%252C901451%26expire%3D1353356020%26algorithm%3Dthrottle-factor%26burst%3D40%26ip%3D41.130.156.126%26itag%3D5%26sver%3D3%26key%3Dyt1%26mt%3D1353331452%26mv%3Dm%26source%3Dyoutube%26ms%3Dau%26ipbits%3D8%26factor%3D1.25%26cp%3DU0hUSFNQVF9HSkNONF9LSlhBOnlKX3RvWnNqQmpJ%26id%3Daf3003acd9b0608d\u0026type=video%2Fx-flv\u0026fallback_host=tc.v17.cache8.c.youtube.com\u0026sig=3B3F89080069727F65C5EE42121051AF7807BD78.D028F451AF0CD7C6D2C31D4B66DBB6748B2C63C3\u0026quality=small,itag=36\u0026url=http%3A%2F%2Fo-o---preferred---sn-apo3qvuoxuxbt-j5pe---v8---lscache6.c.youtube.com%2Fvideoplayback%3Fupn%3DsKXkbQaXRVo%26sparams%3Dalgorithm%252Cburst%252Ccp%252Cfactor%252Cid%252Cip%252Cipbits%252Citag%252Csource%252Cupn%252Cexpire%26fexp%3D909713%252C914071%252C901460%252C922401%252C920704%252C912806%252C927201%252C925706%252C922403%252C913546%252C913556%252C916805%252C920201%252C901451%26expire%3D1353356020%26algorithm%3Dthrottle-factor%26burst%3D40%26ip%3D41.130.156.126%26itag%3D36%26sver%3D3%26key%3Dyt1%26mt%3D1353331452%26mv%3Dm%26source%3Dyoutube%26ms%3Dau%26ipbits%3D8%26factor%3D1.25%26cp%3DU0hUSFNQVF9HSkNONF9LSlhBOnlKX3RvWnNqQmpJ%26id%3Daf3003acd9b0608d\u0026type=video%2F3gpp%3B+codecs%3D%22mp4v.20.3%2C+mp4a.40.2%22\u0026fallback_host=tc.v8.cache6.c.youtube.com\u0026sig=903B784F3388B39AC124E407088589455737ECAD.5D858C302F1A4098EBD26D28175F1528A3950733\u0026quality=small,itag=17\u0026url=http%3A%2F%2Fo-o---preferred---sn-apo3qvuoxuxbt-j5pe---v5---lscache6.c.youtube.com%2Fvideoplayback%3Fupn%3DsKXkbQaXRVo%26sparams%3Dalgorithm%252Cburst%252Ccp%252Cfactor%252Cid%252Cip%252Cipbits%252Citag%252Csource%252Cupn%252Cexpire%26fexp%3D909713%252C914071%252C901460%252C922401%252C920704%252C912806%252C927201%252C925706%252C922403%252C913546%252C913556%252C916805%252C920201%252C901451%26expire%3D1353356020%26algorithm%3Dthrottle-factor%26burst%3D40%26ip%3D41.130.156.126%26itag%3D17%26sver%3D3%26key%3Dyt1%26mt%3D1353331452%26mv%3Dm%26source%3Dyoutube%26ms%3Dau%26ipbits%3D8%26factor%3D1.25%26cp%3DU0hUSFNQVF9HSkNONF9LSlhBOnlKX3RvWnNqQmpJ%26id%3Daf3003acd9b0608d\u0026type=video%2F3gpp%3B+codecs%3D%22mp4v.20.3%2C+mp4a.40.2%22\u0026fallback_host=tc.v5.cache6.c.youtube.com\u0026sig=A7B5DE52FA6841DE8EAFE6E0EED1EC6C16BACBDA.5E93B423ACC4C8DC5408F2679B77BA62DFEA5C27\u0026quality=small", "watermark": ",http:\/\/s.ytimg.com\/yts\/img\/watermark\/youtube_watermark-vflHX6b6E.png,http:\/\/s.ytimg.com\/yts\/img\/watermark\/youtube_hd_watermark-vflAzLcD6.png", "timestamp": 1353331463, "storyboard_spec": "http:\/\/i3.ytimg.com\/sb\/rzADrNmwYI0\/storyboard3_L$L\/$N.jpg|48#27#100#10#10#0#default#GqaoUNyA6isSrQNPTbprBE4NYTM|60#45#90#10#10#2000#M$M#sFARy7zZvYQwYsVsY9bympTRZxk|120#90#90#5#5#2000#M$M#k65LP1yOXoOjotxpIEPQsPkjIz4|240#180#90#3#3#2000#M$M#hIi9MEmhmAlaVEse_eDZ0NquQ6g", "showpopout": 1, "hl": "ar_EG", "no_get_video_log": "1", "endscreen_module": "http:\/\/s.ytimg.com\/yts\/swfbin\/endscreen-vflF6koqY.swf", "referrer": null, "video_id": "rzADrNmwYI0", "sendtmp": "1", "sk": "nQCANo-fhqpEFHwwW1pEcr11kG4XFL4MC", "pltype": "contentugc", "t": "vjVQa1PpcFNl5t5AGz5yeB9bo6aI4nZA-J_9nSI_sz8=", "loudness": -18.3199996948}, "url_v9as2": "http:\/\/s.ytimg.com\/yts\/swfbin\/cps-vflYNIJaJ.swf", "params": {"allowscriptaccess": "always", "allowfullscreen": "true", "bgcolor": "#000000"}, "attrs": {"id": "movie_player"}, "url_v8": "http:\/\/s.ytimg.com\/yts\/swfbin\/cps-vflYNIJaJ.swf", "html5": false};
yt.setConfig({
'EMBED_HTML_TEMPLATE': "\u003ciframe width=\"__width__\" height=\"__height__\" src=\"__url__\" frameborder=\"0\" allowfullscreen\u003e\u003c\/iframe\u003e",
'EMBED_HTML_URL': "http:\/\/www.youtube.com\/embed\/__videoid__"
});
yt.setMsg('FLASH_UPGRADE', "\u003cdiv class=\"yt-alert yt-alert-default yt-alert-error yt-alert-player\"\u003e \u003cdiv class=\"yt-alert-icon\"\u003e\n \u003cimg s\u0072c=\"\/\/s.ytimg.com\/yts\/img\/pixel-vfl3z5WfW.gif\" class=\"icon master-sprite\" alt=\"\u0631\u0645\u0632 \u0627\u0644\u062a\u0646\u0628\u064a\u0647\"\u003e\n \u003c\/div\u003e\n\u003cdiv class=\"yt-alert-buttons\"\u003e\u003c\/div\u003e\u003cdiv class=\"yt-alert-content\" role=\"alert\"\u003e \u003cspan class=\"yt-alert-vertical-trick\"\u003e\u003c\/span\u003e\n \u003cdiv class=\"yt-alert-message\"\u003e\n \u064a\u062c\u0628 \u062a\u0631\u0642\u064a\u0629 Adobe Flash Player \u0644\u0645\u0634\u0627\u0647\u062f\u0629 \u0647\u0630\u0627 \u0627\u0644\u0641\u064a\u062f\u064a\u0648. \u003cbr\u003e \u003ca href=\"http:\/\/get.adobe.com\/flashplayer\/\"\u003e\u0646\u0632\u0651\u0644\u0647 \u0645\u0646 Adobe.\u003c\/a\u003e\n \u003c\/div\u003e\n\u003c\/div\u003e\u003c\/div\u003e");
yt.setMsg('PLAYER_FALLBACK', "\u003cdiv class=\"yt-alert yt-alert-default yt-alert-error yt-alert-player\"\u003e \u003cdiv class=\"yt-alert-icon\"\u003e\n \u003cimg s\u0072c=\"\/\/s.ytimg.com\/yts\/img\/pixel-vfl3z5WfW.gif\" class=\"icon master-sprite\" alt=\"\u0631\u0645\u0632 \u0627\u0644\u062a\u0646\u0628\u064a\u0647\"\u003e\n \u003c\/div\u003e\n\u003cdiv class=\"yt-alert-buttons\"\u003e\u003c\/div\u003e\u003cdiv class=\"yt-alert-content\" role=\"alert\"\u003e \u003cspan class=\"yt-alert-vertical-trick\"\u003e\u003c\/span\u003e\n \u003cdiv class=\"yt-alert-message\"\u003e\n \u064a\u0644\u0632\u0645 \u0623\u0646 \u064a\u0643\u0648\u0646 \u0647\u0646\u0627\u0643 \u0645\u062a\u0635\u0641\u062d \u064a\u062a\u0648\u0641\u0631 \u0628\u0647 \u0645\u0634\u063a\u0644 Adobe Flash \u0623\u0648 HTML5 \u0644\u062a\u0634\u063a\u064a\u0644 \u0627\u0644\u0641\u064a\u062f\u064a\u0648. \u003cbr\u003e \u003ca href=\"http:\/\/get.adobe.com\/flashplayer\/\"\u003e\u0627\u0644\u062d\u0635\u0648\u0644 \u0639\u0644\u0649 \u0623\u062d\u062f\u062b \u0645\u0634\u063a\u0644 Flash\u003c\/a\u003e \u003cbr\u003e \u003ca href=\"\/html5\"\u003e\u0645\u0632\u064a\u062f \u0645\u0646 \u0627\u0644\u0645\u0639\u0644\u0648\u0645\u0627\u062a \u062d\u0648\u0644 \u0627\u0644\u062a\u0631\u0642\u064a\u0629 \u0625\u0644\u0649 \u0645\u062a\u0635\u0641\u062d HTML5\u003c\/a\u003e\n \u003c\/div\u003e\n\u003c\/div\u003e\u003c\/div\u003e");
yt.setMsg('QUICKTIME_FALLBACK', "\u003cdiv class=\"yt-alert yt-alert-default yt-alert-error yt-alert-player\"\u003e \u003cdiv class=\"yt-alert-icon\"\u003e\n \u003cimg s\u0072c=\"\/\/s.ytimg.com\/yts\/img\/pixel-vfl3z5WfW.gif\" class=\"icon master-sprite\" alt=\"\u0631\u0645\u0632 \u0627\u0644\u062a\u0646\u0628\u064a\u0647\"\u003e\n \u003c\/div\u003e\n\u003cdiv class=\"yt-alert-buttons\"\u003e\u003c\/div\u003e\u003cdiv class=\"yt-alert-content\" role=\"alert\"\u003e \u003cspan class=\"yt-alert-vertical-trick\"\u003e\u003c\/span\u003e\n \u003cdiv class=\"yt-alert-message\"\u003e\n \u064a\u0644\u0632\u0645 \u0628\u0631\u0646\u0627\u0645\u062c Adobe Flash Player \u0623\u0648 QuickTime \u0644\u062a\u0634\u063a\u064a\u0644 \u0627\u0644\u0641\u064a\u062f\u064a\u0648. \u003cbr\u003e \u003ca href=\"http:\/\/get.adobe.com\/flashplayer\/\"\u003e\u0627\u0644\u062d\u0635\u0648\u0644 \u0639\u0644\u0649 \u0623\u062d\u062f\u062b \u0625\u0635\u062f\u0627\u0631 \u0645\u0646 Flash Player\u003c\/a\u003e \u003cbr\u003e \u003ca href=\"http:\/\/www.apple.com\/quicktime\/download\/\"\u003e\u0627\u0644\u062d\u0635\u0648\u0644 \u0639\u0644\u0649 \u0623\u062d\u062f\u062b \u0625\u0635\u062f\u0627\u0631 \u0645\u0646 QuickTime\u003c\/a\u003e\n \u003c\/div\u003e\n\u003c\/div\u003e\u003c\/div\u003e");
(function() {
var forceUpdate = yt.www.watch.player.updateConfig(yt.playerConfig);
var youTubePlayer = yt.player.update('watch-player', yt.playerConfig,
forceUpdate, gYouTubePlayerReady);
yt.setConfig({'PLAYER_REFERENCE': youTubePlayer});
})();
</script>
</script>
<script>
yt.setMsg({
'ADDTO_WATCH_LATER_ADDED': "\u062a\u0645\u062a \u0627\u0644\u0625\u0636\u0627\u0641\u0629",
'ADDTO_WATCH_LATER_ERROR': "\u062e\u0637\u0623"
});
</script>
<script>
if (window.yt.timing) {yt.timing.tick("js_foot");} </script>
<div id="debug">
</div>
</body>
</html>
the matches count show "0"
It looks to me as though you are using the wrong syntax for your regex.
'/stream_map=(.[^&]*?)&/i'
looks like Perl regex syntax.
For Delphi's TRegEx you need to remove the slash delimiters and specify case insensitivity through an options parameter. Like this:
regex := TRegEx.Create('stream_map=(.[^&]*?)&', [roIgnoreCase]);
Related
I am trying to style (color) my leaflet polyline (geojson object showing a trail) based on some conditions. The condition is the average speed, which is calculated from a timestamp that comes with the geojson. Thanks to this forum, I managed to show the line as expected. But the styling does not work.
The average speed of the example data ist 1.3 km/h, thus the line should be red. But it is blue.
Maybe that is because the polyline is created before the velocitiy was calculated.
But adding that code line later does not work because the calculation of the distance depends on that polyline. Or what ist my mistake?
Any hints how to get that styling right?
Thanks in advance.
Here is a simplified code;
<html>
<head>
<!-- Load leaflet library and use its styling css -->
<link rel="stylesheet" href="https://unpkg.com/leaflet#1.7.1/dist/leaflet.css" />
<script src="https://unpkg.com/leaflet#1.7.1/dist/leaflet.js"> </script>
<script src = "https://ajax.googleapis.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script>
<script src = "http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
<script type="text/javascript" src="js/measuredDistance.js"></script>
<link rel="stylesheet" href="style.css" type="text/css" /> //not included
</head>
<body>
<div class="pagewrapper">
<div id="map"></div>
<button onclick="myFunction()">Click me</button>
</div>
<script type="text/javascript">
//add map and set view
var map = L.map('map').setView([48.8,13.03],6);
// add background layer "opentopomap"
var backgroundlayer = L.tileLayer ('https://{s}.tile.opentopomap.org/{z}/{x}/{y}.png');
map.addLayer(backgroundlayer);
//get geojson data
var geojsondata = {
"type": "FeatureCollection",
"features": [
{
"type": "Feature",
"id": 1,
"geometry": {
"type": "Point",
"coordinates": [
13.0908549980086,
47.812500986468
]
},
"properties": {
"Source": 2,
"ele": 399.0844,
"time": 1174816297000,
"ObjectId": 2
}
},
{
"type": "Feature",
"id": 2,
"geometry": {
"type": "Point",
"coordinates": [
13.0408219980085,
47.812484986468
]
},
"properties": {
"Source": 2,
"ele": 397.1617,
"time": 1174826310000,
"ObjectId": 2
}
}]};
function myFunction() {
visualizer.sendDataToMap(geojsondata)
};
//---------------------------------------------
//styling function for polyline, depending on velocitiy of track
function restylemap(feature) {
if(velocitiy <= 4) {
return{color: "red"}
}
else if (velocitiy > 4 && velocitiy <= 20) {return
{color:"green"}
}
else {return {color:"grey"}}
};
// function to calculate total time of track
function sum(array) {
return Number(array[array.length - 1] - Number(array[0]));
};
//----------------------------------------------------
var visualizer = {};
visualizer.sendDataToMap = function (jsonData) {{
L.geoJson(jsonData
)};
// read coordinates from geojson object
const latlngs = jsonData.features.map((feature) => [
feature.geometry.coordinates[1],
feature.geometry.coordinates[0]
]);
//access time information from geojson object
const time = jsonData.features.map((feature) => [
feature.properties.time
]);
//create polyline from coordinates and style according to function "restylemap"
var linie = L.polyline(latlngs, {style:restylemap});
//calculate total distance of polyline
var lengthInMeters = linie.measuredDistance();
//remove non numeric chars ("km") from string
var distance = lengthInMeters.replace(/[^\d.-]/g, '');
//calculate time between first and last timestamp
var elapstime = (sum(time) / 1000 / 60 / 60);
//Calculate average speed on track
var velocitiy = distance/elapstime
//add polyline to map
linie.addTo(map);
// center map to polyline
map.fitBounds(linie.getBounds());
//avespeed.toFixed(1)
alert("Velocitiy: "+velocitiy.toFixed(1)+" km/h");
};
</script>
</body>
</html>
Like you said, you add the style to early. Change your code to:
//styling function for polyline, depending on velocitiy of track
function restylemap(velocitiy) { // <-------- NEW
if(velocitiy <= 4) {
return{color: "red"}
}
else if (velocitiy > 4 && velocitiy <= 20) {return
{color:"green"}
}
else {return {color:"grey"}}
};
//create polyline from coordinates and style according to function "restylemap"
var linie = L.polyline(latlngs); // <-------- NEW
//calculate total distance of polyline
var lengthInMeters = linie.measuredDistance();
//remove non numeric chars ("km") from string
var distance = lengthInMeters.replace(/[^\d.-]/g, '');
//calculate time between first and last timestamp
var elapstime = (sum(time) / 1000 / 60 / 60);
//Calculate average speed on track
var velocitiy = distance/elapstime
// Change line color
linie.setStyle(restylemap(velocitiy)); // <-------- NEW
//add polyline to map
linie.addTo(map);
I have a react app that built through npm run build. GET and POST request from the front-end to back-end gives status 200 but I am getting a weird error that may cause all the images from my files not appear on localhost.
I have already tried to reinstall node, added 'manifest_version': 2 as it is the current version of chrome manifest.
Click here for inspect screenshot
Manifest: Line: 1, column: 1, Syntax error.
Below is my index.html file
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1,shrink-to-fit=no">
<meta name="theme-color" content="#000000">
<link rel="manifest" href="/manifest.json">
<link rel="shortcut icon" href="/favicon.ico">
<title>Django React Boilerplate</title>
<link href="/static/css/2.87ad9c80.chunk.css" rel="stylesheet">
</head>
<body>
<noscript>You need to enable JavaScript to run this app.</noscript>
<div id="root"></div>
<script>
! function(l) {
function e(e) {
for (var r, t, n = e[0], o = e[1], u = e[2], f = 0, i = []; f < n.length; f++) t = n[f], p[t] && i.push(p[t][0]), p[t] = 0;
for (r in o) Object.prototype.hasOwnProperty.call(o, r) && (l[r] = o[r]);
for (s && s(e); i.length;) i.shift()();
return c.push.apply(c, u || []), a()
}
function a() {
for (var e, r = 0; r < c.length; r++) {
for (var t = c[r], n = !0, o = 1; o < t.length; o++) {
var u = t[o];
0 !== p[u] && (n = !1)
}
n && (c.splice(r--, 1), e = f(f.s = t[0]))
}
return e
}
var t = {},
p = {
1: 0
},
c = [];
function f(e) {
if (t[e]) return t[e].exports;
var r = t[e] = {
i: e,
l: !1,
exports: {}
};
return l[e].call(r.exports, r, r.exports, f), r.l = !0, r.exports
}
f.m = l, f.c = t, f.d = function(e, r, t) {
f.o(e, r) || Object.defineProperty(e, r, {
enumerable: !0,
get: t
})
}, f.r = function(e) {
"undefined" != typeof Symbol && Symbol.toStringTag && Object.defineProperty(e, Symbol.toStringTag, {
value: "Module"
}), Object.defineProperty(e, "__esModule", {
value: !0
})
}, f.t = function(r, e) {
if (1 & e && (r = f(r)), 8 & e) return r;
if (4 & e && "object" == typeof r && r && r.__esModule) return r;
var t = Object.create(null);
if (f.r(t), Object.defineProperty(t, "default", {
enumerable: !0,
value: r
}), 2 & e && "string" != typeof r)
for (var n in r) f.d(t, n, function(e) {
return r[e]
}.bind(null, n));
return t
}, f.n = function(e) {
var r = e && e.__esModule ? function() {
return e.default
} : function() {
return e
};
return f.d(r, "a", r), r
}, f.o = function(e, r) {
return Object.prototype.hasOwnProperty.call(e, r)
}, f.p = "/";
var r = window.webpackJsonp = window.webpackJsonp || [],
n = r.push.bind(r);
r.push = e, r = r.slice();
for (var o = 0; o < r.length; o++) e(r[o]);
var s = n;
a()
}([])
</script>
<script src="/static/js/2.e5ee7667.chunk.js"></script>
<script src="/static/js/main.9f678b97.chunk.js"></script>
</body>
</html>
It appeared that the error starts from the beginning of my index.html file.
I had the same problem when I moved my Codesandbox project to local. In my case, there was no manifest.json file in the public folder.
I solved it by adding the default manifest.json that create-react-app generates:
{
"short_name": "CloseWeUI",
"name": "The front-end UI for CloseWe",
"icons": [
{
"src": "favicon.ico",
"sizes": "64x64 32x32 24x24 16x16",
"type": "image/x-icon"
}
],
"start_url": ".",
"display": "standalone",
"theme_color": "#000000",
"background_color": "#ffffff"
}
I had the same problem ("Manifest: Line: 1, column: 1, Syntax error") while running my app (react app with react-router, published with AWS Amplify).
My problem was fixed by doing the following:
In "Rewrites and redirects" make sure you have "json" in the following line:
Source address:
</^[^.]+$|\.(?!(css|gif|ico|json|jpg|js|png|txt|svg|woff|ttf)$)([^.]+$)/>
Target address:
/index.html
Type:
200 (Rewrite)
The above solution also fixed problem with non-working react-router links in production as it was reported in the following thread:
React Router DOM not working correctly on Amplify Console AWS
Here is to my personal project with fixed manifest.json issue, as well as non-working react-router issue (a link to some random code snippet - fibonacci memoization in this case):
https://everhint.com/hintlink/algorithms/javascript/codesnippet/fibonacci/memoization/fibonacci-memoization/d01f275b-6acf-4f26-9448-e99939c9d4b7.html
As I added password protection to a developer-only page of mine, I suddenly started getting "manifest line 1 column 1 syntax error" (manifest.json) errors.
I am also using AWS Amplify as well as Create React App to build my app. I tried all of the solutions above, but nothing helped.
The one thing that did help was adding one property to the link to my manifest.json in my index.html.
To solve this, I added crossorigin="use-credentials"*, like below:
<link crossorigin="use-credentials" rel="manifest" href="./manifest.json" />
VladS answer solved my problem.
I was also using AWS Amplify Console for my Angular App.
You can also have a look at the Content-Type in the response headers of your manifest file. It should NOT be text/html. If it is, you have to change your server configuration to serve the file in the right Content-Type. More info
Angular names the Manifest-File "manifest.webmanifest".
So I also had to go to the "Rewrites and redirects" Page in the Amplify Console and edited the existing entry like so:
Source address
</^[^.]+$|\.(?!(css|gif|ico|jpg|js|png|txt|svg|woff|ttf|json|webmanifest)$)([^.]+$)/>
(I added json|webmanifest)
React create app
If you got this error while working with React Create App you should go to:
public/index.html find <link rel="manifest" href="%PUBLIC_URL%/manifest.json" /> and remove it.
you should put
"homepage": "",
on your packaje.json.
it worked for me.
in line 7 of index.html just delete this
<link rel="manifest" href="/manifest.json">
the error is coming from this line cause you delete manifest.json but you forget this line so you have an error in your console
i put the manifest.json on the public file with the index.html
This error message seems to be a catchall error for a lot of issues. For me the issue was using http-server to load the page. When I switched to the project root directory and ran npm start , the project loaded without issues and any changes.
I deleted this line from my index.html file in the public directory
<link rel="manifest" href="/manifest.json">
Trying to use Chart.js to plot a bar chart.
When I feed it the data below, it will display all the whole numbers first, and then the decimals. I tried converting the keys to floats as you can see, however, i'm still getting the same thing.
Does anyone have any ideas why the plot shows whole numbers first?
<html>
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.0/Chart.bundle.js"></script>
<!-- <script src="app.js"></script> -->
</head>
<body>
<h1>
Snapshot Chart
</h1>
<div class="chart" height="400" width="400">
<canvas id="myChart" width="400" height="400"></canvas>
<script>
var snapshot = {
5590.0: 28.89890034,
5590.22: 28.84890034,
5590.92: 24.14890034,
5591.5: 24.12890034,
5592.38: 24.11230034,
5594.13: 24.09590034,
5595.0: 23.99590034,
5595.1: 23.98586534,
5595.14: 23.88586534,
5595.16: 18.58586534,
5595.52: 17.45586534,
5595.53: 17.43946534,
5596.62: 16.33946534,
5598.98: 16.32286534,
5598.99: 16.27015,
5599.66: 16.25355,
5599.76: 11.45355,
5599.78: 11.43715,
5600.0: 11.33715,
5600.52: 11.32715,
5601.06: 11.31715,
5601.7: 11.30055,
5603.41: 11.28415,
5604.18: 11.26775,
5604.19: 6.64775,
5604.26: 5.60775,
5604.27: 5.59115,
5605.61: 4.55115,
5606.95: 4.53455,
5606.96: 4.51795,
5607.47: 3.91795,
5608.14: 3.90155,
5608.18: 3.55855,
5608.29: 2.31158,
5608.3: 2.25158,
5611.0: 2.15158,
5613.94: 2.14046,
5613.95: 0.358,
5616.64: 0.06,
5616.79: 0.01,
5616.8: 0.06122924,
5616.82: 0.11689229,
5616.84: 0.16749515,
5616.85: 0.21349783,
5617.2: 0.25531852,
5617.21: 0.2933374,
5617.5: 0.6153374,
5617.86: 0.64990008,
5617.88: 0.68132075,
5617.89: 0.70988505,
5617.9: 0.73585264,
5617.91: 0.75945958,
5617.92: 0.78092048,
5618.2: 0.8004182,
5619.31: 2.5834882,
5619.39: 3.1865882,
5620.0: 3.1965882,
5620.84: 3.21431504,
5620.87: 3.23043038,
5620.89: 3.24508079,
5620.92: 3.25839944,
5620.93: 3.27050732,
5620.94: 3.28151466,
5620.97: 3.29152636,
5623.44: 20.06906733,
5623.46: 24.54906733,
5626.85: 25.79761733,
5627.0: 25.80790432,
5628.13: 30.79790432,
5631.01: 30.81790432,
5631.19: 31.67990432,
5631.59: 32.39463287,
5632.38: 32.50142845,
5632.78: 32.57805041,
5632.81: 36.27805041,
5633.18: 36.32805041,
5636.37: 40.44805041,
5636.48: 40.46805041,
5637.0: 40.47805041,
5639.27: 40.48805041,
5639.8: 55.75838641,
5639.82: 59.55838641,
5640.0: 59.56838641,
5640.66: 59.57838641,
5640.69: 59.58838641,
5640.84: 59.61058741,
5640.85: 59.62058741,
5641.01: 59.64058741,
5641.55: 59.65058741,
5641.62: 59.66058741,
5643.01: 59.72548741,
5643.28: 63.46548741,
5645.0: 63.96528741,
5646.15: 65.77811741,
}
var keyArray = Object.keys(snapshot)
for (var i = 0; i < keyArray.length; i++) {
keyArray[i] = parseFloat(keyArray[i])
}
var valueArray = Object.values(snapshot)
for (var i = 0; i < valueArray.length; i++) {
valueArray[i] = parseFloat(valueArray[i])
}
var ctx = document.getElementById("myChart");
var myChart = new Chart(ctx, {
type: 'bar',
data: {
labels: keyArray,
datasets: [{
label: 'Volume',
data: valueArray,
backgroundColor: CanvasGradient,
borderWidth: 1
}]
},
options: {
scales: {
yAxes: [{
ticks: {
beginAtZero:true,
}
}]
}
}
});
</script>
</div>
</body>
</html>
Changing the data format slightly seems to solve the problem. If you add single quotes around the x-axis values then it should display in the correct order.
So the snapshot variable would become:
var snapshot = {
'5590.0': 28.89890034,
'5590.22': 28.84890034,
'5590.92': 24.14890034,
'5591.5': 24.12890034,
'5592.38': 24.11230034,
'5594.13': 24.09590034,
'5595.0': 23.99590034,
'5595.1': 23.98586534,
'5595.14': 23.88586534,
'5595.16': 18.58586534,
'5595.52': 17.45586534,
'5595.53': 17.43946534,
'5596.62': 16.33946534,
'5598.98': 16.32286534,
'5598.99': 16.27015,
'5599.66': 16.25355,
'5599.76': 11.45355,
'5599.78': 11.43715,
'5600.0': 11.33715,
'5600.52': 11.32715,
'5601.06': 11.31715,
'5601.7': 11.30055,
'5603.41': 11.28415,
'5604.18': 11.26775,
'5604.19': 6.64775,
'5604.26': 5.60775,
'5604.27': 5.59115,
'5605.61': 4.55115,
'5606.95': 4.53455,
'5606.96': 4.51795,
'5607.47': 3.91795,
'5608.14': 3.90155,
'5608.18': 3.55855,
'5608.29': 2.31158,
'5608.3': 2.25158,
'5611.0': 2.15158,
'5613.94': 2.14046,
'5613.95': 0.358,
'5616.64': 0.06,
'5616.79': 0.01,
'5616.8': 0.06122924,
'5616.82': 0.11689229,
'5616.84': 0.16749515,
'5616.85': 0.21349783,
'5617.2': 0.25531852,
'5617.21': 0.2933374,
'5617.5': 0.6153374,
'5617.86': 0.64990008,
'5617.88': 0.68132075,
'5617.89': 0.70988505,
'5617.9': 0.73585264,
'5617.91': 0.75945958,
'5617.92': 0.78092048,
'5618.2': 0.8004182,
'5619.31': 2.5834882,
'5619.39': 3.1865882,
'5620.0': 3.1965882,
'5620.84': 3.21431504,
'5620.87': 3.23043038,
'5620.89': 3.24508079,
'5620.92': 3.25839944,
'5620.93': 3.27050732,
'5620.94': 3.28151466,
'5620.97': 3.29152636,
'5623.44': 20.06906733,
'5623.46': 24.54906733,
'5626.85': 25.79761733,
'5627.0': 25.80790432,
'5628.13': 30.79790432,
'5631.01': 30.81790432,
'5631.19': 31.67990432,
'5631.59': 32.39463287,
'5632.38': 32.50142845,
'5632.78': 32.57805041,
'5632.81': 36.27805041,
'5633.18': 36.32805041,
'5636.37': 40.44805041,
'5636.48': 40.46805041,
'5637.0': 40.47805041,
'5639.27': 40.48805041,
'5639.8': 55.75838641,
'5639.82': 59.55838641,
'5640.0': 59.56838641,
'5640.66': 59.57838641,
'5640.69': 59.58838641,
'5640.84': 59.61058741,
'5640.85': 59.62058741,
'5641.01': 59.64058741,
'5641.55': 59.65058741,
'5641.62': 59.66058741,
'5643.01': 59.72548741,
'5643.28': 63.46548741,
'5645.0': 63.96528741,
'5646.15': 65.77811741,
}
Hope this helps.
I am using QTextEdit widget to display a nicely formatted chat-window to a user. To keep it basic for testing I use the following format for my html:
QString style = is_message_sent_by_myself ?
"background-color:rgb(255,255,255);font-size:14px;color:rgb(10,10,10);" :
"background-color:rgb(249,86,79);font-size:14px;color:rgb(255,255,255);";
QString format("<div style='%1'> %2 </div> <div style='font-size:3px;'> </div>");
QString text_to_append = format.arg(style).arg(message.toHtmlEscaped());
QTextEdit->append(text_to_append)
This works nice when creating the html myself but when generating it with QT 5.6 by using QTextEdit->append(text_to_be_append) I get a different (and even inconsistent) result.
For a start, when running the above snippet once, the following html is generated (got it with QTextEdit->toHtml()):
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN" "http://www.w3.org/TR/REC-html40/strict.dtd">
<html>
<head>
<meta name="qrichtext" content="1" />
<style type="text/css">
p, li { white-space: pre-wrap; }
</style>
</head>
<body style=" font-family:'MS Shell Dlg 2'; font-size:8.25pt; font-weight:400; font-style:normal;">
<p style=" margin-top:0px; margin-bottom:0px; margin-left:0px; margin-right:0px; -qt-block-indent:0; text-indent:0px; background-color:#ffffff;"><span style=" font-size:14px; color:#0a0a0a; background-color:#ffffff;">Some message </span></p>
<p style=" margin-top:0px; margin-bottom:0px; margin-left:0px; margin-right:0px; -qt-block-indent:0; text-indent:0px;"><span style=" font-size:3px;"> </span></p>
</body>
</html>
(which looks perfect for the first message)
But after executing the code again, an inconsistency occurs:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN" "http://www.w3.org/TR/REC-html40/strict.dtd">
<html>
<head>
<meta name="qrichtext" content="1" />
<style type="text/css">
p, li { white-space: pre-wrap; }
</style>
</head>
<body style=" font-family:'MS Shell Dlg 2'; font-size:8.25pt; font-weight:400; font-style:normal;">
<p style=" margin-top:0px; margin-bottom:0px; margin-left:0px; margin-right:0px; -qt-block-indent:0; text-indent:0px; background-color:#ffffff;"><span style=" font-size:14px; color:#0a0a0a; background-color:#ffffff;">Some message </span></p>
<p style=" margin-top:0px; margin-bottom:0px; margin-left:0px; margin-right:0px; -qt-block-indent:0; text-indent:0px;"><span style=" font-size:3px;"> </span></p>
<p style=" margin-top:0px; margin-bottom:0px; margin-left:0px; margin-right:0px; -qt-block-indent:0; text-indent:0px;"><span style=" font-size:14px; color:#ffffff; background-color:#f9564f;">Some message </span></p>
<p style=" margin-top:0px; margin-bottom:0px; margin-left:0px; margin-right:0px; -qt-block-indent:0; text-indent:0px;"><span style=" font-size:3px;"> </span></p>
</body>
</html>
(which looks like this, but should look like this)
As you can see, the background color attribute is missing in the third <p> tag. Where as the background-color attribute is present in the first <p> tag. The same code is repeated over and over and subsequent calls keep generating <p> tags without a background-color attribute.
Why is this happening and how could I work around this issue?
I'm using QT 5.6 with the Visual Studio 2015 Add-on (unofficial one) on Windows 10 x64.
This is how I am creating the QTextEdit box (including all other components for a tabPage):
PAChatClientUI::PAChatClientUI(QTabWidget* tabs_container, QObject *parent)
: QObject(parent), tabs_container_(tabs_container)
{
QString suffix = QString::number((size_t)this, 16);
tab_ = new QWidget();
tab_->setObjectName("tab_" + suffix);
tab_grid_layout_ = new QGridLayout(tab_);
tab_grid_layout_->setSpacing(6);
tab_grid_layout_->setContentsMargins(11, 11, 11, 11);
tab_grid_layout_->setObjectName("tab_grid_layout_" + suffix);
chat_container_grid_ = new QGridLayout();
chat_container_grid_->setSpacing(6);
chat_container_grid_->setObjectName("chat_container_grid_" + suffix);
chat_container_button_grid_ = new QHBoxLayout();
chat_container_button_grid_->setSpacing(6);
chat_container_button_grid_->setObjectName("chat_container_button_grid_" + suffix);
chat_manager_bot_remove_ = new QPushButton(tab_);
chat_manager_bot_remove_->setObjectName("chat_manager_bot_remove_" + suffix);
chat_manager_bot_remove_->setMinimumSize(QSize(119, 23));
chat_container_button_grid_->addWidget(chat_manager_bot_remove_);
chat_manager_keep_chat_ = new QPushButton(tab_);
chat_manager_keep_chat_->setObjectName("chat_manager_keep_chat_" + suffix);
chat_manager_keep_chat_->setMinimumSize(QSize(119, 23));
chat_container_button_grid_->addWidget(chat_manager_keep_chat_);
chat_manager_end_chat_ = new QPushButton(tab_);
chat_manager_end_chat_->setObjectName("chat_manager_end_chat_" + suffix);
chat_manager_end_chat_->setMinimumSize(QSize(118, 23));
chat_container_button_grid_->addWidget(chat_manager_end_chat_);
chat_manager_send_ = new QPushButton(tab_);
chat_manager_send_->setObjectName("chat_manager_send_" + suffix);
chat_manager_send_->setMinimumSize(QSize(119, 23));
chat_container_button_grid_->addWidget(chat_manager_send_);
chat_container_grid_->addLayout(chat_container_button_grid_, 3, 0, 1, 1);
chat_box_text_messages_ =
//new QPlainTextEdit(tab_);
new QTextEdit(tab_);
chat_box_text_messages_->setObjectName("chat_box_text_messages_" + suffix);
chat_box_text_messages_->setMinimumSize(QSize(495, 178));
chat_container_grid_->addWidget(chat_box_text_messages_, 1, 0, 1, 1);
chat_box_text_input_message_ = new QLineEdit(tab_);
chat_box_text_input_message_->setObjectName("chat_box_text_input_message_" + suffix);
chat_box_text_input_message_->setMinimumSize(QSize(495, 20));
chat_box_text_input_message_->setMaximumSize(QSize(16777215, 16777215));
chat_container_grid_->addWidget(chat_box_text_input_message_, 2, 0, 1, 1);
tab_grid_layout_->addLayout(chat_container_grid_, 0, 0, 1, 1);
chat_manager_bot_remove_->setText("Remove Bot");
chat_manager_keep_chat_->setText("Keep Chat");
chat_manager_end_chat_->setText("End Chat");
chat_manager_send_->setText("Send");
QPalette p = chat_box_text_messages_->palette();
p.setColor(QPalette::Active, QPalette::Base, Qt::black);
p.setColor(QPalette::Inactive, QPalette::Base, Qt::black);
chat_box_text_messages_->setPalette(p);
chat_box_text_messages_->setWordWrapMode(QTextOption::WordWrap);
chat_box_text_messages_->setReadOnly(true);
//Add nice html messages:
AddMessage(true, "Some message");
AddMessage(false, "Some message");
AddMessage(true, "Some message");
AddMessage(false, "Some message");
tabs_container_->addTab(tab_, " 6");
}
void PAChatClientUI::AddMessage(bool me, const QString& message)
{
QString style = me ?
"background-color:rgb(255,255,255);font-size:14px;color:rgb(10,10,10);" :
"background-color:rgb(249,86,79);font-size:14px;color:rgb(255,255,255);";
QString format("<div style='%1'> %2 </div> <div style='font-size:3px;'> </div>");
QString safe_msg = format.arg(style).arg(message.toHtmlEscaped());
qDebug() << "Writing: " << safe_msg;
chat_box_text_messages_->append(safe_msg);
qDebug() << "HTML: " << chat_box_text_messages_->toHtml();
}
Edit:
I have tried to edit the code according to the answers and also to one of my thoughts, yielding the following two results for the code:
void PAChatClientUI::AddMessage(bool me, const QString& message)
{
QString style = me ?
"background-color:rgb(255,255,255);font-size:14px;color:rgb(10,10,10);" :
"background-color:rgb(249,86,79);font-size:14px;color:rgb(255,255,255);";
QString format("<div style='%1'> %2 </div> <div style='font-size:3px;'> </div>");
QString safe_msg = format.arg(style).arg(message.toHtmlEscaped());
qDebug() << "Writing: " << safe_msg;
QTextCursor cursor = chat_box_text_messages_->textCursor();
if (!cursor.atStart())
cursor.insertBlock();
cursor.insertHtml(safe_msg);
qDebug() << "HTML: " << chat_box_text_messages_->toHtml();
}
This produced exactly the same effect, so to avoid QT "converting" the HTML, I tought I can just write what QT writes, but exactly the same issue happens:
void PAChatClientUI::AddMessage(bool me, const QString& message)
{
QString bgColor = me ? "ffffff" : "f9564f";
QString txtColor = me ? "0a0a0a" : "ffffff";
QString to_append("\
<p style=\" margin-top:0px; margin-bottom:0px; margin-left:0px; margin-right:0px; -qt-block-indent:0; text-indent:0px; background-color:#" + bgColor + ";\"><span style=\" font-size:14px; color:#" + txtColor + "; background-color:#" + bgColor + ";\">" + message.toHtmlEscaped() + " </span></p>\
<p style=\" margin-top:0px; margin-bottom:0px; margin-left:0px; margin-right:0px; -qt-block-indent:0; text-indent:0px;\"><span style=\" font-size:3px;\"> </span></p>\
");
chat_box_text_messages_->append(to_append);
}
Edit: This suggestion doesn't solve the issue; it's left here for completeness.
QTextEdit does some RichText magic to the underlying QTextDocument when appending text blocks. Try explicitely creating a block and use QTextCursor::insertHtml() instead of QTextEdit::append():
QTextCursor cursor = m_ui.entryText->textCursor();
if(!cursor.atStart())
cursor.insertBlock();
cursor.insertHtml(htmlText);
This should also improve performance for large amounts of text.
I was able to reproduce this behaviour when packing two <div> into a common call to append(); splitting them into two calls results in the expected appearance (using Qt 4.7 here).
I want to put the values for every country on map but the chart has some limitations for like 6 to 7 countries. How do I create a custom chart?
https://developers.google.com/chart/interactive/docs/gallery/geochart
You might find following example useful, it has a long list of countries that do map to geochart values...
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<script type="text/javascript">
google.charts.load('upcoming', {'packages':['geochart']});
google.charts.setOnLoadCallback(drawRegionsMap);
function drawRegionsMap() {
var data = google.visualization.arrayToDataTable([
['Country', 'Value'],
["Bhutan",1],
["Democratic Republic of the Congo",1],
["Liechtenstein",1],
["Maldives",1],
["Sudan",1],
["Zimbabwe",1],
["Mauritania",1],
["Mozambique",1],
["Nigeria",1],
["Swaziland",1],
["Tanzania",1],
["Iraq",1],
["Guyana",1],
["Namibia",1],
["Senegal",1],
["Turkmenistan",1],
["Afghanistan",1],
["Andorra",1],
["Fiji",1],
["Gabon",1],
["Uzbekistan",1],
["Cameroon",1],
["Cuba",1],
["Faroe Islands",1],
["El Salvador",1],
["Caribbean",1],
["Ethiopia",1],
["Mongolia",1],
["Puerto Rico",1],
["Samoa",1],
["Myanmar",1],
["Nicaragua",1],
["Seychelles",1],
["Tajikistan",1],
["Dominican Republic",1],
["Guinea",1],
["Barbados",1],
["CI",1],
["Laos",1],
["Libya",1],
["Panama",1],
["Bahrain",1],
["Benin",1],
["Ghana",1],
["Haiti",1],
["Montenegro",1],
["Somalia",1],
["Syria",1],
["Ecuador",1],
["Honduras",1],
["Madagascar",1],
["Papua New Guinea",1],
["Tunisia",1],
["Angola",1],
["Botswana",1],
["Cyprus",1],
["Algeria",1],
["Bahamas",1],
["New Caledonia",1],
["Uganda",1],
["Yemen",1],
["Zambia",2],
["Antarctica",2],
["Paraguay",2],
["Jamaica",2],
["Palestine",2],
["Bolivia",2],
["Bosnia and Herzegovina",2],
["Vietnam",2],
["Kenya",2],
["Luxembourg",2],
["Niger",2],
["Kuwait",2],
["Hawaii",2],
["Scotland",2],
["Cambodia",2],
["Uruguay",2],
["Kyrgyzstan",2],
["Saudi Arabia",2],
["Indonesia",2],
["Azerbaijan",2],
["United Arab Emirates",2],
["Mauritius",2],
["Morocco",2],
["Albania",3],
["South Korea",3],
["Kazakhstan",3],
["Macedonia",3],
["Venezuela",3],
["Taiwan",3],
["Qatar",3],
["Jordan",3],
["Iceland",3],
["Guatemala",3],
["Costa Rica",3],
["Hong Kong",3],
["San Marino",3],
["Colombia",4],
["Moldova",4],
["Armenia",4],
["Malta",4],
["Nepal",5],
["Lebanon",5],
["Malaysia",5],
["Serbia",5],
["Peru",5],
["Trinidad and Tobago",5],
["Lithuania",5],
["Estonia",6],
["Georgia",6],
["Iran",7],
["Chile",7],
["Latvia",7],
["Thailand",7],
["Egypt",7],
["Slovenia",8],
["Mexico",8],
["Belarus",8],
["Slovakia",9],
["Sri Lanka",9],
["Croatia",9],
["Philippines",9],
["Bangladesh",10],
["Turkey",10],
["Romania",13],
["Italy",14],
["South Africa",15],
["Hungary",15],
["Pakistan",16],
["Portugal",16],
["Ukraine",19],
["Greece",19],
["Oman",19],
["Argentina",19],
["Singapore",20],
["Bulgaria",20],
["Japan",25],
["Czech Republic ",26],
["Ireland",26],
["China",27],
["Finland",32],
["Brazil",33],
["Norway",34],
["Austria",35],
["Denmark",40],
["Belgium",41],
["New Zealand",42],
["Spain",43],
["Switzerland",57],
["Russia",62],
["Poland",65],
["Israel",73],
["Sweden",91],
["Netherlands",118],
["France",119],
["Australia",158],
["Canada",206],
["India",234],
["Germany",308],
["United Kingdom",614],
["United States",983],
["Unknown",1050],
]);
var options = {
colorAxis: {values: [1, 10, 100, 1000], colors: ['green', '#D1E231', 'orange' ,'red'],},
backgroundColor: '#81d4fa',
datalessRegionColor: '#999',
defaultColor: '#f5f5f5',
};
var chart = new google.visualization.GeoChart(document.getElementById('geochart-colors'));
chart.draw(data, options);
};
</script>
<body>
<div id="geochart-colors" style="width: 600px; height: 225px;"></div>
</body>
Hope this saves you some time.