TweenLite.defaultEase = Power0.easeNone;
TweenMax.set(".mask1", {transformOrigin:"100% 50%"});
TweenMax.set(".mask2", {transformOrigin:"0% 50%"});
TweenMax.fromTo(".mask1", 2.2, {width:"0px"}, {width:"300px", ease:Power0.easeNone, repeat:-1, repeatDelay:2})
TweenMax.fromTo(".mask2", 2.2, {width:"300px"}, {width:"0px", ease:Power0.easeNone, repeat:-1, repeatDelay:2})
Having different transform origins and using fromTo gets you the result I think you are looking for?