Change CAPS lock to Capitalize in CSS - html

I have a sentence coming in that is all in CAPs lock (and can't be changed). That sentence is part of a paragraph, using CSS only (or a little Jquery if you have to). How can I always get the result reliably and across most devices!
Note: I have looked at questions such as this, but they do not cover the multiple sentences factor.
Without change:
THIS IS THE FIRST SENTENCE. And this is the second, as it is from the server.
Desired result:
This is the first sentence. And this is the second...
The CSS I tried was this, but it doesn't work with multiple sentences.
p { text-transform: lowercase;}
p:first-letter {text-transform:capitalize}

Seems like a problem for jQuery. Check this answer for the entire-element capitalization, then you can parse the first sentence by using something like:
var setval = $('#my_paragraph').html();
var firstSentence = setval.substring(0, setval.indexOf('.'));
firstSentence = toProperCase(firstSentence);
var theRest = setval.substring(setval.indexOf('.') + 1);
$('#my_paragraph').html(firstSentence + theRest);

This only a hotfix. If your output ever changes to something different, containing more then only a single dot or even other words starting with an uppercase character, this code will not provide the desired result.
Example:
http://jsfiddle.net/Em2bD/
// grab your text
var firstSentenceText = $('p').text();
// extract the first sentence and make it all lowercase
var firstSentence = firstSentenceText.substr(0, firstSentenceText.indexOf('.')).toLowerCase();
// convert first char to uppercase
var result = firstSentenceText.charAt(0).toUpperCase() + firstSentence.substring(1);
// append the text to what ever you like and append the missing dot.
$('.result').text(result + '.');

Something that comes in mind is by using a bit of jquery. You can find the first period(.) in the paragraph and then you can make the string before it lowercase(you can give it a span with a class/id and have the rules already on css file). You may have to do a bit of googling.

Related

Is there a way to get the character properties in Google Apps Scripts?

I'm trying to get the FOREGROUND_COLOR value of a singular character within a document. I've read the documentation, so far I haven't found a way of getting said value. I understand that the text class can do this; however it only applies to big chunks of text, not singular characters.
You can use getForegroundColor(offset) on a text element and specify a character offset to get the color at a specific position. See https://developers.google.com/apps-script/reference/document/text#getforegroundcoloroffset
For example:
var body = DocumentApp.getActiveDocument().getBody();
var content = body.editAsText();
Logger.log(content.getForegroundColor(7));
will give the color of the 7th character in the document.

Search and replace a variable word

I'm looking for a program which can create a text block with a different variable string every time.
I've tried doing this in certain languages, but I'd rather have a text editor which can do this.
Example: A list of words are chosen to replace a variable in a piece of text, that piece of text is then reprinted for every word.
I like Ice cream.
Ice cream is great.
Don't eat too much Ice cream.
I like Banana.
Banana is great.
Don't eat too much Banana.
I like Apple.
Apple is great.
Don't eat too much Apple.
I tried doing this in a programming language (AS3) but it doesn`t support multi-line strings very well.
What I`m looking for is either a text editor program (for Windows) which can do this, or a AS3 code snippet which can do this. (Which supports multi-line without the need of manually having to put \n everywhere.)
Not sure what to suggest for the multi-line issue - that's just how it is and you have to add \n or <br /> (in HTML text boxes).
As for the replace, that's a straightforward process. Just set up some type of token that you can replace in the text, e.g.
var str:String = "I like {}.\n{} is great.\nDon't eat too much {}.";
Then you can do either:
str.split("{}").join("Banana");
Or:
str.replace(/\{\}/g, "Banana");
The String Class has three handy methods for working with patterns and strings. These three methods are also case sensitive, meaning uppercase and lowercase matter when searching.
match()
search()
replace()
var string1:String = "Hello World!";
var subString:String = "Hell";
trace(string1.match(subString));
trace(string1.search(subString));
trace(string1.replace(subString, "Jell"));
match() method will display the substring if it is found and null if not found. The search() method will give a value of zero( 0 ) if the method finds the substing, and a value of negative one ( -1) if not found. The replace() method will replace the target substring with a new substring if the substring is found. You can also make the value nothing to simply remove an unwanted part of a string.
we can run conditionals like this:
var string1:String = "Hello World!";
var subString:String = "Hell";
if (string1.search(subString) == 0) {
trace(subString + " is in the string, I can now replace it or remove it.");
} else {
trace(subString + " is not in this string.");
}

How do I put two spaces after every period in our HTML?

I need there to be two spaces after every period in every sentence in our entire site (don't ask).
One way to do it is to embark on manually adding a &nbsp after every single period. This will take several hours.
We can't just find and replace every period, because we have concatenations in PHP and other cases where there is a period and then a space, but it's not in a sentence.
Is there a way to do this...and everything still work in Internet Explorer 6?
[edit] - The tricky part is that in the code, there are lines of PHP that include dots with spaces around them like this:
<?php echo site_url('/css/' . $some_name .'.css');?>
I definitely don't want extra spaces to break lines like that, so I would be happy adding two visible spaces after each period in all P tags.
As we all know, HTML collapses white space, but it only does this for display. The extra spaces are still there. So if the source material was created with two spaces after each period, then some of these substitution methods that are being suggested can be made to work reliably - search for "period-space-space" and replace it with something more suituble, like period-space-&emsp14;. Please note that you shouldn't use because it can prevent proper wrapping at margins. (If you're using ragged right, the margin change won't be noticeable as long as you use the the nbsp BEFORE the space.)
You can also wrap each sentence in a span and use the :after selector to add a space and format it to be wide with "word-spacing". Or you can wrap the space between sentences itself in a span and style that directly.
I've written a javascript solution for blogger that does this on the fly, looks for period-space-space, and replaces it with a spanned, styled space that appears wider.
If however your original material doesn't include this sort of thing then you'll have to study up on sentence boundary detection algorithms (which are not so simple), and then modify one to also not trip over PHP code.
You might be able to use the JavaScript split method or regex depending on the scope of the text.
Here's the split method:
var el = document.getElementById("mydiv");
if (el){
el.innerText = el.innerText.split(".").join(".\xA0 ");
}
Test case:
Hello world.Insert spaces after the period.Using the split method.
Result:
Hello world. Insert spaces after the period. Using the split method.
Have you thought using output buffer? ob_start($callback)
Not tested, but if you'll stick this before any output (or betetr yet, offload the function):
<?php
function processDots($buffer)
{
return (str_replace(".", ". ", $buffer));
}
ob_start("processDots");
?>
and add this to end of input:
<?php ob_end_flush(); ?>
Might just work :)
If you're not opposed to a "post processing"/"javascript" solution:
var nodes = $('*').contents().map(function(a, b) {
return (b.nodeType === Node.TEXT_NODE ? b : null);
});
$.each(nodes, function(i,node){
node.data = node.data.replace(/(\.\s)/g, '.\u00A0\u00A0');
});
Using jQuery for the sake of brevity, but not required.
p.s. I saw your comment about not all periods and a space are to be treated equal, but this is about as good as it gets. otherwise, you're going to need a lot better/more bullet-proof approach.
Incorporate something like this into your PHP file:
<?php if (preg_match('/^. [A-Z]$/' || '/^. [A-Z]$/')) { preg_replace('. ', '. '); } ?>
This allows you to search for the beginning of each new sentence as in .spacespaceA-Z, or .spaceA-Z and then replaces that with . space. [note: Capital letter is not replaced]

Surrounding text with tag and populating tag

I have several lines of text, in them there is a word or words that are capitalized like this:
Hello HOW ARE YOU good to see you
I am FINE
Is there a tool that can go through the text and surround all those capitalized with the HTML anchor text?
and
I guess more difficultly, also populate the href with uncapitalized, space(s) removed version of that capitalized text?
Any help on one or both questions is appreciated.
It took me a while, but here it is in javascript: http://jsfiddle.net/RdJ4E/4/
I'm sure you will find the way hot to tune the code. Good luck!
Is this a beginning? Matching all uppercased words is trivial with regex, and with providing the String.replace method with a callback function instead of a string you can do whatever you want with the matched string.
myString.replace(/(\b[A-Z\s]+\b)/g, function(result, match){
var stripped = encodeURI(result.trim().toLowerCase());
return ' '+result.trim()+' ';
});
http://jsfiddle.net/mwxnC/2/

Regex for html style attribute

Trying to get a regex that I can get a style attribute value from the example below should explain my issue.
source: font-size:11pt;font-color:red;text-align:left;
want to say give me ..
font-size and returns 11pt
font-colour and returns red
text-align and returns left
Can someone point me in the right direction
Thanks
Lee
This question reminded me of a Jeff Atwood blog post, Parsing Html The Cthulhu Way. This isn't exactly the same question, but its the same sentiment. Don't parse CSS with regular expressions! There's tons of libraries out there to do this for you.
Logically you'd want:
[exact phrase] + 1 colon + 0 or more white space characters + 0 or more characters up to the first semicolon or closing quote.
I think this will get you headed in the right direction:
font-size[:][\s]*[^;'"]*
Gotchas:
the closing quote might be single or double and there may be a valid quote within (ie, quoting background image urls, for instance)
this is all dependent on the styles not being written in shorthand
var regex = new Regex(#"([\w-]+)\s*:\s*([^;]+)");
var match = regex.Match("font-size:11pt;font-color:red;text-align:left;");
while (match.Success)
{
var key = match.Groups[1].Value;
var value = match.Groups[2].Value;
Console.WriteLine("{0} : {1}", key, value);
match = match.NextMatch();
}
Edit: This is not supposed to be a 'complete' solution. It probably does the job for the 80% of the cases, and as ever the last 20% would be magnitudes more expensive ;-)